1. let 和 const
// console.log(b); let 本身不会进行预解析。先声明再使用
let b = 0;
// let b = 10; let 在同一作用域下不能重复声明
console.log(a,b);
var a = 10;
// 常量 不能重新赋值,声明时必须赋值
const b = 10;
console.log(b);
2. 数组的解构赋值
按次序排列并按次序解构
// 1.模式匹配 按照对应位置,对变量赋值
let [a, b, c] = [1, 2, 3];
a = 1;
b = 2;
c = 3;
// 2.嵌套数组解构
let [a, [[b], c]] = [1, [[2], 3]];
a = 1;
b = 2;
c = 3;
// 3. 对应位置
let [x, , y] = [1, 2, 3];
x = 1;
y = 2;
// 4.数组的length属性
let arr = ["一", "二", "三", "四"];
let { length: len } = arr;
len = 4
// 5.如果解构不成功,变量的值就等于undefined。
let [x, y, ...z] = ['a'];
x = "a"
y = undefined
z = []
// 6. 交换值
let x = 1;
let y = 2;
[x, y] = [y, x];
x = 2
y = 1
3. 对象的解构赋值
对象的属性没有次序,变量必须与属性同名,才能取到正确的值
// 1. 等号左边需要赋值的对象名必须和等号右边对象的key相等,与位置无关
let { foo, bar } = { bar: 'bbb',foo: 'aaa' };
foo = "aaa"
bar = "bbb"
// 2.如果解构不成功,变量的值就等于
let {foo} = {bar: 'baz'};
foo // undefined
// 3. 重命名
let obj={ a : '18', n : '007', c : '2' }
let { a : age , n : name , count : c }
age = '18'
name = '007'
count = '2'
// 4. 嵌套
let obj = {
p: [
'Hello',
{ y: 'World' }
]
};
let { p: [x, { y }] } = obj;
x = "Hello"
y = "World"
4.字符串的解构赋值
const [a, b, c, d, e] = 'hello';
a = "h"
b = "e"
c = "l"
d = "l"
e = "o"
// 可以对这个属性解构赋值
let {length : len} = 'hello';
len = 5
5.模板字符串 反引号``
// JS里面不用拼接 直接在模板字符串里换行写HTML代码
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`);
// 模板字符串嵌入变量 ${}
let name = "Bob",
let time = "today";
`Hello ${name}, how are you ${time}?`
${ } 大括号内部可以放入任意的 JavaScript 表达式,可以进行运算,以及引用对象属性。
let x = 1;
let y = 2;
`${x} + ${y} = ${x + y}`
// "1 + 2 = 3"
6.箭头函数
// 1. 带参数 函数体只有简单的一行代码
var f = v => v;
// 等同于
var f = function (v) {
return v;
};
// 2.带多个参数 如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。
var f = ( a, b ) =>{ return a + b };
// 等同于
var f = function ( a, b ) {
return a + b;
};
// 3.不带参数
var f = () => 5;
// 等同于
var f = function () {
return 5
};
// 4.this指向
// function 默认情况下谁调用 this 就指向谁
// 箭头函数中的this指向其定义时所在的作用域的this
document.onclick = ()=>{
console.log(this);
};
7. Map和Set
// Map
let m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的Adam
m.set('Adam', 67); // 覆盖之前的Adam, 一个key只能对应一个value,多次对一个key放入value,后面的值会把前面的值冲掉
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined
// Set 去重
//向 Set 加入值的时候,不会发生类型转换,所以3和"3"是两个不同的值。
var s = new Set([1, 2, 3, 3, '3']);
console.log(s); // Set {1, 2, 3, "3"}
s.delete(3); // 删除3
console.log(s); // Set { 1, 2, '3' }