Javascript设计模式学习笔记(1) 创建类的时候需要注意的一些概念

Javascript设计模式学习笔记

---

第2章 写的都是看到的—面向对象编程

2.1 两种编程风格 ----面向过程与面向对象

面向过程：直接实现功能，面向结果和过程，参数为实现特定功能的必须参数

面向对象：将对象进行特征分析，将方法和方法进行封装，主要思想有：封装，继承，多态（但js里考虑的比较少），并且类Class的概念在ES6的时候才出现，之前都是通过一些js的特性进行相关概念的模拟

2.2 包装明星 ---- 封装

2.2.1 创建一个类

在ES6之前创建一个类：首先声明一个函数保存在一个对象里，然后按照编程习惯这个代表类的变量名首字母大写，然后再这个函数的内部通过this（函数内部自带的一个变量，用于指向当前这个对象）变量，添加属性或者方法来实现对类属性或方法的添加

给类添加属性的时候有两种方法，一种是直接用this指向进行属性的赋值，一种是通过prototype属性进行赋值，这两种方式的区别：

使用this进行属性添加的时候所有的实例化对象都会创建并且具有这个属性的实际内容

但是使用prototype属性进行属性添加，其实所有的实例化对象本身是不包含该属性的，只是将该属性添加到该对象的原型属性上，但是由于js的原型链的原理，所有的原型对象也可以调用和使用该属性

实例化对象的时候可以通过new 关键字进行创建，具体的创建流程是这样 ，先通过new 关键字创建一个空对象，然后将函数中的this 指向该空对象，然后再将所有的this的属性和方法复制到该空对象，实现实例化过程

contructor: 构造函数 当创建一个函数或者对象时，都会为其创建一个原型对象，prototype ，在prototype对象中又会像函数中创建this一样创建一个constructor属性，这个constructor属性就是拥有整个原型对象的函数和对象，指向构造函数本身，例如Book prototype中的constructor就是指向Book类对象

2.2.2 这些都是我的 ---- 属性与方法的封装

私有属性：对象的属性不能被访问者看到；只能在函数内部使用。好处就是安全，就类似闭包中的函数一样，减少污染

公有属性（共有属性）：当我们定义一个对象后，使用对象的人在实例化之后可以访问到对象内部的属性；

私有方法：对象的方法不能被访问者看到；只能在函数内部使用。好处就是安全，就类似闭包中的函数一样，减少污染

构造方法： 通过方法修改实例中属性或者私有属性的方法

实现方法： 由于Js中定义的变量都只会存在最近的函数作用域或者最近的全局作用域，所以可以通过函数包裹作用域，实现方法和属性的私有化

例如：

    var Book = function(id,name,price){
        var num  = 1 ;//定义私有属性，var定义的变量在最近的函数左右用
        funciton CheckId(){
            //跟用var声明变量是一样的，其实也是创建了一个变量，只是用函数进行赋值，也是一个私有方法
        }
        this.getName = function(){
            //this 会将该方法传递到所有的实例对象中，所以是一个共有方法
        }
        this.setNum = function(number){
            num = number // 通过函数内部的一个函数操作私有变量，这种方法叫做构造器
        }
    }
    //类静态公有属性（实例获取不到该属性，想获取该属性只能通过类调用）
    Book.isChenese = true ; 
    //类静态公有函数（公有方法）
    Book.resetTime = function(){

    }
    //
    Book.prototype = {
        //公有属性  因为写在prototype所有的实例都可以调用和获取到该属性
        isJsBook  = true
        //同理，这样定义的方法为公有方法
        display:function(){

        }
    }

你们看不到我 ---- 闭包实现

经常将类的静态变量通过闭包来实现

实现原理：闭包是有权访问另一个函数作用域中变量的函数，即在一个函数内部创建另一个函数，我们将这个闭包作为创建对象的构造函数

这样他既是闭包又是可实例化对象的函数，即可以访问到类函数作用域中的变量

例如：

    //一个立即执行函数，返回值是一个构造函数
    var Book = (function(){
        //立即执行函数中间创建了变量，该变量实例对象无法修改，也只能通过闭包方法获取，所以该变量叫  静态私有变量
        var bookNum = 0;
        //静态私有函数
        function checkBook(name){}
        //创建类的构造方法
        function _book(newId,newName,newPrice){
            //类里面的正常的私有变量
            var name,price;
            //私有方法
            function checkId(id){

            }
            //公有方法
            this.getName = function(){}
            this.id = newId
            this.copy = function(){}
        }
        //原型方法
        _book.prototype = {
            //原型静态方法
            isJsbook = true
            display:function(){}
        }
        return _book
    })()

2.2.4 找位检查长 ---- 创建对象的安全模式

由于怕在创建对象的时，忘记使用new关键字，则会返回一个undefined对象

解决原理：如果是不适用关键字调用，则会当成一个普通函数进行构造函数的调用，this指向的是掉用他的函数上下文，也就是一般都是window或者什么，所以可以在赋值之前，判断这个this是否为构造函数的实例，如果是，则表示是通过new 语法创建，如果不是，则表示出错

解决代码：

    var Book = function(){
        //赋值之前判断this是否为类的实例对象
        if(this instanceof Book){
            //如果是的话直接进行赋值
            this.title = title;
        }
        //如果不是的话，则重新实例化一个对象
        else{
            return new Book()
        }
    }