js面向对象

Posted 2020-07-17 carol72

一.对象的组成

	/*
	面向对象编程的特点
		抽象：抓住核心问题
		封装：只能通过对象来访问方法
		继承：从已有对象上继承出新的对象
		多态：多对象的不同形态
	1.对象的组成
		方法（行为、操作）——函数：过程、动态的
		属性——变量：状态、静态的
	
	 * */
	
	//对象的组成
	var arr=[];
	//对象下面的变量：叫做对象的属性
	arr.number=10;
//	alert(arr.number);
//	alert(arr.length);

	//对象下面的函数：叫做对象的方法
	arr.test=function(){
		alert(123);
	}
	arr.test();

二.创建第一个面向对象程序

//创建了一个空的对象
	var obj=new Object();
	//属性
	obj.name=‘小明‘;
	//方法
	obj.showName=function(){
//		alert(obj.name);
		alert(this.name);
	}
	obj.showName();

三.工厂方式

/*
	工厂方式
		面向对象中的封装函数
		改成与系统对象类似写法
			首字母大写
			New关键字提取
			This指向为新创建的对象
                             当new去调用一个函数：这个时候函数中的this就是创建出来的对    象，而且函数的返回值直接就是this了（隐式返回）              
		构造函数
			用来创建对象的函数，叫做构造函数
                        new后面调用的函数
		存在的问题
			对象的引用
			浪费内存
	 * */
//	var obj=new Object();
//	obj.name=‘小明‘;
//	obj.showName=function(){
//		alert(this.name);
//	}
//	obj.showName();
	
	
//	var obj1=new Object();
//	obj1.name=‘小强‘;
//	obj1.showName=function(){
//		alert(this.name);
//	}
//	obj1.showName();
	
	function creatPerson(name){
		//1.原料
		var obj=new Object();
		//2.加工
		obj.name=name;
		obj.showName=function(){
			alert(this.name);
		}
		//3.出场
		return obj;
	}
	var p1=creatPerson(‘小明‘);
	p1.showName();
	var p2=creatPerson(‘小强‘);
	p2.showName();    




//提取new
	function creatPerson(name){
		//1.原料
//		var obj=new Object();
		//2.加工
		this.name=name;
		this.showName=function(){
			alert(this.name);
		}
		//3.出场
		return obj;
	}
	var p1=new creatPerson(‘小明‘);
	p1.showName();
	var p2=new creatPerson(‘小强‘);
	p2.showName();                         

四.原型

/*
 原型：去改写对象下面公用的方法或者属性，让公用的方法或者属性在内存中存在一份（提高性能）
 * */
	
	
/*
var a=[1,2,3];
var b=[1,2,3];
alert(a==b); //false
*/


/*
var a=5;
var b=a;
b+=3;
//alert(b);
//基本类型：赋值的时候只是复制
alert(a);
*/

/*
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); //true

var a1=[1,2,3];
var b1=[1,2,3];
//对象类型：值和引用都相同才行
alert(a1==b1); //false

var a2=[1,2,3];
var b2=a2;
//对象类型：值和引用都相同才行
alert(a2==b2); //true

原型

/*
原型-prototype
	概念
		去改写对象下面公用的方法或者属性，让公用的方法或者属性在内存中存在一份（提高性能）
	学习原型
		类比：CSS中的Class
	通过原型改写工厂方式
		原则
			相同的属性和方法可以加在原型上
			混合的编程模式
	总结面向对象写法
		构造函数加属性，原型加方法
		
		function 构造函数(){
			this.属性
		}
		构造函数.原型.方法=function(){}
 		var 对象1=new 构造函数();
 		对象1.方法();
 * */
	
	
/*var arr=[1,2,3,4];
var arr1=[2,2,2,2,2,2,2];
arr.sum=function(){
	var result=0;
	for (var i=0;i<this.length;i++) {
		result+=this[i];
	}
	return result;
}
arr1.sum=function(){
	var result=0;
	for (var i=0;i<this.length;i++) {
		result+=this[i];
	}
	return result;
}
alert(arr.sum());
alert(arr1.sum());*/

var arr=[1,2,3,4,5];
var arr1=[2,2,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());
alert(arr1.sum());


Array.prototype.number=20;
//优先级高
arr.number=10;
alert(arr.number); //10