当前位置：慕源网 > javascript 数组操作：如何在 Javascript 中使用数组

javascript 数组操作：如何在 Javascript 中使用数组

作者 : 慕源网 本文共4418个字，预计阅读时间需要12分钟 发布时间： 2022-04-3 共279人阅读

关于浏览器兼容性的说明

数组是 javascript 的附加组件；因此，您可以在编程网站上找到各种使用它们的方法，包括对Array对象的引用。

然而，’Array’ 对象现在基本上已经过时了；在本教程中，我们将了解当前的最佳实践。

下面的代码不适用于非常旧的浏览器；但是，现在 javascript 已经足够稳定了，我建议忽略任何太旧而无法运行以下代码的浏览器。您的用户群不太可能受到太大影响。那些使用太旧的浏览器无法运行这些基本 javascript 的人，真的需要升级他们的浏览器。

强烈推荐

海量程序代码，编程资源，无论你是小白还是大神研究借鉴别人优秀的源码产品学习成熟的专业技术强势助力帮你提高技巧与技能。在此处获取，给你一个全面升级的机会。只有你更值钱，才能更赚钱

如果你是初级程序员可以研究别人的代码提高技术，如果你喜欢搞网盟或者外包，可以让你快速建站，还等什么赶快关注吧，我们会持续输出相关资源

海量源码程序，学习别人的产品设计思维与技术实践

在 Javascript 中创建和初始化数组

您可以按如下方式在 javascript 中创建一个数组（在此示例中，您可以看到整个 .html 文件；稍后我们将只看 javascript 部分）：

<html>

<head>
<title>Basic Javascript Array Example</title>

<script language="javascript">
// Empty array
var empty = [];

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi'];

alert(fruits[1]);
</script>
</head>

<body>

</body>

</html>

 

要在 javascript 中向数组添加元素，只需在数组末尾定义一个新元素。

您还可以使用push()将新元素“push”到数组的末尾，或使用unshift()将元素添加到数组的开头：

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi'];

// Adding new elements to the end of
// the array:
fruits[3] = 'banana';
fruits[4] = 'pear';

// Or you can just do this ...
fruits[fruits.length] = 'pineapple';
fruits[fruits.length] = 'cherry';

// Or this:
fruits.push('grape');
fruits.push('raspberry');

// Or you can add elements to the START
// of the array like this:
fruits.unshift('raspberry');
fruits.unshift('blackberry');

Javascript 中的多维数组

您还可以创建多维数组。子数组不必都是相同的长度。

var stuff = [
    [1, 2, 3],
    ['one', 'two', 'three'],
    ['apple', 'orange', 'banana', 'kiwi']
];

alert(stuff[2][1]);

在 Javascript 中遍历数组

您可以使用for循环遍历 javascript 中的数组，该循环的计数器从 0 运行到小于数组长度的 1。

在这里，我们创建了一个名为“fruits”的数组；然后我们将数组传递给一个函数，该函数遍历数组并将数组成员写入 HTML 文档正文，每行一个：

function show_array(array) {
    for(var i=0; i<array.length; i++) {
        document.write(array[i]);
        document.write('<br/>');
    }
}

var fruits = ['apple', 'orange', 'banana'];

show_array(fruits);
apple
orange
banana

你也可以以“for each”的方式使用for，这意味着我们可以选择编写上面的函数show array()如下（这里我还修改了 show array() 以便它显示警告框中的数组内容，而不是写入文档）：

function show_array(array) {

    var text = '';
    
    for(var i in array) {
        text += array[i];
        text += 'n';
    }
    
    alert(text);
}

请注意， i 仍然是项目索引，而不是项目本身。

对于真正的 ‘for each’ 类型的 javascript 循环，您可以使用几个流行的 javascript 库之一；例如，jQuery 定义了一个“Each”迭代器，它可以一个一个地获取数组的元素。

Javascript 数组排序：在 Javascript 中对数组进行排序

要在 javascript 中对数组进行排序，请使用sort()函数。您只能使用 sort() 本身按字母升序对数组进行排序；如果您尝试将其应用于数字数组，它们将按字母顺序排序。

