-
01 值类型和引用类型简单说明
- 值类型主要有：
数值
字符串
布尔类型
undefined
null
引用类型主要有：
对象（Object类型）
数组（Array）
函数（Function）
-
值类型：
储存的是具体的值。保存为简单的数据值，赋值只是简单的数据值的赋值。
-
引用类型：
保存的是对象，其本质是指向内存位置的引用（地址），赋值是对地址的赋值。
值类型代码示例
var num1 = 10;
var num2 = num1; //把num1的值复制一份给num2,num1和num2的值相等,除此之外没有任何其他关系
console.log(num1,num2); //10,10
console.log(num1 == num2); //true
num2 = 20; //修改num2的值为20,不会对num1产生任何的影响
console.log(num1,num2); //10,20
console.log(num1 == num2); //false
引用类型代码示例
var arr1 = [1,2,3];
var arr2 = arr1;
console.log(arr1,arr2); //[1,2,3],[1,2,3]
console.log(arr1 == arr2); //true
var arr3 = [1,2,3];
console.log(arr3); //[1,2,3]
console.log(arr1 == arr3,arr2 == arr3); //false,false
/**
* 代码说明:
* arr1和arr2在比较的时候,值相等(都是[1,2,3]),且引用相等(都指向堆中同一块数据),因此arr1和arr2相等
* arr3和arr1以及arr2比较的时候,值相等([1,2,3]),但是引用不相等(arr3指向的是堆中另外一块数据),因此不等
* 总结:引用类型在比较相等的时候,只有值和引用都相等才相等
* */
-
02 值类型和引用类型的赋值
赋值(=):把右边的数据复制一份给左边
-
值类型赋值:
- 把右边变量存储存储的值(具体的数据)复制一份给左边的变量
- 值类型的赋值:是简单数据的复制,他们保存在相对独立的空间中,彼此不会影响
-
引用类型
- 把右边变量存储存储的值(指向具体数据的地址)复制一份给左边的变量
- 引用类型赋值:修改了某个对象的属性,对另外一个对象的属性会有影响
//引用类型使用注意
console.log(arr1,arr2); //[1,2,3],[1,2,3];
console.log(arr1 == arr2); //true
arr1.push(4);
console.log(arr1,arr2); //[1,2,3,4],[1,2,3,4]
/**
* 代码说明:因为arr1和arr2内部的引用指向的是同一块数据,所以修改了arr1会对arr2也产生影响
* */
-
03 值类型和引用类型作为函数参数处理
函数里面的相关术语
形参(形式参数):占位用的参数,用来接收数据的参数而已，在没有调用函数的时候形参是没有值的。
实参(实际参数):实际传递的参数。
函数的调用:在函数被调用的时候，函数会默认把实参的值赋值给形参
值类型作为函数的参数:在函数内部对形参变量进行修改是不会影响到实参的值。因为实参和形参他们的数据是相互独立的。
引用类型作为函数的参数：在函数内部对形参变量进行修改会影响到实参的值，因为他们的引用指向同一个对象。（形参和实参共享同一份数据,修改其中的某个对象对另外一个对象也会有影响）
代码示例
<script>
//01 值类型作为函数的参数传递
var number = 10;
function funcName(n) {
//n = number; 内部默认的实现
n = 5;
console.log(n); //number = 5
}
funcName(number);
console.log(number); //10
</script>
<script>
//02 引用类型作为函数的参数传递
var obj = {name:"小明"};
function funcName(param) {
param.name = "小王";
param = {
name:"张明明"
};
console.log(param.name); //张明明
}
funcName(obj);
console.log(obj.name); //(小王) or 小明
var arr1 = [1,2,3];
var arr2 = arr1;
console.log(arr1);
console.log(arr2);
arr2 = [1,2,3]; //该行代码切断和arr1的关系,对象内保存的地址指向了另外一块内存空间
arr1.push(4);
console.log(arr1); //1,2,3,4
console.log(arr2); //1,2,3
</script>
-
04 值类型和引用类型的相关图示
- 基本类型的赋值
var str1 = "hello zhangsan";
var str2 = str1;
| str1 | "hello zhangsan"; |
|---|---|
| str2 | "hello zhangsan"; |
引用类型的结构和赋值
var car = {
color:"黑色",
number:"B99"
};
var p1 = {
name:"王宝宝",
age:30,
car:car
};
结构图：
结构图
var obj1 = {
name:"lisi",
age:18
};
var obj2 = obj1;
结构图：
结构图
