JS中数组那些事~
今天闲的没事，看了一些关于数组的操作，好久木有用过，很多都已经忘记的差不多了，所以今天花了一个小时写了一些demo，准备备份一下方便以后使用~~~
下面是一些工作当中，经常用到的数组的方法，小伙伴可以自行选择自己的喜好~~~
<!DOCTYPE html>
<html>
<head>
<title>array</title>
</head>
<body> </body>
<script type="text/javascript"> var
arr = [1,2,3,4,5],
arr1 = [10,4,5,2,8,99]; /*
A instanceof B
A是不是B造出来的
*/
console.log(arr instanceof Array) //true /*
Array.isArray(a)
变量a是否是数组
*/
console.log(Array.isArray(arr)) //true
console.log(Array.isArray(2)) //false /*
toString()
数组转为字符串，用“ ， ”链接;
join也能达到这种效果
*/
console.log(arr.toString()) /*
数组.join('符号')
将数组以符号链接形成字符串
*/
console.log(arr.join('$'))
console.log(arr.join(' ')) /* push 在数组末尾添加
pop 在数组末尾删除
*/
arr.push('paoAfter')
console.log(arr);
arr.pop()
console.log(arr); /* unshift 在数组最前面添加
shift 在数组最前面删除
*/
arr.unshift('paoUnshift')
console.log(arr)
arr.shift()
console.log(arr) /* 数组的排序 */
/*
reverse
数组翻转
*/
console.log(arr.reverse()) /*
sort() ????
数组排序，从小到大
*/
console.log(arr.sort()) //利用回调函数对数组大小进行排序
arr1.sort(function (a,b) {
return a - b;
})
console.log(arr1) /* 数组元素的操作 */
/*
数组1.concat(数组2)
拼接两个数组
*/
console.log(arr.concat(arr1))
//数组去重1：
Array.prototype.arrUnique = function () {
// 先排序
this.sort();
// 定义一个新数组从排序后的数组的第一个开始接收值
var arr = [this[0]];
// 从第二个数值开始比较
for (var i = 1; i < this.length; i++) {
//比较相邻的值不一样时，新数组接收值，达到去重效果
//原数组的第一个与新数组的最后一个相比较
if( this[i] !== arr[arr.length - 1]) {
arr.push(this[i])
}
}
return arr;
} var arrnew = arr.concat(arr1).arrUnique()
console.log(arrnew) // 数组去重2
var r=[],
arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
for(var i=0,len=arr.length;i<len;i++){
//如果新的数组中找不到arr数组中的元素，将数组元素存放在新数组中
if(r.indexOf(arr[i])===-1){
r.push(arr[i]);
}
} /*
slice 数组的截取
数组.slice(开始的索引，结束的索引)
*/
console.log(arr.slice(3)) //从索引值为3截取到最后
console.log(arr.slice(0,3)) //从索引值为1到3截取
console.log(arr.slice(-2)) //负数后几个 /*
数组.splice (开始索引值，删除几个，替换内容1，替换内容2，....)
同slice有点雷同
*/
console.log(arr.splice(3)) //从索引值为3截取到最后
console.log(arr) console.log(arr.splice(0,3)) //从索引为0开始删除3个
console.log(arr) console.log(arr1)
console.log(arr1.splice(1,2,'a','b')) //从索引为1开始删除2个，并用‘a’，‘b’替换删除的内容
console.log(arr1) /*
数组.indexOf(元素) （从左往右）
数组中是否包含元素，如果包含，返回对应的索引；如果不包含，返回-1 数组.lastIndexOf(元素) （从右往左）
*/
console.log(arr1.indexOf(2)) //index：0
console.log(arr1.indexOf(990)) //-1；查不到 console.log(arr1.lastIndexOf(2)) //index：0
console.log(arr1.lastIndexOf(990)) //-1；查不到 /* 数组迭代 */
/*
数组.map(function (item,index,array) { return newArr})
*/
var sporter =[{
name:'aa',
isHell:null
},{
name:'bb',
isHell:null
},{
name:'cc',
isHell:true
}];
var arr2 = [];
sporter.map(function (item,index,array) {
if ( item.isHell ) {
arr2.push(item.name);
}
})
console.log(arr2)
// es6写法
sporter.map( item => {
if ( item.isHell ) {
arr2.push(item.name);
}
})
console.log(arr2) /*
数组.filter(function (item,index,array) { return newArr})
返回符合条件的元素为true的数组
*/
var arr = sporter.filter( item => {return item.isHell});
console.log(arr) var arr = sporter.filter( item => item.isHell);
console.log(arr) console.log('-1' == false) //false // 数组去重3
var
arr3 = [1,2,3,2,3,5,6,6]; var arr = arr3.filter(function(item,index,self) {
console.log(item+'----------------'+self)
return self.indexOf(item) == index;
});
console.log(arr) /*
every()
数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true ; some()
对数组中的每一项运行给定函数，如果该函数对任一项返回true，则返回true;
*/
var arr = sporter.every(function (item) {
return item.isHell;
})
console.log(arr) var arr = sporter.some(function (item) {
return item.isHell;
})
console.log(arr) /*
forEach()
和for循环一样，没有返回值
*/
var arr = sporter.forEach(function(item) {
item.sex = 'man'
})
console.log(arr) //因为forEach没有返回值，所以是undefined /*
数组.redval(a,b)
这个方法一般用在累计累加上，实用技巧暂时还没发现。比如，数字数组求和，字符串数组连接上
*/
// 数组求和，数组的拼接
var sum=0,arr=[1,2,3,4,5,6];
sum = arr.reduce(function (a,b) {
return a + b;
}) /*
数组.find(val)
方法返回传入一个测试条件（函数）符合条件的数组第一个元素。
*/
var
arr4 = [1,2,3,4];
var a = arr4.find(function(val){
return val > 2;
})
console.log(a) /* 数组.findIndex(val)
findIndex：方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。
如果不存在，则返回-1；如果存在满足条件的，返回符合条件的第一个索引；
*/
var a = arr4.findIndex(function(val) {
return val > 4;
})
console.log(a) //-1 /* 数组的清空 */
var arr5 = ['a','b','c',1];
arr5.length = 0; //伪数组无法清空
console.log(arr5) arr5.splice(0); //从索引为0开始截取到最后一个，伪数组无法清空
console.log(arr5); arr5 = []; //推荐使用，伪数组可用 // 伪数组：就是长的像数组，不过没有数组的方法，不能添加删除元素
fn(111,222,333);
function fn() {
arguments.length = 0; //无法清空
console.log(arguments); arguments.splice(0)
console.log(arguments); //报错 arguments = []
console.log(arguments)
} </script>
</html>
好啦，有需要了解的
JS中数组那些事~的更多相关文章
- js中数组去重的几种方法
js中数组去重的几种方法 1.遍历数组,一一比较,比较到相同的就删除后面的 function unique(arr){ ...
- JavaScript -- 时光流逝（二）：js中数组的方法
JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...
- php和js中数组的总结
php中数组的表示方法:array()或者[] js中数组的表示方法:new array()或者[] 一.php中初始化命名数组 在PHP中声明数组的方式主要有两种:一是应用array()函数声明 ...
- JS中数组的介绍
一.数组: 一组数据的集合: 二.JS中数组的特点: 1.数组定义时无需指定数据类型: 2.数组定义时可以无需指定数组长度: 3.数组可以存储任何类型的数据: 4.一般是相同的数据类型: 三.数组的创 ...
- js中数组增删查改unshift、push、pop、shift、slice、indexOf、concat、join
js中数组增删查改unshift.push.pop.shift.slice.indexOf.concat.join
- js中数组如何使用
js中数组如何使用 一.总结 一句话总结:new Array()和[]两种方法都可以创建数组. 二.js中创建数组,并往数组里添加元素 数组的创建 var arrayObj = new Array() ...
- js中数组方法大全
js数组方法大全 一:前言 我们在学到js中数组的时候,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历的达到我们想要的结果,但是因为方法比较多,有些方法也不常用,可能会过一段时间就会 ...
- js中数组去重方法及性能对比
js中数组的 数组去重 常用的数组去重方法以及效率分析: 首先我们先构建一个数组,主要是用于进行去重实验,我们主要实验的量级为1000,10000,100000,500000.具体的生成数组的方法如下 ...
- js中数组扁平化处理
随机推荐
- windows多线程（六） 互斥量Mutex与关键段CriticalSection比较
一.关键段CS 和 互斥量Mutex 的相同点:都有线程拥有权 关键段和互斥量都有线程拥有权,即可以被一个线程拥有.在 前面讲关键段CS的文章中有说到,关键段结构体的第四个参数保存着拥有该关键段的线程 ...
- day1 学习历程
day1 我是一个在校大三学生,一个依然迷茫不知前景的大学混子= =,可以这么说吧 大学混子 真正开始决定好好学习大概在去年的12月份 那时经老师的提醒 开始正式接触软件开发 于是 从头开始学习语言 ...
- nowcoder 202H-卡牌游戏
题目链接 题目描述 小贝喜欢玩卡牌游戏.某个游戏体系中共有N种卡牌,其中M种是稀有的.小贝每次和电脑对决获胜之后都会有一个抽卡机会,这时系统会随机从N种卡中选择一张给小贝.普通卡可能多次出现,而稀有卡 ...
- iOS 数据库sqlite完整增删改查操作
1: 创建数据库表格 1.1 — 表格创建使用一个数据库软件快速创建:软件大小14.3M; 下载地址:http://pan.baidu.com/s/1qWOgGoc; 表格创建-> 打开软件,点 ...
- Python学习---日期时间
在Python里面日期时间的功能主要由几个模块提供:time,calendar,datetime,date等 time主要用到的功能函数: #!/usr/bin/python3 # coding:ut ...
- 【HLSDK系列】overview（俯视图）
温馨提示:使用PC端浏览器阅读可获得最佳体验 阅读本文时,请时不时就对照参考图看一下. 什么是overview? 如果你有使用过3D模型制作工具,例如3dsMax等等,在编辑模型时这些软件通常会展示四 ...
- 题解 CF762A 【k-th divisor】
emmm...不能说是水题吧...小金羊以为考的是STL(手动滑稽)... 行,这个题说让分解因数(不一定非得质因数). 我们考虑到有第k个数有可能有\(x\cdot x=n\)的毒瘤情况, 并且题目 ...
- Backdooring a OS VM
Backdooring a OS VM 来源 https://www.cnblogs.com/studyskill/p/6524672.html 提示: 1.经过实验,fortios 5.4 be ...
- 手机H5显示一像素的细线
手机屏幕分辨率的问题,导致h5的1像素看起来比较粗,网上找了一个办法,记下来 主要就是通过scale来缩小宽度 .line1px{ border: none; border-botto ...
- 洛谷P4902乘积
题面链接 洛谷 题意简述 求\(\prod_{i=A}^B\prod_{j=1}^i \lgroup \frac{i}{j} \rgroup ^{\lfloor \frac{i}{j} \rfloor ...