第5天：自定义构造函数，创建对象（简单工厂模式）

面向对象

封装、继承、多态（抽象性）

js是一门基于对象的语言

万物皆对象

对象：有属性和方法，具体特指的某个事物

对象：有特征和行为，具体特指的某一事物

javaScript 中的所有事物都是对象：字符串、数值、数组、函数...
此外，JavaScript 允许自定义对象。

如何获取该变量（对象）是不是属性什么类型的？
语法：
变量 instanceof 类型的名字——————>布尔类型，true就是这种类型，false不是这种类型
在当前的对象方法中，可以使用this关键字代表当前的对象

    //人的对象
    var person = new Object();
    person.name = "小萌";
    person.age = 10;
    person.sayHi=function(){

    //在当前这个对象的方法中是可以访问当前这个对象的属性的值
    //在当前对象方法用可以使用this关键字代表当前对象
    console.log("我叫"+this.name+"，今年"+person.age+"了");
    }
    person.sayHi();

如何一次性创建多个对象？
把创建对象的代码封装到一个函数中

简单工厂创建对象

function createObject(name,age){
        var person = new Object();//创建对象
        person.name = name;//为对象添加属性
        person.age = age;
        person.sayHi=function(){//为对象添加方法
            console.log("我的名字叫"+this.name+"，今年已经"+this.age+"岁了");
        }
        return person;//记得返回 不然var per1就是undefined
    }
   var per1 = createObject("翠花",18);
   per1.sayHi();
   var per2 = createObject("萌萌哒",26);
   per2.sayHi();

简单工厂创建对象

自定义构造函数创建对象

先自定义构造函数
根据查看js系统构造函数Object定义方式


function Object(value){

}

我们根据Object的定义方式进行自定义构造函数


//自定义构造函数
function Person(){
    this.name = "小白";
    this.age = 18;
    this.sayHi = function(){
        console.log("我是"+this.name+"今年"+this.age);
    }
}

创建对象
js创建对象 var obj = new Object();
所以我们也根据js创建对象的方式进行自定义创建对象

//创建对象
var per = new Person();
console.log(per.name);
console.log(per.age);
per.sayHi();

整个自定义构造函数创建对象代码

//自定义构造函数
function Person(){
    this.name = "小白";
    this.age = 18;
    this.sayHi = function(){
        console.log("我是"+this.name+"今年"+this.age);
    }
}
//创建对象
var per = new Person();
console.log(per.name);
console.log(per.age);
per.sayHi();

自定义构造函数创建对象

优化代码----------定义参数

    /*  
    1在内存中开辟空间，存储创建新的对象
    2把this设置当前的对象
    3设置对象的属性和方法的值
    3把this这个对象返回
    自定义构造函数
    */
function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayHi = function(){
        console.log("我是"+this.name+"今年"+this.age);
    }
}
//创建对象
var per = new Person("小卢",18);
console.log(per.name);
console.log(per.age);
per.sayHi();

通过自定构造函数实现下面的例子
创建一个图片的对象，图片有宽，有高，有大小（4M）,图片可以展示内容
创建一个小猫的对象，猫有颜色，体重，年龄，小猫可以抓耗子，可以打架

//创建自定义构造函数
function Picture(width,height,size){
    this.width = width;
    this.height = height;
    this.size = size;
    this.show = function (){
        console.log("展示当前图片的宽度："+this.width+"高度："+this.height+"大小："+this.size);
    }
}
//创建对象
var picture = new Picture("100px","200px","20m");
picture.show();
//创建自定义构造函数
function Smallcat(color,weight,age){
    this.color = color;
    this.weight = weight;
    this.age = age;
    this.seize =function(){
        console.log(this.age+"岁的"+this.color+"的小猫咪体,体重"+this.weight+"可以去抓耗子，可以去打架了");
        
    }
}
//创建对象
var smallcat = new Smallcat("绿色","3kg",3);
smallcat.seize();