js构造函数创建对象是否加new问题

今天看到这样一道题：

填写"TO DO"处的内容让下面代码支持a.name = "name1"; b.name = "name2";

function Obj(name){
// TO DO
}
obj. /* TO DO */ = "name2";
var a = Obj("name1");
var b = new Obj;

问题1:new操作符做了些什么呢？

创建一个新对象；

将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象） ；

执行构造函数中的代码（为这个新对象添加属性） ；

返回新对象。

问题2:不加new操作符直接执行构造函数会发生什呢？

function Obj(name){
this.name = name;
console.log(this); // 严格模式下是undefined 非严格模式下是window对象
}
var a = Obj("name1");
console.log(a); // 结果 => undefined

哦，原来只是当作正常的函数调用来执行，Obj没有返回值，故a是undefined。

两者区别总结

使用new操作符创建对象，并且构造函数没有返回值或者返回为基本数据类型，那么返回该对象，如下例：

function Obj(name){
this.name = name;
}
var b = new Obj;
console.log(b); // Obj { name: undefined }
function Obj(name){
this.name = name;
return 'chic';
}
var b = new Obj;
console.log(b); // 同上

如果构造函数返回一个引用类型：

function Obj(name){
this.name = name;
return {};
}
var b = new Obj;
console.log(b); // {}

总结

对于不加new来执行构造函数来说，返回值就是构造函数的执行结果；对于加new关键字来执行构造函数而言，如果return的是基本数据类型，那么忽视掉该return值，如果返回的是一个引用类型，那么返回该引用类型。

那么问题答案你有了吗？

参考答案 ：

function Obj(name){
this.name = name;
return this;
}
Obj.prototype.name = "name2";
var a = Obj("name1");
var b = new Obj;

以上就是我们给大家整理的js构造函数创建对象是否加new问题的全部内容，大家阅读后还有疑问可以在下方留言区讨论，感谢你对我们的支持。

您可能感兴趣的文章:

  • js构造函数创建对象是否加new问题
  • 详解Javascript 中的 class、构造函数、工厂函数
  • js实现轮播图的两种方式(构造函数、面向对象)
  • 详解JS构造函数中this和return
  • 不得不看之JavaScript构造函数及new运算符
  • Javascript中构造函数要注意的一些坑
  • javascript构造函数以及原型对象的理解
  • JavaScript创建对象的七种方式全面总结
  • JavaScript创建对象_动力节点Java学院整理
  • JavaScript创建对象的七种方式(推荐)
  • 深入理解JavaScript创建对象的多种方式以及优缺点
  • JavaScript中创建对象的7种模式详解
赞 (0)

