JS 手写 new 函数

工作中我们经常会用到 new 关键字,new 一个构造函数生成一个实例对象,那么new的过程中发生了什么呢,我们今天梳理下

  1. 创建一个对象
  2. 对象原型继承
  3. 绑定函数this
  4. 返回对象

先创建一个构造函数,原型上添加一个方法

javascript 复制代码
let Foo = function (name) {
  this.name = name
}

Foo.prototype.getName = function () {
  return this.name
}

然后,我们实现一个自定义new函数:

javascript 复制代码
function new_(fn, ...args) {
  let obj = {} // 创建一个对象
  obj.__proto__ = fn.prototype // 继承函数的原型
  fn.apply(obj, args) // 绑定this
  return Object.prototype.toString.call(obj) === '[object Object]' ? obj : {} // 返回对象,判断其有效性
}

使用,看下效果

javascript 复制代码
let foo = new_(foo, '张三')

console.log(foo)
console.log(foo.getName())

打印看下,看到完美输出

相关推荐
散峰而望4 分钟前
C++入门(一)(算法竞赛)
c语言·开发语言·c++·编辑器·github
C_Liu_10 分钟前
13.C++:继承
开发语言·c++
张人玉12 分钟前
c#串口读写威盟士五插针
开发语言·c#·通讯
路长冬19 分钟前
matlab与数字信号处理的不定期更新
开发语言·matlab·信号处理
冴羽29 分钟前
今日苹果 App Store 前端源码泄露,赶紧 fork 一份看看
前端·javascript·typescript
蒜香拿铁31 分钟前
Angular【router路由】
前端·javascript·angular.js
卡卡酷卡BUG36 分钟前
Java 后端面试干货:四大核心模块高频考点深度解析
java·开发语言·面试
Yolo566Q39 分钟前
OpenLCA生命周期评估模型构建与分析
java·开发语言·人工智能
安娜的信息安全说1 小时前
深入浅出 MQTT:轻量级消息协议在物联网中的应用与实践
开发语言·物联网·mqtt
西洼工作室1 小时前
高效管理搜索历史:Vue持久化实践
前端·javascript·vue.js