声明变量     

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. IDEA中常见问题

    idea中不存在.iml文件项目主目录下执行命令行mvn idea:module

  2. 【阿里云ACP】-01(阿里云综述、弹性计算)

    课程能力 课程范围 ECS 磁盘 实例 磁盘 快照 镜像 网络 安全组 AS 伸缩组 伸缩配置 伸缩规则 伸缩活动 伸缩触发任务 伸缩模式 冷却时间 SLB 定义 实现原理 支持的协议 绘画保持 健康 ...

  3. fetchAll 的小小分析

    includes\database\prefetch.inc line 425 $this->defaultFetchStyle: fetch_object int 5protected $de ...

  4. python测试IP地址是否ping通

    import timeimport osdef pingComputer(): for i in range(1, 256): host = '192.168.2.' + str(i) status1 ...

  5. Unity 凹多边形三角剖分

    游戏中需要实现一个小功能,显示一个玩家的能力图,这个图是一个有6个顶点任意摆放组合的多边形.而绘制多边形主要用到的知识就是Mesh构建,mesh的构建主要需要顶点列表,三角形列表,法线列表.uv列表等 ...

  6. php微信公众号开发之生成带参数的二维码

    参考微信公众平台:https://developers.weixin.qq.com/doc/offiaccount/Account_Management/Generating_a_Parametric ...

  7. redis 和docker等名词了解

    redis redis产生 redis是MySQL数据库经常直接面对大量的读写访问,面对比较复杂的数据据操作,会导致数据库I/O反映缓慢或者奔溃: 有人研究学习CPU从内寸直接读取数据,把MYSQL经 ...

  8. 像MIUI一样做Zabbix二次开发(7)——问答

    Q:用Zabbix怎么去监控IBM的power服务器(硬件方面的) A:硬件监控,ipmi  和SNMP,带外管理口集成 Q:ipmi获取数据有时候回拉不到 A:ipmi的监控zabbix低版本的的确 ...

  9. Mogdb / opengauss 用户密码错误,用户被锁

    # 问题概述xxx客户新上一套opengauss数据库,在测试中程序里用户的密码配置错误,导致用户被锁# 解决方案1.跟oracle 语法一样alter user xxx account unlock ...

  10. XJTUOJ #1323. [L2-2]三倍满世界

    题目 https://oj.xjtuicpc.com/problem/1323 思路 题目说明有点绕. 然后我们仔细观察一下,这个东西很显然是一个天然的树形结构. 我们可以把一个空间(或者一个数)当成 ...