Konvertierung des Operatortyps in JavaScript (grafisches Tutorial)

Kürzlich habe ich festgestellt, dass die Frage der Operatortypkonvertierung häufig in Front-End-Interviewfragen auftaucht. Daher finden Sie hier eine Zusammenfassung von Beispielen für die Operatortypkonvertierung in JavaScript. Freunde, die sie benötigen, können sich darauf beziehen

Zunächst einmal stellen wir ein paar Fragen! Der Vereinheitlichung halber werde ich diese Fragen nicht zusammenschreiben. In Interviewfragen werden diese Fragen oft verwechselt, was Sie noch mehr verwirrt. Um die Darstellung zu erleichtern, habe ich einige Fragen hier in Modulen geschrieben. Sie können einen Blick darauf werfen!

Implizite Konvertierung der Operatorzeichenfolge
Multiplikation

 console.dir("-------以下乘法---------");
 console.dir(5*"5");
 console.dir(5*"a");
 console.dir(5*NaN);
 console.dir(5*null);
 console.dir(5*undefined);
 console.dir(5*5);
 console.dir("-------以上乘法---------");

Division

 console.dir("-------以下除法---------");
 console.dir(5/"5");
 console.dir(5/"a");
 console.dir(5/NaN);
 console.dir(5/null);
 console.dir(null/5);
 console.dir(5/undefined);
 console.dir(5/5);
 console.dir(5/0);
 console.dir(0/5);
 console.dir(0/0);
 console.dir("-------以上除法---------");

Rest, Modulo

 console.dir("-------以下取余、求模--------");
 console.dir(16%"5");
 console.dir(5%"a");
 console.dir(5%NaN);
 console.dir(5%null);
 console.dir(null%5);
 console.dir(5%undefined);
 console.dir(5%5);
 console.dir(5%0);
 console.dir(0%5);
 console.dir(0%0);
 console.dir("-------以上取余、求模---------");

Addition

 console.dir("-------以下加法--------");
 console.dir(16+"5");
 console.dir(5+"a");
 console.dir(5+NaN);
 console.dir(5+null);
 console.dir(5+undefined);
 console.dir(5+5);
 console.dir("两个数的和是"+5+5);
 console.dir("两个数的和是"+(5+5));
 console.dir("-------以上加法--------");

Subtraktion

 console.dir("-------以下减法--------");
 console.dir(16-"5");
 console.dir(5-"a");
 console.dir(5-NaN);
 console.dir(5-null);
 console.dir(5-undefined);
 console.dir(5-5);
 console.dir(5-true);
 console.dir(5-"true");
 console.dir(5-"");
 console.dir("两个数的差是"+5-5);
 console.dir("两个数的差是"+(5-5));
 console.dir("-------以上减法--------");

Vergleichsoperator

 console.dir("-------以下关系操作符--------");
 console.dir(16>"5");
 console.dir("16">"5");
 console.dir(5<"a");
 console.dir(5>=NaN);
 console.dir(5<NaN);
 console.dir(NaN>=NaN);
 console.dir(5>=null);
 console.dir(5>=undefined);
 console.dir(5>=5);
 console.dir(5>=true);
 console.dir(5>="true");
 console.dir(5>="");
 console.dir("Brick">"alphabet");
 console.dir("brick">"alphabet");
 console.dir("-------以上关系操作符--------");

Multiplikation

 console.dir(5*"5"); //25
 console.dir(5*"a");//NaN
 console.dir(5*NaN);//NaN
 console.dir(5*null);0
 console.dir(5*undefined);//NaN
 console.dir(5*5);//25

Lassen Sie uns über das implizite Konvertierungsprinzip der Multiplikation sprechen:

