js 함수의 값으로 매개변수 전달-JS 튜토리얼-php.cn

js 함수의 값으로 매개변수 전달

小云云

풀어 주다： 2018-01-18 14:43:05

원래의

1809명이 탐색했습니다.

이 기사는 주로 js 함수에서 매개변수를 값으로 전달하는 예를 공유합니다. 편집기를 따라가서 모든 사람에게 도움이 되기를 바랍니다. 모든 사람.

js에서 함수 매개변수를 전달하는 방법은 값을 기준으로 합니다. 일반적인 상황에서는 함수 매개변수 값을 변경해도 함수 외부 변수에 영향을 미치지 않습니다. 예:

'use strict';
var list = [1, 2, 3];
list.forEach(function(item) {
 item ++;
});
console.log(list); // [ 1, 2, 3 ]

로그인 후 복사

이는 js 함수가 매개변수를 수신하면 매개변수의 값과 동일한 복사 변수를 생성하기 때문입니다. js가 다음과 같이 실행되는 방식을 분석할 수 있습니다.

'use strict';
var list = [1, 2, 3];
list.forEach(function(item, i) {
 // 第一个item是副本，第二个item是数组元素list[i]
 var item = item;
 // 副本item++
 item ++;
 // 打印的是副本的值
 console.log(item); // 2, 3, 4
});
// 原数组不会改变
console.log(list); // [ 1, 2, 3 ]

로그인 후 복사

그러나 함수가 매개변수에 객체가 전달됩니다. 모직옷?

'use strict';var list = [{a: 1, b: 2}];
list.forEach(function(item) {
 item.a ++;
});
console.log(list); // [ { a: 2, b: 2 } ]

로그인 후 복사

실제로 함수 내부에서 함수의 외부 변수 값이 변경된 것을 발견했는데 왜 그럴까요?

js가 이 코드를 어떻게 실행하는지 분석해 보겠습니다

'use strict';
var list = [{a: 1, b: 2}];
list.forEach(function(item, i) {
 // 第一个item是副本，第二个item是数组元素list[i]
 var item = item;
 // 此时item和list[i]指向的是同一地址，故两者完全一样
 console.log(item === list[i]); // true
 // 此时item.a++ 亦即 list[i].a++
 item.a ++;
 // list[i]的值已经改变
 console.log(list[i]); // { a: 2, b: 2 }
});
console.log(list); // [ { a: 2, b: 2 } ]

로그인 후 복사

그러면 왜 이런 일이 발생할까요?

js의 객체는 참조 유형이므로 var item = item 단계는 list[i]의 주소를 item에 할당하는 것과 동일합니다. 둘 다 원래 객체의 주소를 가리키므로 하나를 통해 값이 수정됩니다. 실제로는 자신이 가리키는 개체를 수정합니다. 예제에서는 item.a++ 메소드를 통해 원본 객체의 값이 변경되므로 결국 [ { a: 2, b: 2 } ] 가 출력되어야 합니다.