资讯专栏INFORMATION COLUMN

老生常谈,new运算符到底干了啥

roundstones / 2768人阅读

摘要:冬天来了,好好学习,天天向上。在里面,得益于字面量对象,我们可以轻松的创建出一个对象,比如就可以直接创建对象。而在其它语言里面,无法通过这样的方式创建一个对象,一般会借助构造方法和运算符。

冬天来了,好好学习,天天向上。
在js里面,得益于字面量对象,我们可以轻松的创建出一个对象,比如var o = {name: "tom"},就可以直接创建对象o。而在其它oo语言里面,无法通过这样的方式创建一个对象,一般会借助构造方法和new运算符。

先看个例子,

function Person (name) {
  this.name = name
}

function Animal (type) {
  this.type = type
  return {type: "dog"}
}
const p1 = Person("tom")
const p2 = new Person("tom")

const a1 = Animal("cat")
const a2 = new Animal("cat")

p1,p2,a1,a2分别等于什么?

p1是函数Person执行的结果,而函数Person没有返回值,所以p1 = undefined;同理a1 = {type: "dog"}

p2是Person的实例, p2 = {name: "tom"};a2是Animal的实例,a2 = {type: "dog"}

那么问题来了,为什么不是期望中的a2 = {type: "cat"}

因为new主要干了下面几件事:

创建一个新对象o,并将新对象o的原型对象指向构造函数的原型属性

将构造函数的this指向新对象o

执行构造函数中的代码,如果返回值是个对象(引用类型)则返回该对象,否则返回新对象o(注意:如果返回null也返回新对象o

针对上面的Person类,可以依据上面的规则写出new函数

const mynew = (Func, name) => {
    let o = {}
    o.__proto__ = Func.prototype
    let res = Func.call(o, name)
    if(res instanceof Object) {
       return res
    } else {
       return o
    }
}

执行mynew函数验证

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100236.html

相关文章

  • js new 对象了啥

    摘要:属性和方法被加入到引用的对象中。并执行了该函数新创建的对象由所引用,并且最后隐式的返回。 1、创建一个空对象,并且 this 变量引用该对象,// lat target = {}; 2、继承了函数的原型。// target.proto = func.prototype; 3、属性和方法被加入到 this 引用的对象中。并执行了该函数func// func.call(target); 4...

    codergarden 评论0 收藏0
  • js new 对象了啥

    摘要:属性和方法被加入到引用的对象中。并执行了该函数新创建的对象由所引用,并且最后隐式的返回。 1、创建一个空对象,并且 this 变量引用该对象,// lat target = {}; 2、继承了函数的原型。// target.proto = func.prototype; 3、属性和方法被加入到 this 引用的对象中。并执行了该函数func// func.call(target); 4...

    betacat 评论0 收藏0
  • JS核心知识点梳理——原型、继承(下)

    摘要:引言上篇文章介绍原型,这篇文章接着讲继承,呕心沥血之作,大哥们点个赞呀明确一点并不是真正的面向对象语言,没有真正的类,所以我们也没有类继承实现继承有且仅有两种方式,和原型链在介绍继承前我们先介绍下其他概念函数的三种角色一个函数,有三种角色。 showImg(https://segmentfault.com/img/bVbo4hv?w=1800&h=1000); 引言 上篇文章介绍原型,...

    joyqi 评论0 收藏0
  • 3分钟看懂Activity启动流程

    摘要:在结合下面简要的分析,分钟内你就能搞明白的启动流程。关于的启动,我在惊天秘密从开始,揭露线程通讯的诡计和主线程的阴谋一文中有提到过。从上图可以看到,方法中主要做的事情有初始化主线程的主。并使主线程进入等待接收消息的无限循环状态。 showImg(https://segmentfault.com/img/remote/1460000009912818); 背景介绍 从事开发到了一定阶段,...

    bang590 评论0 收藏0
  • 3分钟看懂Activity启动流程

    摘要:在结合下面简要的分析,分钟内你就能搞明白的启动流程。关于的启动,我在惊天秘密从开始,揭露线程通讯的诡计和主线程的阴谋一文中有提到过。从上图可以看到,方法中主要做的事情有初始化主线程的主。并使主线程进入等待接收消息的无限循环状态。 showImg(https://segmentfault.com/img/remote/1460000009912818); 背景介绍 从事开发到了一定阶段,...

    Me_Kun 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<