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);

 

 

点击展开所有例子

// 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