手动实现一个new操作符理解

lentoo 发布于2019-08-23 16:49 / 1600人阅读

手动实现一个new操作符理解

网上看了一些手动实现new操作符的方法和效果，现在来总结下

第一种方法

    function new1(func) {
        var newObj = Object.create(func.prototype);    // 创建一个继承自func.prototype的新对象
        var returnObj = func.apply(newObj, Array.prototype.slice.call(arguments, 1));   //截取new1函数第二个以及第二个之后的参数,在newObj作用域内执行改造函数func
        if ((typeof returnObj === "object" || typeof returnObj === "function") && ret !== null) {
            return returnObj;
        }   //如果传入参数中的构造函数执行后的returnObj是“对象”类型(比如new1(Object)),那么这个对象会取代newObj作为返回的对象
        return newObj;
    }

第二种方法

function new2(func) {
        return function() {
            let newObj = {
                __proto__: func.prototype    // 新生成一个对象,且新对象的原型对象继承自构造对象的原型对象
            }
            var returnObj =func.apply(obj, arguments)   // 以第二次执行函数的参数,在obj作用域中执行func
            if ((typeof returnObj === "object" || typeof returnObj === "function") && returnObj !== null) {
                return returnObj;
            }   //同理,returnObj是“对象”类型(比如new1(Object)),那么这个对象会取代newObj作为返回的对象
            return newObj
        }
    }

和原生对象构造方式对比

    var object1 = new1(Object);
    var object2 = new2(Object)();
    var object3 = new Object();
    
    console.dir(object1)
    console.dir(object2)
    console.dir(object3)

在控制台中查看结果

没有区别。
再假定一个自定义的构造函数进行对比

    function person(name, age) {
        this.name = name
        this.age = age
    }
    
    var obj1 = new1(person,"zhus",25);
    var obj2 = new2(person)("zhus",25);
    var obj3 = new person("zhus",25);
    
    console.dir(obj1)
    console.dir(obj2)
    console.dir(obj3)

对比结果

也没有区别。

GPU云服务器云服务器 new一个这是一个登录操作实现一个webrtc 手势操作实现

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

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

一名【合格】前端工程师的自检清单

摘要：在他的重学前端课程中提到到现在为止，前端工程师已经成为研发体系中的重要岗位之一。大部分前端工程师的知识，其实都是来自于实践和工作中零散的学习。一基础前端工程师吃饭的家伙，深度广度一样都不能差。开篇前端开发是一个非常特殊的行业，它的历史实际上不是很长，但是知识之繁杂，技术迭代速度之快是其他技术所不能比拟的。 winter在他的《重学前端》课程中提到：到现在为止，前端工程师已经成为研...

罗志环 2019-08-23 17:08 评论0 收藏0
一名【合格】前端工程师的自检清单

摘要：在他的重学前端课程中提到到现在为止，前端工程师已经成为研发体系中的重要岗位之一。大部分前端工程师的知识，其实都是来自于实践和工作中零散的学习。一基础前端工程师吃饭的家伙，深度广度一样都不能差。开篇前端开发是一个非常特殊的行业，它的历史实际上不是很长，但是知识之繁杂，技术迭代速度之快是其他技术所不能比拟的。 winter在他的《重学前端》课程中提到：到现在为止，前端工程师已经成为研发体系...

isaced 2019-05-21 19:50 评论0 收藏0
深入理解控制反转（IoC）和依赖注入（DI）

摘要：本文一大半内容都是通过举例来让读者去理解什么是控制反转和依赖注入，通过理解这些概念，来更加深入。这种由外部负责其依赖需求的行为，我们可以称其为控制反转。工厂模式，依赖转移当然，实现控制反转的方法有几种。容器，字面上理解就是装东西的东西。常见的变量、对象属性等都可以算是容器。一个容器能够装什么，全部取决于你对该容器的定义。当然，有这样一种容器，它存放的不是文本、数值，而是对象、对象的描...

HollisChuang 2019-07-01 12:49 评论0 收藏0
php实现依赖注入(DI)和控制反转（IOC)

摘要：工厂模式，依赖转移当然，实现控制反转的方法有几种。其实我们稍微改造一下这个类，你就明白，工厂类的真正意义和价值了。虽然如此，工厂模式依旧十分优秀，并且适用于绝大多数情况。此篇文章转载自laravel-china,chongyi的文章https://laravel-china.org/top...原文地址： http://www.insp.top/learn-lar... ，转载务必保...

tomato 2019-06-28 13:34 评论0 收藏0
手动实现bind函数（附MDN提供的Polyfill方案解析）

摘要：被调用时，等参数将置于实参之前传递给被绑定的方法。它返回由指定的值和初始化参数改造的原函数拷贝。一个绑定函数也能使用操作符创建对象这种行为就像把原函数当成构造器。其实这个思路也是库如何实现继承的方法。他的函数如下最后一步是将的指回。 update: 2018-06-08 原文链接为什么要自己去实现一个bind函数？ bind()函数在 ECMA-262 第五版才被加入；它可能无法在所...

idisfkj 2019-08-26 12:00 评论0 收藏0