概述

底本盘算写设想情势的，在议论js的设想情势之前先说一下js的面向对象,由于许多设想情势的完成都搀杂着面向对象的头脑,所以先做一下前期铺垫。

js我们都晓得是一种动态范例剧本型言语,变量范例没法保证,所以我们能够尝试挪用恣意对象的恣意要领,不必斟酌它底本是不是被设想为具有该要领。

什么是面向对象本文不在叙述。接下来讲一下面向对象的三大特征在js当中的完成。

封装

这个特征在设想一个框架时须要仔细斟酌的。封装的目标是将信息隐蔽,其主要可分为以下几类

• 数据封装

在一些静态范例的言语如java中,自身语法就供应了这些功用。js当中只能依托变量的作用域来完成封装的特征,而且只能模拟出public和private两种特征。

/**
 -  应用函数建立的作用域到达数据封装的目标。
 - @type {{getName, setName}}
  */

  var obj=(function () {
var _name="gcy";
return {
    getName:function () {
        return _name;
    },
    setName:function (val) {
        _name=val;
    }

};
 })();
 obj._name;  //undefined
 obj.getName(); //gcy

• 封装完成

  封装完成就是是对象内部的变化对外界是通明的,不可见。这类做法使对象之间低耦合,便于保护晋级,团队合作开辟。
  $(selector).each(function(index,element))。就比方这个each函数,我们不必体贴内部完成,只需供应的功用准确就行。我们关注的只是接口挪用情势。

继续

继续在静态言语中,比方java有症结字,虽然在es6中也有extend以及class,但其本质仍完成照样基于原型机制。

/**
 * 简朴的es5原型继续
 * @constructor
 */
var A=function () {
}
A.prototype={name:"gcy"};

var B=function () {
};
B.prototype=new A();

var b=new B();
console.log(b.name);
/**
 * e6继续完成demo
 */
class People{
    constructor(name){
        this.name=name;
    }
    getName(){
        return this.name;
    }
}

class Black extends People{
    constructor(name){
        super(name);
    }
    speak(){
        return " i am black";
    }
}
var peo=new Black("gcy");

console.log(peo.getName()+' says '+peo.speak());

实在原型继续体式格局写法许多。我以为照样明白原型链机制比较主要,症结就是明白prototype和__proto__.

多态

多态实在就是把做的内容和谁去做离开。在java中我们能够经由过程向上转型,也就是面向接口编程。由于js是动态言语,多态性自身就有。
下面这个例子就说清楚明了,一个动物可否完成啼声,只取决于makeSound,不针对某种范例的对象。

 /**
     * 多态的完成案例
     * @param animal
     */
    var makeSound=function (animal) {
        animal.sound();
    }
    var Duck=function () {
    }
    var Dog=function () {
    }
    Duck.prototype.sound=function () {
        console.log("嘎嘎嘎")
    }
    Dog.prototype.sound=function () {
        console.log("旺旺旺")
    }
    makeSound(new Duck());
    makeSound(new Dog());