首页前端开发其他前端知识js中new的作用是什么

js中new的作用是什么

时间2023-04-27 03:48:02发布访客分类其他前端知识浏览1344
导读:这篇“js中new的作用是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“js中new的作用是什么”文章吧。...
这篇“js中new的作用是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“js中new的作用是什么”文章吧。

前言

在 JavaScript 中, 通过 new 操作符可以创建一个实例对象,而这个实例对象继承了原对象的属性和方法。因此,new 存在的意义在于它实现了 JavaScript 中的继承,而不仅仅是实例化了一个对象。

new 的作用

我们先通过例子来了解 new 的作用,示例如下:

functionPerson(name){

this.name=name
}

Person.prototype.sayName=function(){

console.log(this.name)
}
    
constt=newPerson('小明')
console.log(t.name)//小明
t.sayName()//小明

从上面的例子中我们可以得出以下结论:

  • new 通过构造函数 Person 创建出来的实例对象可以访问到构造函数中的属性。

  • new 通过构造函数 Person 创建出来的实例可以访问到构造函数原型链中的属性,也就是说通过 new 操作符,实例与构造函数通过原型链连接了起来。

构造函数 Person 并没有显式 return 任何值(默认返回 undefined),如果我们让它返回值会发生什么事情呢?

functionPerson(name){

this.name=name
return1
}
    
constt=newPerson('小明')
console.log(t.name)//小明

在上述例子中的构造函数中返回了 1,但是这个返回值并没有任何的用处,得到的结果还是和之前的例子完全一样。我们又可以得出一个结论:

构造函数如果返回原始值,那么这个返回值毫无意义。

我们再来试试返回对象会发生什么:

functionPerson(name){

this.name=name
return{
age:23}

}

constt=newPerson('小明')
console.log(t)//{
age:23}
    
console.log(t.name)//undefined

通过上面这个例子我们可以发现,当返回值为对象时,这个返回值就会被正常的返回出去。我们再次得出了一个结论:

构造函数如果返回值为对象,那么这个返回值会被正常使用。

总结:这两个例子告诉我们,构造函数尽量不要返回值。因为返回原始值不会生效,返回对象会导致 new 操作符没有作用。

实现 new

首先我们要清楚,在使用 new 操作符时,js 做了哪些事情:

  1. js 在内部创建了一个对象

  2. 这个对象可以访问到构造函数原型上的属性,所以需要将对象与构造函数连接起来

  3. 构造函数内部的this被赋值为这个新对象(即this指向新对象)

  4. 返回原始值需要忽略,返回对象需要正常处理

知道了步骤后,我们就可以着手来实现 new 的功能了:

function_new(fn,...args){
    
constnewObj=Object.create(fn.prototype);
    
constvalue=fn.apply(newObj,args);
    
returnvalueinstanceofObject?value:newObj;

}
    

测试示例如下:

functionPerson(name){
    
this.name=name;

}

Person.prototype.sayName=function(){
    
console.log(this.name);

}
    ;
    

constt=_new(Person,"小明");
    
console.log(t.name);
    //小明
t.sayName();
    //小明

以上就是关于“js中new的作用是什么”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注行业资讯频道。

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

newjs

若转载请注明出处: js中new的作用是什么
本文地址: https://pptw.com/jishu/9841.html
怎么使用Node.js实现模拟车辆行驶 JavaScript中的内存管理方法是什么

游客 回复需填写必要信息