js 面向对象编程

《JavaScript 高级程序设计》第3版  面向对象编程

---

js 对象

dom  bom  window   window.document

js 面向对象三大特性

函数封装  对象继承 多态【函数覆盖】

es[es5 es6之前]

//  es 
(function(){})(); // 立即执行函数  匿名命名空间
    const Animal = function(name, color){
    this.name=name;
    this.color=color;
}//构造函数 
Animal.prototype={}//  prototype  对象
var cat = new Animal("猪皮","土黄色");// 实例对象
var o ={} // 对象字面量
var arr =[] // 数组
var oDate =new Date() // 日期  其他  Math,Array,Number,Object
// 防止命名空间已经存在
window.KG = window.KG || {};
// ui组件  功能组件  提升程序可复用性

//继承
Pupil.prototype.constructor = Pupil; //   原生

// 子类的原型对象指向父类的实例
Pupil.prototype = new Student('小辉', 8, '小学义务教育课程'); //手动修改

// 子类里面调用父类进行构造
//使用call实现继承
Student.call(this, name, age, subject);
//使用applay实现继承
Student.apply(this, [name, age, subject]);

es6

// es6  class 声明
class Student {
	constructor(){}// 构造函数
	study(){}// class 方法
}

let student3 = new Student('阿辉', 24, '前端开发'); // 对象实例
student3.study(); //调用


// extends
class Pupil extends Student{
	constructor(){
		super() // 调用父类  constroutor
	}
}
let pupil = new Pupil('小辉', 8, '小学义务教育课程', '北大附小');
pupil.study();

• 抽象出你的代码思路,写可维护的代码，方便查询问题。
• 通俗的说利用函数，去封装代码语句  通过函数调用来减少重复的代码量，减少出错机会。
• 封装公共函数库，完善公共代码库，减少代码量，减少耦合，专注于业务逻辑。
• i/o import/export 
• {}

export default {
    method(){},
    async method(data){
        return  result = await request({
             url: '/common/selectAllSzList',
            data: data,
            method: 'post'
        });
    },
}