面向对象
一、面向对象与面向过程的异同：
动态创建一个元素，并添加到页面中去：
jquery实现方式：
以下是面向对象的方式组织代码（管理者）
Js实现方式：
以下方式 是使用面向对象过程的方式来组织代码（执行者）
创建一个div元素，设置div内容，将div追加到页面中去
面向过程：所有的细节、步骤、过程要一步步亲历亲为（执行者）
面向对象：找到能完成这个事情的对象，让它帮你完成（调度者）
面向对象是对面向过程的封装。
// 通过标签名获取元素
function tag(tagStr) {
return document.getElementsByTagName(tagStr);}
var divs= tag("div");
for(var i= 0; i< divs.length; i++) {
divs[i].style.border= "1px dotted red";
8}
var ps= tag("p");
for(var i= 0; i< ps.length; i++) {
ps[i].style.border= "1px dotted red";
}
二、全局污染
使大量函数无法管理；
在全局范围内都有效
三、常用DOM操作
1、获取元素操作
getElementById getElementByTagName getElementByClassName
2、元素节点操作
appendChild（追加子节点）
insertBeforeChild（在某节点前插入节点）
removeChild（移除子节点）
replaceChild（替换子节点）
cloneNode(克隆节点)
createElement（创建标签）
createTextNode(创建文本节点)
3、属性节点操作
getAttribute（获取标签属性） setAttribute（设置标签属性） removeAttribute(移除标签属性)
4、常用DOM属性
className innerHTML innerText/textContent value children
5、DOM就是一个非常典型的面向对象，所有节点都对象
五、对象字面量
1、对象是键值对的集合
// json 的表示法， 对象字面量（直接量）
var p= {
name: "jim",
age: 19,
sex: "男",
sayHello: function() {
alert("你好，哈哈哈哈");
}};
p.sayHello();p["sayHello"]();// 关联数组
2、字面量的缺点是：无法复用
3、构造函数优势是：可以复用
构造函数使用注意点：
函数名以大写字母开头（推荐）；
不需要返回值；
为对象添加成员使用：this.成员名=值；
创建对象使用new关键字。
var Person= function() {
this.name= "jim";
this.age= 19;
this.gender= "男";
this.sayHello= function() {
alert("你好，哈哈哈哈");
};};// 创建对象（构造函数Person的对象）var p= new Person();// 访问对象的 属性console.log(p.name);// 访问对象的 方法p.sayHello();
六、函数的参数注意点
1、把函数参数看作是变量，只能在函数内部使用
2、函数调用时参数传入顺序不能颠倒
3、参数的值是在函数被调用时通过传入的设置的值
4、函数调用时传入参数，则函数内部获取参数的值为：undefined
原型（prototype）
一、原型的说明
1、只要是函数就有prototype属性，即函数的原型属性
2、函数的原型属性（prototype）是对象类型的
3、由构造函数创建出来的对象，会默认链接到其构造函数的这个（prototype）属性上
4、构造函数的prototype属性的作用是：实现数据共享
5、属性查找规则：
首先会在当前对象中查找有没有该属性；
如果当前对象中没有，就会在构造函数的定义规则中查找
如果没有，就会到与对象联系起来的构造函数的prototype属性中找
6、属性修改和读取的区别
获取操作：
遵循5、
赋值操作（只与当前对象有关）;
只会操作对象本身，如果对象中没有该属性则创建该属性，并赋值；如果对
象中有，则修改
二、_proto_ 与prototype的区别
_proto_
1、_proto_ 是一个非标准的属性
2、对象的_proto_与创建它的构造函数的prototype是一个东西
相同点
Prototype
1、是原型属性
_proto_ 与prototype的异同：
相同点：这两个都是属性，存储的是对象的引用
这两个属性的引用指向了同一个对象
不同点：
站在不同角度去看这两个属性：
Protytype是站在构造函数的角度
_proto_是站在对象的角度，是非标准属性
原型属性和原型对象：
是同一个东西，只是站在同一个角度去看这一个东西，对它的不同叫法。
原型的一些结论：
1.只要是函数就有prototype属性
2.由构造函数创建出来的对象会默认链接到其构造函数的prototype属性上
3.函数的protytype属性的类型是：object
4.原型的作用：数据共享（实际是为了实现继承）
JavaScript 面向对象基础复习填空练习题：
1.JavaScript 的构成: _dom____, _bom____,和 __ECMAscript__.
2.JavaScript 的数据类型分为两种:基本数据类型_____, _复杂数据类型____.
和 空类型（null和undefined）
基本类型有: ____string_, boolean_____, number_____.
复合数据类型: ___Array_ Function Date Object_.
Math
特殊类型: null undefined_____,
3.常见的内置对象有: __Math_()__, __String()___, _Data()____, ____Function()_, Boolean()_____, RegExp()___, Number()___,和 _Array()Object()_.
4.将代码进行封装,复用的逻辑单元 称为 _函数____.
5.定义函数的基本语法为:
1>
函数声明方式：function array(){ ｝
2>
函数表达式： var array=function(){}
6.什么是对象: ___无序键值对的集合__.
7.什么是属性: __对象键如果是一个普通的类型（非函数）
8.什么是方法: __如果一个对象的属性是一个函数此时就叫做方法___.
成员包括：属性和方法
9.原型的基本概念
：
10.对象的原型是什么 __构造函.prototype_____.
11.如何获得原型对象: ___构造函.prototype__和 对象._proto____.
12.原型的作用(为什么需要原型): __数据共享__.
13.继承的概念
一、javaScript的类型：
是一个弱类型的语言，弱类型体现在什么地方？
1.是有类型的
2.它不受类型的约束
3.Typeof无法准确获取对象的类型
二、为什么要获取对象的类型？怎样获取？
1、使封装变得简单方便
2、通过对象获取：
每个原型对象中有个属性叫做constructor（构造器）,是原型提供的属性，而这个原型（也就是构造函数的prototype的值）是对象类型的，这个constructor属性，又指向了一个构造函数
获取方式一：通过截取字符串获取
var s= ctr.constructor + "";s= s.replace("function","|");
var start= s.indexOf( '|' );var end= s.indexOf('(');if ( start!= -1 && end!= -1 ) {
var name= s.slice(start + 2, end);
alert("|" + name+ "|" );}
获取方式二：通过正则表达式获取
封装后：
获取方式三：通过name属性获取（兼容性问题，IE不支持）
三、面向对象特征介绍
1、三大特征：封装、继承、多态（了解）
继承的两种方式：
原型继承、混入继承：
混入继承：
2、原型继承：
原型继承的实现方式：
方式一：利用对象的动态特性
// 对象的动态特性var o= {};
o.name = "川川";
o.age = 19;
o.gender= "男";
function Person() {}
// 将需要的属性添加到原型对象中Person.prototype.sayHi= function() {};
var p= new Person();p.sayHi();
方式二：利用覆盖原型对象的方式
注意：想要变得更严谨需要加入constructor:Person
方式三：利用混入继承来给原型对象添加成员
原型继承的结论：
1、任何函数都可以做为构造函数
2、函数默认就有一个prototype属性
3、函数的prototype就是原型
4、构造函数的prototype的类型是对象
5、通过构造函数创建出来的对象默认会链接到构造函数的prototype中
6、原型的成员可以被对象共享
3、经典继承（Object.create）
var o1= {
sayHi: function() {
alert("hello，i am chuanchuan");
}};
var o2= Object.create(o1);
四、原型链
1、理解： 对象有原型对象，原型对象也是对象，所以原型对象也有原型对象，这样一环扣一环就形成了原型链。
2、原型链结构
3、简单数据的内存逻辑
基本数据类型：存储的是数据本身
复杂数据类型：存储的是数据的引用
五、构造函数
是一种函数，主要用来创建对象时，对对象进行初始化（即为对象成员赋初始值），与new运算符一起使用
方式三：利用混入继承的方式
原型相关结论：
想要创建一个对象，就要有一个构造函数;
如果想让某个对象继承自另外一个对象 ，只需要修改该对象的原型对象
六、构造函数和原型的结论：
1、只要是函数就有prototype属性
2、函数的属性prototype是一个对象类型
3、属性prototype是一个含有constructor和_proto_属性的对象
4、Constructor属性指向的是当前的构造函数
5、函数的prototype属性扬表示的对象继承自Object.prototype
七、自定义对象与构造函数的结论
1、对象P是Person的实例
2、P继承自Person.prototype
3、P._proto_就是Person.prototype
八、原型继承Object.create
创建对象的两种方式：
Object.create会创建一个对象 ，并且这个新对象会继承原对象的属性
九、Object.prototype常用成员
1、Constructor
2、hasOwnProperty
作用：判断有没有指定的属性，如果属性是自身提供的就返回true，否则返回false
语法：object.hasOwnProperty(属性名)
Eg：
var o= {name: "abc"};
var hasName= o.hasOwnProperty("name");
console.log(hasName);
3、isPrototypeOf
作用：判断对象1是否为对象2的原型对象，如果是返回true，否则返回false
语法：对象1.isPrototypeOf(对象2)；
· 示例
function Person() {}
var p= new Person();
console.log(Person.prototype.isPrototypeOf(p));
console.log(Person.prototype.isPrototypeOf(Person));
4、propertysEnumerable
作用：表示属性必须是自己提供的，同时可被枚举的，就返回true，否则返回false
语法：对象.propertyIsEnumerable(属性名)；
5、toString、toLocalString、valueOf
var d= new Date();
console.log(d.toString());
console.log(d.toLocalString());
6、Instanceof
作用：用于检测构造函数的prototype属性所指向的对象是否存在于被检测对象的原型链上
规律：创建对象以后，没有给其构造函数的prototype属性重新赋值那么就返回true；
创建对象时构造函数prototype属性所指向的对象
练习题：
JavaScript 面向对象
1、原型的基本概念
对象的原型是什么 __构造函数的prototype属性的值___.
如何获得原型对象: __构造函数.protytype___和 ___Object._proto___.
原型的作用(为什么需要原型): __实现继承___.
如何给原型对象添加成员:
1利用覆盖原型对象添加成员
2利用混入继承
2、继承的概念
自定义构造函数 Foo创建的对象 obj 继承自 _Foo.prototype____.
自定义构造函数 Foo的原型属性 prototype继承自 __Object.prototype___.
如何获得函数 Foo的原型: __Foo.prototype___.
如何获得对象 obj的原型对象: ___obj._proto___.
默写经典继承语法:
3、绘制内存逻辑图
1、var arr = [ 1, 2, 3 ];
2、var arr1 = [ 1, 2, 3 ];
var arr2 = arr1;
arr1 = [ 4, 5, 6 ];
3、function Fn() {}
var f1 = new Fn();
4、function Fn() {}
var f1 = new Fn();
Fn.prototype = {};
5、function Fn() {}
var f1 = new Fn();
Fn.prototype = {};
var f2 = new Fn();
4、Object对象
如何获得数据的类型: __name、字符串截取、正则表达式___.
Object.prototype 包含哪些常用方法: _isPrototypeOf hasOwnPrerty propertyIsEnumerable____.
hasOwnProperty 方法的语法和含义是什么: ___判断是否是本身提供的属性是返回true语法：_object.hasOwnProperty(属性名)
.
isPrototypeOf 方法的函数与语法是什么: __判断对象1是不是对象2的原型 对象1 inPrototypeOf 对象2___.
propertyIsEnumerable 方法的含义与语法是什么: ___示属性必须是自己提供的，同时可 被枚举的，就返回true，否则返回false
语法：对象.propertyIsEnumerable(属性名)；
__.
构造函数默认参数是什么: ____this_.
