深入理解javascript new的机制
我们在使用对象的时候,除了一些浏览器内置的单体对象可以直接使用外,都会new一个出来使用。
1.最简单的莫过于如下获取一个Object对象实例
var obj = new Object();
说明:此时的new关键字干了最有用的一件事就是,继承了所有Object.prototype上的方法,这个可以去查看一下es5的参考资料中Object.prototype的方法列表。也就是说此时的obj对象可以使用所有继承而来的方法了!
2.然而是构造函数模式让我们对new有了一个深入的了解!
function Person(name,age){
this.name = name;
this.age = age;
this.sayName = function(){
console.log(this.name);
}
}
var person1 = new Person("wang",);
var person2 = new Person("jiang",);
var person3 = new Person;//当不传参数的时候
我们很容易知道构造函数使得每个实例都独自获取了一份属性和方法。但是这是怎么实现出来的呢?
new过程中发生了什么?
1).创建一个对象。
2).将构造函数的作用域赋给新对象(因此this就指向了新对象)
3).执行构造函数中的代码(为新对象添加属性)
4).返回新对象
值得注意的是它们的继承关系是:person1/person2/person3继承于Person,而Person继承于Object(一切对象皆继承于Object)
如果理解了上面的东西,在一些简单编程中遇到new,基本也够了。
下面继续继续介绍一些有关new的话题
3.模块模式(Moudle模式),下面讲解一个最简单的模块模式例子
var Calculator = function (eq) {
//这里可以声明私有成员
var name = ;
var eqCtl = document.getElementById(eq);
return {
// 暴露公开的成员
name : name,
add: function (x, y) {
var val = x + y;
eqCtl.innerHTML = val;
}
};
};
var c1 = new Calculator('eq');
var c2 = new Calculator('la');
c1.name = ;//c1的name属性改变了却不会影响c2的name属性
console.log(c1);
console.log(c2);
c1.add(, );
值得注意的是,在Calculator这个构造函数中返回了一个对象!
说明:如果构造函数中返回了一个对象,(第4步)那么new出来的对象将会被返回的对象覆盖。模块模式的结果是c1和c2都从返回的对象copy了一份属性和方法,它们之间互不影响。
继承关系也变了,c1和c2都直接继承于Object
深入理解javascript new的机制的更多相关文章
- 深入理解JavaScript事件循环机制
前言 众所周知,JavaScript 是一门单线程语言,虽然在 html5 中提出了 Web-Worker ,但这并未改变 JavaScript 是单线程这一核心.可看HTML规范中的这段话: To ...
- 深入理解JavaScript运行机制
深入理解JavaScript运行机制 前言 本文是写作在给团队新人培训之际,所以其实本文的受众是对JavaScript的运行机制不了解或了解起来有困难的小伙伴.也就是说,其实真正的原理和本文阐述的并不 ...
- JavaScript可否多线程? 深入理解JavaScript定时机制
JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...
- 深入理解JavaScript定时机制和定时器注意问题
容易欺骗别人感情的JavaScript定时器 JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不 ...
- JavaScript可否多线程? 深入理解JavaScript定时机制(转载)
说明:最近写 js 时需要用setinterval函数做定时操作,谁知道,刚开始后运行完好,但一段时间后他就抽风了,定时任务运行的时间间隔越来越短,频率加快,这是一个完全不能容忍的问题,带着一个可以出 ...
- 深入理解JavaScript定时机制
容易欺骗别人感情的JavaScript定时器 JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不 ...
- 简述JavaScript的运行机制
想要理解JavaScript的运行机制,需要分别深刻理解以下几个点: · JavaScript的单线程机制 · 任务队列(同步任务和异步任务) · 事件和回调函数 · 定时器 · Event Loop ...
- 全面理解Javascript中Function对象的属性和方法
http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...
- 阅读《深入理解JavaScript定时机制》
鸟哥的这篇<深入理解JavaScript定时机制>从javascript线程角度分析了setTimeout和setInterval两个定时触发器的实现原理. 看完的体验就是主要要记住两点: ...
随机推荐
- apache 提示You don't have permission to access /test.php on this server.怎样解决
原文:apache 提示You don't have permission to access /test.php on this server.怎样解决 关键字: Apache 403 For ...
- Linux经常使用的命令-权利管理命令-权利管理命令chmod
指令名字:chmod 命令英语的意图:change the permissions mode of a file 凡路径命令:/bin/chmod 语法:chmod [{ugoa}{+-=}{rwx} ...
- java Json字符串转List<Map>类型
//相关包 import com.google.gson.Gson; import com.google.gson.JsonElement; import com.google.gson.JsonPa ...
- Canvas旋转图片--保持相同大小的算法
function drawImg(angle) { canvas.width = canvas.width; var distance = size / 2 * Math.sqrt(2) ...
- SimpleInjector与MVC4集成,与Web Api集成,以及通过属性注入演示
SimpleInjector与MVC4集成,与Web Api集成,以及通过属性注入演示 1,与MVC集成 见http://simpleinjector.codeplex.com/wikipage? ...
- JS中call、apply的用法说明
JS Call()与Apply()的区别 ECMAScript规范给所有函数都定义了Call()与apply()两个方法,call与apply的第一个参数都是需要调用的函数对象,在函数体内这个参数就是 ...
- SQL ROW_NUMBER() OVER函数的基本用法用法
语法:ROW_NUMBER() OVER(PARTITION BY COLUMN ORDER BY COLUMN) 简单的说row_number()从1开始,为每一条分组记录返回一个数字,这里的ROW ...
- crawler_网络爬虫中编码的正确处理与乱码的解决策略
转载: http://hi.baidu.com/erliang20088/item/9156132bdaeae8949c63d134 最近一个月一直在对nutch1.6版进行中等层次的二次开发,本来是 ...
- 前端学习笔记(zepto或jquery)——对li标签的相关操作(四)
对li标签的相关操作——五种方式给奇数项li标签设置样式 demo演示: 1 2 3 4 5 6 7 // 详解: 通常我们为多个li添加样式时常用的是使用filter,但我们在第三节中可以看到fil ...
- c# WebBrowser开发参考资料
原文:c# WebBrowser开发参考资料 c# WebBrowser开发参考资料,所有资料的采集均来自网上 话说有了WebBrowser类,终于不用自己手动封装SHDocVw的AxWebBrows ...