简单类型和复杂类型

简单类型和复杂类型的区别

简单类型又叫做基本数据类型或值类型，复杂类型又叫做引用类型 。

（1）值类型

简单数据类型，基本数据类型，在存储时，变量中存储的是值本身，但null特殊。

String类型、Number类型、Boolean类型、Undefined、null

（其中null比较特殊，返回的是一个空的对象object，若有个变量我们以后打算存储为对象，暂时没想好放啥，这时就给null）

（2）引用类型

复杂数据类型，在存储时，变量中存储的仅仅是地址（引用）。

通过new关键字创建的对象（系统对象、自定义对象），如Object、Array、Date等

堆和栈空间分配区别

JavaScript 中没有堆和栈的概念，通过堆栈的方式，可以更容易理解代码的一些执行方式，便于以后的学习

（1）栈（操作系统）：由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等。 简单数据类型存放到栈里。

（2）堆（操作系统）： 存储复杂类型(对象)，一般由程序员分配释放， 若程序员不释放，由垃圾回收机制回收。复杂数据类型放到堆里面。

基本类型在内存中的存储

简单数据类型是存放在栈里面，里面直接开辟一个空间存放的是值。

变量中如果存储的是简单类型的数据，那么变量中存储的是值本身，如果将变量赋值给另一个变量，是将内部的值复制一份给了另一个变量，两个变量之间没有联系，一个变化，另一 个不会同时变化。

// 基础数据类型
var a = 5;
var b = a; // 将 a 内部存储的数据 5 复制了一份给 b
a = 10;
console.log(a); // 10
console.log(b); // 5

// 函数的形参也可以看做是一个变量，当我们把一个值类型的变量作为参数传给函数的形参时，其实是把变量在栈空间里的值复制了一份给形参，那么在方法内部对形参做任何修改，都不会影响到外部变量
function fn(a) {
	a++;
	console.log(a); // 11
}
var x = 10;
fn(x);
console.log(x); // 10

复杂类型在内存中的存储

复杂类型数据，首先在栈里面存放地址，十六进制表示（例如：0x11aacc，系统分配），然后这个地址指向堆里面的数据（变量（栈空间）存的是地址，真正的对象实例存放在堆空间中）

如果将复杂类型的数据赋值给一个变量，复杂类型的数据会在内存中创建一个原型，而变量中存储的是指向对象的一个地址，如果将变量赋值给另一个变量，相当于将地址复制一份给了新的变量，两个变量的地址相同，指向的是同一个原型，不论通过哪个地址更改了原型， 都是在原型上发生的更改，两个变量下次访问时，都会发生变化。

// 复杂数据类型
var p1 = {
  name: "zs",
  age: 18,
  sex: "male",
};
var p = p1; // p1 将内部存储的指向对象原型的地址复制给了p
// 两个变量之间是一个联动的关系，一个变化，会引起另一个变化
p.name = "ls";
console.log(p.name); // ls
console.log(p1.name); // ls

// 函数的形参也可以看作是一个变量，当我们把引用类型变量传给形参时，其实是把变量在栈空间里保存的地址复制给了形参，形参和实参保存的是同一个堆地址，所以操作的是同一个对象
function Person(name) {
	this.name = name;
}
function f1(x) {
    console.log(x.name); // zs
    x.name = 'ls';
    console.log(x.name);  // ls
}
var p = new Person('zs');
console.log(p.name);  // zs
f1(p);
console.log(p.name);  // ls

// 数组和函数存储在变量中时，也是存储的地址
var arr = [1, 2, 3, 4];
var arr2 = arr;
arr[4] = 5;
console.log(arr); // [1,2,3,4,5]
console.log(arr2); // [1,2,3,4,5]

基本类型作为函数的参数

基本类型的数据作为函数的参数，符合基本类型的数据特点。

var x = 5;
var y = 6;
f1(x, y);
function f1(a, b) {
  a = a + 1;
  b = b + 1;
  console.log("a=" + a); // a=6
  console.log("b=" + b); // b=7
}
console.log(x); // 5
console.log(y); // 6