JavaScript经典前端面试题---原型

232 阅读1分钟

注意:本文章总结的知识点参考渡一教育前端课程

image.png

// Person.prototype 原型
// Person.prototype = {} 是祖先
Person.prototype.name = "hello"
function Person() {

}
var person = new Person()
var person1 = new Person()
person.name //hello
person1.name //hello
person.__proto__ == Person.prototype
Person.prototype.constructor = Person

call/apply/bind

作用是: 改变this的指向 区别: call和apply 传参的方式不同,call和bind不同在于bind生成新的函数,再重新调用新的函数

Function.call(obj,a,b,c)

Function.apply(obj,[a,b,c])
//call和apply的区别
function Foo(a,b) {
  return a + b; 
}
Foo.call(null,1,2)
Foo.apply(null,[1,2])
//call和bind的区别
var name = "global";
function test() {
  console.log(this.name)
}
test() //global
var obj = {
  name: 'jubu'
}
test.call(obj) //jubu
var test1 = test.bind(obj)
test1() //jubu

call/apply/bind的模拟实现

github.com/mqyqingfeng…

github.com/mqyqingfeng…

this总是指向函数的直接调用者,返回一个对象,call/apply/blid可以用来动态的固定/切换this的指向

用途: 解释new过程

function Person(name,age) {
 this.name = name;
 this.age = age;
}
var person = new Person();

其具体的过程可以分解如下:
1.创建一个对象 var obj = {}
2.obj的原型地址指向构造函数Foo的原型对象;
obj.__proto__ = Person.prototype
3.利用函数的call方法,将原本指向window的绑定对象this指向了obj
var foo = Foo.call(obj, 'ceshi',18)
this.name = name;
通过函数的[call方法]将this绑定到obj(也就是说this就是obj)
`return this;` 就是return obj,这样obj这个对象就被返回出来了
4. 将结果返回return foo