重学JavaScript【Global和Math】

138 阅读3分钟

重学JavaScript 篇的目的是回顾基础,方便学习框架和源码的时候可以快速定位知识点,查漏补缺,所有文章都同步在 公众号(道道里的前端栈)github 上。

GlobalMath 是ECMAScript的两个单例内置对象,我们可以在开发中直接使用这两个内置对象。

Global

在全局作用域中定义的变量和函数都会变成 Global 对象的属性,除了常用的 isNaN()isFinite()parseInt()parseFloat() 等,还有另外一些特殊的方法。

  1. URL编码

    encodeURI()encodeURIComponent() 方法用于编码统一资源标识符(URI),用法如下:

    let uri = "http://www.baidu.com/image a.js#start?param=1";
    
    console.log(encodeURI(uri));
    // http://www.baidu.com/image%20a.js#start?param=1
    
    console.log(encodeURIComponent(uri));
    // http://www.baidu.com%2Fimage%20a.js%23start%3Fparam%3D1
    

    从上可以看出来,encodeURI 不会编码属于URL组件的特殊字符,比如:冒号、斜杠、问号、井号,而encodeURIConponent会编码所有非标准字符。

    一般来说,使用 encodeURIComponent() 应该比使用 encodeURI() 的频率高,因为编码查询字符串参数比编码基准URI的次数多

    有编码就有解码,decodeURI() 用来解码 encodeURI() 编码过的字符,decodeURIComponent() 用来解码 encodeURIComponent() 编码过的字符。

    以上四个方法取代了 escape() 和 unescape(),这两个方法已经被弃用

  2. eval()

    该方法应该是整个ECMAScript中最强大的了,它接收一个参数,会将参数解释为实际的ECMAScript语句,然后插入到该位置上,变量定义,方法声明,都可以在里面,同时它也是特别危险的,特别是在解释用户输入内容时,该方法会造成XSS攻击!所以尽量不要使用它。

  3. window对象

    在浏览器中,window对象 就是 Global对象的代理,因此所有全局作用域中声明的变量和函数都变成了 iwndow 的属性,在浏览器控制台输入 window,会看到很多属性。一般我们自定义的全局方法有的也会绑定在 window 上。

Math

Math对象 被用来操作数学公式和计算,也是特别常用的方法。

  1. 属性

    下面是Math对象内置的对象属性:

    属性说明
    Math.E自然对数的基数e的值
    Math.LN22为底的自然对数
    Math.LN1010为底的自然对数
    Math.LOG2E以2为底e的对数
    Math.LOG10E以10为底e的对数
    Math.PIπ的值
    Math.SQRT1_21/2的平方根
    Math.SQRT22的平方根
  2. min()、max() min() 可以找出一组数值中的最小值,max() 可以找出最大值:

    Math.max(1, 2, 100, 60);
    // 100
    
    Math.min(1, 2, 100, 60);
    // 1
    

    如果想找到数组中的最大值,可以使用扩展运算符:

    Math.max(...[1, 2, 100, 60])
    // 100
    
    Math.min(...[1, 2, 100, 60])
    // 1
    
  3. 舍入

    舍入方法包括以下四个:

    • Math.ceil() 向上舍入

      Math.ceil(25.9); // 26
      Math.ceil(25.1); // 26
      
    • Math.floor() 向下舍入

      Math.floor(25.9) // 25
      Math.floor(25.1) // 25
      
    • Math.round() 四舍五入

      Math.round(25.9) // 26
      Math.round(25.1) // 25
      
    • Math.fround() 返回数值最接近的单精度(32位)浮点值

      Math.fround(25.9) // 25.899999618530273
      
  4. 随机数

    Math.random() 返回一个0~1范围内的随机数,并且不包含0和1,利用随机原理我们可以创建随机的ID(数字和字符),比如:

    Math.random().toString(16).substring(2) // 14位
    Math.random().toString(32).substring(2) // 11位
    

    也可以从一个数组中获取随机元素:

    let arr = [1, 2, 5, 100, "abc", 6];
    let index = Math.floor((Math.random() * arr.length));
    console.log(arr[index])
    

Math对象中常用的方法就是上面的4类,如果涉及到跟过的数学公式,可以 点击这里 查看。

我的公众号:道道里的前端栈,每一天一篇前端文章,嚼碎的感觉真奇妙~