面向?qū)ο箐亯|-對象創(chuàng)建方式總結(jié)
第一種:創(chuàng)建對象的方式,json方式
//推薦使用的場合: 作為函數(shù)的參數(shù),臨時只用一次的場景。比如設(shè)置函數(shù)原型對象。
var obj = {};
//對象有自己的 屬性 和 行為
// 屬性比如: 年齡、姓名肥缔、性別
// 行為: 吃飯、睡覺汹来、走路续膳、講課等... 動作
var obj2 = {
name: 'laoma',
age: 18,
sayHi: function(){
console.log( name + 'say hi' );
}
};
//添加其他屬性:
obj2.newProp = 123;// js的動態(tài)特性怒见,如果沒有要訪問的屬性,直接添加屬性姑宽。
// 缺點: 不能作為對象創(chuàng)建的模板遣耍,也就是不能用new進行構(gòu)造新對象。
//=================================================
第二種: 創(chuàng)建面向?qū)ο蟮姆绞剑?new Object()的方式炮车。 不推薦使用舵变。
var obj3 = new Object();
//添加屬性
obj3.name = 'kitty';
obj3.sayHi = function() {
console.log( name + ' ' + 'say hi');
};
//跟上面的方式一樣,只能臨時用一下這個對象瘦穆,不想作為new的構(gòu)造模板是可以的纪隙。
第三種: 構(gòu)造函數(shù)構(gòu)造對象方法
//把 一個函數(shù)對象 當做構(gòu)造函數(shù)來使用,一般要把 函數(shù)對象的首字母大寫
function Person() {
this.name = '123'; // 通過this可以直接給 構(gòu)造出來的對象添加屬性扛或。
this.sayHi = function() {
console.log( this.name );
};
}
var p = new Person();
//** new 運算符的作用:
// 第一步:
// 執(zhí)行構(gòu)造函數(shù)(new后面的那個函數(shù))绵咱,在構(gòu)
//造函數(shù)內(nèi)部創(chuàng)建一個空對象,
// 第二步: 把上面的空對象跟構(gòu)造函數(shù)的原型對象進行關(guān)聯(lián)熙兔。
// 第三步:然后把this 指向當前空對象
//在構(gòu)造函數(shù)執(zhí)行結(jié)束后悲伶,把空對象返回 給 p
console.log( p.name ); //p.name 從構(gòu)造函數(shù)里面創(chuàng)建的。
p.sayHi(); //在此方法內(nèi)部的 this執(zhí)行 p對象住涉。
//繪制原型 和 構(gòu)造函數(shù) 和對象之間的關(guān)系麸锉。
第三種方式的升級改造版本:
//第三種方式有個缺點: 對象的內(nèi)部的函數(shù)會在每個對象中都存一份
//如果創(chuàng)建的對象非常多的話,那么非常浪費內(nèi)存舆声。函數(shù)的行為是所有對象
//可以共有花沉,不需要每個對象都保存一份。所以媳握,可以把函數(shù)放到原型中
//進行聲明碱屁,那么所有對象都有了公共的函數(shù),而且內(nèi)存中只保留一份蛾找。
//所有的屬性寫到對象的內(nèi)部
//第三種的升級版:
function Sprite() {
this.name = '123';
this.age = 19;
}
Sprite.prototype = {
sayHi: function() {
},
init: function() {
}
};
//繼續(xù)升級: 把屬性的設(shè)置做成參數(shù)化:
function Sprite( sname, sage ) {
this.name = sname || '';
this.age = sage || 18;
}
Sprite.prototype = {
sayHi: function() {
},
init: function() {
}
};
//問題: 1娩脾、調(diào)用者如果傳遞參數(shù)的順序發(fā)生變化,那么廢了
//問題: 2腋粥、 參數(shù)增減都會導(dǎo)致函數(shù)聲明變化晦雨,調(diào)用的地方也可能發(fā)生變化架曹。
//如何解決:繼續(xù)升級
function Sprite( option ) { //我用一個對象把所有參數(shù)覆蓋隘冲。靈活性就很強了。
//順序無所謂绑雄,添加參數(shù)也無所謂了展辞。
this.name = option.sname || '';
this.age = option.sage || 18;
}
Sprite.prototype = {
sayHi: function() {
},
init: function() {
}
};
//繼續(xù)優(yōu)化,把初始化的代碼 放到init函數(shù)中
function Sprite( option ) { //我用一個對象把所有參數(shù)覆蓋万牺。靈活性就很強了罗珍。
//順序無所謂洽腺,添加參數(shù)也無所謂了。
this.init( option );
}
Sprite.prototype = {
sayHi: function() {
},
init: function( option ) {
this.name = option.sname || '';
this.age = option.sage || 18;
}
};
//以后的canvas課程的開發(fā)暫時先用這種的方式
補充js方法調(diào)用的四種模式
function Person() {
var name1 = "itcast",
age1 = 19,
show1 = function() {
console.log(this.name);
};
return {
age : age1,
name : name1,
show : show1
};
}
var p = new Person();
p.show(); //在show方法中的this指向了p對象覆旱。
function add( a, b) {
this.result = a + b;
}
add( 3, 9 ); //此方法執(zhí)行的時候蘸朋,this指向了window
console.log(result);
function Person(){
this.name = "123";
this.age = 19;
this.show = function(){
console.log(this.name);
};
}
var p = new Person();
p.show();// 在show方法中方法this,指向了p對象實例扣唱。
function add(a,b){
this.result = a + b;
}
var p = {}; //定義一個空對象藕坯。
add.call(p,3,4); //在這個方法調(diào)用的時候,this指向了p
console.log(p.result);
//apply和call是一樣的用法噪沙,只不過apply第二個參數(shù)用數(shù)組進行傳遞炼彪。