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 ...
随机推荐
- Centos7 设置redis开机自启
Centos7 设置redis开机自启 标签(空格分隔):Linux 环境 Centos7.1 redis-3.0.6 chkconfig方式 **service和chkconfig命令的功能好像都被 ...
- GS-PON数据库分区列范围查询优化案例
查询慢的SQL: with p as( select np.nodecode , np.nodename, d.deviceid, d.devicename, d.loopaddress, p.res ...
- C++ 变量判定的螺旋法则
C++ 中一个标识符配合着各种修饰界定符,使得标识符的本意不那么直观一眼就能看出,甚至需要仔细分析,才能知道该标识符的具体你含义. 比如: void (*signal(int, void (*fp)( ...
- AppScan工具使用-实战一
本文首发于简书https://www.jianshu.com/p/639cf894838e 工具已经安装完成,废话不多说,直接拿手上的项目使用一下. 1.打开工具,点击文件-新建 2.打开新建扫描 3 ...
- Android Studio [登陆界面]
EdittextActivity.class package com.xdw.a122; import android.support.v7.app.AppCompatActivity; import ...
- Spring boot 梳理 - SpringBoot中注入ApplicationContext对象的三种方式
直接注入(Autowired) @Configuration public class OAConfig { @Autowired private ApplicationContext applica ...
- Apache和Tomcat 配置负载均衡(mod-proxy方式)-无session共享、无粘性session
转:https://blog.csdn.net/wangjunjun2008/article/details/38268483 mod-proxy方式实现负载均衡是利用了Apache 2.x版本自带的 ...
- 基于elasticsearch的自定义业务告警的设计思路
A系统与B系统之间有很多接口交互,但是有一段时间接口经常报错,作为开发如果不能第一时间知道问题且及时解决的话就会收到业务投诉,当月绩效凉凉. 如果你也有这种场景,那么你就需要一个及时告警的功能. 实现 ...
- 07-简单认识margin
margin 外边距,表示边框到最近盒子的距离. 对于左右两边 <!DOCTYPE html> <html lang="en"> <head> ...
- Java 学习笔记之 Suspend和Resume
Suspend和Resume: Suspend和Resume使用方法: 以下例子证明了线程确实被暂停了,而且还可以恢复成运行状态. public class SuspendResumeThread e ...