forEach

        // forEach 返回undefined
var arr = ['Prosper', 'Lee', 'is', ['very', 'very'], 'nice', '!', , null];
// ES6写法
arr.forEach((currentValue, index, array) => {
console.log('arr[' + index + ']=' + array[index] + '==' + currentValue);
console.log(array.join(",").split(",").join(' '));
});
arr.forEach(function (currentValue, index, array) {
console.log('arr[' + index + ']=' + array[index] + '==' + currentValue);
console.log(array.join(",").split(",").join(' '));
})
// this参数
function Counter() {
this.sum = 0;
this.count = 0;
}
Counter.prototype.add = function (array) {
array.forEach(function (entry) {
this.sum += entry;
++this.count;
console.log(this); // this指向Counter,否则指向window
}, this);
};
var obj = new Counter();
obj.add([1, 3, 5, 7]);
console.log(obj.count); // 4 === (1+1+1+1)
console.log(obj.sum); // 16 === (1+3+5+7)

map

        // map与上同,不同方法如下 将每次的值存到数组中然后返回成一个新数组
var arr1 = ['1', '2', 3, '4', 5, '6'];
console.log(arr1.map(v => v + '2'));
console.log(arr1.map(v => v + 2));
console.log(arr1.map(v => v * '2'));
// 例1 返回新数组
var kvArray = [{
key: function () {},
value: 10
},
{
key: 'abc',
value: 20
},
{
key: 3,
value: 30
}
];
var reformattedArray = kvArray.map(function (obj) {
var rObj = {};
rObj[obj.key] = obj.value;
return rObj;
});
console.log(reformattedArray); // [{function () {}: 10},{abc: 20},{3: 30}]
// 例2 两种结果相同
"Hello World".split('').map(function(x) {
return x;
})
Array.prototype.map.call("Hello World", function(x) {
return x;
})
// 例3 返回选项
var select = `<select name="" id="" multiple="multiple" size="2">
<option value="HTML" selected="selected">HTML</option>
<option value="CSS" selected="selected">CSS</option>
<option value="JS">JS</option>
<option value="Vue">Vue</option>
</select>`;
document.write(select);
var elems = document.querySelectorAll('select option:checked');
var values = Array.prototype.map.call(elems, function(obj) {
return obj.value;
})
console.log(values); // ["HTML", "CSS"]

some()

        // some() 方法测试数组中的某些元素是否通过由提供的函数实现的测试
var arr2 = ['Prosper', 'Lee', 'is', ['very', 'very'], 'nice', '!', , null];
arr2.some(function (currentValue, index, array) {
return currentValue == 'is'; // 通过true
})

every()

        // every() 方法测试数组的所有元素是否都通过了指定函数的测试
var arr2 = ['Prosper', 'Lee', 'is', ['very', 'very'], 'nice', '!', , null];
arr2.every(function (currentValue, index, array) {
return currentValue == 'Prosper'; // 不通过false
})
var arr3 = ['Prosper','Prosper','Prosper','Prosper','Prosper','Prosper'];
arr3.every(function (currentValue, index, array) {
return currentValue == 'Prosper'; // 通过true
})

filter()

        // filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素
var arr4 = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
var result = arr4.filter(word => word.length > 6);
console.log(result);

indexOf()

        // indexOf() str.indexOf(searchValue[, fromIndex]) 方法返回调用 String对象中第一次出现的指定值的索引,开始在 fromIndex进行搜索。如果未找到该值,则返回-1。
var arr5 = ['Prosper', 'Lee', 'is', 'very', 'nice', '!!!'];
console.log(arr5.indexOf("Pro", 0)); // returns -1
console.log(arr5.indexOf("Pro")); // returns -1
console.log(arr5.indexOf("Lee")); // returns 1
console.log(arr5.indexOf("Lee",2)); // returns -1
console.log("Prosper Lee".indexOf("Prosper")); // returns 0
console.log("Prosper Lee".indexOf("Lee")); // returns 8
console.log("Prosper Lee".indexOf("Prosper", 0)); // returns 0
console.log("Prosper Lee".indexOf("Prosper", 5)); // returns -1
console.log("Prosper Lee".indexOf("z")); // returns -1
console.log("Prosper Lee".indexOf("", 10)); // returns 10
console.log("Prosper Lee".indexOf("", 11)); // returns 11
console.log("Prosper Lee".indexOf("", 12)); // returns 11
lastIndexOf()
        // lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置。第二个参数为从0开始查,查到第几个结束
console.log('Prosper Lee'.lastIndexOf('e')); //
console.log('Prosper Lee'.lastIndexOf('o')); //
console.log('Prosper Lee'.lastIndexOf('b')); // -1
console.log('Prosper Lee'.lastIndexOf('e',4)); // -1
console.log('Prosper Lee'.lastIndexOf('e',5)); //
console.log('Prosper Lee'.lastIndexOf('e',9)); //
console.log('Prosper Lee'.lastIndexOf('e',10)); //
reduce()
        // array.reduce(function (accumulator, currentValue, currentIndex, array) {}, initialValue)
