【无标题】

ES6+

let

let是用来定义变量的关键字
let a;
a = 123;
console.log(a);|
1、必须先定义，后使用
// let a;
//a=123 ;
// console.log(a);
2、不能重复定义变量
// var a;
// var a;
// let b;
// let b;
3、块级作用域：该变量在该作用域中保持不会丢失
// var oLis = document . getElementsByTagName(“li” );
// for(let i=0; i<oLis.length; i++){
//
oLis[i] .onclick = function( ){
//
console.log(i);
//
oLis[i]. style. backgroundColor = “yellow”;
//
}
// }
4、暂时性死区：当内部变量与外部变量同名时，内部便令变量屏蔽外部变量
let a = 123;
{
let a = 456;
console.log(a);
}
console.log(a);

const

const定义变量的关键字
1、被const修饰的变量为只读变量
2、被const修饰的变量必须初始化
3、必须先定义后使用
4、不能重复定义
5、块级作用域
6、暂时性死区

/ /Var, let, Const区别?
// 1.都是用来定义变量的关键字
// 2.var可以声明提升
// 3.const修饰只读变量，必须被初始化
// 4. let和const都遵循
// a.必须先定义后使用
// b.不能重复定义
// c.块级作用域
// d.暂时性死区

const在数组中，只能改该数组的指向，并不能改数组的栈
const arr = [1,2,3]; 栈
arr[0] = 666;指向
// arr = [666,777]; 栈
console. log(arr[0]);

this

this：函数体的内置对象->只能在函数体内出现
a、与事件体连用，代表出触发该事件的元素本身

b、与普通方法连用（除了事件体和构造方法）连用，代表调用该函数的对象
1、letjson={
a:1，
fun:function(){
console . log(this);
}
}
json. fun()；

2、function fun(){
		 console . log(this);
 }

fun()；

bind

函数对象的一个方法，功能为改变this指向
//bind（被修改的this指向）
document . onclick = function(){
this. style.display = “none” ;
}. bind(oBox);
解释
（// var f = function(){
// }
// f == function(){}
// f.函数名() = function(){}.函数名()）

for…in和for…of

//for…in通历谷器下标取有系与
//letdata={
//
“name”:“王俊凯” ,
//
age” :24,
//
“
’ gender":“M”
// }
// for(let index in data){
//
// console.log( index) ;
// console . log( data[ index]);
// }
//有些容器是没有下标的->遍历数值->
// for…of遍历内容:通常针对于没有下表的容器set map
var arr =
[6,7,4,8,3];
for(let item of arr
){
I
console . log(item) ;
}

字符串新增API

//判断字符串是否包含在另一个字符串中
//在ES5中使用的是indexOf() 方法，
//在ES6中 可以使用includes()、startsWith()、 endsWith()三 个方法。
// str. includes(参数): 返回布尔值，表示是否找到了参数字符串。
// str. startsWith(参数):返回布尔值，参数是否在源字符串的头部。
// str. endsWith(参数):返回布尔值， 参数是否在源字符串的尾部。
let str = " shan yu jie shan yuan" ;
console. log(str . includes(“i1e”));
console
log( str . startsWith(“ha”));
console. log(str . endsWith(“1an” ));

生僻字

set

set集合，没有下标，不能重复
语法：let set = new Set（数组）；
// let set = new Set([3,4,3,5,5,4,3,2,8,7,5,7,4,8,1,2,1]);
// console.log(set);

// 数组去重
// let arr = [3,4,3,5,5,4,3,2,8,7,5,7,4,8,1,2,1];
// let set = new Set(arr);
// //Array.from将集合转换为数组
// arr = Array.from(set);
// console.log(arr);

//-------------------------------------------------
// let set = new Set([1,1,2,2,3,3,4,4]);
// console.log(set);

// add(参数) 向集合中添加一个元素
// delete(值) 删除集合中某个数
// has(值) 判断集合中是否含有某个值
// clear() 清空集合

