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

javascript面向对象技术基础(二)

阅读更多

数组
我们已经提到过,对象是无序数据的集合,而数组则是有序数据的集合,数组中的数据(元素)通过索引(从0开始)来访问,数组中的数据可以是任何的数据类型.数组本身仍旧是对象,但是由于数组的很多特性,通常情况下把数组和对象区别开来分别对待(Throughout this book, objects and arrays are often treated as distinct datatypes.This is a useful and reasonable simplification; you can treat objects and arrays as separate types for most of your JavaScript programming.To fully understand the behavior of objects and arrays, however, you have to know the truth: an array is nothing more than an object with a thin layer of extra functionality. You can see this with the typeof operator: applied to an array value, it returns
the string "object".  --section7.5).
创建数组可以用"[]"操作符,或者是用Array()构造函数来new一个.

var array1 = [];  //创建空数组
var array2 = new Array();  //创建空数组
array1 = [1,"s",[3,4],{"name1":"NAME1"}]; //
alert(array1[2][1]);  //4   访问数组中的数组元素
alert(array1[3].name1); //NAME1 访问数组中的对象
alert(array1[8]);   //undefined
array2 = [,,];  //没有数值填入只有逗号,则对应索引处的元素为undefined
alert(array2.length); //3
alert(array2[1]);     //undefined

 用new Array()来创建数组时,可以指定一个默认的大小,其中的值此时为undefined,以后可以再给他们赋值.但是由于javascript中的数组的长度是可以任意改变的,同时数组中的内容也是可以任意改变的,因此这个初始化的长度实际上对数组没有任何的约束力.对于一个数组,如果对超过它最大长度的索引赋值,则会改变数组的长度,同时会对没有赋值的索引处赋值undefined,看下面的例子.

var array = new Array(10);
alert(array.length);   //10
alert(array[4]);       //undefined
array[100] = "100th";  //这个操作会改变数组的长度,同时将10-99索引对应的值设为undefined
alert(array.length);   //101
alert(array[87]);      //undefined

 可以用delete操作符删除数组的元素,注意这个删除仅仅是将数组在该位置的元素设为undefined,数组的长度并没有改变.我们已经使用过了数组的length属性,length属性是一个可以读/写的属性,也就是说我们可以通过改变数组的length属性来任意的改变数组的长度.如果将length设为小于数组长度的值,则原数组中索引大于length-1的值都会被删除.如果length的值大于原始数组的长度,则在它们之间的值设为undefined.

var array = new Array("n1","n2","n3","n4","n5");  //五个元素的数组
var astring = "";
for(var i=0; i<array.length; i++) {           //循环数组元素
    astring += array[i];
}
alert(astring);       //n1n2n3n4n5
delete array[3];                   //删除数组元素的值
alert(array.length + "_" + array[3])  //5_undefined

array.length = 3;    //缩减数组的长度
alert(array[3]);     //undefined
array.length = 8;    //扩充数组的长度
alert(array[4]);     //undefined

 对于数组的其他方法诸如join/reverse等等,在这就不再一一举例.

通过上面的解释,我们已经知道,对象的属性值是通过属性的名字(字符串类型)来获取,而数组的元素是通过索引(整数型 0~~2**32-1)来得到值.数组本身也是一个对象,所以对象属性的操作也完全适合于数组.

var array = new Array("no1","no2");
array["po"] = "props1";
alert(array.length);   //2
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1
 
分享到:
评论
18 楼 yuyee 2009-05-04  
很不错,赞一个,收藏系列
17 楼 zhuxinyu 2009-04-29  
风雪涟漪 写道

因为 firefox 忽略逗号后面为空的情况了。。。如 a=[1,2,] 在firefox 只有2个 ie里认为还有第三个元素是undefined.浏览器差异把。一个逗号。。。。呵呵

这一点还是认为IE做的比较正确。
16 楼 zhuxinyu 2009-04-29  
hanjs 写道

你指定了9,是number,那么肯定可以处理的。我说的数组按其本意是只接受数字作为下标的。如果增加了string的,那么就和map差不多了,形成了key与value的形式


这个应该是给对象添加了一个属性,属性名称是key。值是value
15 楼 forgood 2009-02-23  
delete删除数组的元素时,是把该元素 赋值为undefined,而delete删除属性的时候,是直接删除掉,在使用for/in列举属性时不再可以列举。
14 楼 zxianyue 2009-02-22  
= =这个世界上有一种工具叫搜索。。。
13 楼 fornever 2009-01-04  
风雪涟漪 写道

