大家都知道,大多数面向对象的编程语言都支持类和类继承的特性。但很遗憾,在ES6之前,JavaScript却不支持这些特性,那时候人们只能利用JavaScript原型链的特点模拟类的概念,就像下面的例子
function Person(name) {
this.name=name
}
Person.prototype.getName=function() {
return this.name
}
const p=new Person('Tom')
p.getName() //'Tom'
console.log(p instanceof Person) //true
这段代码定义了一个Person构造函数,再给Person的原型添加一个getName方法,利用JavaScript原型链的特点,就可以使用new操作符和原型继承的特性创建Person的实例,实现模拟“类”。
那么new操作符到底做了什么呢?我们在学习东西的时候有必要刨根问底,这样才能做创造的人,而不是使用的人。废话不多说,让我们探究一下new操作到底做了什么吧。
//模拟new操作符,封装一个New函数,将构造函数作为参数传入
function New(fn) {
//声明返回的实例化对象
const res={}
//如果构造函数有原型,实例化对象的隐式原型指向构造函数的显式原型
if(fn.prototype !== null)
res.__proto__=fn.prototype
//执行构造函数,通过apply改变this指向为实例化对象
//通过slice和call方法将传入的参数(类数组对象)转化为数组,去除第一个参数fn
//通过ret接收构造函数的返回值
const ret=fn.apply(res,Array.prototype.slice.call(arguments,1))
//检查构造函数是否指定了返回对象或函数,如果有直接返回,否则返回实例化对象
if((typeof ret === 'object' || typeof ret === 'function') && ret !==null)
return ret
return res
}
const p=New(Person,'Tom')
p.getName() //'Tom'
console.log(p instanceof Person) //true
new操作的原理其实很简单,说白了就是新建个实例对象,把原型指向构造函数的原型,然后在使用构造函数的时候把this指向改为实例对象,最后一步检查个人感觉很鸡肋,因为在其他语言中构造函数是不需要返回值的,但JavaScript的new回去检查构造函数的返回内容是否为引用类型,如果是引用类型就认为是指定了返回对象,将其返回。
我觉得究其原因,是因为JavaScript的“构造函数”并非其他语言中的构造函数,而是通过function来模拟的,我们使用构造函数应该是用来创造实例化对象的,所以个人认为有返回值得“构造函数”不能称为构造函数,只是一个普通的JavaScript函数,实现了返回引用类型数据的功能,不应该用来new。