首页 技术 正文
技术 2022年11月17日
0 收藏 669 点赞 3,686 浏览 3028 个字

在ECMAScript5中对Array新增的些方法,以前没注意的同志们,嘻嘻,下面我们一起来边看边学。

1、Array之isArray(element)

看到isArray,不言而喻,就是判断一个对象是不是数组哈。

且它是一个静态方法,使用规则如下:

Array.isArray(element);当element是数组时,返回true;否则返回false;

我们一起来写个demo

<!DOCTYPE html>
<head>
<title>array</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
//创建一个数组a和一个对象b
var a = new Array();
var b = new Object();
console.log(Array.isArray(a));
console.log(Array.isArray(b));
</script>
</body>
</html> 

通过chrome来看看打印结果

ECMAScript5之Array

2、Array之indexOf(element)

看到indexOf,想必大家并不陌生,String.indexOf嘛,其实核心作用都一样.

数组的indexOf就是从头到尾,查找数组内的指定元素,并返回查找到的第一个元素索引值,若在数组中没有相应元素,则返回-1

我们一起来写个demo并通过chrome来看看打印结果

<!DOCTYPE html>
<head>
<title>indexOf</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
//创建一个数组a
var a =new Array(1,2,3,4,5,1);
//从数组a的值中可以看出,打印结果为0
console.log(a.indexOf(1));
//从数组a的值中可以看出,打印结果为-1
console.log(a.indexOf(6));
</script>
</body>
</html>

ECMAScript5之Array

3、Array之lastIndexOf(element)

这个lastIndexOf,其实和上面所说的indexOf差不多,只是lastIndexOf是从尾到头搜索而已。

我们一起来写个demo并通过chrome来看看打印结果

<!DOCTYPE html>
<head>
<title>lastIndexOf</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
var a = new Array(1,2,3,4,5,1);
//因为lastIndexOf是从尾到头搜索,所以打印结果为5
console.log(a.lastIndexOf(1));
//从上面的结果看,打印结果为1
console.log(a.lastIndexOf(2));
</script>
</body>
</html>

ECMAScript5之Array

4、Array之every

every用法如下:

/*
method: every
function: every的作用就是遍历数组,当every中的函数都返回true时,才返回一个true;否则,只要有一个false,就返回false,和&&运算差不多
Param:
element --> 当前元素
index --> 元素索引
array --> 调用every方法的数组
*/
every(function(element,index,array){ });

我们demo下

<!DOCTYPE html>
<head>
<title>every</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
var a = new Array(1,2,3,4,5);
//因为我是判定的e < 3,所以根据a的值,可以知道返回false
console.log( a.every(function(e,i,arr){
return e < 3;
}) );
//因为我是判定的e < 6,所以根据a的值,可以知道返回true
console.log( a.every(function(e,i,arr){
return e < 6;
}) );
</script>
</body>
</html>

ECMAScript5之Array

5、Array之some

some的作用与上面的every有点不一样,倘若说every有点像&&运算,那么some就有点像||运算啦。some的函数中只要有一个返回true,那么就返回 true;全都是false时,才返回false

Demo如下

<!DOCTYPE html>
<head>
<title>some</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
var a = new Array(1,2,3,4,5);
//因为e>4,只有一个5满足,但是已经足够了
console.log( a.some(function(e,i,arr){
return e > 4;
}) );
</script>
</body>
</html>

ECMAScript5之Array

6、Array之forEach

这个方法与jQuery的each差不多,就是遍历数组的。

使用如下:

 /*
Param:
e --> 当前元素
i --> 元素索引
array --> 调用forEach方法的数组
*/
forEach(function(e,i,array){}); 

Demo如下:

<!DOCTYPE html>
<head>
<title>forEach</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
var a = new Array(1,2,3,4,5);
a.forEach(function(e,i,array){
console.log(e);
});
</script>
</body>
</html>

ECMAScript5之Array

7、Array之filter

filter方法的作用就是遍历数组,并过滤数组中的值,最后返回过滤后的值的数组。当filter里的回调函数返回true时,就将这个值加入到临时数组中,若是false,则不加入;最后返回这个临时数组。

filter的用法如下:

//参数e为遍历数组中的当前元素值
filter(function(e){});

Demo与代码如下:

<!DOCTYPE html>
<head>
<title>filter</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<script>
var a = new Array(1,2,3,4,5);
var b = a.filter(function(e){
return e%2==0;
});
console.log('原值a:'+a);
console.log('filter后的值:'+b);
</script>
</body>
</html>

ECMAScript5之Array

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,078
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,553
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,402
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,177
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,814
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,898