js高級之面向?qū)ο螅ㄒ唬?/h1>

對象的定義:

JS中一切皆為對象亿卤,這是一句常說的話鲤嫡。了解JS對象燕酷,從這句話開始吧然磷。JS中的基本數(shù)據(jù)類型如number啥箭,bool挤安,字符串搜吧,數(shù)組娩梨,null股冗,undefined等等都是對象葛闷。

對象的本質(zhì):

帶有屬性和方法的特殊數(shù)據(jù)類型憋槐,而每個屬性或者方法又可看做是一個鍵值對,因此可以這樣定義:對象是一系列無序鍵值對的集合

js中有兩種對象

  • 系統(tǒng)的內(nèi)置對象:比如說淑趾,string Date Array

  • 自己創(chuàng)建的對象

聲明對象或者創(chuàng)建對象的方式

//第一種方式
 var obj = {name:"張三",age:20};
//第二種方式
var obj  = new Object();
obj.name = "張三";
obj.age = 20;
//第三種方式
var obj = Object.create({name:"張三",age:20});

對象中不僅可以定義屬性阳仔,還可以定義方法

var obj = {
  name:"二哈",
  age:5,
  behaivor:function(){
    console.log("吃飯睡覺");
  }
}
//調(diào)用屬性和方法
console.log(obj.name);
obj.behavior();

設(shè)計模式之工廠模式

什么是工廠模式: 工廠模式類似于現(xiàn)實生活中的工廠可以產(chǎn)生大量相似的商品,去做同樣的事情,實現(xiàn)同樣的效果;這時候需要使用工廠模式近范。 簡單的工廠模式可以理解為解決多個相似的問題;這也是她的優(yōu)點;

比如定義一個狗類

function Dog(name,age,sex){
  var obj = {};
    obj.name = name;
    obj.age  =age;
    obj.sex = sex;
    obj.sayName = function(){
        return this.name;
    }
  return obj;
}
var dog1 = new Dog("大黃",10,"公");
console.log(dog1.name);//大黃
console.log(dog1.age);//10
console.log(dog.sayName());//大黃

上面的代碼嘶摊,Dog函數(shù)能接受三個參數(shù),可以無數(shù)次調(diào)用這個函數(shù)评矩,每一次返回的都是包含三個屬性和一個方法的對象叶堆;

工廠模式是為了解決多個類似對象聲明的問題;也就是為了解決實列化對象產(chǎn)生重復(fù)的問題。

構(gòu)造函數(shù)

構(gòu)造函數(shù)就是初始化一個實例對象斥杜,對象的prototype屬性是繼承一個實例對象虱颗。

構(gòu)造函數(shù)的注意事項:

  • 默認函數(shù)首字母大寫

  • 構(gòu)造函數(shù)并沒有顯示返回任何東西。new 操作符會自動創(chuàng)建給定的類型并返回他們蔗喂,當調(diào)用構(gòu)造函數(shù)時忘渔,new會自動創(chuàng)建this對象,且類型就是構(gòu)造函數(shù)類型缰儿。

  • 也可以在構(gòu)造函數(shù)中顯示調(diào)用return.如果返回的值是一個對象畦粮,它會代替新創(chuàng)建的對象實例返回。如果返回的值是一個原始類型乖阵,它會被忽略宣赔,新創(chuàng)建的實例會被返回。

也就是說:

 function Person (name){
  this.name = name;
}
var newPerson = new Person("JS");

等價于

function person(name){
  Object obj = new Object();
  obj.name = name;
  return obj;
}
var newPerson = person("JS");

構(gòu)造函數(shù)的定義:屬性定義在函數(shù)里面瞪浸,方法定義在原型中儒将。
構(gòu)造函數(shù)包括構(gòu)造函數(shù)本身和它的原型

function Person(name,age,height){           
                 this.name = name;
        this.age = age;
        this.height = height;
}       
  Person.prototype.hobby = function(){
            console.log("喜歡籃球");
        }
        Person.prototype.action = function(){
            //this指向的是實例化的對象            
                        console.log("姓名是"+this.name+"年齡是"+this.age);
        }
        var zhangsan = new Person("張三",18,"189cm");
        zhangsan.action();

通過構(gòu)造函數(shù)找到原型:prototype;
通過原型找到構(gòu)造函數(shù):constructor;

構(gòu)造函數(shù)的公有和私有

