構(gòu)造函數(shù):
? ? ? ? 說構(gòu)造函數(shù)的概念之前我們應(yīng)該先了解類的概念淮捆,類與對(duì)象的概念息息相關(guān)验懊,我們?cè)谥v對(duì)象的概念的時(shí)候說過雨让,一只貓是一個(gè)對(duì)象卧惜,一個(gè)人是一個(gè)對(duì)象厘灼,一章桌子也是一個(gè)對(duì)象,那么我們平時(shí)說的貓咽瓷,人设凹,桌子在沒有特定指出是哪一個(gè)對(duì)象的時(shí)候,我們其實(shí)說的就是類茅姜。我們身邊有人類闪朱,貓也是一個(gè)類,任何有相同屬性和方法的對(duì)象我們都可以稱他們?yōu)橐粋€(gè)類匈睁。
? ? ? ? 在很多面向?qū)ο笳Z言中都有類的概念监透,但是在javascript(es5)中沒有類桶错。而我們可以通過構(gòu)造函數(shù)來模擬一個(gè)類航唆。
? ? ? ? ? ? function Cat(){
this.name='miaomiao';
this.age=12;
this.sayName=function(){
console.log('我們是貓類');
}
}
var cat=new Cat();
console.log(cat.name);
cat.sayName();
? ? ? ? 構(gòu)造函數(shù)的函數(shù)名首字母大寫,可以通過在函數(shù)中的this為類設(shè)置屬性和方法院刁,我們?cè)谏厦娴拇a中為貓這個(gè)類定義了一個(gè)name屬性糯钙,并賦值為"miaomiao",類創(chuàng)建完成后退腥,我們可以通過new關(guān)鍵字創(chuàng)建這個(gè)類的實(shí)例任岸。例如cat這個(gè)變量就是Cat類的一個(gè)實(shí)例。
? ? ? ? 我們可以通過傳參的方式狡刘,在實(shí)例化對(duì)象的時(shí)候?yàn)閷?duì)象設(shè)置屬性
? ? ? ? ? function Cat(name,age){
this.name=name;
this.age=age;
this.sayName=function(){
console.log('我是'+this.name);
}
? ? ? ? ? ? }
? ? ? ? ? var cat=new Cat('mioamiao',12);
? ? ? ? ? cat.sayName();
? ? ? ? ? console.log(cat);
? ? ? ? 一個(gè)構(gòu)造函數(shù)可以生成多個(gè)對(duì)象的實(shí)例
? ? ? ? ? function Person(name,age){
? ? ? ? ? this.name=name;
? ? ? ? ? this.age=age;
? ? ? ? ? this.say=function(){
? ? ? ? ? ? ? console.log('大家好');
? ? ? ? ? }
? ? ? ? ? }
? ? ? ? ? var lily=Person('lily',12);
? ? ? ? ? var lucy=Person('lucy',13);
? ? ? ? ? console.log(lily);
? ? ? ? ? console.log(lucy);
? ? ? ? ? console.log(lily.say==lucy.say);
一個(gè)構(gòu)造函數(shù)Person生成了兩個(gè)對(duì)象實(shí)例lily和lucy享潜,并且有兩個(gè)屬性和一個(gè)方法。但是嗅蔬,它們的say方法是不一樣的剑按。也就是說,每當(dāng)你使用new來調(diào)用構(gòu)造函數(shù)放回一個(gè)對(duì)象實(shí)例的時(shí)候澜术,都會(huì)創(chuàng)建一個(gè)hobby方法艺蝴。這既沒有必要,又浪費(fèi)資源鸟废,say方法完全可以被兩個(gè)對(duì)象實(shí)例共享猜敢。? ? ? ? ?
構(gòu)造函數(shù)的缺點(diǎn)就是:同一個(gè)構(gòu)造函數(shù)的對(duì)象實(shí)例之間無法共享屬性或方法。
為了解決構(gòu)造函數(shù)的對(duì)象實(shí)例之間無法共享屬性的缺點(diǎn),js提供了prototype屬性缩擂。
每一個(gè)構(gòu)造函數(shù)都有一個(gè)prototype屬性鼠冕,這個(gè)屬性指向一個(gè)原型對(duì)象,這個(gè)原型對(duì)象上的所有屬性和方法都可以被這個(gè)構(gòu)造函數(shù)的實(shí)例使用
function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.hobby=function(){
return 'movie';
}
var girl=new Cat('rose',12);
var boy=new Cat('jack',18);
console.log(girl.hobby==boy.hobby);
如果將hobby方法放在原型對(duì)象上胯盯,那么兩個(gè)實(shí)例對(duì)象都共享著同一個(gè)方法供鸠。
一、ECMAscript
? ? ECMAscript簡稱ES陨闹,是JavaScript的標(biāo)準(zhǔn)楞捂,我們經(jīng)常說的ES5,ES6等等趋厉,可以稱作JavaScript的版本寨闹,我們?cè)谥皩W(xué)過的所有JavaScript特性,都是基于ES5版本的君账,今天我們開始講解的是ES6標(biāo)準(zhǔn)的特性繁堡。ES6已更名為ES2015,ES7等后續(xù)的版本乡数,我們都可以統(tǒng)稱為ES2015+椭蹄。
二、變量和常量
? 我們之前一直使用var定義變量净赴,在ES6版本中绳矩,我們可以使用let定義變量,下面我們來說說var與let的區(qū)別玖翅。
? 塊級(jí)作用域
? S5只有全局作用域和函數(shù)作用域翼馆,沒有塊級(jí)作用域的概念,這帶來了很多不合理的場(chǎng)景金度∮γ模看下面的代碼
? ? for(var i = 0;i<10;i++){
? ? ? console.log(i); // 0-9
}
console.log(i);? ? // 10
? 因?yàn)闆]有塊級(jí)作用域,所以我們?cè)趂or語句的外面仍然能獲取i的值猜极,在實(shí)際開發(fā)中中姜,這是一個(gè)不可理喻的場(chǎng)景,我們希望的是這個(gè)i只在for語句內(nèi)有效跟伏,所以再ES6中添加了塊級(jí)作用域的概念丢胚,我們可以用let聲明變量,問題就解決了
? ? for(let i = 0;i<10;i++){
? ? ? console.log(i); // 0-9
}
console.log(i);? ? // 報(bào)錯(cuò) i is not defined
? 因?yàn)橛胠et聲明變量酬姆,變量只在塊級(jí)作用域下有效嗜桌,所以再for語句之外輸出i會(huì)報(bào)錯(cuò)。
? 不存在變量提升
? ? ? 我們使用var定義變量會(huì)發(fā)生“變量提升”辞色,我們來看下面的代碼
? ? ? console.log(number);? ? ? ? ? ? //undefied
? ? ? var number = 100;? ? ? ? ? ? ?
console.log(string);? ? ? ? ? ? //報(bào)錯(cuò)
let string = "hello world";
? ? ? 變量提升會(huì)導(dǎo)致我們?cè)谧兞柯暶髦笆褂米兞恳膊粫?huì)報(bào)錯(cuò)骨宠,但是這個(gè)變量的值是undefined浮定,這是不合理的,因?yàn)槿晃覀円褂眠@個(gè)變量层亿,那就應(yīng)該提前聲明桦卒,如果沒有提前聲明,就應(yīng)該給予錯(cuò)誤提示匿又。所以再ES6中我們使用let聲明變量方灾,如果在聲明變量前使用變量就會(huì)報(bào)錯(cuò)。
? ? ? 關(guān)于報(bào)錯(cuò)碌更,有些同學(xué)會(huì)感覺不報(bào)錯(cuò)要比報(bào)錯(cuò)好裕偿,但實(shí)際開發(fā)中,如果程序運(yùn)行與我們的語氣不符痛单,我們更希望看到錯(cuò)誤信息嘿棘,這樣有利于我們更快地發(fā)現(xiàn)問題。
? ? 不允許重復(fù)聲明
? ? ? ? 在ES5中旭绒,我們可以多次聲明同一個(gè)變量
? ? ? ? var a = 10;
? ? ? ? var a = 20;
? ? ? ? let b = 10;
? ? ? ? let b = 20;? //報(bào)錯(cuò)
? ? ? 但是多次聲明是沒有意義的鸟妙,在ES6中,我們使用let聲明變量限制了不能多次聲明挥吵,如果多次聲明同一個(gè)變量回報(bào)錯(cuò)重父。
? ? 常量
? ? ? 在ES6中,不僅有變量忽匈,還增加了常量的概念房午,我們用const聲明常亮,一旦聲明脉幢,它的值就不能再改變
? ? ? ? const PI = 3.1415926;
? ? ? ? PI = 3? ? ? ? ? ? ? ? ? //報(bào)錯(cuò)
? ? ? 我們說常亮不能再改變歪沃,說的是不能重新為這個(gè)常亮賦值嗦锐,但是如果常亮存儲(chǔ)的是一個(gè)對(duì)象嫌松,那我們是可以改變這個(gè)對(duì)象的屬性的?
? ? const obj = {name:'小明'};
? ? obj.name = '小紅';
? ? console.log(obj.name);? //小紅