Maison > interface Web > js tutoriel > le corps du texte

Introduction à la conversion de type implicite des opérateurs de comparaison en JavaScript (avec exemples)

不言
Libérer: 2019-03-25 14:26:37
avant
2324 Les gens l'ont consulté

Cet article vous présente une introduction à la conversion de type implicite des opérateurs de comparaison en JavaScript (avec des exemples). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Je crois que vous voyez souvent '==' et '===' dans votre code, mais comprenez-vous vraiment les opérateurs de comparaison et leurs conversions implicites ?

Opérateur de congruence ===

Explication : correspondance stricte, pas de conversion de type, le type de données et la valeur doivent être exactement les mêmes

先判断类型,如果类型不是同一类型的话直接为false;

1 对于基本数据类型(值类型): Number,String,Boolean,Null和Undefined:两边的值要一致,才相等
      console.log(null === null)   // true
      console.log(undefined === undefined)  // true
   注意: NaN: 不会等于任何数,包括它自己
   console.log(NaN === NaN)  // false 

2 对于复杂数据类型(引用类型): Object,Array,Function等:两边的引用地址如果一致的话,是相等的
     arr1 = [1,2,3];
     arr2 = arr1;
     console.log(arr1 === arr2)   // true
Copier après la connexion

Opérateur d'égalité = =

Correspondance non stricte : la conversion de type est possible, mais il existe cinq situations avec des conditions préalables
(Le code suivant utilise x == y à titre d'exemple)

X et y sont tous deux nuls ou undefined :
Règles : aucune conversion de type implicite, renvoie inconditionnellement vrai

console.log ( null == undefined );//true
console.log ( null == null );//true
console.log ( undefined == undefined );//true
Copier après la connexion

x ou y est NaN : NaN n'est égal à aucun nombre
Règles : il n'y a pas de conversion de type implicite, renvoie inconditionnellement false

console.log ( NaN == NaN );//false
Copier après la connexion

x et y sont une chaîne, un booléen, un nombre
Règles : il existe une conversion de type implicite, qui convertira les données qui ne sont pas de type numérique en nombre

console.log ( 1 == true );//true    (1) 1 == Number(true)
console.log ( 1 == "true" );//false   (1) 1 == Number('true')
console.log ( 1 == ! "true" );//false  (1) 1 == !Boolean('true')  (2) 1 == !true  (3) 1 == false  (4)1 == Number(false)
console.log ( 0 == ! "true" );//true
console.log(true == 'true') // false
Copier après la connexion

x ou y est un type de données complexe : la valeur d'origine du type de données complexe sera d'abord obtenue, puis comparée
La valeur d'origine du type de données complexe : appelez d'abord la méthode valueOf, puis appelez la toString method
valueOf : Général Se retourne par défaut
Array toString : Par défaut, la méthode de jointure est appelée pour épisser chaque élément et la chaîne épissée est renvoyée

console.log ( [].toString () );//空字符串
console.log ( {}.toString () );//[object Object]
注意:  空数组的toString()方法会得到空字符串,
      而空对象的toString()方法会得到字符串[object Object] (注意第一个小写o,第二个大写O哟)

console.log ( [ 1, 2, 3 ].valueOf().toString());//‘1,2,3’
console.log ( [ 1, 2, 3 ] == "1,2,3" );//true  (1)[1,2,3].toString() == '1,2,3'  (2)'1,2,3' == '1,2,3'
console.log({} == '[object Object]');//true
Copier après la connexion

x et y sont les deux types de données complexes :
Les règles comparent uniquement l'adresse, si les adresses sont cohérentes, renvoient vrai, sinon renvoient faux

var arr1 = [10,20,30];
var arr2 = [10,20,30];
var arr3 = arr1;//将arr1的地址拷贝给arr3
       
console.log ( arr1 == arr2 );//虽然arr1与arr2中的数据是一样,但是它们两个不同的地址
console.log ( arr3 == arr1 );//true  两者地址是一样
       
console.log ( [] == [] );//false
console.log ( {} == {} );//false
Copier après la connexion

Questions d'entretien classiques

注意:八种情况转boolean得到false: 0 -0 NaN undefined null '' false document.all()

console.log([] == 0); //true 
  // 分析:(1) [].valueOf().toString() == 0  (2) Number('') == 0  (3) false == 0  (4) 0 == 0
console.log(![] == 0); //true
  // 分析: 逻辑非优先级高于关系运算符 ![] = false (空数组转布尔值得到true)
        
console.log([] == []); //false
// [] 与右边逻辑非表达式结果比较
//(1) [] == !Boolean([])   (2) [] == !true  (3)[] == false  (4) [].toString() == false  (5)'' == false   (6)Number('0') == Number(false)
console.log([] == ![]); //true

onsole.log({} == {}); //false
// {} 与右边逻辑非表达式结果比较
//(1){} == !{} (2){} == !true  (3){} == false  (4){}.toString() == false  (5)'[object Object]' == false  (6)Number('[object Object]') == false
console.log({} == !{}); //false
Copier après la connexion

Questions d'entretien anormales

 var  a = ???
  if(a == 1 && a == 2 && a == 3 ){
      console.log(1)
  }

//如何完善a,使其正确打印1


//答案
var a = {
  i : 0,    //声明一个属性i
    valueOf:function ( ) {
     return ++a.i;    //每调用一次,让对象a的i属性自增一次并且返回
    }
 }
 if (a == 1 && a == 2 && a == 3){  //每一次运算时都会调用一次a的valueOf()方法
  console.log ( "1" );
 }
Copier après la connexion

Cet article se termine ici. C'est fini. Pour un contenu plus passionnant, vous pouvez faire attention à la colonne Tutoriel vidéo JavaScript du site Web PHP chinois !

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!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal