美文网首页
js中new关键字到底做了什么...

js中new关键字到底做了什么...

作者: heachou | 来源:发表于2017-05-03 09:47 被阅读0次

直接看代码:
<pre>
var test = function(){
console.log(this)
}
test() // 浏览器中 this 指向的是window
//通过new关键字
new test()//指向test
</pre>
说明new关键字改变了this的指向,那么在这个过程中到底做了些什么呢?
上代码:
<pre>
// 创建一个构造函数
var Person = function(name, age) {
this.name = name;
this.age = age;
this.getName = function(){
return this.name;
}
}

// 将构造函数以参数的形式传入
function New(func) {
// 需要返回的
var res = {};

if(func.prototype !== null){
// 将实例的proto指向构造函数的原型
res.proto = func.prototype;
}
// 如果构造函数有返回结果,用ret接收,通过apply,将构造函数的this指向实例res;
var ret = func.apply(res,Array.prototype.slice.call(arguments,1));

if((typeof ret === 'object' || typeof ret === 'function' )&& ret != null){
return ret;
}
return res;
}

var p1 = New(Person, 'tom', 20);
var name = p1.getName();
console.log(name);//tom
console.log(p1 instanceof Person);//true

var p2 = new Person('jerry',10);
console.log(p2.age);//10
console.log(p2 instanceof Person);//true

</pre>
可以看出,在new的过程中,主要实现了如下过程
1.声明一个中间对象
2.将该中间对象的proto指向构造函数的原型
3.将构造函数的this通过apply指向中间对象
4.返回该中间对象,也就是返回了实例对象

相关文章

  • js中new关键字到底做了什么...

    直接看代码: var test = function(){console.log(this)}test() // ...

  • new操作步骤

    js中的new()到底做了些什么?? 要创建 Person 的新实例,必须使用 new 操作符。以这种方式调用构造...

  • js new 运行机制

    js手札--js中new到底做了些啥JS核心系列:理解 new 的运行机制深入理解 Javascript 运行机制及原型

  • new操作符干了什么?

    我们可以一起通过代码实现来看看new关键字到底做了一些什么事情 输出结果如下图: 上例中,new关键字调用的构造函...

  • js中的new()到底做了些什么

    要创建 Person 的新实例,必须使用 new 操作符。以这种方式调用构造函数实际上会经历以下 4个步骤:(1)...

  • JS知识点

    new 这么一个东西,在 js 中到底是 做了哪些事情。简单来讲 js 在new 的过程中只做了三件事 1.创建一...

  • 前端常见面试题(十)@郝晨光

    new操作符干了什么? 我们可以一起通过代码实现来看看new关键字到底做了一些什么事情 输出结果如下图: 上例中,...

  • js学习札记-new关键字

    js 的new关键字解析的过程中引擎执行了很多步骤,我们可以自己写一个仿new的函数来实现new关键字。 说js ...

  • 简单案例来看JS中的面向对象

    在JS中,一般情况下我们都是直接写函数,直接调用,但是发现JS中也有new关键字,那么new关键字作为创建对象的关...

  • JS中的new做了什么

    用构造函数创建对象,new做了4步:

网友评论

      本文标题:js中new关键字到底做了什么...

      本文链接:https://www.haomeiwen.com/subject/pokktxtx.html