zoukankan      html  css  js  c++  java
  • ES8新特性

    ES8已经正式发布了,其新特性有:字符串填充、异步函数与共享内存与原子操作等。本文对着三个特性进行深入的解析。当然还有其他的一些特性。

    1.字符串填充

             ES8中为字符串添加了新的内置函数padStart()、padEnd(),主要用于固定字符串的长度并且用指定的字符进行填充,以padStart为例,其例子如下:

    1 var sourceStr="example",
    2       targetLen=5,
    3       padStr="foobar";
    4       sourceStr.padStart(targetLen,padStr)//如果原字符长度大于targetLen,则返回原字符;
    5       targetLen=10,
    6       sourceStr.padStart(targetLen,padStr)//"fooexample";如果没有padStr,则用""填充

    其作用与npm包left-pad相似,left-pad实现与调用方式如下:

     1 //实现方式
     2 'use strict';
     3 
     4 module.exports = function (str, len, ch) {
     5   str = str + '';
     6   len = len - str.length;
     7   if (len <= 0) return str;
     8 
     9   if (!ch && ch !== 0) ch = ' ';
    10   ch = ch + '';
    11 
    12   while (len--) {
    13     str = ch + str;
    14   }
    15 
    16   return str;
    17 }
    18 //调用方式
    19 const leftPad = require('left-pad')
    20 leftPad(1, 2, '0')//"01"

    与padStart不同的是其padStart只能为单个字符。padStart、padEnd的出现为格式化日期带来了便利,再也不用判断d<10。

    2. 异步函数

            Javascript中按顺序执行异步逻辑的时候,常常会把后续的逻辑过程封装在回调函数中作为起始函数的参数,逐层嵌套。其中的后续逻辑就是称之为的“回调”。

    最常见的一个回调就是ajax拉取数据口进行的其他操作,如下:

     1 // 获取产品数据
     2 ajax('products.json', (products) => {
     3     console.log('AJAX/products >>>', JSON.parse(products));
     4     // 获取用户数据
     5     ajax('users.json', (users) => {
     6         console.log('AJAX/users >>>', JSON.parse(users));
     7         // 获取评论数据
     8         ajax('products.json', (comments) => {
     9             console.log('AJAX/comments >>>', JSON.parse(comments));
    10         });
    11     });
    12 });

    ES8将async/await合法话,可以使用async/await来定义和执行异步函数。解决了传统实现方式的callback hell。

     1 // 封装 Ajax,返回一个 Promise
     2 function requestP(url) {
     3     return new Promise(function(resolve, reject) {
     4         ajax(url, (response) => {
     5             resolve(JSON.parse(response));
     6         });
     7     });
     8 }
     9 (async() => {
    10     // 获取产品数据
    11     let data = await requestP('products.json');
    12     // 获取用户数据
    13     let users = await requestP('users.json');
    14     // 获取评论数据
    15     let products = await requestP('comments.json');
    16     console.log('ES7 Async/products >>>', products);
    17     console.log('ES7 Async/users >>>', users);
    18     console.log('ES7 Async/comments >>>', comments);
    19 }());

    3. 共享内存与原子操作

            共享内存允许多个线程并发的读写数据,如果不加以控制的话会出现运行结果的错误,而原子操作能够进行并发控制,确保各个线程可以按照预定的顺序执行。

    备注:本文章中有些示例来自网上,如有侵权,请联系我,我将进行删除O(∩_∩)O~

  • 相关阅读:
    [置顶] 内外网同时访问,我的拿来主义
    Nginx防攻击工具教程一 ngx_http_limit_conn_module
    晒晒我的厨艺修炼成果
    在 javascript 中,为什么 [1,2] + [3,4] 不等于 [1,2,3,4]?
    无法解析的外部符号__imp__AlphaBlend@44的解决
    Win32 API实现CDC类的FillSolidRect接口
    pugixml库学习之添加节点
    cleanup failed because the file not under version control问题的解决
    JavaScript 的 typeof 的用途
    支持在Win7和XP系统上创建环境变量的批处理文件
  • 原文地址:https://www.cnblogs.com/zsblogs/p/7225796.html
Copyright © 2011-2022 走看看