JavaScript 实用技巧
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 实用技巧的更多相关文章
- javascript实用技巧、javascript高级技巧
字号+作者:H5之家 来源:H5之家 2016-10-31 11:00 我要评论( ) 三零网提供网络编程. JavaScript 的技术文章javascript实用技巧.javascript高级技巧 ...
- 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)
[JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...
- JavaScript 实用技巧和写法建议
1.前言 从大学到现在,接触前端已经有几年了,感想方面,就是对于程序员而言,想要提高自己的技术水平和编写易于阅读和维护的代码,我觉得不能每天都是平庸的写代码,更要去推敲,去摸索和优化代码,总结当中的技 ...
- javascript实用技巧,js小知识
一.js整数的操作 使用|0和~~可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快,在处理像素及动画位移等效果的时候会很有用.性能比较见此. var foo = (1 ...
- JavaScript实用技巧总结
前言 总结一下最近接触到的JavaScript语法糖,与大家共享. 每块糖都有详细的说明和示例,就不多说了. 准确的类型检查 /* * @function: * 类型检查示例 * 通过此方法,可以检查 ...
- Javascript实用技巧
1. 给参数赋默认值 //通常写法 function dateRender(format){ if(format){ format = 'Y-m-d'; } // code } //强推 functi ...
- 41个Web开发者必须收藏的JavaScript实用技巧
1. 将彻底屏蔽鼠标右键 oncontextmenu=”window.event.returnValue=false” < table border oncontextmenu=return(f ...
- 12个十分实用的JavaScript小技巧
12个非常实用的JavaScript小技巧 在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候 ...
- 实用Javascript调试技巧
摘要: 高效调试JS代码. 原文:实用Javascript调试技巧分享 作者:MudOnTire Fundebug经授权转载,版权归原作者所有. 见过太多同学调试Javascript只会用简单的con ...
随机推荐
- 构建企业级数据湖?Azure Data Lake Storage Gen2实战体验(中)
引言 相较传统的重量级OLAP数据仓库,“数据湖”以其数据体量大.综合成本低.支持非结构化数据.查询灵活多变等特点,受到越来越多企业的青睐,逐渐成为了现代数据平台的核心和架构范式. 因此数据湖相关服务 ...
- [Algorithm] 面试题之犄角旮旯 第贰章
闲下来后,需要讲最近涉及到的算法全部整理一下,有个indice,方便记忆宫殿的查找 MIT的算法课,地球上最好: Design and Analysis of Algorithms 本篇需要重新整理, ...
- 神奇的互换身体术--java的类型擦除
故事背景 <互换身体>是由环球影业发行的喜剧电影,于2011年8月5日在美国上映.该片由大卫·道金执导,瑞安·雷诺兹.杰森·贝特曼.奥利维亚·王尔德等主演.该片讲述了一位居家好男人和一位蜂 ...
- wepy框架开发小程序遇到的node-sass问题解决方案
一.报错图 二.解决方案 主要是windows平台缺少编译环境, 1.先运行: npm install -g node-gyp 2.然后运行cmd:(右键点击:以管理员身份运行) 输入:npm ins ...
- Java秒杀系统优化的工程要点
这篇博客是笔者学习慕课网若鱼老师的<Java秒杀系统方案优化 高性能高并发实战>课程的学习笔记.若鱼老师授课循循善诱,讲解由浅入深,欢迎大家支持. 本文记录课程中的注意点,方便以后code ...
- Scala Data Structure
Arrays Array 固定长度:ArrayBuffer 可变长度 arr.toBuffer, buf.toArray 初始化是不要使用 new 使用 () 访问元素 使用 for (elem &l ...
- poj-2232 New Stone-Forfex-Cloth Game 思维题
Acm is a clever boy, and he developed a new game form the old Stone-Forfex-Cloth game. In this game, ...
- java8 Stream使用总结
[前言] java8新特性 java8 函数接口 java8 Optional使用总结 Java 8 时间日期使用 java8 lambda表达式 1.流的介绍 Java8 中的 Stream 是对集 ...
- springboot 集成Redis一主二从三哨兵
1.Centos7 Redis一主二从三哨兵配置 Redis一主二从三哨兵环境搭建 2.接入过程 与集成redis单机不同的是jedis相关的配置做了修改,JedisPool换成了JedisSenti ...
- 深入了解String,StringBuffer和StringBuilder三个类的异同
Java提供了三个类,用于处理字符串,分别是String.StringBuffer和StringBuilder.其中StringBuilder是jdk1.5才引入的. 这三个类有什么区别呢?他们的使用 ...