一名前端工程师的笔记分享！Js篇（04-15更新）
只要保持不断学习的状态，相信都可以变成想要的自己，Js完结篇～
面向对象的三大特性
封装：屏蔽内部细节 调用外部接口实现对应功能(函数调用)
继承：子类继承父类中的属性和方法
多态（js中不存在多态的概念
继承
继承：子类继承父类中的属性和方法 ， 这些属性和方法在子类中不需要实现过程
继承的种类：
单继承：一个子类只拥有一个父类
多继承：一个子类可以拥有多个父类
继承方式一、通过改变构造函数（父类）的执行环境 ---在子类中添加一个特殊属性，这个属性值指向父类
function Father(){
this.money = 999999;
this.eat = function(){
console.log("吃肉");
}
this.drink = function(){
console.log("喝酒");
}
}
function Son(){
this.parent = Father; //为子类添加一个特有的属性 改变父类的执行环境 类似：this.parent = function (){....}
this.parent();//改变了执行环境
}
var son = new Son();
继承方式二、通过call方法实现
call方法使用：
父类.call(子类[,子类继承父类的属性]);
function Father(firstname){
this.firstname = firstname;
this.money = 200000000;
this.drink = function(){
console.log("喝酒");
}
this.dance = function(){
console.log("跳舞");
}
}
function Son(firstname){
Father.call(this,firstname );
}
继承方式三、通过apply继承
apply使用方法：
父类.apply(子类对象,数组) 数组中存储的是从父类继承过来的属性
function xiaomi5(price,size,memsize){
this.price = price;
this.size = size;
this.memsize = memsize;
this.phoneCall = function(){
console.log("打电话");
}
this.sendMessage = function(){
console.log("发短信");
}
}
function xiaomi5Plus(price,size,memsize,color){
this.color = color;//特有属性
//xiaomi5.apply(this,[price,size,memsize]);
xiaomi5.apply(this,arguments);//通过arguments接收
this.playMusic = function(){
return "播放音乐";
}
this.photo = function(){
console.log("照相");
}
}
var xm = new xiaomi5Plus(789,7,64,"white");
console.log(xm);
原型对象 prototype
每一个构造函数都有一个prototype属性 实现： 构造函数.prototype
每一个构造函数new出来的对象都有一个prototype属性 实现 : 对象.__proto__ 指向的是prototype
原型模式的执行流程
1、先查找实例属性和实例方法，如果有实例属性或实例方法，就返回 该实例属性或实例方法的结果
2、如果没有实例属性或实例方法，就去原型中查找，如果有原型属性或原型方法，就返回，如果没有，返回undefined
原型中的几个关键字
测试某个对象是否属于某个类的方法 isPrototypeOf()
语法： 构造函数.prototype.isPrototypeOf(对象):判断一个对象是否指向了该构造函数的原型对象，可以使用isPrototypeOf()方法来测试 结果为boolean类型 同 instanceof
var arr = [];
alert( arr instanceof Array )
delete ：删除实例属性
语法 ： delete 对象.实例属性
hasOwnProperty() 判断某一个对象是否包含该实例属性, 包含返回true，否则返回false
语法： 实例对象.hasOwnProperty("实例属性")
in 是否存在该属性（原型或实例中）
语法： "属性" in 对象实例
原型继承
缺点：原型继承 继承实例属性时， 子类的属性值和父类相同
function Father(age){
this.age = age;
this.money = 2000000;
this.drink = function(){
console.log("喝酒");
}
}
Father.prototype.liaomei = function(){
console.log("撩妹");
}
function Son(){
}
Son.prototype = new Father(38);//原型继承
var son = new Son();
//son.liaomei();
alert( son.age );
混合继承
通过apply或call继承实例属性
通过原型方式 继承 原型方法
function Father(money,firstname){
this.money = money;
this.firstname = firstname;
}
Father.prototype.dance = function(){
console.log("跳舞");
}
Father.prototype.sleep= function(){
console.log("睡觉");
}
function Son(money,firstname){
Father.call(this,money,firstname);
}
//原型继承
Son.prototype = new Father();
var son = new Son("200000","王");
son.dance();
什么是设计模式？
设计模式（Design pattern）是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。使用设计模式是为了可重用代码、让代码更容易被他人理解、保证代码可靠性。
设计模式之单例模式
单例：对象只能实例化一次就叫单例
单例模式：字面量的对象声明，其实在设计模式中可以看作是一种单例模式，所谓单例模式，就是永远保持对象的一个实例。
单利模式的实现思路：
将第一次new出来的对象 this 保存到一个变量中，返回这个变量
再次创建对象时，判断这个变量中是否含有值，如果有值，就直接将这个变量返回
设计模式之代理模式
代理模式: 为其他对象提供一种代理，并以控制对这个对象的访问。
<script type="text/javascript">
function wbq(){
this.performer = function(){
console.log("嗨~~老板");
}
this.realityShow = function(){
console.log("妈妈去哪？");
}
this.running = function(){
console.log("跑男··");
}
}
function jjr(){//代理对象
this.master =new wbq(); //为代理对象指定主人
this.performer = function(money){
if(money>=200000){
this.master.performer();
}
}
this.realityShow = function(money){
if(money>100000){
this.master.realityShow();
}
}
}
var dl = new jjr();
dl.performer(30000000);
</script>
设计模式之适配器模式
适配器模式（Adapter Pattern）是作为两个不兼容的接口之间的桥梁。
将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。
<script type="text/javascript">
function iphone(){
this.playmusic = function(){
console.log("苹果手机可以听音乐");
}
this.phonecall = function(){
console.log("苹果手机可以打电话");
}
}
function ipad(){
this.playmusic = function(){
console.log("平板电脑可以听音乐");
}
}
//模拟一个适配器 功能：判断苹果手机或平板电脑是否可以打电话或听引用
function Adapter(product){
this.product = product;
this.playmusic = function(){
if( this.product.playmusic ){//判断当前产品是否可以听音乐
this.product.playmusic();
}else{
console.log("该产品没有听音乐功能");
}
}
this.phonecall = function(){
if( this.product.phonecall ){//判断当前产品是否可以打电话
this.product.phonecall();
}else{
console.log("该产品没有打电话功能");
}
}
}
var iphone = new iphone();
var ipad = new ipad();
var adapter1 = new Adapter(iphone);
var adapter2 = new Adapter(ipad);
//adapter.playmusic();
function test(adapter){
adapter.playmusic();
adapter.phonecall();
console.log("测试成功~~");
}
test(adapter1);
test(adapter2);
</script>
设计模式之工厂模式
让对象的调用者和对象创建过程分离，当对象调用者需要对象时，直接向工厂请求即可。从而避免了对象的调用者与对象的实现类似编码方式耦合，以提高系统的可维护性、可扩展性。
高内聚： 参数和参数之间的紧密联系性 内聚性越高 ， 表示参数和参数之间的紧密联系性越好
低耦合： 模块和模块之间的独立性， 耦合性越低 独立性越好
欢迎大家持续关注。号内有多个专题，小程序（持续更新中）,Javascript（持续更新）,Vue（视频）等学习资源。觉得有收获的可以收藏关注，欢迎骚扰，一起学习，共同进步。