function Person(name){
    //私有屬性
    var name = name;
    //公有屬性
    this.height = "189cm";
    //get方法:通過共有方法訪問私有屬性
    this.get = function(){
        return name;
    }
    //set方法:設(shè)置私有屬性
    this.set = function(newName){
        name = newName;
        console.log(name);
    }
}
var newPerson = new Person("張三");
console.log(newPerson.name);//undefined
console.log(newPerson.get());
newPerson.set("李四");

構(gòu)造函數(shù)的繼承

function Person(name,age){
  this.name = name;
  this.age = age;
}
Person.prototype = function(){
  console.log("haha");
 }
//繼承屬性
function Student(name,age){
  Person.call(this,name,age);
}
//繼承原型
//會涉及到傳址的問題默终,所以要找第三者
function Link(){}
Link.prototype = Person.prototype;
Student.prototype = new Link();

class Person{
  //類最開始的時候加載執(zhí)行
  constructor(name,age){
    this.name = name;
    this.age = age;
  }
  hobby(){
   console.log("吃飯睡覺打豆豆");
  }
}
//類的調(diào)用
var zhangsan = new Person("張三",28);
console.log(zhangsan.name);
zhangsan.hobby();
//類的繼承
class Student extends Person{
  constructor(name,age){
    super(name,age);
  }
  action(){
    console.log("我是action函數(shù)");
  }
}
var newStudent = new Student("李四",10);
console.log(newStudent.name);
newStudent.hobby();
newStudent.action();
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者

  • 序言:七十年代末椅棺,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子齐蔽,更是在濱河造成了極大的恐慌,老刑警劉巖床估,帶你破解...
    沈念sama閱讀 218,546評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件含滴,死亡現(xiàn)場離奇詭異,居然都是意外死亡丐巫,警方通過查閱死者的電腦和手機谈况,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,224評論 3 395
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來递胧,“玉大人碑韵,你說我怎么就攤上這事《衅ⅲ” “怎么了祝闻?”我有些...
    開封第一講書人閱讀 164,911評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長遗菠。 經(jīng)常有香客問我联喘,道長华蜒,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,737評論 1 294
  • 正文 為了忘掉前任豁遭,我火速辦了婚禮叭喜,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘蓖谢。我一直安慰自己捂蕴,他們只是感情好,可當我...
    茶點故事閱讀 67,753評論 6 392
  • 文/花漫 我一把揭開白布闪幽。 她就那樣靜靜地躺著啥辨,像睡著了一般。 火紅的嫁衣襯著肌膚如雪沟使。 梳的紋絲不亂的頭發(fā)上委可,一...
    開封第一講書人閱讀 51,598評論 1 305
  • 那天,我揣著相機與錄音腊嗡,去河邊找鬼着倾。 笑死,一個胖子當著我的面吹牛燕少,可吹牛的內(nèi)容都是我干的卡者。 我是一名探鬼主播,決...
    沈念sama閱讀 40,338評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼客们,長吁一口氣:“原來是場噩夢啊……” “哼崇决!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起底挫,我...
    開封第一講書人閱讀 39,249評論 0 276
  • 序言:老撾萬榮一對情侶失蹤恒傻,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后建邓,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體盈厘,經(jīng)...
    沈念sama閱讀 45,696評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,888評論 3 336
  • 正文 我和宋清朗相戀三年官边,在試婚紗的時候發(fā)現(xiàn)自己被綠了沸手。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,013評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡注簿,死狀恐怖契吉,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情诡渴,我是刑警寧澤捐晶,帶...
    沈念sama閱讀 35,731評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響租悄,放射性物質(zhì)發(fā)生泄漏谨究。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,348評論 3 330
  • 文/蒙蒙 一泣棋、第九天 我趴在偏房一處隱蔽的房頂上張望胶哲。 院中可真熱鬧,春花似錦潭辈、人聲如沸鸯屿。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,929評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽寄摆。三九已至,卻和暖如春修赞,著一層夾襖步出監(jiān)牢的瞬間婶恼,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,048評論 1 270
  • 我被黑心中介騙來泰國打工柏副, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留勾邦,地道東北人。 一個月前我還...
    沈念sama閱讀 48,203評論 3 370
  • 正文 我出身青樓割择,卻偏偏與公主長得像眷篇,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子荔泳,可洞房花燭夜當晚...
    茶點故事閱讀 44,960評論 2 355

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