javascript中的数组是什么?

javascript 唐嘉诚
文章标签: js数组
100

在 JavaScript 中,数组是一个用于存储不一样数据类型的变量。它将不一样的元素存储在

一个盒子中,供之后使用。

let myBox = [];   // JS中的初始化数组声明

数组中能够包含多种数据类型算法

let myBox = ['hello', 1, 2, 3, true, 'hi'];

能够用被称为方法的多个操做来操做数组。这些方法容许咱们对数组进行添加、删除、

修改挤执行更多操做。

toString()

toString() 方法可以将数组转换为以逗号分隔的字符串。

let colors = ['green', 'yellow', 'blue'];

console.log(colors.toString()); // green,yellow,blue

join()

The JavaScript join() method combines all array elements into a string.

JavaScript 的 join() 方法将全部数组元素组合成一个字符串。

它相似于 toString() 方法,但在这里你能够指定分隔符而不是默认的逗号。

let colors = ['green', 'yellow', 'blue'];

console.log(colors.join('-')); // green-yellow-blue

concat

此方法能够将两个数组组合在一块儿,或者向数组中添加更多的元素项,而后返回一个新数组。

let firstNumbers = [1, 2, 3];

let secondNumbers = [4, 5, 6];

let merged = firstNumbers.concat(secondNumbers);

console.log(merged); // [1, 2, 3, 4, 5, 6]

push()

此方法将元素项添加到数组的末尾,并修改原始数组。

let browsers = ['chrome', 'firefox', 'edge'];

browsers.push('safari', 'opera mini');

console.log(browsers); 

// ["chrome", "firefox", "edge", "safari", "opera mini"]

pop()

此方法删除数组的最后一项并返回。

let browsers = ['chrome', 'firefox', 'edge'];

browsers.pop(); // "edge"

console.log(browsers); // ["chrome", "firefox"]

shift()

此方法删除数组的第一项,并将它返回。

let browsers = ['chrome', 'firefox', 'edge'];

browsers.shift(); // "chrome"

console.log(browsers); // ["firefox", "edge"]

unshift()

此方法将一个项添加到数组的开头,并修改原始数组。

let browsers = ['chrome', 'firefox', 'edge'];

browsers.unshift('safari');

console.log(browsers); //  ["safari", "chrome", "firefox", "edge"]

splice()

此方法经过添加、删除和插入元素来修改数组。

array.splice(index[, deleteCount, element1, ..., elementN])

Index 这里是删除数组中元素的起点

deleteCount 是要从该索引中删除的元素数

element1, …, elementN 是要添加的元素

删除项目

运行splice()后,它返回删除项目以后的数组,而且被删除的项目将其从原始数组中删除。

let colors = ['green', 'yellow', 'blue', 'purple'];

colors.splice(0, 3);

console.log(colors); // ["purple"]

slice()

此方法与 splice() 有点像,可是有很大不一样。它返回子数组而不是子字符串。

此方法复制数组的给定部分,并将复制的部分做为新数组返回。 它不会改变原始数组。

array.slice(start, end)

let numbers = [1, 2, 3, 4]

numbers.slice(0, 3)

// returns [1, 2, 3]

console.log(numbers) //返回原始数组

使用 slice() 的最好方式是将它分配给一个新变量。

let message = 'congratulations'

const abbrv = message.slice(0, 7) + 's!'; 

console.log(abbrv) // 返回 "congrats!"

split()

此方法用于字符串。它将一个字符串分红子串并将它们做为数组返回。

语法:string.split(separator, limit);

这里的 separator 定义了如何分割字符串。

决定了要分割成几份

let firstName = 'Bolaji';

// return the string as an array

firstName.split() // ["Bolaji"]

let firstName = 'hello, my name is bolaji, I am a dev.';

firstName.split(',', 2); // ["hello", " my name is bolaji"]

注意:若是咱们声明一个空数组,好比 firstName.split('');,那么字符串中的每一个项目将都会

被分割为子字符串:

let firstName = 'Bolaji';

firstName.split('') // ["B", "o", "l", "a", "j", "i"]

indexOf()

此方法在数组中查找项目,若是它被找到就返回索引,不然返回 -1

let fruits = ['apple', 'orange', false, 3]

fruits.indexOf('orange'); // returns 1

fruits.indexOf(3); // returns 3

friuts.indexOf(null); // returns -1 (not found)

lastIndexOf()

这种方法的工做方式与 indexOf() 相同,只是它从右到左工做。它返回找到的最后一个索引

let fruits = ['apple', 'orange', false, 3, 'apple']

fruits.lastIndexOf('apple'); // returns 4

