资讯专栏INFORMATION COLUMN

数组方法-ES5(复习笔记)

TZLLOG / 807人阅读

摘要:接收四个参数上一次调用回调返回的值,或者是提供的初始值前一个值数组中当前被处理的数组项当前值当前数组项在数组中的索引值项的索引调用方法的数组说这么多还是看代码就清楚了第一次执行回调函数,是,是。

数组方法ES5

------ES5-------

push() --从数组末尾添加参数,返回修改后数组的长度;(可传多个参数)

    栈方法(后进先出)
var animals = ["cat","dog","pig"];
var all = animals.push("bird");  //末尾推入一项
console.log(all);  // 4

pop() --从数组末尾删除参数,返回值为删除元素(只删除一个);
栈方法(后进先出)

var animals = ["cat","dog","pig","bird"];
var all = animals.pop(); //取得最后一项  
console.log(all);  // bird

unshift() --从数组起始添加参数,返回修改后数组的长度;(可传多个参数)

   队列方法(先进先出)
var animals = ["cat","dog","pig"];
var all = animals.unshift("bird");  //起始推入一项
console.log(all);  // 4

shift() --从数组起始删除参数,返回值为删除元素(只删除一个)

   队列方法(先进先出)
var animals = ["cat","dog","pig","bird"];
var all = animals.unshift();  //取得起始一项
console.log(all);  // cat

splice()--
删除:删除任意数量的项,指定两个参数,要删除的第一项的位置和要删除得项数;

var animals = ["cat","dog","pig","bird"];
var all = animals.splice(0,2);  //删除前两项
console.log(all);  // ["cat"]

插入:向指定位置添加任意数量的项,需提供三个参数:起始位置、0(要删除的项数)和要插入的项;

var animals = ["cat","dog","pig","bird"];
var all = animals.splice(2,0,"a","b","c");  //从第二项后插入
console.log(all);  // [] 
console.log(animals);  // ["cat", "dog", "a", "b", "c", "pig", "bird"]

替换:向指定位置添加任意数量的项,且同时删除任意数量的项,需提供三个参数:起始位置、要删除的项数和要插入的项;

var animals = ["cat","dog","pig","bird"];
var all = animals.splice(1,3,"a","b","c");  //从第一项后插入,删除后三项
console.log(all);  // ["dog", "pig", "bird"] 返回删除得项
console.log(animals);  // ["cat", "a", "b", "c"]

slice(start,end)--切去起始位置到结束位置的数组(不包含end),返回值为切出的数组;

var animals = ["cat","dog","pig","bird","tiger"];
var frag = animals.slice(1,2);  
var frag2 = animals.slice(1);
console.log(frag);    //["dog"]
console.log(frag2);  // ["dog", "pig", "bird","tiger"]
//如果slice()方法的参数中有一个负数,则用数组长度加上该数来确定相应的位
//置。例如,在一个包含5 项的数组上调用slice(-2,-1)与调用slice(3,4)得到的
//结果相同。如果结束位置小于起始位置,则返回空数组。
var frag3 = animals.slice(-3); //等同于 animals.slice(2)
var frag4 = animals.slice(-3,-1); //等同于 animals.slice(2,4)

concat()--连接两个数组返回新数组

var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
alert(colors); //red,green,blue
alert(colors2); //red,green,blue,yellow,black,brown

Javascript高级程序设计(第3版)

sort()--按升序排列数组项,即最小的值位于最前面,最大的值排在最后面(默认是按照最左边的数字进行排序,不是按照数字大小排序的),返回值是排好的数组;

var values = [0, 1, 5, 10, 15];
values.sort();
console.log(values); //0,1,10,15,5
values.sort(function(a,b){
    return a - b;   //由小到大排序,b-a由大到小排序
})

reverse()--反转数组项的顺序(默认是按照最左边的数字进行排序,不是按照数字大小排序的),返回值是反转后的数组;

var values = [1, 22, 3, 43, 5];
values.reverse();
console.log(values); //5,43,3,22,1

indexOf()--查找某个元素的索引值,若有重复的,则返回第一个查到的索引值若不存在,则返回-1

var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3

lastIndexOf()--查找某个元素的索引值(从后往前),若有重复的,则返回第一个查到的索引值若不存在,则返回-1;

var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.lastIndexOf(4)); //5

forEach(callback)--遍历数组。这个方法没有返回值;

var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item,index,array){
    console.log(`value:${value}  index:${index}  array:${array}`)
})

