js - 什么是构造函数,它和普通函数区别在哪?
1.什么是“构造函数”?
用new关键字来调用的函数,首字母一般大写
用this来构造它的属性以及方法
function Log(name, desc) {
this.name = name;
this.desc = desc;
this.code = function(){
console.log('code...')
}
}
2.构造函数和普通函数区别在哪?
我们写普通函数时一般习惯用驼峰命名,而构造函数一般首字母大写(约定俗成)以及构造函数是用来新建实例对象。
3.为什么要用它?
假设我们每天写一些日志,习惯性添加自己称呼
// 1.1 重复添加
let to1 = {
name: 'Sunsin',
desc: '今天注意啥1'
};
let to2 = {
name: 'Sunsin',
desc: '今天注意啥2'
};
let to3 = {
name: 'Sunsin',
desc: '今天注意啥3'
};
// 1.2 写个构造函数进行添加
function Log(name, desc) {
this.name = name;
this.desc = desc;
}
let to4 = new Log('Sunsin', '今天注意啥4');
let to5 = new Log('Sunsin', '今天注意啥5');
console.log(to4, to5);
// 1.3 写个普通函数再return
function Logs(name, desc) {
return {
name,
desc
};
}
let to6 = Logs('Sunsin','今天注意啥6');
console.log(to6);
4. 构造函数的执行过程
在new关键字调用时会创建一个新的空间,每当创建实例时函数体内部this都会指向当前
4.1、立刻在堆内存中创建一个新的对象
4.2、将新建的对象设置为函数中的this
4.3、逐个执行函数中的代码
4.4、将新建的对象作为返回值
5. 构造函数的返回值
// 1.4 基本类型的返回值返回this它的指向
function Hello() {
this.name = 'sunsin';
return 'sunsins';
}
// 1.5 引用类型(对象)的返回值,最终返回该对象
function Hello1(){
this.sex = '女';
return{
sex:'男'
}
}
console.log(new Hello().name,new Hello1().sex);
6. 检查一个对象是否是一个类的实例
用instaceof
function Log(name, desc) {
this.name = name;
this.desc = desc;
}
let to4 = new Log('Sunsin', '今天注意啥4');
let to5 = new Log('Sunsin', '今天注意啥5');
console.log(to4, to5, to5 instanceof Log);
点击展开所有例子
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
// 1.1 重复添加 let to1 = { name: 'Sunsin', desc: '今天注意啥1' }; let to2 = { name: 'Sunsin', desc: '今天注意啥2' }; let to3 = { name: 'Sunsin', desc: '今天注意啥3' }; // 1.2 写个构造函数进行添加(代码复用) function Log(name, desc) { this.name = name; this.desc = desc; this.code = function(){ console.log('code...') } } let to4 = new Log('Sunsin', '今天注意啥4'); let to5 = new Log('Sunsin', '今天注意啥5'); console.log(to4, to5, to5 instanceof Log); // 1.3 写个普通函数再return,而构造函数则将该新对象直接返回 function Logs(name, desc) { return { name, desc }; } let to6 = Logs('Sunsin', '今天注意啥6'); console.log(to6); // 1.4 基本类型的返回值返回this它的指向 function Hello() { this.name = 'sunsin'; return 'sunsins'; } // 1.5 引用类型(对象)的返回值,最终返回该对象 function Hello1(){ this.sex = '女'; return{ sex:'男' } } console.log(new Hello().name,new Hello1().sex);
原文部分转载于:https://blog.csdn.net/weixin_41796631/article/details/82939585