본문 바로가기

전체 글

(274)
[Vanilla.js] concat, Object.assign ... 전개연산자 push는 원본을 바꾼다 하지만 concat은 원본은 놔두고 추가로 합친다 // 배열을 합치는 방법 var arr1 = ['num1', 'num2']; var arr2 = ['num3', 'num4']; var newArr= [arr1[0], arr1[1], arr2[0], arr2[1]]; //각각의 인자를 하나씩 가져오는 방법 var sum = [].concat(arr1, arr2); //concat 함수로 합치기 var es6_arr = [...arr1, ...arr2]; //전개연산자로 합치기 객체도 마찬가지로 전개연산자로 가능하다 var [ sum1, sum2, ...remain] = es6_arr; // es6_arr[0] = sum1, es6_arr[1] = sum2, 나머지는 요소들은 re..
[Vanilla.js] startsWith(), endsWith(), includes() ... ES6 [ ES6에 추가된 string 함수들 ] startsWith(): 변수의 앞에서 부터 일치하는 문자열을 찾아 true또는 false를 반환한다. endsWith(): 변수의 뒤에서 부터 일치하는 문자열을 찾아 true또는 false를 반환한다. includes(): 위치에 상관없이 변수에 특정 문자열이 포함되어 있는지를 판단하여 true또는 false를 반환한다. var str = 'Hello World!' console.log(str.startsWith('hello')) //trueconsole.log(str.endsWith('world')) //trueconsole.log(str.inludes('hi')) //false
[React.js] Life Cycle 생명주기 함수 ② 리액트의 생명주기 = 컴포넌트의 생성, 변경 소멸의 과정을 뜻함 shouldComponentUpdate는 props나 state의 변경을 하는 함수이다. 기본 동작은 매 state 변화마다 다시 렌더링을 수행하는 것이다. return값이 true일 경우에만 렌더링한다. 따라서 this.props와 nextProps, 그리고 this.state와 nextState를 비교한 뒤 false나 true를 반환하는 것으로 컴포넌트의 접근을 제한하여 성능을 향상시킬 수 있다. 자세한 내용은 공식문서에서 확인할것! https://ko.reactjs.org/docs/react-component.html#static-getderivedstatefromprops
[React.js] Life Cycle 생명주기 함수 ① 리액트의 생명주기 = 컴포넌트의 생성, 변경 소멸의 과정을 뜻함 render(). constructor(), getDerivedStateFromProps(), componentDidMount() 함수는 componenet의 생성 과정에 속한다. getDefaultProp(), getInitialState() 는 constructor로 대체 되었다. constructor는 생명주기 함수중 가장 먼저 실행되며, 처음 한 번만 실행된다. constructor에서 component 내부에서 사용되는 변수(state)의 선언과 초기화를 하고, 부모 객체에서 전달받은 변수(props)는 super에 던지면 된다. (super는 부모 클래스를 가리키는데 리액트에서는 React.Component를 가리킨다. 또한 su..
[ERROR] Unhandled Rejection (TypeError): Cannot read property 'push' of undefined withRouter의 history.push 사용할 때 import나 export에서 오타가 있다면 발생되는 에러 import { withRouter } from 'react-router-dom'; export default withRouter(Sample)
[ERROR] Redux ... Reducer "user" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value f.. undefined로 할당하지말라고 나오는 문구로 할당을 안해주면 일어나는 실수!!! null이라도 넣어주면 해결 끝
[React.js] Ant Desgin 사용하기 npm i antd --s import 'antd/dist/antd.css'; https://ant.design/ Ant Design - The world's second most popular React UI framework ant.design 버전 업이 되면서 icon은 더이상 antd패키지에 포함되어 있지 않다 따로 사용하려면 npm install --save @ant-design/icons import Icon from '@ant-design/icons';
[Node.js] 백엔드 서버와 프론트엔드 서버를 동시에 켜주는 concurrently npm i concurrently --s package.json의 scripts 안에 "dev": "concurrently \"npm run backend\" \"npm run frontend--prefix 폴더명(실행파일 위치)\"" 이런식으로 기입해준다