js面向?qū)ο?/h1>

面向?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)用的四種模式

  • 方法調(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對象覆旱。
  • 函數(shù)調(diào)用模式
function add( a, b) {
    this.result = a + b;
}

add( 3, 9 ); //此方法執(zhí)行的時候蘸朋,this指向了window

console.log(result);    
  • 構(gòu)造器調(diào)用模式
function Person(){
    this.name = "123";
    this.age = 19;
    this.show = function(){
        console.log(this.name);
    };
}

var p = new Person();
p.show();//  在show方法中方法this,指向了p對象實例扣唱。
  • call 和 apply調(diào)用模式
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ù)組進行傳遞炼彪。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者

  • 序言:七十年代末,一起剝皮案震驚了整個濱河市正歼,隨后出現(xiàn)的幾起案子辐马,更是在濱河造成了極大的恐慌,老刑警劉巖局义,帶你破解...
    沈念sama閱讀 217,277評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件喜爷,死亡現(xiàn)場離奇詭異,居然都是意外死亡萄唇,警方通過查閱死者的電腦和手機贞奋,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,689評論 3 393
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來穷绵,“玉大人轿塔,你說我怎么就攤上這事≈倌” “怎么了勾缭?”我有些...
    開封第一講書人閱讀 163,624評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長目养。 經(jīng)常有香客問我俩由,道長,這世上最難降的妖魔是什么癌蚁? 我笑而不...
    開封第一講書人閱讀 58,356評論 1 293
  • 正文 為了忘掉前任幻梯,我火速辦了婚禮,結(jié)果婚禮上努释,老公的妹妹穿的比我還像新娘碘梢。我一直安慰自己,他們只是感情好伐蒂,可當我...
    茶點故事閱讀 67,402評論 6 392
  • 文/花漫 我一把揭開白布煞躬。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪恩沛。 梳的紋絲不亂的頭發(fā)上在扰,一...
    開封第一講書人閱讀 51,292評論 1 301
  • 那天,我揣著相機與錄音雷客,去河邊找鬼芒珠。 笑死,一個胖子當著我的面吹牛搅裙,可吹牛的內(nèi)容都是我干的妓局。 我是一名探鬼主播,決...
    沈念sama閱讀 40,135評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼呈宇,長吁一口氣:“原來是場噩夢啊……” “哼好爬!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起甥啄,我...
    開封第一講書人閱讀 38,992評論 0 275
  • 序言:老撾萬榮一對情侶失蹤存炮,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后蜈漓,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體穆桂,經(jīng)...
    沈念sama閱讀 45,429評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,636評論 3 334
  • 正文 我和宋清朗相戀三年融虽,在試婚紗的時候發(fā)現(xiàn)自己被綠了享完。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,785評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡有额,死狀恐怖般又,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情巍佑,我是刑警寧澤茴迁,帶...
    沈念sama閱讀 35,492評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站萤衰,受9級特大地震影響堕义,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜脆栋,卻給世界環(huán)境...
    茶點故事閱讀 41,092評論 3 328
  • 文/蒙蒙 一倦卖、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧椿争,春花似錦怕膛、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,723評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至洋侨,卻和暖如春舍扰,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背希坚。 一陣腳步聲響...
    開封第一講書人閱讀 32,858評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人垢粮。 一個月前我還...
    沈念sama閱讀 47,891評論 2 370
  • 正文 我出身青樓蘸炸,卻偏偏與公主長得像,于是被迫代替她去往敵國和親聊疲。 傳聞我的和親對象是個殘疾皇子茬底,可洞房花燭夜當晚...
    茶點故事閱讀 44,713評論 2 354

推薦閱讀更多精彩內(nèi)容