JS中new运算符的实现原理
当我们用new运算符new一个构造函数产生一个实例时,比如说: var obj = new Func 时,其背后的步骤是这样的:
1:创建一个继承自 Func.prototype 的新对象;
2:执行构造函数 Func ,执行的时候,相应的传参会被传入,同时上下文(this)会被指定为第一步创建的新实例;
3:如果构造函数返回了一个“对象”,那么这个对象会取代步骤1中new出来的实例被返回。如果构造函数没有返回对象,那么new出来的结果为步骤1创建的对象。
注意:new Func 等同于new Func(),只能用在不传递任何参数的情况。
按照上述原理,写一段代码模拟new运算符的实现原理:
//new运算符原理实现
var new1 = function(fun){
var newObj = Object.create(fun.prototype);
var returnObj = fun.call(newObj);
if(typeof returnObj === 'object'){
return returnObj
}else{
return newObj
}
}
其中 var newObj = Object.create(fun.prototype) 的意思是:创建一个新对象newObj,并让 newObj.__proto__ 指向 fun,即 newObj.__proto__ === fun 返回true。
测试一下~
var strObj = new1(String);
alert(strObj instanceof String); //true
alert(strObj.__proto__.constructor === String); //true
可以看到,new1函数的运行效果和new运算符是一样的。我们继续给String的原型上添加一个方法,看看new1函数得到的strObj能否继承到这个方法:
String.prototype.defineByN = function(){
alert("我是自定义方法");
}
strObj.defineByN(); //弹出“我是自定义方法”
可以看到new1函数得到的strObj继承了到这个方法。
JS中new运算符的实现原理的更多相关文章
- js中的运算符和条件语句
js中的运算符大体上可以分为4类:1算术运算符.2一元操作符.3比较运算符.4逻辑运算符. 算术运算符一般指的是加减乘除求余这五种操作符:+,-,*,/,%.通过算术运算符可以对js中的变量进行操作. ...
- JavaScript 基础——使用js的三种方式,js中的变量,js中的输出语句,js中的运算符;js中的分支结构
JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...
- JS中的运算符和JS中的分支结构
JS中的运算符 1.算术运算(单目运算符) + .-.*. /. %取余.++自增 .--自减 +:两种作用,链接字符串/加法运算.当+两边全为数字时,进行加法运算:当+两边有任意一边为字符串时,起链 ...
- 让你彻底搞懂JS中复杂运算符==
让你彻底搞懂JS中复杂运算符== 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容易让人犯错,从而成为JavaScript中“最糟糕的特性”之一. 在仔细阅读了ECMA ...
- JS中的运算符_函数学习
js中的运算符: 算数运算符: + - * / % ++ -- 逻辑运算符: & | ! && || < > <= ...
- js中的运算符优先级顺序
js中运算符优先级从高到底的顺序: 算术操作符 → 比较操作符 → 逻辑操作符 → "="赋值符号
- JS中的运算符 以及变量和输入输出
1.算术运算(单目运算符) + 加 .- 减.* 乘. / 除. % 取余.++ 自增.-- 自减. >>> +:有两种作用,链接字符串/加法运算,当+两边全为数字时,进行加法运算, ...
- 浅谈JS中逗号运算符的用法
阅读本文的前提是,你能区分什么是表达式,什么是语句.还有明确运算符和运算数都是些啥东西.所谓的表达式就是一个JavaScript的"短语",JavaScript的解释器可以计算它, ...
- JS中短路运算符&&和||
在JS函数中我们经常会使用到短路运算符,主要是逻辑与(&&) 和 逻辑或(||) 1.逻辑与 && 的运算方式 var a = 5 && 6; cons ...
随机推荐
- 【转】46 个非常有用的 PHP 代码片段
1. 发送 SMS 在开发 Web 或者移动应用的时候,经常会遇到需要发送 SMS 给用户,或者因为登录原因,或者是为了发送信息.下面的 PHP 代码就实现了发送 SMS 的功能. 为了使用任何的语言 ...
- SSIS 使用OLEDB/ADO NET Source 数据流source控件 连接Oracle失败
在做数据提取的时候发现一个非常奇怪的问题. Oracle客户端是安装正确并且Toad可以正常运行的,但是在新建OLEDB/ADO NET Source 数据流source控件连接Oracle的时候一直 ...
- IntelliJ IDEA快速创建属性字段的get和set方法
1.写好属性字段后,在代码面板右击,选择generator… 再选择 Getter and Setter 全选中(Ctrl + A),点击OK! 2.也可以选择使用快捷键:alt+inse ...
- VC6.0创建DLL动态链接库四大要素
原文:http://blog.csdn.net/wanghaihao_1/article/details/51098451 要成功地编辑,编译和链接一个动态链接库,应该包括以下要素:建立工程文件,使用 ...
- 【Udacity】数据的差异性:值域、IQR、方差和标准差
一.值域(Range) Range = Max - Min 受异常值(Outliers)影响 二.四分位差(IQR) 四分位距(interquartile range, IQR),又称四分差.是描述统 ...
- 【Python】安装配置Anaconda
优点:解决Python 库依赖问题 清华安装镜像 https://mirrors.tuna.tsinghua.edu.cn/anaconda/archive/
- 新开篇关于vue
参考链接:http://cn.vuejs.org/v2/guide/instance.html 了解vue组件的生命周期: 1.beforeCreate 即将创建 2.created 创建 3.bef ...
- HTML,javascript,image等加载,DOM解析,js执行生命周期
- SQL点点滴滴_修改数据库的兼容级别
语法 ALTER DATABASE database_name SET COMPATIBILITY_LEVEL = { 80 | 90 | 100 } 参数 database_name 要修改的数据库 ...
- java Date中方法toLocaleString过时的替代方案
DateFormat ddf = DateFormat.getDateInstance(); DateFormat dtf = DateFormat.getTimeInstance(); DateFo ...