面向对象(oop)的程序设计编写高质量代码

本文链接：https://blog.csdn.net/qq_34117170/article/details/77050019

哈哈，今天博客专栏申请成功了，博主我万分激动的写下第一篇文章！

首先我们先说一下什么是对象

对象：对象就是由属性和方法组成的，JS 中一切皆对象。

面向对象定义：无序属性的集合（一组没有顺序的值，对象：key/value 名字到值的映射），其属性可以包含基本值，对象和函数。可以简单理解为JS的对象是一组无序的值，其中的属性或方法都有一个名字，根据这个名字可以访问相映射的值（值可以是基本值/对象/方法）。

创建对象：
1.new Object();
2.{};

下面先创建一个我们常见的对象实例并为之添加方法和属性

var person=new Object();
    person.name="WDL";
    person.age="24";
    person.sayName=function(){
        console.log(this.name);
    }

当然上述对象实例还可以这样创建

var person={
        name:"WDL",
        age:"24",
        sayName:function(){
            console.log(this.name);
        }
    }

我们为上述对象实例添加了name和age 两个属性以及sayName()方法。

下面说一下数据属性
例子如下：例子上有注释，运行一下就能明白，实战是检验真理的唯一标准

//定义数据属性

    Object.defineProperty(person,"name",{
        Configurable:true, //能否通过delete删除属性重新定义，默认true
        Enumerable:true,//能否被for-in循环，默认true
        writable:false,//能否重写，默认true
        value:"张三",//赋值
    });

    person.name="WDL111";//是否能重新赋值
    person.Nage=person.age;//把老age赋值给新Nage
    delete person.age;//删除age
    console.log(JSON.stringify(person))//输出{name:"张三",Nage:"24"}
    person.sayName();//张三

下面说一下创建对象的几种方式：(这才是重点)

//工厂模式
    //以函数封装成特定接口创建对象
    function createPerson1(name,age,job){
        var o=new Object();
        o.name=name;
        o.age=age;
        o.job=job;
        o.sayName=function(){
            console.log(this.name+'-' +this.age+'-'+this.job)
        };
        return o;
    }
    var person1=createPerson1('WDL',"24" ,"web");
    person1.sayName();

工厂模式虽然解决了创建多个相似对象的问题，但却没解决对象识别的问题（怎样知道一个对象的类型）

//构造函数模式
    function createPerson(name,age,job){
        //var o=new Object();
        this.name=name;
        this.age=age;
        this.job=job;
        this.sayName=function(){
            console.log(this.name+'-' +this.age+'-'+this.job)
        };
        //return o;
    }
    var person2= new createPerson('WDL2',"24" ,"web"); //此处new
    person2.sayName();

    console.log(person2 instanceof createPerson);//"person2是否属于createPerson" 



    //普通函数调用
    var person3=createPerson('WDL3',"24" ,"web");
    window.sayName();//当在全局作用域里调用函数时。this指向window

    //构造函数虽好但并不是没有缺点，使用构造函数的主要问题就是每个方法都要在每个实例上重新创建一次

可以看到构造函数模式和工厂模式的不同是去掉了 var o=new Object(); return o;和把o换成了this;
检测对象类型还是instanceof操作符更可靠一点

构造函数和函数只是调用的方式不同，其实这也正常毕竟构造函数也是函数嘛。任何函数如果通过new 调用那么他就可以作为构造函数

原型模式

我们创建的函数都有一个prototype属性，这个属性是一个指针，指向一个对象，而这个对象的用途是包含


    function prototypePerson(){

    }
    prototypePerson.prototype.name="WDL4";
    prototypePerson.prototype.age="24";
    prototypePerson.prototype.sayName=function(){
        console.log(this.name +'-'+ this.age);
    }
    var newperson=new prototypePerson();
    newperson.sayName();//WDL4-24
    var newperson2=new prototypePerson(); 
    newperson2.sayName();//WDL4-24
    //简洁的原型语法
    function prototypePerson(){

    }
    prototypePerson.prototype={
        name:"WDL4",
        age:"24",
        sayName:function(){
            console.log(this.name +'-'+ this.age);
        },
    }

原型函数和构造函数结合使用

//终极boss 
    //
    function proAndConPerson(name,age){
        this.name=name;
        this.age=age;
        this.firend=["DXL","RZT","FC"]

    }
    proAndConPerson.prototype={
        // constructor:proAndConPerson,
        sayName:function(){
            console.log(this.name+'-' +this.age)
        },
    }
    var proAndConPerson1=new proAndConPerson();
    var proAndConPerson2=new proAndConPerson();
    proAndConPerson1.firend.push("张三");
    console.log(proAndConPerson1.firend);
    console.log(proAndConPerson2.firend)