收藏了也不看的JavaScript，面向对象程序设计（上）！

我在我的其他几篇文章里面，给大家安利《JavaScript高级程序设计》。我喜欢叫它红宝书，这几天我在下班的闲暇时间继续看这本书，我发现真的是讲的太细致了。我决定今天不分享笔记了，我要给你们做一次搬运工。而且我发现我那几篇的文章，我是为了我写起来也方便，如果收藏关注了的小伙伴看起来也直观，但是头条不给我推送... 但今天这个我是专门来一篇给大家分享一下这部分的内容，这部分要上全理解了你就真的很强了哈哈。这本书也真的是验证了书中自有黄金屋，书中自有颜如玉的道理～ 如果大家看书不方便的话，可以私信我，我这里有pdf的～ 废话这么多开始了 哈哈。

先分享一下我自己的一些笔记～

对象

万事万物皆对象

对象是一个整体，对外提供一些功能

一切具有属性和方法的事物

一切具有本质特征和行为的物质

人：

属性---人的本质特征：身高 体重 性别 年龄

方法---人的具有的行为：吃、喝、走路、学习

属性 --- 静态

方法 --- 动态

数据类型：

所有的基本数据类型都没有属性和方法

所有的对象数据类型都有属性和方法

函数和方法的区别：方法属于函数，函数包含方法

类的概念：类是具有相同本质特种的一类实物的总称 js 中的类，js中的类---构造函数

类的对象的区别：类是对象的抽象，对象是类型实例（类是对象的抽象化，对象是类的具象化）

先有对象，根据一类对象的共同特征抽象出类的概念

面向对象

面向对象编程：是一种编程思想

面向过程和面向对象：

面向对象语言： php java .net c++

面向过程语言： c语言

实例：

一条公路长10公里，人行驶的速度 1000m/h 问走过这段路程需要多久？

面向过程： h = x/v

面向对象：

公路 -- 长度 length 10公里

人 -- 速度 speed 1000m/h

结果 = 公路.length / 人.speed;

创建对象

第一种方法：

var obj = new Object(); // 定义对象

obj.name = "zhansan"; //定义对象属性

obj.age = 12;

obj.walk = function(){ //定义对象方法

alert("行走方法");

}

第二种方法：

var obj = {

"name":"xm",

"age":12,

"walk":function(){

console.log("行走方法")

}

};

严格的json对象是只有属性没有方法

上述方式创建同类对象时，会产生重复的代码

下图是书上的例子

工厂模式（设计模式）

优点：可以解决同类对象创建时 重复代码 写多次的问题

缺点：

不能确定某个对象属于哪一个类

一般一个对象是通过new关键字构造出来的，而工厂模式只是一个普通的函数调用，不符合对象创建规范。

工厂模式 -- 模具

function createObj(){

//备料 --- 创建对象

var obj = new Object();

//加工 --- 为对象添加属性和方法

obj.name = name;

obj.tel = tel;

obj.say = function(){

return "hello";

}

//出厂 --- 将创建的对象返回

return obj;

}

构造函数（面向对象的类）

构造函数中的属性 叫做实例属性

构造函数中的方法 叫做实例方法

为了和普通函数区分，一般构造函数的命名规范是 大驼峰

基本上所有的对象都是通过构造函数创建出来的

构造函数中的this 指向的是 构造函数执行是创建出来的那个对象

优点：解决了工厂模式中存在的缺点，可以通过构造函数方式 确定某个对象属于哪一个类

缺点：同类对象创建时，相同方法会重复创建，空间不共享

//定义一个构造函数

function Animal(name,age,food){

//构造函数中的this 指向的是构造函数执时创建出来的那个对象

this.name = name;

this.age = age;

this.food = food;

this.eat = function(){

return this.name + "正在吃" + this.food;

}

}

var animal = new Animal("大黄",2,"骨头");

原型prototype

写在原型函数中的属性叫做 原型属性

写在原型函数中的方法叫做 原型方法

优点：解决了相同对象创建时方法重建的问题

缺点：多个对象的属性值相同，不能更改

function Student(){

}

Student.prototype.name = "xm";//原型属性

Student.prototype.age = "18";

Student.prototype.study = function(){

return "小明在学习";

}

var stu = new Student();

混合

将属性写成构造函数的实例属性

将方法写成构造函数的原型方法

定义一个混合函数

function Go(name,age){

this.name = name;

this.age = age;

}

Go.prototype.study=function(){

return "啦啦啦"

}

var sss = new Go("Jay",18);

alert(sss.name);

alert(sss.study());

章节过长，为避免阅读疲劳，剩下章节留待后面讲解，大家可以持续关注。号内有多个专题，小程序 vue js等优质好文。觉得有收获的可以收藏关注，欢迎骚扰，一起学习，共同进步

---

最后推广一下自己的小程序，如果你也喜欢锻炼的话在这里寻找你的小伙伴吧。

自律更自由，一只喜欢锻炼的程序猿，嘿嘿。

你都看到这了，不点个关注就过分了哈～