声明变量     

let

不能重复声明

块级作用域

可修改let变量的值

const

不能重复声明

块级作用域

不能修改const 变量的值

2. 箭头函数

而箭头函数的this指向函数定义时所在的对象

3. 解构赋值

允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。比如:

let [a, b, c] = [1, 2, 3] // a=1, b=2, c=3
let [d, [e], f] = [1, [2], 3] // 嵌套数组解构 d=1, e=2, f=3
let [g, ...h] = [1, 2, 3] // 数组拆分 g=1, h=[2, 3]
let [i,,j] = [1, 2, 3] // 不连续解构 i=1, j=3
let [k,l] = [1, 2, 3] // 不完全解构 k=1, l=2

对象解构

let {a, b} = {a: 'aaaa', b: 'bbbb'} // a='aaaa' b='bbbb'
let obj = {d: 'aaaa', e: {f: 'bbbb'}}
let {d, e:{f}} = obj // 嵌套解构 d='aaaa' f='bbbb'
let g;
(g = {g: 'aaaa'}) // 以声明变量解构 g='aaaa'
let [h, i, j, k] = 'nice' // 字符串解构 h='n' i='i' j='c' k='e' 

变量赋值

const {userName11111, passwordqq} = {userName11111: 'aaaa', passwordqq: 123456}
console.log(userName11111)
console.log(passwordqq)
const [userName1, password1] = ['aaaaxxx', 12345611]
console.log(userName1)
console.log(password1)

5. 数组

s6对数组扩展了4个方法:map、reduce、filter、forEach。

map:原来数组有多少个,map 处理之后还是那么多个。参数:item,index,array

        let arr = [12, 35, 56, 79, 56];
        let arr1 = arr.map(item => item % 2 === 0 ? '偶' : '奇');
        let arr2 = arr.map((item, index) => index + ':' + item);
        console.log(arr);  // [ 12,     35,      56,    79,     56     ]
        console.log(arr1); // [ '偶',   '奇',    '偶',   '奇',   '偶'    ]
        console.log(arr2); // [ '0:12', '1:35', '2:56', '3:79', '4:56' ]
filter: 过滤掉不符合条件的。参数:item,index,array
  let arr = [12, 75, 56, 79, 56];
        let arr1 = arr.filter(item => item >= 60);
        console.log(arr);  // [ 12, 75, 56, 79, 56 ]
        console.log(arr1); // [ 75, 79 ]
forEach: 遍历。仅仅只是循环用,无返回值,也不会改变原数组。 参数:item,index,array
reduce: 汇总。下面代码中的 tmp 可以理解为前一个值
    let arr = [12, 35, 56, 79, 56];
        let avg = arr.reduce((tmp, item, index) => {
            tmp += item;
            if (index === arr.length - 1) tmp /= (index + 1);
            return tmp;
        })
        console.log(avg); // 47.6  也就是这五个数的平均值
(...),它可以将一个数组拆分为参数序列,也可以收集剩下的所有的参数或者数组元素 
扩展运算符(…)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中
        
// 将一个数组拆分为参数序列
        let arr = [1, 2]
        function add(a, b) {
            return a + b
        }
        add(...arr)
        console.log(add(...arr)) //3   
// 收集剩下的所有的参数
function f(a, ...arr) {
    console.log(...arr) // 2 3
}
f(1,2,3)

对象的扩展运算符 ...

对象的扩展运算符(...)可以把对象可枚举的属性拆分为键值对序列

用于对象拷贝

        let obj1 = { a: 1, b: 2 }
        let obj2 = { ...obj1 }
        console.log(obj2)   // {a:1,b:2}
用于合并对象
        let obj1 = { a: 1, b: 2 }
        let obj2 = { c: 3, d: 4 }
        let obj3 = { a: 100, ...obj1, ...obj2, e: 5, f: 6 }  // {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}
        let obj4 = { ...obj1, ...obj2, e: 5, f: 6, a: 100 } // {a: 100, b: 2, c: 3, d: 4, e: 5, f: 6}

(2) Object.assign

Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,拷贝(浅拷贝)到目标对象。

如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

        const target = { a: 1 };
const source1 = {a: 100, b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:100, b:2, c:3}

面向对象

ES6出来之后,官方提供了面向对象的写法。看代码吧

       class Person {
            constructor(name, age, address) {
                this.name = name;
                this.age = age;
                this.address = address;
            }
            introduce() {
                console.log(`大家好,我叫${this.name},今年${this.age}岁,家在${this.address}`);
            }
        }
        class Student extends Person {
            constructor(name, age, address, major) {
                super(name, age, address);
                this.major = major;
            }
            introduce() {
                console.log(`大家好,我叫${this.name},今年${this.age}岁,家在${this.address}, 专业是${this.major}`);
            }
        }
        let person = new Person('ethan', 24, '包邮区');
        person.introduce();  // 大家好,我叫ethan,今年24岁,家在包邮区
        let student = new Student('zyc', 18, '南京', '车辆工程');
        student.introduce(); // 大家好,我叫zyc,今年18岁,家在南京, 专业是车辆工程
 
  上面定义了一个 Person 类,又定义了一个继承 Person 类的 Student 类,很明显方便了很多。
 

