1,let const学习补充
1.1,let的知识点:
01-作用域只限制在当前代码块内,代码块形式如下:
{ var str = '张三'; console.log(str); let str1 = '李四'; console.log(str1); }
02-使用let声明的变量作用于不会被提升
{ console.log(str); var str =132; //undefined console.log(kkk); let k=123; //报错 }
03-在相同的作用域下不能申明相同的变量(var 声明的相同变量名的话,后来的会覆盖前面的)
{ var str1 = '张三'; var str1 = '李四'; console.log(str1); //李四 let str2 = '王五'; let str2 = '赵六'; console.log(str2); //错误 }
04-for循环体现let的父子作用域
var btns = document.querySelectorAll('button'); for(var i=0; i<btns.length; i++){ btns[i].onclick = function () { alert('点击了第' + i + '个按钮'); } } var btns = document.querySelectorAll('button'); for(var i=0; i<btns.length; i++){ (function (i) { btns[i].onclick = function () { alert('点击了第' + i + '个按钮'); } })(i); } let btns = document.querySelectorAll('button'); for(let i=0; i<btns.length; i++){ btns[i].onclick = function () { alert('点击了第' + i + '个按钮'); } }
1.2,const的知识点:
01-只在当前的代码块中有效
{ const a = 'zhangsan'; const a = 'lisi'; console.log(a); }
02-作用域不会被提升
03-不能重复申明
04-不能被修改(基本数据类型)
05-申明的常量必须赋值
{ const name; name = 'zhangsan'; console.log(name); //报错 }
2,解构赋值
01-基本用法(多个变量声明赋值)
let [name, age, sex] =['李四', 20, '女']; name = 'hhh'; console.log(name); //hhh console.log(age); //20 console.log(sex); //女
02-对象的解构赋值(类型上面的数组形式赋值)
let {name, age, sex} = {name: '张三', age: 55, sex: '男'};
console.log(name); //张三
console.log(age); //55
console.log(sex); //男
03-数组的解构赋值
//03-数组的解构赋值 let [name, age, sex] =['李四', 20, '女']; let [arr1, [arr2, arr3, [arr4, arr5]]] = [1, [2, 3, [4, 5]]]; console.log(arr1, arr2, arr3, arr4, arr5); //1 2 3 4 5
let [a,,c] = [1, 2, 3];
console.log(a); //1
console.log(c); //3
let [a,c] = [1, 2, 3];
console.log(a); //1
console.log(c); //2
04-基本类型的解构赋值
let [a, b, c, d, e] = '我是中国人'; console.log(a); //我 console.log(b); //是 console.log(c); //中 console.log(d); //国 console.log(e); //人
1,es6 对象里面属性的 键值对 传值,不用像es5 key:value这样子写。代码如下
**对象的扩展
let name = '张三'; let age = 18; let person = { name, age }
2,Symbol 在对象里面的用法 for---of 的隐藏性 对属性有保护作用。代码如下
ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现 有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol
的原因。(摘自:ECMAScript 6 入门)
//3,Symbol对象元素属性的保护作用 let obj1={name:'jspang',skill:'web'}; let age=Symbol(); obj1[age]=18; for (let item in obj1){ console.log(obj1[item]); } //这里不输出18 console.log(obj1[age]);//18
3,set() 数组形式的数据结构 数组的这节学习Set数据结构,注意这里不是数据类型,而是数据结构。它是ES6中新的东西,并且很有用处。Set的数据结构是以数组的形式构建的。
WeakSet() 类似数组的对象 WeakSet 的成员只能是对象,而不能是其他类型的值
3,Proxy Proxy 可以理解成预编译,在目标对象之前架设一层“拦截”,外界对该对象的访问
**有get set 两种方法 (apply)
4,promise Promise 解决回调地狱问题 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大
有完成和未完成两种情况
**resolve(val); 完成情况下 返回一个值
**reject(val); 未完成情况下返回一个值
** 返回的值在 then(function(val) {}) 中 使用
new Promise(step1).then(function(val){ console.log(val); return new Promise(step2); }).then(function(val){ console.log(val); return new Promise(step3); }).then(function(val){
console.log(val); return val; });
5,cllass类定义
* 1, constructor(brand,name) 类的实例对象的传参
* 2,name() 类的方法
*3,class Lexus extends Car 类的继承
4,static info() 类中的静态方法 只由类本身才能使用
类的实例对象不能引用
6,模块化
* 类引入:import Player from './Player';
* 类输出:export default Player;
方法:export { add, minus };
import {add, minus} from './math';
学到一点再一点点补全吧!没错我是懒人,哈哈哈
最后送上:阮一峰大神的《
ECMAScript 6 入门
》的链接