因为 firefox 忽略逗号后面为空的情况了。。。如 a=[1,2,] 在firefox 只有2个 ie里认为还有第三个元素是undefined.浏览器差异把。一个逗号。。。。呵呵


呵呵,的确,这也就解释了为什么{name:fornever,age:10,}可以在火狐下通过但是在IE下通不过了
12 楼 hanjs 2008-12-30  
你指定了9,是number,那么肯定可以处理的。我说的数组按其本意是只接受数字作为下标的。如果增加了string的,那么就和map差不多了,形成了key与value的形式
11 楼 sdcyst 2008-12-30  
hanjs 写道
var array = new Array("no1","no2");  
array["po"] = "props1";  
alert(array.length);   //2  
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)  
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 

这段代码有疑问啊,为何length没有增加呢?我是这样看的。

其内部的length属性增加的时候,判断了标注,默认就是取length+1,可以上面赋值的时候制定了po,因为不是number类型,导致length没有进行加1处理。因为typeof array是object,因此只能通过 array.po访问这样添加的值.

lz,你写的这个第一篇帖子呢 javascript面向对象技术基础(一) ?我翻了好多页也没有看到,能否提供下?谢谢

不知道下面这个例子是不是和你所说的相悖:
var a = new Array();
alert(a.length); //0
a[9] = "s";
alert(a.length); //10


你看看我的博客吧,那个帖子没有人回,早不知道去哪儿了....
10 楼 hanjs 2008-12-30  
var array = new Array("no1","no2");  
array["po"] = "props1";  
alert(array.length);   //2  
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)  
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 

这段代码有疑问啊,为何length没有增加呢?我是这样看的。

其内部的length属性增加的时候,判断了标注,默认就是取length+1,可以上面赋值的时候制定了po,因为不是number类型,导致length没有进行加1处理。因为typeof array是object,因此只能通过 array.po访问这样添加的值.

lz,你写的这个第一篇帖子呢 javascript面向对象技术基础(一) ?我翻了好多页也没有看到,能否提供下?谢谢
9 楼 sdcyst 2008-12-30  
hanjs 写道
var array = new Array("no1","no2");  
alert(array.length);//2
array["po"] = "props1";  
alert(array.length);   //2
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)  
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 

我和sdcyst 测试的结果不一样,在ie7下增加完也是2啊。

还有,ls的说的不是很正确吧。就拿这个例子说,新增加的节点有值,不是undefined,你又怎么说呢?

能不能说的清楚点?
8 楼 hanjs 2008-12-30  
var array = new Array("no1","no2");  
alert(array.length);//2
array["po"] = "props1";  
alert(array.length);   //2
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)  
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 

我和sdcyst 测试的结果不一样,在ie7下增加完也是2啊。

不好意思,我看错了,你测试的例子和我的不一样,你是说第一个例子,抱歉
7 楼 风雪涟漪 2008-12-26  
因为 firefox 忽略逗号后面为空的情况了。。。如 a=[1,2,] 在firefox 只有2个 ie里认为还有第三个元素是undefined.

浏览器差异把。一个逗号。。。。呵呵
6 楼 sdcyst 2008-12-26  
hite 写道

alert(array2.length);

在firefox中执行结果是2:


谢谢提醒,确实是2,在ie中是3
这个地方我还真没测试.
不过这个地方怎么解释呢?
5 楼 风雪涟漪 2008-12-26  
typeof array //Object
本身就是对象。Array就当对象来处理就好了
4 楼 hite 2008-12-26  
风雪涟漪 写道
佩服楼上的仔细,的确结果是2

用JavaScript打游击太多了,需要好好接受点系统的学习,所以就多动手
3 楼 风雪涟漪 2008-12-26  
佩服楼上的仔细,的确结果是2
2 楼 hite 2008-12-26  
alert(array2.length); //3 


在firefox中执行结果是2:

var array = new Array("no1","no2");  
array["po"] = "props1";  
alert(array.length);   //2  
//对于数组来说,array[0]同array["0"]效果是一样的(?不确定,测试时如此)  
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 

这个例子太帅了(和我一样!O(∩_∩)O哈哈~):

我把 array["po"]换成array["2"]或者array[2],还有array.po换成array.“2”和array.2,发现了好多的秘密。对数组是特殊的对象有了更进一步的理解。猛赞
1 楼 FengShen_Xia 2008-12-12  
不错,学习

