闭包高级/对象/构造函数/实例化

📌 对象Object

对象的定义

无序的数据集合，键值对的集合

通过对象字面量（对象直接量），创建新对象【常用】

var obj = {}                   //空对象

var obj = {   
    键1: '字符串'， 
    键2: number，
    键3: function() {}，
    ··· 
    '键4': true,
    'say-hi': function() {}，
          }                   //非空对象

• 键名是字符串，不是标识符，可以包含任意字符，包括空字符串、空格字符串
• 引号可省略，省略之后只能写标识符
• 键名使用横杠（js命名规范不允许），但加引号可以使用

通过构造函数，创建新对象

系统内置的 Object()构造函数

var obj = new Object()  //空对象

obj.name = '张三';
obj.sex = '男';

• 对象是通过实例化构造函数而生成的实例化对象

★ 自定义构造函数

模块化，插件开发必会使用到

• 自定义构造函数名称要 使用大驼峰命名法
• 自定义构造函数中不要定义对象和定义return，new关键字会隐式执行

// 企业模块化开发，插件自定义构造函数以对象形式进行传参
function CrtObj(opt){
       // 在构造函数中使用this来指代对象，这个对象就是我们使用构造函数生成的实例化对象
            
       // 定义属性
       // 给实例化对象添加name属性，属性值是输入的name参数
       this.name = opt.name;
       this.age = opt.age;
       this.sex = opt.sex;
    	 this.addr = opt.addr;

       // 定义方法
       this.funAll = function(){
           console.log(this.name,this.age,this.sex,this.addr )
       }
       this.funNameAge = function(){
           console.log(this.name,this.age)
       }
       this.funSexAddr = function(){
           console.log(this.sex,this.addr )
       }
}

// 通过自定义构造函数来生对象，实例化对象
// 调用执行构造函数时，都必须要和new关键词一起使用
const obj1 = new CrtObj({
		name: '张三',
    age: 18,
    sex: '男',
    addr: '北京'
});
console.log(obj1);

// 调用 对象/实例化对象 中的方法
obj1.funAll();
obj1.funNameAge();
obj1.funSexAddr();

构造函数与普通函数的区别？

• 构造函数一定要和关键字new一起使用
  • new关键字会隐式给构造函数中创建一个空对象
  • 同时，会将this指向这个空对象，使用this为这个对象添加成员
  • 最后，会隐式通过return返回这个对象
• 构造函数语法规定函数名首字母大写，使用大驼峰命名法
• 构造函数给对象定义属性和方法的语法使用 this.属性名 = 值 添加属性和方法

不同的方法和函数会占用过多的内存空间，使同一个构造函数生成的实例化对象可调用相同的方法？

• 产生原因：每次创建对象都会在对象上定义一个新的方法，即新函数
  • 函数存储时会生成一个独立的存储空间
  • 不同函数存储的空间不同
• 解决方式：将构造函数需要定义给实例化对象的方法定义在函数的prototype属性中

function CrtObj(opt){
       // 在构造函数中使用this来指代对象，这个对象就是我们使用构造函数生成的实例化对象
            
       // 定义属性
       // 给实例化对象添加name属性，属性值是输入的name参数
       this.name = opt.name;
       this.age = opt.age;
       this.sex = opt.sex;
    	 this.addr = opt.addr;
}

// 在构造函数的 prototype 属性中来定义实例化对象的方法
CrtObj.prototype.fun = function(){
		  console.log(this.name,this.age,this.sex,this.addr )
}

const obj2 = new CrtObj({
		name: '张三',
    age: 18,
    sex: '男',
    addr: '北京'
});

const obj3 = new CrtObj({
		name: '李四',
    age: 17,
    sex: '女',
    addr: '上海'
});

obj2.fun()  //张三 18 男 北京
obj3.fun()  //李四 17 女 上海
console.log(obj2.fun === obj3.fun); //true

📋 练习

1、写一个构造函数，接收数字类型的参数，参数数量不定，完成参数相加和相乘的功能？

2、写一个构造车的函数，可设置车的品牌、颜色、排量；再写一个构造消费者的函数，设置消费者名字，年龄收入；通过选择的方法实例化该用户喜欢的车，再设置车的属性？

//1、写一个构造函数，接收数字类型的参数，参数数量不定，完成参数相加和相乘的功能？ 
function Calcul() {
						//初始化
            this.sumRes = 0;
            this.mulRes = 1;
						
   					//定义实参累加和方法
            this.cumulSum = function () {
                for (var i = 0; i < arguments.length; i++) {
                    this.sumRes += arguments[i]
                }
                console.log(this.sumRes);

            };
   					//定义实参相乘的方法
            this.cumulMul = function () {
                for (var i = 0; i < arguments.length; i++) {
                    this.mulRes *= arguments[i]
                }
                console.log(this.mulRes);
            }
}

//实例化对象
var comput = new Calcul()

comput.cumulSum(1, 9)；  //10
comput.cumulMul(1, 2, 3) // 6

---------------------------------------------------------------------------------------------
/*
 *  2、写一个构造车的函数，可设置车的品牌、颜色、排量；
 *  再写一个构造消费者的函数，设置消费者名字，年龄收入；
 *   通过选择的方法实例化该用户喜欢的车，再设置车的属性？
 */
  
// 车的构造函数
function Car (opt) {
     this.brand = opt.brand;
     this.color = opt.color;
     this.displacement = opt.displacement
}
// 人的构造函数  
function Person(opt) {
  this.name = opt.name
  this.age = opt.age
  this.income = opt.income
  this.select = function () {
    var myCar = new Car(opt.myCar)
    console.log(`${this.name}今年${this.age}岁，月收入${this.income}，购买了一辆${myCar.color}，排量是${myCar.displacement}的${myCar.brand}车`)
  }
}
// 创建人的实例对象  
var Jack = new Person({
   name: "杰克",
   age: 30,
   income: "10K",
   myCar: {
      brand: 'Benz',
      color: '红色',
      displacement: '2.0'
   }
})

// 调用构造函数的方法  
Jack.select()
// 杰克今年30岁，月收入10K，购买了一辆红色，排量是2.0的Benz车