企业网站的综合要求,提取wordpress小工具,网站制作资讯,网站开发开题报告范文2019一、认识构造函数 我们先理解什么是构造函数#xff1f; 构造函数也称之为构造器#xff08;constructor#xff09;#xff0c;通常是我们在创建对象时会调用的函数#xff1b;在其他面向的编程语言里面#xff0c;构造函数是存在于类中的一个方法#xff0c;称之为构造…一、认识构造函数 我们先理解什么是构造函数 构造函数也称之为构造器constructor通常是我们在创建对象时会调用的函数在其他面向的编程语言里面构造函数是存在于类中的一个方法称之为构造方法但是JavaScript中的构造函数有点不太一样 JavaScript中的构造函数是怎么样的
构造函数也是一个普通的函数从表现形式来说和千千万万个普通的函数没有任何区别那么如果这么一个普通的函数被使用new操作符来调用了那么这个函数就称之为是一个构造函数
那么被new调用有什么特殊的呢
二、new操作符调用的作用
如果一个函数被使用new操作符调用了那么它会执行如下操作
在内存中创建一个新的对象空对象这个对象内部的[[prototype]]属性会被赋值为该构造函数的prototype属性后面详细讲构造函数内部的this会指向创建出来的新对象执行函数的内部代码函数体代码如果构造函数没有返回非空对象则返回创建出来的新对象 三、认识对象的原型
JavaScript当中每个对象都有一个特殊的内置属性 [[prototype]]这个特殊的对象可以指向另外一个对象。
那么这个对象有什么用呢
当我们通过引用对象的属性key来获取一个value时它会触发 [[Get]]的操作这个操作会首先检查该对象是否有对应的属性如果有的话就使用它如果对象中没有该属性那么会访问对象[[prototype]]内置属性指向的对象上的属性
那么如果通过字面量直接创建一个对象这个对象也会有这样的属性吗如果有应该如何获取这个属性呢
答案是有的只要是对象都会有这样的一个内置属性
获取的方式有两种
方式一通过对象的 __proto__ 属性可以获取到但是这个是早期浏览器自己添加的存在一定的兼容性问题方式二通过 Object.getPrototypeOf 方法可以获取到
四、函数的原型 prototype
那么我们知道上面的东西对于我们的构造函数创建对象来说有什么用呢
它的意义是非常重大的接下来我们继续来探讨
这里我们又要引入一个新的概念所有的函数都有一个prototype的属性 你可能会问题是不是因为函数是一个对象所以它有prototype的属性呢
不是的因为它是一个函数才有了这个特殊的属性而不是它是一个对象所以有这个特殊的属性
我们前面讲过new关键字的步骤如下 1.在内存中创建一个新的对象空对象 2.这个对象内部的[[prototype]]属性会被赋值为该构造函数的prototype属性
那么也就意味着我们通过Person构造函数创建出来的所有对象的[[prototype]]属性都指向构造函数的prototypePerson.prototype
五、创建对象的内存表现 六、constructor属性
事实上原型对象上面是有一个属性的constructor
默认情况下原型上都会添加一个属性叫做constructor这个constructor指向当前的函数对象
七、重写原型对象
如果我们需要在原型上添加过多的属性通常我们会重新整个原型对象 前面我们说过, 每创建一个函数, 就会同时创建它的prototype对象, 这个对象也会自动获取constructor属性
而我们这里相当于给prototype重新赋值了一个对象, 那么这个新对象的constructor属性, 会指向Object构造函数, 而不是Person构造函数了。
如果希望constructor指向Person那么可以手动添加
上面的方式虽然可以, 但是也会造成constructor的[[Enumerable]]特性被设置了true.默认情况下, 原生的constructor属性是不可枚举的.
如果希望解决这个问题, 就可以使用我们前面介绍的Object.defineProperty()函数
八、构造函数和原型组合 我们在上一个构造函数的方式创建对象时有一个弊端我们需要为每个对象的函数去创建一个函数对象实例会创建出重复的函数比如running、eating这些函数。
那么有没有办法让所有的对象去共享这些函数呢? 可以将这些函数放到Person.prototype的对象上即可
