js数据类型与内存存储

导语: 最近由于在学习javascript基础知识，巩固自身对于基础知识的理解,希望自己在下一次的面试中能够应对自如。

1.理解数据类型

6种原始类型

var num = 0;    // number 类型
var str = '这是一段文字' // string 类型
var flag = true;      // boolean 类型
var test = undefined // undefined 类型
var test2 = null  // null 类型
let sym = Symbol(); // symbol 类型


console.log(typeof num1 == 'number') // true
console.log(typeof str == 'string') // true
console.log(typeof flag == 'boolean') // true
console.log(typeof test == 'undefined') // true
console.log(typeof test2 == 'object') // true
console.log(typeof sym == 'symbol') // true

object类型, 任何new出来的实例都为object类型, 例如：new String() 、new Date() 、new Array()、new Object()、new WeakMap()、new Map()、new Set() 等等

typeof 的唯一作用就是检查当前变量的数据类型,但是typeof并不能完整的能检测出具体的Object类型，因为对于object类型来说，其结果均为: 'object',对于object类型来说，想要判断具体是哪种类型，比如是否是数组,需要使用instance来进行判断

2.堆栈内存空间存储

原始类型的数据永远存储在栈空间(适合存储数据量比较小的数据)，而引用类型的数据则存储在堆空间(适合存储数据量比较大的数据)内;原始类型在进行复制的时候是在内存中开辟一块新的内存地址,而通过变量复制对象的时候,实际复制的是对象在内存中引用的地址，实际引用类型在栈中保存的是实际存储数据的引用地址,而非具体的数据, $\color {#ff502c} {(所以才有了面试中经常会问的浅拷贝、深拷贝的区别)}$

原始类型数据在内存中保存如下:

string
number
boolean
null
undefined
symbol

var num1 = 5;
var num2 = num1;

2.引用类型在内存中存储如下: 引用类型的变量也是存储在栈内存当中,但是变量实际对应的数据存储在堆内存当中，在栈内存，引用类型存储的是对内存中数据的引用地址(也叫指针),直接进行变量复值,如以下代码 var obj2 = obj1, obj1 和 obj2 实际指向的是堆内存中相同的数据,所以obj1 或者是obj2 任何操作数据,都会影响到对方,这也是最常见的浅拷贝。

var obj1 = new Object();
var obj2 = obj1;
obj1.name = 'crazyu';
console.log(obj2.name) // 'crazyu'

3.浅拷贝与深拷贝

原始类型的复制,由于直接是在内存中开辟一份新的地址,所以赋值完成后再次修改，并不会对其他原始类型的变量产生影响,但是引用类型在栈内存中保存的是指针(实际是在真实的堆内存中数据存储的地址),所以存在浅拷贝和深拷贝 1.浅拷贝:引用类型在进行复制时,改变了一个变量的值,另外一个变量的数据也会发生更改

let arr = []; 
let obj = {};


let arr1 = arr;
let obj1 = obj;

arr.push(2);
obj.name = 'crazyu';

console.log(arr1)        // ['2']
console.log(obj1.name)   // crazyu

2.深拷贝:引用类型在进行复制时,改变了一个变量的值,另外一个变量的数据不会发生更改

const arr = [2, 100, 300];
const obj = {
    name: 'crazyu',
    age: 18,
    sex: 'man'
}

let arr1 = [];
let obj1 = {};

arr.map(item => arr1.push(item));
for (let property in obj) {
    obj1[property] = obj[property]
}

console.log(arr1); // [2, 100, 300]
console.log(obj1); // {name: 'crazyu', age: 18, sex: 'man'}

arr[0] = 900;
obj.name = 'crazyu _ wq'

console.log(arr1); // [2, 100, 300]
console.log(obj1); // {name: 'crazyu', age: 18, sex: 'man'}

console.log(arr); // [900, 100, 300]
console.log(obj); // {name: 'crazyu _ wq', age: 18, sex: 'man'}

4.写在最后

至此，文章就分享完毕了。

我是crazyu，一位前端开发工程师。

文中如有错误，欢迎在评论区指正，如果这篇文章帮到了你，欢迎点赞和关注😊
本文首发于掘金，未经许可禁止转载