Promise      主要是用来解决异步操作。

  • 同步:串行 简单,方便
  • 异步:并行 性能高,体验好
 这是 promise 的基本用法  

        let p = new Promise((resolve, reject) => {
            $.ajax({
                url: '1.txt',
                dataType: 'json',
                success(json) {
                    resolve(json);
                },
                error(err) {
                    reject(err);
                }
            })
        });
        p.then(json => {
            console.log('成功', json);
        }, err => {
            console.log('获取失败');
        })
 

ES6知识点总结的更多相关文章

  1. ES2015也就是ES6知识点持续更新

    ES6,全名:ECMAScript2015,先扯点其他的,ECMA是一个国际标准化组织,它最重要最重要的作用就是让ECMAScript这门语言标准化,什么意思呢?我们知道,js这门脚本语言是运行在浏览 ...

  2. ES6知识点大汇总

    1 //1.搭建ES6的开发环境: 2 let a=1; 3 console.log(a); 4 //2.var 声明的是全局变量 全局变量会污染外部的区块 5 //let 局部变量 6 //cons ...

  3. 前端读者 | ES6知识点概述

    本文来自 @羯瑞 整理 ES6,并不是一个新鲜的东西,ES7.ES8已经赶脚了.但是,东西不在于新,而在于总结. 变量的新定义 let 和 const 在ES6没有被普及时,我们会用的变量定义的方法是 ...

  4. ES6知识点汇总

    MDN镇楼: https://developer.mozilla.org/zh-CN/ 1.ES6新添加数据类型:symbol  -----------   https://developer.moz ...

  5. 【前端开发】ES6知识点系统化梳理笔记

    >ES6扩展: #Map和Set是es6标准新增的数据类型 ##Map是key-value(关键字-值),Map允许修改value,不允许修改key,Map支持下标操作 var m = new ...

  6. es6 知识点总结(模块化 异步)

    问题: 什么是单线程和异步有什么关系? 什么是 event-loop 是否用过 jquery的deferred promise的基本使用和原理 介绍一下 async/await(和Promise 的区 ...

  7. es6知识点

    扩展运算符(三个点): 将值转换为参数序列. 解构赋值:比如:var [a,b,c]=[1,2,3];

  8. ES6知识点脑图

    点击左键 => 拖拽图片 => 新标签页查看图片 => 放大拖拽查阅

  9. Vue01 vue基础、mvvm、ES6z知识点、计算属性、生命周期

    Vue案例: <body> <div id="app"> <!--第一部分--> <fieldset> <legend> ...

  10. ES6全面讲解

    写在之前.讲解了比较常用的ES6知识点,可以快速的入门.有两个比较复杂的知识点(promise,generator)则是留在了其他文章中,在里面详细讲解. 介绍 1.历史 ​ 1.ECMAScript ...

随机推荐

  1. regex cheat sheet

    regex pattern visualizer : regex101: build, test, and debug regex https://regex101.com/ regex regex ...

  2. @Component类相互引用的加载顺序

    发现bug:没有消息通知,看日志发现调用消息通知的url前缀为null,定位到此工具类 进入工具类 进入ComponentConstant类:它引用了两个配置类 问题:component标注的类相互引 ...

  3. oss上传,阿里云上传oss,带缩略图

    https://mp.weixin.qq.com/s/obL9JmzDYdkREEJIj_hVIQ 借用工具类 <dependency> <groupId>cn.xuyanwu ...

  4. PTA-R7-1 圆形体体积计算器

    ​R7-1 圆形体体积计算器 分数 20 全屏浏览题目 切换布局 作者 张高燕 单位 浙江大学 本题要求实现一个常用圆形体体积的计算器.计算公式如下: 球体体积 V=4​π*r3/3,其中r是球体半径 ...

  5. windows下创建con文件夹

    有时候,我们会碰到必须创建一个名为CON的文件夹,而这个名称在Windows下属于保留字(DOS时代的遗留产物). 方法如下: 1.打开命令行窗口(开始-->运行-->cmd) 2.输入完 ...

  6. Hub

    public class StreamHub : Hub { public ChannelReader<string> ReadLogStream() { var channel = Ch ...

  7. [JSOI2015]圈地

    原题链接:P6094 [JSOI2015]圈地 题意简述 把一块 \(n \times m\) 的地分给两个人,选择分出第 \(i\) 行第 \(j\) 列的地可以获得 \(a_{i,j}\) 的收益 ...

  8. 用简单的代码,将小程序文件直传到腾讯云COS实践

    简介 本文介绍如何不依赖 SDK,用简单的代码,在小程序直传文件到腾讯云COS的存储桶. 注意: 本文档内容基于 XML 版本的 API. 前期条件 登录 对象存储控制台 ,创建存储桶,设置 Buck ...

  9. tomcat 3 - 默认连接器

    Tomcat 中使用的容器连接器必须满足以下要求: 实现 org.apache.catalina.Connector 接口 负责创建实现了 org.apache.catalina.Request 接口 ...

  10. 055_Lightning Lightning 组件基础知识

    Lightning框架简介 Lightning框架是Salesforce提供的一套基于用户界面的开发框架,对于开发单页面应用(Single Page Application)有很大的帮助.它和Visu ...