Home Web Front-end JS Tutorial Detailed explanation of the implicit conversion mechanism of double equal sign (==) in Javascript

Detailed explanation of the implicit conversion mechanism of double equal sign (==) in Javascript

Jan 02, 2018 am 09:32 AM
javascript js mechanism

There are two types of equality relationships in Javascript: double equal sign (==) and triple equal sign (===). The double equal sign (==) indicates value equality, while the triple equal sign (===) indicates strict equality (whether the values ​​and types are completely equal). This article mainly introduces the double equal sign (==) implicit conversion mechanism in JavaScript to you in detail. It is very good and has reference value. Friends who need it can refer to it. I hope it can help everyone.

So there are some common sense knowledge:

1. For basic types such as string and number, there is a difference between == and ===

 1) Between different types Compare, == compare "values ​​converted into the same type" to see if the "values" are equal, === if the types are different, the result will be unequal

 2) Compare the same type, directly perform "value" "Compare, the results are the same

2. For advanced types such as Array and Object, there is no difference between == and ===

Perform "pointer address" comparison

3. There is a difference between basic types and advanced types, == and ===

 1) For ==, convert the advanced types into basic types and perform "value" comparison

 2 ) Because the types are different, the === result is false

In other words, the double equal sign (==) will perform type conversion during operation, but the triple equal sign (===) will not.

For example:

alert('55' == 55); //true
alert('55' === 55); //false
Copy after login

The five basic data types (primitive values, also called simple data types) in the Javascript language: Undefined, Null, Boolean, Number and String types. Since these primitive types occupy a fixed amount of space, they can be stored in a smaller area of ​​memory - the stack. Such storage facilitates quick search of variable values;

Use double equal sign (==) in Javascript to determine the implicit conversion mechanism for equality:

1, if both sides are simple types:

 1,1, if both sides are simple types and the types are the same, they will be compared directly.

console.log(1==1); //true
console.log("1"=="1"); //true
console.log(false==false); //true
console.log(null==null); //true
console.log(undefined==undefined); //true
Copy after login

 1.2. Both sides are simple types. If the types are different, they will be converted to numerical comparison first (Boolean has only two values: true==1, false==0; null and undefined are equal; string numbers Equal to numeric value, empty string ""==0;)

console.log(1==true); //true
console.log(0==false); //true
console.log(1=="1"); //true
console.log(0==""); //true
console.log(0==null); //false
console.log(0==undefined); //false
console.log(null==undefined); //true
Copy after login

2, if one side is a simple type and the other side is a reference type (advanced type), the advanced type is implicitly converted to a simple type and then compared. .

console.log(Object==Object); //true
console.log(Object=={}); //false
console.log(0=={}); //false
console.log(0==[]); //true
console.log(Array==Array); //true
console.log(Object==Array); //false
Copy after login

3, if both sides are reference types (advanced types), perform "pointer address" comparison.

Key points-toString() and valueOf()

The first impression many people have when seeing these two methods is that the toString() method converts an object into a string, and the valueOf method converts it into a string. Convert an object to a numeric value.

This idea is very one-sided. Let’s take a look at the following two examples:

var obj={
  name:"熊仔其人",
  getName:function(){ return $(this).name; }
};
console.log(obj.toString()); //[object Object]
Copy after login

Define an obj object, call its toString method, the return value is [object Object], and find that does not return a string representation of its contents as we thought.

var arr=[1,2,3];
console.log(arr.valueOf()); //(3) [1, 2, 3]
Copy after login

Define an array arr, call its valueOf method, the return value is [1, 2, 3], and find that it does not return a numerical type representation as we imagined.

In fact, the real understanding is this: calling the object's toString() method can convert the object into a string, but if you want to convert it into a string, you do not necessarily have to call the toString method.

Let’s take a look at the code below.

var obj= { };   
obj.valueOf=function(){ return 1; }
obj.toString=function(){ return 2; }
console.log(obj==1);  //true
var obj2= { };   
obj2.valueOf=function(){ return 2; }
obj2.toString=function(){ return 1; }
console.log(obj2==1);  //false                                      
var obj3={ };
obj3.valueOf=function(){ return []; }
obj3.toString=function(){ return 1; }
console.log(obj3==1);  //true
Copy after login

In the above code, we defined an object obj, obj2, and defined the return value of the valueOf and toString methods. By comparing it with 1 for equality, we found that the valueOf method was called first.

Then an object obj3 is defined, and the return value of the valueOf and toString methods is defined. By comparing it with 1 for equality, it is found that it calls the toString method.

Then let's look at the following piece of code:

var obj= { };   
obj.valueOf=function(){ return 'a'; }
obj.toString=function(){ return 2; }
console.log(obj=='a');  //true
var obj2= { };   
obj2.valueOf=function(){ return 'b'; }
obj2.toString=function(){ return 'a'; }
console.log(obj2=='a');  //false
Copy after login

An object obj is defined in the above code 2. By comparing it with the string 'a', we find that it calls the valueOf method.

Then the comparison between object obj2 and 'a' returns false, and it is found that the toString method is not called.

From this we can draw the conclusion:

When the object is converted to a simple type, the valueOf method will be called first. If it can be compared with a simple value, it will be compared directly, and toString will no longer be called at this time. method. If the valueOf method cannot be compared with a simple value after calling the valueOf method, the toString method will be called again to finally get the comparison result.

