目录前言1. 构造函数2. new的过程2.1 基础使用2.2 new.target3. 手动实现一个构造函数前言 每个对象都是一个功能中心,具有明确分工,可以处理信息,处理信息,发
每个对象都是一个功能中心,具有明确分工,可以处理信息,处理信息,发出信息。面向对象编程具有灵活性、可复用性、模块化等好处,适合更多合作完成的大型项目。
构造函数的功能是生成对象,生成具有相同结构对象的函数。Java语言通过类实现面向对象,对象是类的实例,而javascript则是通过构造函数作为对象的模板,使用prototype实现继承。
构造函数的几个特点
function Person(name ){
this.name = name;
};
const jack = new Person('jack'); //Person {name: 'jack'}
function Person(name ){
this.name = name;
return name;
};
const jack = new Person('jack'); //Person {name: 'jack'}
function Person(name ){
this.name = name;
return ['jack'];
};
const jack = new Person('jack'); //['jack']
function Person(name ){
this.name = name;
};
const jack = new Person('jack');
const tom = new Person('tom');
console.log(jack); //Person {name: 'jack'}
console.log(tom); //Person {name: 'tom'}
直接执行构造函数会怎么样?
function Person(){
this.name = name;
};
const jack = Person('jack'); //undefined
构造函数的this指向了window,并没有返回一个对象,我们现在做以下兼容:
function Person(name){
if(!(this instanceof Person)){
return new Person(name);
};
this.name = name;
};
现在可以直接使用了
Person(name); //Object { name: "jack" }
在函数内部都可以使用new.target,如果函数是通过new.target调用的则返回被调用的构造函数否则返回undefined
function Person(){
console.log(new.target);
};
new Person(); //function Person(){...}
Person(); //undefined
现在使用new.target进行构造函数的兼容
function Person(name){
if(!(new.target === Person)){
return new Person(name);
};
this.name = name;
};
console.log(Person('jack')); //Object { name: "jack" }
function myNew() {
const args = Array.prototype.slice.call(arguments);
const construct = args.shift();
//创建this,并将原型设置为构造函数的prototype
const context = Object.create(construct.prototype);
//执行构造函数,注意这里参数是数组形式所以使用apply
construct.apply(context, args);
//返回
const res = construct();
if ((typeof res === 'object' || res === 'function') && typeof res !== 'null') {
return res;
} {
return context;
}
};
function Person(name, age) {
this.name = name;
this.age = age;
};
const jack = myNew(Person, 'jack', 21);
//Person {name: 'jack', age: 21}
到此这篇关于JavaScript面向对象编程实现模拟的文章就介绍到这了,更多相关js面向对象内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!
--结束END--
本文标题: JavaScript面向对象编程实现模拟
本文链接: https://www.lsjlt.com/news/169375.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0