- 浏览: 3460819 次
- 性别:
- 来自: China
文章分类
- 全部博客 (536)
- ajax (1)
- Algorithm (14)
- Android (40)
- CSS/HTML... (2)
- defy (3)
- DesignPattern (2)
- dorado (0)
- Drools (6)
- English/日本語 (7)
- Flex (2)
- Framework (0)
- Google (3)
- hibernate (13)
- homework (3)
- HTML5 (0)
- IDE (29)
- java (45)
- javaee (7)
- Javascript (14)
- java组件 (5)
- jQuery (4)
- jsp (8)
- jsf (2)
- Linux (2)
- lucene (0)
- mysql (6)
- news (3)
- Oracle (8)
- other (4)
- PHP (5)
- Python (0)
- Software Engineering (3)
- spring (7)
- struts1.x (14)
- struts2.x (14)
- strolling in cloud (1)
- subject:javaEnhance (20)
- Tomcat (7)
- validator (3)
- 学习·方法·心得 (8)
- .NET (2)
- vba (6)
- groovy (5)
- grails (2)
- SWT (0)
- big data (1)
- perl (1)
- objective-c (50)
- product (1)
- mac (7)
- ios (188)
- ios-phone (2)
- ios-system (15)
- ios-network (5)
- ios-file (4)
- ios-db (1)
- ios-media (3)
- ios-ui (27)
- ios-openSource (6)
- ios-animation (5)
- ios-drawing (7)
- c (2)
- ios-app (2)
- ios-course (15)
- ios-runtime (14)
- ios-code (8)
- ios-thread (8)
- ios-LBS (2)
- ios-issue (1)
- ios-design (2)
- Jailbreak (2)
- cocos2d (0)
- swift (16)
- ios-framework (4)
- apple watch (4)
- ios-web (1)
- react native (3)
- TVOS (1)
- OpenGL (1)
最新评论
-
xiaobinggg:
...
Session机制详解 -
菜鸟学生会:
Drools规则工作流引擎开发教程网盘地址:http://pa ...
Drools入门-----------环境搭建,分析Helloworld -
wangyudong:
不是很好用,不支持自动化测试RESTful API,也不支持自 ...
Simple REST Client POST使用方法 -
Paul0523:
很棒的一篇文章,感谢楼主分享
Session机制详解 -
啸笑天:
获取原型对象的三种方法<script>functi ...
复习JavaScript面向对象技术
对象与数组
JavaScript中的对象本质上是一个关联数组,或者说更像java里的?Map数据结构,由key-value组成。如下:
<script> function Person(name , age) { //将name、age形参的值分别赋给name、age实例属性。 this.name = name; this.age = age; this.info = function() { alert('info method!'); } } var p = new Person('yeeku' , 30); for (propName in p) { //遍历Person对象的属性 document.writeln('p对象的' + propName + "属性值为:" + p[propName] + "<br />"); } </script>
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
JavaScript对象都都基于相同基类(Object)的实例,因此所有的JavaScript对象之间没有明显的继承关系,而且JavaScript是一种动态语言,它允许自由地为对象增加属性和方法,当程序为对象的某个不存在的属性赋值时,即可认为是为该对象增加属性。例如:
var p={};
p.age=30;
p.info=function(){
alert("info menthod");
}
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
关于prototype
<script> //创建Person函数 function Person(name , age) { this.name = name; this.age = age; //为Person对象指定info方法 this.info = function() { //输出Person实例的name和age属性 document.writeln("姓名:" + this.name); document.writeln("年龄:" + this.age); } } //创建Person实例p1 var p1 = new Person('yeeku' , 29); //执行p1的info方法 p1.info(); document.writeln("<hr />"); //创建Person实例p2 var p2 = new Person('wawa' , 20); //执行p2的info方法 p2.info(); </script>
上述代码定义了Person函数的同时,也定义了一个Person类,而且该函数就是该Person类的构造器。
但上面为Person对象增加info方法相当不好,有两点原因:
1,性能低下:每次创建实例都会创建info()函数,会造成内存泄漏,引起性能下降,实际上info()方法一个就好了
2,使得info()函数中的局部变量产生闭包:闭包会扩大局部变量的作用域,使得局部变量一直存活到函数之外的的地方。例如:
<script> //创建Person函数 function Person() { //locVal是个局部变量,原本应该该函数结束后立即失效 var locVal = '疯狂Java联盟'; this.info = function() { //此处会形成闭包 document.writeln("locVal的值为:" + locVal); return locVal; } } var p = new Person(); //调用p对象的info()方法 var val = p.info(); //输出val返回值,该返回值就是局部变量locVal。 alert(val); </script>
为了避免这两种情况,通常不在函数定义(也就是类定义)中直接为该函数定义方法,而是使用prototype属性。JavaScript所有的类(也就是函数)都有一个prototype属性,在为JavaScript类的prototype属性增加函数,属性时,即可视为对原有的类的扩展。我们可以理解为增加了prototype属性的类继承了原有的类——这就是JavaScript所提供的伪继承机制。
如下:
<script> //定义一个Person函数,同时也定义了Person类 function Person(name , age) { //将局部变量name、age赋值给实例属性name、age this.name = name; this.age = age; //使用内嵌的函数定义了Person类的方法 this.info = function() { document.writeln("姓名:" + this.name + "<br />"); document.writeln("年龄:" + this.age + "<br />"); } } //创建Person的实例p1 var p1 = new Person('yeeku' , 29); //执行Person的info方法 p1.info(); //此处不可调用walk方法,变量p还没有walk方法 //将walk方法增加到Person的prototype属性上 Person.prototype.walk = function() { document.writeln(this.name + '正在慢慢溜达...<br />'); } document.writeln('<hr />'); //创建Person的实例p2 var p2 = new Person('leegang' , 30); //执行p2的info方法 p2.info(); document.writeln('<hr />'); //执行p2的walk方法 p2.walk(); //此时p1也具有了walk方法——JavaScript允许为类动态增加方法和属性 //执行p1的walk方法 p1.walk(); </script>
伪继承实质上是修改了原来的类,而不是产生一个新的之类,所以原来没有walk()方法的Person类将不存在了。
上面的程序也说明了JavaScript是一门动态语言,不仅可以为对象动态增加属性和方法,还可以为类动态增加属性和方法!
还可以通过使用prototype属性,可以对JavaScript的内建类进行扩展。如下:
<script> //为Array增加indexof方法,将该函数增加到prototype属性上 Array.prototype.indexof = function(obj) { //定义result的值为-1 var result = -1; //遍历数组的每个元素 for (var i = 0 ; i < this.length ; i ++) { //当数组的第i个元素值等于obj时 if (this[i] == obj) { //将result的值赋为i,并结束循环。 result = i; break; } } //返回元素所在的位置。 return result; } var arr = [4, 5, 7, -2]; //测试为arr新增的indexof方法 alert(arr.indexof(-2)); </script>
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
与传统面向对象程序设计语言不同的是,JavaScript中的函数永远是独立的,函数永远是一等功民,函数永远不会从属于其他类,对象。即使这个还个函数是匿名内嵌函数。如下:
<script> //定义Dog函数,等同于定义了Dog类 function Dog(name , age , bark) { //将name、age、bark形参赋值给name、age、bark实例属性 this.name = name; this.age = age; this.bark = bark; //使用内嵌函数为Dog实例定义方法 this.info = function() { return this.name + "的年纪为:" + this.age + ",它的叫声:" + this.bark; } } //创建Dog的实例 var dog = new Dog("旺财" , 3 , '汪汪,汪汪...'); //创建Cat函数,对应Cat类 function Cat(name,age) { this.name = name; this.age = age; } //创建Cat实例。 var cat = new Cat("kitty" , 2); //将dog实例的info方法分离出来 var tmp = dog.info; //通过function的call方法完成cat的调用info方法 alert(tmp.call(cat)); </script>
JavaScript中的方法调用有两种方式:
1,正常方法 obj.method(args...)
2,方法回调 method.call(obj,args...)
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
JavaScript建对象
大致三种方法:
使用关键字new创建对象
<script> //定义一个函数,同时也定义了一个Person类 function Person(name , age) { //将name、age形参赋值给name、age实例属性 this.name = name; this.age = age; } //分别以两种方式创建Person实例 var p1 = new Person(); var p2 = new Person('yeeku' , 29); //输出p1的属性 document.writeln("p1的属性如下:" + p1.name + p1.age + "<br />"); //输出p2的属性 document.writeln("p2的属性如下:" + p2.name + p2.age); </script>
使用Object创建即时对象
<script> var myObj = new Object(); myObj.info = new Function("document.writeln('对象的name属性:' + this.name);" + "document.writeln('<br />');" + "document.writeln('对象的age属性:' + this.age)"); document.writeln("<hr / >"); myObj.name = 'yeeku'; myObj.age = 29; //为对象增加方法 myObj.info(); </script> <script> //创建空对象 var myObj = new Object(); //为空对象增加属性 myObj.name = 'yeeku'; myObj.age = 29; //创建一个函数 function abc() { document.writeln("对象的name属性:" + this.name); document.writeln("<br />"); document.writeln("对象的age属性:" + this.age); }; //将已有的函数添加为对象的方法 myObj.info = abc; document.writeln("<hr>"); //调用方法 myObj.info(); </script>
使用JSON语言创建对象
<script> //代码 var person = { //定义第一个简单属性 name : 'wawa', //定义第二个简单属性 age : 29 , //定义第三个属性:数组 schools : ['小学' , '中学' , "大学"], //定义第四个属性,对象数组 parents :[ { name : 'father', age : 60, address : '广州' } , { name : 'mother', age : 58, address : '深圳' } ], //定义方法 info:function(){ alert("hello world"); } }; alert(person.parents[0].name); </script>
发表评论
-
macrotask和microtask
2017-11-22 16:49 0原文地址:https://github.com/easy ... -
React 高阶组件(HOC)
2017-11-22 16:55 2591原文地址:https://github.com/easy ... -
《ECMAScript 6 入门》笔记
2017-07-15 11:47 916let 和 const 命令 https://gi ... -
js的多种继承方式
2015-07-23 21:52 733构造函数的继承 function ... -
静态页面间数据传递方法总结
2012-03-09 10:41 2029静态压面间数据的传递方法很多,目前经搜索得到主要以下几种方法。 ... -
是生生世世
2011-10-19 08:31 0dialect -
复习JavaScript面向对象技术
2011-09-15 00:11 1749感谢http://sdcyst.iteye.com/ ... -
阿萨德
2011-05-16 23:37 0各位面试官,老师,同学们你们好,我叫朱阳俊,87年出 ... -
撒旦撒打算的
2011-04-19 22:30 0/*** * Excerpted from &quo ... -
sadas
2011-04-12 13:19 0/*** * Excerpted from &quo ... -
结网会辉煌季后ij
2011-02-24 10:30 0http://hunch.com/professions/ ... -
JavaScript变量 没有块范围
2010-10-31 21:38 2242局部变量覆盖全局变量,如下: <script&g ... -
根据IP自动切换城市(腾讯网接口)
2010-10-16 10:57 2366<script src="http: ... -
javascript中event.keycode大全
2010-06-12 09:07 2375keycode 8 = BackSpace BackSpa ... -
event.keyCode ,event.which ,event.charCode
2010-06-12 09:00 6528javascript判断是否按回车 ... -
深入理解Javascript闭包(closure)
2010-05-31 22:07 1224感谢http://softbbs.pconline.co ... -
Aptana使用入门一:Code Assist
2009-12-14 12:07 1966两天我在《不可多得的Javascript(AJAX)开发工具 ... -
不可多得的Javascript(AJAX)开发工具 - Aptana
2009-12-14 12:05 1831自从开始做Web开发起,一直都没有找到一个很让人满意的Java ... -
Javascript刷新页面的几种方法
2009-11-21 13:14 5593Javascript刷新页面的几种方法 非模态刷新父页面:wi ...
相关推荐
在JavaScript中,我们可以使用内置的`JSON.stringify()`方法将JavaScript对象转换为JSON字符串。 ### JSON.stringify()方法 `JSON.stringify()`是JavaScript中的全局函数,用于将JavaScript值转换为JSON字符串。它...
JavaScript对象是编程语言的核心组成部分,尤其在Web开发中扮演着至关重要的角色。"JavaScript对象参考手册"涵盖了这一主题的广泛内容,旨在为开发者提供全面、深入的理解和实用指南。手册分为20个章节,不仅涉及...
什么是对象 简单点说,编程语言中的对象是对现实中事物的简化。例如,我们一个人就是一个对象,但是编程...在后面的JavaScript对象笔记中,记录了菜鸟在学习JavaScript对象的大多数资源,希望这些资源对你也有价值。
### 深入浅出JavaScript对象模型 #### JavaScript对象的本质 根据ECMA262规范,ECMAScript被定义为一种基于对象的语言而非传统的面向对象语言。这意味着在JavaScript中,对象被视为存储数据的一种大型数组形式,...
JavaScript对象是编程中的一种核心概念,它是一种复合数据类型,能够存储多个不同数据类型的属性。在JavaScript中,对象可以通过多种方式创建,其中一种常见的方法是使用`new`关键字和构造函数,例如`new Object()`...
javascript对象创建方法总结,通过这些方法的总结,可以对对象有了更深一步的了解,也加深了对对象的巩固认识。
第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 JavaScript对象.rar第8节 ...
### JavaScript对象模型详解 #### 一、概述 在JavaScript中,对象模型是其核心特性之一,它决定了数据的存储方式以及程序的运行机制。本文旨在深入解析JavaScript对象模型的关键概念,包括基本数据类型、对象、...
JavaScript对象定义是编程语言中的核心概念,它在Web开发中起着至关重要的作用。JavaScript是一种基于原型的对象导向语言,它的对象定义方式具有独特的灵活性。在本文中,我们将深入探讨JavaScript对象的定义、创建...
04 第四章 JavaScript对象及初识面向对象.md
### JavaScript对象大全详解 #### 一、JavaScript简介 JavaScript 是一种强大的、解释型的脚本语言,由 Netscape 公司开发,最初被命名为 LiveScript。随着 Web 技术的发展,JavaScript 成为了网页开发中不可或缺...
JavaScript 对象 JavaScript 中的对象是非常重要的概念,所有事物都是对象,包括字符串、数值、数组、函数等等。对象只是带有属性和方法的特殊数据类型。布尔型、数字型、字符串也可以是一个对象,日期是一个对象,...
本小册"JavaScript对象经典小册 chm"深入探讨了JavaScript中的核心概念——对象和数组,旨在帮助开发者更好地理解和掌握这些基础知识。 一、JavaScript对象 1. 对象概述:JavaScript对象是一种数据结构,它由键值对...
JavaScript对象是编程语言JavaScript中的核心概念,它在Web开发中起着至关重要的作用。JavaScript是一种基于原型的动态类型语言,其对象系统是其灵活性和强大功能的基础。在深入理解JavaScript对象之前,我们需要先...
JavaScript对象是编程语言JavaScript的核心组成部分,它是一种复杂的数据结构,用于存储和操作数据。JavaScript对象是基于原型的,这意味着每个对象都可以从另一个对象继承属性和方法。这种特性使得JavaScript非常...
JavaScript对象模型(Object Model)和执行模型是理解JavaScript工作原理的关键概念。JavaScript是一种基于原型的动态类型语言,其对象模型是其核心特性之一。本文将深入探讨JavaScript的对象模型和执行模型,以及...