知識點
- 面向?qū)ο蟮娜筇匦?/li>
- 封裝
- 繼承
- 多態(tài)
- 創(chuàng)建對象的幾種方式
- 字面量形式
- 使用內(nèi)置構(gòu)造函數(shù)
- 封裝簡單的工廠函數(shù)
- 自定義構(gòu)造函數(shù)
- 構(gòu)造函數(shù)
- 什么是構(gòu)造函數(shù)?
- 對象的創(chuàng)建過程
- 構(gòu)造函數(shù)的返回值
- 對象是無序的鍵值對兒的集合
- 如果像使用正常的函數(shù)一樣使用構(gòu)造函數(shù)
- 獲取對象類型
面向?qū)ο蟮娜筇匦?/h1>
封裝
對象是將數(shù)據(jù)與功能組合到一起, 即封裝
- js 對象就是 鍵值對的集合
- 鍵值如果是數(shù)據(jù)( 基本數(shù)據(jù), 復(fù)合數(shù)據(jù), 空數(shù)據(jù) ), 就稱為屬性
- 如果鍵值是函數(shù), 那么就稱為方法
- 對象就是將屬性與方法封裝起來
- 方法是將過程封裝起來
//封裝
var name = "張學(xué)友";
var age = 18;
function sayHello(){
console.log("hello world");
}
var obj = {
name : "劉德華",
age : 50,
sayHello : function () {
//.....
}
}
var itcast = {
getEle:{
},
}
繼承
所謂繼承就是自己沒有, 別人有,拿過來為自己所用, 并成為自己的東西
讓某個類型的對象獲得另一個類型的對象的屬性的方法
- js 繼承基于對象
- 在JavaScript中，繼承就是當(dāng)前對象可以使用其他對象的方法和屬性悴晰。
- js繼承實現(xiàn)舉例：混入（mix）
function mix ( o1, o2 ) {
for ( var k in o2 ) {
o1[ k ] = o2[ k ];
}
}
<script>
//繼承
//javaScript當(dāng)中的繼承是指
//一個對象沒有一些方法和屬性慢睡，但是另外一個對象有
//把另外一個對象的屬性和方法逐工，拿過來使用，就是繼承
var obj = {
};
var obj1 = {
name : "張學(xué)友",
sayHello: function () {
console.log("你好漂辐，我是張學(xué)友");
}
}
// obj.sayHello();
//混入式繼承（mix-in） for in
for(var k in obj1){
//k可以獲取到對象的每一個屬性
//obj1[k]可以獲取到對象的每一個屬性的值
//這里使用k給對象新增屬性的時候泪喊，不可以使用點語法
obj[k] = obj1[k];
}
obj.sayHello();
</script>
多態(tài)
- 把不同的子類對象都當(dāng)作父類來看，可以屏蔽不同子類對象之間的差異髓涯，寫出通用的代碼袒啼，做出通用的編程，以適應(yīng)需求的不斷變化纬纪。
- 多態(tài)是在強類型語言中比較常用蚓再，JavaScript中沒有相應(yīng)的體現(xiàn)
- 使用父類的引用（指針）指向子類的對象 就叫做多態(tài)
- 使用多態(tài)來隱藏不同
動物 animal = new 子類(); // 子類：麻雀、狗包各、貓摘仅、豬、狐貍...
動物 animal = new 狗();
animal.叫();
創(chuàng)建對象的方式
- 字面量形式
只能創(chuàng)建一次對象问畅，復(fù)用性較差娃属，如果要創(chuàng)建多個對象，代碼冗余度太高
var obj = {
name:"演員",
singer:"薛段子手",
type:"流行"
};
var obj1 ={
name:"吻別",
singer:"張學(xué)友",
type:"流行"
}
- 使用內(nèi)置構(gòu)造函數(shù)
//使用內(nèi)置構(gòu)造函數(shù)
var obj = new Object();
obj.name = "一千個傷心的牛油";
obj.singer = "張學(xué)友";
obj.sing = function () {
console.log("一千個傷心的牛油");
}
var obj2 = new Object();
obj2.name = "一千個傷心的牧流";
obj2.singer = "張學(xué)友";
obj2.sing = function () {
console.log("一千個傷心的牧流");
}
- 封裝簡單的工廠函數(shù)
本質(zhì)還是內(nèi)置構(gòu)造函數(shù)护姆，已經(jīng)不推薦使用了
function createSong(SingerName,SingName){
var obj = new Object();
obj.name = SingerName;
obj.singer = SingName;
obj.sing = function () {
console.log("一千個傷心的牛油");
}
return obj;
}
var obj = createSong("一千個傷心的牛油","張學(xué)友");
自定義構(gòu)造函數(shù)
- 什么是構(gòu)造函數(shù)?
- 構(gòu)造函數(shù)其實也是函數(shù)矾端，但是通常用來初始化對象，并且和new關(guān)鍵字同時出現(xiàn)
- new 是用來創(chuàng)建對象的卵皂，構(gòu)造函數(shù)是用來初始化對象的(給對象新增成員)
- 構(gòu)造函數(shù)名秩铆，首字母要大寫！以示區(qū)分
<script type="text/javascript">
//自定義構(gòu)造函數(shù)
function Person(){
//默認(rèn)隱含的操作灯变，把剛才用new新創(chuàng)建出來的對象賦值給this
this.name = "美女";
this.age = 45;
this.sayPaPa = function () {
console.log("啪啪");
}
// return 123;
return [1,2];
}
var p = new Person();
console.log(p);
p.sayPaPa();
</script>
- 對象的創(chuàng)建過程
function Person(name, age){
this.name = name;
this.age = age;
}
var p = new Person();
以上面這個p對象創(chuàng)建為例：
首先使用new關(guān)鍵字創(chuàng)建對象豺旬，類似于使用{},這個時候創(chuàng)建出來的對象是一個"沒有任何成員"的對象。這里需要注意兩點：
1柒凉， 使用new關(guān)鍵字創(chuàng)建的對象族阅，對象的類型就是創(chuàng)建這個對象使用的構(gòu)造函數(shù)的函數(shù)名
2， 使用{}創(chuàng)建對象膝捞，對象的類型一定是Object坦刀，相當(dāng)于使用了new Object()使用構(gòu)造函數(shù)為其初始化成員
1， 在構(gòu)造函數(shù)調(diào)用開始的時候蔬咬，有一個賦值操作鲤遥，也就是讓this = 剛創(chuàng)建出來的對象
2， 在構(gòu)造函數(shù)中林艘，this就代表剛創(chuàng)建出來的對象在構(gòu)造函數(shù)中盖奈，利用對象的動態(tài)特性，為對象添加成員
構(gòu)造函數(shù)的執(zhí)行過程
- 使用new關(guān)鍵字創(chuàng)建對象
- 調(diào)用構(gòu)造函數(shù)狐援，把新創(chuàng)建出來的對象賦值給構(gòu)造函數(shù)內(nèi)的this
- 在構(gòu)造函數(shù)內(nèi)使用this為新創(chuàng)建出來的對象新增成員
- 默認(rèn)返回新創(chuàng)建的這個對象 （普通的函數(shù)钢坦，如果不寫返回語句究孕，會返回undefined）
- 構(gòu)造函數(shù)的返回值
- 如果不寫返回值，默認(rèn)返回的是新創(chuàng)建出來的對象 （一般都不會去寫這個return語句）
- 如果我們自己寫return語句 return的是空值（return;）爹凹，或者是基本類型的值或者null厨诸，都會默認(rèn)返回新創(chuàng)建出來的對象
- 如果返回的是object類型的值，將不會返回剛才新創(chuàng)建的對象禾酱，取而代之的是return后面的值
- 對象是無序的鍵值對兒的集合
function Animal(name, type, barkWay) {
this.name = name;
this.type = type;
this.bark = barkWay;
}
- 如果像使用正常的函數(shù)一樣使用構(gòu)造函數(shù)
- 構(gòu)造函數(shù)中的this將不再指向新創(chuàng)建出來的對象（因為根本就沒有創(chuàng)建對象）
- 構(gòu)造函數(shù)中的this這個時候指向的就是window全局對象
- 當(dāng)使用this給對象添加成員的時候微酬，全部都添加到了window上
Animal("","",function () {
console.log("我是函數(shù)");
}); //這是一個錯誤的演示
window.bark();
- 獲取對象類型
-
typeof 對象實例，獲取的是object
var dog = new Animal("大黃","BYD",function () {
console.log("汪汪汪");
});
console.log(dog);
var cat = new Animal("小花","BSM",function () {
console.log("喵喵喵");
});
console.log(typeof cat);//object
- js中提供了兩個方法來調(diào)用其他對象的方法：
call颤陶、apply - 獲取具體類型的方式
var typeStr = Object.prototype.toString.call(想獲取類型的對象)
typeStr = typeStr.slice(8, -1);