// set.add(5);
// set.add(5);

// set.delete(1);

// console.log(set.has(12));

// set.clear();

// for(let item of set){
//     console.log(item);
// }

//----------------------------------------------

   function doubleColorBall(){
        let arrRed = [];//1~33 6
        let blueX = 0;//1~16

        let set = new Set();

        while(true){
            if(set.size == 6){
                break;
            }
            set.add(rand(1,33));
        }

        arrRed = Array.from(set);

        console.log(arrRed.sort(function(a,b){
            return a - b;
        }));

        blueX = rand(1,16);

        console.log(blueX);
    }

    doubleColorBall(

);

箭头函数 ->匿名函数的另一种写法

this与该箭头函数连用，代表该函数父元素的前缀

特点：
1、当形参只有一个参数时，可以省略小括号
let fun = a =>{
console.log(a);
}
fun(111);
2、当函数体只有一条语句时，可以省略大括号
let fun = a = >cosole.log(a+10);
fun(11);
3、当函数体只有一条语句时，自带return

<script>
    // 箭头函数->匿名函数的另一种写法
    let fun = function(){
        console.log("今天星期四");
    }

    let fun1 = ()=>{
        console.log("大清要亡了");
    }

    // document.onclick = ()=>{
    //     console.log("heihei");
    // }

    //c.this与箭头函数连用,代表该函数父元素的前缀
    document.onclick = ()=>{
        console.log(this);
    }
    
    let json = {
        a:1,
        fun:()=>{
            console.log(this);
        }
    }

    json.fun();

</script>

解构赋值

解析结构进行赋值
1、初始化
let x,y,z;
x=1;
x=2;
x=3;

  a、数组结构
  let [x,y,z] = [1,2,3];
  console.log(x,z,y);
  
  b、对象结构：去掉json对象的前缀必须保证变量名和json的key一致
  let{ name，age } = {
  					name：“张乐”，
  					age：18
  		}

2、交换两个变量的值

let x = 123,y = 456;
[x,y] = [y,x];
console.log(x,y);

ES6模板字符串

字符串：“” ‘’ ``
1、反引号支持换行
2、如果模板字符串中出现变量 ->${表达式}

let oU1 = document.querySelector("ul");
let  i= 8;
oU1.innerHTML=`
	<li>1</li>
        <li>2</li>
        <li>3</li>
        <li>${i}</li>
    `

map

map：映射，由键值对构成的容器
set（key，value）向集合中添加一个元素：key以存在，则为改；不存在则为增
get（键）根据键去取值
delete（键）删除集合中某个数
has（键）判断集合中是否含有某个值
clear（）清空集合

 let map = new Map();
    map.set("a",1);
    map.set("a",2);
    map.set("b",{
        "name":"laownag",
        "age":"xiaoming"
    });
    map.set("c",true);
    // console.log(map.get("b").name);
    // console.log(map.delete("c"));
    // console.log(map.has("d"));
    // map.clear();
    // console.log(map);
    for(let item of map){
        console.log(item[0],item[1]);
    }

扩展运算符 …

扩展运算符标志：‘…’

let arr = [1,2,3];
let arr1 = [...arr];
arr1[0] = 666;
console.log(arr);
console.log(arr1);

Es6导入导出

1、在html中

2、在js中
文件1、
//导出
//a.方法一
// export let x = 666;

// export let fun = function(){
// console.log(“灌篮高手”);
// }

// let y = 66;

//--------------
//b.方法2
export let x = 666;

export let fun = function(){
console.log(“灌篮高手”);
}

let y = 66;

//只写一个变量名等价于一个键值对
//变量名为key,值为value
export default {
x,
fun,
y
}
文件2、
//导入
//a.方法一
// import {x,fun} from “./a.js”;

// console.log(x);

// fun();

//---------------------
//b.方法2
import myObject from “./a.js”;
console.log(myObject.x,myObject.y);
myObject.fun();