JS中new的过程发生了什么

一、JS中new的过程发生了什么?

从例子看方法

java 复制代码
function WhatNew(name){
	this.name = name
}
let news = new WhatNew('屈小康')

通过简单的构造模型创建对象。在说这个之前你需要了解,prototype和__proto__.

prototype属性:每一个构造函数(function a())都有一个prototype属性,它指向构造函数的指针(constructor)。

而__proto__这个方法是每个对象都包含的一个方法,它也指向(constructor)

js 复制代码
	WhatNew.prototype === news.__proto__ // true

我们都知道对象的继承是通过原型链的,而原型链就是通过__proto__一层一层网往上找而形成原型链的,找到最后找到null。

我们直接为构造函数添加一个原型方法。

js 复制代码
	WhatNew.prototype.add = function(x,y){
	return x + y 
}
news.add(1,2)

news的查找过程,现在自己的原型上查找,找不到再向他的上一层构造函数的原型上找,如果还是没有找到的话,往Object上找,找不到的话返回null

js 复制代码
news.__proto__.__proto__.proto__ == null

Object所以对象的实例,比如我们用的一些对象的方法,虽然你定义了,但是没有用。那就是因为继承了Object的原因。比如toString的等

js 复制代码
news.toString() // "[Object Object]"

接下来说明new的过程发生了那些事情:

1、new先创建一个新的对象

var news = new Object()

2、 我们将这个空对象的proto成员指向whatnew函数的对象prototype成员对象。

news.proto = whatnew.prototype

3、修改whatnew的this到object上面。

4、通过call(obj) 改变this指向

5、最后吧whatnew 返回给news就可以了

2、自己实现一个new方法
js 复制代码
	function Mynew(fun, ...arg){
		let obj = { //定义一个空对象
		__proto__ : fun.prototype // 该空对象的__proto__指向fun.prototype
		}
		fun.apply(obj,arg) //改变this指向obj
		return obj
	}
	function person (age , name){
	this.age = age
	this.name = name 
	}
	let mynew = Mynew(person,'1','2')

这样就实现了一个new的方法。

相关推荐
lly2024061 小时前
HTML与CSS:构建网页的基石
开发语言
一只会写代码的猫1 小时前
面向高性能计算与网络服务的C++微内核架构设计与多线程优化实践探索与经验分享
java·开发语言·jvm
2013编程爱好者2 小时前
Vue工程结构分析
前端·javascript·vue.js·typescript·前端框架
是小胡嘛3 小时前
C++之Any类的模拟实现
linux·开发语言·c++
csbysj20204 小时前
Vue.js 混入:深入理解与最佳实践
开发语言
不羁的fang少年4 小时前
前端常见问题(vue,css,html,js等)
前端·javascript·css
change_fate4 小时前
el-menu折叠后文字下移
前端·javascript·vue.js
Gerardisite5 小时前
如何在微信个人号开发中有效管理API接口?
java·开发语言·python·微信·php
Want5955 小时前
C/C++跳动的爱心①
c语言·开发语言·c++
coderxiaohan6 小时前
【C++】多态
开发语言·c++