let
- 推荐使用let，而非var，可以避免变量提升，达到块作用域效果
function testVar() {
var a =10;
console.log(a);
if(true) {
var a=20;
console. log(a);
}
console.log(a);
}
function testLet() {
let a =10;
console.log(a);
if(true) {
let a=20;
console.log(a);
}
console.log(a);
}
function testVar() {
var a =10;
var a = 20;
console.log(a);
}
function testLet() {
let a =10;
let a = 20;
console.log(a);
}
for (var i = 0; i < 10; i++) {
setTimeout(function(){
console.log('--', i)
}, 1000)
}
for (let i = 0; i < 10; i++) {
setTimeout(function(){
console.log('--', i)
}, 1000)
}
// 变量提升
let a;
console.log('--', a);
a = 10;
var b;
console.log('--', b);
b = 10;
const
- const语言中的变量只能被赋值一次，然后就不能在被赋值。const语句的作用范围和let语句一样。
- const保证的是不是值不能变动，而是变量所指向的内存地址不能变动。注意简单变量与复杂变量（数组、对象）
- const 在声明时必须被赋值
const T = 3;
T = 4
const T = {a: 1};
T.a = 2
箭头函数
let func = function (a) {return a}
let func = (a) => {return a}
let func = (a) => a
window.age = 13;
function Person() {
this.age = 0;
setTimeout(function () {
this.age++;
}, 1000);
}
var person = new Person();
// person.age;window.age ?
window.age = 13;
function Person() {
this.age = 0;
setTimeout(() => {
this.age++;
}, 1000);
}
var person = new Person();
// person.age;window.age ?
window.age = 13;
function Person() {
this.age = 0;
setTimeout((() => {
this.age++;
}).bind(window), 1000);
}
var person = new Person();
// person.age;window.age ?
参数默认值
function func(a = 3) {
console.log('-- ', a)
}
spread/rest符
var arr = [1,2,3,4,5]
var arr1 = [...arr]
var obj = {a: 1, b: 2}
var obj1 = {...obj}
function re (b) {
console.log(' +++++ ', b)
}
re(1,2,3,4,5)
function re (...b) { // rest符
console.log(' +++++ ', b)
}
re(1,2,3,4,5)
re(...[1,2,3,4,5])
function re (a, b, c, d, e, f, g, h) {
console.log(' +++++ ', a, b, c, d, e, f, g, h)
}
re(1,2,3,4,5,6,7,8)
re(...[1,2,3,4,5,6,7,8])
re.apply(null, [1,2,3,4,5,6,7,8])
对象词法扩展
function getCar(make, model, value) {
return {
// 简写变量
make, // 等同于 make: make
model, // 等同于 model: model
value, // 等同于 value: value
// 属性可以使用表达式计算值
['make' + make]: true,
// 忽略 `function` 关键词简写对象函数
depreciate() {
this.value -= 2500;
}
};
}
let car = getCar('Barret', 'Lee', 40000);
对象和数组解构
function foo() {
return [1,2,3];
}
let arr = foo(); // [1,2,3]
let [a, b, c] = foo();
console.log(a, b, c); // 1 2 3
function bar() {
return {
x: 4,
y: 5,
z: 6
};
}
let {x: x, y: y, z: z} = bar();
console.log(x, y, z);
let {x: x1} = bar();
console.log(x1)
对象超类
var parent = {
foo() {
console.log("Hello from the Parent");
}
}
var child = {
foo() {
super.foo();
console.log("Hello from the Child");
}
}
Object.setPrototypeOf(child, parent);//将child的原型指向parent
child.foo();
Object
- Object.keys
- Object.entries
- Object.fromEntries
let students = {
amelia: 20,
beatrice: 22,
cece: 20,
deirdre: 19,
eloise: 21
}
Object.keys(students)
Object.entries(students)
let students = [
[ 'beatrice', 22 ],
[ 'eloise', 21 ]
]
Object.fromEntries(students)
concat
var arr = [1,2].concat([3,4])
var arr1 = [1,2].concat(3)
var arr2 = [1,2].concat(3, 4)
var arr3 = [1,2].concat(3, [4])
var arr5 = [1,2].concat(3, [4, 5, 6])
var arr6 = [1,2].concat(3, [4, 5, [6, 7]])
trim
let message = " Welcome to CS 101 "
message.trim()
message.trimRight()
message.trimLeft()
message.trimRight().trimLeft()
Array
- find: 从数组中找到指定元素
- map: 返回新数组, 不改变原数组
- flat: 打平数组
- flatMap: 结合map和flap
- filter: 过滤出需要的元素, 不改变原数组
- reduce: 对数组进行累加, 不改变原数组
- includes: 判断是否包含某元素
- forEach: 遍历数组
- for...of/in: 遍历数组或对象
Array举例
let arr = [{a: 1}, {a: 2}, {a: 3}]
let findEl = arr.find(el => el.a === 3)
let newArr = arr.map(el => el.a * 2)
let newArr1 = arr.filter(el => el.a > 1)
let sum = arr.reduce((prev, next) => {return {a: prev.a + next.a}}, {a: 100})
let bl1 = [1, 2, 3].includes(2)
let bl2 = [1, 2, 3].includes(2, 3)
let bl3 = [1, 2, 3].includes(2, -1)
let bl4 = [1, 2, 3].includes(2, -2)
let bl4 = [1, 2, 3].includes(2, -3)
let arr = [{a: 1}, {a: 2}, {a: 3}]
let flatRes = [[1, 2], [3, 4]].flat()
let flatRes1 = [[1, 2], [3, [4, 5]]].flat()
let flatRes2 = [[1, 2], [3, [4, 5]]].flat(2)
let flatRes3 = [[1, 2], [3, [4, 5]]].flat(Infinity)
let grades = [78, 62, 80, 64]
let flatMapped = grades.map(grade => [grade, grade + 7]).flat()
let flatMapped1 = grades.flatMap(grade => [grade, [grade + 7]])
// for...of 用于遍历一个迭代器，如数组：
let nicknames = ['di', 'boo', 'punkeye'];
nicknames.size = 3;
for (let nickname of nicknames) {
console.log(nickname);
}
// for...in 用来遍历对象中的属性：
let nicknames = ['di', 'boo', 'punkeye'];
nicknames.size = 3;
for (let nickname in nicknames) {
console.log(nickname);
}
async/await & promise
classList
bind、call、applay
Set与Map
正则
类