1. Wenn die beiden Werte beide Zahlen sind, dann multiplizieren Sie sie direkt (Ich glaube, jeder kennt es, es ist dasselbe wie in der Grundschulmathematik, und Sie müssen auf das Vorzeichen der Zahl achten. Wenn der Produktwert den numerischen Darstellungsbereich von ECMAscript überschreitet, wird Unendlichkeit (positiv) zurückgegeben Unendlich) oder -Infinity (negative Unendlichkeit)
2 . Wenn eine Zahl NaN ist, ist das Ergebnis NaN
3. Wenn Infinity mit 0 multipliziert wird, ist das Ergebnis NaN
4 B. eine Zahl und der andere kein numerischer Wert ist, verwenden Sie dann zuerst die Funktion Number(), konvertieren Sie sie und multiplizieren Sie den konvertierten Wert mit der Zahl. Wenn das konvertierte Ergebnis NaN erscheint, ist das Ergebnis NaN.
Division

 console.dir(5/"5");//1  将字符转化为数字进行相除
 console.dir(5/"a");//NaN  将“a”用Number()函数进行转化，出来的值是NaN，结果就是NaN
 console.dir(5/NaN);//NaN
 console.dir(5/null);//Infinity null用Number()函数进行转化，结果是0，那么5/0是正无穷
 console.dir(null/5);//0 同上0/5是0
 console.dir(5/undefined);//NaN  undefined 用Number()进行转化，结果是NaN
 console.dir(5/5);//1
 console.dir(5/0);//Infinity
 console.dir(0/5);//0
 console.dir(0/0);//NaN //0除以0结果是NaN

Sprechen wir über das implizite Umrechnungsprinzip der Division:

Ähnlich wie bei der Multiplikation, nur dass 0/0 NaN ergibt
Rest und Modul

Rest wird am häufigsten in Projekten verwendet, wenn ungerade und gerade Zahlen ermittelt werden. Wir verwenden oft einen Wert und 2, um den Rest zu ermitteln. Wenn das Ergebnis 0 ist, ist die Zahl gerade, und wenn das Ergebnis 1 ist, ist die Zahl ungerade.

Sehen Sie sich die obige Frage an:

 console.dir(16%"5"); //1 将字符串5通过Number()转化为5然后进行求余
 console.dir(5%"a");//NaN
 console.dir(5%NaN);//NaN
 console.dir(5%null);//NaN 将null 通过Number()转化，结果是0，然后计算5%0 ，结果是NaN
 console.dir(null%5);//0 同上0%5 取余，结果是0
 console.dir(5%undefined);//NaN
 console.dir(5%5);//0
 console.dir(5%0);//NaN
 console.dir(0%5);//0
 console.dir(0%0);//NaN
console.dir(Infinity%Infinity);//NaN
console.dir(5%Infinity);//5
 console.dir(Infinity%5); //NaN

Lassen Sie uns über das verbleibende Prinzip der impliziten Konvertierung sprechen:

Es ist dasselbe wie die Multiplikation, lassen Sie mich über den speziellen Teil sprechen! Wir alle kennen die Konzepte von Dividende und Divisor, wir haben sie in der Grundschule gelernt.

1. Die Dividende ist unendlich und der Divisor ist ein endlicher Wert, dann ist das Ergebnis NaN
2. Die Dividende ist ein endlicher Wert und der Divisor ist 0, dann ist das Ergebnis NaN
3. Infinity% Das Ergebnis von Infinity ist NaN
4 Die Dividende ist ein endlicher Wert, der Divisor ist ein unendlicher Wert und das Ergebnis ist die Dividende.
5. Die Dividende ist 0 und das Ergebnis ist 0
Subtraktion

Sehen Sie sich das Beispiel oben an!

 console.dir(16-"5");//11
 console.dir(5-"a");//NaN
 console.dir(5-NaN);//NaN
 console.dir(5-null);//5
 console.dir(5-undefined);//NaN
 console.dir(5-5);//0
 console.dir(5-true);//4
 console.dir(5-"true");//NaN
 console.dir(5-"");//5
 console.dir(5-Infinity);//-Infinity
 console.dir(Infinity-Infinity);//NaN
 console.dir("两个数的差是"+5-5);//NaN
 console.dir("两个数的差是"+(5-5));//两个数的差是0

Lassen Sie uns über das implizite Konvertierungsprinzip der Subtraktion sprechen:

Wie oben, ich werde nicht über dieselben sprechen, sondern über diejenigen, die es nur bei der Subtraktion gibt.

1. Das Ergebnis von Infinity-Infinity ist NaN
2. Das Ergebnis von -Infinity-Infinity ist -Infinity
3. Das Ergebnis der Subtraktion von Infinity von einer Zahl ist -Infinity
4. Infinity-(-Infinity) Das Ergebnis ist Infinity
5. Wenn der Operand ein Objekt ist, rufen Sie die Methode valueOf des Objekts auf. Wenn das Ergebnis NaN ist, ist das Ergebnis NaN. Wenn keine valueOf-Methode vorhanden ist, wird die toString()-Methode aufgerufen und der resultierende String in einen numerischen Wert umgewandelt.
Relationale Operatoren

