1数组中删除重复

let arr = [1,2,4,3,6,4]

Array.from(new Set(arr)) // es6中 .from()[1,2,4,3,6]

[...new Set(arr)] // 扩展运算符[1,2,4,3,6]

2替换数组中指定的值

arr .splice(1,3,7,8,9) // [7, 8, 9]
arr // [1, 7, 8, 9, 6, 4]

3数组映射

let mapValue = [
{ name: '山东', value: 22 },
{ name: '北京', value: 23 },
{ name: '上海', value: 24 }
] mapValue.map(item=> {item.name}); // map Array.from(mapValue, ({name}) => name); // .from()

4清空数组 

arr.length = 0 //   arr =[]

5将数组转化为对象

let obj = {...arr } // {0: 1, 1: 7, 2: 8, 3: 9, 4: 6, 5: 4}

6合并数组

let arr2 =['one','two',2] // [1, 2, 4, 3, 6, 4, "one", "two"]

[...arr2,...arr] // ["one", "two", 1, 2, 4, 3, 6, 4]

7两个数组的交集

首先保证数组中的值不重复,然后利用.filter和.includes方法即可

let numOne = [0, 2, 4, 6, 8, 8];
let numTwo = [1, 2, 3, 4, 5, 6]; [...new Set(numOne)].filter(item => numTwo.includes(item))

8从数组中删除假值

首先在Javascript中,假值包括false、0、''、null、NaN、undefined

let mixArrs =[null,3,undefined,true,'']

mixArrs.filter(Boolean); // [3, true]

9颠倒数组中元素的顺序

let mixArrs =[null,3,undefined,true,'']

mixArrs.reverse() // ["", true, undefined, 3, null]

10数组中的所有值求和

let  array = [1, 2, 3, 4, 5]

eval(array.join("+")) ; //
array.reduce((x, y) => x + y); //

11使用固定值填充数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];

fruits.fill("Runoob"); //Runoob,Runoob,Runoob,Runoob

let newArr =  new Array(6).fill('2'); // ["2", "2", "2", "2", "2", "2"]

JavaScript 实用技巧的更多相关文章

  1. javascript实用技巧、javascript高级技巧

    字号+作者:H5之家 来源:H5之家 2016-10-31 11:00 我要评论( ) 三零网提供网络编程. JavaScript 的技术文章javascript实用技巧.javascript高级技巧 ...

  2. 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)

    [JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...

  3. JavaScript 实用技巧和写法建议

    1.前言 从大学到现在,接触前端已经有几年了,感想方面,就是对于程序员而言,想要提高自己的技术水平和编写易于阅读和维护的代码,我觉得不能每天都是平庸的写代码,更要去推敲,去摸索和优化代码,总结当中的技 ...

  4. javascript实用技巧,js小知识

    一.js整数的操作 使用|0和~~可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快,在处理像素及动画位移等效果的时候会很有用.性能比较见此. var foo = (1 ...

  5. JavaScript实用技巧总结

    前言 总结一下最近接触到的JavaScript语法糖,与大家共享. 每块糖都有详细的说明和示例,就不多说了. 准确的类型检查 /* * @function: * 类型检查示例 * 通过此方法,可以检查 ...

  6. Javascript实用技巧

    1. 给参数赋默认值 //通常写法 function dateRender(format){ if(format){ format = 'Y-m-d'; } // code } //强推 functi ...

  7. 41个Web开发者必须收藏的JavaScript实用技巧

    1. 将彻底屏蔽鼠标右键 oncontextmenu=”window.event.returnValue=false” < table border oncontextmenu=return(f ...

  8. 12个十分实用的JavaScript小技巧

    12个非常实用的JavaScript小技巧 在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候 ...

  9. 实用Javascript调试技巧

    摘要: 高效调试JS代码. 原文:实用Javascript调试技巧分享 作者:MudOnTire Fundebug经授权转载,版权归原作者所有. 见过太多同学调试Javascript只会用简单的con ...

随机推荐

  1. thinkphp 多条件模糊搜索结果,按照最佳匹配度排序,使用LOCATE函数

    //获取筛选参数 $params = Request()->only(['keywords','brand_id', 'cat_id']); $where = "brand_id = ...

  2. 【linux】【jenkins】自动化运维二 安装插件

    gitlab安装教程参考:https://www.cnblogs.com/jxd283465/p/11525629.html 1.Maven Integration Plugins Jenkins安装 ...

  3. Python集训营45天—Day07 (面向对象编程进阶)

    目录 1. @property装饰器 2. 魔法方法 3. 类属性和实例属性 4.静态方法和类方法 5. 单继承和多继承 6. 多态 7. del 方法 序言:上个章节我们了解了面向对象的基础知识,这 ...

  4. SpringBoot系列——ElasticSearch

    前言 本文记录安装配置ES环境,在SpringBoot项目中使用SpringData-ElasticSearch对ES进行增删改查通用操作 ElasticSearch官网:https://www.el ...

  5. vscode中如何自动保存

    是的,vscode是个不错的编辑器,它的扩展功能能支持很多的语言,然后在实践过程中,我们发现每写好一次就得手动按CTRL+S,未免有点手酸,这时候我们就可以开启我们的自动保存功能,方式也很简单,在 文 ...

  6. 每个人都要学的图片压缩终极奥义,有效解决 Android 程序 OOM

    # 由来 在我们编写 Android 程序的时候,几乎永远逃避不了图片压缩的难题.除了应用图标之外,我们所要显示的图片基本上只有两个来源: 来自网络下载 本地相册中加载 不管是网上下载下来的也好,还是 ...

  7. append追加的html片段,添加点击事件没有反应,解决!

    对于追加的元素来说,属于未来展现的内容,我们此时不能使用一般点击事情处理,需要用未来事件绑定. 例如:我点击车牌号显示车辆详情,如下绑定. //绑定未来元素 $("body").d ...

  8. Java 文章链接

    Java表单验证封装类 https://www.cnblogs.com/linjiqin/archive/2013/11/18/3429424.html 微信企业号接入JDK6和JDK7及JDK8加解 ...

  9. 漫谈 GOF 设计模式在 Spring 框架中的实现

    原文地址:梁桂钊的博客 博客地址:http://blog.720ui.com 欢迎关注公众号:「服务端思维」.一群同频者,一起成长,一起精进,打破认知的局限性. 漫谈 GOF 设计模式在 Spring ...

  10. 【Java】web实现图片在线预览

    一.场景还原 用户上传了一张图片,已有服务器保存路径,现由于系统配置无法直接通过图片URL打开预览图片,需实现点击预览将图片显示在浏览器上. 二.实现方法 html: <a href=" ...