一幕随、問(wèn)題
1.繼承有什么作用? （難度:***）
繼承的作用豹障，可以使用原型鏈上的屬性和方法存淫，這樣的方式可以節(jié)省內(nèi)存空間。同時(shí)將相同作用的代碼抽象出來(lái)沼填，提高了代碼的復(fù)用性桅咆，也更容易讓人理解。
2.有幾種常見(jiàn)創(chuàng)建對(duì)象的方式? 舉例說(shuō)明? （難度:****）
- 直接聲明
這種方法的缺點(diǎn)就是聲明太過(guò)于繁瑣坞笙，重復(fù)造輪子
var p1={
name:"xiaohan",
sayName:function(){
console.log(this.name);
}
};
var p2={
name:"xiaosu",
sayName:function(){
console.log(this.name);
}
};
p1.sayName();
p2.sayName();
- 工廠模式
工廠模式比直接聲明提高了代碼的復(fù)用性岩饼，下面的例子中我無(wú)法獲知p1、p2 和creatPerson之間的關(guān)系薛夜。
function creatPerson(name){
var obj={
name:name,
sayName:function(){
console.log(this.name);
}
};
return obj;
}
var p1=creatPerson("xiaohan");
p1.sayName();
var p2=creatPerson("xiaosu");
p2.sayName();
- 構(gòu)造函數(shù)模式
構(gòu)造函數(shù)方式可以清除的表示構(gòu)造函數(shù)和對(duì)象之間的關(guān)系籍茧，但每個(gè)對(duì)象都會(huì)重復(fù)創(chuàng)造公用的方法。
function Person(name){
this.name=name;
this.sayName=function(){
console.log(this.name);
}
}
var p1=new Person("xiaohan"),
p2=new Person("xiaosu");
p1.sayName();
p2.sayName();
console.log(p1.sayName===p2.sayName) //false
- 原型方式
原型方式將每個(gè)對(duì)象的通用方法 放到構(gòu)造函數(shù)的原型對(duì)象上梯澜，這樣每個(gè)對(duì)象都使用同一個(gè)公用方法寞冯，減少了內(nèi)存的使用
function Person(name){
this.name=name;
}
Person.prototype.sayName=function(){
console.log(this.name);
}
var p1=new Person("xiaohan"),
p2=new Person("xiaosu");
p1.sayName();
p2.sayName();
console.log(p1.sayName===p2.sayName) //true
3.下面兩種寫(xiě)法有什么區(qū)別? （難度:***）
方法一中每一個(gè)創(chuàng)建的對(duì)象都有一個(gè)獨(dú)立的printName方法，方法二中每一個(gè)創(chuàng)建對(duì)象共享原型對(duì)象中的printName方法
function People(name, sex){
this.name = name;
this.sex = sex;
this.printName = function(){
console.log(this.name);
}
}
var p1 = new People('饑人谷', 2)
//方法2
function Person(name, sex){
this.name = name;
this.sex = sex;
}
Person.prototype.printName = function(){
console.log(this.name);
}
var p1 = new Person('若愚', 27);
4.Object.create有什么作用晚伙？兼容性如何吮龄？如何使用？ （難度:***）
Object.create()方法創(chuàng)建一個(gè)擁有指定原型和若干個(gè)指定屬性的對(duì)象咆疗，是ES5的方法漓帚。
語(yǔ)法：
Object.create(proto, [ propertiesObject ])
參數(shù)：
proto 作為新創(chuàng)建對(duì)象的原型
*propertiesObject * 可選。該參數(shù)對(duì)象是一組屬性與值午磁，該對(duì)象的屬性名稱將是新創(chuàng)建的對(duì)象的屬性名稱尝抖，值是屬性描述符（這些屬性描述符的結(jié)構(gòu)與Object.defineProperties()
的第二個(gè)參數(shù)一樣）。注意：該參數(shù)對(duì)象不能是 undefined
迅皇，另外只有該對(duì)象中自身?yè)碛械目擅杜e的屬性才有效昧辽，也就是說(shuō)該對(duì)象的原型鏈上屬性是無(wú)效的。
兼容性：IE9+登颓，Chrome5+搅荞，F(xiàn)irefox 4.0+，Opear 11.60+,Safari 5+
作用：
1.使用Object.create實(shí)現(xiàn)繼承
function Animal(category,moveMethod){
this.category=category;
this.moveMethod=moveMethod;
}
Animal.prototype.say=function(){
console.log("我屬于:"+ this.category + ",移動(dòng)的時(shí)候是:" + this.moveMethod);
}
function Dog(name){
var category="狗類",
moveMethod="跑啊跑";
Animal.call(this,category,moveMethod);
this.name=name;
}
Dog.prototype=Object.create(Animal.prototype);
Dog.prototype.sayName=function(){
console.log(this.name);
}
Dog.prototype.constructor=Dog;
var d1=new Dog("旺財(cái)");
d1.say() //我屬于:狗類,移動(dòng)的時(shí)候是:跑啊跑
d1.sayName() //旺財(cái)
2.創(chuàng)建對(duì)象
function Animal(category,moveMethod){
this.category=category;
this.moveMethod=moveMethod;
}
Animal.prototype.say=function(){
console.log("我屬于:"+ this.category + ",移動(dòng)的時(shí)候是:" + this.moveMethod);
}
var fish=Object.create(Animal.prototype,{
category:{
writeable:true,
configurable: true,
value:"魚(yú)"
},
moveMethod:{
writeable:true,
configurable: true,
value:"游啊游"
}
});
5.hasOwnProperty有什么作用？ 如何使用取具？ （難度:***）
- hasOwnProperty()方法用來(lái)判斷某個(gè)對(duì)象是否含有指定的自身屬性脖隶。
var o ={
name:"xiaohan",
age:18
}
console.log(o.hasOwnProperty("name")); //true
delete o.name;
console.log(o.hasOwnProperty("name")); //false
- 和 in 運(yùn)算符不同，該方法會(huì)忽略掉那些從原型鏈上繼承到的屬性
var o ={
name:"xiaohan",
age:18
}
console.log(o.hasOwnProperty("name")); //true
console.log(o.hasOwnProperty("toString")); //false
6.實(shí)現(xiàn)Object.create的 polyfill暇检，如：（ps: 寫(xiě)個(gè) 函數(shù)create产阱，實(shí)現(xiàn) Object.create 的功能）,什么是 polyfill？（難度:****）
if(typeof Object.create!=="function"){
Object.create=function(){
function Temp(){};
var hasOwn=Object.prototype.hasOwnProperty;
return function(){
var args=arguments;
proto=args[0];
if(typeof proto !=="object") return;
Temp.prototype=proto;
var obj=new Temp();
Temp.prototype=null; //每次釋放掉
if(arguments.length>1){
properties=Object(arguments[1]); //裝箱块仆？ = =new Object();
for(var pro in properties){
if(hasOwn.call(properties,pro)){
obj[pro]=properties[pro];
}
}
}
return obj;
}
}();
}
7.如下代碼中call的作用是什么? （難度:****）
call的作用就是改變函數(shù)的上下文构蹬；
當(dāng) Male作為函數(shù)調(diào)用時(shí)，this=window 相當(dāng)于在window上加了三個(gè)屬性悔据；
而Male作為構(gòu)造函數(shù)使用時(shí) this指代創(chuàng)建的對(duì)象庄敛，相當(dāng)于在對(duì)象初始化了 三個(gè)屬性；
function Person(name, sex){
this.name = name;
this.sex = sex;
}
function Male(name, sex, age){
Person.call(this, name, sex); //這里的 call 有什么作用
this.age = age;
}
8.補(bǔ)全代碼科汗，實(shí)現(xiàn)繼承 （難度:****）
function Person(name, sex){
this.name=name;
this.sex=sex;
}
Person.prototype.printName = function(){
console.log(this.name);
};
function Male(name, sex, age){
Person.call(this,name,sex);
this.age=age;
}
Male.prototype=Object.create(Person.prototype);
Male.prototype.constructor=Male;
Male.prototype.getAge = function(){
return this.age;
};
var ruoyu = new Male('若愚', '男', 27);
ruoyu.printName();
參考文檔:
本教程版權(quán)歸小韓同學(xué)和饑人谷所有藻烤，轉(zhuǎn)載須說(shuō)明來(lái)源
