js data type classification and storage difference

1. js data type classification

js has a total of 8 data types, 7 basic data types and 1 reference data type.

7 basic data types : Undefined, Null, Boolean, Number, String, Symbol( es6new, representing a unique value) and BigInt( es10new).

• SymbolRepresents a unique value, the biggest usage is to define the unique property name of the object .
• BigIntIntegers of any size can be represented.
  It should be noted that JSthe numeric types in are all floating-point types, and there are no integer types.

1 reference data type : Object(Object is essentially composed of a set of unordered name-value pairs, including ordinary objects - Object, array objects - Array, regular objects - , RegExpdate objects - Date, mathematical functions - Math, function objects - Function).

1.1 What is the Symbol type

ES6The previous object attribute names were all strings, which easily caused attribute name conflicts .
For example, if you introduce a code written by a colleague js, you jsadd a new attribute method to a very complex object in his code. If you use the attribute name or a string, the method you add may be the same as your colleague. The method has been renamed .

const str1 = Symbol('name');
const str2 = Symbol('name');
console.log(str1);  //Symbol(name)
console.log(str2);  //Symbol(name)
console.log(str1 === str2); //false

Even if the same parameter is passed in, the generated Symbol values ​​are not equal , because Symbol has a unique meaning.

const obj={};
obj[Symbol('name')]='张三';
obj[Symbol('name')]='李四';
console.log(obj);  //{Symbol(name): '张三', Symbol(name): '李四'}

ES6The introduction of the Symbol type allows the property names of the object to have two types , one is the original string , and the other is the newly added Symbol type . All attribute names that belong to the Symbol type are unique and can be guaranteed not to conflict with other attribute names.

1.2 What is the BigInt type

• What is BigInt?
  BigInt is a new data type used when the integer value is larger than the range supported by the Number data type . BigIntIt is only used to represent integers, there is no limit on the number of digits, and integers with any number of digits can be accurately represented .
  This data type allows us to safely perform arithmetic operations on large integers, represent high-resolution timestamps, use large integer ids, and more without using libraries.
• Why is it needed BigInt?
  In JS, all numbers are represented in double-precision 64-bit floating point format , so what problems does this cause?
  This causes JSthe Number in cannot represent very large integers exactly , it will round very large integers, to be exact, the type JSin Numbercan only safely represent (-2^53-1) and (2^53-1) , any integer value outside this range may lose precision . The second is a value greater than or equal to 2 to the 1024th power, which cannot be represented by JavaScript and will be returned Infinity.

console.log(999999999999999);  //=>10000000000000000

At the same time, there will be certain security issues:

9007199254740992 === 9007199254740993;    // → true 居然是true!

• How to create and use it BigInt?
  1. To create BigInt, just append at the end of the number n.

console.log( 9007199254740995n );    // → 9007199254740995n	
console.log( 9007199254740995 );     // → 9007199254740996

2. Another BigIntway to create is to use BigInt()the constructor

BigInt("9007199254740995");    // → 9007199254740995n

Simple use is as follows:

10n + 20n;    // → 30n	
10n - 20n;    // → -10n	
+10n;         // → TypeError: Cannot convert a BigInt value to a number	BigInt不支持一元加号运算符
-10n;         // → -10n	
10n * 20n;    // → 200n	
20n / 10n;    // → 2n	
23n % 10n;    // → 3n	
10n ** 3n;    // → 1000n	
42n === 42 // false BigInt 与普通整数是两种值，它们之间并不相等

const x = 10n;	
++x;          // → 11n	
--x;          // → 9n
console.log(typeof x);   //"bigint" typeof运算符对于 BigInt 类型的数据返回bigint

• A point of caution is that
  BigIntthe unary plus operator is not supported , because it would conflict with asm.js(a jssolution to improve execution efficiency). Mixing operations between and are not allowed
  because implicit type conversions may lose information . When mixing large integers and floating-point numbers, the resulting value may not be exactly representable by or .bigintNumberBigIntNumber

10 + 10n;    // → TypeError

Cannot be BigIntpassed to Web apiand built-in JSfunctions, which expect a number of type Number.

Math.max(2n, 4n, 6n);    // → TypeError

When Booleanthe type BigIntmeets the type, BigIntit is treated in a Numbersimilar way, in other words, as long as it is not0n , BigIntit is regarded as truthythe value of .

if(0n){//条件判断为false

}
if(3n){//条件为true

}

• Arrays with all elements BigIntcan be sorted.
• BigIntBit operations can be performed normally, such as |, &, <<, >>and^

2. Differences in storage methods

The basic data type is stored in the stack , and its value can be directly accessed; the reference data type is stored in the heap , and the address is stored in the stack , and the value in the heap is accessed through the address in the stack.

When assigning a value , the assignment of the original type will completely copy the variable value, and the two objects correspond to different addresses ; while the assignment of the reference type is to copy the reference address , and the two variables point to the same object in the heap memory.

Basic type example :

let a = 10;
let b = a; // 赋值操作
b = 20;
console.log(a); // 10值

aThe value of is a basic type, which is stored in the stack, and athe value of is assigned to b. Although the values ​​of the two variables are equal, the two variables store two different memory addresses, so the change of b will not cause the change of a .

The following figure is

an example 1 of the reference type in the basic type assignment process :

var obj1 = {
    
    }
var obj2 = obj1;
obj2.name = "xxx";
console.log(obj1.name); // xxx

obj1It is a reference type. In the process of assignment operation, the reference address of the heap memory object in the stack memory is actually copied. In fact, obj2they both point to the same heap memory object, so the change obj2will obj1have an impact.

The figure below is the reference

type example 2 of the reference type assignment process :

function test(person) {
    
    
  person.age = 26
  person = {
    
    
    name: 'hzj',
    age: 18
  }
  return person
}
const p1 = {
    
    
  name: 'fyq',
  age: 19
}
const p2 = test(p1)
console.log(p1) // -> ?
console.log(p2) // -> ?

// 结果:
p1：{
    
    name: “fyq”, age: 26}
p2：{
    
    name: “hzj”, age: 18}

Reason: When the function is passed parameters , the memory address value of the object in the heap is passed . The actual parameter person in the test function is the memory address of the p1 object. person.age = 26The value of p1 is indeed changed by calling, but then personit becomes another block The address of the memory space , and finally return the address of this other memory space and assign it to p2.