ECMAScript6入门简介篇

ECMAScript 6
ECMAScript 6（简称ES6）是于2015年6月正式发布的JavaScript语言的标准，正式名为ECMAScript 2015（ES2015）。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言.
另外，一些情况下ES6也泛指ES2015及之后的新增特性，虽然之后的版本应当称为ES7、ES8等.
ECMAScript 和 JavaScript的关系
要讲清楚这个问题，需要回顾历史。1996 年 11 月，JavaScript 的创造者 Netscape 公司，决定将 JavaScript 提交给标准化组织 ECMA，希望这种语言能够成为国际标准。次年，ECMA 发布 262 号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为 ECMAScript，这个版本就是 1.0 版。
该标准从一开始就是针对 JavaScript 语言制定的，但是之所以不叫 JavaScript，有两个原因。一是商标，Java 是 Sun 公司的商标，根据授权协议，只有 Netscape 公司可以合法地使用 JavaScript 这个名字，且 JavaScript 本身也已经被 Netscape 公司注册为商标。二是想体现这门语言的制定者是 ECMA，不是 Netscape，这样有利于保证这门语言的开放性和中立性。
因此，ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 JScript 和 ActionScript）。日常场合，这两个词是可以互换的。
ES6的兼容性问题
IE10+，chrome，Firefox，移动端，nodesjs现在都支持
兼容低版本的浏览器
支持在线转换（这种编译会加大页面渲染的时间）
支持提前编译（强烈建议这种方式，不影响浏览器渲染的时间）
使用babel工具
使用npm进行安装，npm时随同nodejs一起安装的包的管理工具，也就是需要先安装node
我们可以来安装一下

我们创建一个普通的项目
进入项目目录安装babel

npm install babel-cli -g

安装完之后会生成相对应的文件
Babel -V 查看babel的环境
因为我在安装nodejs的时候采用的全局安装，
在命令行中使用 npm config ls查到npm的默认安装目录，
即prefix=C:\Users\xxxx\AppData\Roaming\npm,
然后进入这个目录使用npm install –-save-dev babel-cli安装babel，然后就成功了。。
注意AppData是个隐藏文件夹

然后再当前项目下输入npm init -y 或者是 npm init

这是后说明我们的babel环境搭建好了

可以直接再黑窗口运行这个js文件

使用这个echo .>.babelrc生成一个.Babelrc的文件

然后打开它在里面输入
{
//设置转码规则
“presets”: [“es2015”,“stage-2”],
“plugins”: [“transform-runtime”] //设置插件
}

然后我们安装需要的插件
npm install babel-core babel-preset-es2015 babel-plugin-transform-runtime babel-preset-stage-2 -save-dev

安装成功
我们把package.json中的错误改一下

这里就是指的将src目录下的文件转换编译成新文件到lib下面
那么我们去创建两个目录

，把index.js放到src下面，输入npm run build 运行，我们会看到自动编译的效果

转换的支持条件

let命令
接下来我们来学习一下ES6新增的命令 let
再学习let的时候，我们先来回复一下var的使用方法，这是我们再学习JavaScript的时候经常使用的声明变量用的

我们运行一下，再控制台看到输出
我们刷新一下也面会发现，这个时候输出的是40
再这边我们想说的是，再js中var这个使用的方式，可以重复的声明变量，和其他的编程语言来比较的话，我们发现这是不可以想象的，是不可思议的。并且使用var不可以限制变量，（也就是只有一种var的声明方式，没有常量的说法）

我们还可一看到，使用var没有办法区分使用区间

let命令接下来我们在写个例子来区分一下 let命令
这时候循行的控制台输出的都是4，说明这样写是由问题的，我们可以封装一个函数，来解决，但是代码就看上去比较怪异 let命令
这是后运行是不是就解决了刚才的问题，但是现在还是很麻烦的，而且代码不好理解，那么我们使用let就可以解决这样的问题

简单使用的方法
Const命令
const 声明一个只读变量，声明之后不允许改变。意味着，一旦声明必须初始化，否则会报错

注意要点：
const 如何做到变量在声明初始化之后不允许改变的？其实 const 其实保证的不是变量的值不变，而是保证变量指向的内存地址所保存的数据不允许改动。此时，你可能已经想到，简单类型和复合类型保存值的方式是不同的。是的，对于简单类型（数值 number、字符串 string 、布尔值 boolean）,值就保存在变量指向的那个内存地址，因此 const 声明的简单类型变量等同于常量。而复杂类型（对象 object，数组 array，函数 function），变量指向的内存地址其实是保存了一个指向实际数据的指针，所以 const 只能保证指针是固定的，至于指针指向的数据结构变不变就无法控制了，所以使用 const 声明复杂类型对象时要慎重。

ECMAScript6入门简介篇相关推荐

Fortran基础编程（入门简介篇）
以下内容转载本人公众号:易木木响叮当 Fortran是一门上世纪古老的科学计算语言,具有强大的计算能力,虽然没有现在的主流语言热门,但对于想从事有限元二次开发的童鞋来言,是一个不得不跨过去的槛儿,Fo ...
掌握 Ajax，第 1 部分: Ajax 入门简介
2019独角兽企业重金招聘Python工程师标准>>> 掌握 Ajax,第 1 部分: Ajax 入门简介理解 Ajax 及其工作原理,构建网站的一种有效方法 Ajax 由 HTM ...
Linux防火墙入门:简介(转)
Linux防火墙入门:简介(转) 前言一旦连上网络,就充满各种危机. 许多人基于各式各样的理由,想侵入你的系统,这种人俗称为 cracker.尤有甚者,近年来,cracker 圈里流行一种结合病毒行 ...
Android精通教程-Android入门简介
前言大家好,我是 Vic,今天给大家带来Android精通教程-Android入门简介的概述,希望你们喜欢每日一句 If life were predictable it would cease ...
Jacoco入门实战篇
Jacoco入门实战篇是什么能做什么怎么做深入浅出是什么简介 Jacoco是一款代码覆盖率的检测工具相关概念使用方式 ant maven java agent 使用模式 on-the- ...
Markdown入门简介
参考 http://sspai.com/25137 作者: Te_Lee 文章来源: 少数派 Markdown入门简介(使用工具Haroopad) 一.使用的工具----haroopad(http:/ ...
Asp.Net MVC2.0 Url 路由入门---实例篇
本篇主要讲述Routing组件的作用,以及举几个实例来学习Asp.Net MVC2.0 Url路由技术. 接着上一篇开始讲,我们在Global.asax中注册一条路由后,我们的请求是怎么转到相应的Vi ...
python 类-Python入门--一篇搞懂什么是类
原标题:Python入门--一篇搞懂什么是类写一篇Python类的入门文章,在高级编程语言中,明白类的概念和懂得如何运用是必不可少的.文章有点长,3000多字. Python是面向对象的高级编程语言 ...
Redis入门第二篇【存储数据结构之string类型】
tags: Redis title: Redis入门第二篇[存储数据结构之string类型] Redis存储的数据结构 Redis支持的数据结构有好几种: It supports data struc ...

ECMAScript6入门简介篇

ECMAScript6入门简介篇相关推荐

最新文章

热门文章