變量提升： var
var tmp = new Date()
function f(){
console.log(tmp) //作用於死區
if(false){
var tmp = 'hello world'
}
}
f() tmp undefine var 變量提升
5 變量的結構賦值：
let arr = [1,2,3]
let b =arr[1]
let [a,b,c] = arr;
let [x,y,z] = [1,2] z undefine
let [x, y, z = 5] = [1,2] 設置默認值
let [m,n] = [1,2,3] m =1, n = 3;
宗旨： 一一對應
var obj ={ // 定義變量
a: 2,
b: 3
}
let obj = {
a, //=> a:a
b: b,
add(){} // =>add: function(){} //對象簡寫
}
let dates = { //定義對象
name: 'ss',
age: 12
}
let name = dates.name
let {name: name, age: age} = dates; //聲明變量
改變量名
let {name: nm, age: ag} = dates;
let {name,age} = dates;
對象解構賦值
面向對象： 原型。 __proto__: object 原型
賦值原型屬性。
let ss = [1,2,3]
let {length: len} = ss //結構賦值
len
>> 3
let datas = {
name: "aa",
age: 13,
sex: false
}
let {name,age,sex: sx=true} = datas; 修改名字
以數組形式的解構
let str = "abcdefg"
let [abc,io] = str; //abc =a, io = b
以字符串形式解構
let {indexof, length,slice} = str // 原型賦值
展開運算符： const arr = [1,2,3] // 展開后： ...[1,2,3] => 1,2,3
const s = [...[1,2,3]] // s=== arr false 地址不一樣
var o = {...obj}
var person = {
name: 'aaa';
age: 12;
...obj // 合並對象
}
var newObj = {...obj,...person} //合並對象
function add(...arr){ // ...[1,2,3]
console.log(arr)
}
add(...arr); //展開運算符
字符串擴展： 模板字符串
const name = '小明'；
const age = 12;
const str = name + age;
const newstr = `${name}今年${age}了`; //模板字符串{} 可以放任意表達式，但是一定要有返回值。
標簽模板：
function add(...arr){
console.log(arr)
}
add`${name}今年${age}了${age}`; // 三個參數
類：對實例的抽象
實例：類的具體表現
原型：
const date = new Date()
console.dir();
<div id='box'> </box>
<span id='span'></span>
const oBox = document.getElementById('box')
每個標簽都有自己的類。 console.dir(obj)
一切皆對象
this supper
判斷的是this指向；
this 指向windows 一般只出現在函數內部。
意義讓同一個函數在不同環境下執行有不同的效果。實例的方法調用的類的原型。
只有函數執行的時候才能： 判斷this指向。
函數內部的this指向當前函數執行的環境。函數所掛靠的實例對象。
this指向實例對象。實例原型對象。
super調用父類的方法。
super 和this 用同樣的特性。
super 指向當前函數的執行環境。所屬的類原型。（property)
書寫時不能單獨寫在函數中。
Object.property.abc = 123;
cosnt obj = {
name : "zhang",
say(){
console.log(super.abc);
console.log(this.name);
}
}
修改函數this的方法：
function 是一個實例。 通過函數推算他的類。
方法： call 參數， 返回值， this 指向， 功能。
const obj={
name: "zhang";
sayProp(){
console.log(super.abc);
console.log(this.name);
}
}
function add(a,b,c){
console.log(a,b,c);
console.log(this);
}
add.call(obj,1,2,3)
a. call 功能： 讓函數執行。
apply 和call 是一樣的。
bind方法： 掛載函數的類的原型上。
不能使調用bind的函數執行。
改變函數內部的this.
會生成新的函數。
箭頭函數： const add = function(){}
const dis = (/*形參*/)=>{
}
簡寫小括號和花括號在一定情況下可以簡寫：
參數是一個的時候小括號可以省略；
代碼塊僅有一句話時花括號可以省略；
const add (a) =>{
return a+10;
}
簡寫： add = a =>a+10;
作為對象屬性；
const obj = {
add: ()=>{}
}
箭頭函數是沒有this; 指的時上一級環境。
const obj={
add: ()=>{
console.log(this); //指向上一級對象
}
dis(){
const m = ()=>{
console.log(this);
}
const oo = {m}
oo.m();
}
}
const person = {
say(){
const m = ()=>{
console.log(this); //指向person
}
m();
}
}
類基本用法：
代碼中有很多類。
首字母大寫。
class Person{
//針對類的描述
constructor(){ 成員方法， this都指向生成實例。接受參數。實例化的參數會被constructor接受到。
this.name = '張三'; // this 指向實例。
this.age = 12;
this.height = 178;
this.weight = 100;
} //構造函數；每個類都有
say(){
const {name,age, height,weight} = this;
console.log(`我叫${name},我的年齡${age},我的身高${height},我的體重${weight}`)
}
doAction(){}
doThing(){}
}
const p1 = new Person();
實例和類。
類里面的成員的方法都掛在類的原型上。