every(callback)--根据条件判断,全部满足,则返回true,否则false;

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every((v,i) => v < 3);
alert(everyResult); //false

filter(callback)--对数组进行过滤,返回满足条件的数组;

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter((item, index, array) => item >2);
alert(filterResult); //[3,4,5,4,3]

map(callback)--映射数组(遍历数组),有return 返回一个新数组;

var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map((item, index, array) => item * 2);
alert(mapResult); //[2,4,6,8,10,8,6,4,2]

some(callback)--根据条件判断,有一个满足条件,则返回true;

var numbers = [1,2,3,4,5,4,3,2,1];
var someResult = numbers.map((item, index, array) => item > 2);
alert(someResult); //true

reduce()--方法接收一个函数 callback 作为累加器([accumulator]()),数组中的每个值(从左到右)开始合并,最终为一个值。
接收四个参数:
preValue: 上一次调用回调返回的值,或者是提供的初始值(initialValue)前一个值
curValue: 数组中当前被处理的数组项(当前值)
index: 当前数组项在数组中的索引值(项的索引)
array: 调用 reduce()方法的数组

说这么多还是看代码就清楚了

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
    return prev + cur;
});
alert(sum); //15

`第一次执行回调函数,prev 是1,cur 是2。第二次,prev 是3(1 加2 的结果),cur 是3(数组
的第三项)。这个过程会持续到把数组中的每一项都访问一遍,最后返回结果。`

reduceRight()--功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加;

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
    return prev + cur;
});
alert(sum); //15

`第一次执行回调函数,prev 是5,cur 是4。当然,最终结果相同,因为执行的都
是简单相加的操作。
使用reduce()还是reduceRight(),主要取决于要从哪头开始遍历数组。除此之外,它们完全
相同。`

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103107.html

相关文章

  • 【重温基础】1.语法和数据类型

    摘要:语法和数据类型正文开始本章节复习的是中的基本语法,变量声明,数据类型和字面量。声明一个块作用域的局部变量,可赋一个初始值。变量声明有三种方式如,声明局部变量和全局变量。 最近开始把精力放在重新复习JavaScript的基础知识上面,不再太追求各种花枝招展的前端框架,框架再多,适合实际项目才是最重要。 上星期在掘金发布了几篇文章,其中最大块算是 【复习资料】ES6/ES7/ES8/ES...

    Darkgel 评论0 收藏0
  • 数组的使用总结— (js基础复习第2期)

    摘要:前一个值,当前值,索引,数组对象产生新数组的迭代器方法类似,对数组的每个元素使用某个函数,并返回新数组和相似,传入一个返回值为布尔类型的函数。 1. 前言 数组真的是每天用了,但是有很多方法都是记不住,总是要百度查,很烦,所以才写了个数组使用总结,有什么不对的希望大家指出来。 2. 思路 先看看这些问题都记得很清楚么? 创建数组,怎么创建数组的 数组的构造方法Array有哪些方法?E...

    zhigoo 评论0 收藏0
  • js基础知识点

    摘要:注意乱序遍历对象属性。注意因为会遍历整个原型链的所有属性值,所以效率较循环慢了很多。,不做类型转换,类型不同的一定不等操作事件机制几个概念事件流,事件冒泡,事件捕获原型继承面向对象前端模块化规范列表项目闭包跨域 根据百度学院的教程复习下js基础,在这里做一个汇总笔记 1.数据类型、判断 最新的 ECMAScript 标准定义了 7 种数据类型: string number boole...

    浠ラ箍 评论0 收藏0
  • JS学习笔记 - 代码复用

    摘要:本文章记录本人在学习中看书理解到的一些东西,加深记忆和并且整理记录下来,方便之后的复习。但是在开发的过程中,并不是所有的代码复用都会使用到继承。而且整个代码都无法按照预期来运行。为了修复绑定对象与方法之间的关系。 本文章记录本人在学习 JavaScript 中看书理解到的一些东西,加深记忆和并且整理记录下来,方便之后的复习。 js 中复用代码 说道代码复用,一般都会涉及到对...

    cheng10 评论0 收藏0
  • 《ES6标准入门》读书笔记

    摘要:标准入门读书笔记和命令新增命令,用于声明变量,是块级作用域。用于头部补全,用于尾部补全。函数调用的时候会在内存形成一个调用记录,又称为调用帧,保存调用位置和内部变量等信息。等到执行结束再返回给,的调用帧才消失。 《ES6标准入门》读书笔记 @(StuRep) showImg(https://segmentfault.com/img/remote/1460000006766369?w=3...

    HollisChuang 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<