资讯专栏INFORMATION COLUMN

javascript数组的几个常用姿势

worldligang / 2454人阅读

摘要:前言本文将分享几个在项目中常用的数组方法原文地址不定期有干货更新哦欢迎数组排序按数组元素大小从小到大进行排序按数组元素大小从大到小进行排序按数组元素的从小到大进行排序按数组元素的从大到小进行排序数组去重数组深拷贝数组等份分割数组扁平

前言

本文将分享几个在项目中常用的数组方法~

原文地址: https://github.com/webfansplz...

不定期有干货更新哦,欢迎watch,star!

1.数组排序
  const sortAry = [1, 5, 4, 3, 2, 6, 7];

  1.按数组元素大小从小到大进行排序

  sortAry.sort((a, b) => a - b); //[1, 2, 3, 4, 5, 6, 7]

  2.按数组元素大小从大到小进行排序

  sortAry.sort((a, b) => b - a); //[7, 6, 5, 4, 3, 2, 1]

  const sortId = [
    { id: 3, name: "c" },
    { id: 1, name: "a" },
    { id: 2, name: "b" }
  ];

  3. 按数组元素的id从小到大进行排序

  sortId.sort((a, b) => a.id - b.id);

  //[{ id: 1, name: "a"},{id: 2, name: "b"},{id: 3, name: "c"}]

  4.按数组元素的id从大到小进行排序

  sortId.sort((a, b) => b.id - a.id); 
  
  //[{ id: 3, name: "c" },{ id: 2, name: "b" },{ id: 1, name: "a" }]
};
2.数组去重
  const uniqAry = ary => Array.from(new Set(ary));

  const uniqAry2 = ary => ary.filter((v, k) => ary.indexOf(v) == k);

  const ary = [1, 2, 1, 2, 3, 4, 3];

  uniqAry(ary)   //[1,2,3,4]

  uniqAry2(ary)  //[1,2,3,4]
  
3.数组深拷贝
 const copyAry = [1, 2, 3, 4];
 
 const ary = [].slice.apply(copyAry);

 ary.push(5);

 console.log(ary);     //[1, 2, 3, 4, 5]

 console.log(copyAry); //[1, 2, 3, 4]

 const ary2 = JSON.parse(JSON.stringify(copyAry));

 ary2.push(5);

 console.log(ary2);   //[1, 2, 3, 4, 5]

 console.log(copyAry); //[1, 2, 3, 4]
4.数组等份分割
const ary = [1, 2, 3, 4, 5, 6, 7];

const splitAry = (ary, size) => {
  let i = Math.ceil(ary.length / size),
    count = 0,
    box = [];
  while (count < i) {
    let s = count * size;
    box.push(ary.slice(s, s + size));
    count++;
  }
  return box;
};

console.log(splitAry(ary, 3)); //[[1,2,3],[4,5,6],[7]]

console.log(splitAry(ary,2)); // [[1,2],[3,4],[5,6],[7]]
5.数组扁平化
//二维数组扁平化

const ary = [[1, 2], [3, 4], [5, 6]];

const flatten = ary => ary.reduce((a, b) => [...a, ...b]);

console.log(flatten(ary)); //[1, 2, 3, 4, 5, 6]

//多维数组扁平化

const ary2 = [[1, [2, 3]], [4, [5, [6, 7]]]];

const flattenS = ary =>
  ary.reduce((a, b) => a.concat(Array.isArray(b) ? flattenS(b) : b), []);

console.log(flattenS(ary2)); //[1, 2, 3, 4, 5, 6, 7]

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

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

相关文章

  • 来自Chart.js几个JS helper function

    摘要:最近兼职的项目里面因为要用进行数据的交互式可视化,用比较多,也踩了不少坑。内部用这个进行之类的时,先深拷贝然后再扩展,比较方便。可以看出直接给原型进行扩展,写起来非常简洁。 最近兼职的项目里面因为要用charts进行数据的交互式可视化,用Chart.js比较多,也踩了不少坑。为了改bug提pr外加学习一下提高姿势水平花了一点时间看了下源码,发现一些比较有用简介的helper funct...

    Kross 评论0 收藏0
  • 杂货 - 收藏集 - 掘金

    摘要:消息队列技术介绍后端掘金一消息队列概述消息队列中间件是分布式系统中重要的组件,主要解决应用耦合异步消息流量削锋等问题。的内存优化后端掘金声明本文内容来自开发与运维一书第八章,如转载请声明。 消息队列技术介绍 - 后端 - 掘金一、 消息队列概述 消息队列中间件是分布式系统中重要的组件,主要解决应用耦合、异步消息、流量削锋等问题。实现高性能、高可用、可伸缩和最终一致性架构。是大型分布式系...

    loostudy 评论0 收藏0
  • React16时代,该用什么姿势写 React ?

    摘要:的返回值将作为的参数,如果返回,则不更新,不能返回或以外的值,否则会警告。在更新之前调用,此时已更新返回值作为的第个参数一般用于获取之前的数据语法是从的返回值,默认是的使用场景一般是获取组建更新之前的滚动条位置。 React16 后的各功能点是多个版本陆陆续续迭代增加的,本篇文章的讲解是建立在 16.6.0 版本上本篇文章主旨在介绍 React16 之后版本中新增或修改的地方,所以对于...

    Reducto 评论0 收藏0
  • Move Mirror:使用 TensorFlow.js 在浏览器中预测姿势之 AI 实验

    摘要:文和,创意实验室创意技术专家在机器学习和计算机视觉领域,姿势预测或根据图像数据探测人体及其姿势的能力,堪称最令人兴奋而又最棘手的一个话题。使用,用户可以直接在浏览器中运行机器学习模型,无需服务器。 文 /  Jane Friedhoff 和 Irene Alvarado,Google 创意实验室创意技术专家在机器学习和计算机视觉领域,姿势预测或根据图像数据探测人体及其姿势的能力,堪称最令人兴...

    MiracleWong 评论0 收藏0
  • 一些ES6新姿势

    摘要:原文对象属性分配在处理对象的时候,你可能需要把多个对象合在一起,新的函数可以简洁地做到这件事。对象合并我们的目标是把行的对象合并为一个对象。需要注意的是只返回符合要求的第一个元素。行是返回第一个找到元素的索引,没有对应方法。 原文: Javascript ES6 — Exploring the New Built-In Methods 对象属性分配 在处理对象的时候,你可能需要把多个对...

    Yujiaao 评论0 收藏0

发表评论

0条评论

worldligang

|高级讲师

TA的文章

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