JS中关于数组的操作
1、如何创建数组:
var arr = []; //效率更高
var arr1 = new Array();
var arr2 = new Array(5); //数组的长度为5,当参数为一个时,将会认为指定的是数组的长度
var arr3 = new Array("Saab","Volvo","BMW");
//数组里可以存储字符串、数字、数组、对象等
2、字符串关于数组的方法:
2.1、把字符串分割成数组(split)
stringObject.split(separator, len) //separator:必需,字符串或正则表达式 len:可选,该参数可指定返回的数组的最大长度
该方法根据第一个参数指定的字符而将字符串分割开,第二个参数是返回的数组长度。该方法不会改变原有字符串。
var str="How are you doing today?";
var arr=str.split(" "); //How,are,you,doing,today?
split() 方法用于把一个字符串分割成字符串数组。
3、数组本身的方法
参考:http://www.runoob.com/jsref/jsref-obj-array.html
3.1、判断是否为数组(isArray)
isArray() 方法用于判断一个对象是否为数组。
如果对象是数组返回 true,否则返回 false。
function myFunction() {
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = document.getElementById("demo");
x.innerHTML = Array.isArray(fruits);
}
3.2、查找元素(indexOf)
indexOf() 方法可返回数组中某个指定的元素位置,开始位置的索引为 0 ,如果在数组中没找到指定元素则返回 -1。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple"); //output 2
3.3、将数组转换成字符串(join、toString)
join方法可以指定分隔符,toString方法无法指定分隔符
arrayObject.join(separator) //separator:可选,指定字符串所使用的分隔符,默认是逗号
var names = ["David", "Cynthia", "Raymond", "Clayton", "Mike", "Jennifer"];
var namestr = names.join();
print(namestr); // David,Cynthia,Raymond,Clayton,Mike,Jennifer
namestr = names.toString();
print(namestr); // David,Cynthia,Raymond,Clayton,Mike,Jennifer //事实上,当直接对一个数组使用 print() 函数时,系统会自动调用那个数组的 toString() 方法
//print(names); // David,Cynthia,Raymond,Clayton,Mike,Jennifer
3.4、合并数组(concat)
concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
var hege = ["Cecilie", "Lone"];
var stale = ["Emil", "Tobias", "Linus"];
var kai = ["Robin"];
var children = hege.concat(stale,kai);//Cecilie,Lone,Emil,Tobias,Linus,Robin
3.5、分割数组(slice)
slice() 方法返回一个新的数组,包含从 start 到 end (不包括该元素)的元素,该方法不会改变原始数组。
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3); //Orange,Lemon
3.6、删除添加元素(splice)
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi"); //Banana,Orange,Lemon,Kiwi,Apple,Mango
array.splice(index,howMany,item1,.....,itemX)
//index 必需。规定从何处添加/删除元素
//howMany 必需。规定应该删除多少元素
//item1, ..., itemX 可选。要添加到数组的新元素
splice() 方法返回的是只包含被删除的元素的新数组,而且会改变原始数组
注意:这种方法会改变原始数组。
3.7、删除添加一个元素(pop、push、shift、unshift)
pop() 方法用于删除数组的最后一个元素并返回被删除的元素。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop(); //fruits: Banana,Orange,Apple
push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi") //fruits: Banana,Orange,Apple,Mango,Kiwi
shift() 方法用于把数组的第一个元素从其中删除,并返回被删除的第一个元素的值。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift() //fruits: Orange,Apple,Mango
unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple"); //fruits: Lemon,Pineapple,Banana,Orange,Apple,Mango
3.8、数组排序 (reverse、sort)
reverse() 方法用于颠倒数组中元素的顺序,返回值是颠倒顺序后的数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse(); //Mango,Apple,Orange,Banana
sort()方法用于排序:如果元素是字符串类型,那么数组的排序方法 sort() 就非常好使;但是如果数组元素是数字类型,sort() 方法的排序结果就不能让人满意了:
var names = ["David","Mike","Cynthia","Clayton","Bryan","Raymond"];
names.sort();
print(names); // Bryan,Clayton,Cynthia,David,Mike,Raymond
sort() 方法是按照字典顺序对元素进行排序的,因此它假定元素都是字符串类型,即使元素是数字类型,也被认为是字符串类型。
var nums = [3,1,2,100,4,200];
nums.sort();
print(nums); // 1,100,2,200,3,4
为了让 sort() 方法也能排序数字类型的元素,可以在调用方法时传入一个大小比较函数,排序时,sort() 方法将会根据该函数比较数组中两个元素的大小,从而决定整个数组的顺序。
function compare(num1, num2) {
return num1 - num2;
}
var nums = [3,1,2,100,4,200];
nums.sort(compare);
print(nums); // 1,2,3,4,100,200
此时sort() 函数使用了 compare() 函数对数组按照数字大小进行排序,而不是按照字典顺序
3.9、数组迭代器方法(forEach、every、some、reduce、reduceRight、map、filter)
(1)、不生成新数组的迭代器方法(forEach、every、some、reduce、reduceRight):
forEach()方法接受一个函数作为参数,对数组中的每个元素使用该函数。
function square(num) {
print(num, num * num);
}
var nums = [1,2,3,4,5,6,7,8,9,10];
nums.forEach(square);
//output: 1 1 2 4 3 9 4 16 5 25 6 36 7 49 8 64 9 81 10 100
every()方法接受一个返回值为布尔类型的函数,对数组中的每个元素使用该函数。
如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测;
如果所有元素都满足条件,则返回 true。
function isEven(num) {
return num % 2 == 0;
}
var nums = [2,4,6,8,10];
var even = nums.every(isEven);//true
some() 方法也接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回 true, 该方法就返回 true。
function isEven(num) {
return num % 2 == 0;
}
var nums = [1,2,3,4,5,6,7,8,9,10];
var someEven = nums.some(isEven); //true
reduce() 方法接受一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到的累加值。
function add(runningTotal, currentValue) {
return runningTotal + currentValue;
}
var nums = [1,2,3,4,5,6,7,8,9,10];
var sum = nums.reduce(add);
print(sum); // 显示 55
reduceRight() 方法,和 reduce() 方法不同,它是从右到左执行
function concat(accumulatedString, item) {
return accumulatedString + item;
}
var words = ["the ", "quick ","brown ", "fox "];
var sentence = words.reduceRight(concat);
print(sentence); // 显示 "fox brown quick the"
(2)、生成新数组的迭代器方法(map、filter):
map() 对数组中的每个元素使用某个函数,返回一个新的数组,该数组的元素是对原有元素应用这个函数得到的结果。map 方法不改变原数组。
array.map(function(currentValue,index,arr){}, thisValue)
function curve(grade) {
return grade += 5;
}
var grades = [77, 65, 81, 92, 83];
var newgrades = grades.map(curve);
print(newgrades); // 82, 70, 86, 97, 88
filter() 方法检测数组元素,并返回一个符合条件的所有元素的新数组。该方法的参数即回调函数的返回值是布尔值。
function isEven(num) {
return num % 2 == 0;
}
var nums = [];
for (var i = 0; i < 20; ++i) {
nums[i] = i+1;
}
var evens = nums.filter(isEven);
print(evens); //2,4,6,8,10,12,14,16,18,20
4、数组中的其他方法
4.1、arr.find() 查找某个符合条件的元素
arr.find() 方法用于从数组中找到符合条件的第一个数组元素值,若找到则返回满足条件的第一个元素,否则返回 undefined。
该方法有两个参数,第一个参数是一个回调函数,第二个参数指定回调函数的 this 指针,第二个参数是可选的。
let arr = [{name: 'aaa',age: 12},{name: 'bbb',age: 22} ]
let obj = arr.find((item) => {
return item.name == 'bbb'
})
console.log(obj); //输出 {name: "bbb", age: 22}
JS中关于数组的操作的更多相关文章
- js中对数组的操作-------Day49
今天碰到了一个问题:easyui的使用中,datagrid表格的高度怎样改变(设定成一个固定的高度),看了半天文档,也从网上查了些.还楞是没弄出来,有点小郁闷.这easyui在某些情况情况下确实好用了 ...
- js中对于数组的操作
let myArray=[11,22,33]; console.log('原数组:',myArray); myArray.push(44,55); console.log('用push在数组后面插入元 ...
- JavaScript jQuery 中定义数组与操作及jquery数组操作
首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...
- JS中Array数组的三大属性用法
原文:JS中Array数组的三大属性用法 Array数组主要有3大属性,它们分别是length属性.prototype属性和constructor属性. JS操作Array数组的方法及属性 本文总结了 ...
- JavaScript jQuery 中定义数组与操作及jquery数组操作 http://www.jb51.net/article/76601.htm
首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...
- java:JavaScript3(innerHTML,post和get,单选框,多选框,下拉列表值得获取,JS中的数组,JS中的正则)
1.innerHTML用户登录验证: <!DOCTYPE> <html> <head> <meta charset="UTF-8"> ...
- [转]js中confirm实现执行操作前弹出确认框的方法
原文地址:http://www.jb51.net/article/56986.htm 本文实例讲述了js中confirm实现执行操作前弹出确认框的方法.分享给大家供大家参考.具体实现方法如下: 现在在 ...
- js中的数组
上网查了一下,js中的数组包含的内容还真不少.先给出两个学习的链接: w3school链接:http://www.w3school.com.cn/js/js_obj_array.asp 博客园链接:h ...
- JavaScript中对数组的操作
原文:JavaScript中对数组的操作 一:数组的使用 1.定义:JavaScript中对数组的定义有两种形式.如: .var arr = [12,3,5,8]; .var arr = new Ar ...
随机推荐
- spss如何选择需要的变量?
spss如何选择需要的变量? 今天一位网友问我,spss如何在许多字段(变量)中选择我需要的字段,而不显示其他的字段呢? 这个问题问的很好,在实际的数据分析或者挖掘的过程中,都需要用这个来找出对商业问 ...
- selenium自动化测试之【数据驱动测试】
数据驱动测试是自动化测试的主流设计模式之一,相同的测试脚本使用不同的测试数据来执行,测试数据和测试行为进行了完全的分离,这样的测试脚本设计模式称为数据驱动.实施数据驱动测试的步骤:1.编写测试脚本,脚 ...
- 如何根据字典值的大小,对字典中的项排序---Python数据结构与算法相关问题与解决技巧
实际案例: 某班英语成绩以字典形式存储为: { 'LiLei' : 90, 'Jim' : 88, 'Lucy': 92 } 如何根据成绩高低,计算学生排名 -- 根据分数,进行排名,并且把排名信息添 ...
- Bootstrap 学习笔记9 标签页和工具提示插件
<ul class="nav nav-tabs"> <li class="active"><a href="#html5 ...
- Arrays -数组工具类,数组转化字符串,数组排序等
package cn.learn.basic; import java.util.Arrays; /* java.util.Arrays是一个与数组相关的工具类,含有大量静态方法,用来实现数组常见的操 ...
- bfs(最短路径)
http://poj.org/problem?id=3278 Catch That Cow Time Limit: 2000MS Memory Limit: 65536K Total Submis ...
- redis setNx方法
Redis有一系列的命令,特点是以NX结尾,NX是Not eXists的缩写,如SETNX命令就应该理解为:SET if Not eXists.这系列的命令非常有用,这里讲使用SETNX来实现分布式锁 ...
- spring bean-- autowired的正确用法
这两天用idea写spring注入的时候每一次 @Autowired Worker worker; 都会报黄,用过这个ide的都知道,说明你代码需要重构了. 然后提示的信息是 Spring Team ...
- java中位运算^,&,<<,>>,<<<,>>>总结
1.^(亦或运算) ,针对二进制,相同的为0,不同的为1 public static void main(String[] args) { System.out.println("2^3运算 ...
- sql server 自优化
大数据量下的SQL Server数据库自身优化 发布时间:2013-12-17 15:19:00 来源:论坛 作者:佚名 关键字:数据库开发 1.1:增加次数据文件 从SQL SERVER 200 ...