当前位置:首页 > JavaScript

js 实现一个new

2026-01-31 06:24:35JavaScript

实现 new 操作符的功能

在 JavaScript 中,new 操作符用于创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。以下是手动实现 new 功能的步骤:

实现步骤

  1. 创建一个空对象
    使用 Object.create() 方法创建一个新对象,并将其原型指向构造函数的原型对象。
    const obj = Object.create(constructor.prototype);

  2. 调用构造函数并绑定 this
    将构造函数的作用域赋给新对象(即 this 指向新对象),并执行构造函数。
    const result = constructor.apply(obj, args);

  3. 处理返回值
    如果构造函数返回一个对象,则返回该对象;否则返回新创建的对象。
    return result instanceof Object ? result : obj;

完整代码实现

function myNew(constructor, ...args) {
    // 1. 创建一个空对象,并继承构造函数的原型
    const obj = Object.create(constructor.prototype);

    // 2. 执行构造函数,绑定 this 到新对象
    const result = constructor.apply(obj, args);

    // 3. 如果构造函数返回对象则返回该对象,否则返回新对象
    return result instanceof Object ? result : obj;
}

使用示例

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

// 使用原生 new
const p1 = new Person("Alice", 25);
console.log(p1.name); // "Alice"

// 使用自定义 myNew
const p2 = myNew(Person, "Bob", 30);
console.log(p2.age); // 30

关键点说明

  • 原型链继承
    Object.create(constructor.prototype) 确保新对象继承构造函数的原型方法。

  • 构造函数返回值处理
    如果构造函数显式返回对象(如 return { custom: 1 }),则优先返回该对象;否则返回新创建的 obj

  • 与原生 new 的对比
    手动实现的 myNew 模拟了原生 new 的核心逻辑,包括原型链绑定、this 绑定和返回值处理。

    js 实现一个new

标签: jsnew
分享给朋友:

相关文章

js实现dh

js实现dh

JavaScript 实现 DH(Diffie-Hellman)密钥交换 Diffie-Hellman(DH)密钥交换是一种安全协议,允许双方在不安全的通信信道上建立一个共享密钥。以下是如何在 Jav…

js实现求导

js实现求导

实现数值求导的方法 在JavaScript中实现求导通常采用数值方法,因为JavaScript不是符号计算语言。以下是常见的数值微分方法: 中心差分法 中心差分法提供较高精度的导数近似: func…

js图片轮播的实现

js图片轮播的实现

基础图片轮播实现 使用HTML、CSS和JavaScript实现一个简单的图片轮播效果。HTML部分定义轮播容器和图片,CSS负责样式和过渡效果,JavaScript处理逻辑。 <div cl…

js 实现跳转

js 实现跳转

使用 window.location.href 进行跳转 通过修改 window.location.href 可以跳转到指定 URL,浏览器会加载新页面: window.location.hre…

js 实现日历

js 实现日历

实现日历的基本思路 日历的核心功能是展示日期,并允许用户进行日期选择或导航。JavaScript 可以动态生成日历的 HTML 结构,并处理用户交互逻辑。 基础日历结构 日历通常包含头部(显示月份和…

js 实现全屏

js 实现全屏

使用 requestFullscreen 方法 通过调用元素的 requestFullscreen 方法可以实现全屏。该方法兼容现代浏览器,但不同浏览器可能需要前缀。 const element =…