8个强大的JavaScript技巧

news/2024/7/19 15:31:52 标签: 字符串, javascript, js, 正则表达式

1.全部替换

我们知道string.replace()函数只能替换第一次出现的情况。你可以在正则表达式的末尾添加/g来替换所有出现的内容。

javascript">let example = "potato potato";
console.log(example.replace(/pot/, "tom")); 
// "tomato potato"
console.log(example.replace(/pot/g, "tom")); 
// "tomato tomato"

2.提取唯一值

我们可以仅仅通过Set对象和Spread运算符就可以创建一个唯一值的数组。

javascript">let entries = [1, 2, 2, 3, 4, 5, 6, 6, 7, 7, 8, 4, 2, 1]
let unique_entries = [...new Set(entries)];
console.log(unique_entries);
// [1, 2, 3, 4, 5, 6, 7, 8]

3.数字转字符串

我们只需要使用带空引号集的串联运算符即可。

javascript">let converted_number = 5 + "";
console.log(converted_number);
// 5
console.log(typeof converted_number); 
// string

4.字符串转数字

我们只需要+运算符。

请注意这点,因为它仅适用于“字符串数字”。

javascript">the_string = "123";
console.log(+the_string);
// 123

the_string = "hello";
console.log(+the_string);
// NaN

5.打乱数组元素

javascript">let 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运算符。

javascript">var entries = [1, [2, 5], [6, 7], 9];
var flat_entries = [].concat(...entries); 
// [1, 2, 5, 6, 7, 9]

准确来说,所谓的多维数组针对二位数组有效!

7.动态属性名

javascript">const dynamic = 'flavour';
var item = {
    name: 'Coke',
    [dynamic]: 'Cherry'
}
console.log(item); 
// { name: "Coke", flavour: "Cherry" }

8.使用长度调整/清空数组

我们基本上重写了数组的长度。

如果我们想调整数组:

javascript">let entries = [1, 2, 3, 4, 5, 6, 7];  
console.log(entries.length); 
// 7  
entries.length = 4;  
console.log(entries.length); 
// 4  
console.log(entries); 
// [1, 2, 3, 4]

如果你想清空数组:

javascript">let entries = [1, 2, 3, 4, 5, 6, 7]; 
console.log(entries.length); 
// 7  
entries.length = 0;   
console.log(entries.length); 
// 0 
console.log(entries); 
// []

http://www.niftyadmin.cn/n/658359.html

相关文章

正则基础

正则表达式,又称规则表达式。(在代码中常简写为regex、regexp或RE),计算机科学的一个概念。正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。 特殊字符: $匹配输入字符串的结尾位置。要匹配 $ 字符本身&…

BZOJ2754: [SCOI2012]喵星球上的点名(AC自动机/后缀自动机)

Description a180285幸运地被选做了地球到喵星球的留学生。他发现喵星人在上课前的点名现象非常有趣。 假设课堂上有N个喵星人,每个喵星人的名字由姓和名构成。喵星球上的老师会选择M个串来点名,每次读出一个串的时候,如果这个串是一个喵星…

HTML、HTTP、Web综合面试题(五)

1.display: none; 与 visibility: hidden;的区别 display:none ;会让元素完全从渲染树中消失,渲染的时候不占据任何空间;visibility: hidden ;不会让元素从渲染树消失,渲染师元素继续占据空间,只是内 容不可⻅display: none ;是⾮…

domino5.07移植(from win2000 to win2003)

昨天将公司的lotus domino5.07从win2000移植到win2003,没发现问题。但还需要进一步测试才行。 移植步骤: 1、在一台服务器上安装2003操作系统, 2、安装lotus domino5.07 &#xff13…

flash上加htm链接的技巧

flash不能直接加htm链接或者javascript事件。所以说在一个flash动画添加链接一般都是将链接直接做到flash中去。但是有的时候我们的链接都是活的。而且希望这个flash具有通用的用途。这时候如果将链接做死到flash中,对于重用这个flash就带来了很多不便。后来发现&am…

18、数码管显示实验

18、数码管显示实验 1.数码管介绍 2.数码管模块电路 3.编写数码管显示程序 1.数码管介绍 数码管是一种半导体发光器件,其基本单元是发光二极管。数码管也 称为LED数码管,是由多个发光二极管封装在一起组成“8”字型的器件 ,引线已在内部连接完…

不要鄙视菜鸟

菜鸟是初学者,菜鸟的水平一般比大虾肯定不能,但是任何一个大虾都是从菜鸟慢慢成长起来的,没有人会一下子从鸟卵变成大虾的。所以我们不要歧视菜鸟,既然大虾与菜鸟的水平有差距,我们就不要拿大虾的标准来要求菜鸟。菜鸟…

对人工智能的认识

对人工智能的认识 人工智能是计算机科学的一个研究分支,不过,这个分支下面又包含很多的研究方向,这个分支提出的时间很早,中间也热闹过几次,自从2012年以来又热闹了,所以看了一点综述文章对此进行简单的记录…