#第一节
初始化项目
npm init -y
安装babel-cli
npm install -g babel-cli
npm install --save-dev babel-preset-es2015 babel-cli
根目录新建.babelrc文件
写入一下内容
{
"presets": [
"es2015"
],
"plugins": [
 
]
}
转化es6
babel src/index.js -o dist/index.js
自动转
babel src/index.js -w -o dist/index.js
为了方便我们可以配置package.json
如下:
"scripts": {
 
"dev":"babel src/index.js -o dist/index.js",//不自动生成
"deva":"babel src/index.js -w -o dist/index.js"//自动生成
},
·
然后输入npm run build就可以
编译api
npm install --save babel-polyfill
然后引入
<script type="text/javascript" src="node_modules\babel-polyfill\dist\polyfill.min.js"></script>
#第二节
let 局部声明变量
var 全局声明
const常量声明值不能改变
#第三节
解构赋值
let [a,b,c]=[0,1,2];
console.log(a,b,c);
先赋值解构
let foo;
({foo}={foo:'111'})
#第四节
对象扩展运算符
...
let arr1=['www','aaa','bbbb'];
let arr2=[...arr1];
console.log(arr2);
arr2.push('qqqq');
console.log(arr1);
#第五节
字符串模版
let isp="222";
let aa=`<b>frssd</b>fg<br />dsagdf${isp}`
document.write(aa)
#第六节
#第七节
es6中的数组
Array.from(xxx)json数组转数组
Array.of转换字符串为数组
数组的json格式
let json={
'0':'jsp',
'1':'222',
'2':'edwwa',
length:3
}
find()查找
查找出大于5的
let aa=[1,2,3,4,5,6];
console.log(aa.find(function(value,index,aa){
return value>5
}))
#第八节
fill()//查找替换
for of循环
let arr=['jsp','qqq','eee'];
for(let [index,val] of arr.entries()){
console.log(index,val)
}
entries()实例可以实现不规则循环
#第九节
箭头函数
// function add(a,b){
// return a+b
// }
// console.log(add(1,2))
 
var add =(a,b=1) => a+b;
console.log(add(1));
#第十节

学习es6的更多相关文章

  1. 用vue.js学习es6(一):基本工具及配置

    一.工具: sublime,node.js,npm 1.安装sublime 的es6插件: (1).在sublime中按Ctrl+`调出console (2).粘贴以下代码到底部命令行并回车(subl ...

  2. 你是否也在学习ES6 Promise时遇到过这个问题?

    背景 周末闲来无事,随便翻看了一下阮一峰老师的<ES6 标准入门>第2版,ps:之前在阮一峰老师的官网看过电子版,感觉干货满满,所以就买了纸质版:当看到第16章第4节 'Promise.p ...

  3. 开始学习es6(一) 搭建个es6的开发环境

    1.开始学习es6 如果想在浏览器跑es6  需要给es6个环境 因为一直用vue-cli全家桶 这样虽然方便 但如果用es6需要跑起个vue全家桶 于是想到可以用gulp搭建个开发环境 首先需要1. ...

  4. 【系统学习ES6】新专题发布

    我要发免费专题了,向下看 公众号和博客都有一阵没更新了,丢了一些粉儿,但是也很庆幸,时时还会有人关注.我并不是什么专业讲师,文章都是利用业余时间手工原创.在这里非常感谢各位的支持和厚爱. 这个月开始, ...

  5. 【系统学习ES6】第一节:新的声明方式

    [系统学习ES6] 本专题旨在对ES6的常用技术点进行系统性梳理,帮助大家对其有更好的掌握.计划每周更新1-2篇,希望大家有所收获. 以前用ES5时,声明变量只能用var.ES6的出现,为我们带来了两 ...

  6. 【系统学习ES6】第二节:解构赋值

    [系统学习ES6] 本专题旨在对ES6的常用技术点进行系统性梳理,帮助大家对其有更好的掌握,希望大家有所收获. ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.解构是一种打 ...

  7. 在技术胖博客上学习ES6遇到的坑和想法

    第一节:ES6的开发环境搭建 坑1:全局安装babel-cli已经不被官方推荐,改为局部安装(cnpm install babel-cli --save-dev): 坑2:babel src/inde ...

  8. 用简单的方法学习ES6

    ES6 简要概览 这里是ES6 简要概览.本文大量参考了ES6特性代码仓库,请允许我感谢其作者@Luke Hoban的卓越贡献,也感谢@Axel Rauschmayer所作的[优秀书籍]//explo ...

  9. 用vue.js学习es6(六):Iterator和for...of循环

    一.Iterator (遍历器)的概念: 遍历器(Iterator)就是这样一种机制.它是一种接口,为各种不同的数据结构提供统一的访问机制.任何数据结构只 要部署Iterator接口,就可以完成遍历操 ...

  10. 用vue.js学习es6(五):set和map的使用

    一:Set用法: ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. (1).打印:console.log var data = new Set([1,2,3]); ...

随机推荐

  1. Tengine 如何查找 server 块

    概述 本文的目标读者是Tengine/Nginx 研发或者运维同学,如果自己对这块逻辑非常清楚,那可以略过,如果在配置或者开发 Tengine/Nginx 过程中,有如下疑问的同学,本文或许能解答你多 ...

  2. js的相关距离

    js的相关距离 一.dom对象的距离 ---dom.style.width : 对象本身的内容宽度(这里必须是内联样式中的width,带px)(content) ---dom.style.height ...

  3. E: 无法获得锁 /var/lib/apt/lists/lock - open (11: 资源暂时不可用) E: 无法对目录 /var/lib/apt/lists/ 加锁 问题解决方法

    使用Ubuntu16.04安装软件执行apt-get update时出现如下错误: E: 无法获得锁 /var/lib/apt/lists/lock - open (11: 资源暂时不可用) E: 无 ...

  4. Office2010 破解(Microsoft Toolkit 2.4.3.exe)

    这两天破解刚安装好的office2010,总是报错 刚才重新下载了Microsoft Toolkit 2.4.3.exe工具后,破解成功,操作如下: 选择office按钮后,如下操作,

  5. JAVA_环境配置

    1:系统环境 windows10 64位 jdk版本:jdk-8u131-windows-x64.exe,下载地址:http://www.oracle.com/technetwork/java/jav ...

  6. JDK、Eclipse、Tomcat、Maven、IDEA 常见问题

    windows操作分成了32位和64位的系统,不同的系统安装的软件也不一样. 查询电脑操作系统是多少位? J D K 01. 下载安装 02. 目录解释 03. 配置环境变量 (JDK安装成功后进行配 ...

  7. Acer笔记本蓝牙功能不可用

    在电脑运行过程中,本应该如下所存在的蓝牙图标不存在了: 打开设置,本应该可以选择开关的蓝牙开关按钮也不存在了: 电脑的蓝牙功能无法使用: 处理方法: 在C:\windows\sysytem32\文件夹 ...

  8. ongl与Struts标签

    一.ONGL OGNL 的全称是“Object-Graph Navigation Language”,即对象图导航语言,它是一种功能强大的开源表达式语言.使用这种表达式语言可以通过某种表达式语法存取  ...

  9. 两周的业余时间,写了个简单的shell

    Linux下的,环境是 Fedora 实现了基本的内部命令功能,及比较完善的内部命令框架. 类似于MFC消息映射表的方式,写完一个内部命令,只需要向这个头文件中,导入一个头文件,再写入命令处理函数,就 ...

  10. Mybatis逆向工程文件标签的详细介绍:

    ?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE generatorConfiguration PUB ...