[{x: 1}, {x:2}, {x:3}].reduce((accumulator, currentValue) => accumulator + currentValue.x, 0); //
[[0, 1], [2, 3], [4, 5]].reduce(( acc, cur ) => acc.concat(cur), []); // [0,1,2,3,4,5]
// 统计出现次数
['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'].reduce(function (allNames, name) {
allNames[name] = ++allNames[name] || 1;
// if (name in allNames) {
// allNames[name]++;
// } else {
// allNames[name] = 1;
// }
return allNames;
}, {}); // { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
// 按属性对object分类节
var people = [{
name: 'Alice',
age: 21
},
{
name: 'Max',
age: 20
},
{
name: 'Jane',
age: 20
}
];
function groupBy(objectArray, property) {
return objectArray.reduce(function (acc, obj) {
var key = obj[property];
// console.log(key); // 21 20 20
if (!acc[key]) { // undefined时才定义空数组
acc[key] = [];
}
acc[key].push(obj);
return acc;
}, {});
}
console.log(groupBy(people, 'age'));
// groupedPeople is:
// {
// 20: [
// { name: 'Max', age: 20 },
// { name: 'Jane', age: 20 }
// ],
// 21: [{ name: 'Alice', age: 21 }]
// }
[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => { return accumulator + currentValue; }, 10 ); //
// callback accumulator currentValue currentIndex array return value
// [1 call] 10 0 0 [0, 1, 2, 3, 4] 10
// [2 call] 10 1 1 [0, 1, 2, 3, 4] 11
// [3 call] 11 2 2 [0, 1, 2, 3, 4] 13
// [4 call] 13 3 3 [0, 1, 2, 3, 4] 16
// [5 call] 16 4 4 [0, 1, 2, 3, 4] 20

reduceRight()

        // array.reduceRight(function (previousValue, currentValue, index, array) {}, initialValue)
[0, 1, 2, 3, 4].reduceRight((previousValue, currentValue, index, array) => { return previousValue + currentValue; }, 10); //
// callback accumulator currentValue currentIndex array return value
// [1 call] 10 4 4 [0, 1, 2, 3, 4] 14
// [2 call] 14 3 3 [0, 1, 2, 3, 4] 17
// [3 call] 17 2 2 [0, 1, 2, 3, 4] 19
// [4 call] 19 1 1 [0, 1, 2, 3, 4] 20
// [5 call] 20 0 0 [0, 1, 2, 3, 4] 20
reduce 与 reduceRight 之间的区别
        ['1', '2', '3', '4', '5'].reduce((prev, cur) => prev + cur); //
['1', '2', '3', '4', '5'].reduceRight((prev, cur) => prev + cur); //
Array.isArray()
        // Array.isArray() 用于确定传递的值是否是一个 Array。
Array.isArray([1, 2, 3]); // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar"); // false
Array.isArray(undefined); // false

Array.from()

        // Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。
Array.from(['a', 'b', 'c'], (v, i) => i + "->" + v ); // ["0->a", "1->b", "2->c"]
Array.from(['a', 'b', 'c'], x => x + x ); // ["aa", "bb", "cc"]
Array.from({ length: 5 }, (v, i) => i); // [0, 1, 2, 3, 4]
var m = [1, 2, 2], n = [2,3,3];
function combine(){
let arr = [].concat.apply([], arguments); // 没有去重的新数组
console.log(arr);
return Array.from(new Set(arr));
}
console.log(combine(m,n));

trim()

        // trim() 去掉字符串前后空白
console.log(' Prosper Lee '.trim()); // "Prosper Lee"
console.log('Prosper Lee '.replace(/^\s+|\s+$/g, "z")); // "Prosper Leez" // 兼容: 将前后有空格的位置替换成z

