关键字

let 关键字

1.变量不能重复声明
let star = ‘罗志祥’;
let star = ‘小猪’;
2. 块级作用域 全局 函数 eval

{
let girl = ‘tom’;
}
3. 不存在变量提升
console.log(song);
let song = ‘你好’
4. 不影响作用域链

{
            let school = '大学';

            function fn() {
                console.log(school);
            }
            fn();
        }

let 实例
在 每一次的for 循环中 let 绑定一个 事件 春块级作用域

 let items = document.getElementsByClassName('item');

        //遍历并绑定事件
        for (let i = 0; i < items.length; i++) {
            items[i].onclick = function() {
                items[i].style.background = 'pink'
            }
        }

const 关键字

1 一定要赋初始值
2 一般常量使用大写
3. 常量的值不能修改

4 块级作用域
    5 . 对于数组和对象的元素修改,不算做对常量的修改 不会报错

const TEAM = ['uzi', 'mlxg'];
        TEAM.push('daye')
        console.log(TEAM);

变量的解构赋值

ES6 允许按照一定模式从数组和对象中提取值, 对变量进行赋值。
频繁的使用对象方法 数组元素 就可以使用解构赋值形式
这被称为解构赋值
数组的解构

const F4 = ['小沈阳', '刘能', '赵四', '宋小宝'];
        let [xiao, liu, zhao, song] = F4
        console.log(xiao);
        console.log(liu);
        console.log(zhao);
        console.log(song);

对象的解构

        const tom = {
            name: 'tom',
            age: 18,
            xiaopin: function() {
                console.log('你好');
            }
        };
        let {
            name,
            age,
            xiaopin
        } = tom;
        console.log(name);
        console.log(age);
        console.log(xiaopin);

模板字符串

ES6 引入新的声明字符串的方式 ``
1 声明
let str = 我也是一个字符串;
2 内容中可以直接出现换行符

let str1 = `
        <ul>
        <li>tom</li>
        <li>lisa</li>
        <li>gg</li>
    </ul>
        `

3 变量拼接

let lovest = 'tom';
        let out = `${lovest}我最爱的是`;
        console.log(out);

简化对象写法

ES6 允许在大括号里面 直接写入变量和函数 作为对象的属性和方法
这样书写更加简洁

let name = 'tom';
        let change = function() {
            console.log('will be change');

        }
        const name2 = {
            name,
            change,
            improve() {
                console.log('简单');
            }
        }
        console.log(name2);

箭头函数

ES6 允许使用 箭头函数 => 定义函数

let fn = (a, b) => {
            return a + b;
        }

1 this 是静态的 this 始终指向函数声明时所在作用域下的 this的值都不会改变

function getName() {
            console.log(this.name);  // 输出 mark
        }
        let getName2 = () => {
            console.log(this.name); // 输出mark
        }
        name = 'tom';
        window.name = 'mark';
        const sxt = {
            name: 'eve'
        }
        getName();
        getName2();

2 不能作为构造函数 实例化对象
let person = (name, age) => {
// this.name = name;
// this.age = age;
// }
// let me = new person(‘xiao’, 18)
3 不能使用 arguments 变量
4 箭头函数的简写

//1 省略小括号 当形参有且只有一个的时候
        let add = n => {
            return n + n;
        }
        console.log(add(9));
        // 2 省略花括号 当代码体只有一条语句时 此时 ruturn 必须省略
        // 而且语句的执行结果就是函数的返回值
        let pow = n => n * n;
        console.log(pow(9));

rest 参数

ES6 引入 rest 参数 用于获取函数的实参 用来代替 arguments

// ES5 获取方式
        function date() {
            console.log(arguments);
        }
        date('tom', 'gg', 'ggg')
                // rest参数
        function data(...args) {
            console.log(args); // filter some every map
        }
        data('tom', 'gg', 'ggg')

        // rest 参数 必须要放在参数最后
        function fn(a, c, ...args) {
            console.log(a);
            console.log(c);
            console.log(args);
        }
        fn(1, 2, 3, 4, 5, 6, )

spread扩展运算符

//  扩展运算符能将 数组 转换为逗号分隔的 参数xulie
        // 声明数组 
        const arr = ['tom', 'jim', 'jhon'];
        //函数
        function persons() {
            console.log(arguments);
        }
        persons(...arr);