相关推荐

    javascript面向对象技术基础

    javascript面向对象技术基础,javascript面向对象技术基础

    javascript面向对象技术基础 整理排版了一下

    javascript面向对象技术基础 整理排版了一下 外带了个闭包的文章,下了可以直接打印了

    js面向对象技术基础

    一个很好的学习javascript的资料,详细叙述了javascript面向对象的原理,并含有大量的程序例子说明。非常实用。

    javascript 面向对象技术基础教程第1/2页

    看了很多介绍javascript面向对象技术的文章,很晕.为什么?不是因为写得不好,而是因为太深奥.

    [推荐]javascript 面向对象技术基础教程

    看了很多介绍javascript面向对象技术的文章,很晕.为什么?不是因为写得不好,而是因为太深奥.javascript中的对象还没解释清楚怎么回事,一上来就直奔主题,类/继承/原型/私有变量....

    javascript面向对象教程

    本教程针对那些对javascript语言有一定的了解,从事过web开发,并且在实际中或多或少地使用过javascript的开发和技术人员 javascript语言基础的语法在此就直接略过,不做介绍 通过本教程的学习,学习者应该了解...

    第5章 JavaScript编程技术 课件

    5.1 JavaScript编程基础 5.1.1 JavaScript简介 5.1.2 Javascript的使用方法 5.1.3 语法规则 5.1.4 运算符和表达式 5.1.5 函数 5.1.6流程控制 5.1.7 事件处理 5.2 JavaScript对象编程 5.2.1 Object 类型 5.2.2 Array...

    JavaScript征途

    JavaScript对象,数组,字符串,使用正则表达式操纵字符串,客户端,控制文档结构的模型,JavaScript事件驱动模型,CSS,Cookie,XML和JSON,Ajax,深入JavaScript面向对象编程,深入JavaScript函数式编程,深入...

    写给大家看的面向对象编程书(第3版).[美]Matt Weisfeld(带详细书签).pdf

    本书是一部独具特色的面向对象技术著作。书中结合代码示例生动透彻地讲述了面向对象思想的精髓,让读者真正学会以对象方式进行思考。此外,本书还讨论了各种与面向对象概念密切相关的应用主题,包括XML、UML建模语言...

    征服RIA:基于JavaScript的Web客户端开发卷二

    JavaScript高级篇:揭示JavaScript的运行机理和高级应用,如面向对象编程、函数式编程和元编程。Ajax篇:Ajax是上帝赐予JavaScript的礼物。凭借着Ajax,JavaScript拥有了异步调度服务端业务逻辑的能力。本篇除介绍...

    javascrip上百技术总集

    -(4) JavaScript面向对象的支持--(5) JavaScript面向对象的支持--(6) JavaScript精简学习1:基础知识 JavaScript精简学习2:浏览器输出 JavaScript精简学习3:图像 JavaScript精简学习4:表单 ...

    《JavaScript征途》书稿实例

    数组,字符串,使用正则表达式操纵字符串,客户端,控制文档结构的模型,JavaScript事件驱动模型,CSS,Cookie,XML和JSON,Ajax,深入JavaScript面向对象编程,深入JavaScript函数式编程,深入JavaScript动态化编程...

    JavaScript核心概念及实践 高清PDF扫描版 (邱俊涛).pdf

    《JavaScript核心概念及实践》不仅帮助读者迅速掌握JavaScript基础知识和核心技术,而且通过实例讲解如何将这些知识和技术理解应用到实际工作中,提升编程能力,以简洁、优美的代码开发出功能强大且更易于维护和扩展...

    javascript DOM 编程艺术

    从颇具深度的JavaScript语言基础到作用域(链),从引用类型到面向对象编程,从极其灵活的匿名函数到闭包的内部机制,从浏览器对象模型(BOM)、文档对象模型(DOM)到基于事件的Web脚本设计,从XML(E4X)到Ajax及JSON,从...

    Javascript 高级编程第2版PDF part1

    从颇具深度的javascript语言基础到作用域(链),从引用类型到面向对象编程,从极其灵活的匿名函数到闭包的内部机制,从浏览器对象模型(bom)、文档对象模型(dom)到基于事件的web脚本设计,从xml(fax)到ajax及json,从...

    征服RIA:基于JavaScript的Web客户端开发卷三

    JavaScript高级篇:揭示JavaScript的运行机理和高级应用,如面向对象编程、函数式编程和元编程。Ajax篇:Ajax是上帝赐予JavaScript的礼物。凭借着Ajax,JavaScript拥有了异步调度服务端业务逻辑的能力。本篇除介绍...

Global site tag (gtag.js) - Google Analytics