ES6 基础知识
let:用来定义变量
特点:只能在代码块里面使用,let拥有块级作用域;并且let不允许重复声明; 比如:
var a = 12;
var a = 5;
alert(a); //5;
let a = 12;
let a = 5;
alert(a); //报错;Identifier 'a' has already been declared
代码块:{}包
起来的代码,形成了一个作用域,比如if,for,while,json除外;块级作用域; var 只有函数作用域;
用处: 自执行函数:
for(let i = 0; i < aBtn.length; i++){
aBtn[i].onclick = function{
alert(i); //0,1,2
}
}
*** 块级作用域其实就是匿名函数自执行;
const:一般用来定义常量
常量:不允许修改;有些时候定的变量不希望被改变,这个不希望被改变的值就是常量;比如:
let a = 5;
a = 12;
alert(a); //12;
其实希望a的值是5,但是下面有相同的变量名字覆盖了let a的值;这个时候就要用到const;
const一旦被赋值,以后再也无法修改,比如:
const a = 12;
a = 5;
alert(a); //Assignment to constant variable.
const必须给初始值,比如:
const a;
a = 12;
alert(a); //Missing initializer in const
declaration; 正确的写法:
const a = 12;
因为const定义的变量以后再也没法赋值了;
const不能重复声明,比如:
const a = 12;
const a = 5;
alert(a); //Identifier 'a' has already been declared;
用途:防止意外修改变量;
关于字符串连接
之前定义字符串: var str = '';或者 var str = ""; ES6定义字符串:
var str1 = 'elcome';
var str2 = 'w';
ES6连接字符串:${变量名}
var str3 = '${str2}${str1}'; //输出:welcome;
解构赋值
ES6之前:
var a = 12;
var b = 5;
var c = 10;
alert(a); //
ES6:
var [a,b,c] = [12,5,10]; //数组的形式定义;
alert(a); //访问某一项
console.log(a); //打印出全部的值;
var {a,b,c} = {
a: 12,
b: 5,
c: 10
}; //json的形式定义;跟顺序无关;
alert(a); //访问某一项;
console.log(a,b,c); //打印出全部的值;
使用ES6定义的时候注意模式匹配:
模式匹配:左边的样子和右边的一样;
var [a,[b,c],d] = [1,[3,4],5];
console.log(a,b,c,d);
解构赋值默认值的写法:
var {time=12,id=321} = {};
console.log(time,id);//这里的time和id都是默认值;
因为等号右边没有赋值;所以需要给默认值,如果不给默认值的的话是undefined;
Array.from:复制一个数组
var arr = [1,2,3,4];
var arr2 = Array.from(arr);
arr2.pop; //删除arr2 中的某一项不会影响到arr;
console.log(arr,arr2);
快速复制一个数组: ···
实例1:
var arr = [1,2,3,4];
var arr2 = [...arr1]; //引用arr1里面的内容;
arr2.pop;
console.log(arr2);
实例2:
function show(...args){
console.log(args); //1,2,3,4;这里的值也就是arguments的每一个;
args.push(5); //往arguments里面添加一个;
console.log(args);//往arguments里面添加一个5,这在ES6之前是不允许的;
}
show(1,2,3,4);
新增循环 for of
for of 用来遍历(迭代/循环)整个对象;表现类似于for in;
var arr = ['banana','pear','orange','apple'];
for(var i in arr){ //i是索引;
console.log(i); //0,1,2,3,索引;
}
for(var i of arr){ //i是值;
console.log(i); //banana,pear,orange,apple;
}
for of 循环不能用来循环json,可以循环数组,for of的真正目的是为了循环map对象;实例如下:
var json = { 'a':'12', 'b':'11', 'c':'10', };
for(var name of json){
console.log(name); //json[Symbol.iterator] is not a function(…)
}
for of 也可以循环数组: 只循环值:
for(var name of arr){
console.log (name)
};
只循环索引:
for(var name of arr.keys){
console.log(name)
};
索引和值都循环:
for(var name of arr.entries){
console.log(name)
};
Map对象
和json相似,也是键值对的形式 key-value;Map对象主要是为了和for of循环配合而生。 怎么得到一个Map对象:
var oMap = new Map;
设置:
oMap.set (name,value);
oMap.set(name,value); //给Map对象设置值;
oMap.set ('a','banana');
oMap.set('b','pear');
console.log(oMap); //{"a" => "banana", "b" => "pear"}
获取:
oMap.get(name);
oMap.get ('a'); //banana;
删除:
oMap.delete(name);
oMap.delete('a');
循环Map用 for of:
var oMap = new Map;
oMap.set('a','banana');
oMap.set ('b','pear');
oMap.set('c','orange');
oMap.set('d','apple');
for(var name of oMap){ ==>此种写法的本质就是循环了oMap.entries;
console.log (name);//结果中不仅有name,还有value; a,banana b,pear,c,orange d,apple
}
==>此种写法等价于:
for(var name in oMap.entries){
console.log(name);
}
//以key-value的形式取值:
for(var [key,value] of oMap){
console.log(key+':'+vlaue); //a:banana b:pear c:orange d:apple
}
只循环key
for(var key of oMap.keys){
console.log(key); //a,b,c,d
}
只循环value
for(var val of oMap.values){
console.log (val); //banana,pear,orange,apple
}
箭头函数
ES6之前:
function show(a, b, c){
return a + b + c
}
ES6:
=> 注意: 箭头函数里面的this指的是window; 在箭头函数中arguments不能使用了;
ES6:给默认值
var move==>{
console.log(obj); //undefined;
//因为obj未传参;有些时候不希望有undefined;这个时候需要给一个默认值;
}
move;
var move=(obj='参数必须传递') => {
console.log(obj); //参数必须传递;
}
ES6 基础知识的更多相关文章
- ES6基础知识(Reflect)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- es6基础知识
1.超引用:(...) 用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中 function fun(...args){ console.log(args); //[1,2,3,4,5,6] ar ...
- ES6 基础知识-----简记 let const
ES5中只有函数作用域和全局作用域,声明变量使用var,在es6中添加声明变量 let const let 声明块级作用域变量, let 不存在变量提升 var命令会发生”变量提升“现象,即变量可以在 ...
- ES6基础知识(Map用法)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- es6基础知识总结(附加)
附加: 字符串扩展: 1. includes(str) : 判断是否包含指定的字符串2. startsWith(str) : 判断是否以指定字符串开头3. endsWith(str) : 判断是否以指 ...
- vue初体验-ES6 基础知识补充 let 和const
本人水平有限,如内容有误,欢迎指正,谢谢. let : 主要特点: 1.作用域只局限于当前代码块.2.使用let 声明的变量作用域不会被提升.3.在相同的作用域下不能声明相同的变量.4.for循环体 ...
- ES6基础知识汇总
1.如何理解ECMAScript6? ECMAScript是什么,ECMASCript的作用 2.新增let关键字 let的用途 3.关键字const const作用,传址赋值 4.解构赋值 解构赋值 ...
- ES6基础知识(async 函数)
1.async 函数是什么?一句话,它就是 Generator 函数的语法糖. const fs = require('fs'); const readFile = function (fileNam ...
- ES6基础知识(Generator 函数应用)
1.Ajax 是典型的异步操作,通过 Generator 函数部署 Ajax 操作,可以用同步的方式表达 function* main() { var result = yield request(& ...
随机推荐
- ca 自签名证书 并实现HAProxy https功能
mkdir /etc/ssl/xip.io [root@ha02 haproxy-]# openssl genrsa - Generating RSA bit long modulus ....... ...
- curl命令行使用
curl 命令使用 原文地址:http://blog.sina.com.cn/s/blog_4b9eab320100slyw.html 可以看作命令行浏览器 1.开启gzip请求curl -I h ...
- 【Exception—WebForm】当应用程序不是以 UserInteractive 模式运行时显示模式对话框或窗体是无效操作。请指定 ServiceNotification 或 DefaultDesktopOnly 样式,以显示服务应用程序发出的通知。
最近做的项目现在发布到服务器上开始测试了,本地好好的程序,到服务器上却报异常了: 当应用程序不是以 UserInteractive 模式运行时显示模式对话框或窗体是无效操作.请指定 ServiceNo ...
- Spring--通过注解来配置bean【转】
Spring通过注解配置bean 基于注解配置bean 基于注解来配置bean的属性在classpath中扫描组件 组件扫描(component scanning):Spring能够从classpat ...
- markdown 常用语法 (在macdown内使用正常)
顺便附上 MacDown的官网,我觉得MacDown挺好用的,推荐给大家! #一级标题 ##二级标题 ###三级标题 ####四级标题 #####五级标题 ######六级标题 *** ###使用分割 ...
- 弹性盒子布局flexbox
弹性盒子display:flexbox一般应用于父元素的容器上,然后对子元素来进行弹性布局 设置了flexbox的父元素不能设置具体的宽度与高度的值,而是通过子元素来设置值,父元素弹性的包裹既可 相关 ...
- [转] 前端中的MVC
MVC是一种设计模式,它将应用划分为3个部分:数据(模型).展现层(视图)和用户交互(控制器).其中: M - MODEL(模型) V - VIEW(视图) C - CONTROLLER(控制器) 一 ...
- CentOS6.7安装Python3.4
1.下载Python3.4安装包 wget https://www.python.org/ftp/python/3.4.4/Python-3.4.4.tgz 2.解压.编译.安装 .tgz cd Py ...
- Hello cnblog!
Test Markdown #!/usr/env/python # coding: utf-8 # 这是一个测试文件 print "hahah" def t(): print &q ...
- GridView,Repeater增加自动序号列
有三种实现的方式, 第一种方式,直接在Aspx页面GridView模板列中.这种的缺点是到第二页分页时又重新开始了. <Columns> <asp:TemplateField Hea ...