zoukankan      html  css  js  c++  java
  • [javascript 实践篇]——那些你不知道的“奇淫巧技”

    1. 空(null, undefined)验证

    刚开始,我是比较蠢的验证(我还真是这样子验证的)

    if (variable1 !== null || variable1 !== undefined || variable1 !== '') { let variable2 = variable1; }

    大哥教会了我这样子验证,你会惊叹一下的

    let variable2 = variable1  || '';

    如果你不信,在谷歌浏览器开发者面板的控制台下试试!

    //值为null的例子
    let variable1 = null;
    let variable2 = variable1  || '';
    console.log(variable2);
    //输出: '' 
    //值为undefined的例子
    let variable1 = undefined;
    let variable2 = variable1  || '';
    console.log(variable2);
    //输出: '' 
    //正常情况
    let variable1 = 'hi there';
    let variable2 = variable1  || '';
    console.log(variable2);
    //输出: 'hi there'

    是不是很棒(可爱脸)

    2. 数组

    这个经常用到,像我这样子没毛病

    let a = ["myString1", "myString2", "myString3"];

    3. if true .. else 的优化

    其实就是用三元运算

    let big;
    if (x > 10) {
        big = true;
    }
    else {
        big = false;
    }

    可以变成这样子的啦

    let big = x > 10 ? true : false;

    是不是简洁了呢,三元运算可以在很多的地方用到,(vue 里面 判断组件的加载,,,是不是跑题了 )

    再来一个例子

    let big = (x > 10);
    let x = 3,
    big = (x > 10) ? "greater 10" : (x < 5) ? "less 5" : "between 5 and 10";
    console.log(big); //"less 5"
    let x = 20,
    big = {true: x>10, false : x< =10};
    console.log(big); //"Object {true=true, false=false}"

    4. 变量声明

    变量声明,这样子的 let x; let y;......

    不妨这样像我这样子,简单又明了

    let x, y, z=3;

    5. 赋值语句的简化

    刚开始是这样子的

    x=x+1;
    minusCount = minusCount - 1;
    y=y*10;

    摇身一变成

    x++;
    minusCount --;
    y*=10;

    6. 避免使用RegExp对象

    正则表达式,是不是要用到

    var re = new RegExp("d+(.)+d+","igm"),
    result = re.exec("padding 01234 text text 56789 padding");
    console.log(result); //"01234 text text 56789"

    简化一下

    var result = /d+(.)+d+/igm.exec("padding 01234 text text 56789 padding");
    console.log(result); //"01234 text text 56789"

    7. If 条件优化

    虽然很简单,但还是值得提一下。

    if (likeJavaScript)

    比起这样字的会不会好一点呢

    if (likeJavaScript === true)

    8.函数调用还可以更短

    function x() {console.log('x')};function y() {console.log('y')};
    let z = 3;
    if (z == 3) 
    {
        x();
    } else 
    {
        y();
    }

    其实就是函数自调拉

    function x() {console.log('x')};function y() {console.log('y')};let z = 3;
    (z==3?x:y)();

    9. 如何优雅的表示大数字

    在JavaScript中,有一个简写数字的方法,也许你忽略了。1e7表示10000000。

    简化前:

    for (let i = 0; i < 10000; i++) {

    le7...............................................................................................(调皮啊)

    for (let i = 0; i < 1e7; i++) {

    ************************************华丽的做一些补充(感谢评论区认真回答的童鞋们)**************************************************

    10.

    var s ="3"; //string
    var v = +s;
    console.log(v);//3
    console.log(typeof v)//number

    这里一定要注意数据的类型哦。

    11.获取时间戳

    获取当前时间戳 

    方法一:new Date()-0;
    方法二:+ new Date() ;

    12.清空数组

    var list = [1, 2, 3, 4];list.length=0;

    13.随机获取整数

    例:10以内的随机数 可能的总数就是10个数,最小数就是1
    Math.floor(Math.random()*10+1)

    14.空字符串、空数组都等于false

    console.log(""==false)
    输出true
    console.log([]==false)
    输出true

     就如我们@until-u童鞋所说:控制台输入 console,看看有哪些你不知道的函数

    真是amazing啊!

     

    再次感谢评论区的可爱的童鞋们。

    你有什么奇淫巧技,不如分享出来,让我们amazing一下吧!

    你说四不四奇淫巧技嘛?

    尊重我们的原文作者咔

    版权声明:
    转载时请注明作者Fundebug以及本文地址:
    https://blog.fundebug.com/2017/07/06/12-tricks-that-js-rocks/

    原文: 12 Amazing JavaScript Shorthand Techniques

    译者: Fundebug

     
  • 相关阅读:
    [原创]基于asp.ent MVC的无刷新文件上传组件
    ATL 开发 Com 学习笔记
    杀毒软件—美杜杉(medusa)使用观后感1
    IIS gzip压缩
    常用网页播放器代码
    [转]安装AspNetMVC1RC2出错
    Asp.net 异步请求 IHttpAsyncHandler
    发几个小的测式软件
    [转]关于document.cookie的使用
    boost Serialization
  • 原文地址:https://www.cnblogs.com/ifannie/p/7145804.html
Copyright © 2011-2022 走看看