JavaScript中new操作符详解

小云云
Lepaskan: 2018-02-07 14:43:24
asal
1649 orang telah melayarinya

JavaScript里实例化一个对象的时候,我们常用的方法就是使用new操作符。  本文主要和大家分享JavaScript中new操作符详解,希望能帮助到大家。

var Foo = function(x, y) {    this.x = x    this.y = y
}var foo = new Foo(1, 2) // Foo {x: 1, y: 2}
Salin selepas log masuk

那么new操作符到底做了哪些工作?我们可以看一下foo这个对象到底是一个怎样的对象。

首先,foo本身是一个对象,然后,他本身有两个属性,x跟y。同时,在大多数浏览器的控制台上,我们还能看到一个颜色稍浅的属性,叫__proto__,他有两个属性,constructor跟__proto__。

__proto__是一个访问器属性。他指向的是当前对象本身的[[Prototype]],这个[[Prototype]]并不是一个属性,他只是一个符号,代表的是构造函数Foo的原型对象Foo.prototype的,具体可以参考一下MDN上的描述

           
foo.__proto__ === Foo.prototype // true
Salin selepas log masuk

所以,我们大致描述一下

           
var Foo = function(x, y) {    this.x = x    this.y = y
}// 1. 创建一个空对象var foo = {}// 2. 调用构造函数,并且将构造函数的`this`指向fooFoo.call(foo, 1, 2)// 3. foo继承Foo的原型对象foo.__proto__ = Foo.prototype
Salin selepas log masuk

等等,虽然我们上面这么写最后foo的确跟new Foo()出来的对象是一样的,但是情况并不仅仅这么简单。

我们知道,new操作符操作的是一个函数,在上面的栗子里,函数Foo并没有显式地返回任何值,所以执行这个函数之后,返回值是undefined。当构造函数没有显式地返回一个值的时候,对其执行new操作之后,会返回这个构造函数实例化之后的对象。

那如果我返回了某个值呢?

           
var Foo = function(x, y) {    this.x = x    this.y = y    return {        a: this.x
    }
}var foo = new Foo(1, 2) // {a: 1}
Salin selepas log masuk

foo就是执行这个函数之后的返回值,那么这个时候new Foo()跟Foo()就没有任何区别了,所以通常情况下,我们并不会选择在一个构造函数里返回某个值。

特别要注意的是,如果你在构造函数里返回的不是一个对象,而是一个普通的值,比如说一个Number类型或者String类型的值,那么new之后返回的还是实例化之后的对象。

相关推荐:

js函数的new调用与普通调用中this的差异问题

关于new从一个BUG说起

js中的new操作符运行过程是怎样的

Atas ialah kandungan terperinci JavaScript中new操作符详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!