JavaScript学习之Object(下)new命令

Salamander 发布于2019-08-23 12:14 / 1272人阅读

摘要：命令作用作用是执行构造函数，返回实例对象上面例子是自定义一个构造函数，其最大的特点就是首字母大写，用执行构造函数其中，在的执行下，代表了实例化后的对象，这个也就有属性注意点如果不用执行构造函数，那么指向的是全局有两种方式可以避免内部定义严格

new命令 new作用

作用是执行构造函数，返回实例对象

function F() {
    this.name = "object"
}
var obj = new F();

上面例子是自定义一个构造函数，其最大的特点就是首字母大写，用new执行构造函数；
其中this，在new的执行下，代表了实例化后的对象，这个obj也就有name属性
注意点：如果不用new执行构造函数，那么this指向的是全局window

function F() {
    this.name = "object"
}
var obj = F();
console.log(obj);     //undefined
console.log(name);    //object

有两种方式可以避免：

内部定义严格模式，当this为undefined时,添加属性会报错

function F() {
    this.name = "object"
}
F();
//TypeError: Cannot set property "name" of undefined

加个判断机制

function F() {
    if(!(this instanceof F)){
        return new F();
    }
    this.name = "object"
}
F();

用new.target来判断，在没有用new执行时new.target返回undefined，new执行下返回构造函数自身

function F() {
    if(!new.target){
        return new F();
    }
    this.name = "object"
}
F();

简单来说：不加new执行，this就是window；加了new执行，那么this = Object.create(F.prototype),构建一个空对象，继承下F的原型

当构造函数内部有return时，需要分情况执行

return的内容不是对象，则忽视，返回的时this对象

function F() {
    this.name = "object"
    reutrn 123;
}
var obj = F();   //{name : "object"}

return的内容是对象时，则返回return的对象,(null除外)

function F() {
    this.name = "object"
    reutrn {a : 123};
}
var obj = F();   //{a : 123}

new的原理

前提是使用了new来执行构造函数

创建一个空对象，作为对象实例来返回

将空对象的原型链指向构造函数的prototype

将空对象赋值给构造函数内部的this，（this = Object.create(F.prototype)）

执行构造函数内部代码，若return没有返回新对象（null除外），则返回this对象

利用上述原理我们可以简单模拟一个new的函数

        function _new(constructor, params) {
            //将arguments对象转为数组
            var args = [].slice.call(arguments);
            //1.取出参数中的构造函数，2.过滤args，剩下对构造函数有用的实参
            var constructor = args.shift();
            //构建空对象，并继承构造函数的原型
            var context = Object.create(constructor.prototype);
            //1.借用构造函数，将context空对象赋给this，2.并args实参与构造函数参数一一对应对其赋值，3.形成完整的this对象
            var result = constructor.apply(context, args);
            //这个是处理return返回对象时的情况
            return (typeof result === "object" && result != null) ? result : context;
        }
        function P(n) {
            var a = 1;
            this.b = n;
            //return null;
        }
        var p = _new(P,123);
        console.log(p);

云服务器私有云学习之substr() 深度学习之概要 webrtc学习之九 linux学习之centos

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

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

JavaScript学习之Object(下)相关方法

摘要：它不区分该属性是对象自身的属性，还是继承的属性。那么我们要遍历对象所有属性，包括继承以及不可遍历的属性，用加原型遍历实现类似的用递归 Object静态方法 Object自身方法，必须由Object调用，实例对象并不能调用 Object.getPrototypeOf() 作用是获取目标对象的原型 function F() {}; var obj = new F(); console.lo...

amuqiao 2019-08-23 12:15 评论0 收藏0
JavaScript学习之对象原型及继承

摘要：原型要掌握这三者之间的关系，通过代码例子记录一下自身属性的这里就是通过代码看一下做了什么默认情况下，将的所有属性包括继承的赋值给有什么东西呢自己的原型链，添加一个属性，用来指明对象的谁构造的自身全部属性，这边构建一个空对象原型，所以没有自有原型要掌握这三者之间的关系prototype，constructor,__proto__通过代码例子记录一下 function F() { ...

妤锋シ 2019-08-23 12:16 评论0 收藏0
Javascript学习之继承

摘要：继承是面向对象编程语言中的一个重要的概念，继承可以使得子类具有父类的属性和方法或者重新定义追加属性和方法等。但是在中没有类的概念，是基于原型的语言，所以这就意味着对象可以直接从其他对象继承。继承是面向对象编程语言中的一个重要的概念，继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。但是在Javascript中没有类的概念，是基于原型的语言，所以这就意味着对象可以直接...

CHENGKANG 2019-08-21 15:34 评论0 收藏0
JavaScript学习之JSON对象

摘要：原始类型的值只有四种字符串数值必须以十进制表示布尔值和不能使用和。字符串必须使用双引号表示，不能使用单引号。数组或对象最后一个成员的后面，不能加逗号。 JSON对象补充记录一下，有些方法很需要熟练记忆的 JSON对象的规定 JSON对象对值有严格的规定复合类型的值只能是数组或对象，不能是函数、正则表达式对象、日期对象。原始类型的值只有四种：字符串、数值（必须以十进制表示）、布尔值和...

banana_pi 2019-08-23 12:43 评论0 收藏0
Javascript学习之创建对象

摘要：在中，除了几种原始类型外，其余皆为对象，，既然对象如此重要，那就列举一下在中如何创建对象通过构造函数创建对象实例对象字面量对象字面量是对象定义的一种简写形式，目的在于简化创建包含大量属性的对象的过程。在Javascript中，除了几种原始类型外，其余皆为对象（Object，Array ...），既然对象如此重要，那就列举一下在Javascript中如何创建对象：通过Object构造...

jollywing 2019-08-21 15:34 评论0 收藏0