第一节

const b =  ''
const a = b ?? 6
console.log(a)
console.log(!!+a)
VM356:3 true
空值合并运算符（es2020）

新的声明方式：let
不属于顶层对象window
不允许重复声明
不存在变量提升
暂时性死区
块级作用域

for (var i = 0;i<3;i++){
setTimeout(function(){
    console.log(i)
})
}
// 333

闭包

for(var i = 0;i<3;i++){
    (function(j){
        setTimeout(function(){
        console.log(j)
        })
    })(i)
}
//123

1.有一个外部函数，还有一个内部函数
内部函数会调用外部函数的变量，保证外部函数的变量不被释放

es => 5对象上定义新的属性
Object.defineProperty(window,'pi',{value:3.14,
writable:false
})

基本数据类型=》栈内存
引用数据类型 =》堆内存
Object.freeze(obj) 浅层冻结对象api

数组结构辅赋值 =》 按照顺序去对应
let arr = [1,2,3]
let [a,b,c] = [1,2,3]
log//1,2,3
let [a,b,[c,d]] = [1,2,[3,4]]
let [a,b,[c]] = [1,2,[3,4]]
log //123
let [a,b,c] = [1,2,[3,4]]
log//1,2,[3,4]
let [a,b,c,d = 5] = [1,2,[3,4]]


对象的结构辅助
let user = {
    name:'xiecheng',
    age:34
}

let {name,age} = user
对象结构通过key键去对应
let {age:uage,name:uname} = user

字符串的结构赋值

let str = 'lihaiwen'

function foo(){
    console.log(123)
}
let [a = foo()] = [1]
function foo (){

}

indexOf和includes 的比较
1，看函数的返回值，indexOf返回的是数值型，而includes返回的是布尔型的
2.都可以支持第二参数，而且的第二参数都支持负数的形式，
3.数组中的indexOf不能判断数组是否有NaN而includes可以


字符串的indexOf和数组中德indexOf的比较
1.这两个方法都可以接受两个参数。
2.这两个方法在没有查找的指定的字符都返回-1
3.字符串的indexOf中的第二参数不支持负数而数组的indexOf支持
4.字符串的indexOf在传入参数不是字符串的情况下会转换为字符串而数组的indexOf不会进行数据类的转换

reduce迭代器
let arr = [1,2,3]
let max = arr.reduce(function(prev,cur){
    return Math.max(prev,cur)
})
log//max 3

数组去重

数组去重
let arr = [1,2,3]
let res = arr.reduce(function(prev,cur){
    prev.indeOf(cur) === -1 && prev.push(cur)
    return prev
},[])
log// res

find=》es6

find=》es6
返回第一个符合要求的数组
findindex =>es6
返回第一个符合索引
for of =>es6遍历数组
for(let item of arr.values()){
log//item
}
for(let item of arr.keys()){
log//item
}
for(let [index,item]  of arr.entries()){
log//index item
}

数组的扩展

数组的扩展
//dom文档对象模型
let divs  = document.getElementsByTagName('div')
log divs
//slice es5=>
let arr = Array.portotype.slice.call(div3)
log arr
let arrayLije = {
    0:'es6',
    1:'es8',
    2:'es9'
}
.//伪数组转化真数组
let arr = Array.from(arrayLike)
arr.push('es9')
log arr
let arr = new Array(1,2)
log arr
构造数组
let arr = Array.of(1,2)
log arr
let arr = Array.of(3)
let arr = Array.of(1,true,'lihaien',[1,2,3])
//替换元素
let arr = [1,2,3,4]
log arr.copyWithin(1,3)
//填充元素
let arr = [1,2,3,4,5]
arr = new Array(3).fill(7)
let arr = [1,2,3,4,5,6]
arr.fill('imooc',1,3)
arr.fill(0) //全部替换

let arr = [1,2,3,NaN]
arr.indexOf(NaN)
不能检测NaN
NaN == NaN false
arr.includes(2) true || false
arr.includes(NaN) true

function foo (x,y= 'word'){
log(x,y)
}
foo('hello',0) 

foo({})
function foo ({x,y=1}){
    log// x,y
}


function ajax (url,{
  body ='',
  methods = 'get',
  header ={}
}={})
ajax('http://www.imooc.com',{
methods:'post'
})

function foo(){

}
log foo.length 返回没有默认值得参数数量

es5 =》 合并数组方法
let arr1 = [1,2,3]
let arr2 = [4,5,6]
Array.prototype.push.apply(arr1,arr2)
log // arr1
es6的方式
arr1.push(...arr2)
log arr1

rest运算符

let str = 'lihaiwen'
arr = [...str]
log(arr)

