Trier les données de base JavaScript

Le contenu de cet article concerne le tri des données de base de JavaScript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Après avoir lu quelques informations, combinées avec ES6, l'élévation et MDN, j'ai trié les points de connaissances fondamentaux de JS. En raison de l'espace limité, je présente ici uniquement les connaissances qui me semblent importantes. Pour certaines choses de bon sens, vous pouvez vous référer à l'élévation, et pour approfondir certains points de connaissances de base, vous pouvez vous référer à mes autres articles. Cet article convient à la révision/à l'utilisation surprise des points de connaissances JS et peut également être utilisé comme guide d'entretien frontal.

7 types de données

Type de données de base : stocké dans la mémoire de la pile, fonctionnant sur la valeur

null : pointeur nul, donc typeof null ==>Object

undefined : Non attribué

Number : Number

String : String

Symbole : Une instance est un type de données unique et immuable.

Booléen : valeur booléenne

Type de données de référence : stocké dans la mémoire tas, fonctionnant sur une adresse d'espace

Objet : en particulier, il peut s'agir d'un tableau, d'une fonction, d'une expression régulière, d'une date

Juger le type de données (méthode, avantages et inconvénients)

typeof : ne peut juger que les valeurs non Null dans le type de base, mais ne peut pas juger le type de données de référence (car tous sont des objets)它是操作符

typeof ''  // ==> string
typeof 1  //==> number
typeof true  //==>boolean
typeof undefined  //==>undefined
let b = Symbol() ; typeof b //==>symbol
-----------------下面的判断不了实际类型了-----------------------
typeof function fn(){} //==>function
typeof null //==>object
typeof [1,2,3] //==>object
typeof {} //==>object

instanceof : utilisé pour tester si l'attribut prototype du constructeur apparaît n'importe où dans la chaîne de prototypes de l'objet. Vous pouvez l'utiliser pour juger Array mais il n'est pas assez élégant et comporte certains risques

let arr = [1,2,3]
arr instanceof Array //==>true
arr instanceof Object //==>true

instanceof Le problème avec l'opérateur est qu'il ne dispose que d'un seul environnement d'exécution global. Si la page Web comporte plusieurs frames, il existe en réalité plus de deux environnements d'exécution globaux différents, et donc plus de deux versions différentes de. le constructeur Array. Si un tableau est passé d'une image à une autre, alors le tableau entrant et le tableau créé nativement dans la deuxième image ont des constructeurs différents ---- hauteur page88 (Traduction vernaculaire de l'auteur :

) 风险来至原型链的重写

Constructeur : Le principe repose aussi sur la chaîne de prototypes. Le risque vient aussi de la réécriture de la chaîne de prototypes. Par exemple, lorsque vous faites des allers-retours entre plusieurs frames, ces deux méthodes sont en conflit. Étant donné que chaque iframe a son propre environnement d'exécution, les objets instanciés entre les frames ne partagent pas la chaîne de prototypes entre eux, donc le code de détection ci-dessus échoue

isNaN :

, donc ce n'est pas très utile <.>这个方法会先调用Number

   console.log(isNaN("1px"));   //先调用Number('1px')，返回NaN，然后再调用isNaN(NaN)返回true
   //燃鹅 '1px'客观并不是NaN

--------------------------------------- -- ----------Meilleure méthode--------------------------------

    [1,2,3,1].constructor === Array; // true

Object.prototype.toString.call()

------------------------------ ---- -------------------Méthode élégante--------------------

    Object.prototype.toString.call(null) // ==> [object Null]
    Object.prototype.toString.call([]) // ==> [object Array]

si nécessaire, jugez le tableau séparément

Si vous devez juger null séparément

Array.isArray([]) //==>true

6 façons de déclarer des variables

let a = null
Object.is(a , null) //==>true

ES5 n'a que deux façons de déclarer des variables : commande var et commande de fonction. En plus d'ajouter les commandes let et const, ES6 mentionnera également deux autres méthodes de déclaration de variables dans les chapitres suivants : la commande import et la commande class. Par conséquent, ES6 dispose d’un total de 6 façons de déclarer des variables. --es6

var : promotion de variable, pas de portée au niveau du bloc

Quand il s'agit de var, la promotion de variable doit être mentionnée : la portée actuelle, avant l'exécution de js (fonction), le le navigateur l'apportera var ou fonction sont déclarées et définies à l'avance

