面向对象的Javascript
1.1动态类型与鸭子类型
var duck = {
duckSinging : function(){
console.log('嘎嘎嘎');
}
}
var chicken = {
duckSinging : function(){
console.log('咯咯咯');
}
}
var choir = [] //合唱团
var joinChoir = function(animal){
if(animal && typeof animal.duckSinging =='function'){
choir.push(animal);
console.log('恭喜加入合唱团');
console.log('合唱团已有成员：' + choir.length);
}
}
joinChoir(duck);
joinChoir(chicken);
1.2多态
1.2.1一段“多态”的javascript代码
var makeSoud = function(animal){
if(animal instanceof Duck){
console.log('嘎嘎嘎');
}else if (animal instanceof Chicken){
console.log('咯咯咯');
}
}
var Duck = function(){}
var Chicken = function(){}
makeSoud(new Duck());
makeSoud(new Chicken());
加狗又要改makeSoud代码
1.2.2对象的多态性
var makeSoud = function(animal){
animal.sound();
};
var Duck = function(){};
Duck.prototype.sound = function(){
console.log('嘎嘎噶');
};
var Chicken = function(){};
Chicken.prototype.sound = function(){
console.log('咯咯咯');
}
makeSoud(new Duck());
makeSoud(new Chicken());
var Dog = function(){};
Dog.prototype.sound = function(){
console.log('汪汪汪');
}
makeSoud(new Dog());
1.2.3 类型检查与多态
java
1.2.4 使用继承得到多态效果
1.2.5 Javascript的多态
不需要java类似的向上转型
1.2.6 多态在面向对象程序设计中的作用
var googleMap = {
show:function(){
console.log('开始渲染谷歌地图');
}
};
var baiduMap = {
show:function(){
console.log('开始渲染百度地图');
}
}
var renderMap = function(type){
if(type=='google'){
googleMap.show();
}else if(type=='baidu'){
baiduMap.show();
}
};
renderMap('google');
renderMap('baidu');
把相同的部分抽象出来
var googleMap = {
show:function(){
console.log('开始渲染谷歌地图');
}
};
var baiduMap = {
show:function(){
console.log('开始渲染百度地图');
}
}
var renderMap = function(map){
if(map.show instanceof Function){
map.show();
}
}
renderMap(googleMap);
renderMap(baiduMap);
实际开发中借助适配器模式
1.2.7 设计模式与多态
1.3 封装
1.3.1 封装数据
var myObject = (function(){
var _name = 'sven';
return {
getName:function(){
return _name;
}
}
})();
console.log(myObject.getName()); //sven
console.log(myObject._name); //undefined
1.3.2 封装实现
封装不仅仅是隐藏数据，还包括隐藏细节 设计细节 对象的类型 等
1.3.3 封装类型
封装类型是通过抽象类和接口来进行的 Javascript不区分类型
1.3.4 封装变化
“可复用面向对象软件基础”
1.4 原型模式与基于原型继承的Javascript对象系统
原型编程的思想中，类并不是必需的，对象未必需要从类中创建而来，一个对象是通过克隆另外一个对象所得到的
1.4.1 使用克隆的原型模式
var Plane = function(){
this.blood == 100;
this.attackLevel = 1;
this.defenseLevel = 1;
};
var plane = new Plane();
plane.blood = 500;
plane.attackLevel = 10;
var clonePlane = Object.create(plane);
console.log(clonePlane.attackLevel); //10
/*不支持Object.create方法的浏览器中*/
Object.create = Object.create||function(obj) {
var F = function () {
};
F.prototype = obj;
return new F();
}
1.4.2 克隆是创建对象的手段
1.4.3 体验lo语言
1.4.4 原型编程范型的一些规则
- 所有的数据都是对象
- 要得到一个对象，不是通过实例化类，而是找到一个对象作为原型并克隆它。
1.4.5 Javascript中的原型继承
- 所有的数据都是对象
- 要得到一个对象，不是通过实例化类，而是找到一个对象作为原型并克隆它。
- 对象会记住它的原型。
- 如果对象无法响应某个请求，它会把这个请求委托给它的对象系统的。
1.所以的数据都是对象
undefined number boolean string function object
Javascript设计本意是除了undefined之外，一切应是对象，为了实现这一目标number boolean string这几种基本类型也可以通过“包装类”的方式变成对象类型数据来处理。
Javascript中的根对象是Object.prototype对象->空对象
var obj1 = new Object();
var obj2 = new Object();
console.log(Object.getPrototyprOf(obj1) === Object.prototype);//ture
console.log(Object.getPrototyprOf(obj2) === Object.prototype);//ture
2.要得到一个对象，不是通过实例化类，而是找到一个对象的原型并克隆它
function Person(name){
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
}
var a = new Person('sven');
console.log(a.name); //sven
console.log(a.getName()); //sven
console.log(Object.getPrototypeOf(a) === Person.prototype); //ture
Person并不是类，而是函数构造器，Javascript的函数既可以作为普通函数被调用，也可以做为构造器被调用。当使用new运算符来调用函数时，此时的函数就是一个构造器。用new运算符来创建对象的过程，实际上也只是先克隆Object.prototype对象，再进行一些额外的操作。
function Person(name){
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
}
var objectFactory = function(){
var obj = new Object(), //从Object.prototype上克隆一个空的对象
Constructor = [].shift.call(arguments); //取得外部传人的构造期，此例是Person
obj._proto_ = Constructor.prototype;
var ret = Constructor.apply(obj,arguments); //借外部传人的构造器给obj设置属性。
return typeof ret === 'object' ? ret : obj;
};
var a = objectFactory(Person,'sven');
console.log(a.name); //sven
console.log(a.getName()); //sven
console.log(Object.getPrototypeOf(a) === Person.prototype); //ture
Javascript给对象提供一个名为proto的隐藏属性，默认指向它的构造器的原型对象。即｛Constructor}.prototype.在一些浏览器中，proto被公开出来。
proto就是对象跟“对象构造器的原型”联系起来的纽带
var a = new Object();
console.log(a.__proto__ === Object.prototype);
4如果无法响应某个请求，它会把这个请求委托给它的构造器的原型
var obj = {name:'sven'};
var A = function(){};
A.prototype = obj;
var a = new A();
console.log(a.name); //sven
继承
var A = function(){};
A.prototype = {name:'sven'};
var B = function(){};
B.prototype = new A();
var b = new B();
console.log(b.name); //输出sven
1.4.6 原型继承未来
Object.create(null)可以创建出没有原型的对象
es6
class Animal{
constructor(name){
this.name = name;
}
getName(){
return this.name;
}
}
class Dog extends Animal{
constructor(name){
super(name);
}
speak(){
return'woof';
}
}
var dog = new Dog('scamp');
console.log(dog.getName()+'says' dog.speak());
网友评论