rest参数
function foo (x,y,z){
    log arguments
   let sum = 0 Array.prototype.forEach.call(arguments,function(item){
        sum += item
    })
    return sum
}


Array.from(argments).forEach(function(item){
        +=item m
})
foo(1,2)
foo(1,2,3)

function foo (...args){
    log args
    let sum = 0 
    args.forEach(function(item)=>{
                 sum+= item
                 })
    return sum
}
log foo(1,2)
log foo(1,2,3)


function foo (x,...args){
    log x
    log args
}
foo(1,2,3)
foo(1,2,3,4)

let [x,...y] = [1,2,3]
log x
log y

箭头函数

function sum (){
    return x+y
}
log sum(4,5)

1.this指向定义时所在的对象，而不是调用时所在的对象
2.不可以当作构造函数
3.不可以使用arguments对象

对象的扩展

 对象里面的方法切记不可使用箭头函数
let age = 34
let name = "张三"
let s = 'school' 
let obj = {
    name,
    age,
    [s]:'李海文', 
    study(){ 
        console.log(this.name + '正在学习')
    }


}
obj.study()

Object.is(obj1,obj2) // 判断对象引用地址是否相等


let y = {
    c:5
    a:6
}
Object.assign(y,x)
log ('a' in x)
let arr = [1,2,3]
log (2 in arr)  判断下标位置是否有值


let obj = {
    name:'lihaiwen',
    age:34,
    school:'zhangsan'
}
for(let key in obj){

}
Object.keys(obj).forEach(key=>{
    log (key,obj[key])
})

深拷贝浅拷贝

Object.assign(target,source)
// 检查类型
let checkType = data =>{
   return Object.prototype.toString.call(data).slice(8,-1)
}
let deepClone = target =>{
    let targetType = checkType(target)
    let result
    if(targetType === 'Object'){
        result = {}
    }else if(targetType === 'Array'){
        result = []
    }else{
        return target
    }
    for (let i in target){
        let value = target[i] 
        let valueType = checkType(value)
        if(valueType === 'Object' || valueType === 'Array'){
            result[i] = deepClone(value)
        }else{
            result[i] = value
        }

    }
    return result

}
let arr1 = [1,2,{age:18}]
let arr2 = deepClone(arr1)
console.log(arr2);
arr2[2].age = 35
console.log(arr1,arr2);

数字

Math.max(4,5)
Math.random()

组合式继承

组合式继承
function Animal(name){
    this.name = name
}
Animal.prototype.showName = function (){
    console.log('名字是：'+this.name)
}
function Dog (name,color){
    Animal.call(this,name)
    this.color = color
}
Dog.prototype = new Animal()
Dog.prototype.constuctor = Dog
let d1 = new Dog('张三','white')
console.log();
d1.showName()









es6继承 关键字 class extends constructor static super get/set 



class People{
    constructor(name,age){
        this.name = name
        this.age = age
        this._sex = -1
    }
    get sex(){
        return this._sex
    }
    set sex(val){
        this._sex =val
    }
    showName(){
        console.log(this.name);
    }
    static getCount(){
        return 5
    }

}

let p1 = new People('lihaiwen',34)
p1.sex = 'female'
console.log(People.getCount());
// console.log(p1.showName('22',33));

class Coder extends People {
    constructor(name,age,company){
        super(name,age)
        this.company = company
    }
    showCompany(){
        console.log(this.company);
    }
}
let c1 = new Coder('lihaiwe',33,'jd')
// console.log(c1);
c1.showName()
c1.showCompany()

Symbol 原始数据类型7种

const stu1 = Symbol('李四')
const stu2 = Symbol('李四')


const grade = {
    张三:{address:'xxx',tel:'1111'},
    [stu1]:{address:'yyy',tel:'2222'},
    [stu2]:{address:'zzz',tel:'3333'},

}
// console.log(grade[stu1]);

const sym = Symbol('lihaiwen')
class User {
    constructor(name){
        this.name = name
        this[sym] = 'lihaiwen.com'
    }
    getName(){
        return this.name + this[sym]
    }
}
const user = new User('李海文')

// console.log(user.getName(),'br\n');

// for(let key in user){
//     console.log(key);
// }

// for (let key of Object.keys(user)){
//     // console.log(key);
// }
// for(let key of Object.getOwnPropertySymbols(user)){
//     console.log(key);
// }
// 拿到Symbol 和属性
for(let key of Reflect.ownKeys(user) ){
    console.log(key);
}
const shapeType = {
    triangle:Symbol(),
    circle:Symbol()
}
function getArea(shape){
    let area = 0 
    switch (shape){
        case shapeType.triangle:
            area = 1
            break
        case shapeType.circle:
            area = 2
            break
    }
    return area
}
console.log(getArea(shapeType.triangle));

