> 웹 프론트엔드 > JS 튜토리얼 > js 함수의 값으로 매개변수 전달

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

小云云
풀어 주다: 2018-01-18 14:43:05
원래의
1842명이 탐색했습니다.

이 기사는 주로 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 } ] 가 출력되어야 합니다.

관련 추천:

html에서 페이지 점프 시 매개변수를 전달하는 방법

php 참조 정의 및 매개변수 전달 사용 예에 ​​대한 자세한 설명

php 함수의 기본 구문에 대한 자세한 설명 및 사용 예 매개변수 전달

위 내용은 js 함수의 값으로 매개변수 전달의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