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())

打印看下,看到完美输出

相关推荐
VBA63372 分钟前
VBA之Word应用第三章第十节:文档Document对象的方法(三)
开发语言
老胖闲聊11 分钟前
Python Rio 【图像处理】库简介
开发语言·图像处理·python
拉不动的猪24 分钟前
安卓和ios小程序开发中的兼容性问题举例
前端·javascript·面试
码界奇点32 分钟前
Python Flask文件处理与异常处理实战指南
开发语言·python·自然语言处理·flask·python3.11
贩卖纯净水.41 分钟前
浏览器兼容-polyfill-本地服务-优化
开发语言·前端·javascript
k要开心1 小时前
C++概念以及基础框架语法
开发语言·c++
程序研1 小时前
一、ES6-let声明变量【解刨分析最详细】
前端·javascript·es6
开发者工具分享2 小时前
如何应对敏捷转型中的团队阻力
开发语言
疯狂的沙粒2 小时前
在uni-app中如何从Options API迁移到Composition API?
javascript·vue.js·uni-app
gregmankiw2 小时前
C#调用Rust动态链接库DLL的案例
开发语言·rust·c#