【译】9个强大的JavaScript技巧
时间:2022-07-26
本文章向大家介绍【译】9个强大的JavaScript技巧,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
我喜欢优化!
但是,如果站点无法在用户的Internet Explorer 11
浏览器中运行,他们不会在乎我的优化代码。
我使用Endtest来创建自动测试,并在跨浏览器的云上执行它们。
Netflix使用相同的工具来测试他们的web apps
。
你应该查看文档
下面是9个极其强大的JavaScript
技巧。
1.全部替换
我们知道string.replace()
函数只能替换第一次出现的情况。你可以在正则表达式的末尾添加/g
来替换所有出现的内容。
var example = "potato potato";
console.log(example.replace(/pot/, "tom"));
// "tomato potato"
console.log(example.replace(/pot/g, "tom"));
// "tomato tomato"
2.提取唯一值
我们可以仅仅通过Set
对象和Spread
运算符就可以创建一个唯一值的数组。
var entries = [1, 2, 2, 3, 4, 5, 6, 6, 7, 7, 8, 4, 2, 1]
var unique_entries = [...new Set(entries)];
console.log(unique_entries);
// [1, 2, 3, 4, 5, 6, 7, 8]
3.数字转字符串
我们只需要使用带空引号集的串联运算符即可。
var converted_number = 5 + "";
console.log(converted_number);
// 5
console.log(typeof converted_number);
// string
4.字符串转数字
我们只需要+
运算符。
请注意这点,因为它仅适用于“字符串数字”。
the_string = "123";
console.log(+the_string);
// 123
the_string = "hello";
console.log(+the_string);
// NaN
5.打乱数组元素
每天我都像喝大了~
var my_list = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(my_list.sort(function() {
return Math.random() - 0.5
}));
// [4, 8, 2, 9, 1, 3, 6, 5, 7]
复制代码
6.碾平多维数组
很简单,使用Spread
运算符。
var entries = [1, [2, 5], [6, 7], 9];
var flat_entries = [].concat(...entries);
// [1, 2, 5, 6, 7, 9]
准确来说,所谓的多维数组针对二位数组有效!(译者加)
7.短路条件
我们以下面为例子:
if (available) {
addToCart();
}
通过简单地使用变量和函数来缩短它:
available && addToCart()
8.动态属性名
我一直以为我必须先声明一个对象,然后才能分配动态属性。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 不可错过的电商系统干货
- TypeScript 类型系统
- 图解 Java 线程生命周期
- sql 基础命令
- python自学成才之路 列表,元组,集合详细用法
- 备战秋招-面经篇-[二十一]
- 高性能 Java 应用层网关设计实践
- redis实战第十五篇 redis cluster的批处理中ask重定向解决方案
- 干货 | Elasticsearch 运维实战常用命令清单
- 备战秋招-面经篇-[二十二]
- 快速上手Spring-Data-Redis
- Lua 5.1 参考手册
- 图文详解k8s自动化持续集成之GitLab CI/CD
- Harbor v2.0 镜像回收那些事
- redis实战第十四篇 redis cluster ask重定向