【ES678点滴知识 】
文章平均质量分 81
barnett_y
成功道路并不拥挤,因为坚持的人不多。。。
展开
-
从ES6到ES10的新特性
介绍ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会)在标准ECMA-262中定义的脚本语言规范。这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,但实际上后两者是ECMA-262标准的实现和扩展。历史版本至发稿日为止有九个ECMA-262版本发表。其历史版本如下:1997年6月:第一版 1998年6月:修改格式,使其与ISO/IE...转载 2019-12-20 10:19:49 · 614 阅读 · 0 评论 -
promise原理就是这么简单
异步编程的几种形式:回调函数形式:function f1(callback){ callback();}function f2(callback){ callback();}function f3(callback){ callback();}f1(f2(f3))复制代码这种方式实现异步编程优点是思路清晰,以串行的思考方式进行编程,缺点是形成回调...转载 2018-10-25 11:03:35 · 25771 阅读 · 0 评论 -
手写一个符合规范的Promise
Promise是什么所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。 Promise是处理异步编码的一个解决方案,在Promise出现以前,异步代码的编写都是通过回调函数来处...转载 2018-10-23 14:21:17 · 470 阅读 · 2 评论 -
Promise 面试题
最近在复习 Promise 的知识,所以就做了一些题,这里挑出几道题,大家一起看看吧。题目一const promise = new Promise((resolve, reject) => { console.log(1); resolve(); console.log(2);})promise.then(() => { console....转载 2018-11-02 09:32:04 · 978 阅读 · 1 评论 -
ES6 系列之 defineProperty 与 proxy
前言我们或多或少都听过“数据绑定”这个词,“数据绑定”的关键在于监听数据的变化,可是对于这样一个对象:var obj = {value: 1},我们该怎么知道 obj 发生了改变呢?definePropetyES5 提供了 Object.defineProperty 方法,该方法可以在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回这个对象。语法Object.de...转载 2018-11-12 11:23:10 · 2638 阅读 · 1 评论 -
ECMAScript 2017(ES8)特性概述
ECMAScript 2017(ES8)特性概述 整理自 ES8 was Released and here are its Main New Features,归纳于笔者的现代 JavaScript 开发:语法基础与实践技巧系列文章中;也欢迎关注前端每周清单系列获得一手资讯。ECMAScript 2017(ES8)FeaturesECMAScript 2017 或 ES8转载 2017-08-11 17:34:01 · 800 阅读 · 0 评论 -
ES6 系列之模块加载方案
前言本篇我们重点介绍以下四种模块加载规范: AMD CMD CommonJS ES6 模块 最后再延伸讲下 Babel 的编译和 webpack 的打包原理。require.js在了解 AMD 规范之前,我们先来看看 require.js 的使用方式。项目目录为:* project/ * index.html * ven...转载 2018-11-14 14:49:57 · 794 阅读 · 0 评论 -
ES6 系列之 Babel 是如何编译 Class
前言在了解 Babel 是如何编译 class 前,我们先看看 ES6 的 class 和 ES5 的构造函数是如何对应的。毕竟,ES6 的 class 可以看作一个语法糖,它的绝大部分功能,ES5 都可以做到,新的 class 写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。constructorES6 中:class Person { construct...转载 2018-11-21 14:26:00 · 808 阅读 · 0 评论 -
ES6 之 Proxy 介绍
Proxy(代理) 是 ES6 中新增的一个特性。Proxy 让我们能够以简洁易懂的方式控制外部对对象的访问。其功能非常类似于设计模式中的代理模式。使用 Proxy 的好处是:对象只需关注于核心逻辑,一些非核心的逻辑(如:读取或设置对象的某些属性前记录日志;设置对象的某些属性值前,需要验证;某些属性的访问控制等)可以让 Proxy 来做。从而达到关注点分离,降级对象复杂度的目的。使用方法...原创 2018-11-19 10:49:17 · 15073 阅读 · 1 评论 -
ES6 系列之模块加载方案
前言本篇我们重点介绍以下四种模块加载规范: AMD CMD CommonJS ES6 模块 最后再延伸讲下 Babel 的编译和 webpack 的打包原理。require.js在了解 AMD 规范之前,我们先来看看 require.js 的使用方式。项目目录为:*project/*index.html*ven...原创 2018-11-20 09:20:40 · 1061 阅读 · 0 评论 -
ES6中的super 关键字
●【第56期】常见react面试题●前端指南2018年末推送计划●【第54期】vue常见面试题●【第52期】js实现最简单的解析器:如何解析一个ip地址●【第47期】以面试官的角度来看 React 工作面试●【第48期】教你手把手搭建起自己的脚手架 super 这个关键字,既可以当作函数使用,也可以当作对象使用。在这两种情况下,它的用法完全不同。第一种情况...转载 2018-11-20 09:22:00 · 271 阅读 · 0 评论 -
异步解决方案----Promise与Await
前言异步编程模式在前端开发过程中,显得越来越重要。从最开始的XHR到封装后的Ajax都在试图解决异步编程过程中的问题。随着ES6新标准的到来,处理异步数据流又有了新的方案。我们都知道,在传统的ajax请求中,当异步请求之间的数据存在依赖关系的时候,就可能产生很难看的多层回调,俗称'回调地狱'(callback hell),这却让人望而生畏,Promise的出现让我们告别回调函数,写出更优雅的异...转载 2018-10-15 15:50:46 · 260 阅读 · 0 评论 -
ES6由一道前端阿里面试题的思考
题目const timeout = ms => new Promise((resolve, reject) => { setTimeout(() => { resolve(); }, ms); });const ajax1 = () => timeout(2000).then(() =...转载 2018-10-16 09:29:06 · 280 阅读 · 0 评论 -
ES7介绍
前言本篇文章主要介绍ES7+ES8的一些新功能,并结合ES6的一些API做出了相应的比较。ES71.Array.prototype.includes()includes()作用,是查找一个值在不在数组里,若是存在则返回true,不存在返回false.1.基本用法:['a', 'b', 'c'].includes('a') // true['a', 'b', ...原创 2018-08-13 09:34:11 · 2392 阅读 · 0 评论 -
Es6笔记
前言笔记仅记录了相比于第一次学习,重新理解的知识点完整内容详见:《ECMAScript 6 入门》 阮一峰总结经历两个星期结合ES6的React实践,决定再回头看一遍阮一峰的ES6教程,发现收获多多,常看常新。第一遍看时,比较敷衍,没有实践自然也理解不深,综合来说,阮一峰的教程更适合查漏补缺,而不是作为入门教材。索引解构赋值的用途尾调用优化扩展运算符的用途数组的原创 2017-09-08 23:07:36 · 771 阅读 · 0 评论 -
ES7+ES8
撰文为何身为一个前端开发者,ECMAScript(以下简称ES)早已广泛应用在我们的工作当中。了解ECMA机构流程的人应该知道,标准委员会会在每年的6月份正式发布一次规范的修订,而这次的发布也将作为当年的正式版本。以后的改动,都会基于上一版本进行修改。所以,我们这次就基于ES6的版本对ES7、ES8版本的新增以及修改内容,做一次简要的总结,方便我们快速开发。ES7新特性ES转载 2017-10-20 10:23:07 · 2447 阅读 · 1 评论 -
es6的常用语法和优越性
1.前言前几天,用es6的语法重写了我的一个代码库,说是重写,其实改动的并不多,工作量不大。在重写完了的时候,就个人总结了一下es6常用的一些常用的语法和比es5优越的方面。下面提到的语法可能也就是es6新特性的10%-20%,但是开发上占了80%左右的。下面的文章,按照es6常用新特性进行分类,文章提及的实例,有些是我代码库的小实例,有些是自己随便编的,大家知道就好!希望可以帮到大家,如果大转载 2017-11-14 10:48:28 · 818 阅读 · 1 评论 -
Async Functions (异步函数)
转载http://www.css88.com/archives/7731本章介绍 Brian Terlson 提议的 ECMAScript 2017 新特性 Async Functions(异步函数) 。概述async(异步) 函数变体以下是已经存在的异步函数变体。请注意无处不在的 async 关键字。异步函数声明: async function转载 2017-11-05 21:15:40 · 4323 阅读 · 1 评论 -
ES7与ES8特性
我曾写过一篇关于ES6博客《10个最佳ES6特性》,这次我打算聊聊ES7和ES8特性。ES7只有2个特性:includes()指数操作符ES8尚未发布(2017年1月),下面是它已经完成起草的一些特性:Object.values()Object.entries()padStart()padEnd()Object.getOwnPropertyDescriptors()函数参数转载 2017-12-17 09:49:06 · 17545 阅读 · 1 评论 -
ES6的7个实用技巧
Hack #1 交换元素利用数组解构来实现值的互换let a = 'world', b = 'hello'[a, b] = [b, a]console.log(a) // -> helloconsole.log(b) // -> worldHack #2 调试我们经常使用console.log()来进行调试,试试console.table()也无妨。const a =转载 2018-01-22 10:22:08 · 403 阅读 · 0 评论 -
ES6小技巧
接来写几个我平时在项目使用的最常用的几个优化的方法~1- 数组去重 var arr = [1,2,3,4,3,4]; var arr2 = [...new Set(arr)];12这个时候arr2就是去重后的数组~2- 交换两个变量的值 let [x,y] = [1,2]; [y,x] = [x,y]; console.log(y);1233- 获取字符串中的...原创 2018-05-10 10:36:54 · 717 阅读 · 2 评论 -
async函数原理及使用方法
async 函数是什么?一句话,它就是 Generator 函数的语法糖,async 函数的实现原理,就是将 Generator 函数和自动执行器,包装在一个函数里。1,Generator 函数const fs = require('fs');const readFile = function (fileName) { return new Promise(function (resolv...转载 2018-06-04 18:12:12 · 3482 阅读 · 0 评论 -
ES6小知识
1.let 和 const 命令在es5时,只有两种变量声明,var 和function。在es6中新增了四种let和const,以及另外两种声明import和class。 我们先讲解let和const,后续会补充import和class(1)let我们先来看基本语法{ let a = 10; var b = 1;}b // 1a // ReferenceError: ...原创 2018-08-12 15:58:22 · 305 阅读 · 0 评论 -
ES9 新特性
前言该篇文章主要是介绍了ES9新加的一些特性。1. 异步迭代在async/await的某些时刻,你可能尝试在同步循环中调用异步函数。例如:async function process(array) { for (let i of array) { await doSomething(i); }}复制代码复制代码这段代码不会正常运行,下面这段同样也不会:...原创 2018-08-13 09:33:11 · 3610 阅读 · 0 评论 -
ES6 完全使用手册
前言这里的 "ES6" 泛指 ES5 之后的新语法 这里的 "完全" 是指本文会不断更新 这里的 "使用" 是指本文会展示很多 ES6 的使用场景 这里的 "手册" 是指你可以参照本文将项目更多的重构为 ES6 语法此外还要注意这里不一定就是正式进入规范的语法。1. let 和 const在我们开发的时候,可能认为应该默认使用 let 而不是 var,这种情况下,对于需要写保护...转载 2018-11-29 10:43:05 · 424 阅读 · 0 评论 -
初探 Vue3.0 中的一大亮点——Proxy !
前言 不久前,也就是11月14日-16日于多伦多举办的 VueConf TO 2018 大会上,尤雨溪发表了名为 Vue3.0 Updates 的主题演讲,对 Vue3.0 的更新计划、方向进行了详细阐述(感兴趣的小伙伴可以看看完整的 PPT),表示已经放弃使用了 Object.defineProperty,而选择了使用更快的原生 Proxy !!这将会消除了之前 Vu...转载 2018-12-07 10:29:18 · 1889 阅读 · 0 评论 -
ES6、ES7、ES8、ES9、ES10新特性一览
ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言。目前JavaScript使用的ECMAScript版本为ECMA-417。关于ECMA的最新资讯可以浏览 ECMA news查看。ECMA规范最终由TC39敲定。TC39由包括浏览器厂商在内的各方组成,他们开会推动JavaScript提案沿着一条严格的发展道路前进。 从提案到入选ECMA规范主要有以下几个阶段...转载 2019-04-02 22:09:07 · 1909 阅读 · 0 评论 -
JS异步编程之Generator
前言ES6 中提出一个叫生成器(Generator)的概念,执行生成器函数,会返回迭代器对象(Iterator),这个迭代器对象可以遍历函数内部的每一个状态。function* helloWorldGenerator() { yield 'hello'; yield 'world'; return 'ending';}// 通过执行生成器返回迭代器对象var hell...原创 2019-04-16 11:36:19 · 666 阅读 · 0 评论 -
ES6常用知识点总结
这片文章主要是基于阮一峰老师的ECMAScript 6 入门。在看了阮一峰老师的这ES6入门之后,自己做了一下总结,将一些觉得对自己目前有用的东西整理出来方便日后再来巩固复习。总觉得看别人的东西当时懂了过了一段时间就忘记了,所以我总是会将别人的东西验证一遍,这样对知识的理解是能提升一个层次的。1、ECMAScript和JavaScript的关系以及ES6的含义? 2、let和const...转载 2019-04-15 09:30:17 · 1186 阅读 · 0 评论 -
手撕遵循 Promise/A+ 规范的 Promise
相比于回调函数,Promise 解决了 “回调地狱” 和 “信任问题” 等痛点,并且大大提高了代码的可读性。在现代前端开发中,Promise 几乎成了处理异步的首选(虽然还有更方便的 async/await,逃)。这篇文章从 Promise 的思想和运行机制入手,深入理解每个 API,最后手写一个遵循 Promise/A+ 规范的 Promise 来。异步方式JavaScript 异步...转载 2019-04-18 22:27:54 · 1006 阅读 · 0 评论 -
深入实践 ES6 Proxy & Reflect
前言今日早读文章由携程机票研发部前端工程师@Sky.Gu授权分享。正文从这开始~~引言Vue中的数据绑定Vue作为前端框架的三驾马车之一,在众多前端项目中具有极其重要的作用。Vue中具有一个重要的功能点——“数据绑定”。使用者无需关心数据是如何绑定到dom上面,只需要关注数据本身即可。那实现其功能的原理是什么?阅读官方文档(v2.0),我们会发现:把一个普通 ...转载 2019-04-19 09:19:19 · 276 阅读 · 0 评论 -
从头手写一个Promise
前言在javascript的世界中,所有代码都是单线程执行的。由于这个“缺陷”,导致JavaScript的所有网络操作,浏览器事件,都必须是异步执行。 最开始我们可以用回调函数来解决这个问题,function callBack(){console.log('回调')}setTimeout(callBack, 1000)// 回调复制代码但是随着业务的不断深入,难免会像陷入回...转载 2019-05-14 13:55:45 · 391 阅读 · 0 评论 -
Proxy 对象
Proxy 意为"代理器",用于修改目标对象的成员之前进行"拦截",外界对该对象的成员的访问,都必须先通过这层拦截。其中,成员包括未定义的,即访问或设置不存在的属性,也会触发相应的代理函数。初步认识创建通过构造函数可以创建 Proxy 对象(new Proxy()),需要依次传入两个参数:被代理的目标对象。可以是任意类型的对象,包括数组、函数等,甚至是另一个 Proxy 对象...转载 2019-05-26 20:16:20 · 1832 阅读 · 0 评论 -
async/await 中的 try/catch
async/await 中的try/catches6中的async是异步编程的终极解决方案,近期学习了一下,相对于 generator 来说,具有更好的特性:内置执行器、更好的语义、更好的适用性,需要注意一点的是 await 后面是promise 对象或者原始类型的值。更有意思的是可以使用 try/catch 来捕获异步中出现的异常async/await中的 try/catch//...原创 2019-06-27 14:16:20 · 19205 阅读 · 0 评论 -
async await promise try...catch
简单介绍下这几个的关系为方便起见 用以下代码为例简单介绍下这几个东西的关系,async function buildData(name) { try { let response1 = await axios.get('/api/user?name=' + name); let userInfo = response1.data; ...原创 2019-06-27 14:20:49 · 4253 阅读 · 0 评论 -
ES6查漏补缺扫清知识盲区-笔记
let和var区别for (let i = 0; i < 2; i++) { setTimeout(() => { console.log(i) })} // 1, 2两者的区别for (var i = 0; i < 2; i++) { setTimeout(() => { console.log(i)...转载 2019-07-10 10:38:11 · 290 阅读 · 0 评论 -
ES6 系列之 defineProperty 与 proxy
前言我们或多或少都听过“数据绑定”这个词,“数据绑定”的关键在于监听数据的变化,可是对于这样一个对象: varobj={value:1},我们该怎么知道 obj发生了改变呢?definePropetyES5提供了 Object.defineProperty 方法,该方法可以在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回这个对象。语法Object.definePr...转载 2019-04-06 10:23:39 · 253 阅读 · 0 评论 -
ES6 系列之 defineProperty 与 proxy
前言我们或多或少都听过“数据绑定”这个词,“数据绑定”的关键在于监听数据的变化,可是对于这样一个对象: varobj={value:1},我们该怎么知道 obj发生了改变呢?definePropetyES5提供了 Object.defineProperty 方法,该方法可以在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回这个对象。语法Object.definePr...转载 2019-03-19 09:27:38 · 375 阅读 · 0 评论 -
理解ES6 proxy&reflection
简介 proxy proxy可以拦截目标(target)上的对象进行操作,使用trap拦截这些操作,trap是响应特定操作的方法。 reflection reflection是通过Reflect对象表示,他提供了一些方法集,为代理proxy提供默认行为。 下面是一些proxy trap和Reflect方法,每个proxy trap都有提供对应的Reflect方法,他们接...转载 2018-12-05 09:37:50 · 293 阅读 · 0 评论 -
深入理解ES6 class
原文es6 classclass基本声明在说class之前,想必大家肯定会想到constructor function. 看下面代码:function Foo(name) { this.name = name}class Bar { constructor(name){ this.name = name }}f = new Foo('xhs')b = n...原创 2018-12-05 09:37:41 · 404 阅读 · 0 评论