But one thing to note is that the Date object does not meet the above rules. The toString and valueOf methods of the Date object have been redefined, and the toString method will be called by default.

PS: js double equal sign implicit conversion rules

When using the double equal sign for comparison, when the two operand types are different, the double equal sign will perform an implicit conversion Convert, convert to the same type and then compare. The following are the conversion rules, which can be found on page P51 of the Little Red Book. (I always forget, and I still feel that my good memory is not as good as my bad writing. It always has a profound impact when I write it)

1. One of the operands is a Boolean value. Convert the Boolean value into a numerical value and then compare it. False is 0, true is 1.

2. One is a string and the other is a number. Convert strings to numeric values ​​and compare.

3. One operator is an object and the other is not an object. First use valueOf() to get the object value type, and then compare according to other rules.

Related recommendations:

Example of double equal sign implicit conversion mechanism in Javascript

Implicit conversion of Oracle data types

About some implicit conversion and summary examples in JavaScript

The above is the detailed content of Detailed explanation of the implicit conversion mechanism of double equal sign (==) in Javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Recommended: Excellent JS open source face detection and recognition project Recommended: Excellent JS open source face detection and recognition project Apr 03, 2024 am 11:55 AM

Face detection and recognition technology is already a relatively mature and widely used technology. Currently, the most widely used Internet application language is JS. Implementing face detection and recognition on the Web front-end has advantages and disadvantages compared to back-end face recognition. Advantages include reducing network interaction and real-time recognition, which greatly shortens user waiting time and improves user experience; disadvantages include: being limited by model size, the accuracy is also limited. How to use js to implement face detection on the web? In order to implement face recognition on the Web, you need to be familiar with related programming languages ​​and technologies, such as JavaScript, HTML, CSS, WebRTC, etc. At the same time, you also need to master relevant computer vision and artificial intelligence technologies. It is worth noting that due to the design of the Web side

PHP and JS Development Tips: Master the Method of Drawing Stock Candle Charts PHP and JS Development Tips: Master the Method of Drawing Stock Candle Charts Dec 18, 2023 pm 03:39 PM

With the rapid development of Internet finance, stock investment has become the choice of more and more people. In stock trading, candle charts are a commonly used technical analysis method. It can show the changing trend of stock prices and help investors make more accurate decisions. This article will introduce the development skills of PHP and JS, lead readers to understand how to draw stock candle charts, and provide specific code examples. 1. Understanding Stock Candle Charts Before introducing how to draw stock candle charts, we first need to understand what a candle chart is. Candlestick charts were developed by the Japanese

Simple JavaScript Tutorial: How to Get HTTP Status Code Simple JavaScript Tutorial: How to Get HTTP Status Code Jan 05, 2024 pm 06:08 PM

JavaScript tutorial: How to get HTTP status code, specific code examples are required. Preface: In web development, data interaction with the server is often involved. When communicating with the server, we often need to obtain the returned HTTP status code to determine whether the operation is successful, and perform corresponding processing based on different status codes. This article will teach you how to use JavaScript to obtain HTTP status codes and provide some practical code examples. Using XMLHttpRequest

The relationship between js and vue The relationship between js and vue Mar 11, 2024 pm 05:21 PM

The relationship between js and vue: 1. JS as the cornerstone of Web development; 2. The rise of Vue.js as a front-end framework; 3. The complementary relationship between JS and Vue; 4. The practical application of JS and Vue.

How to get HTTP status code in JavaScript the easy way How to get HTTP status code in JavaScript the easy way Jan 05, 2024 pm 01:37 PM

Introduction to the method of obtaining HTTP status code in JavaScript: In front-end development, we often need to deal with the interaction with the back-end interface, and HTTP status code is a very important part of it. Understanding and obtaining HTTP status codes helps us better handle the data returned by the interface. This article will introduce how to use JavaScript to obtain HTTP status codes and provide specific code examples. 1. What is HTTP status code? HTTP status code means that when the browser initiates a request to the server, the service

Deep understanding of the mechanics of CSS layout recalculation and rendering Deep understanding of the mechanics of CSS layout recalculation and rendering Jan 26, 2024 am 09:11 AM

CSS reflow and repaint are very important concepts in web page performance optimization. When developing web pages, understanding how these two concepts work can help us improve the response speed and user experience of the web page. This article will delve into the mechanics of CSS reflow and repaint, and provide specific code examples. 1. What is CSS reflow? When the visibility, size or position of elements in the DOM structure changes, the browser needs to recalculate and apply CSS styles and then re-layout

js method to refresh current page js method to refresh current page Jan 24, 2024 pm 03:58 PM

js methods to refresh the current page: 1. location.reload(); 2. location.href; 3. location.assign(); 4. window.location. Detailed introduction: 1. location.reload(), use the location.reload() method to reload the current page; 2. location.href, you can refresh the current page by setting the location.href attribute, etc.

The difference between __proto__ and prototype in JS The difference between __proto__ and prototype in JS Feb 19, 2024 pm 01:38 PM

__proto__ and prototype are two attributes related to prototypes in JS. They have slightly different functions. This article will introduce and compare the differences between the two in detail, and provide corresponding code examples. First, let’s understand what they mean and what they are used for. proto__proto__ is a built-in property of an object that points to the prototype of the object. Every object has a __proto__ attribute, including custom objects, built-in objects, and function objects. By __proto__ genus

See all articles