作用

是创建一个对象实例。这个对象可以是用户自定义的,也可以是一些系统自带的带构造函数的对象。

描述

创建一个对象类型需要创建一个指定了名称和属性的函数;其中这些属性可以指向它本身,也可以指向其他对象,看下面的例子:

当代码 new hFive(…) 执行时:

一个新对象被创建。它继承自hFive.prototype.

构造函数 hFive() 被执行。执行的时候,相应的传参会被传入,同时上下文 this 会被指定为这个新实例。new hFive等同于 new hFive(), 只能用在不传递任何参数的情况。

如果构造函数返回了一个“对象”,那么这个对象会取代整个new出来的结果。如果构造函数没有返回对象,那么new出来的结果为步骤1创建的对象,ps:一般情况下构造函数不返回任何值,不过用户如果想覆盖这个返回值,可以自己选择返回一个普通对象来覆盖。当然,返回数组也会覆盖,因为数组也是对象。

任何情况下都可以对任意一个对象添加新的属性,比如 hFive.color = “black” 这句代码给hFive添加了一个新的属性color , 然后给这个属性赋值 “black”。然而,这个操作不会影响任何其他对象。

如果想给所有同样类型的对象添加属性,你需要给hFive这个对象类型来添加属性。你可以通过给 hFive.prototype 添加属性的方式来给所有先前定义的实例来添加属性。这种定义属性的方式会影响到所有通过new构造函数创建的对象,因为它们共享了这个对象类型。

举例

(以函数hFive为例说明)

1.通过” . “的方式给hFive添加的方法或属性,使用new关键字实例的对象不会继承,但是hFive本身可以使用。

var hFive=function(){
this.name="默@语";
this.url="h-five.com";
this.says=function(){
alert("hello guys! here is MoYu. Welcome to herer");
}
} hFive.other=function(){
alert("是通过' . '添加的方法。");
} var c=new hFive();
c.says();//hello guys! here is MoYu. Welcome to herer.
hFive.other();//是通过' . '添加的方法。
c.other();//c.others is not a function

2.通过原型链prototype添加的方法,使用new关键字实例的对象会继承,hFive自己不能使用。

var hFive=function(){
this.name="默@语";
this.url="h-five.com";
this.says=function(){
alert("hello guys! here is MoYu. Welcome to herer");
}
} hFive.prototype.other=function(){
alert("是通过' . '添加的方法。");
} var c=new hFive();
c.says();//hello guys! here is MoYu. Welcome to herer.
c.other();//是通过' . '添加的方法。
hFive.other();//hFive.other is not a function

瞎扯淡

直接使用hFive获取hFive内部的属性或者方法会出错,提示undefined或者hFive.says is not a function。因为此时hFive只是被赋值为一个函数(相当于只是声明了一样),并没有执行,所以会有上面的提示,当执行hFive()后,在直接使用hFive直接使用hFive获取hFive内部的属性或者方法同样会出错,因为此时hFive()执行的上下文是window,所以内部的this指代的是全局对象window,使用window.url或window.says()则不会报错;

东拉西扯

1.下面代码中f能否调用a()和b()方法

var F = function(){};
Object.prototype.a = function(){ console.log("O");};
Function.prototype.b = function(){console.log("F");};
var f = new F();
f.a();//0
f.b();//f.b is not a function
console.log(f instanceof Function);//false
console.log( typeof f);//true
F.b();//F

f只能调用a方法,不能调用b方法,因为通过new关键字创建的是一个对象实例 ,他是一个对象,所以它能继承Object.prototype,也就能使用a放法。通过Function.prototyp添加的方法能被所有的Function对象使用,所以f不能调用b方法,但是F能调用b方法,因为它是一个function对象,function对象继承Function.prototype,是Function的一个实例,所以它也是Function对象,也就能使用b方法。

2.下面代码,a的值是多少,b的只是多少。

var a = {n: 1};
var b = a;
a.x=a = {n: 2};
console.log(b.x);//Object {n: 2}
console.log(b);//Object {n: 1, x: Object}
console.log(a);//Object {n: 2}
console.log(a.x);//undefined

当代码执行到 a.x=a = {n: 2}; 时,赋值运算符会从右向左赋值,首先a = {n: 2},javascript会创建一个新的对象,并用a指向它,a原来的值被覆盖,执行完之后执行a.x=a,但此时a.x的a并不是=后面的a,a.x的a是以前的a,也就是b(因为之前a被复制给了b),所以最后结果如上所示。

参考文档

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/new

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function

原创,转载请注明来源,默@语:www.h-five.com

