js笔记:原型、函数的继承、class类、this指向
原型
- 原型 prototype
我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype(唯一的),当函数通过构造函数调用时,它所创建的对象都会有一个隐含的属性,该属性指向构造函数的原型对象, 我们可以通过__proto__来访问该属性。
- 原型链
访问一个对象的属性和方法的时候:先去对象本身去查找,对象本身具有属性和方法时,直接调用,如果没有,去对象的原型上去找,如果对象的原型没有属性和方法,去对象的原型的原型上去查找,直到找到为止,找不到就报错.这样一层一层的递归去查找就形成了一个原型链(继承链)
函数的继承
- 构造函数的继承
-方法: 使用apply调用父类的构造函数
function People(name){
this.name=name
this.study=function(){
console.log(this.name)
}
}
People.prototype.work=function(){
console.log(this.name+"走")
}
function Man(name,sex){
//构造函数继承:用子类对象调用父类的构造函数
People.apply(this,[name])
}
注:通过这种方式只能继承父类构造函数中的内容
- 原型链继承
Man.prototype=Object.create(People.prototype)
Man.prototype.constructor= Man
注:通过这种方式只能继承父类原型链中的内容
- 组合继承
综合构造函数继承与原型链继承
function People(name,age){
this.name=name
this.age=age
}
People.prototype.work=function(){
console.log(this.name+"走")
}
Man.prototype=Object.create(People.prototype)
Man.prototype.constructor=Man
var p1=new People("李四",20)
p1.work()
console.log(p1)
function Man(name,age,sex){
//把父类的属性和方法继承过来
People.apply(this,[name,age])
}
var m1=new Man("张三",10,1)
console.log(m1)
m1.work()
class与class继承
- class
在es6之后才会出现class,es6之前创建一个类型,通过构造函数创建,es6之后可以通过class关键字实现一个类型
- class继承
this指向问题
- this的指向
1 全局中的this 就是window
2 函数中的this:谁调用函数this就是谁
3 事件绑定的时候:谁绑定,this就是谁
4定时器如果写成正常的匿名函数this是window, 果回调函数是箭头函数,箭头函数的this是上下文的this
5 构造函数中的this
-构造函数当做普通函数调用的时候this是window
-通过new调用构造函数,函数this是调用它的对象
7 对象中的this,谁调用this就是谁 - 改变this的指向
改this指向的方法: call() bind() apply()