ES5新增的更多相关文章

  1. 4日6日--ES5新增数组方法

    forEach使用的函数调用,所以占内存比较大,不如定长for循环和迭代for循环 1.通过forEach将数组中的元素逐个表示出来(遍历方法,读取操作). 2.通过map将原数组中的元素进行算数运算 ...

  2. String方法,js中Array方法,ES5新增Array方法,以及jQuery中Array方法

    相关阅读:https://blog.csdn.net/u013185654/article/details/78498393 相关阅读:https://www.cnblogs.com/huangyin ...

  3. js数组定义和方法 (包含ES5新增数组方法)

    数组Array 1. 数组定义 一系列数据的集合成为数组.数组的元素可以为任何类型的数据(包括数组,函数等),每个元素之间用逗号隔开,数组格式:[1,2,3]. 2. 数组创建方式 (1) 字面量方法 ...

  4. ES5新增数组方法测试和字符串常见API测试

    首先是ES5新增数组方法测试: <!DOCTYPE html><html lang="en"><head> <meta charset=& ...

  5. ES5新增的数组方法

    ES5新增:(IE9级以上支持)1.forEach():遍历数组,无返回值,不改变原数组.2.map():遍历数组,返回一个新数组,不改变原数组.3.filter():过滤掉数组中不满足条件的值,返回 ...

  6. 学习笔记-es5新增的一些数组的API(不全)-字符串-字符串API(不全)

    ### es5新增的数组的api + indexOf() 搜索数组中的元素,并返回它所在的位置. arr.indexOf(str,index) 参数: str为要查找的字符串 index为开始查找的下 ...

  7. ES5新增数组的方法

    ES5新增数组的方法 ES5新增数组常见方法(indexOf/forEach/map/filter/some/every) .indexOf( data , start)  检测数组中是否存在指定数据 ...

  8. ES5新增数组方法every()、some()、filter()、map()

    JavaScript ES5标准中新增了一些Array方法,如every().some().filter().map().它们的出现使我们能够更加便利地操作数组,但对IE9以下浏览器的兼容性比较差.下 ...

  9. this与bind(this) (es5新增)

    this与bind(this) this this指向的是当前函数的作用域(对象实例),有如下的例子 const app = { name: 'xiaoming', log() { console.l ...

  10. 复习——高级语法对象原型,es5新增语法

    今天的开始进入了js的高级语法 我马上也要复习完了,之前学到闭包递归,就回去复习去了,复都复习这么久而且,复习的过程真的比学知识的过程难熬的多,只不过终于要复习完了,再来点es6的新语法马上就要步入v ...

随机推荐

  1. 像屎一样的 Spring Boot入门,总算有反应了

    我特么最烦的就是现在Java不知道抽什么风,喜欢用maven这种,怎么搞都会有错误提示的玩意.搞个spring boot,官方的所谓http://start.spring.io/生成的项目启动不了. ...

  2. React Native 断点调试 跨域资源加载出错问题的原因分析

    写在前面 ————如果从头开始看还没解决,试试文章最后的绝招 闲来无事,折腾了一下React Native,相比之前,开发体验好了不少.但在真机断点调试那里遇到了跨域资源加载出错的问题,一番探索总算解 ...

  3. [Swift]LeetCode38. 报数 | Count and Say

    The count-and-say sequence is the sequence of integers with the first five terms as following: 1. 1 ...

  4. 非对称加密技术中,iFace [ 爱妃链 ]人脸密钥技术排名第三,将弥补区块链现有不足

    最近,区块链领域,出现了一个比较热门技术的讨论,人脸密钥技术,可能大家还对这个名词感到很陌生,但是熟悉加密技术的技术大牛可能一听就能够明白大体的意思了,但是也正是这一熟悉而陌生的技术名词,掀起了区块链 ...

  5. 值得收藏的Mybatis通用Mapper使用大全。

    引言 由于小编的记性不太好,每次在写代码的时候总是把通用mapper的方法记错,所以今天把通用mapper的常用方法做一下总结,方便以后直接查看.好了,不废话啦. 引包 <!-- 通用Mappe ...

  6. Jedis与Luttuce区别

    如果你在网上搜索Redis 的Java客户端,你会发现,大多数文献介绍的都是 Jedis. 不可否认,Jedis是一个优秀的基于Java语言的Redis客户端. 但是,其不足也很明显:Jedis在实现 ...

  7. Redis面试题

    1.谈谈Redis的主从复制流程 有几个重点:主节点负责写,从节点负责读,slave node 主要用来进行横向扩容,做读写分离,扩容的 slave node 可以提高读的吞吐量.必须开启 maste ...

  8. 阿里云服务器公网Ip外网无法访问

    拥有了自己的服务器后,发现需要各种配置,之前应用公司的服务器的时候,一般通过内网访问,或者外网访问时,很多配置其他人员都已经配置好了,但是现在在自己的服务器上发布自己的网站的时候,才发现事情并没有自己 ...

  9. 面试中程序员常见的Redis"刁难"问题,值得一读!

    导读 在程序员面试过程中Redis相关的知识是常被问到的话题.作为一名在互联网技术行业打击过成百上千名的资深技术面试官,总结了面试过程中经常问到的问题.十分值得一读. Redis有哪些数据结构? 字符 ...

  10. Linux suse 11 sp1 安装教程

    在 VMware Workstation Pro 中打开 iso 文件,进入主界面,选择 installation : 语言选择 简体中文,键盘选择 美国US ,选择下一步,点击继续: 选择 全部安装 ...