2026년 상식닷컴 선정 식당 & 카페 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요

자바스크립트에서 함수의 인자 전달 방식은 어떻게 이루어지나요?

_____
Q1: 자바스크립트에서 함수 인자는 어떻게 전달되나요?
자바스크립트에서 함수 인자는 기본적으로 값에 의한 호출(call by value) 방식으로 전달됩니다. 함수 호출 시 인자의 실제 값이 함수 내부의 매개변수에 복사되어 전달됩니다.

Q2: 원시 타입(Primitive Type) 인자는 어떻게 전달되나요?
숫자(Number), 문자열(String), 불리언(Boolean), null, undefined, 심벌(Symbol) 등의 원시 타입 인자는 값 자체가 복사되어 전달됩니다. 함수 내부에서 매개변수를 변경해도 원본 값에는 영향을 주지 않습니다.

```javascript
function changeValue(x) {
x = 100;
}
let a = 50;
changeValue(a);
console.log(a); // 50 (변하지 않음)
```

Q3: 객체(Object) 타입 인자는 어떻게 전달되나요?
객체, 배열, 함수 등 참조 타입 인자는 참조값(메모리 주소)이 값처럼 복사되어 전달됩니다. 함수 내부에서 참조된 객체의 속성을 변경하면 원본 객체에 영향을 줍니다. 다만, 참조 자체를 다른 객체로 재할당해도 원본 객체에는 영향을 주지 않습니다.

```javascript
function changeObject(obj) {
obj.name = 'Alice'; // 원본 객체 변경
obj = { name: 'Bob' }; // 새 객체로 재할당 (원본에 영향 없음)
}
let person = { name: 'John' };
changeObject(person);
console.log(person.name); // 'Alice'
```

Q4: 함수 인자 전달 시 가변 인자(Arguments)는 어떻게 처리되나요?
ES6부터는 rest 파라미터 `...args`를 사용해 임의 개수의 인자를 배열로 받을 수 있습니다. 기존에는 `arguments` 객체를 사용했습니다.
```javascript
function sum(...numbers) {
return numbers.reduce((acc, val) => acc + val, 0);
}
console.log(sum(1, 2, 3)); // 6
```

Q5: 함수 매개변수 기본값은 어떻게 전달되나요?
함수를 호출할 때 인자가 전달되지 않거나 undefined인 경우 매개변수의 기본값이 사용됩니다.

```javascript
function greet(name = 'Guest') {
console.log(`Hello, ${name}!`);
}
greet(); // Hello, Guest!
greet('Alice'); // Hello, Alice!
```

Q6: 인자를 명시적으로 객체로 전달하면 어떤 장점이 있나요?
인자를 객체로 전달하면 인자 순서에 상관없이 이름으로 접근 가능하며, 선택적 인자를 명확히 구분할 수 있어 가독성과 유지보수가 용이합니다.

```javascript
function createUser({ name, age, isAdmin = false }) {
// ...
}
createUser({ age: 30, name: 'Bob' });
```

---

요약하면, 자바스크립트 함수 인자는 원시 타입은 값이 복사되어 전달되고, 객체 타입은 참조값이 복사되어 전달되어 내부 변경이 원본에 영향을 줄 수 있습니다. 함수 호출 시 가변 인자, 기본값, 객체 전달 등 다양한 인자 전달 방법이 지원됩니다.
자바스크립트에서 함수의 인자 전달 방식은 주로 "값에 의한 전달"과 "참조에 의한 전달"로 구분됩니다.

이 두 가지 방식은 자바스크립트의 데이터 타입에 따라 다르게 작용합니다.

자바스크립트는 기본 데이터 타입(Primitive Types)과 참조 데이터 타입(Reference Types)으로 나뉘며, 이 두 가지 타입에 따라 인자 전달 방식이 달라집니다.

1. 기본 데이터 타입 (Primitive Types) 자바스크립트의 기본 데이터 타입에는 `undefined`, `null`, `boolean`, `number`, `string`, `symbol`, `bigint`가 포함됩니다.

이들 데이터 타입은 값이 직접 전달됩니다.

즉, 함수에 인자를 전달할 때, 해당 값의 복사본이 생성되어 함수 내부로 전달됩니다.

예시: ```javascript function increment(value) { value += 1; return value; } let num = 5; let result = increment(num); console.log(num); // 5 console.log(result); // 6 ``` 위의 예제에서 `num` 변수의 값은 5입니다.

`increment` 함수에 `num`을 인자로 전달할 때, `num`의 값이 복사되어 `value`라는 새로운 변수에 할당됩니다.

따라서 `value`를 변경하더라도 원래의 `num` 변수에는 영향을 미치지 않습니다.



2. 참조 데이터 타입 (Reference Types) 자바스크립트의 참조 데이터 타입에는 객체(Object), 배열(Array), 함수(Function) 등이 포함됩니다.

이들 데이터 타입은 메모리의 주소를 통해 전달됩니다.

즉, 함수에 인자를 전달할 때, 해당 객체의 참조(주소)가 전달되므로, 함수 내부에서 객체의 내용을 변경하면 원본 객체에도 영향을 미칩니다.

예시: ```javascript function addProperty(obj) { obj.newProperty = 'Hello'; } let myObject = { existingProperty: 'World' }; addProperty(myObject); console.log(myObject); // { existingProperty: 'World', newProperty: 'Hello' } ``` 위의 예제에서 `myObject`는 객체입니다.

`addProperty` 함수에 `myObject`를 인자로 전달할 때, 객체의 참조가 전달됩니다.

따라서 함수 내부에서 `obj`를 통해 `myObject`의 내용을 변경하면, 원본 객체인 `myObject`에도 변화가 생깁니다.



3. 자바스크립트에서 함수의 인자 전달 방식은 기본 데이터 타입과 참조 데이터 타입에 따라 다르게 작용합니다.

기본 데이터 타입은 값의 복사본이 전달되어 원본 데이터에 영향을 미치지 않지만, 참조 데이터 타입은 객체의 참조가 전달되어 원본 데이터에 영향을 미칠 수 있습니다.

이러한 특성을 이해하는 것은 자바스크립트에서 함수를 사용할 때 매우 중요하며, 코드의 예측 가능성과 안정성을 높이는 데 기여합니다.



4. 추가적인 고려사항 자바스크립트에서 인자를 전달할 때, 기본 데이터 타입과 참조 데이터 타입의 차이를 이해하는 것 외에도, 함수의 인자에 기본값을 설정하거나 나머지 인자를 처리하는 방법도 고려해야 합니다.

기본값 설정: ```javascript function greet(name = 'Guest') { console.log(`Hello, ${name}!`); } greet(); // Hello, Guest! greet('Alice'); // Hello, Alice! ``` 나머지 인자: ```javascript function sum(...numbers) { return numbers.reduce((acc, num) => acc + num, 0); } console.log(sum(1, 2, 3,

4)); // 10 ``` 이와 같이 자바스크립트의 함수 인자 전달 방식은 다양한 상황에서 유용하게 활용될 수 있으며, 이를 통해 더 효율적이고 유연한 코드를 작성할 수 있습니다.

작성자: 정지유 [비회원] | 작성일자: 1년 전 2024-09-10 08:37:03
조회수: 150 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.