Directory:

  • All that variable stuff
  • JavaScript data types
  • What is the detection mechanism for isNaN?
  • Come up with solutions to the problem

preface

Variables and data types are the first things you will encounter when learning JavaScript, but often the simplest things can hide a lot of knowledge that you don’t know or can easily make mistakes, such as the following questions:

  • What are the ways to create variables?
  • What are the data types in JavaScript?
  • What are the ways to detect data types?
  • Is NaN a numeric type?
  • What is the detection mechanism for isNaN?

If you can’t answer the above questions well, then you haven’t mastered this part of the knowledge, so please read the passage below.

This article will start with an introduction to variables and types in JavaScript and the detection mechanism for isNaN. Hopefully, after reading this article, you will know the answer to that question. Cut the crap and get to the point.

One, variable things

1.1 What are variables?

Variable: It does not refer to a specific value, just a “container” or “synonym” used to store a specific value, because the value it stores can change, so called a variable.

So how do you understand variables? Here’s a simple example:

var num = 10;
num = 15;
console.log(num + 5); 
// Print 20 on the console, which shows that the num variable only stores a specific value. At first, num stores 10, then it is assigned to 15, resulting in 20. Simply put, variables change frequently, and the emphasis is on the word "change".
Copy the code

1.2 How to Create variables

The following is a brief explanation of how to create a variable. I won’t go into that for now, but I’ll learn more about it later.

  • Var (ES3) creates variables
  • Function (ES3) creates a function “There is no difference between a function and a variable. The function name is also a variable, but the value stored is of the function type.”
  • Let (ES6) creates variables
  • Const (ES6) creates a constant
  • Import (ES6) Export required information based on ES6 module specifications
  • Class (ES6) Creates classes based on ES6

1.3 Naming conventions for variables

  • Strictly case sensitive
  • Follow the camelback nomenclature: Use numbers, letters, underscores, or $(numbers do not begin names with digits), and combine names based on English words (lowercase first pronoun, uppercase first letter of every meaningful word)
  • Keywords and reserved words cannot be used: those that have special meaning in JS are called keywords, and those that may become keywords in the future are called reserved words

Note: variable name as far as possible to know the meaning of the name, more semantic.

JavaScript data types

2.1 Data types of variables

  • Basic data type/value type
    • Digital number
    • String string
    • Boolean Boolean
    • null
    • undefined
    • The Symbol “ES6”
  • Reference data type
    • Object type
      • Ordinary objects
      • Regular object
      • An array of
      • The date object
    • function

2.2 Typeof Detecting data types

The methods used to detect data types in JS are described briefly here, not in depth:

  • typeof
  • instanceof
  • constructor
  • Object.prototype.toString.call()

This section focuses on the details of TypeOF detecting data types. It will not focus on other methods of detecting data for the time being. It will explain the use and details of Typeof from the syntax, return value and discovery point.

Syntax: typeof [value] => checks the data typeof value

Typeof returns a string containing the corresponding data type, e.g. “number”/”string”/” Boolean “/”undefined”/”object”/”function”

Find a point:

  • The result of typeof NULL is “object” because null represents an empty object pointer (does not point to any memory space).
  • Use Typeof to detect arrays/re/objects and return “object”. In other words, there is no segmentation in this way
  • The result of typeof function is “function”

What is the detection mechanism of isNaN?

3.1 Role of isNaN

When it comes to the function of isNaN, we have to start with NaN, which is first understood literally as not a number, but “it’s a number type,” and NaN is not equal to anyone, including itself. So the question is, how do you check if a variable is a significant number? We’re finally getting down to business, and that’s where isNaN comes in.

IsNaN: Checks whether the current value is a significant number, returning true for a non-significant number and false for a significant number

3.2 Detection mechanism of isNaN

  1. First, verify that the current value is numeric. If not, the browser will convert the value to a numeric type by default.
  2. The value currently detected is already a number type, is a significant number, return false, is not, return true “numeric type only NaN is not a significant number, the rest are significant numbers”

Call Number to convert a non-numeric value to a Number.

Other primitive types are converted to numbers: directly using the Number method

[String to number]

Number('13') / / = > 13
Number('13px') // => NaN If any non-valid numeric character appears in the current string, the result is NaN
Number('13.5') // => 13.5 Can recognize decimals
Number('13.5.0') // => NaN
Copy the code

【 Boolean to number 】

Number(true) / / = > 1
Number(false) / / = > 0
Copy the code

[Other numbers]

Number(null) / / = > 0
Number(undefined) // => NaN
Copy the code

Reference data type to Number: call toString to a string, and then call Number to a Number

[Object to number]

({}).toString() // => '[object Object]' => NaN
Copy the code

【 Array to number 】

[12.23].toString() // => '12,23' => NaN
[12].toString() // => '12' => 12
[].toString() // => "=> 0
Copy the code

[Regular to number]

/^$/.toString() // => "/^$/" => NaN
Copy the code

3.3 Verify that you understand the detection mechanism of isNaN

If you can see the following code execution quickly and correctly, you have a complete understanding of isNaN’s detection mechanism.

var num = 12; isNaN(num); // Tests whether the value stored in the num variable is a significant numberfalse

isNaN('13'); / / = >false
isNaN('happy less'); / / = >true
isNaN(true); / / = >false
isNaN(false); / / = >falseisNaN(null); / / = >falseisNaN(undefined); / / = >trueisNaN({age:9}); / / = >trueThe isNaN ([12, 13]); / / = >trueisNaN([12]); / / = >falseisNaN(/^$/); / / = >true
isNaN(function() {}); / / = >true
Copy the code

Four, return to the original starting point

The num variable is declared, but the value of the num variable is not determined.

Solution a:

if(Number(num) == NaN){
    alert('num is not a significant number! ')}Copy the code

Scheme 2:

if(isNaN(num)){
   alert('num is not a significant number! ')}Copy the code

Solution 3:

if(typeof num === 'number' && isNaN(num)){
   // => Only this method is used to check whether the number is a significant digit
   alert('num is not a significant number! ')}Copy the code

Read the whole article + I listed the three solutions, I believe you have a clear answer in mind, I will analyze one by one:

Scenario 1: Assume that Number(num) results in a NaN, but code execution results in no popover because NaN is equal to no one, and the condition is never true (even if num is not a valid Number and the conversion does result in a NaN, but NaN! = NaN)

Scheme 2: This scheme appears to be the correct answer, but ignores that values of other data types can be converted to numeric types. For example, if num is ’13’, Number is called to change ’13’ to 13, and isNaN(13) is used to get the result false. But ’13’ is not a valid number.

Scheme 3: IN my opinion, this scheme can solve the problem raised by the title of the article. First, determine whether the variable is a number type, and then use isNaN to determine whether the variable is a significant number. Typeof num === ‘number’; typeof num === ‘number’; typeof num == ‘number’;