Compétences JavaScript : unboxing et conversion de type

Cet article vous apporte des connaissances pertinentes sur javascript, qui présente principalement les problèmes liés au déballage et à la conversion de type. La boxe fait référence à l'opération de conversion des types de données de base en types de référence correspondants, j'espère que ce sera le cas. être utile à tout le monde.

Recommandations associées : Tutoriel Javascript

Types de données de base : string, number, booleanstring、number、boolean

引用类型：object、function

不存在的类型：undefined

String、Number、Boolean分别属于string、number、boolean三个原始类型的包装类型，它们的对象属于引用类型。

装箱

装箱是指把基本数据类型转换为对应的引用类型的操作，该过程主要是指string、number、boolean类型的数据，通过String、Number、Boolean进行包装成为引用类型数据的过程。

// 隐式装箱var s1 = 'Hello World'; 
var s2 = s1.substring(2);

上面第二行代码的执行步骤其实是这样的：

1. 使用new String('Hello World')创建一个临时的实例对象；
2. 使用临时对象调用substring方法；
3. 将执行结果赋值给s2；销毁临时的实例对象。

上面的步骤转换为代码，如下：

// 显式装箱var s1 = 'Hello World'; 
var tempObj = new String('Hello World');
var s2 = tempObj.substring(2);

拆箱

拆箱是把引用类型转换为基本的数据类型。

关于拆箱过程中的ToPrimitive

类型转换

运算符对于两端的变量，都有一个期待类型，在javascript中，凡是不满足运算符期待类型的变量，都会做做隐式转换。

逻辑运算符

在进行逻辑运算时，隐式转换只有一个标准：只有 null 、undefined、 ''、 NaN、 0和 false 表示 false，其他的情况都是 true，比如 {} , []。

算术运算符

1. 如果算术运算符两端均为number类型的数据，直接进行计算；

2. 如果算术运算符两端存在非number的基本数据类型，则对非number的运算数使用Number()进行装箱，然后对返回值进行拆箱为number类型，参与计算；

3. 算术运算符两端存在引用数据类型，则先对引用类型进行拆箱操作，如果结果为非number类型，则根据条件2执行，否则执行条件1。

1 - true 
// 0， 首先 Number(true) 转换为数字 1， 然后执行 1 - 11 - null 
// 1,  首先把 Number(null) 转换为数字 0， 然后执行 1 - 01 * undefined 
//  NaN, Number(undefined) 转换为数字是 NaN , 然后执行 1 * NaN2 * ['5'] 
//  10， ['5'] 依照ToPrimitive规则进行拆箱会变成 '5', 然后通过 Number('5') 进行拆装箱再变成数字 5123 + {valueOf:()=>{return 10}}   
// 133  {valueOf:()=>{return 10}} 依照ToPrimitive规则会先调用valueOf，获得结果为10

当+作为单目运算符出现在变量的前面时，表示的意思是将变量转换为Number类型

+"10" 	
// 10  同 Number("10")+['5']  
// 5   ['5']依照ToPrimitive规则会变成 '5', 然后通过`Number`的拆箱操作再变成数字 5

字符串连接符

字符串连接符的符号同算术运算符的+ 。

1. 如果算术运算符两端均为string类型的数据，直接进行连接
2. 如果运算符的两端存在非string的基本类型，则对非string的基本类型数据使用String()进行装箱，然后对返回值进行拆箱为基本类型，参与字符串拼接。
3. 当+两端两端存在引用数据类型，则先对引用类型进行拆箱操作，如果结果为非string类型，则根据条件2执行，否则执行条件1。

关系运算符

• NaN和其他任何类型，做任何关系运算永远返回false（包括和他自己）。如果想判断一个变量是不是NaN ， 可以通过Number.isNaN()来判断。

• null == undefined比较结果是true，除此之外，null、undefined和其他的（不包括它们自身）任何结果的比较值都为false。

  这里是规则定义的，null 为 object 的类型，可是调用valueOf或者toString

  Types de référence : objet, fonction

Types non existants : non défini

