面向对象
Posted 我一人，我异人，我亦人
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了面向对象相关的知识，希望对你有一定的参考价值。
01 基础理论
//面向对象和面向过程
//1 面向对象是一种编程思想，很多语言都是面向对象的，比如Java js c++ OC等
//2 所有的面向对象的语言有三大特性 1封装 2 继承 3 多态
//3 在面向对象的思想里有一种非常重要的理论是“万物皆对象”
//4 面向对象中有“类和对象”的概念
//类：具有相同特征和行为的事物的 抽象
//对象（实例）：类的具体化
//特征——>属性 行为——>方法
//5 js中的数据类型分为两大类
//5.1 原始类型 number Boolean string 空类型 未定义类型(原始类型就是存储一些简单的数据）
//5.2 引用类型：Array Date Function Error Reg Object等
//其中object是一个什么都没有的空类
//原料+加工+出厂 称为工厂方法
//createPerson()称之为构造函数
//当获取某对象的属性的值的时候??，系统首先判断该对象是否有这个属性 如果有 就返回
//如果没有 就去构造函数的原型中去找是否含有该属性 如果还没有 就去Object的构造函数的原型中去找
//如果都没有 就返回undefined
//上述查找属性值的过程称之为‘原型链‘
重点部分
1 常用的布局方式
2 动画处理方式
3 多线程
4 第三方框架的使用
5 js中捕获和冒泡
6 原型链
02 继承+tab切换+闭包
<!--将已有代码改成面向对象的写法需要满足
1 所有代码在onload内部
//改写的技巧
2 onload相当于面向对象中的构造函数 都是进行初始化操作
3 变量相当于对象的属性
4 函数相当于对象的方法
5 注意：不允许出现函数嵌套函数
总结：面向对象中的80%的坑都来自于this！！！！
-->
<!--原生js和面向对象的区别
1 前者思考成本低 速度快
后者可利于维护，思考成本高
2 前者使用不便 后者使用极为方便
注意：tab切换面向对象的写法 要求 会手写！！！
继承
call()
eg:
//子类
function Worker(name,sex,job){
//构造函数伪装—>在子类中调用父类的属性赋值
//call:调用父类的构造函数 //call里的this指的是new出来的worker对象
//继承第一步：通过call方法实现继承父类属性
Person.call(this,name,sex);
this.job=job;
}
//直接交换原型：会把原型包含的所有属性全都自动赋值
//继承第二步：通过给原型直接赋值
Worker.prototype=Person.prototype;
json
//原型中的属性是类共有的(相当于className中的初始化设置)
Cat.prototype.type="猫科动物";
闭包
//闭包是什么？ 外部函数嵌套内部函数 并把内部函数返回
//闭包的特点？ 1 内部函数可以使用外部函数的形参和变量 2 变量会永久存在在内存中 不会被系统回收
//闭包的应用(好处) 1 避免全局变量被污染 2 可以获取下标(两种写法,了解)
//垃圾回收机制
//当函数执行完毕，系统会自动回收函数和其内部局部变量所占的内存。当 再次调用函数时，重新申请内存
//闭包 函数嵌套时,在内部函数中可以使用外部函数的变量或者形参
//闭包中的变量在内存中永久存在
匿名函数自调用
//下面这种写法，函数会自动调用一次
// ( function(){} ) ()；
(function(){
alert(111);
})();
//传形参的写法
(function(i){
alert(i);
})(2);
两个li点击事件 点击输出当前下标 用匿名函数+闭包
//写法一：
//外部函数是匿名函数自调用
//内部函数是onclick事件对应的函数
//在内部函数中使用了外部函数的形参i
/*for (var i=0;i<lis.length;i++) {
(function(a){
lis[a].onclick=function(){
alert(a);
}
})(i)
}*/
//写法二：
for (var i=0;i<lis.length;i++) {
lis[i].onclick=(function(i){
return function(){
alert(i);
}
})(i);
}
//需要掌握的
function aaa(){
var a=10;
return function(){
a++;
alert(a);
}
}
var c=aaa();
c();//11
c();//12
以上是关于面向对象的主要内容，如果未能解决你的问题，请参考以下文章