相关推荐

  • Javascript中构造函数要注意的一些坑

    Javascript中构造函数要注意的一些坑

    前言 最近在家看书:<你不知道的Javascript>,看到构造函数调用时会绑定this,就顺便打开控制台输了一些代码,详细测试了一下. 构造函数简单的讲,即定义出来专供new 式调用的函数. 如: function A(b) { this.b = b || 'bbb'; } 然后你就可以通过new ,来构建一个 A 的实例: var a = new A('B') 但是,一个首要的坑是,构造函数与一个普通函数并无不同,如果你故意不使用new,或忘记用new,都会得到奇怪的错误: var aa

  • JavaScript中创建对象的7种模式详解

    ECMA-262把对象定义为:"无需属性的集合,其属性可以包含基本值.对象或者函数."严格来讲,这就相当于说明对象是一组没有特定顺序的值.对象的每个属性或方法都有一个名字,而每个名字都映射到一个值.正因为这样,我们可以把ECMAScript的对象想象成散列表:无非就是一组名对值,其中值可以是数据或函数. 创建自定义对象最简单的方式就是创建一个Object的实例,然后再为他添加属性和方法,如下所示: var person = new Object();.person.name = &qu

  • 详解Javascript 中的 class、构造函数、工厂函数

    到了ES6时代,我们创建对象的手段又增加了,在不同的场景下我们可以选择不同的方法来建立.现在就主要有三种方法来构建对象,class关键字,构造函数,工厂函数.他们都是创建对象的手段,但是却又有不同的地方,平时开发时,也需要针对这不同来选择. 首先我们来看一下,这三种方法是怎样的 // class 关键字,ES6新特性 class ClassCar { drive () { console.log('Vroom!'); } } const car1 = new ClassCar(); consol

  • JavaScript创建对象_动力节点Java学院整理

    JavaScript创建对象_动力节点Java学院整理

    JavaScript对每个创建的对象都会设置一个原型,指向它的原型对象. 当我们用obj.xxx访问一个对象的属性时,JavaScript引擎先在当前对象上查找该属性,如果没有找到,就到其原型对象上找,如果还没有找到,就一直上溯到Object.prototype对象,最后,如果还没有找到,就只能返回undefined. 例如,创建一个Array对象: var arr = [1, 2, 3]; 其原型链是: arr ----> Array.prototype ----> Object.proto

  • 不得不看之JavaScript构造函数及new运算符

    JS中的函数即可以是构造函数又可以当作普通函数来调用,当使用new来创建对象时,对应的函数就是构造函数,通过对象来调用时就是普通函数. 普通函数的创建有:显式声明.匿名定义.new Function() 等三种方式. 当通过new来创建一个新对象时,JS底层将新对象的原型链指向了构造函数的原型对象,于是就在新对象和函数对象之间建立了一条原型链,通过新对象可以访问到函数对象原型prototype中的方法和属性. 和其他高级语言一样 Javascript 中也有构造函数和 new 运算符,我们知道

  • JavaScript创建对象的七种方式全面总结

    JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产.接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点 工厂模式 function createPerson(name, job) { var o = new Object() o.name = name o.job = job o.sayName = function() { console.log(this.name) } return

  • js实现轮播图的两种方式(构造函数、面向对象)

    本文实例为大家分享了js实现轮播图的具体代码,供大家参考,具体内容如下 1.构造函数 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type='text/css'> *{ margin:0; padding:0;} #wrap{ width:500px; height:360px; margin:1

  • JavaScript创建对象的七种方式(推荐)

    JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产.接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点. 工厂模式 function createPerson(name, job) { var o = new Object() o.name = name o.job = job o.sayName = function() { console.log(this.name) } return

  • javascript构造函数以及原型对象的理解

    以下是一个构造函数的例子 如果是实例方法,不同的实例化,它们引用的地址是不一样的,是唯一的. //定义一个构造函数 function People(name,age){ this.name=name; this.age=age; this.dothings=function(){ retrun this.name+this.age; } } var people1 = new People("panda1",25); var people2 = new People("pan

  • 详解JS构造函数中this和return

    先看一段代码, function Foo(name,age){ this.name=name; this.age=age; } var foo=new Foo("Tom",14); foo.name;//Tom foo.age;//14 使用构造函数实例化发生的流程: 1.建立一个foo的空对象. 2.将构造函数中的Foo的this指向对象foo. 3.foo的_proto_属性指向Foo函数的prototype原型. 4.执行构造函数中的代码. 相对于普通函数,构造函数中的this是

  • js构造函数创建对象是否加new问题

    今天看到这样一道题: 填写"TO DO"处的内容让下面代码支持a.name = "name1"; b.name = "name2"; function Obj(name){ // TO DO } obj. /* TO DO */ = "name2"; var a = Obj("name1"); var b = new Obj; 问题1:new操作符做了些什么呢? 创建一个新对象: 将构造函数的作用域赋给新对

  • 深入理解JavaScript创建对象的多种方式以及优缺点

    写在前面 这篇文章讲解创建对象的各种方式,以及优缺点. 但是注意: 这篇文章更像是笔记,因为<JavaScript高级程序设计>写得真是太好了! 1. 工厂模式 function createPerson(name) { var o = new Object(); o.name = name; o.getName = function () { console.log(this.name); }; return o; } var person1 = createPerson('kevin');

随机推荐