es6新增的二十个方法代码示例

  1. Includes方法:判断数组是否包含某个值
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
console.log(arr.includes(3)); // true
console.log(arr.includes(6)); // false
  1. Find方法:返回数组中符合条件的第一个元素
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const found = arr.find(element => element > 2);
console.log(found); // 3
  1. FindIndex方法:返回数组中符合条件的第一个元素的索引
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const foundIndex = arr.findIndex(element => element > 2);
console.log(foundIndex); // 2
  1. Filter方法:返回数组中符合条件的所有元素
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const filtered = arr.filter(element => element > 2);
console.log(filtered); // [3, 4, 5]
  1. Map方法:将数组中的每个元素进行处理,并返回新的数组
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const doubled = arr.map(element => element * 2);
console.log(doubled); // [2, 4, 6, 8, 10]
  1. Reduce方法:将数组中的元素累加或累乘
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue);
console.log(sum); // 15
  1. Spread语法:用于数组拷贝、合并
javascript 复制代码
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const mergedArr = [...arr1, ...arr2];
console.log(mergedArr); // [1, 2, 3, 4, 5, 6]
  1. Set数据结构:去重数组
javascript 复制代码
const arr = [1, 2, 2, 3, 3, 4];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4]
  1. Array.from方法:将类数组对象或可迭代对象转化为数组
javascript 复制代码
const nodeList = document.querySelectorAll('div');
const arr = Array.from(nodeList);
console.log(arr); // array of div elements
  1. Array.of方法:创建一个指定元素的数组
javascript 复制代码
const arr = Array.of(1, 2, 3, 4, 5);
console.log(arr); // [1, 2, 3, 4, 5]
  1. Array.fill方法:用指定值填充数组
javascript 复制代码
const arr = new Array(5);
arr.fill(0);
console.log(arr); // [0, 0, 0, 0, 0]
  1. Array.some方法:判断数组中是否存在满足条件的元素
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const hasEven = arr.some(element => element % 2 === 0);
console.log(hasEven); // true
  1. Array.every方法:判断数组中所有元素是否都满足条件
javascript 复制代码
const arr = [1, 2, 3, 4, 5];
const allEven = arr.every(element => element % 2 === 0);
console.log(allEven); // false
  1. Array.flat方法:将嵌套数组扁平化
javascript 复制代码
const arr = [1, 2, [3, 4], [5, [6, 7]]];
const flatArr = arr.flat(2);
console.log(flatArr); // [1, 2, 3, 4, 5, 6, 7]
  1. Array.flatMap方法:先对数组中的每个元素执行map方法,再将结果扁平化
javascript 复制代码
const arr = [1, 2, 3];
const mappedArr = arr.flatMap(element => [element, element * 2]);
console.log(mappedArr); // [1, 2, 2, 4, 3, 6]
  1. Object.entries方法:返回对象可遍历的键值对数组
javascript 复制代码
const obj = { a: 1, b: 2, c: 3 };
const entries = Object.entries(obj);
console.log(entries); // [['a', 1], ['b', 2], ['c', 3]]
  1. Object.values方法:返回对象可遍历的值数组
javascript 复制代码
const obj = { a: 1, b: 2, c: 3 };
const values = Object.values(obj);
console.log(values); // [1, 2, 3]
  1. Object.keys方法:返回对象可遍历的键数组
javascript 复制代码
const obj = { a: 1, b: 2, c: 3 };
const keys = Object.keys(obj);
console.log(keys); // ['a', 'b', 'c']
  1. Object.assign方法:合并对象
javascript 复制代码
const obj1 = { a: 1 };
const obj2 = { b: 2 };
const mergedObj = Object.assign({}, obj1, obj2);
console.log(mergedObj); // { a: 1, b: 2 }
  1. 对象解构赋值:从对象中提取属性,赋值给变量
javascript 复制代码
const obj = { a: 1, b: 2 };
const { a, b } = obj;
console.log(a, b); // 1 2
相关推荐
Serene_Dream11 分钟前
JVM 并发 GC - 三色标记
jvm·面试
xjt_090112 分钟前
基于 Vue 3 构建企业级 Web Components 组件库
前端·javascript·vue.js
我是伪码农24 分钟前
Vue 2.3
前端·javascript·vue.js
夜郎king1 小时前
HTML5 SVG 实现日出日落动画与实时天气可视化
前端·html5·svg 日出日落
辰风沐阳1 小时前
JavaScript 的宏任务和微任务
javascript
夏幻灵2 小时前
HTML5里最常用的十大标签
前端·html·html5
冰暮流星2 小时前
javascript之二重循环练习
开发语言·javascript·数据库
Mr Xu_2 小时前
Vue 3 中 watch 的使用详解:监听响应式数据变化的利器
前端·javascript·vue.js
未来龙皇小蓝2 小时前
RBAC前端架构-01:项目初始化
前端·架构
程序员agions2 小时前
2026年,微前端终于“死“了
前端·状态模式