JavaScript new的运行过程

参考 MDN网站的运算符

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

new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。new 关键字会进行如下的操作:

1)创建一个空的简单JavaScript对象(即{});
2)链接该对象(即设置该对象的构造函数)到另一个对象 ;
3)将步骤1新创建的对象作为this的上下文 ;
4)如果该函数没有返回对象,则返回this。

复现代码如下:

 1 <script type="text/javascript">
 2     function Person(name,age){
 3         this.name=name;
 4         this.age=age;
 5         //return this; 6     }
 7     Person.prototype.say=function(sth){
 8         console.log('I Say:'+sth);
 9     };
10 
11     function _new(){
12         //创建一个简单的空对象
13         var obj={};
14         //获取构造函数
15         var _Constructor=arguments[0];
16         //链接到原型
17         obj=Object.create(_Constructor.prototype);//obj.__proto__=_Constructor.prototype;__proto__不推荐使用 见https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
18         
19         //获取构造函数的参数列表的值
20         var _args=Array.prototype.slice.call(arguments,1);
21         //将构造函数绑定到this值(result值)
22         var result = _Constructor.apply(obj,_args);
23         //判断构造函数是否return非构造函数this的值,若是非对象则忽略返回构造函数this值,若是对象则返回构造函数return的对象
24         return typeof result === "object" ? result : obj;//如果返回值是一个对象就返回该对象,否则返回构造函数的一个实例对象
25     };
26     var newPerson=new Person('orgin',1);
27     var _newPerson=_new(Person,'my',2);
28     
29     console.log(newPerson);
30     console.log(_newPerson);
31 
32     var newPerson2=new Person;
33     var _newPerson2=_new(Person);
34     console.log(newPerson2);
35     console.log(_newPerson2);
36 </script>

 

posted @ 2019-09-08 16:33  润润润  阅读(578)  评论(0编辑  收藏  举报