手写一个简单易懂的new

最新推荐文章于 2024-12-20 17:49:19 发布

前端小白QAQ

最新推荐文章于 2024-12-20 17:49:19 发布

阅读量279

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript专栏文章标签： javascript

本文链接：https://blog.csdn.net/weixin_45932733/article/details/111563219

JavaScript专栏专栏收录该内容

27 篇文章

订阅专栏

本文详细介绍了如何正常使用JavaScript的new操作符，并通过实例解析了如何手写一个myNew来模拟new的行为，包括创建空对象、设置原型、改变this指向及参数传递等关键步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.正常使用new

function Xue(name){
    this.name = name
}
Xue.prototype.sayName = function(){
    console.log(this.name)
}
var xue = new Xue('我是Xue')
Xue.sayName() // 我是Xue
xue.sayName() // 我是Xue

2.自己手写一个mynew

function Xue(name){
    this.name = name
}
Xue.prototype.sayName = function(){
    console.log(this.name)
}
// 上面是本身Xue
// ...args为ES6展开符,也可以使用arguments

function mynew(fn,...args){   
    //先用Object创建一个空的对象
    //fn.prototype代表 用当前对象的原型去创建
    // 或者可以用obj.__proto__ = Fu.prototype继承原型
    const obj = Object.create(fn.prototype)  
    
    //现在obj就代表Xue了,但是参数和this指向没有修改
    const rel = fn.apply(obj,args)
    
    //正常规定,如何fn返回的是null或undefined(也就是不返回内容),我们返回的是obj,否则返回rel
    return rel instanceof Object ? rel : obj
}
var xue = mynew(Xue,'这是用mynew出来Xue')
Xue。sayName() // 这是用mynew出来Xue
xue.sayName() // 这是用mynew出来Xue