Les variables sont uniquement déclarées, les fonctions sont déclarées + attribuées, la définition et l'exécution de la fonction auto-exécutable sont complétées ensemble
Non affectés par les conditions de jugement logique
Ceux en dessous du retour sont également promus, mais ceux à l'intérieur du retour ne sont pas promus
Les instructions en double peuvent être réaffectées. Voilà, mais les noms de variables et de méthodes ne peuvent pas entrer en conflit
const : constante, l'adresse reste inchangée, mais les attributs peuvent être modifiés

let : portée de bloc, zone morte temporaire (TDZ), pas de promotion de variable, les déclarations répétées ne sont pas autorisées

import : solution modulaire es6

//只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。所以下面代码不报错，外层作用域和里层作用域都有一个tmp
let tmp = 123;
    if (true) {
      let tmp =123;    
    }
//ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。
    let tmp = 123;
    if (true) {
      tmp = 'abc'; // ReferenceError
      let tmp;    
    }

classe : solution d'héritage es6

conversion de type

Cette section a trop de contenu et est trop compliquée. En fait, je n'ai pas vraiment envie de l'écrire car peu de gens peuvent écrire du code comme celui-ci. Mais cela est très important et doit être testé lors d’entretiens. Il est recommandé à chacun de maîtriser le contenu et les principes fondamentaux de ce domaine et de ne pas prêter attention aux astuces étranges.

1. Emballage automatique

Trois types d'emballage : Nombre, Booléen, Chaîne

let s1 = '123'
let s2 = s1.slice(2)         // a是基本类型，它是没有slice方法的这里实际上后台完成了一个自动装包
---下面是实际发生的事---------
let s1 = new string('123')
let s2 = s1.slice(2)     
s1 = null      //注意这里用完就销毁了

//所以如果添加某个属性后面是调用不出来的
let s1 = '123'
s1.color = 'red'
console.log(s1.color) // ==> undefind

这些类型（构造函数）基本都重写了它们的tostring方法2. 🎜>

Number : Convertissez les valeurs d'autres types de données en type numérique

    console.log(Number({}));//NaN
    console.log(Number(null));// 0
    console.log(Number(undefined));// NaN
    console.log(Number([]));// 0
    console.log(Number(""));// 0
    console.log(Number(true));// 1
    console.log(Number(false));

parseInt : Une méthode souvent utilisé pour extraire des nombres de chaînes ; identifier la chaîne de gauche à droite jusqu'à ce qu'un nombre invalide soit rencontré, arrêter et renvoyer le numéro trouvé

toFixed : La méthode de conservation du nombre de décimales,

  console.log(parseInt("12px12"));// 12
  console.log(parseInt("12.666.777px12"));// 12
  console.log(parseInt("px12.666px12"));// NaN
  console.log(parseInt(""));// NaN
  console.log(parseInt(true));// NaN
  console.log(parseInt({}));// NaN
  console.log(parseInt([]));// NaN
  console.log(parseInt(null));// NaN
  console.log(parseInt(undefined));// NaN

 ; Convertit la chaîne en nombre (

), puis effectue le calcul,

• 返回值是一个字符串

    console.log(Number("1px"));   //==> NAN
    console.log(parseInt("1px"));   //==> 1
    console.log(parseInt("p1px"));   //==> NaN

Veuillez consulter le tableau ci-dessous pour savoir s'il faut appeler une chaîne ou un numéro

            || undefined | null   | boolean | number | string | object |
=========================================================================
 undefined  || number    | number | number  | number | string | string | 
 null       || number    | number | number  | number | string | string | 
 boolean    || number    | number | number  | number | string | string | 
 number     || number    | number | number  | number | string | string | 
 string     || string    | string | string  | string | string | string | 
 object     || string    | string | string  | string | string | string |

    //字符串和任何类型相加都是调用String
    var  a = typeof 10 + true + [] + null + undefined+{};
    console.log(a); //==>numbertruenullundefined[object Object]，{}
    console.log("6px"+undefined); ==> 6pxundefined
    console.log(NaN+"undefined");==> NaNundefined
    //经典面试题
    [1,2]+[2,1]  //==>都调用toString '1,2'+'2,1'===>'1,22,1'

5.布尔值Boolean

其他数据类型转布尔类型是false有且只有五个值： 0  ""  NaN null  undefined  
所以boolean({}) 或者boolean([]) 都是真

6.==和===

===是全等，==是类型转化后再判断，规则比较复杂。这里我认为除了准备面试需要看看，平时基本不会用，所以这个知识性价比非常低，学了用不到也会忘，大家自己把握，详细规则可以搜我其他文章
平时除了判断a是否是undefined或者是null(jq源码里面都用法)都时候其他情况下都用===

console.log(null==undefined) // true
console.log(undefined==undefined) // true

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!