问题11:继承有什么作用?
- 概念:继承就是子类拥有父类的属性和方法,
- 作用:
- 父类中是更加通用的属性和方法,通过继承,子类拥有父类的属性和方法,不需要重新去写这些重复的代码,提高了代码的重用性,
- 想要给所有子类修改属性和方法,只要在父类中修改就能“牵一发而动全身”,所有子类都修改了,提高了代码的可维护性
- 直接给子类添加新的属性和方法,子类就会拥有这些属性和方法,表现出多态化,而父类不会被“污染”,提高了代码的独立性
问题12: 下面两种写法有什么区别?
//方法1
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);
/*方法一创建的实例,它的 printName 方法是在自己的属性上,
每创建一个实例,都要对它绑定一次这个方法
方法二创建的实例,它的 printName 方法是在原型对象 __proto__ 上,
所有实例共享同一个 __proto__ , 所有只绑定了一次该方法
一般我们选择方法二,把通用的方法绑定在原型上,通过继承让每个实例拥有该方法,
这样能提高代码的重用性,节省内存,提高性能
*/
问题13: Object.create 有什么作用?兼容性如何?
作用:创建一个以该对象为原型的实例
var me = {
name: "cg",
sayName: function(){
console.log("My name is " + this.name);
}
}
var p = Object.create(me)
//以 me 对象为原型,创建了实例 p
p.__proto__ === me //true
兼容性:IE 9及以上支持,具体见下表
|Feature|Chrome|Firefox(Gecko)|IE|Opera|Safari|
|---|---|
|Basic support|5|4.0(2)|9|11.60|5|
问题14: hasOwnProperty有什么作用? 如何使用?
作用:判断一个属性是否是自身的属性,返回 true 或 false
var People = function(name){
this.name = name
}
People.prototype.sayName = function(){
console.log("My name is " + this.name);
}
var p = new People("cg")
console.dir(p)
p.hasOwnProperty("name") //true
//name 是 p 自己的属性,所以返回true
p.hasOwnProperty("sayName") //false
//sayName 是 p 的原型 __proto__ 里的属性,不是自己的属性,所以返回false
问题15:如下代码中call的作用是什么?
function Person(name, sex){
this.name = name;
this.sex = sex;
}
function Male(name, sex, age){
Person.call(this, name, sex); //这里的 call 有什么作用
this.age = age;
}
/*call 的作用是实现了继承,Male 继承了 Person 的方法
原理是:call 改变了函数 Person 的执行上下文为 Male
*/
问题16: 补全代码,实现继承
function Person(name, sex){
this.name = name
this.sex = sex
}
Person.prototype.getName = function(){
console.log(this.name);
};
function Male(name, sex, age){
Person.apply(this, arguments)
this.age = age
}
Male.prototype = Object.create(Person.prototype) //实现继承
//为了兼容 IE678 可以用以下三行代码实现继承,效果等同 Object.create
var Temp = function(){}
Temp.prototype = Person.prototype
Male.prototype = new Temp()
//修改 constructor
Male.prototype.constructor = Male
Male.prototype.getAge = function(){
console.log(this.age);
};
var ruoyu = new Male('若愚', '男', 27);
ruoyu.getName(); //若愚