首页 > 其他分享 >红宝书细节知识点

红宝书细节知识点

时间:2022-10-31 18:46:49浏览次数:52  
标签:知识点 arr console log 细节 let 数组 红宝书 const

1. 通过let const可以提高性能

  • ES6增加这两个关键字不仅有助于改善代码风格,而且同样有助于改进垃圾回收的过程。因为const和let都以块(而非函数)为作用域,所以相比于使用var,使用这两个新关键字可能会更早地让垃圾回收程序介入,尽早回收应该回收的内存。在块作用域比函数作用域更早终止的情况下,这就有可能发生。

2. 隐藏类

  • V8在运行期间会把创建的对象与隐藏类关联起来,用来跟踪他们的属性特征。
    function Article(){
     this.text = "这是一个构造器"
    }
    
    let a1 = new Article()
    let a2 = new Article()
    
    上面代码两个实例共享相同的隐藏类,因为两个实例共享同一个构造函数和原型,但是如果执行了如下代码
    a2.author = "Jake"
    
    这个时候出现的Article实例就对应两个不同的隐藏类,会开辟新内存,所以需要做到“先创建再补充”,在构造器内部一次性声明所有的属性
    function Article(author) {
     this.title = '这是一个构造器';
     this.author = author;
     }
     let a1 = new Article();
     let a2 = new Article('Jake');
    
    同样的,动态删除属性也会创建新的隐藏类,最佳的实践方法就是把不想要的属性设置为null,可以保持隐藏类不变。

3.原始值包装类型

  • 为了方便操作原始值,JS提供了三种特殊的引用类型:Boolean,Number和String。和引用类型具有一样的特点,但是也具有与各自原始类型对象的特殊行为。每当用到某个原始值的方法或属性时,后台都会创建一个相应原始包装类型的对象

    let s1 = "这是一个字符串";
    let s2 = s1.substring(2);
    

    上面s1创建了一个原始值,第二行却又使用原始值调用substring()方法。
    一般原始值本身并不是对象,逻辑上讲应该是没有方法的,但是却可以调用方法,本质其实是后台做了很多的处理。

    第二步访问s1时,是以读模式访问,也就是要从内存中读取变量保存的值。在以读模式访问字符串值的时候,后台都会执行:

    1. 创建一个String实例
    2. 调用实例上特定的方法
    3. 销毁实例
    //上面两行代码的拆解
    let s1 = new String("这是一个字符串")
    let s2 = s1.substring(2)
    let s1 = null
    

    这中行为让原始值具有了对象的行为。布尔值和Number也是会发生上面的步骤的,只不过使用的是别的包装类型

    注意:引用类型和原始值的包装类型区别主要在于其生命周期。在通过new实例化引用类型后,得到的实例会在离开作用域的时候被销毁,而创建的包装类型只存在于访问它的那段代码执行期间,所以我们在使用的时候是不可以给原始值添加属性和方法的。

  • 如果给Object传字符串,则会创建一个String实例,如果是数值,则会创建Number实例,Boolean同理

    let obj = new Object("字符串")
    console.log(obj instanceof String); //true
    

    使用new调用原始值包装类型的构造函数,与调用同名的转型函数不一样

    let value = "25";
    let number = Number(value); // 转型函数
    console.log(typeof number); // "number"
    let obj = new Number(value); // 构造函数
    console.log(typeof obj); // "object"
    

    变量number保存的是一个值25的原始数值,而变量obj保存的是一个Number的实例。