filter()

若是数组的项目符合某个条件,则此方法将会建立一个新数组。

let results = array.filter(function(item, index, array) {

  // returns true if the item passes the filter

});

例:经过区号检查来自 Nigeria 的用户

const countryCode = ['+234', '+144', '+233', '+234'];

const nigerian = countryCode.filter( code => code === '+234');

console.log(nigerian); // ["+234", "+234"]

map()

此方法经过操做数组中的值来建立新数组。

例:显示页面上的用户名。 (基本好友列表显示)

const userNames = ['tina', 'danny', 'mark', 'bolaji'];

const display = userNames.map(item => {

    return '<li>' + item + '</li>';

})

const render = '<ul>' + display.join('') + '</ul>';

document.write(render);

clipboard.png

reduce() 用于计算数组中的单个值。

let value = array.reduce(function(previousValue, item, index, array) {

  // ...

}, initial);

例:

要遍历数组并对数组中的全部数字求和,可使用 for 循环。

const numbers = [100, 300, 500, 70];

let sum = 0;

for (let n of numbers) {

    sum += n;

}

console.log(sum);

如下是用 reduce() 实现相同g功能的方法

const numbers = [100, 300, 500, 70];

const sum = numbers.reduce( (accummulator, value) =>

    accummulator + value

    , 0);

console.log(sum); // 970

若是省略初始值,默认状况下总数将从数组中的第一项开始计算。

const numbers = [100, 300, 500, 70];

const sum = numbers.reduce((accummulator, value) => accummulator + value);

console.log(sum); // still returns 970

forEach()

此方法适用于迭代数组。

它把函数做用于数组中的全部项

const colors = ['green', 'yellow', 'blue'];

colors.forEach((item, index) => console.log(index, item));

// returns the index and the every item in the array

// 0 "green"

// 1 "yellow"

// 2 "blue"

迭代无需不传递索引参数便可完成

const colors = ['green', 'yellow', 'blue'];

colors.forEach((item) => console.log(item));

// returns every item in the array

// "green"

// "yellow"

// "blue"

every()

此方法检查数组中的全部项是否都符合指定的条件,若是符合则返回 true,不然返回 false。

检查全部数字是否为正

const numbers = [1, -1, 2, 3];

let allPositive = numbers.every((value) => {

return value >= 0;

})

console.log(allPositive); // would return false

some()

此方法检查数组中的项(一个或多个)是否符合指定的条件,若是符合则返回true,不然返回false。

检查至少有一个数字是否为正

const numbers = [1, -1, 2, 3];

let atLeastOnePositive = numbers.some((value) => {

return value >= 0;

})

console.log(atLeastOnePositive); // would return true

includes()

此方法检查数组是否包含某个项目。它相似于 .some(),但它不是要查找符合的特定条件,

而是检查数组是否包含特定项。

let users = ['paddy', 'zaddy', 'faddy', 'baddy'];

users.includes('baddy'); // returns true

若是找不到该项,则返回 false

总结

toString() - 将数组转换为以逗号分隔的字符串。

join() - 将全部数组元素组合成一个字符串。

concat - 将两个数组组合在一块儿,或者将更多项添加到数组中,而后返回一个新数组。

push() - 将项目添加到数组的末尾,改变原始数组。

pop() - 删除数组的最后一项并返回

shift() - 删除数组的第一项并返回

unshift() - 将一个项添加到数组的开头,改变原始数组。

splice() - 经过添加,删除和插入元素修改一个数组。

slice() - 复制数组的给定部分,并将复制的部分做为新数组返回。 它不会改变原始数组。

split() - 将一个字符串分红子串并将它们做为数组返回。

indexOf() - 查找数组中的项目并返回其索引,若是没找到则返回-1

lastIndexOf() - 从右到左查找项目并返回找到的最后一个索引。

filter() - 若是数组的项目符合某个条件,则建立一个新数组。

map() - 经过操纵数组中的值来建立一个新数组。

reduce() - 根据数组中的单个值进行计算。

forEach() - 遍历数组,将函数做用于数组中的全部项

every() - 检查数组中的全部项是否都符合指定的条件,若是符合则返回 true,不然返回 false。

some() - 检查数组中的项(一个或多个)是否符合指定的条件,若是符合则返回 true,不然返回 false。

includes() - 检查数组是否包含某个项目。

数组是强大的,经过相关的方法能够编写实用的算法。

还能输出{{restrictNumber}}个字符  
  • {{reply.author}}

    {{CommonUtil.formateDate(reply.ac_CommentDate).shortTime}}
  • 回复了{{Comments.author}} :