概述
底本盘算写设想情势的,在议论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());