• String, Number , Boolean appartiennent respectivement aux types d'empaquetage des trois types primitifs : string, number et boolean code>. L’objet est de type référence.

  🎜

  Boxing

  🎜Boxing fait référence à l'opération de conversion des types de données de base en types de référence correspondants. Ce processus fait principalement référence à string, number, <. les donn de type code>boolean sont regroupées dans des données de type référence via String, Number, Boolean. 🎜

  {} == !{}  
  // false   Number({}.valueOf().toString())==> NaN , 所以题目等同于 NaN == false , NaN 和 任何类型比较都是 false[] == []  
  // false  内存地址不同![] == 0  
  // true   ![]==>false , 所以题目等同于 false==0 , Number(false)==>0 ,  所以结果为 true

  🎜Les étapes d'exécution du code de deuxième ligne ci-dessus sont en fait les suivantes : 🎜

  🎜Utilisez new String('Hello World') pour créer une instance temporaire object ;🎜🎜Utilisez l'objet temporaire pour appeler la méthode substring ; 🎜🎜Attribuez le résultat de l'exécution à s2 ; 🎜

  🎜Les étapes ci-dessus sont converties en code comme suit : 🎜

      - 第一步，![] 会变成 false
      - 第二步，[]的valueOf是[]，[]是引用类型，继续调用toString，题目变成： "" == false
      - 第三步，符号两端转换为Number， 得到 0==0
      - 所以， 答案是 true

  Unboxing

  🎜Unboxing consiste à convertir le type de référence en un type de données de base. 🎜🎜À propos de ToPrimitive pendant le processus de déballage🎜

  Conversion de type

  🎜L'opérateur a un type attendu pour les variables aux deux extrémités. En javascript, tout ce qui ne répond pas aux attentes de l'opérateur. Les variables de type seront implicitement converties. 🎜

  Opérateurs logiques

  🎜Lors de l'exécution d'opérations logiques, il n'existe qu'un seul standard pour la conversion implicite : uniquement null, non défini, '', NaN, 0 et false représentent false, sinon ils sont true , tel que {}, []. 🎜

  Opérateur arithmétique

  🎜🎜Si les deux extrémités de l'opérateur arithmétique sont des données de type numéro, le calcul est effectué directement 🎜🎜🎜🎜Si arithmétique ; S'il existe des types de données de base non numéro aux deux extrémités de l'opérateur, utilisez Number() pour encadrer les opérandes non-numéro, et then La valeur de retour est déballée dans le type number et participe au calcul ; 🎜🎜🎜🎜S'il y a des types de données de référence aux deux extrémités de l'opérateur arithmétique, le type de référence sera déballé en premier Si. le résultat n'est pas de type numéro, il sera exécuté selon la Condition 2, sinon la Condition 1 sera exécutée. 🎜🎜

      - 第一步，[undefined]的valueOf结果为 [undefined]，然后[undefined]通过toString变成 '' ，所以题目变成  '' == false
      - 第二步，符号两端转换为Number， 得到 0==0
      - 所以， 答案是 true ！

  🎜Lorsque + apparaît devant une variable en tant qu'opérateur unaire, cela signifie convertir la variable en type Number🎜

  var a = {
      value: 0,
      valueOf: function() {
          this.value += 1;
          return this.value    }};console.log(a == 1 && a == 2 && a == 3) // true

  Concaténation de chaînes opérateur

  🎜Le symbole de l'opérateur de concaténation de chaînes est le même que l'opérateur arithmétique +. 🎜

  🎜Si les deux extrémités de l'opérateur arithmétique sont des données de type string, connectez-vous directement 🎜🎜S'il existe des types de base autres que string aux deux extrémités de l'opérateur , Utilisez ensuite String() pour encadrer les données de type de base non string, puis déballez la valeur de retour dans un type de base pour participer à l'épissage de chaîne. 🎜🎜Lorsqu'il y a des types de données de référence aux deux extrémités de +, le type de référence sera déballé en premier. Si le résultat n'est pas un type string, alors le type de référence le sera. être déballé selon que la condition 2 est exécutée, sinon la Condition 1 est exécutée. 🎜

  Opérateurs relationnels

  🎜🎜NaN et tout autre type, toute opération relationnelle retournera toujours false (y compris et lui-même ). Si vous souhaitez déterminer si une variable est NaN, vous pouvez utiliser Number.isNaN() pour le déterminer. 🎜🎜🎜🎜null == undefined Le résultat de la comparaison est true, en plus, null, undefined et Any les autres résultats (à l'exclusion d'eux-mêmes) ont une valeur de comparaison de false. 🎜

  🎜Ceci est défini par les règles. null est le type d'objet. Cependant, il y aura des erreurs de syntaxe lors de l'appel de valueOf ou toString

  code>. Le voici directement. Rappelez-vous simplement le résultat. 🎜🎜🎜🎜🎜Situation générale : 🎜

  1. 如果算术运算符两端均为number类型的数据，直接进行计算；
  2. 如果算术运算符两端存在非number的基本数据类型，则对非number的运算数使用Number()进行装箱，然后对返回值进行拆箱为number类型，参与计算；
  3. 算术运算符两端存在引用数据类型，则先对引用类型进行拆箱操作，如果结果为非number类型，则根据条件2执行，否则执行条件1。

{} == !{}  
// false   Number({}.valueOf().toString())==> NaN , 所以题目等同于 NaN == false , NaN 和 任何类型比较都是 false[] == []  
// false  内存地址不同![] == 0  
// true   ![]==>false , 所以题目等同于 false==0 , Number(false)==>0 ,  所以结果为 true

一些题目

1. [] == ![]

       - 第一步，![] 会变成 false
       - 第二步，[]的valueOf是[]，[]是引用类型，继续调用toString，题目变成： "" == false
       - 第三步，符号两端转换为Number， 得到 0==0
       - 所以， 答案是 true

2. [undefined] == false

       - 第一步，[undefined]的valueOf结果为 [undefined]，然后[undefined]通过toString变成 '' ，所以题目变成  '' == false
       - 第二步，符号两端转换为Number， 得到 0==0
       - 所以， 答案是 true ！

3. 如何使a==1 && a==2 && a==3的结果为 true

   var a = {
       value: 0,
       valueOf: function() {
           this.value += 1;
           return this.value    }};console.log(a == 1 && a == 2 && a == 3) // true

4. 如何使a===1&&a===2&&a===3的结果为 true

   // 使用 defineProperty 进行数据劫持var value = 0;Object.defineProperty(window,"a",{
       get(){
           return ++value;
       }})console.log(a===1&&a===2&&a===3)  //true

5. 实现一个无限累加函数

6. 柯里化实现多参累加

相关推荐：javascript学习教程

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!