JavaScript中的继承,new操作的原理

        大家都知道,大多数面向对象的编程语言都支持类和类继承的特性。但很遗憾,在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。

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值