『JavaScript』new关键字
new关键字做了什么
在JavaScript中,使用new关键字后,意味着做了如下四件事情:
- 创建一个新的对象,这个对象的类型是object;
- 设置这个新的对象的内部、可访问性和[[prototype]]属性为构造函数(指prototype.construtor所指向的构造函数)中设置的;
- 执行构造函数,当this关键字被提及的时候,使用新创建的对象的属性;
- 返回新创建的对象(除非构造方法中返回的是‘无原型’)。
在创建新对象成功之后,如果调用一个新对象没有的属性的时候,JavaScript会延原型链向止逐层查找对应的内容。这类似于传统的‘类继承’。
注意:在第二点中所说的有关[[prototype]]属性,只有在一个对象被创建的时候起作用,比如使用new关键字、使用Object.create、基于字面意义的(函数默认为Function.prototype,数字默认为Number.prototype等)。它只能被Object.getPrototypeOf(someObject)所读取。没有其他任何方式来设置或读取这个值。
样例说明
ObjMaker = function() {this.a = 'first';};
ObjMaker只是一个用于作为构造器的方法,没有其他意义。
ObjMaker.prototype.b = 'second';
与其他函数类似, ObjMaker拥有一个可被我们修改的prototype属性. 我们添加一个属性b给它。与所有对象一样,ObjMaker也拥有一个不可访问的[[prototype]]属性,我们无法对其进行改变。
obj1 = new ObjMaker();
这里发生了三件事情:
- 一个叫obj1的空对象被创建,首先obj1与{}一致;
- obj1的[[prototype]]属性被设置为ObjMaker的原型属性的拷贝;
ObjMaker方法被执行,所以obj1.a被设置为‘first‘。
obj1.a;
返回'first'。
obj1.b;
obj1没有'b'属性,所以JavaScript在它的[[prototype]]中查找。它的[[prototype]]与ObjMaker.prototype属性一致。而ObjMaker.prototype属性有一个叫'b'的属性,其值为'second',所以返回'second'。
模仿继承
你可以使用如下的方式实例化ObjMaker类的子类:
SubObjMaker = function () {};
SubObjMaker.prototype = new ObjMaker();
由于这里使用了new关键字,所以SubObjMaker的[[prototype]]属性被设置为ObjMaker.prototype的一个拷贝。
SubObjMaker.prototype.c = 'third';
obj2 = new SubObjMaker();
obj2的[[prototype]]属性被设置为SubObjMaker的prototype属性的一个拷贝。
obj2.c;
返回'third'。来自SubObjMaker.prototype
obj2.b;
返回‘second’。来自ObjMaker.prototype
obj2.a;
返回‘first’。来自SubObjMaker.prototype,这是因为SubObjMaker是使用ObjMaker的构造方法创建的,这个构造方法赋值给a。
『JavaScript』new关键字的更多相关文章
- 『JavaScript』核心
弱类型语言 JavaScript是一种弱类型的语言.变量可以根据所赋的值改变类型.原始类型之间也可以进行类型转换.其弱类型的物质为其带来了极大的灵活性. 注意:原始类型使用值传递,复合类型使用引用传递 ...
- 『JavaScript』封装
封装可以被定义为对对象的内部数据表现形式和实现细节进行隐藏.通过封装可以强制实施信息隐藏. 在JavaScript中,并没有显示的声明私有成员的关键字等.所以要想实现封装/信息隐藏就需要从另外的思路出 ...
- 『JavaScript』模仿接口
JavaScript中并没有内置的创建或实现接口的方法.这里将利用JavaScript的灵活性,来实现与接口意义相同的功能. 什么是接口? 接口的好处: 接口提供了一种用以说明一个对象应该具有哪些方法 ...
- 『设计』Laura.Compute 设计思路
前言: 前一篇文章 <『开源』也顺手写一个 科学计算器:重磅开源> ,继 Laura.Compute 算法开源之后,有 博客园 园友 希望公开一下 Laura.Compute算法 的 设计 ...
- 『cs231n』通过代码理解风格迁移
『cs231n』卷积神经网络的可视化应用 文件目录 vgg16.py import os import numpy as np import tensorflow as tf from downloa ...
- 『Matplotlib』数据可视化专项
一.相关知识 官网介绍 matplotlib API 相关博客 matplotlib绘图基础 漂亮插图demo 使用seaborn绘制漂亮的热度图 fig, ax = plt.subplots(2,2 ...
- 『AngularJS』理解$Scope
理解$Scope 执行概要 在AngularJS,一个子scope通常原型继承于它的父scope.应用于这个规则的表达式是一个使用scope:{...}的指令,这将创建一个『孤岛』scope(非原型继 ...
- 『StabilityGuide』| 10+位阿里技术专家共同发起稳定性知识库开源项目
我们穿过山和大海,也见过人山人海.我们见过各类故障,也排过千雷万险.这一次,不如我们一起,开启稳定性的探索之旅.让无法解决的问题少一点点,让世界的确定性多一点点. 无论是前端业务的开发者,还是后端架构 ...
- 『AngularJS』$location 服务
项目中关于 $location的用法 简介 $location服务解析在浏览器地址栏中的URL(基于window.location)并且让URL在你的应用中可用.改变在地址栏中的URL会作用到$loc ...
随机推荐
- STL - priority_queue(优先队列)
参考:http://www.cnblogs.com/xzxl/p/7266404.html 一.基本定义: 优先队列容器与队列一样,只能从队尾插入元素,从队首删除元素.但是它有一个特性,就是队列中最大 ...
- samb共享
1. 2. 3. ssh root@192.168.10.1 cd /etc smbpasswd -a root 在提示下创建新密码即可 4. 在Mac下的finder内使用快捷键command + ...
- R 代码积累
R 代码积累不定期更新 1.阶乘.递归.reduce.sprintf #NO.1 # 阶乘函数 fact <- function(n){ if(n==0) return(1) #基例在这 els ...
- 【luogu P2385 青铜莲花池】 题解
题目链接:https://www.luogu.org/problemnew/show/P2385 莲花池什么的最漂亮啦! 最近刷了两天搜索= =我搜索一直是弱菜 直接套bfs #include < ...
- 手机移动端 web整合
meta基础知识 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- Javascript文件中的控制器I
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- data-ng-model 指令
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- RabbitMQ消息中间件极速入门与实战
1:初识RabbitMQ RabbitMQ是一个开源的消息代理和队列服务器,用来通过普通协议在完全不同的应用之间共享数据,RabbitMQ是使用Erlang语言来编写的,并且RabbitMQ是基于AM ...
- 你不知道的javaScript笔记(1)
规避冲突 function foo(){ function bar(a){ i = 3; console.log(a + i); } for ( var i=0; i < 10; i++){ b ...
- PHP大数组,大文件的处理
[原文来自于转载, 但他的结论不太正确, 尤其对foreach的判断这块上, 我拎过来进行修理 ] 在做数据统计时,难免会遇到大数组,而处理大数据经常会发生内存溢出,这篇文章中,我们聊聊如何处 ...