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

打印看下,看到完美输出

相关推荐
rylshe131417 分钟前
在scala中sparkSQL连接mysql并添加新数据
开发语言·mysql·scala
小宋加油啊17 分钟前
Mac QT水平布局和垂直布局
开发语言·qt·macos
MyhEhud37 分钟前
kotlin @JvmStatic注解的作用和使用场景
开发语言·python·kotlin
想睡hhh43 分钟前
c++进阶——哈希表的实现
开发语言·数据结构·c++·散列表·哈希
Clown951 小时前
Go语言爬虫系列教程(一) 爬虫基础入门
开发语言·爬虫·golang
Watermelo6171 小时前
前端如何应对精确数字运算?用BigNumber.js解决JavaScript原生Number类型在处理大数或高精度计算时的局限性
开发语言·前端·javascript·vue.js·前端框架·vue·es6
HebyH_1 小时前
2025前端面试遇到的问题(vue+uniapp+js+css)
前端·javascript·vue.js·面试·uni-app
Aric_Jones3 小时前
lua入门语法,包含安装,注释,变量,循环等
java·开发语言·git·elasticsearch·junit·lua
Akiiiira3 小时前
【日撸 Java 三百行】Day 12(顺序表(二))
java·开发语言
EndingCoder3 小时前
2025年JavaScript性能优化全攻略
开发语言·javascript·性能优化