html5中文学习网

您的位置: 首页 > 网站及特效实例 > javascript特效 » 正文

javascript数组详解_基础知识_

[ ] 已经帮助:人解决问题

如果你是一个有经验的开发者,你可能会认为这个问题比较简单,但是有的时候,我们会感觉这个问题比较有趣。xRJHTML5中文学习网 - HTML5先行者学习网

首先我们来看看数组的定义:“An array is just a list of values which can be accessed by using an integer as the “key”. The list starts at 0 and goes up from there.”,下面我们用对象来描述数组的定义:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
xRJHTML5中文学习网 - HTML5先行者学习网
var arr = ["benjamin", "zuojj"];xRJHTML5中文学习网 - HTML5先行者学习网
//=>xRJHTML5中文学习网 - HTML5先行者学习网
var arr = {xRJHTML5中文学习网 - HTML5先行者学习网
    "0": "benjamin",xRJHTML5中文学习网 - HTML5先行者学习网
    "1": "zuojj"xRJHTML5中文学习网 - HTML5先行者学习网
};xRJHTML5中文学习网 - HTML5先行者学习网
xRJHTML5中文学习网 - HTML5先行者学习网

看上面的例子,总感觉缺少了什么,OK,数组的长度:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
xRJHTML5中文学习网 - HTML5先行者学习网
 var arr = {xRJHTML5中文学习网 - HTML5先行者学习网
    "0"      : "benjamin",xRJHTML5中文学习网 - HTML5先行者学习网
    "1"      : "zuojj",xRJHTML5中文学习网 - HTML5先行者学习网
    "length" : 2xRJHTML5中文学习网 - HTML5先行者学习网
};xRJHTML5中文学习网 - HTML5先行者学习网
xRJHTML5中文学习网 - HTML5先行者学习网

我们知道,在Javascript语言中,数组是一个特殊的对象,我们可以使用访问数组的方式来访问对象的属性,同时,数组也可以像对象那样添加属性。看下例:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
xRJHTML5中文学习网 - HTML5先行者学习网
var arr = {xRJHTML5中文学习网 - HTML5先行者学习网
    "0"      : "benjamin",xRJHTML5中文学习网 - HTML5先行者学习网
    "1"      : "zuojj",xRJHTML5中文学习网 - HTML5先行者学习网
    "length" : 2xRJHTML5中文学习网 - HTML5先行者学习网
};xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: "benjamin"xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr[0]);xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: 2xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr.length);xRJHTML5中文学习网 - HTML5先行者学习网

var arr = ["benjamin", "zuojj"];xRJHTML5中文学习网 - HTML5先行者学习网
arr.url = "www.jb51.net";xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: "www.jb51.net"xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr.url);xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: 2xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr.length);xRJHTML5中文学习网 - HTML5先行者学习网

xRJHTML5中文学习网 - HTML5先行者学习网

下面我们来看看数组的方法,数组有很多可操作的方法,如indexOf/slice/splice/sort等,我们知道实际上这些方法存在于Array.prototype中。看下面的例子:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
xRJHTML5中文学习网 - HTML5先行者学习网
var arr = ["benjamin", "zuojj"];xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: 1xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr.indexOf("zuojj"));xRJHTML5中文学习网 - HTML5先行者学习网
arr.indexOf = function(str) {xRJHTML5中文学习网 - HTML5先行者学习网
    return "It is customed indexOf!";xRJHTML5中文学习网 - HTML5先行者学习网
}xRJHTML5中文学习网 - HTML5先行者学习网
//Outputs: "It is customed indexOf!"xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr.indexOf("zuojj"));xRJHTML5中文学习网 - HTML5先行者学习网
xRJHTML5中文学习网 - HTML5先行者学习网
xRJHTML5中文学习网 - HTML5先行者学习网

事实上,我们可以使用对象重载所有的数组方法。看下面的push方法的例子:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
xRJHTML5中文学习网 - HTML5先行者学习网
var arr = {xRJHTML5中文学习网 - HTML5先行者学习网
    length: 0,xRJHTML5中文学习网 - HTML5先行者学习网
    push: function(val) {xRJHTML5中文学习网 - HTML5先行者学习网
        //赋值xRJHTML5中文学习网 - HTML5先行者学习网
        this[this.length] = val;xRJHTML5中文学习网 - HTML5先行者学习网
        //更新数组长度xRJHTML5中文学习网 - HTML5先行者学习网
        this.length += 1;xRJHTML5中文学习网 - HTML5先行者学习网
        //返回数组长度xRJHTML5中文学习网 - HTML5先行者学习网
        return this.length;xRJHTML5中文学习网 - HTML5先行者学习网
    }xRJHTML5中文学习网 - HTML5先行者学习网
}xRJHTML5中文学习网 - HTML5先行者学习网
arr.push("zuojj");xRJHTML5中文学习网 - HTML5先行者学习网
arr.push("benjamin");xRJHTML5中文学习网 - HTML5先行者学习网
//Object {0: "zuojj", 1: "benjamin", length: 2, push: function}xRJHTML5中文学习网 - HTML5先行者学习网
console.log(arr);xRJHTML5中文学习网 - HTML5先行者学习网
xRJHTML5中文学习网 - HTML5先行者学习网

但是有一个是不能从新实现的,数组的字面量定义:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
var arr = ["benjamin", "zuojj"];
xRJHTML5中文学习网 - HTML5先行者学习网

但是我们可以使用构造函数来代替:xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
var arr = new Array("benjamin", "zuojj");
xRJHTML5中文学习网 - HTML5先行者学习网

如果不适用字面量定义数组,那么我们可以重定义数组的定义,以我们自己的方式。xRJHTML5中文学习网 - HTML5先行者学习网

复制代码 代码如下:
var myArr = new CustomArray("benjamin", "zuojj");
xRJHTML5中文学习网 - HTML5先行者学习网

现在你知道javascript中数组是如何工作的了吧,希望对大家有所帮助。xRJHTML5中文学习网 - HTML5先行者学习网

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助