먼저 Parameter와 Arguments의 차이를 알아보자면 Parameter는 함수 선언부에서, Arguments는 함수 호출부에서 사용된다.

var a = 1;
function test(b) {  // Parameter
    b = b+1;
}
test(a);  // Arguments


CallByValue

: Arguments의 값을 복사하여 함수로 전달한다.
var a = 10;
function add(b) {
    b = b + 10;
    console.log(b); // 20
}
add(a); 
console.log(a); // 10

마지막 log에서 10이 출력되는 이유는 무엇일까? 


 그것은 add함수를 호출할 때 a의 값을 "복사"하여 전달하기 때문이다. add함수의 b는 a의 복사된 값이기 때문에 b에 10을 더하더라도 a에게는 영향을 미치지 않기때문에 10이 출력되는 것이다. 


 기본적으로 자바스크립트에서는 함수를 호출할 때 기본형(number, string, boolean, null, undefined)을 Arguments로 사용하면 CallByValue방식으로 함수가 호출된다. 


CallByReference

: Arguments의 참조값을 함수로 전달한다.
var a = { };
function add(b) {
    b.test = 1;
} 
add(a);
console.log(a.test); // 1

add함수를 호출할 때 a의 참조값을 전달하였기 때문에 add함수에서 새로운 프로퍼티를 추가하면 a에도 적용되는 것을 확인해 볼 수 있다. 정확히 말하자면 a의 참조값을 전달하는 것이 아니라 a의 참조값을 복사한 뒤 전달한다. 


var a = {};
function change(b) {
    b = 1;
    console.log(b); // 1
}
change(a);
console.log(a); // {}

위의 예제를 하나씩 분석해보자.


[ 1 ]. a에는 {} 를 가리키는 0x12라는 참조값을 저장하고 있다.

[ 5 ]. change 함수를 호출하는데 a를 전달하는 것이 아니라 a가 저장하고 있는 0x12라는 참조값을 복사하여 arguments로 사용한다.

[ 2~4 ]. a의 참조값을 복사한값을 저장하는 새로운 변수 b에는 b=1를 실행하기 이전에는 a와 b모두 {} 를 가리키고 있다. 하지만 b = 1을 실행하면서 b에는 1을 가리키는 참조값 0x13이 저장된다.

[ 6 ]. 즉, change 함수에서는 0x12를 1로 가리키도록 바꾼 것이 아니라, b라는 변수에 1을 가리키는 참조값을 저장한 것이다. 따라서 a에는 변화가 없다.


자바 기본서나 여러책에서도 위와 같은 내용이 많이 나오니 참고바란다.












'웹 개발 > 자바스크립트' 카테고리의 다른 글

정규식 (작성중)  (0) 2018.04.25

정규식이란 특정한 규칙을 가지는 문자열을 표현하는 언어이다. 


정규표현식이라는 문구는 문자열이 준수해야하는 패턴을 표현하기위한 텍스트 표현식이다. 정규표현식의 각 문자는 메타문자(특별한 의미로 해석되는 문자)와 정규 문자(리터럴 문자)로 구성된다. 


아래는 간단한 정규표현식 예시이다.

    // 문자열에서 "abc"와 패턴이 일치하는지 검사하는 정규표현식.
    var regex = /abc/;
    regex.test("abc");// true
    regex.test("abcd");// true
    regex.test("abd");//  false

    // 문자열에서 "a와c사이에 b가 0개이상 존재"와 패턴이 일치하는지 검사하는 정규표현식.
    regex = /ab*c/;
    regex.test("abc");// true
    regex.test("ab");// true
    regex.test("adc")// false
    regex.test("abdc")// false


다양한 메타문자.

 \ ( 역슬래시 )

        
    

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 


'웹 개발 > 자바스크립트' 카테고리의 다른 글

CallByValue 와 CallByReference  (0) 2018.04.26

+ Recent posts