zsydgithub 2 жил өмнө
parent
commit
6fb537e8ec

+ 3 - 0
9_es6/1_let.html

@@ -15,6 +15,9 @@
       3、临时失效区  在这个区域内  不允许同名的变量出现
       4、let具有块级作用域
     */
+    let c = 10
+    c = 20
+    console.log(c)
     // var a = 10;
     // var a = 20;
     // console.log(a)

+ 18 - 6
9_es6/4_解构赋值.html

@@ -8,21 +8,33 @@
 </head>
 <body>
   <script>
-    var arr = [1,2,3]
-    console.log(arr)
-    var [a,b,c] = [4,5,6]
-    console.log(a,b,c)
+    // var arr = [1,2,3]
+    // console.log(arr)
+    // var [a,b,c] = [4,5,6]
+    // a = 7
+    // console.log(a,b,c)
 
+    // var arr1 = [6,6,6]
+    // var [a,b,c] = arr1
+    // a = 9
+    // console.log(a,b,c)
+    // console.log(arr1)
 
     var obj = {
       name:'zs',
       age:18,
       eat:function(){
         console.log('吃')
+      },
+      school: {
+        num: 10000
       }
     }
-    var {age,name,eat} = obj
-    console.log(age,name,eat)
+    var {age,name,eat,school} = obj
+    age = 30
+    school.num = 99999
+    console.log(age,name,eat,school)
+    console.log(obj)
 
     var str = 'ab'
     var [x,y,z] = str

+ 49 - 0
9_es6/5_扩展运算符.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <ul>
+    <li>1</li>
+    <li>2</li>
+    <li>3</li>
+  </ul>
+  <script>
+    /* ...扩展运算符  把数组或者类数组展开成用逗号分隔开的值 */
+    // var a = [1,2,3]
+    // var b = [...a]
+    // b[0] = 8
+    // console.log(b)
+    // console.log(a)
+
+    // var c = [1,2,3]
+    // var d = c
+    // d[0] = 9
+    // console.log(c,d)
+
+    // var e = [1,2,3]
+    // console.log(...e)
+
+
+    //合并
+    var a = [1,2,3]
+    var b = [4,5,6]
+    var e = [...a,...b,7,8,9]
+    console.log(e)
+
+    var aLi = document.getElementsByTagName('li')
+    console.log(aLi)
+    /* ... 把类数组转数组 */
+    var arr = [...aLi]
+    console.log(arr)
+
+
+    arr.push(11)
+    console.log(arr)
+  </script>
+</body>
+</html>

+ 25 - 0
9_es6/6_rest.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script>
+    /* ...rest  剩余的  在函数的参数里面 */
+    function fn(a,b,...rest){
+      console.log(a,b)
+      console.log(...rest)
+    }
+    fn(1,2,3,4,5)
+
+      // function fn(){
+      //   console.log(arguments) //获取所有的参数
+      // }
+      // fn(1,2,3,4,5)
+
+  </script>
+</body>
+</html>

+ 77 - 0
9_es6/7_箭头函数.html

@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <ul>
+    <li>1</li>
+    <li>2</li>
+    <li>3</li>
+  </ul>
+  <script>
+    /*
+    箭头函数和普通函数的区别
+
+    普通函数里面this 指向window
+    箭头函数里面this  指向声明时的this(父作用域)
+
+    箭头函数不能new
+    箭头函数可以使用rest  但是不能使用arguments
+    */
+  // function fn(){
+  //   console.log(this)
+  // }
+  // fn()
+
+  // var fn = ()=>{
+  //   console.log(111)
+  // }
+  // fn()
+
+  // var aLi = document.getElementsByTagName('li')
+  // for(var i =0;i<aLi.length;i++){
+  //   aLi[i].onclick = function(){
+  //     // setTimeout(function(){
+  //     //   console.log(this)
+  //     // }.bind(this),1000)
+  //     // console.log(this)
+  //     setTimeout(()=>{
+  //       console.log(this)
+  //     },1000)
+  //   }
+  // }
+
+  // var person = {
+  //   name:'zs',
+  //   age: 18,
+  //   eat:()=>{
+  //     // console.log(this)
+  //     // setTimeout(()=>{
+  //     //   console.log(this)
+  //     // },1000)
+  //     setTimeout(function(){
+  //       console.log(this)
+  //     }.bind(this),1000)
+  //   }
+  // }
+  // person.eat()
+
+    /* 箭头函数 不能作为构造函数  不能去New */
+  // var person = ((name)=>{
+  //   this.name = name
+  // })
+  // var p1 = new person('zs')
+  // console.log(p1)
+    
+  let fn = ()=>{
+  //  console.log(a,...rest)
+  console.log(arguments)
+  }
+  fn(1,2,3)
+  </script>
+</body>
+</html>