반응형 Tech41 javascript call, apply, bind 차이점 call, apply, bind 공통점 함수를 호출하는 방법으로 쓰인다. 1. Call call 은 함수를 호출 하며 첫 번째 인자에는 this에 바인딩 되는 값을 넘겨준다 다만 ex6 arrow function으로 사용할경우 특성상 window (최상위 scope)를 나타넨다 그리고 두번째 인자부터 파라미터 값을 넘겨줄 수 있다. const testFunction = function (e) { console.log(this, e) } const testArrowFunction = (i) => { console.log(this, i) } testFunction.call({name: 'testName'}, {old: 13}) testArrowFunction.call({name: 'testName'}, {o.. 2021. 4. 15. var, let, const 차이 var(재선언 및 같은이름으로 재선언가능) var a = 'a' a = 'aa' console.log(a) var b = 'b' var b = 'bb' console.log(b) // aa // bb 재선이 가능하며 b라는 이름의 변수가 있어도 같은이름으로 제선언가능하다. 같은이름으로 재선언된다는 점은 좋지안은 결과이다. 그렇기 때문에 ex6에서 let, const가 나와 해당 이슈를 해결하였다. 또한 var는 호이스팅이 발생하기 때문에 의도치 안은 이슈가 발생하기도 한다. let(재선언 가능, 호이스팅이 발생하지 안는다, 같은이름으로 재선은 불가) let c = 'c' c = 'cc' console.log(c) let d = 'd' // let d = 'dd' console.log(d) var 처럼 재.. 2021. 4. 14. 호이스팅(Hoisting) 호이스팅은 유효 범위의 최상단으로 올라가는 현상을 말한다. 호이스팅은 var 와 function 로 나눌 수 있다. var 호이스팅 if (true) { var a = 'testA' } console.log(a) 결과 // testA 위 코드처럼 a라는 변수가 최산단으로 올라가 console.log에 찍히는 현상을 확인 할 수 있다 하지만 es6넘어가면서 let, const 를 사용하여 이러한 이슈를 해결 할 수 있다. ※var, const, let 차이 function 호이스팅 testFunction() function testFunction() { console.log('testFunction') } // testFunction 위 함수처럼 비록 실행문 아래에 함수를 정의하더라도 호이스팅으로 스크립트.. 2021. 4. 14. Function VS Arrow Function 차이점 결론부터 말하면 다음과 같다. Function Arrow Function 1 함수 자체에 이름을 정의가능하다 함수 자체에 이름을 정의 할 수 없다. 2 argumnets 사용할수 있다 argumnets 대신 Rest Parameters는 사용할 수 있다. 3 this 는 현제 scope(범위) 를 의미한다. this 는 최상의 범위를 의미한다. 1. 이름정의 function test () { console.log('test') } const test2 = () => { console.log('test2) } Function 함수는 이름을 정의가능하다. 하지만 Arrow Fucntion은 변수를 할당하여 이름을 정의 할 수 있다 그러므로 Arrow Function은 Function 함수처럼 호이스팅이 일어.. 2021. 4. 14. Next + Typscript + Redux + Redux-Saga 설정 React + Redux 상테에서 Redux-Saga 설정 1. redux-saga 모듈 설치 npm install redux-saga npm install axios // saga 로직에서 쓰임 2. actions, reducers, store 폴더에 해당 파일을 생성한다. store/actions/actionTypes.ts 수정 export const INCREASE = 'counter/INCREASE' export const DECREASE = 'counter/DECREASE' // search export const SEARCH = 'SEARCH'; export const SEARCH_SUCCESS = 'SEARCH_SUCCESS'; export const SEARCH_FAIL = 'SEARCH_.. 2021. 3. 11. Next + Typscript + Redux 설정 Redux를 설정전 Next, Typescript 설정은 저의 다른 글에서 확인할 수 있습니다. jktech.tistory.com/44 Next.js(react) 프로젝트 시작 React의 SSR (server-side rendering) 프레임워크인 Next 프로젝트 환경: Windows, VScode, npm ※ npx는 자바스크립트 패키지 관리 모듈인 npm(Node Package Module)의 npm@5.2.0 버전부터 새로 추가된 도구입.. jktech.tistory.com jktech.tistory.com/45 Next + Typescript 설정 Next 프로젝트 설정은 제 블로그 에서 확인할 수 있습니다. jktech.tistory.com/44 Next.js(react) 프로젝트 시작 R.. 2021. 3. 11. 이전 1 2 3 4 ··· 7 다음 반응형
