js按值传参与引用

在JavaScript中，参数传递的方式有两种：按值传递（Pass by Value）和按引用传递（Pass by Reference）。

基础概念

1. 按值传递：
   • 当一个原始类型（如number、string、boolean、null、undefined、symbol）作为参数传递给函数时，传递的是该值的副本。
   • 函数内部对参数的修改不会影响到函数外部的变量。

• 按引用传递：
  • 当一个对象（包括数组、函数等）作为参数传递给函数时，传递的是该对象的引用（内存地址）。
  • 函数内部对参数的修改会影响到函数外部的变量，因为它们引用的是同一个对象。

示例代码

按值传递示例

function changeValue(x) {
  x = 10;
}

let num = 5;
changeValue(num);
console.log(num); // 输出: 5

在这个例子中，num是一个原始类型，传递给changeValue函数的是它的值的副本。函数内部对x的修改不会影响到num。

按引用传递示例

function changeObject(obj) {
  obj.name = 'Alice';
}

let person = { name: 'Bob' };
changeObject(person);
console.log(person.name); // 输出: Alice

在这个例子中，person是一个对象，传递给changeObject函数的是它的引用。函数内部对obj的修改会影响到person。

应用场景

• 按值传递：适用于不需要修改原始数据的情况，可以保证数据的不可变性，避免意外的副作用。
• 按引用传递：适用于需要修改原始数据的情况，可以减少内存开销，因为不需要复制整个对象。

遇到的问题及解决方法

1. 意外修改对象：
   • 如果不希望函数内部修改外部对象，可以在函数内部创建对象的副本。
   • 使用Object.assign或扩展运算符（...）来创建浅拷贝，或使用JSON.parse(JSON.stringify(obj))来创建深拷贝。

function changeObjectWithoutSideEffects(obj) {
  let newObj = { ...obj }; // 浅拷贝
  newObj.name = 'Alice';
  return newObj;
}

let person = { name: 'Bob' };
let newPerson = changeObjectWithoutSideEffects(person);
console.log(person.name); // 输出: Bob
console.log(newPerson.name); // 输出: Alice

1. 原始类型和对象的混淆：
   • 理解原始类型和对象在参数传递中的区别，避免在需要修改原始数据时误用原始类型。

通过这些方法和理解，可以更好地控制JavaScript中参数传递的行为，避免不必要的副作用和错误。