JavaScript学习笔记–(new关键字)的更多相关文章

  1. JavaScript:学习笔记(4)——This关键字

    JavaScript:学习笔记(4)——This关键字 以前这篇帖子是关于闭包的,但是我想弄明白的其实是This关键字.JavaScript的this和Java等面向对象语言中的this大不一样,bi ...

  2. JavaScript:学习笔记(7)——VAR、LET、CONST三种变量声明的区别

    JavaScript:学习笔记(7)——VAR.LET.CONST三种变量声明的区别 ES2015(ES6)带来了许多闪亮的新功能,自2017年以来,许多JavaScript开发人员已经熟悉并开始使用 ...

  3. JavaScript:学习笔记(6)——New运算符

    JavaScript:学习笔记(6)——New运算符 new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例. 快速开始 当你使用new关键字的时候,会 创建一个新的对象 将th ...

  4. JavaScript:学习笔记(5)——箭头函数=>以及实践

    JavaScript:学习笔记(5)——箭头函数=>以及实践 ES6标准新增了一种新的函数:Arrow Function(箭头函数).本文参考的链接如下: MDN箭头函数:https://dev ...

  5. Java程序猿的JavaScript学习笔记(汇总文件夹)

    最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...

  6. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  7. Java程序猿JavaScript学习笔记(2——复制和继承财产)

    计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...

  8. Java程序猿的JavaScript学习笔记(3——this/call/apply)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  9. Java程序猿JavaScript学习笔记(4——关闭/getter/setter)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  10. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

随机推荐

  1. Verilog学习笔记简单功能实现(七)...............接口设计(并行输入串行输出)

    利用状态机实现比较复杂的接口设计: 这是一个将并行数据转换为串行输出的变换器,利用双向总线输出.这是由EEPROM读写器的缩减得到的,首先对I2C总线特征介绍: I2C总线(inter integra ...

  2. linux下搭建php的集成环境

    一个偶然的机会,在项目中需要搭建PHP的环境,由于PHP开发需要的东西比较多,像apache.mysql.PHP环境等,如果一个一个装很可能会有安装不全的问题,为此选择了安装集成环境,这里选择的是xa ...

  3. js控制页面显示和表单提交

    早期的web页面在显示方面一般在后台进行控制,虽然对后台开发来讲是比较容易做到的,但是涉及到一个问题,那就是数据库压力. 因为要控制显示,所以会比较频繁的从数据库中来回调用. 现在的js功能越来越强, ...

  4. linux下使用taskset设置进程cpu绑定不起作用

    自从大规模使用了虚拟化之后,大流量时soft interrupt在某个cpu很高就是个严重的问题,最近一有时间就研究这个问题,如果网卡本身不支持多队列的话,有没有办法缓解这个问题. 一开始使用rps, ...

  5. <记录学习>(前三天)京东页面各种注意点

    培训学校第1到3天先学习HTML现在流行的是HTML5,目前学习的是HTML5规范.(给有基础一定的人学习)前三天学习的是京东页面的编写,和以前写的不同,页面看上去和自己写的一样,但老师讲的还是有很多 ...

  6. jstl标签2

    我们前面讲的是ArrayList集合迭代,Hashmap/Hashset的情况下 举例: <h3>对map和set的迭代</h3> 放入字符串 <% //模拟 Map m ...

  7. 使用 JavaScript 实现灵活的固定导航功能

    如果你想在网页中实现灵活的固定导航功能,那么 Smart Fixed Navigation 这个 JavaScript 小脚本可以帮助轻松实现一个固定的导航,让用户在访问你的网站的时候可以随时使用菜单 ...

  8. 深入理解:JavaScript原型与继承

    深入理解:JavaScript原型与继承 看过不少书籍,不少文章,对于原型与继承的说明基本上让人不明觉厉,特别是对于习惯了面向对象编程的人来说更难理解,这里我就给大家说说我的理解. 首先JavaScr ...

  9. SAP 应用服务负载均衡的实现

         共两步,一是服务器的设置,二是客户端登陆设置.     先在SAP中使用SMLG 进行服务器分组.实例名是SAP系统中定义过的,你没法删也没改.(可能是俺不会,会的教教).我们先建一个Gro ...

  10. Kali Linux (XFce版本)安装后的一些设置

    kali Linux的主版本自带的是Gnome桌面环境,安装后使用效率太低,不知道是不是我机器配置低的原因, 在虚拟机里运行起来太慢.卡.丑啦....所以以前都一直都在用Backbox Linux,并 ...