软件世界网 购物 网址 三丰软件 | 小说 美女秀 图库大全 游戏 笑话 | 下载 开发知识库 新闻 开发 图片素材
多播视频美女直播
↓电视,电影,美女直播,迅雷资源↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
移动开发 架构设计 编程语言 Web前端 互联网
开发杂谈 系统运维 研发管理 数据库 云计算 Android开发资料
  软件世界网 -> Web前端 -> JavaScript常用对象Array(1) -> 正文阅读

[Web前端]JavaScript常用对象Array(1)


Array类型几乎是JavaScript中最常用的类型了。JavaScript中数组的概念与Java,C中类似,但有两点需要强调:
1、Array中每一项保存的数据类型可以不同。例如第一项保存一个字符串数据,第二项保存一个数值等。
2、Array数组的长度是可以动态调整的。也就是可以随时对一个数组增添新的内容。
  • Array对象的创建
  • Array对象的访问、添加元素
  • Array对象转换为字符串
  • Array对象的栈方法及队列方法
  • Array对象的排序方法

Array对象的创建

使用Array构造函数

var colors = new Array()  //创建一个空数组
var colors = new Array(20)  //创建一个长度为20的数组
var colors = new Array("red", "blue", "black")  //创建一个长度为3的数组,元素分别为red,blue,black

使用数组字面量

var colors = []  //创建一个空数组
var colors = ["red", "blue", "black"]  //创建一个长度为3的数组,元素分别为red,blue,black

Array对象的访问、添加元素


Array通过下标来访问,修改,添加。需要注意的是,下标从0开始。
例如:
var colors = ["red", "blue", "black"];
var col1 = colors[0];

colors[2] = "gray";
var col2 = colors[2];

colors[5] = "white";
var col3 = colors[4];
var col4 = colors[5];

以上代码,首先定义一个长度为3的数组,元素分别为red,blue,black。
通过下标访问,cor1值为”red”。
第三行,通过下标访问修改color[2],将”black”修改为”gray”。col2为”gray”。
5行,直接将colors[5]赋值为”white”,则此时数组长度colors.length 值为 6
colors[5]值为”white”,中间未被赋值的colors[3]、colors[4]值为undefined。colors[5]为”white”。
另外需要说明的是,数组对象的length属性并非为一个只读属性,而是一个可以动态修改的属性,例如我们将以上colors的length值改为6:
colors.length = 6;

则此时,数组长度变为6,colors[3]~colors[5]均为undefined。
我们还可以利用数组length属性以及数组访问从0下标开始这一特性,方便地添加数组元素:
var colors = [];
colors[length] = "red";
colors[length] = "blue";

Array对象转换为字符串


每个对象都有toString(),toLocaleString()以及valueOf()方法。
数组对象的toString()方法会返回数组每个元素字符串形式加逗号分隔开的字符串。
例如:
  var colors = ["red", "blue", "black"];
  alert(colors.toString());

会输出:
red,blue,black

实际上,在调用数组的toString()方法时,在获取每个元素的字符串形式时,会自动调用该元素的toString()方法。
我们来看一段具有启发性意义的代码:
var obj1 = {
    name : "hello world!",
    toString : function() {
      return "MyToString";
    }
};

var obj2 = {
    name : "hello world!"
};

var obj = [obj1, obj2];

alert(obj.toString());

得到以下输出:
[img]http://7xroh5.com1.z0.glb.clouddn.com/jsArraypic1.jpg
我们看到,为了得到数组对象的toString字符串,自动调用了每个元素的toString()方法。最后拼接成一个以逗号分隔的字符串。对于obj1元素,调用了我们重写的toString()方法,obj2则是默认toString()方法。
数组对象的toLocaleString()方法一样,也会将每个数组元素转换为字符串形式,然后以逗号分隔,拼接成一个总的字符串。与toString()方法不同的是,为了得到每个元素的字符串,会去调用元素的toLocaleString()方法,我们将以上代码稍作修改:
var obj1 = {
    name : "hello world!",
    toString : function() {
      return "MyToString";
    },
    toLocaleString : function() {
      return "MyToLocaleString";
    }
};

var obj2 = {
    name : "hello world!"
};

var obj = [obj1, obj2];

alert(obj.toLocaleString());

