zoukankan      html  css  js  c++  java
  • es6中相关知识

    一、es6块级作用域

    1. 使用es6中块级作用域的原因

      (1)防止局部变量污染全局

      (2)防止变量泄露在全局

    2. 块级作用域{ }形成一个暂时性的死区

    3. es6中的let和const

      let和const 都只能在声明变量的块级作用域内部有效

      (1)let声明变量的特点

        声明变量只能在当前作用域内使用

        在同一块级作用域里面,不能用let声明多个相同的变量

        变量不会泄露再全局

        变量不会提升

      (2)const声明变量的特点

        声明的变量只能在当前块级作用域内使用

        不会声明变量

        const声明一个变量,并且用const声明的变量 值 不能改变,相当于声明一个常量。

    4.es6中字符串

      (1)字符串模板  ·  ·  【反引号】  

         var a = '222';
              var str = `
                  <div>
                      <a><img src="${a}"></a>
                      <h4>${a}</h4>
                      <p>${a}</p>
                    </div>
                `;
                console.log(str);
      (2)判断一个字符串中是否包含某个字母
        字符串.includes();   返回值是true和false
         var str='abcds';
              console.log(str.includes('a'));
      (3)赋值的次数    字符串.repeat(5);      //将某个字符串复制n次
        var str = 'asdgghh';
        var str1 = str.repeat(5);
        console.log(str1);

      (4)判断开始的位置和结束的位置

        var str = 'dddddfffff'; 

        console.log(str.startsWith('a'));

        console.log(str.endsWith('a'));

    5.es6数组

      (1)includes  返回的是布尔值

        var arr = [1,2,3,4,5,6];

        console.log(arr.includes(5));

      (2)将一组数据转成数组

        var str='dddggsaa';

        console.log(Array.of(str));

      (3)将伪数组转为数组

        var arr = document.getElementsByTagName('*');

        console.log(Array.from(arr));

      (4)数据的填充

        数组.fill(参数1,参数2,参数3)

          参数1:需要填充的数据

          参数2:填充开始的下标

          参数3:填充结束的下标(不包括)

        var arr = [1,2,3,4,5,6,7];

        console.log(arr.fill('a',2,4));   //填充的是下标为2,3的值,包括前面的,不包括后面的。

      (5)根据条件返回最近的一个值

        var arr = [1,2,3,4,5,6];

        var  arr1 = arr.find(function(val,index,arr){

          return val>3;

        })

        console.log(arr1);   //4

      (6)根据条件判断,找符合条件,离得最近元素的下标

        var arr = [1,2,3,4,5,6,7];

        var str1 = arr.findIndex(function(val,index,arr) {

          return val > 3;

        })

        console.log(arr1);  //3

    6.es6对象

      (1)在对象里面,es6消除了关键字

        var obj = {

          name:'liming',

          fn() {

          console.log('1');

          }

        }

      (2)检测对象指向的索引是否一致【意思是否指向的是同一片内存区域】

        Object.is(obj1,obj2);

        var obj1 = {

          name:'liming',

          sex:'nan',

          age:15

        }

        var obj2 = obj1;

        console.log(Object.is(obj1,obj2));

      (3)对象的合并

        Object.assign(参数1,参数2);

        参数1:要合并的对象,被更改

        参数2:被合并的对象,自身不更改

        var obj1 = {

          name:'liming'

        }

        var obj2 = {

          age:20

        }

        var obj = Object.assign(obj1,obj2);

        console.log(obj1,obj);   //obj的结果和obj1的结果一样,因为用assign合并的时候,会将原对象改变。

      注:Object.assign()合并对象的时候,如果两个对象之间有相同的属性,则后面的会把前面的覆盖。

      如: var obj1 = {a:12,b:123}  ;     var obj2 = {a:456,c:456};

        console.log(Object.assign(obj1,obj2));   //   运行结果是:{a:456,b:123,c:456}

    7.es6的解构

      (1)数组的解构

        var arr = [1,2,3,4,5,6,7,8];

        var [a,b,c,d,e] = arr;

        console.log(a,b,c,d,e);

      (2)对象的解构

        var obj = {

          name : 'liming',

          age: 20

        }

        var {name,age} = obj;

        console.log(name,age);    //因为name是关键字,为了不与关键字造成冲突,我们可以给是关键字的属性设置别名。

       (3)对象的解构,并为对象的属性设置别名

        var obj = {

          name:'liming',

          age:12

        }

        var {name:n,age:a} = obj;

        console.log(name,age);

      (4)对象中的对象解构

        var obj = {

          name:'liming',

          age:20,

          obj2:{

            sex:'nan',

          }

        }

      var {  obj2 : { sex } } = obj;

      console.log(sex);

      (5)字符串的解构

        var [a,b,c] = 'sdfghhjjkiy';

        console.log(a,b,c);

      (6)不能够解构的元素【总体来说,不能够解构的元素,都是不能够进行遍历的元素】

        let [a] = 10;

        let [a] = null;

        let [a] = true;

        let [a] = false;

        let [a] = undefined;

        let [a] = NaN;

        let [a] = [];   //undefined

        let {a} = {};  //undefined

      (7)es6中的拓展运算符

        在不知道参数的情况下,可以使用...来传递参数

        function fn(...num) {

          var sum = 0;

          for(let i=0;i<num.length;i++) {

            sum += num[i];

          }

          return sum;

        }

        console.log(fn(1,2,3,4,5,6,7,8,9,10));

        传递的是数组,进行结构传递的方式

        arr = [1,2,3,4,5,6,7,8,9,10];

        function fn(...num) {

          console.log(num);

        }

        fn(...arr);

      

        

  • 相关阅读:
    开源项目
    [Accessibility] Missing contentDescription attribute on image [可取行]失踪contentDescription属性图像
    Android 布局 中实现适应屏幕大小及组件滚动
    EF 错误记录
    EasyUI 加载时需要显示和隐藏 panel(面板)内容破版问题
    IE 报表缩放后页面破版
    VS 2017 引入nuget 问题
    SSRS 报表显示页面 asp net session丢失或者找不到 asp net session has expired or could not be found()
    log4net 配置
    网站
  • 原文地址:https://www.cnblogs.com/lxz123/p/11749037.html
Copyright © 2011-2022 走看看