What are the data types of JavaScript? Introduction to js data types

This article brings you what are the data types of JavaScript? The introduction of js data types has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

1. How many types of values ​​does JavaScript have?

Javascript has two data types, namely basic data types and reference data types. The basic data types include Undefined, Null, Boolean, Number, String, and Symbol (New in ES6, representing unique values), and reference data types are collectively called Object objects, which mainly include objects, arrays and functions. Next, let’s look at the characteristics of the two respectively.

2. Basic data types

1. The value is immutable

var name = 'java';
name.toUpperCase(); // 输出 'JAVA'
console.log(name); // 输出  'java'

It can be concluded that the value of the basic data type is immutable ’s

2. Stored in the stack area

The original data type is a simple data segment directly stored in the stack. It occupies a small space and has a fixed size. It is frequently used data, so it is placed Store on the stack.

3. Value comparison

var a = 1;
var b = true;
console.log(a == b);    // true
console.log(a === b);   // false

==: Only value comparison is performed, and data type conversion is performed.
===: Not only compare values, but also compare data types.

3. Reference data types

1. The value is variable

var a={age:20}；
a.age=21；
console.log(a.age)//21

The above code shows that reference types can have properties and methods, and are Can be changed dynamically.

2. Saved in stack memory and heap memory at the same time

The reference data type is stored in the heap (heap), which occupies a large space and is not fixed in size. If it is stored in the stack, it will Will affect the performance of the program; the reference data type stores a pointer on the stack, which points to the starting address of the entity in the heap. When the interpreter looks for a reference value, it first retrieves its address on the stack and then obtains the entity from the heap.

3. Comparison is a reference comparison

When assigning a reference type value from one variable to another variable, the same Also copies the value of the object stored in the variable into the space allocated for the new variable.

var a={age:20};
var b=a;
b.age=21;
console.log(a.age==b.age)//true

We mentioned above that basic types and reference types are stored in different locations in memory. The reference type is an object stored in the heap. At the same time, a pointer is stored in the stack, and this pointer points to the heap. The starting position of the entity in the object. When variable a is initialized, the pointer a points to the address of object {age:20}. After a is assigned to b, b points to the address of object {age:20}. These two variables point to the same object. Therefore, changing any one of these variables will affect each other.

At this time, if a variable references the original object, it will not affect the other variable.

var a={age:20};
var b=a;
a = 1;
b // {age:20}

In the above code, a and b point to the same object, and then the value of a changes to 1. This will not affect b, and b still points to the original object.

4. Check the data type

1.typeof

typeof returns a string representing the data type. The returned results include: number, boolean, There are 7 data types such as string, symbol, object, undefined, function, etc., but null, array, etc. cannot be judged.

typeof Symbol(); // symbol 有效
typeof ''; // string 有效
typeof 1; // number 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof new Function(); // function 有效
typeof null; //object 无效
typeof [] ; //object 无效
typeof new Date(); //object 无效
typeof new RegExp(); //object 无效

Arrays and objects return objects. In this case, you need to use instanceof to judge

2.instanceof

instanceof is used to determine whether A is an instance of B. The expression is: A instanceof B. If A is an instance of B, it returns true, otherwise it returns false. The instanceof operator is used to test whether an object has a constructor's prototype property in its prototype chain.

[] instanceof Array; //true
{} instanceof Object;//true
new Date() instanceof Date;//true
new RegExp() instanceof RegExp//true

Regarding the type judgment of arrays, you can also use ES6 to add Array.isArray()

Array.isArray([]);   // true

instanceof Three major disadvantages:

For basic In terms of data types, there are certain differences between the results created by literals and those created by instances.

console.log(1 instanceof Number)//false
console.log(new Number(1) instanceof Number)//true

Strictly speaking, only the results created by instances are standard object data type values. , is also an instance of the standard Number class; the result created by the literal method is a basic data type value, not a strict instance. However, due to the loose characteristics of JS, the methods provided on Number.prototype can be used.

As long as it is on the prototype chain of the current instance, the results we detect using it are all true. In the prototypal inheritance of a class, the final result we detect may not be accurate.

var arr = [1, 2, 3];
console.log(arr instanceof Array) // true
console.log(arr instanceof Object);  // true
function fn(){}
console.log(fn instanceof Function)// true
console.log(fn instanceof Object)// true

Cannot detect null and undefined

For the special data types null and undefined, their classes are Null and Undefined, but the browser protects these two classes and does not allow them We use it for outside visits.

3. Strict operator ===

只能用于判断null和undefined，因为这两种类型的值都是唯一的。

var a = null
typeof a // "object"
a === null // true

undefined 还可以用typeof来判断

var b = undefined;
typeof b === "undefined" // true
b === undefined // true

4.constructor

constructor作用和instanceof非常相似。但constructor检测 Object与instanceof不一样，还可以处理基本数据类型的检测。

var aa=[1,2];
console.log(aa.constructor===Array);//true
console.log(aa.constructor===RegExp);//false
console.log((1).constructor===Number);//true
var reg=/^$/;
console.log(reg.constructor===RegExp);//true
console.log(reg.constructor===Object);//false

constructor 两大弊端：

null 和 undefined 是无效的对象，因此是不会有 constructor 存在的，这两种类型的数据需要通过其他方式来判断。

函数的 constructor 是不稳定的，这个主要体现在把类的原型进行重写，在重写的过程中很有可能出现把之前的constructor给覆盖了，这样检测出来的结果就是不准确的

function Fn(){}
Fn.prototype = new Array()
var f = new Fn
console.log(f.constructor)//Array

5.Object.prototype.toString.call()

Object.prototype.toString.call() 最准确最常用的方式。首先获取Object原型上的toString方法，让方法执行，让toString方法中的this指向第一个参数的值。

关于toString重要补充说明：

本意是转换为字符串，但是某些toString方法不仅仅是转换为字符串

对于Number、String，Boolean，Array，RegExp、Date、Function原型上的toString方法都是把当前的数据类型转换为字符串的类型（它们的作用仅仅是用来转换为字符串的）

Object上的toString并不是用来转换为字符串的。

Object上的toString它的作用是返回当前方法执行的主体（方法中的this）所属类的详细信息即"[object Object]",其中第一个object代表当前实例是对象数据类型的(这个是固定死的)，第二个Object代表的是this所属的类是Object。

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window是全局对象global的引用

The above is the detailed content of What are the data types of JavaScript? Introduction to js data types. For more information, please follow other related articles on the PHP Chinese website!