js函数中参数的传递

前言

今天再看React纯函数的时候,看到纯函数过程没有副作用,就是说在纯函数中我们不能改变外部状态.
想到了以前看过的函数中传参的概念.

数据类型

在js中,数据类型分为两类:基本类型值(undefined,null,Boolean,Number,String)和引用类型值(Object,Arrat,Function).

变量的复制

1.js中变量的基本类型和引用类型保存方式是不同的,这也就导致变量复制时也就不同了.
如果从一个变量向另一个变量复制基本类型的值时,会将前者的值克隆一个,然后将克隆的值
赋值到后者,因此这两个值是完全独立的,只是他们的value相同而已.

var num1 = 10;
var num2 = num1;
console.log(num1); // 10
num2 += 1;
console.log(num1);  // 10
console.log(num2);  // 11

2.引用类型的复制
引用类型复制对象时并不会在堆内存中新生成一个一模一样的对象,只是多了一个保存指向这个对象指针的变量罢了.
将obj1的值复制给obj2,而这个值的副本实际上是一个指针,这个指针指向存储在堆中的一个对象,
也就是说创建了一个新的内存地址传给了obj2,obj1和obj2两个变量同时指向了同一个Object,当去改变这个对象,
他们的值都会改变,也即是说他们中任何一个做出的改变都会反映到另一个身上.

var obj1 = {
    a: 1
};
var obj2 = obj1;
console.log(obj2);  // {a: 1}
obj2.a = 10;
console.log(obj1);  // {a: 10}
console.log(obj2);  // {a: 10}

函数参数的传递

所有函数的参数都是按值传递的,也就是说把函数外部的值复制给函数内部的参数,就和把值从一个变量复制
到另一个变量一样.所以如果能理解变量的复制,那么参数的传递也就很简单了.
1.基本类型传参

var count = 10;
function num(num1) {
    num1 = 1;
    return num1;
}
var count1 = num(count);
console.log(count1); // 1
console.log(count); //10

2.引用类型传参

var o = {
    a: 1
};
function fun(o) {
    o.a = 10;
    return o;
}
var p = fun(o);
console.log(o); // {a: 10}
console.log(p); // {a: 10}

3.引用类型传参指针改变
在函数中重新定义了一个对象,也就是现在堆内存中有两个对象,外部的oo指向的是老的对象,被传入参数后
指向的是新定义的对象,所以调用后返回的值是新定义的对象的值.
如果参数是按引用传递的,那么oo也是a:10,从这点可以看出参数是按值传递的.

var oo = {
    a: 1
};
function gun(o) {
    o = {
        a: 10
    };
    return o;
}
var pp = gun(oo);
console.log(oo);    // {a: 1}
console.log(pp);    // {a: 10}

总结

函数的参数是值传递,对象类型作为参数的时候传递的是地址(指针)的值,而不是对象本身堆内存中的value.
所以这种场景,函数内部用参数去修改对象,那么查找到的还是原对象,因为指向相同,所以修改的话原对象
也受影响.
如果实例化一个对象赋值给该指针,那么指针指向的是一个全新的对象了,和原来指向的对象失去联系.