什么是面向对象编程
? ? ?用对象的思想去写代码,就是面向对象编程
? ? ? ? ?过程式写法
? ? ? ? ?面向对象写法
? 我们一直都在使用对象
? ? ? ? ? 数组 Array ?时间 Date
面向对象编程(OOP)的特点
? ? ? ? 抽象:抓住核心问题
? ? ? ? 封装:只能通过对象来访问方法
? ? ? ? 继承:从已有对象上继承出新的对象
? ? ? ? 多态:多对象的不同形态
对象的组成
? ? ? ?方法(行为、操作)——函数:过程、动态的
? ? ? ?属性——变量:状态、静态的
? ? ? ? ? ? ? ? ? 创建第一个面向对象程序
? ? ? ? 为对象添加属性和方法
? ? ? ? ? ? ?Object对象
? ? ? ? ? ? ?this指向
? ? ? ? ? ? ?创建两个对象 : 重复代码过多
?
<script>
//var obj = {};
var obj = new Object();  //创建了一个空的对象
obj.name = ‘小明‘;  //属性
obj.showName = function(){  //方法
	alert(this.name);
};
obj.showName();
var obj2 = new Object();  //创建了一个空的对象
obj2.name = ‘小强‘;  //属性
obj2.showName = function(){  //方法
	alert(this.name);
};
obj2.showName();
</script>
?
?
优化面向对象,来封装函数(在面向对象中叫做工厂方式)
?
<script>
//工厂方式 : 封装函数
function createPerson(name){
	
	//1.原料
	var obj = new Object();
	//2.加工
	obj.name = name;
	obj.showName = function(){
		alert( this.name );
	};
	//3.出场
	return obj;
	
}
var p1 = createPerson(‘小明‘);
p1.showName();
var p2 = createPerson(‘小强‘);
p2.showName();
</script>
?工厂方式
?
? ? ? ? ? ? 面向对象中的封装函数
? ? ? ? ? ?改成与系统对象类似写法
? ? ? ? ? ? ? ? ?首字母大写
? ? ? ? ? ? ? ? ?New 关键字提取
? ? ? ? ? ? ? ? ?This指向为新创建的对象
构造函数
? ? ? ? 用来创建对象的函数,叫做构造函数
存在的问题
? ? ? ? ? 对象的引用
? ? ? ? ? 浪费内存
-----------------------------------------------------------------------------------------------
//当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,
而且函数的的返回值直接就是this啦(隐式返回)
?
//new后面调用的函数 : 叫做构造函数
------------------------------------------------------------------------------------------------
?
<script>
//当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,而且函数的的返回值直接就是this啦(隐式返回)
//new后面调用的函数 : 叫做构造函数
function CreatePerson(name){
	
	this.name = name;
	this.showName = function(){
		alert( this.name );
	};
	
}
var p1 = new CreatePerson(‘小明‘);
//p1.showName();
var p2 = new CreatePerson(‘小强‘);
//p2.showName();
alert( p1.showName == p2.showName );  //false
var arr = new Array();
var date = new Date();
</script>
?
?
对象的引用
?
/*var a = [1,2,3]; var b = [1,2,3]; alert( a == b ); //false*/ //var a = 5; //var b = a; //b += 3; ////alert(b); //8 //alert(a); //5 基本类型 : 赋值的时候只是值的复制
?
?
?
//var a = [1,2,3]; //var b = a; //b.push(4); ////alert(b); //[1,2,3,4] //alert(a); //[1,2,3,4] 对象类型 : 赋值不仅是值的复制,而且也是引用的传递
?
?
?
//var a = [1,2,3]; //var b = a; //b = [1,2,3,4]; //有赋值,就重新生成了一块地址 ////alert(b); //[1,2,3,4] //alert(a); //[1,2,3]
?
//var a = 5; //var b = 5; // //alert(a == b); //基本类型 : 值相同就可以
?
?
//var a = [1,2,3]; //var b = [1,2,3]; //alert( a == b ); //false //对象类型 : 值和引用都相同才行
?
var a = [1,2,3]; var b = a; alert( a==b ); //true
?
?
原型-prototype
? ? ? ?概念
? ? ? ? ? ? ?重写对象方法,让相同方法在内存中存在一份(提高性能)
? ? ? ?学习原型
? ? ? ? ? ? ?类比 ?: ?CSS中的Class
? ? ? ?通过原型改写工厂方式
? ? ? ? ? ? ?原则
? ? ? ? ? ? ? ? ? ?相同的属性和方法可以加载原型上
? ? ? ? ? ? ? ? ? ?混合的编程模式
? ? ? ? ?总结面向对象写法
? ? ? ? ? ? ? ?构造函数加属性,原型加方法
?
<script>
//原型 : 去改写对象下面公用的方法或者属性 , 让公用的方法或者属性在内存中存在一份 ( 提高性能 )
//原型 : CSS中的class
//普通方法 : CSS中的style
//原型 : prototype : 要写在构造函数的下面
/*var arr = [1,2,3,4,5];
var arr2 = [2,2,2,2,2];
arr.sum = function(){
	
	var result = 0;
	for(var i=0;i<this.length;i++){
		result += this[i];
	}
	return result;
	
};
arr2.sum = function(){
	
	var result = 0;
	for(var i=0;i<this.length;i++){
		result += this[i];
	}
	return result;
	
};
//alert( arr.sum() );  //15
//alert( arr2.sum() );  //10*/
//原型的写法
var arr = [1,2,3,4,5];
var arr2 = [2,2,2,2,2];
Array.prototype.sum = function(){
	var result = 0;
	for(var i=0;i<this.length;i++){
		result += this[i];
	}
	return result;
};
alert( arr.sum() );  //15
alert( arr2.sum() );  //10
</script>
?
最后面向对象的写法
?
<script>
function 构造函数(){
	this.属性
}
构造函数.原型.方法 = function(){};
var 对象1 = new 构造函数();
对象1.方法();
</script>
?
原文:http://xiaomiya.iteye.com/blog/2158964