JavaScript7:物件導向
#物件導向
##程式導向與物件導向程式設計
1、程式導向:所有的工作都是現寫現用。
2、物件導向:是一種程式設計思想,許多功能事先已經編寫好了,在使用時,只需要關注功能的運用,而不需要這個功能的具體實現過程。
##javascript物件
將相關的變數和函式組合成一個整體,這個整體叫做物件,物件中的變數叫做屬性,變數中的函式叫做方法。javascript中的物件類似字典。
##建立物件的方法
1、單體
<script type="text/javascript">
var Tom = {
name : 'tom',
age : 18,
showname : function(){
alert('我的名字叫'+this.name);
},
showage : function(){
alert('我今年'+this.age+'歲');
}
}
</script>
2、工廠模式
<script type="text/javascript">
function Person(name,age,job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.showname = function(){
alert('我的名字叫'+this.name);
};
o.showage = function(){
alert('我今年'+this.age+'歲');
};
o.showjob = function(){
alert('我的工作是'+this.job);
};
return o;
}
var tom = Person('tom',18,'程式設計師');
tom.showname();
</script>
2、建構函式
<script type="text/javascript">
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.showname = function(){
alert('我的名字叫'+this.name);
};
this.showage = function(){
alert('我今年'+this.age+'歲');
};
this.showjob = function(){
alert('我的工作是'+this.job);
};
}
var tom = new Person('tom',18,'程式設計師');
var jack = new Person('jack',19,'銷售');
alert(tom.showjob==jack.showjob);
</script>
3、原型模式
<script type="text/javascript">
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
}
Person.prototype.showname = function(){
alert('我的名字叫'+this.name);
};
Person.prototype.showage = function(){
alert('我今年'+this.age+'歲');
};
Person.prototype.showjob = function(){
alert('我的工作是'+this.job);
};
var tom = new Person('tom',18,'程式設計師');
var jack = new Person('jack',19,'銷售');
alert(tom.showjob==jack.showjob);
</script>
4、繼承
<script type="text/javascript">
function fclass(name,age){
this.name = name;
this.age = age;
}
fclass.prototype.showname = function(){
alert(this.name);
}
fclass.prototype.showage = function(){
alert(this.age);
}
function sclass(name,age,job)
{
fclass.call(this,name,age);
this.job = job;
}
sclass.prototype = new fclass();
sclass.prototype.showjob = function(){
alert(this.job);
}
var tom = new sclass('tom',19,'全棧工程師');
tom.showname();
tom.showage();
tom.showjob();
</script>
學院Go語言視訊主頁
https://edu.csdn.net/lecturer/1928
清華團隊帶你實戰區塊鏈開發
掃碼獲取海量視訊及原始碼 QQ群:721929980
相關文章
- 1.16 JavaScript7:物件導向JavaScript物件
- 物件導向-物件導向思想物件
- 物件導向與程式導向物件
- 程式導向與物件導向物件
- “程序導向”和“物件導向”物件
- 物件導向物件
- 物件導向,搞定物件物件
- JAVA物件導向基礎--物件導向介紹Java物件
- PHP 物件導向 (九)物件導向三大特徵PHP物件特徵
- PHP物件導向PHP物件
- 物件導向 -- 反射物件反射
- JavaScript 物件導向JavaScript物件
- JS物件導向JS物件
- Java物件導向Java物件
- Python——物件導向Python物件
- 物件導向--下物件
- scala物件導向物件
- 物件導向(下)物件
- Python物件導向Python物件
- 物件導向(oop)物件OOP
- [Java物件導向]Java物件
- python 物件導向Python物件
- Java — 物件導向Java物件
- 物件導向(上)物件
- python-程式導向、物件導向、類Python物件
- Java物件導向——類與物件Java物件
- Js物件導向(1): 理解物件JS物件
- php中的程式導向與物件導向PHP物件
- 初識物件導向物件
- 物件導向拾遺物件
- 物件導向--繼承物件繼承
- java物件導向(上)Java物件
- java物件導向(中)Java物件
- python物件導向(一)Python物件
- 物件導向css oocss物件CSS
- PHP物件導向(三)PHP物件
- golang 物件導向特性Golang物件
- 物件導向相關物件