得到以下输出:
[img]http://7xroh5.com1.z0.glb.clouddn.com/jsArraypic2.jpg

Array对象的栈方法及队列方法


我们知道栈是一种“后进先出”的数据结构,队列是一种“先进先出”的数据结构。JS为了使我们能够像栈和队列一样使用数组对象,提供了以下方法:
push()
pop()
shift()
unshift()

push()和pop()方法


push(obj)方法实际上就是在数组的末尾加上参数obj指定的元素,同时返回push后数组的length。
pop()方法实质上是在数组末尾取出“栈上层”元素,然后将数组长度减1,同时返回取出的最上层元素。
这两个操作的封装,就可以让我们像使用栈一样去使用数组。例如:
  var colors = [];  //创建一个空栈
  var i = colors.push("red", "blue");  //将"red","blue"入栈,i为入栈后栈长,值为2

  var col1 = colors.pop();  //出栈,返回栈顶元素"blue"

shift()和push()方法


push()方法可以在数组的末尾添加元素,而这里shift()方法则在数组头部取出元素,同时将数组长度减1,返回数组头部的元素。
配合push()以及shift()使用,可以使我们像操作队列一样操作数组对象:
  var colors = [];  //创建一个空队列
  var i = colors.push("red", "blue");  //将"red","blue"加入队列,i为新队列长,值为2

  var col1 = colors.shift();  //取出数组头部元素,此时col1值为"red"。colors.length值为1

unshift()和pop()方法


unshift(obj)的作用为在数组头部添加元素obj,并返回新数组的长度。用法和push()类似,配合pop()使用,可以将数组对象作为一个反向队列来使用。

Array对象的排序方法


Array常用的排序方法有reverse()以及sort()方法。
reverse()方法就是单纯地将数组元素反序,适用范围比较受限。
sort()方法使用较广,默认的sort()方法,会调用数组每个元素的toString()方法,然后比较得到的每个字符串,小的在前,大的在后。然而这种方法会有比较强的局限性,例如:
  var nums = [1, 2, 12, 4, 21];
  nums.sort();

将nums每个元素转换为字符串,分别得到1,2,12,4,21的字符串形式,对其字符串形式进行比较会得到以下的排序结果:
[img]http://7xroh5.com1.z0.glb.clouddn.com/jsArraypic3.jpg
将数值作为字符串来比较往往得不到我们希望的结果,由此sort()方法可以接受一个比较函数作为参数,然后根据比较函数来对数组进行排序。比较函数的规则:
比较函数应该接受两个参数,如果希望第一个参数排在第二个参数之前,返回一个负数。如果希望第一个参数排在第二个参数之后,返回一个正数,如果认为两个参数相等,返回0.

例如我们希望按照数值升序进行排序时,可以构造如下比较函数:
  function numcomp(num1, num2) {
    //当num1较小时,我们希望num1排在前面
    if(num1 < num2) return -1;
    //当num1较大时,我们希望num1排在后面
    if(num1 > num2) return 1;

    if(num1 == num2) return 0;
  }

或者简单地写为:
  function numcomp(num1, num2) {
    return num1 - num2;
  }

使用上面的比较函数作为参数即可实现数值的升序排列:
  var nums = [1, 2, 12, 4, 21];
  nums.sort(numcomp);
  alert(nums);

[img]http://7xroh5.com1.z0.glb.clouddn.com/jsArraypic4.jpg
......显示全文...
    点击查看全文


上一篇文章      下一篇文章      查看所有文章
2016-04-01 16:48:17  
Web前端 最新文章
10分钟
SSM框架SSM项目源码SSM源码下载java框架整合
javascript入门
JavaScript常用对象Array(2)
8.Smarty3:模版中的内置函数
表单脚本
iTextSharp5.0页眉页脚及Asp.net预览的实现
MVC基础学习—理论篇
JavaScript
http协议中get与post区别详解
360图书馆 软件开发资料 文字转语音 购物精选 软件下载 美食菜谱 新闻资讯 电影视频 小游戏 Chinese Culture
生肖星座 三丰软件 视频 开发 Android开发 站长 古典小说 网文精选 搜图网 美图 中国文化英文版 多播 租车 短信
2017-7-25 20:37:39
多播视频美女直播
↓电视,电影,美女直播,迅雷资源↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  软件世界网 --