js 理解new的运行机制
先上段代码:
function People(name) {
this.name = name;
}
People.prototype.sayName = function () {
console.log(this.name);
}
var man1 = new People('xiaos');
console.log(man1.name)
man1.sayName();
接下来我们分析下上述代码:
1. 1-3行我们创建了一个People的函数,应为将来要用作构造函数来实例化对象,所以首字母大写(这是好的习惯,也是一种默认的都会遵守的规定吧)
2. 5-7在People的原型对象上添加了sayName方法,什么是原型对象呢?会有另外一篇文章来单独介绍,后续补充~~
3. 第9行,使用new运算符实例化了一个man1对象。这是我们这篇要研究的问题,下面会详细阐述~
4. 第10行打印输出man1的name,第11行调用man1的sayName方法
那么问题来了,分析4中为什么能取到name属性和sayName方法呢??其实,这关键在于第3步,new的作用。
那么new究竟做了什么呢?大致分三步,我们用代码分析下过程吧:
var obj = {}; // 首先创建一个空的对象
obj.__proto__ = People.prototype; // 将空对象的__proto__指向构造函数的原型对象,也就是这句导致上面实例化的对象man1拥有了sayName方法,其实这里是继承了原型对象上的sayName方法
People.call(obj, 'xiaos'); // 调用People的构造方法,也就是这句导致man1拥有了name属性,有关call用法,本篇暂不介绍了,后续补充;这里简单理解就是People中的this变成了obj
return obj; // 返回对象,此刻man1来接收,所以就同时拥有了People的构造函数中的属性还有原型上的方法
js 理解new的运行机制的更多相关文章
- <转>ASP.NET学习笔记之理解MVC底层运行机制
ASP.NET MVC架构与实战系列之一:理解MVC底层运行机制 今天,我将开启一个崭新的话题:ASP.NET MVC框架的探讨.首先,我们回顾一下ASP.NET Web Form技术与ASP.NET ...
- 深入理解struts的运行机制
扫码关注公众号,不定期更新干活 在此申明本博文并非原创,原文:http://blog.csdn.net/lenotang/article/details/3336623,本文章是在此文章基础上进行优化 ...
- 理解PHP的运行机制
PHP是一种纯解释型在服务端执行的可以内嵌HTML的脚本语言,尤其适合开发Web应用程序.请求一个 PHP 脚本时,PHP 会读取该脚本,并将其编译为 Zend 操作码,这是要执行的代码的一种二进制表 ...
- JS核心系列:理解 new 的运行机制
和其他高级语言一样 javascript 中也有 new 运算符,我们知道 new 运算符是用来实例化一个类,从而在内存中分配一个实例对象. 但在 javascript 中,万物皆对象,为什么还要通过 ...
- v8是怎么实现更快的 await ?深入理解 await 的运行机制
最近v8团队发表一篇博客Faster async functions and promises, 预计在v7.2版本实现更快的异步函数和promise. 文章内容看起来不是很容易理解,背后的原理比较隐 ...
- HttpModule的认识与深入理解及MVC运行机制
转自:http://kb.cnblogs.com/page/50130/ ASP.NET MVC架构与实战系列之二:理解MVC路由配置 http://www.cnblogs.com/jyan/arch ...
- JS运行机制之 Event Loop 的思考
先举个栗子,如下: for (var i = 0; i < 5; i++) { setTimeout(function() { console.log('i: ',i); //一秒之后输出几乎没 ...
- 深入理解JavaScript运行机制
深入理解JavaScript运行机制 前言 本文是写作在给团队新人培训之际,所以其实本文的受众是对JavaScript的运行机制不了解或了解起来有困难的小伙伴.也就是说,其实真正的原理和本文阐述的并不 ...
- 简述JavaScript的运行机制
想要理解JavaScript的运行机制,需要分别深刻理解以下几个点: · JavaScript的单线程机制 · 任务队列(同步任务和异步任务) · 事件和回调函数 · 定时器 · Event Loop ...
随机推荐
- WCF学习之旅—WCF第二个示例(五)
二.WCF服务端应用程序 第一步,创建WCF服务应用程序项目 打开Visual Studio 2015,在菜单上点击文件—>新建—>项目—>WCF服务应用程序.在弹出界面的“名称”对 ...
- PHP的性能演进(从PHP5.0到PHP7.1的性能全评测)
本文是最初是来自国外的这篇:PHP Performance Evolution 2016, 感谢高可用架构公众号翻译成了中文版, 此处是转载的高可用架构翻译后的文章从PHP 5到PHP 7性能全评测( ...
- Android 在Service中弹出对话框
1.在Androidmanifest.xml中插入 <uses-permission android:name="android.permission.SYSTEM_ALERT_WIN ...
- Android 如何制作九宫格图片(.9.png)
对于编程人员来说,尤其是前端设计设计师,九宫格图片是必须的(.9.png),对于初学者来说不知道这个九宫格图片有什么用,其实这个九宫格图片实际常用在Android的button组件.要上下拉升的背景图 ...
- Objective-C中的Block(闭包)
学习OC有接触到一个新词Block(个人感觉又是一个牛气冲天的词),但不是新的概念,不是新的东西.学过Javascript的小伙伴对闭包应该不陌生吧~学过PHP的应该也不陌生,在PHP5.3版本以后也 ...
- JavaScript的Tab切换
在网页设计中经常要用到tab切换,遂整理了一下常用的两种方法. 先看一下示例代码: HTML: <!doctype html> <html lang="en"&g ...
- tomcat:there is no resources that can be added or removed from server
原因: 1.不是web project 解决方式:project-->property--project facet 新建或者修改 2. 版本不兼容 升级tomcat版本
- css截断长文本显示
实现 截断长文本显示处理,以前是通过后台的截取,但这种方法容易丢失数据,不利于SEO. 而通过前端css的截断,则灵活多变,可统一运用与整个网站. 这项技术主要运用了text-overflow属性,这 ...
- 1Z0-053 争议题目解析707
1Z0-053 争议题目解析707 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 707.Because of a logical corruption in the EMPLOY ...
- 相克军_Oracle体系_随堂笔记012-undo
undo表空间中undo段是自动生成的,oracle自动使用undo表空间的undo段. 作为高级DBA,需要了解Oracle是如何使用undo段的.这样出了性能问题才能够解决. 1.Undo表空 ...