var fruits = ['apple', 'orange', 'banana'];
var numbers = [10, 20, 2, 3, 0, 500];

// This works.
fruits.sort();

// This sorts alphabetically, not numerically!
numbers.sort();

// We defined show array earlier.
show_array(fruits);
show_array(numbers);

字符串按字母顺序排序：

但数字也是如此：

要对数字进行排序，或按非字母顺序对字符串进行排序，或对包含其他内容的数组进行排序，您必须提供自己的排序算法。这是通过将包含排序算法的函数的名称传递给 sort() 来完成的。您也可以只定义排序算法函数“inline”，如下例所示。

排序算法函数接收两个参数；这些是必须比较的数组元素。如果第一个元素大于第二个（换句话说，排在后面），返回 1。如果第一个元素小于第二个（排在前面），返回 -1。如果元素相等，则返回 0。

var fruits = ['apple', 'orange', 'banana'];
var numbers = [10, 20, 2, 3, 0, 500];

// Sort in reverse alphabetical order.
fruits.sort(function(a, b) {
    if(a > b) {
        return -1;
    }
    else if(a < b) {
        return 1;
    }
    else {
        return 0;
    }
});

// Sort in ascending numerical order.
numbers.sort(function(a, b) {
    if(a > b) {
        return 1;
    }
    else if(a < b) {
        return -1;
    }
    else {
        return 0;
    }
});

// We defined show array earlier.
show_array(fruits);
show_array(numbers);

现在，fruits 数组按字母倒序排序：

numbers 数组按数字排序：

Pop 和 Shift：在 Javascript 中从数组中删除元素

您可以使用pop()从javascript 中的数组末尾删除元素，并使用shift()从数组开头删除元素。这两个函数都返回删除的元素。

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi'];

alert(fruits.pop());
alert(fruits.shift());

Javascript Slice：选择数组的一部分

您可以使用slice(START, END)在 javascript 中获取由另一个数组的一部分组成的数组。

START 是要包含在您的选择中的第一个项目的索引。END 是您要包含的最后一个项目之后的索引。换句话说，END 不包括在您的选择中。

这是一个示例（请注意， slice() 方法不会更改您从中切片的数组）：

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi', 'banana'];

var juice = fruits.slice(1, 3);

show_array(juice);

如果您不包含 END 索引，则 slice() 会为您提供直到数组末尾的所有元素。

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi', 'banana'];

var juice = fruits.slice(1);

show_array(juice);

…并且您可以通过向 slice() 提供负索引来指定数组末尾的元素而不是开头：

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi', 'banana'];

// Slice off the last two elements.
// (the fruits array will not be changed)
var juice = fruits.slice(-2);

show_array(juice);

Javascript Array Concat：将一个数组添加到另一个数组

您可以使用concat()方法在 javascript 中组合两个数组。注意原始数组是不变的；concat() 返回一个包含组合数组元素的新数组。

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi'];

var more = ['cherry', 'pear'];

var all = fruits.concat(more);

show_array(all);

Javascript Join：连接数组的元素

您可以使用join()将数组的元素连接在一起，它返回一个包含连接数组元素的字符串。

这对于使用 alert 显示数组非常方便（尽管如果 alert 直接提供了数组的名称，现代浏览器通常会显示数组元素）。

如果不带参数调用，join() 默认使用逗号连接数组元素。如果提供了参数，则该字符串用于连接数组元素。在以下示例中，我们使用逗号和空格连接水果数组的元素。

// Array containing initial elements.
var fruits = ['apple', 'orange', 'kiwi'];

var text = fruits.join(', ');

alert(text);

如果您能想到我遗漏的任何内容或者您还有其他问题（或者您发现了错误！），请随时发表评论。


慕源网 » javascript 数组操作：如何在 Javascript 中使用数组

常见问题FAQ

程序仅供学习研究，请勿用于非法用途，不得违反国家法律，否则后果自负，一切法律责任与本站无关。
请仔细阅读以上条款再购买，拍下即代表同意条款并遵守约定，谢谢大家支持理解！
慕源网

慕源网 普通

分享到：

发表评论

相关推荐

开通VIP 享更多特权，建议使用QQ登录
账号登录/注册
QQ登录
微博登录