惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

G
Google Developers Blog
Spread Privacy
Spread Privacy
V
Visual Studio Blog
爱范儿
爱范儿
Apple Machine Learning Research
Apple Machine Learning Research
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
GbyAI
GbyAI
Google DeepMind News
Google DeepMind News
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
V
V2EX
J
Java Code Geeks
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Blog — PlanetScale
Blog — PlanetScale
N
Netflix TechBlog - Medium
B
Blog RSS Feed
博客园 - 【当耐特】
有赞技术团队
有赞技术团队
The Register - Security
The Register - Security
Latest news
Latest news
The Cloudflare Blog
Project Zero
Project Zero
月光博客
月光博客
U
Unit 42
Vercel News
Vercel News
Attack and Defense Labs
Attack and Defense Labs
Know Your Adversary
Know Your Adversary
V
Vulnerabilities – Threatpost
F
Full Disclosure
Schneier on Security
Schneier on Security
Google Online Security Blog
Google Online Security Blog
MyScale Blog
MyScale Blog
L
Lohrmann on Cybersecurity
C
CERT Recently Published Vulnerability Notes
博客园 - 叶小钗
腾讯CDC
博客园 - 三生石上(FineUI控件)
T
The Blog of Author Tim Ferriss
D
Darknet – Hacking Tools, Hacker News & Cyber Security
博客园 - Franky
S
Security Affairs
Hacker News: Ask HN
Hacker News: Ask HN
Security Latest
Security Latest
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
MongoDB | Blog
MongoDB | Blog
D
DataBreaches.Net
SecWiki News
SecWiki News
Recorded Future
Recorded Future
NISL@THU
NISL@THU
Hacker News - Newest:
Hacker News - Newest: "LLM"
Cloudbric
Cloudbric

博客园 - 敏捷的水

程序员成长思维:把自己当做产品来发展 发展你的兴趣,而不是跟随你的兴趣 领导力:不要做个“好人” 当你是个锤子 做自己的CEO 我们为何难以升职加薪 程序员的自我修养系列(四):图形化表达 - 敏捷的水 - 博客园 程序员的自我修养系列(三):习惯付费 程序员的自我修养系列(二):从元编程到元认知 程序员的自我修养系列(一):聊聊专业和业余 如何向别人介绍我是一个程序员 领域驱动开发实践之路:我们是如何从领域驱动开发当中获益的 ES6+ 现在就用系列(二):let 命令 程序员之网络安全系列(六):动态密码 程序员之网络安全系列(五):数字证书以及12306的证书问题 程序员之网络安全系列(四):数据加密之非对称秘钥 程序员之网络安全系列(三):数据加密之对称加密算法 程序员之网络安全系列(二):如何安全保存用户密码及哈希算法 程序员之网络安全系列(一):为什么要关注网络安全?
ES6+ 现在就用系列(一):为什么使用ES6+ - 敏捷的水 - 博客园
敏捷的水 · 2016-01-20 · via 博客园 - 敏捷的水

系列目录

ES6+ 现在就用系列(一):为什么使用ES6+
ES6+ 现在就用系列(二):let 命令
ES6+ 现在就用系列(三):const 命令
ES6+ 现在就用系列(四):箭头函数 =>
ES6+ 现在就用系列(五):模板字面量 (Template Literals)
ES6+ 现在就用系列(六):解构赋值 (Destructuring )
ES6+ 现在就用系列(七):Promise
ES6+ 现在就用系列(八):类 (Class),继承,对象的扩展
ES6+ 现在就用系列(九):模块
ES6+ 现在就用系列(十):Async 异步编程
ES6+ 现在就用系列(十一):ES7 Async in Browser Today

ES6+

现在主流的浏览器都是支持到ES5, 为了表述方便,我在此发明一个名词"ES6+" 就是ES5以后的版本,包括ES6, ES7. 为什么说现在就用,虽然主流的浏览器只支持到ES5, 但是现在有很多的转换器,可以把一些ES6和ES7的代码转换为ES5的代码。这就意味着我们现在就可以使用这些新特性,然后使用转码器让代码可以运行在主流的浏览器上。

为什么立即开始使用ES6, ES7的新特性?

JavaScript语言的一些糟糕的实现

先不说JavaScript语言本身设计是否有问题,现有JavaScript语言的实现里有很多非常糟糕或者诡异的实现,就是你以为代码的结果是这样,但是他偏偏是那样,这给我们程序带了很多的意向不到的Bug和烦恼,如果你要是JavaScript大牛,你需要了解他内部的实现的Bug, 而且要知道哪些诡异的写法输出了什么诡异的结果,我个人对了解这种东西实在提不起太大的兴趣,因为我只想用“语言”来实现我的项目让人很好的使用我开发的软件,但是由于历史这样或那样的原因,导致JavaScript语言成为浏览器的霸主,我们不得不忍受这些糟糕的问题。下面我来展示一些让你觉得诡异的问题 (如果你不不觉得诡异,恭喜你,你已经是JavaScript的“高手”)

示例1:

(function() {
return NaN === NaN;
})();

输出: false

示例2:

(function() {
return (0.1 + 0.2 === 0.3);
})();

输出: false

示例3:

[5, 12, 9, 2, 18, 1, 25].sort();

输出: [1, 12, 18, 2, 25, 5, 9]

示例4:

var a = "1"
var b = 2
var c = a + b

输出:c = "12"

var a = "1"
var b = 2
var c = +a + b

输出:c = 3

示例5:

(function() {
return ['10','10','10','10'].map(parseInt);
})();

输出: [10, NaN, 2, 3]

示例6:

(function() {
return 9999999999999999;
})();

输出: 10000000000000000

示例7:

var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a1;
a2;
a3;

输出: 10,10,10

我是觉得如果按正常人的理解,代码不能得到想要的结果,那就算是语言本身的问题。如果一个程序执行的和人期望的不一样,或者还需要一些Hack的方法,那么是很糟糕的。

ES5 一些语言特性的缺失

由于上面的很多问题,所以ES 需要不断的改进, 当然新的版本肯定不可能一下子解决之前所有的问题。

已有JavaScript的问题这一块就不细说了,因为能来看这篇文章的人,应该对下面我列的几个突出的问题都有感受。

  • 没有块级作用域,这个导致上面示例7的问题
  • 全局变量的污染
  • 类的写法比较怪异
  • 没有模块管理
  • 异步调用写法容易产生 “回调地狱”

为什么可以立即使用?

因为现在很多转换器已经可以把ES6所有的特性以及ES7的部分特性转换为ES5,Babel就是一个非常好的转换器,所以我这里建议凡是能被Babel转换的新特性都可以立即在项目里适用。

ES6和ES7的一些新特性,可以大大提高项目的健壮性,同时让代码更易读,同时也可以避免很多ES5之前的很多诡异的东西。Gulp里可以很好的使用babel, 如果你对Gulp不熟悉,可以参考我博客里的Gulp系列。

这里简单说一Gulp和babel如何结合使用

$ npm install -g gulp-babel

var gulp=require('gulp'), babel=require('gulp-babel');

gulp.task('build',function(){
return gulp.src('src/app.js')
.pipe(babel())
.pipe(gulp.dest('build'))
})

后面的系列,我将以此介绍ES6, ES7的一些可以现在就用的主要特性。