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 ...
随机推荐
- 21_ConcurrentHashMap和ConcurrentSkipListMap
[简述] ConcurrentHashMap内部使用段(Segment)来表示这些不用的部分,每个段其实就是一个小的HashTable,他们有自己的锁,只要多个修改操作发生在不同的段上,他们就可以并发 ...
- python 进程池的使用
进程同步 进程的数据是独立存在的,进程也能加锁. from multiprocessing import Process, Lock def f(l,i): l.acquire() print('he ...
- scrum心得和团队作业
一.学习scrum心得 敏捷的介绍 最近上课我们了解到了敏捷,很多人开始谈论敏捷开发.研究敏捷开发,那么究竟什么才是敏捷开发呢? 简单的说,敏捷开发是一种以人为核心.迭代.循序渐进的开发方法.在敏捷开 ...
- js 浅拷贝有大用
如题 像浅拷贝.深拷贝这类的知识点我们应该都明白是怎么回事,大部分都是在面试的时候会被问到.大多让你实现一个深拷贝.现实中我们都用比较暴力直接的手段 JSON stringify. 一句话就搞定,管他 ...
- 深入解读TPC-C指标
深入解读TPC-C指标 TPC(Transactionprocessing Performance Council,事务处理性能委员会)是由数十家会员公司创建的非盈利组织,总部设在美国.TPC的成员主 ...
- 【Leetcode】【Medium】Maximum Subarray
Find the contiguous subarray within an array (containing at least one number) which has the largest ...
- ElasticSearch之常用插件安装命令
#head监控安装,推荐 bin/plugin -install mobz/elasticsearch-head #bigdesk集群状态,推荐 bin/plugin -install lukas-v ...
- ldconfig: /usr/lib/libpython2.6.so.1.0-gdb.py is not an ELF file - it has the wrong magic bytes at the start.
https://bugzilla.redhat.com/show_bug.cgi?id=562980
- Android Studio 独立引入(非友盟)微博分享和回调时问题
最近同事在做一个小项目时,由于产品的要求,Wap页面的分享规定不能使用友盟的社会化组件.他则不得不手动一个一个渠道的引入分享,好在渠道不多就三个,但是第一微博分享引入的时候问题就出现了. 问题一:li ...
- 由memcpy内存越界引发的问题 && delete 和 delete []的真正区别
今天遇到了一个问题,在程序运行到某处总会报访问到错误的地址的错误,而且每次报错的堆栈还都不一样,排查了一段时间,发现是memcpy这里出了错 ]; memset(d, , data.size() * ...