Relationale Operatoren geben einheitlich wahr oder falsch zurück

 console.dir(16>"5"); //true
 console.dir("16">"5");//false
 console.dir(5<"a");//false
 console.dir(5>=NaN);//false
 console.dir(5<NaN);//false
 console.dir(NaN>=NaN);//false
 console.dir(5>=null);//true
 console.dir(5>=undefined);//false
 console.dir(5>=5);//true
 console.dir(5>=true);//true
 console.dir(5>="true");//false
 console.dir(5>="");//true 
 console.dir("Brick">"alphabet");//false B的字符串编码值是66 ，而a的字符串编码是97.因此false
 console.dir("brick">"alphabet");//true 小写字母b比a大，所以是true

Das Folgende ist das implizite Konvertierungsprinzip relationaler Operatoren:

Es ist immer noch so das Gleiche wie oben, ich werde nicht über dieselben sprechen.

Wenn die beiden verglichenen Zahlen beide Zeichenfolgen sind, werden die den Zeichenfolgen entsprechenden Zeichenfolgencodierungswerte verglichen.

Additionsoperation

Implizite Konvertierung der Additionsoperation ist, dass sich die implizite Konvertierung der Additionsoperation von der vorherigen unterscheidet , solange einer eine Zahl ist, verwendet der andere standardmäßig auch Number() zur Zahlenkonvertierung. Die Additionsoperation ist anders. Solange eine der Additionsoperationen eine Zeichenfolge ist, wird die andere in eine Zeichenfolge umgewandelt und anschließend werden die Zeichenfolgen verkettet!

 console.dir(16+"5"); //156
 console.dir(5+"a");//5a
 console.dir(5+NaN);//NaN
 console.dir(5+null);//5
 console.dir('5'+null);//5null
 console.dir(5+undefined);//NaN
 console.dir(null+undefined);//NaN
 console.dir(5+5);//10
 console.dir("两个数的和是"+5+5);//两个数的和是55
 console.dir("两个数的和是"+(5+5));//两个数的和是10

Sprechen wir über das implizite Konvertierungsprinzip von Additionsoperatoren:

1 Wenn einer ein String ist, wird der andere zum Spleißen ebenfalls in einen String umgewandelt. Wenn einer ein String ist und der andere null oder undefiniert ist, ruft null oder undefiniert, wenn er hinzugefügt wird, die String()-Methode auf, um den String „null“ oder „undefiniert“ zu erhalten und ihn dann zu verbinden.
2. Wenn einer Zahl Null oder Undefiniert hinzugefügt wird, sollte die Null oder Undefiniert in Number() konvertiert und dann hinzugefügt werden.
3. Die übrigen Prinzipien ähneln den anderen, daher werde ich nicht auf Details eingehen.

Implizite Konvertierung mit doppeltem GleichheitszeichenFühren Sie den folgenden Code einmal aus. Ich glaube, Sie werden ihn auf natürliche Weise verstehen~

var a;

console.dir(0 == false);//true

console.dir(1 == true);//true

console.dir(2 == {valueOf: function(){return 2}});//true

console.dir(a == NaN);//false
console.dir(NaN == NaN);//false

console.dir(8 == undefined);//false

console.dir(1 == undefined);//false

console.dir(2 == {toString: function(){return 2}});//true

console.dir(undefined == null);//true

console.dir(null == 1);//false

console.dir({ toString:function(){ return 1 } , valueOf:function(){ return [] }} == 1);//true

console.dir(1=="1");//true

console.dir(1==="1");//false

Das Obige habe ich für alle zusammengestellt, ich hoffe es wird Ihnen in Zukunft nützlich sein. Jeder ist hilfreich.

Verwandte Artikel:

Groß angelegte Entwurfsmuster für JavaScript-Anwendungsarchitekturen (fortgeschritten)

Detaillierte Interpretation in JavascriptVerständnis von undefiniert und null

Verständnis von Javascript-Objektliteralen (grafisches Tutorial)

Das obige ist der detaillierte Inhalt vonKonvertierung des Operatortyps in JavaScript (grafisches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!