继承的实现(es5、es6)以及两者的区别、new的实现

1.ES5

function Father(name){
    this.name=name
}
function Son(name,age){
    Father.call(this,name)
    this.age=age
}
Son.prototype=new Father()
Son.prototype.constructor=Son

2.ES6

class Father{
    constructor(name){
        this.name=name
    }
}
class Son extends Father{
    constructor(name,age){
        super(name)
        this.age=age
    }
}

class和function实现类的区别 :

  • class内部开启严格模式,函数、变量在未定义之前使用会报错
  • class不可以通过bind等函数修改this 指向,function可以
  • class的所有方法都是不可枚举的,而function声明的函数是可以枚举的。
  • class的所有方法都没有prototype ,不能通过new关键字来实例化
  • function可以直接调用,class必须通过new关键字调用

3.new一个对象的时候发生了什么

1.创建一个空对象

2.将新对象的隐式原型连接到构造函数的显式原型上。

3.调用构造函数,并将obj 作为this, arguments作为参数,接收返回值(constructor本身有可能返回一个对象

4.如果本身返回一个对象则应该把这个对象返回回去;如果不是对象,应该把新建的对象返回回去

function _new(constructor, ...arg) {
  var obj = {}; // 对应于上面的步骤 1
  obj.__proto__ = constructor.prototype; // 对应于上面的步骤 2

  var res = constructor.apply(obj, arg); // 对应于上面的步骤 3

  return Object.prototype.toString.call(res) === '[object Object]' ? res : obj; // 对应于上面的步骤 4
}

const Fun = function(name) {
  this.name = name;
};

console.log(_new(Fun, '小没'));

// Fun {name: "小没"}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值