`
wangyalei
  • 浏览: 53719 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

js面向对象(一)

    博客分类:
  • AJAX
阅读更多

类是对现实世界中具有相似属性和行为的一类对象的抽象,它体现了面向对象方法论中封装的概念。JavaScript语言中并没有与门定义类的关键字在JavaScript中,一个函数就是一个类,函数名即是类名,方法体的定义可以看做构造函数

function classname(){
    //这里编写类成员的定义
}

 私有成员的定义不其作用域相关,只要不能被外界直接访问,都可以认为是私有成员。

function Person(){
	//定义Person类
	var name = null; //带有var 的是 私有成员 在对象外无法访问 
	var age = null;  //建议无论声明成全局还是局部的最好都加上var
	function setName(pName)
	{
	//设置姓名
	 name = pName;
	}
	function getAge()
	{
	//取得年龄
	return age
	}
}

   公有成员即直接对外公开的属性和方法。
在JavaScript中,使用this关键字是创建公有成员的常用方法。
与强类型语言中的this关键字类似,JavaScript中的this也可以代表某个类在运行时刻的实例。

 

function Person(){
   //定义Person类
    var name = null;
	var age = "20岁";
	this.height = 178.5; 
	//在JavaScript中,可以使用变量保存函数的引用。如果将一个函数引用赋值给公有变量,
	//那么该函数就可以被外界直接调用
	this.setName = function(pName){
	 name = pName;
    };
   this.getAge = function(){
   return age;
   };
}

   强类型语言中使用static关键字定义静态成员,JavaScript中并未提供类似的关键字。
在JavaScript中,为类型直接添加属性成员,该属性成员可以通过“类型.属性”直接访问

 

Person.info = "这是一个Person类";//为Person类添加静态变量
Person.getInstance = function(){//为Person类添加静态方法
return new Person();
}

   JavaScript中的对象是由函数创建的,用来创建对象的函数也称为构造函数或者类型。
JavaScript中的内置类型Object、Array、Date、Math、RegExp、Function、Error
Object是JavaScript中的原始对象类型,其他所有的JavaScript对象都继承自Object

   使用new关键字创建类型对象

 

var now = new Date();//创建了一个Date类的对象
var o = new Object();//创建了一个Object类的对象
var p = new Person();

   1. 当解释器遇到new操作符时首先创建一个新的空对象;
2. 执行Person类型的构造函数,并将其中的this指针都指向该新对象;
3. 如果构造函数中包含不存在的属性,解释器就创建该属性。所以函数的执行实际就是初始化新对象的过程,也就实现 了构造函数的作用;
4. 当函数执行完毕后,new操作符将返回初始化后的对象。

 

  引用对象的属性和方法

对象名.属性(方法)名
对象名["属性(方法)名"]

 使用“.”访问对象成员

var p = new Person();alert(p.height);
p.setName("Jason”);
alert(p.getName());

 使用“[ ]”访问对象成员

var arr = new Array();
arr["push”](1);
alert(arr["length"]);

   动态添加、修改和删除对象的属性和方法
JavaScript语言可以动态的修改(新增、更新或删除)对象的属性或方法

 

var user = new Object()//基于Object原型创建user对象
user.name = "fox”;//为user对象动态添加name属性
user.getName = function(){//为user对象动态添加getName方法
	return this.name;
};
user.name = "jason”;//动态修改name的属性值
user.getName = function(){//动态修改getName方法的定义
	return "I’m " + this.name;
};
user.name = undefined;//删除user对象的name属性
user.getName = undefine;//删除user对象的getName方法

   创建无类型对象(Object Literal)
对象字面量(Object Literal)就是一种帮助我们构建临时对象的无类型对象

“{}”把一系列“属性名:属性定义”括起来定义一个对象,多个属性之间用逗号分隔ment1,
{
  property1:state
  property2:statement2,
  ...,
  propertyN:statementN
}

 Object Literal既可以定义简单对象,也可以定义复杂对象

var obj = {};//定义一个空对象
var user = {//定义了一个user对象
	name:"fox",age:20,sex:"femal",
	sayHello:function(){
	alert("Hello! I’m " + this.name + "!");
      },
	favoriteColor:["red","pink"]
};
for(var i in user.favoriteColor){
	alert(user.favoriteColor[i]);
}
user["sayHello"]();"]();

 以上就是简单的对js面向对象的简单介绍,一下是个简单的例子

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>面向对象</title>
<script language="javascript">
function one(){
/*第一种构造方法*/
var a = new Object();
a.x = 1; a.y = 2;
alert();
/*第二中构造方法*/
var b = {x:1,y:2};  //带有var 的是 私有成员 在对象外无法访问 
alert(b.x);
alert(b.y);

// 声明一个共有的属性
this.lenght ={

 valueOf:function(){
	
	}

 }

}

/*第三中构造方法*/
function two(x,y){
  
  this.x = x; //共有属性 可以通过"."的形式进行访问
  this.y = y;
}

//对象的实例
function Instatnce(){
	 
 var t = new two(1,2);
 alert(t.x);
 alert(t.y);
}

//对象的共有和私有
function List(){
  
	var m_elements = [];
	m_elements = Array.apply(m_elements,arguments);
	this.length = {
		
		   valueOf:function(){
			  
				return m_elements.length;
			   
			  },
			 
			toString:function(){
				
				 return m_elements.length;
				
				}
		}
		
this.toString = function(){
		
		return m_elements.toString();
		
		}
	this.add = function(){
		
		return m_elements.push.apply(m_elements,arguments);
		
		}
}


	 //测试共有 私有
	 function test(){
		 var list = new List(1,2,3);
		 alert(list);
		 alert(list.length);
		 list.push(4,5,6);
		 alert(list.toString());
                                 alert(list.add());		
		 alert(list);
		 
		 }
 </script>
</head>

<body>
 <input  type="button" onclick="Instatnce()"  value="面向对象"  />
 <input type="button" onclick="test()" value="共有私有" />
</body>
</html>
分享到:
评论

相关推荐

    js 面向对象实例

    在JavaScript面向对象的上下文中,我们可以创建专门处理Canvas绘图的类,封装复杂的绘图逻辑: ```javascript class Circle { constructor(x, y, radius) { this.x = x; this.y = y; this.radius = radius; } ...

    Javascript面向对象编程.

    在提供的资源中,《代码之美》PDF文件可能包含了关于编程实践和代码风格的指导,而《Javascript面向对象编程》PPT可能更具体地阐述了JavaScript OOP的细节和示例。学习这些材料将有助于深入理解JavaScript的面向对象...

    JS面向对象经典案例

    JS 面向对象经典案例 ...JavaScript面向对象编程提供了一种创建和组织代码的方式,能够让开发者更好地组织和维护代码。通过使用对象、类、继承、原型链和闭包等概念,我们可以创建更加灵活和可维护的代码。

    面向对象JavaScript精要(英文原版pdf)

    《面向对象JavaScript精要》是一本非常有价值的书籍,不仅适合初学者入门,也适合有一定经验的开发者进阶学习。通过学习本书,读者可以全面掌握面向对象编程的基本概念,并学会如何将这些概念应用到JavaScript中,...

    JS面向对象的基础大家去看JS面向对象的基础

    JS面向对象的基础 写的很好的,大家去看JS面向对象的基础 JS面向对象的基础 写的很好的,大家去看JS面向对象的基础

    JavaScript面向对象编程指南.pdf

    JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在... 《JavaScript面向对象编程指南》着重介绍JavaScript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库

    JavaScript面向对象编程指南

    《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...

    JAVASCRIPT 面向对象编程精要

    ### JavaScript面向对象编程精要 #### 一、引言 JavaScript是一种灵活且强大的脚本语言,它虽然起源于一种简单的浏览器脚本语言,但随着时间的发展,JavaScript已经成为了一种功能全面的编程语言,尤其是在Web开发...

    Javascript 面向对象的JavaScript进阶

    ### JavaScript面向对象进阶知识点详解 #### 8.1 面向对象编程的基本特性 在探讨面向对象的JavaScript之前,我们首先需要了解面向对象编程(Object-Oriented Programming, OOP)的基本特性:封装性、抽象性、继承...

    猜拳游戏:java面向对象,kotlin面向对象,js面向对象,3个方法开发.zip.lnk

    猜拳游戏:java面向对象,kotlin面向对象,js面向对象,3个方法开发.zip.lnk猜拳游戏:java面向对象,kotlin面向对象,js面向对象,3个方法开发.zip.lnk猜拳游戏:java面向对象,kotlin面向对象,js面向对象,3个...

    javascript面向对象框架

    "javascript面向对象框架"这一主题涵盖了JavaScript中实现面向对象编程的框架,特别是Prototype和MooTools这两个优秀的库。 Prototype是JavaScript的一个开源库,它扩展了JavaScript的基本对象和函数,提供了强大的...

    js 贪吃蛇(面向对象)

    总结来说,"js 贪吃蛇(面向对象)"案例提供了学习和实践JavaScript面向对象编程的好机会。通过分析和实现这个案例,开发者可以深入理解面向对象的设计原则,提高代码复用和维护性,同时也能体会到面向对象编程在...

    JavaScript面向对象编程指南(第2版).rar

    JavaScript是一种广泛...通过深入学习这本《JavaScript面向对象编程指南(第2版)》,开发者不仅能掌握JavaScript的面向对象编程基础,还能了解到实际项目中如何有效地运用这些知识,提升编程技巧和解决问题的能力。

    javascript面向对象编程.pdf

    总而言之,学习现代JavaScript面向对象编程,有助于开发者在认识这门语言演化的基础上,运用面向对象的设计和编程模式来构建更加健壮和可维护的JavaScript应用程序。同时,测试和调试是保证代码质量不可或缺的环节,...

    js面向对象简单理解

    JavaScript是一种广泛应用于Web开发的动态编程语言,尤其以其强大的面向对象特性而闻名。面向对象编程(Object-Oriented Programming,OOP)是编程的一种范式,它基于“对象”概念,将数据和处理数据的方法封装在...

Global site tag (gtag.js) - Google Analytics