let s1 = Symbol('foo')
let s2 = Symbol('bar')
const obj ={
name:'lihaiwen',
toString(){
    return this.name
}
}
let s = Symbol(obj)
// console.log(s);
//const s2 = Symbol.for('foo')
// Symbol.keyFor(s2)
// let s1 = Symbol.for('foo')
// let s2 = Symbol.for('foo')
// console.log(s1 === s2);

set数据类型

let s = new Set([1,2,3,2,4])
s.add('lihaiwen').add('es').delete(2)
// s.clear()
// console.log(s);
// console.log(s.has('es'));
// console.log(s.size);
// s.forEach(x=>console.log(x))
let arr = [11,1,2,3,4,5]
for(let x in s){
    console.log(x);
}
let arr1 = [1,2,3,4,5,6]
let arr2 = [2,3,4,5,6]
let dd = new Set([...arr1,...arr2])
console.log([...dd]);
console.log(Array.from(dd));


let s1 = new Set(arr1)
let s2 =new Set(arr2)
let result = new Set(arr1.filter(item => s2.has(item)))
//交集
console.log(result);
//差集

let arr3 = new Set(arr1.filter(item => !s2.has(item)))

let arr4 = new Set(arr2.filter(item=>!s1.has(item)))

console.log([...arr3,...arr4])

WeakSet
let ws = new WeakSet()
ws.add({
   name:'imooc'
})
ws.add({
    age:5
})
ws.delete({
   name:'imooc'
})
conso.log(ws)


let obj1 = {
name:'zhangsan'
age:00
}
ws.add(obj1)
ws.delete(obj1)

unicode 
es6 \uxxxx 码点 0000~ffff
\172 === 'z'
\x7A === 'z'
模板字符串
const class2 = `icon icon-${isLargeScreen()?'big':'small'}`
带标签的模板字符串
const foo = (a,b,c,d) => {
    consolog.log(a)
    consolog.log(b)
    consolog.log(c)
    consolog.log(d)
}
const name = 'lihaiwen'
const age = 34
foo`这是${name}`

处理码点
String.fromCharCode(0x20bb7) ES5
String.fromCodePoint(0x20bb7) ES6

indexOf
const str = 'lihaiwen'
console.log(str.indexOf('li'))
includes('') true false
是否已开头
str.startsWith('im')
str.endsWith('wen')
重复10次
String.prototype.repeat() 

正则扩展

i(忽略大小写) m（多行匹配）g（全局匹配）
y修饰符 粘连修饰符(sticky) 
str = 'aaa_aa_a'
reg1 = /a+/g 每次匹配剩余的
reg2 = /a+/y 剩余的第一个开始匹配
console.log(reg1.exec(str))
console.log(reg2.exec(str))


console.log(reg1.exec(str)) //aa
console.log(reg2.exec(str)) //null


console.log(reg1.exec(str))
console.log(reg2.exec(str))

u修饰符 unicode
const str = '\uD843\uDFB7'
consoloe.log(/^\uD842/.test(str)) es5 true
console.log(/^\uD842/u.test(str)) es6 false

//.除了换行符以为的任意单个字符
console.log(/^.$/.test(str)) // false
console.log(/^.$/u.test(str)) //true

//想用码点值
console.log(/\u{61}/.test('a')) //false
console.log(/\u{61}/u.test('a')) //true


console.log(/吉{2}/.test('吉吉')) //false
console.log(/吉{2}/u.test('吉吉')) //true

数值的扩展

//十进制 -》 二进制
const a = 5 //101
console.log(a.toString(2))

//2进制 =》 十进制
const b= 101
console.log(parseInt(b,2))

ES // 0B二进制  0O八进制
const a = 0B0101

const b = 0O777

Number.isFinite() // 判断是否有限无限无穷大
Number.isNaN()
Number.parseInt()
Number.parseFloat()
Number.isInteger() // 判断是否整数
0.1+0.2 === 0.3？？？ 精度缺失 存储缺失
Math新增方法
const max = Math.pow(2,53)


Number.MAX_SAFE_INTEGER
Number.MIN_SAFE_INTEGER
Number.isSafeInteger() 是不是安全的整数

Math.trunc(5.5) 去除一个数的小数部分，返回整数部分
console.log(Math.trunc(5.5))
console.log(Math.trunc(-5.5))
console.log(Math.trunc(true)) //1

console.log(Number.parseInt(5.5))
console.log(Number.parseInt(-5.5))
console.log(Number.parseInt(true)) //NaN 

````js let obj = {} new Proxy(obj,{}) p.name = "imooc"

````