let 和const

//var 声明的变量会预解析
console.log(a);//undefined
var a =123;
//1.let和const声明的变量不会预解析 */ 
console.log(let_var);//报错
let let_var = 456;
//2.let和const在同一个作用域下不能重复声明 */
let let_var = 789;//报错
//3.const 是常量  必须初始化不能只声明不赋值 不能重复赋值*/
const const_;//报错
const const_ = 12211;
const_=5454;//报错
//4.let和const 只能在当前块级作用域内访问 块级作用域指 除了对象的{}  if for switch try catch或直接的{}内 */
{
    let block_ = 1231;
}
console.log(block);//报错

解构赋值

//用数组的解构形式赋值变量
let [a,b,c] = [1,2,3];
console.log(a,b,c);//1,2,3
let [,,c] = [1,2,3]
console.log(c)//3
let [aaa,bbb,ccc] = [,222,];
console.log(aaa,bbb,ccc);//undefined ,222,undefined
let [aaaa=1111,bbbb,cccc] = [,2222,];
console.log(aaaa,bbbb,cccc);//1111 2222 undefined

/* 用对象的解构形式赋值变量 */
let {d,e,f} = {d:1,e:2,f:3}
console.log(d,e,f);//1,2,3
//换位置也没事 属性名对应就行
let {dd,ee,ff} = {ee:22,dd:11,ff:33}
console.log(dd,ee,ff);//11,22,33

// 对象属性别名 as   d3代表的就是ddd
let {ddd:d3,eee,fff} = {ddd:111,eee:222,fff:333}
console.log(d3,eee,fff);//11,22,33

//字符串的解构赋值
let [a1,b1,c1] = "hello";
console.log(a1,b1,c1);//h,e,l
// 对象的形式获取字符串长度
let {length} = "hello";
console.log(length);//5

字符串模板

let obj = {
    username :"swk",
    age      :1000,
}
let fun = function (a,b){
    return a+b;
}
let  tpl =`
    <div>
        <span>${obj.username}</span>
        <span>${obj.age}</span>
        <span>${fun(1,99)}</span>
    </div>

`;

字符串扩展函数

// includes('字符串',从哪个下标开始) 判断字符是否存在
console.log("hello world".includes("world",6));//true
let url = "admin/index.php";
// startsWith 判断是否以字符串开始
console.log(url.startsWith("admin1"));//false
// endsWith   判断是否以字符串结束
console.log(url.endsWith("php"));//true
//repeat(count) : 重复指定次数a
console.log('a'.repeat(5));
//补全字符串长度 padStart padEnd
let str = 'i';
str.padStart(5,'mooc') // imooc
str.padEnd(6,'mooc') // imoocm

对象的简化写法

//简化的对象写法
//* 省略同名的属性值
//* 省略方法的function
let x = 3,y = 5;
let obj = {
        x, //x:x
        y, //y:y
        getPoint(){//getPonit:function......
            return this.x
        }
};

箭头函数

//1.没有形参，并且函数体只有一条语句
let fun1 = () => console.log('fun1()');
//2.一个形参，并且函数体只有一条语句
let fun2 = x => x;
console.log(fun2(5));//5
//3.形参是一个以上
let fun3 = (x, y) => x + y;
console.log(fun3(25, 39));//64
//4.//函数体有多条语句
let fun4 = (x, y) => {
        console.log(x, y);
        return x + y;
};
console.log(fun4(34, 48));//82

箭头函数的this

//1、箭头函数没有自己的this，箭头函数的this不是调用的时候决定的，而是在定义的时候处在的对象就是它的this
//2、扩展理解： 箭头函数的this看外层的是否有函数，
        //如果有，外层函数的this就是内部箭头函数的this，
        //如果没有，则this是window。
//3 箭头函数没有 arguments
let obj = {
        name : 'kobe',
        age : 39,
        getName : () => {
            btn2.onclick = () => {
                console.log(this);//window
            };
        }
 };
obj.getName();

let person = {
        name : 'kobe',
        age : 39,
        getName :function () {
            btn2.onclick = () => {
                console.log(this);//preson
            };
        }
 };
person.getName();

function Person() {
     this.obj = {
         showThis : () => {
             console.log(this);//Person对象
         }
     }
 }
let fun5 = new Person();
fun5.obj.showThis();

三点运算符

//函数中的运用 
function(a,...val){// 3点运算符 只能写在最后,得到是没有定义形参的实参列表
  //arguments是伪数组不能使用数组的方法,而通过三点运算符得到的实参列表是真数组,可以使用数组方法
  val.forEach(item,index){
    console.log(item);
  }
}
//数组的运用
let arr1=[2,3,4,5];
let newArr = [1,...arr1,6];
console.log(newArr);//[1,2,3,4,5,6]
console.log(...newArr);//1,2,3,4,5,6

数值扩展

//1. 二进制与八进制数值表示法: 二进制用0b, 八进制用0o
console.log(0b1010);//10
console.log(0o56);//46
//2. Number.isFinite(i) : 判断是否是有限大的数
console.log(Number.isFinite(NaN));//false
console.log(Number.isFinite(5));//true
//3. Number.isNaN(i) : 判断是否是NaN
console.log(Number.isNaN(NaN));//true
console.log(Number.isNaN(5));//falsse
//4. Number.isInteger(i) : 判断是否是整数
console.log(Number.isInteger(5.23));//false
console.log(Number.isInteger(5.0));//true
console.log(Number.isInteger(5));//true
//5. Number.parseInt(str) : 将字符串转换为对应的数值
console.log(Number.parseInt('123abc'));//123
console.log(Number.parseInt('a123abc'));//NaN
//6. Math.trunc(i) : 直接去除小数部分
console.log(Math.trunc(13.123));//13
//7.Number.isSafeInteger 判断是否在 最大值和最小值之间的整数

数组的扩展

//1. Array.from(v) : 将伪数组对象或可遍历对象转换为真数组
let btns = document.getElementsByTagName('button');
//包装完就是真数组就可以数组的方法
Array.from(btns).forEach(function (item, index) {
        console.log(item, index);
});
//2. Array.of(v1, v2, v3) : 将一系列值转换成数组
let arr = Array.of(1, 'abc', true);
console.log(arr);[1, 'abc', true]
//3. find(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素
let arr1 = [1,3,5,2,6,7,3];
let result = arr1.find(function (item, index) {return item >3}); // 5
//4. findIndex(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素下标
let arr1 = [1,3,5,2,6,7,3];
let result = arr1.findIndex(function (item, index) {return item >3}); // 2

对象的扩展

//1. Object.is(v1, v2) 判断2个数据是否完全相等 ,底层其实是转换为字符串去比较
  console.log(0 == -0);//true
  console.log(Object.is(0, -0));//false
//2. Object.assign(target, source1, source2..)* 将源对象的属性复制到目标对象上

//3. ES6 对象可以直接操作隐式原型 __proto__ 属性
   let obj1 = {name : 'anverson', age : 41};
   let obj2 = {};
   obj2.__proto__ = obj1;