반응형
전개 연산자 (spread operator)
- 복수의 파라미터를 가진 함수에 배열을 전달하고자 할 때 사용하는 연산자.
- 호출시 ...배열명 방식으로 호출한다.
아래의 코드는 element가 많아 질 수 록 복잡해지는 문제가 있다.
<body>
<script>
let dummy = function(a, b, c)
{
console.log(a);
console.log(b);
console.log(c);
}
dummy(1,2,3);
</script>
</body>
→ 때문에 전개 연산자로 문제를 해결한다.
<body>
<script>
let dummy = function(a, b, c)
{
console.log(a);
console.log(b);
console.log(c);
}
let ar = [1,2,3]
dummy(...ar); //전개연산자
</script>
</body>
전개 연산자와 가변 파라미터의 관계
Default Parameter
- 파라미터를 넣지 않은 경우, 미리 설정된 기본값을 사용하는 파라미터.
- 과도한 Default Parameter는 가독성을 떨어뜨림.
<body>
<script>
let def = function(x = 100, k)
{
console.log('x =' + x);
console.log('k =' + k);
}
def(); //파라미터를 넣지 않은 경우
def(30);
def(43, 40);
</script>
</body>
사용 예시
버블 소트 실행하는데 오름차순을 많이 쓰는 환경에서 아래와 같이 사용한다.
<body>
<script>
let def = function(x, k = 'ASC')
{
}
bubbleSort = ([3, 1, 5, 2])
bubbleSort = ([3, 1, 5, 2], 'DESC')
</script>
</body>
구형 ES5에서의 가변 파라미터
- arguments 객체를 사용하여 파라미터 리스트를 구함.
- arguments는 배열은 아니나 배열처럼 사용할 수 있음.
- 배열의 로직이 아니다.
<body>
<script>
function dummy (a, b, c)
{
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
}
dummy(1, 2, 3);
</script>
</body>
구형 ES5에서의 전개 연산자
- apply()를 이용하여 전개 연산자와 비슷한 기능 구현
<body>
<script>
function dummy (a, b, c)
{
console.log(a);
console.log(b);
console.log(c);
}
var ar = [1, 2, 3]
dummy.apply(null, ar);
</script>
</body>
반응형
'JavaScript' 카테고리의 다른 글
| [JavaScript] Callback function(콜백 함수), forEach, map, filter (0) | 2022.04.12 |
|---|---|
| [JavaScript] type에 따른 bubble sort(버블 소트) 예제 (0) | 2022.04.11 |
| [JavaScript] primitive type VS object type (0) | 2022.04.11 |
| [JavaScript] 재귀함수(재귀호출) (0) | 2022.04.11 |
| [JavaScript] unshift, Array.isArray (0) | 2022.04.10 |