전체 글157 [React] 1-10. document 를 접근하는 ref ref document.querySelector('input').focus() 위의 코드처럼 자바스크립트에서 직접 접근할 때는 보통 직접 'document' 키워드를 통해 접근하였지만, 리액트에서는 직접 document를 통해 접근하는일은 거의 없다. 리액트가 화면을 컨트롤 할 수 있게 하는 것이 좋다. 리액트 개발을 하다보면 DOM 에 직접적인 접근을 해야 할 때가 있습니다. 그럴 때는 ref 라는것을 사용한다. 아래 예와 같이 input 등에 focus를 해야할 때 특정 DOM의 크기를 가져와야할 때 외부 라이브러리(플레이어, 차트)를 사용할 때 hello; // 클래스 선언 render(){ return ( {this.state.first}곱하기{this.state.second}는? {this.he.. 2020. 9. 25. [JavaScript] 스프레드(spread) 문법 스프레드(spread) 객체 혹은 배열을 펼칠 수가 있다 문법: 배열을 빠져나온다. const fruit = { name: '과일' }; const greenfruit = { name: '과일', color: 'green' }; const greenmelonfruit = { name: '과일', color: 'green', attribute: 'melon' }; console.log(fruit); console.log(greenfruit); console.log(greenmelonfruit); 먼저, fruit 라는 객체를 선언한다음, greenfruit 객체를 만들었습니다. 이때 greenfruit는 name: '과일' 을 그대로 두고, 새로운 객체를 만들어서 사용하였습니다. 그 이후, greenmel.. 2020. 9. 23. [JavaScript] 호출 스택과 이벤트 루프 호출 스택 함수가 호출() 될 때 호출스택에 들어간다고 생각하고 끝날 떄 }를 나간다고 생각하면 편하다. 다만 호출 스택으로 설명이 안되는 것이 있다 바로 setInterval(tick, 2000) 이다. 호출 스택, 백그라운드(노드 내부 엔진), 태스크 큐(백그라운드에서 보낸 콜백들이 실행 대기중)로 구성되어 있다 먼저 setInterval(tick, 2000) 함수가 호출스택에서 실행된다. 실행이 끝나면 호출스택에서 사라진다. 백그라운드에서 tick이 2초마다 호출스택에 다시 넣어준다. 호출스택에 넣어줘야 다시 실행이 되기 때문이다. 백그라운드에 여러개의 작업들이 들어가 있을 수 있다. ex) 이벤트리스너, 프로미스 등등 콜백함수가 비동기적으로 실행될 수 있게 대기중이다. 이벤트 루프: 무한루프처럼 .. 2020. 9. 19. [JavaScript] for, forEach for 초깃값(index) 부터 시작해서 조건(condition)을 만족시킬 때까지 증가 또는 감소(final-expression)하면서 계속 반복합니다. for( 초기값; 조건; 증감;){ statement } for(var i = 0; i < 10; i++){ console.log(i); } forEach는 for문과 마찬가지로 반복적인 기능을 수행할 때 사용합니다. 하지만 for문처럼 index와 조건식, increase를 정의하지 않아도 callback 함수를 통해 기능을 수행할 수 있습니다. forEach forEach는 배열 객체 메서드 입니다. forEach는 for문과 마찬가지로 반복적인 기능을 수행하는데 사용합니다. 하지만 for문처럼초깃값(index) 와 조건(condition), 증가.. 2020. 9. 14. 이전 1 ··· 30 31 32 33 34 35 36 ··· 40 다음