js中构造函数创建对象加不加new的问题

最新推荐文章于 2023-07-13 11:20:51 发布

zyy_0725

最新推荐文章于 2023-07-13 11:20:51 发布

阅读量1k

点赞数

分类专栏： JS 文章标签： JS javascript

JS 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

js中构造函数创建对象加不加new的问题

2016-11-13 09:27 844人阅读评论(0) 收藏举报

本文中将探讨一下，用函数生成对象时候加new 与不加new 的区别。首先看下面一个函数代码块。

[javascript] view plain copy

print ?

function Student(name, age, gender) {
this.name = name;
this.age = age;
this.gender = gender;
this.sayHi = function () {
console.log("hello" + this.name );
}
sole.log(this);
}

    function Student(name, age, gender) {
        this.name = name;
        this.age = age;
        this.gender = gender;
        this.sayHi = function () {
            console.log("hello" + this.name );
        }
	console.log(this);
    }

如果，我们使用 var stu1 = Student("zs", 18, "gender");等同于执行了Student 函数，在此种情况，函数内部的this，指向的是window ,函数执行过后，并没有返回值，那么就默认返回一个undefined.所以如果console.log(stu1)，那么将得到一个undefined值。同时可以看到控制台中，window对象中，挂载了name,age,gender,sayHi等变量。

在使用var stu1 = new Student("zs", 18, "gender");加入一个new ,那么通过函数内部的console.log(this)可以看到，该this 指向了当前的stu1。console.log(stu1)可以看到。两只完全相等。

关于其中__proto__的含义，涉及到js面向对象部分，我们常见的jquery, angular,react,无不用到js面向对象的知识。如果新手，不了解js的学习的先后顺序，直接上手框架部分，就如同学过java基础过后，不用学习servlet，直接学习后面的框架一样。到时候，只是能用，对自己提高不明显。

继续上面的补充，请看以下代码片段：

[javascript] view plain copy

print ?

function Num(value) {
this.value = parseInt(value);
var num = parseInt(value);
return num;//如果是值类型就不返回了如果是引用类型还返回
}
var num1 = Num("18");
var num2 = new Num("18");
console.log(num1);
console.log(num2);

    function Num(value) {
        this.value = parseInt(value);
        var num = parseInt(value);
        return num;//如果是值类型就不返回了 如果是引用类型还返回
    }
    var num1 = Num("18");
    var num2 = new Num("18");

    console.log(num1);
    console.log(num2);

关于return 的内容，对于不加new 来执行函数来说，返回值，就是函数的执行结果，对于加new 关键字来执行函数而言，如果return 的是基本数据类型，那么忽视掉该return值，如果返回的是一个对象类型，那么num2就指向该对象类型。上面的执行结果为：

如果上面代码块改为：

[javascript] view plain copy

print ?

function Num(value) {
this.value = parseInt(value);
var num = parseInt(value);
sole.log(this)
return {name:'zs'};//如果是值类型就不返回了如果是引用类型还返回
}
var num = new Num("18");
console.log(num);

    function Num(value) {
        this.value = parseInt(value);
        var num = parseInt(value);
	console.log(this)
        return {name:'zs'};//如果是值类型就不返回了 如果是引用类型还返回
		
    }
    var num = new Num("18");

    console.log(num);

那么执行结果为：