20200921冯佳丽

学习日志

ES6

一、模板字符串

概念:

模板字符串其实就是简化版的字符串拼接

模板字符串格式

反引号包裹的字符串(键盘上左上角,ESC键正下方的键)

模板字符串特点

1、模板字符串支持换行
2、模板字符串支持动态生成内容,在一对中使用 ${JS表达式},模板字符串会自动执行JS表达式的结果,并拼接到最终生成的普通字符串中

案例:

        var price=13.2;
        var count=3;
        console.log(`
             单价:¥${price.toFixed(2)},
             数量:${count}
             -------------------------------
             小计:¥${(price*count).toFixed(2)}
        `);
        var orderTime=1562498460971;
        console.log(`下单时间:${new Date(orderTime).toLocaleString()}`);
        var sex=1;
        console.log(`性别:${sex==1?"男":"女"}`);
        var week=["日","一","二","三","四","五","六"];
        //         0    1    2    3    4   5    6
        console.log(`今天星期${week[new Date().getDay()]}`)

二、let

概念:

let用于代替var,用于声明变量的新关键词

使用时间:

var有两个缺点:
  1. 变量声明提前,打乱了程序正常的执行顺序
  2. 没有块级作用域,代码块内的变量,会影响块外的变量
let的优势:

1、禁止变量声明提前,保证程序按顺序执行代码。不会破坏程序正常的执行顺序

2、让程序结构(分支和循环)的{},也成为一级作用域——块级作用域,保证块内和块外即使有相同的变量,也不会相互影响,避免了块内的变量污染外部

什么时候使用let?

今后只要声明变量,都用 let 代替 var

原理:let做了两件事

1、let会被自动翻译为匿名函数自调

2、双保险,let为了进一步避免可能的冲突将变量悄悄改了名字

let的特点

​ 全局写 let t=0, 用 window.t 却找不到

​ 同一级作用域内,不能在 let t=0 前,提前使用t。即使外层作用域有t变量,也不行

​ 相同作用域内,不允许重复let同一个变量

三、箭头函数

概念

简化版的回调函数,专门代替function来简化创建函数的新语法。其它语言中也叫拉姆达(lambda)表达式

为什么使用箭头函数?

简化代码

什么时候使用箭头函数?

几乎所有回调函数都可用箭头函数简化,今后,能用箭头函数简写的地方,优先使用箭头函数简写

使用箭头函数

1、去掉 function,在 () 和 {} 之间加 =>

2、如果只有一个参数,可省略 (),但是,如果没有参数,必须保留空 ()

3、如果函数体只有一句话,可省略 {},如果这句话还是 return,则可省略 return 和 {}

测试案例
        var arr = [1, 2, 3, 4, 5]
        var arr2 = arr.map(elem=>elem * 2)
        console.log(arr2)
        
        var add = (a, b)=>a + b
        console.log(add(3, 5))
        
        ;(()=>{
             var now = new Date()
             console.log(`页面加载完成,at:${now.toLocaleString()}`)
        })()
        
        setInterval(() =>console.log(`滴答`), 1000)
        
        var lis=document.querySelectorAll('ul>li')
        for(var lis of arr){
             
        }
        
        function add(a,b,c=10){
            console.log(a+b+c)
        }
        add(2,2)

四、for of

概念:

专门代替普通for循环,来遍历一个索引数组

功能:

简化版的遍历索引数组和类数组对象

for of 的问题

不支持关联数组和对象

只能读取元素值,不能修改元素值,按值传递

只能连续遍历所有

学习心得

概念太多,记不住,哎,头疼,讲了还会,过几天就不知道忘到哪里了,内容太多。

标签

评论

this is is footer