首页 > Web开发 > 详细

js面向对象

时间:2018-01-24 19:03:32      阅读:170      评论:0      收藏:0      [点我收藏+]

一.对象的组成

	/*
	面向对象编程的特点
		抽象:抓住核心问题
		封装:只能通过对象来访问方法
		继承:从已有对象上继承出新的对象
		多态:多对象的不同形态
	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

  

  

  

  

  

 

js面向对象

原文:https://www.cnblogs.com/yangxue72/p/8342700.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!