개발공작소
728x90
[JS] ES6문법 : 전개구문 ( Spread Syntax )에 대해 알아보자 ( 배열 및 객체 복사 , ... 문법 )
FrontEnd/JavaScript 2022. 3. 19. 06:55

오늘은 ES6에서 추가 된 문법인 전개구문( Spread Syntax )에 대해 알아보자. 배열이나 객체를 복사하여, 새로운 배열 및 객체를 생성 할 때 사용하는 문법으로, 연결 및 복사 할 때 유용하게 쓰이는 문법이다. 1. 배열에서의 Spread Syntax ----------------------------------------------------------------------------------------------------------------------------------- ES6에 추가된 문법으로 기존에는 각 배열을 합쳐 새로운 배열을 생성할 때 concat함수를 이용하고는 했는데, 전개구문이 나오면서 더 깔끔하게 구현할 수 있게 되었다. 1) 배열병합 2. 배열복사 2. 객체에서의..

article thumbnail
[JS] splice함수와 slice함수에 대해 알아보자. ( 배열 값 자르기 )
FrontEnd/JavaScript 2022. 3. 9. 18:26

배열에서 지원하는 API중 배열안의 값을 자를 때 사용하는 함수에 splice와 slice가 있는데, 비슷하지만 다른 점이 있어 이렇게 같이 정리한다. 핵심 : splice는 기존 배열을 변경, slice는 원본 배열은 변경되지 않고, 새로운 배열 객체를 반환 Array.prototype.splice() ========================================================================== splice 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경한다. 기본문법 [배열명].splice(시작, 엔드); 예제 결과 결과를 보면 array는 0~3번째 속성이 잘려서 4~5번째 속성만 가지는 배열로 변경이 되었고, newA..

article thumbnail
[JS] javascript 배열 함수 : push( ), pop( ), shift( ), unshift( )에 대한 정리
FrontEnd/JavaScript 2022. 3. 5. 01:51

평소에 배열에 값을 추가할 일이 많아 push()를 많이 사용했는데, 배열에서 값을 제거 할 일은 없어서 pop()을 사용 할 일이 없었다. 거기에 shift()와 unshift()와 같이 배열의 왼쪽에 추가하거나, 제거하는 일은 더더욱 없었다.. 그런 김에 정리해본다. 핵심 배열에 값을 추가하는 함수 .push() : 배열의 오른쪽에 값을 추가 .unshift() : 배열의 왼쪽에 값을 추가 배열에서 값을 제거하는 함수 .pop() : 배열의 오른쪽의 값을 제거 .shift() : 배열의 왼쪽의 값을 제거 그럼 바로 테스를 해보자. testArray라는 배열을 선언하고 초기값으로 [1,2,3,4,5,6]을 줬다. 그리고 push()로 오른쪽에 7을 넣어주고 unshift()로 왼쪽에 0을 넣어준 뒤, ..

article thumbnail
[Postgres] 기본적인 배열함수를 알아보자 ( feat. array_agg, array_to_string, string_to_array, unnest)
데이터베이스/쿼리 2022. 2. 3. 07:26

오늘은 Postgres에서 지원하는 기본적인 배열함수를 알아보자. 물론 툴은 DBeaver를 사용 할 것이고, 웹로그 테이블을 테스트 테이블로 사용한다. 1. array_agg 2. array_to_string, string_to_array 3. unnest 이렇게 3개의 함수를 지원한다. 그럼 바로 하나하나 알아보자. 1. array_agg ============================================================================ array_agg는 여러 row를 하나의 배열로 만들고자 할 때 사용하는 함수이다. inner조인으로 가져온 row값들은 보통 각각 다른 행으로 이루어 진다. 하지만 가져온 행값을 하나의 배열로 사용해야 할 때가 있다. 예를 들면..

article thumbnail
[JS] javascript : push 함수와 concat 함수를 차이점을 알아보자.
FrontEnd/JavaScript 2022. 2. 3. 01:01

javascript를 쓰다보면 배열을 합치거나, 새로운 속성을 추가하는 일이 많은데, 그때 많이 쓰는게 바로 push와 concat 함수이다. 자주 쓰지만, 설명해보라고 하면 어버버.. 할 것 같다. 그래서 정리해본다. ============================================================================ 가장 큰 차이점은 아래와 같다. 1. push는 기존 배열에 원소를 추가한 뒤 총 길이를 리턴한다. 2. concat은 기존 배열에 원소를 추가한 뒤 새로운 배열을 리턴한다. 즉, push는 기존 배열의 데이터가 수정되고, concat은 새로운 배열을 리턴하기 때문에 기존 데이터는 변경되지 않는다. 사용법은 아래와 같이 사용한다. 1. push : 결과..

article thumbnail
[JS] Javascript flat 함수에 대해서 알아보자 (배열 안 배열 제거)
FrontEnd/JavaScript 2022. 2. 3. 00:29

오늘은 javascript에서 지원하는 flat 함수를 정리해보겠다. 카카오API를 가져오는 공부를 하는데.. 주소를 가져올 때 배열을 3개, 4개 씩 가져오는 것이었다.. Vue의 v-for 디렉티브를 이용할 때는 배열이 1개인 게 뿌려주기 쉽기 때문에, 배열을 합쳐줘야 하는데... 그냥 push나 concat을 이용하여 합쳐주니 다음과 같은 모습이 되었다.. 우선 내가 배열을 3개 만들었고, resultArray라는 배열을 만들어 그 안에 push해주고 있다. 그런데 resultArray에는 다음과 같이 담겼다.. 즉 배열안에 배열이 들어갔다는 말이다. 나는 배열안에 배열을 넣는 게 아닌, 배열안에 있는 객체들을 resultArray에 넣고 싶은데... 그때 사용 할 수 있는 게 flat함수이다. 이..

728x90