4. 集合引用类型

  • Array构造函数有两个Es6新增用于创建数组的静态方法:from()和of(),from用于将数组结构转化成数组实例,of将参数转换成数组实例
    • Array.from()

      Array.from("Array") //[ 'A', 'r', 'r', 'a', 'y' ]
      Array.from("我操,说藏话了")//['我', '操',',', '说','藏', '话','了']
      

      form()还有第二个参数,可以增强新数组的值

      const a1 = [1, 2, 3, 4, 5];
      const a2 = Array.from(a1, (x) => x * 2);
      console.log(a2);//[ 2, 4, 6, 8, 10 ]
      //这不比map好用?这不比map好用?!
      
    • Array.of()

      //把参数转换成数组
      console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4]
      console.log(Array.of(undefined)); //[undefined]
      
    • 数组空位

      const a1 = [, , , , ,];
      console.log(a1.length); //5
      console.log(a1);  //[,,,,,]
      
      const options = [1,,,,5];
      // map()会跳过空位置
      console.log(options.map(() => 6)); // [6, undefined, undefined, undefined, 6]
      // join()视空位置为空字符串
      console.log(options.join('-')); // "1----5"
      
    • 数组索引
      数组中元素的数量保存在length属性中,并且始终返回0或大于0的值

      重点来了:length不光是只读的,还可以通过修改它对数组末尾删除或者添加元素

      let colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组
      colors.length = 2;
      alert(colors[2]); // undefined
      
      let colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组
      colors.length = 4;
      alert(colors[3]); // undefined
      
      let colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组
      colors[99] = "black"; // 添加一种颜色(位置99)
      alert(colors.length); // 100
      

      数组最多可以包含4294967295个元素,基本满足开发需求

    • 迭代器方法

      • keys():返回数组索引。
      • values():返回数组元素。
      • entries():返回:索引,值。
      const arr = ['test1','test2','test3','test4']
      console.log([...arr.keys()]);
      //[ 0, 1, 2, 3 ]
      console.log([...arr.values()]);
      //[ 'test1', 'test2', 'test3', 'test4' ]
      console.log([...arr.entries()]);
      // [ [ 0, 'test1' ], [ 1, 'test2' ], [ 2, 'test3' ], [ 3, 'test4' ] ]
      

      解构的方式获取键值对变的非常容易

      for (const [idx, element] of arr.entries()){
        console.log(idx);
        console.log(element);
      }
      

      如果数组中某一项是null或undefined,则在join()、toLocaleString()、toString()和valueOf()返回的结果中会以空字符串表示

    • 排序方法

      • sort():默认情况升序排序数组,从小到大,而且sort是将每一项调用String()转换成字符串后排序。
      const arr = [1,2,3,4,5,9,10,11,12,13,14,15]
      console.log(arr.sort())
      //[1, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 9]
      

      默认方法排序不准确,正常情况下需要传参

      • 断言函数(找到元素后不会再向下执行)
      const arr = [
          { name: "a", age: 18 },
          { name: "b", age: 20 },
          { name: "c", age: 22 },
          { name: "d", age: 25 }
        ]
      console.log(arr.find(item => item.age < 22)) //{ name: 'a', age: 18 }
      console.log(arr.findIndex(item => item.age < 25)) //0
      
      • 归并方法(reduce和reduceRight)
      const arr = [1, 2, 3, 4, 5]
      
      let arrSum = arr.reduce((pre, cur, index, array) => {
          return pre + cur
      },15)
      
      console.log(arrSum); //30
      

标签:知识点,arr,console,log,细节,let,数组,红宝书,const
From: https://www.cnblogs.com/JsonPig/p/16845326.html

相关文章

  • 原码、反码、补码知识点总结
    好久没接触这三个熟悉而陌生的概念,以前也没理解透彻这三个概念的真正含义与作用,现在来重新做一个清晰而简单的总结。首先,原码、反码、补码只是机器中对于数字的三种不同的表......
  • 关于前端面试你需要知道的知识点
    如何在ReactJS的Props上应用验证?当应用程序在开发模式下运行时,React将自动检查咱们在组件上设置的所有props,以确保它们具有正确的数据类型。对于不正确的类型,开发模......
  • 使用通配符后的细节
    packagecom.msb.test05;importjava.util.ArrayList;importjava.util.List;/***@author:liu*日期:15:37:52*描述:IntelliJIDEA*版本:1.0*/publi......
  • C语言核心知识点大汇总
    C语言高级部分总结一、内存内存就是程序的立足之地,体现内存重要性。内存理解:内存物理看是有很多个Bank(就是行列阵式的存储芯片),每一个Bank的列就是位宽,每一行就是Words,则存......
  • 旋转矩阵知识点
    1、二维旋转矩阵的推导1.1、几何推导方式旋转矩阵(RotationMatrix)的推导-知乎(zhihu.com)     1.2、极坐标推导方式(7条消息)二维旋转......
  • 13个QA带你了解线上压测的知识点
    摘要:设计一个线上压测系统能让我们学习到多少东西?这13个问题看你能否搞定。本文分享自华为云社区《设计一个线上压测系统能让我们学习到多少东西?13个问题看你能否搞定》,作......
  • 13个QA带你了解线上压测的知识点
    摘要:设计一个线上压测系统能让我们学习到多少东西?这13个问题看你能否搞定。本文分享自华为云社区《​​设计一个线上压测系统能让我们学习到多少东西?13个问题看你能否搞定​......
  • Spring系列之零碎知识点
    ​​classpath​​​和​​classpath*​​​​classpath​​​和​​classpath*​​​区别:​​​classpath​​​:只会到你指定的class路径中查找找文件;​​​classpath*​......
  • Kafka Consumer细节
    pollIO模型与内部线程Consumer消费多个来自多个Topic的多个分区的数据,在新版本中,它使用类似select、epoll这种IO模型来达到用一个线程管理多个来源的数据的功能。不过,Co......
  • 1.天线知识点
    天线知识点1.天线实现宽带方法多谐振天线可以实现宽阻抗宽带。A.难点:如何产生或控制多个谐振点。常用的方法:多模辐射单元、多天线单元、电抗或寄生单元加载、阻抗变换......