美文网首页
9 个强大的 JavaScript 小技巧

9 个强大的 JavaScript 小技巧

作者: Axtlive | 来源:发表于2019-12-12 11:14 被阅读0次

    以下是 9 个功能强大的 JavaScript hack 技巧。

    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"
    
    1. 提取唯一值

    通过使用 Set 对象和展开运算符,我们可以创建一个具有唯一值的新数组。

    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]
    
    1. 将数字转换为字符串

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

    var changeNumberToString = 5 + "";
    console.log(changeNumberToString);
    // 5
    console.log(typeof changeNumberToString); 
    // string
    
    1. 将字符串转换为数字

    我们需要的只是 + 运算符, 请注意它仅适用于“字符串数字”。

    the_string = "123";
    console.log(+the_string);
    // 123
    
    the_string = "hello";
    console.log(+the_string);
    // NaN
    
    1. 随机排列数组中的元素
    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]
    
    1. 展平多维数组

    使用展开运算符

    var entries = [1, [2, 5], [6, 7], 9];
    var flat_entries = [].concat(...entries); 
    // [1, 2, 5, 6, 7, 9]
    
    1. 缩短条件语句

    条件语句如下:

    if (OK) {next()};
    

    通过简单地使用变量和函数来缩短它:

    OK && next();
    
    1. 动态属性名

    我一直以为必须先声明一个对象,然后才能分配动态属性。

    var dynamic = 'look';
    var item = {
        name: 'axtlive',
        [dynamic]: 'cool'
    }
    console.log(item); 
    // { name: "axtlive", axtlive: "cool" }
    
    1. 使用 length 调整/清空数组

    如果我们要调整数组的大小:

    var 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]
    

    如果我们要清空数组:

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

    相关文章

      网友评论

          本文标题:9 个强大的 JavaScript 小技巧

          本文链接:https://www.haomeiwen.com/subject/jlwzgctx.html