ES6-个人学习大纲
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]);//
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 入门
》的链接
ES6-个人学习大纲的更多相关文章
- 大数据Python学习大纲
最近公司在写一个课程<大数据运维实训课>,分为4个部分,linux实训课.Python开发.hadoop基础知识和项目实战.这门课程主要针对刚从学校毕业的学生去应聘时不会像一个小白菜一样被 ...
- Linux 系统从入门到精通的学习大纲;
以前没有接触过Linux,生产环境需要,有时候遇到问题,百度一下,问题解决了,在遇到问题,在百度,有时候问题是如何解决的,为什么会解决有点丈二的和尚摸不着头脑, 为此,想用一段时间,系统的学习下Lin ...
- 《Java开发学习大纲文档》V7.0
<Java开发学习大纲文档>V7.0简介: 本文档是根据企业开发所需要掌握的知识点大纲进行总结汇编,是Java开发工程师必备知识体系,系统化学习针对性非常强,逻辑分析能力非常清晰;技术方面 ...
- Objective-C代码学习大纲(6)
2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...
- Objective-C代码学习大纲(5)
2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...
- Objective-C代码学习大纲(4)
2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...
- Objective-C代码学习大纲(3)
Objective-C代码学习大纲(3) 2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍 ...
- Objective-C代码学习大纲(2)
2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...
- Objective-C代码学习大纲(1)
2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...
- Java并发编程(一)学习大纲
(一)学习大纲 (二)线程与并发编程的概念 (三)线程安全.原子操作.复合操作.竞态条件.加锁机制(内置锁.重入) (四)对象的共享:可见性.失效数据.非原子的64位操作,加锁与可见性,volatil ...
随机推荐
- Moment.js简单使用
1.设置语言环境,如设置中文环境: moment.locale("zh-cn"); 2.当前时间.指定时间: // 假设当前时间为:2018年12月10日 moment(); // ...
- referrer policy
我们知道,在页面引入图片.JS 等资源,或者从一个页面跳到另一个页面,都会产生新的 HTTP 请求,浏览器一般都会给这些请求头加上表示来源的 Referrer 字段.Referrer 在分析用户来源时 ...
- [JLOI2014]松鼠的新家-树链剖分
最开始的时候我在写线段树部分的时候还打了一个build,后来一想,打个球球大作战的build啊!!!有个锤子的用啊!!! #include<bits/stdc++.h> using nam ...
- loongson 2f 和u-boot中的cache命令对照
00000 Index Invalidate INDEX_INVALIDATE_I (I) 00001 Index WriteBack Invalidate INDEX_WRITEBACK_INV_D ...
- kafka Network
Kafka network Processor SocketServer.Processor override def run() { startupComplete() try { while (i ...
- javascript中new Date()存在的兼容性问题
问题:通过new Date()创建的时间对象在Chrome能正常工作,但在IE浏览器却显示NaN 代码: var time = new Date(date + ' 00:00:00'); //NaN ...
- C程序设计实验报告
试验项目:1.字符与ASCLL码 2.运算符与表达式的运用 3.顺序结构应用程序 4.数学函数的算法描述 5.鸡兔同笼的算法描述 6.确定坐标的算法描述 姓名:郭薪 实验地点:514实验室 试 ...
- linux常用命令及使用技巧(二)
ls显示指定工作目录下的内容,同windows中的dir命令 pwd命令显示当前工作目录 date命令,显示或修改系统时间与日期 passwd命令,设置用户密码 su命令改变用户身份 clear命令, ...
- eclipse集成testng插件
一.TestNG简介 TestNG是一个开源自动化测试框架,它受到JUnit和NUnit的启发,而引入了许多新的创新功能,如依赖测试,分组概念,使测试更强大,更容易做到. 它旨在涵盖所有类别的测试:单 ...
- Centos安装Nginx(转载)
一.概述 项目总使用到Nginx的代理转发,学习和整理内容如下,由于是整理所以参考博客大牛的内容,有很多雷同之处,还望见谅(非抄袭对待) 二.Nginx依赖包的安装 yum install gcc y ...