JavaScript学习之数组(下)

Labradors 发布于2019-08-23 12:14 / 3264人阅读

摘要：数组篇方法函数可以将函数作为参数传入，并将数组中每个元素代入函数进行处理返回，返回一个新的数组可以看出可以传入两个参数，第一个参数中函数可以填入三个参数，数组的元素，数组的索引，数组本身第二个参数用来绑定回调函数内部的注意点当元素为空位，，

数组篇 map()方法

map函数可以将函数作为参数传入，并将数组中每个元素代入函数进行处理返回，返回一个新的数组

arr.map(function (elem, index, arr) {...}, arg)

可以看出map可以传入两个参数，第一个参数中函数可以填入三个参数，elem：数组的元素，index：数组的索引，arr：数组本身
第二个参数用来绑定回调函数内部的this

var arr = [1, 2, 3, 4, 5, 6, 7];
var obj = {a : 3};
var new_arr = arr.map(function (elem) {
    if (this.a < elem) {
        return elem * 2;
    }
    else{
        return this.a;
    }
    
},obj);

console.log(new_arr);  // [3, 3, 3, 8, 10, 12, 14]

注意点：当元素为空位，undefined，null时map的表现

var count = 0;
var f = function (elem, index) {
    count ++；
};
[1, , 3].map(f);          //count 2
[1, null,3 ].map(f);      //count 3
[1, undefined, 3].map(f); //count 3

当元素是空位时map会跳过，undefined,null不会跳过

forEach()方法

forEach函数与map类似，也是遍历数组，代入函数，没有返回值；可以理解成只是将数组元素进行一些操作处理
个人觉得forEach能实现的，map也能实现

var arr = [];
[1, 2, 3].forEach(function (elem) {
    arr.push(elem * 2);
})

同理当元素是空位时forEach会跳过，undefined,null不会跳过

filter()方法

filter函数是过滤一些元素，当返回值为true时，保留元素，false时，舍去元素

var arr = [1, 2, 3].filter(function (elem) {
    if(elem > 2) {
        return 1;
    }
        return 0;
}); 
arr; //[3]

同理当元素是空位时forEach会跳过，undefined,null不会跳过

some(),every()方法

两个方法函数的都是布尔值
some函数，将数组遍历代入函数中，依次执行当一个满足条件就返回布尔值true，否则遍历完都不满足返回false
every函数，将数组遍历代入函数中，依次执行当一个不满足条件就返回布尔值false，否则遍历完都满足返回true

var count = 0
var bool = ["1", 2, 4].every(function (elem) {
    count ++;
    
    return (typeof elem === "number");
});
console.log(count, bool);    //1 false

var count = 0
var bool = [1, "2", "4"].some(function (elem) {
    count ++;
    
    return (typeof elem === "number");
});
console.log(count, bool);    //1 true

对于空位，null，undefined的执行
every()与some()一样:空位时会跳过，undefined,null不会跳过
当为空数组时([],[,])：
some()返回false，个人方便理解，遍历时一直在跳过，都不满足最后只好返回false
every()返回true，个人方便理解，遍历时一直在跳过，都满足最后只好返回true;

reduce()与reduceRight()

reduce函数的实现效果有点像斐波那契数列的味道

arr.reduce(function (prev, cur, index, arr) {}, arg)

reduce函数可以接受两个参数
第一个参数是函数，prev：累计变量，也就是上一次的执行结果；cur：当前变量；index：当前变量的索引；arr：操作的数组本身
第二个参数用来指定初始值，可以用于处理空数组

var f = function (prev, cur) {
    return prev + cur;
};
[].reduce(f, 1);     //1
[1, 2].reduce(f, 1); //4
[].reduce(f);        //报错Reduce of empty array with no initial value

有一个有趣的应用：查找数组中length最长的，利用参数prev的累计功能

var f = function (prev, cur) {
    return prev.length < cur.length ? cur : prev;
};
var lon = ["123", "11113","23","4322"].reduce(f);
console.log(lon);

reduceRight函数与reduce函数一样，只不过从后往前遍历数组
同理当元素是空位时reduce和reduceRight会跳过，undefined,null不会跳过

indexOf()与lastIndexOf()

indexOf函数返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1；
匹配规则用的是全等（===）
不填参数，返回-1
特别是匹配对象和NaN时,对象在全等下比较的是地址，而NaN不等于自身

var arr = [NaN, 1, {a : 1}];
console.log(arr.indexOf());              //-1
console.log(arr.indexOf(NaN));           //-1
console.log(arr.indexOf(1));             //1
console.log(arr.indexOf({a : 1}));       //-1

lastIndexOf()是从后往前找

idc机房托管专线服务学习之substr() 深度学习之概要 webrtc学习之九 linux学习之centos

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

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

JavaScript学习之JSON对象

摘要：原始类型的值只有四种字符串数值必须以十进制表示布尔值和不能使用和。字符串必须使用双引号表示，不能使用单引号。数组或对象最后一个成员的后面，不能加逗号。 JSON对象补充记录一下，有些方法很需要熟练记忆的 JSON对象的规定 JSON对象对值有严格的规定复合类型的值只能是数组或对象，不能是函数、正则表达式对象、日期对象。原始类型的值只有四种：字符串、数值（必须以十进制表示）、布尔值和...

banana_pi 2019-08-23 12:43 评论0 收藏0
JavaScript学习之正则表达式

摘要：正则表达式如何创建正则表达式字面量创建通过构造函数正则表达式实例属性及方法三个修饰符属性，只读不可修改正则表达式是否添加了忽略大小写的修饰符，返回一个布尔值正则表达式是否添加了全局匹配的修饰符，返回一个布尔值正则表达式是否添加了换行的修饰符正则表达式如何创建正则表达式字面量创建var r = /a/; 通过构造函数var r = new RegExp(a); 正则表达式实...

idealcn 2019-08-23 12:19 评论0 收藏0
JavaScript学习之Object(下)new命令

摘要：命令作用作用是执行构造函数，返回实例对象上面例子是自定义一个构造函数，其最大的特点就是首字母大写，用执行构造函数其中，在的执行下，代表了实例化后的对象，这个也就有属性注意点如果不用执行构造函数，那么指向的是全局有两种方式可以避免内部定义严格 new命令 new作用作用是执行构造函数，返回实例对象 function F() { this.name = object } var ...

Salamander 2019-08-23 12:14 评论0 收藏0
JavaScript学习之零碎记忆点总结记录(一)

摘要：总结记录常见的五种类型报错语法解析错误变量未定义变量类型错误数组越界相关函数参数错误能防止报错导致后面代码不能执行问题的未定义不影响后面函数的执行注意点在报错前，不执行里的内容不报错也不执行在报错后，的内容不会被执行执行完结束，如果有总结记录 try-catch-finally 常见的五种类型报错 SyntaxError语法解析错误 ReferenceError变量未定义 Type...

fou7 2019-08-23 12:16 评论0 收藏0
Javascript设计模式学习之Module(模块)模式

摘要：实现模块的几种方法对象字面量表示法模式模式模式模块对象字面量对象字面量型完整版配置对象基本方法根据配置信息输出内容重写当前的配置信息输出结果值模式最初被定义为一种在传统软件工程中为类提供私有和公有封装的方法。该模式返回一个对象。 javascript实现模块的几种方法: 对象字面量表示法 Module模式 AMD模式 CommonJS模式 ECMAScript Harmony模块 ...

付永刚 2019-08-19 17:48 评论0 收藏0