목록스터디 (57)
안녕하세요
object.freeze(객체)(쓰지는 않을 듯 함): 객체의 내용을 변경할 수 없도록 할 수 있다. hoisting 현상 (쓰지는 않을 듯 함) var로 변수를 만들면 스코프의 맨 위에서 해당 변수를 선언하고, 할당은 해당 변수를 만든 라인에서 진행하는 것 console.log(단어); // undefined var 단어 = "apple"; console.log(단어) // apple 함수도 마찬가지로 hoisting 현상이 일어난다. var 함수 = function(){} let, const는 undefined가 자동으로 할당이 안됩니다. 전역변수 만들기 (쓰지는 않을 듯 함) window.이름 = "young" ES6 신문법: tagged literal 함수는 `` 로 동작하여 문자열과 변수를 ${..
eventlistener 콜백함수 안에서 this는 e.currentTarget을 가리킨다. 오브젝트 안에서 함수를 동작시키면 this는 window를 가리킨다. const 숫자관련 = { 슷자세기 : function(){ 오브젝트.숫자.forEach(function(){ console.log(this) // window }); } } 화살표 함수로 오브젝트 안의 함수를 동작시키면 this는 오브젝트 안의 함수를 가리킨다. const 숫자관련 = { 슷자세기 : function(){ 오브젝트.숫자.forEach(function(){ console.log(this) // { 함수:f } }); } } 🔻🔻🔻 이벤트리스너에서 function으로 함수를 만들면 this는 window 이벤트리스너에서 화살표함수..
(1) 컴포넌트와 데이터 구조 리액트에서는 같은 레벨에서 데이터를 주고받는 것이 불가능 합니다. 부모에서 자식으로 내려가는 단방향으로방 데이터를 전달할 수 있습니다. 이를 트리형 구조라고 합니다. (2) 데이터를 전달하는 방법 부모에서 만든 [data, setData] = useState();를 이용하여 data와 setData를 각각의 자식에게 하나씩 전달하면 됩니다. data는 DiaryList로 전달하고 setData는 DiaryEditor로 전달하여 수정하는 방식으로 같은 레벨간에 state를 수정하고 렌더링하게 됩니다. 다시 말해, setData와 같은 Event는 부모로 올려 보내고, data는 아래로 내려보내는 구조라 할 수 있습니다. state 끌어올리기라고 할 수 있습니다. (역방향 Ev..
(1) onChage 함수와 e.target 매개변수로 자기 자신의 속성에 접근할 수 있습니다. { console.log(e.target.value); }} /> e.target.value와 같이 접근할 속성인 value를 선택할 수 있습니다. (2) input 태그가 한 줄의 입력창을 만든다면 textarea는 여러 줄의 입력창을 만들 수 있습니다. { setContent(e.target.value); }} /> (3) 역할이 비슷하다면 state를 묶어서 사용하면 됩니다. const DiaryEditor = () => { const [state, setState] = useState({ author: "", content: "", }); (4) 객체를 통째로 업데이트 하는 것이기 때문에 target...