js:面向对象、构造函数

面向对象

面向过程的时候我们写代码的方式是获取元素、定义信号量、定义锁都是遇见需求就定义一个变量
但是 无法复用 并且主要就是定义的 是变量

面向对象就是操作的是对象
把写代码的风格从面向过程改为面向对象 把变量封装成对象即可

		//面向过程
        var username = "王老五";
        var age = 13;
        var sex = "男";
        console.log("大家好，我的名字是" + username + "我今年" + age + "岁，我是一个" + sex + "孩子")

		//面向对象
        var obj = {
            username: "王老五",
            age: 13,
            sex: "男"
        }
        console.log("大家好，我的名字是" + obj.username + "我今年" + obj.age + "岁，我是一个" + obj.sex + "孩子")

工厂模式

如何复用代码

        function createPeople() {
            var obj = {
                username: "王老五",
                age: 13,
                sex: "男"
            }
            return obj;
        }

        var o1 = createPerson();
        var o2 = createPerson();
        var o3 = createPerson();
        var o4 = createPerson();

		// 当然现在还欠缺一点
        // 现在所有的人都同一个属性对应同一个属性值

        var createPerson = function (username, age, sex) {
            return {
                username, age, sex
            }
        }
        var o1 = createPerson("张三", 13, "女")
        var o2 = createPerson("李四", 23, "女")
        console.log(o1, o2); 

以上就是面向对象了，其中这个封装出来的函数的作用是 创建对象 所以这种具备特定功能的函数 我们管他叫做工厂函数
这种书写代码的模式 就叫做工厂模式
工厂具备的特点：产品的结构是一致的 属性值是不同的

工厂模式的不足

		// 创建人的工厂
        var createPerson = function (username, age, sex) {
            return {
                username, age, sex
            }
        }
        var o1 = createPerson("张三", 13, "女")

        // 创建学生的工厂
        var createStudent = function (name, age, sex, grade) {
            return {
                name, age, sex, grade
            }
        }
        var s1 = createStudent("小华", 6, "男", 1);

两个工厂 生产出来的产品 无法通过代码来识别

typeof 与 instanceof

JS中类型分为 引用类型和值类型
typeof 可以识别值类型的数据的不同
如何区分引用类型的不同呢？
instanceof关键字用于区分引用数据类型的精确类型的
var arr = [];
console.log(arr instanceof Array)
var obj = {};
console.log(obj instanceof Object)

    instanceof的用法 
    对象 instanceof 类型
    如果返回的是真 说明 前面的对象是后面的类型
    如果返回的是假 说明 前面的对象不是后面的类型
    所有对象都是Object对象的后代，所以任何对象和Object做instanceof都会返回true

正则的补充

		//补充: 正则的new的用法
        var reg = /abc/g;
        var reg1 = new RegExp("abc", "g");
        console.log(reg, reg1)

        //如果正则中出现特殊字符
        var reg2 = /\w+/g;
        var reg3 = new RegExp("\\w+", "g");
        console.log(reg2, reg3)

构造函数

1、构造函数也是一个普通函数，创建方式和普通函数一样，但构造函数习惯上首字母大写

2、构造函数和普通函数的区别在于：调用方式不一样。作用也不一样（构造函数用来新建实例对象）

3、调用方式不一样。

 a. 普通函数的调用方式：直接调用 person();

 b.构造函数的调用方式：需要使用new关键字来调用 new Person();

4、构造函数的函数名与类名相同：Person( ) 这个构造函数，Person 既是函数名，也是这个对象的类名

5、内部用this 来构造属性和方法

function Person(name,job,age)
{
     this.name=name;
     this.job=job;
     this.age=age;
     this.sayHi=function()
         {
          alert("Hi")
         }
 } 

5、构造函数的执行流程

  A、立刻在堆内存中创建一个新的对象

  B、将新建的对象设置为函数中的this

  C、逐个执行函数中的代码

  D、将新建的对象作为返回值

6、普通函数例子：因为没有返回值，所以为undefined

7、构造函数例子：构造函数会马上创建一个新对象，并将该新对象作为返回值返回