concat
[ JavaScript ] 자바스크립트 배열 concat
만약 [ 1, 2, 3 ] 이렇게 세 개의 값을 가지고 있는 배열 arr 가 있다고 가정할 때, 4 를 배열 arr 에 추가 하고 싶다면 push 메서드를 이용하는 경우가 대부분일 것이다. push 를 사용하는 것이 안 좋다는 말은 아님을 분명히 짚고 넘어가며, 리액트 등의 특정 환경에서는 배열안의 본래 값을 수정하면 안되는 경우도 존재함에 concat 사용을 권장한다. push 는 본 배열안에 값을 직접적으로 박아넣어버리는 개념이고, concat 은 배열을 하나 복사해 이 복사본에 값을 박아버리는 개념이라고 생각하면 된다. 예제 코드를 살펴보자. let arr = [ 1, 2, 3 ]; arr.push(4); // [ 1, 2, 3, 4 ] console.log(arr); 서론에서 언급한대로 [ 1, ..
[ React ] 리액트 Input Form 상태 관리, 배열 관리
지금까지는 자식 컴포넌트가 부모 컴포넌트에게 단순한 Element 를 return 해주는 데에 한했다. 이번 게시글에선 Input Element 와 이를 Form 으로 감싸 Form 의 상태를 직접 관리하고, React 에선 배열을 어떻게 쓰는지 간단하게 알아보자. 먼저 UserInput.js 의 소스를 살펴보자. UserInput.js import React, {Component} from 'react'; class UserInput extends Component { //state 에 userName, userGender, phoneNumber 초기화 state = { userName: '', userGender: '', phoneNumber: '' } inputChange = (e) ..
[ MySQL ] 문자열 사이에 구분자 넣어 조회하기
이번 게시글에선 MySQL 에서 SELECT 할 때 조회 된 데이터들 사이에 구분자 ( , ) 를 넣어 조회해보도록 하겠다. 필자는 뚱이, 홍길동, 코난이 각각 과일을 얼마나 먹었는지가 궁금하다고 가정했다. 아래와 같은 TB_TEST 테이블이 있다고 가정해보자. FRUIT 컬럼을 보면 뚱이는 bbbbb, 홍길동은 aaabb, 코난은 abaaa 데이터가 들어가 있다. 무엇을 하고 싶었냐면 저 알파벳 5 자리의 의미는 아래와 같다. 1 번째 자리 : 사과 2 번째 자리 : 딸기 3 번째 자리 : 바나나 4 번째 자리 : 파인애플 5 번째 자리 : 키위 필자는 각 자리에 a 가 들어가 있다면 이 과일을 먹지 않은 것이고 b 가 들어가 있다면 이 과일을 먹었다고 가정했다. 예를 들어 aabab 라면? 3 번째 ..