초코딩(chocoding)

1. 저장 공간 State 변화 -> 렌더링 -> 컴포넌트 내부 변수들 초기화 Ref의 변화 -> No 렌더링 -> 변수들의 값이 유지 State의 변화 -> 렌더링 -> 그래도 Ref의 값은 유지 => 렌더링 시에 변경되지 말아야 할 값을 다룰 때 편리하다. 2. DOM요소에 접근 손쉽게 input에 접근 가능 - useRef의 장점 컴포넌트의 값이 바뀔 때마다 렌더링이 발생된다면 성능적인 측면에서 좋지 않다. 이때 자주 바뀌는 값을 useState()가 아닌 useRef를 통해 받는다면 성능적인 부분에서 더 뛰어나게 구현할 수 있다. Ref와 Var의 값을 올리고 랜더링 했을 때 Var의 값은 초기화되고 Ref의 값은 그대로 유지되는 것을 볼 수 있다. 이유는 아래와 같다. - 변..

함수를 사용하는 이유 1. 코드의 재사용 2. 유지보수의 편의성 3. 코드의 신뢰성 4. 코드의 가독성 향상 자바스크립트의 함수 => 객체 타입의 값 => 따라서 함수 리터럴로 생성 가능 => 함수 리터럴 : "function 키워드, 함수 이름, 매개 변수 목록, 함수 몸체"로 구성 함수를 정의하는 방법 => 함수를 정의한다는 면에서는 동일, 미묘한 차이가 존재 1. 함수 선언문 2. 함수 표현식 3. Function 생성자 함수 4. 화살표 함수 1. 함수 선언문 DOCTYPE html> Document "use strict" function add(x, y) { return x + y; } console.log (add(1, 2)); 연습중 함수 선언문은 함수 이름을 생략할 수 없다. 표현식이 아닌..

객체란? 변경 가능한 값으로 프로퍼티와 메서드의 집합체 프로퍼티(property) : 객체의 상태를 나타내는 값(data) 메서드(method) : 프로퍼티(상태데이터)를 참조하고 조작할 수 있는 동작(behavior) 인스턴스(instance): 클래스에 의해 생성되어 메모리에 저장된 실체, 객체가 메모리에 저장되어 실제로 존재하는 것에 초점을 맞춘 용어. DOCTYPE html> Document "use strict" let obj = {}; let key = "Hello"; obj[key] = "world"; console.log (obj); let person = { name: "pororo", age: 100, introduce: function() { console.log (`Hello, my..