📖새로 알게 된 것 -useEffect는 클래스의 생명주기 함수의 역할을 한다. 일반적으로 사용할 땐 경우에 따라 componentDidMount, componentDidUpdate 함수의 역할을 하고 만약 componentWillUnmont의 역할을 원한다면 useEffect의 return 값으로 호출하면 된다. useEffect의 return 값은 컴포넌트가 언마운트 될 때 호출된다. -Hook의 규칙 :Hook은 무조건 최상위 레벨에섬나 호출해야 한다. 반복문이나 조건문, 중첩된 함수 등에서는 호출하면 안 된다. :리액트 함수 컴포넌트에서한 Hook을 호출할 수 있다. -if...else를 통해 조건부 렌더링을 할 수 있다. -Inline Conditions :조건문을 코드 안에 집어넣는 것 -in..
📖오늘 공부한 것 1. React Elements : 화면에 보이는 것들을 기술 : Virtural DOM에 존재하는 것이 React Elements이고 랜더링되어 DOM Elements가 되는 것이다. : 불변성 = 엘리먼트는 불변성을 가지기 때문에 내용이 변경되면 엘리먼트가 변경되는 것이 아니라 새로운 엘리먼트를 생성하여 교체하는 것이다. 2. 객체 - new User를 써서 객체를 만들 때 내부적으로 일어나는 일 function User(name) { // this = {}; (빈 객체가 암시적으로 만들어짐) // 새로운 프로퍼티를 this에 추가함 this.name = name; this.isAdmin = false; // return this; (this가 암시적으로 반환됨) } -익명 생성자 ..
객체 -프로퍼티(키-값) 1. 객체 키 유효한 변수 식별자 :점은 키가 유효한 식별자일 때만 사용가능하다. 공백, $, _를 제외한 특수문자가 있는 경우 유효한 식별자가 아니다. 키가 유효한 식별자가 아닌 경우 대괄호 표기법을 이용하면 된다. :사용자 입력 값 등에 의해 key가 변경되는 경우 대괄호 표기법을 사용해야 한다. 2.객체/ 계산된 프로퍼티 :객체를 만들 때 키가 대괄호로 감싸져 있는 경우 : 만약 [fruit]: ... 인 경우 프로퍼티 이름을 변수 fruit에서 가져온다는 뜻이다. 3. 예약어 : 변수 이름엔 예약어 사용이 안되지만 객체의 키 이름으로는 사용할 수 있다. 프로퍼티의 이름엔 다른 제약이 없다! 4.undefined과 in 연산자 : 객체의 경우 존재하지 않는 프로퍼티에 접근하..
프로그래밍 공부를 진행하던 중에... 뭔가 늘어지는 기분이라 눈에 보이는 결과가 있는 공부를 하고 싶다! 라고 생각해서 SQLD 자격증을 따자고 마음 먹었다. 공부를 해야겠다고 마음먹은 것은 접수일부터니까.. 약 한 달 정도이지만 실제로는 2주도 공부를 안 한 것 같다. SQLD 접수 SQLD는 약 3개월 단위로 시험이 진행하고 시험일 약 한 달 전에 일정기간 동안 접수를 받는다. 접수할 때 첫날에 빠르게 접수하는 것을 추천! 할까 말까 미적거리다가 접수했더니 집에서 고사장은 이미 꽉 찼고 그나마 남은 것도 20명 정도밖에 안 남아있어서 냅다 신청했다. 그러니!! 원하는 고사장에서 시험 보려면 첫날에 바로!! 신청해야 한다. SQLD 공부자료 SQLD 공부는 기본적으로 노랭이 라고 불리는 SQL 자격검정..
1. 함수 표현식 :함수를 변수에 할당한 것 :함수는 sayHi()처럼 호출할 수 있다는 점에서 일반적인 값과는 다르나 본질은 값이다. 따라서 값에 할 수 있는 일ㅇ은 함수에도 할 수 있다. :함수선언문에는 세미 콜론이 없지만 함수 표현식에선 쓰는 것이 좋다! -조건문, 반복문, 함수선언문과 같이 중괄호로 만든 코드블럭에는 세미콜론이 붙지 않아도 된다. 하지만 함수 표현식의 경우 함수는 중괄호가 아니라 let 변수 = ...; 구문 안에서의 값의 역할을 한다. 따라서 이러한 구문 ㄲ끝에는 세미 콜론을 붙이는 게 좋다. => 함수 표현식에 쓰인 세미콜론은 함수 표현식이기 때문에 붙은 것이 아니라 구문의 끝이기 때문에 붙여진 거! -함수 선언문은 호이스팅 되어 어디서든 함수를 사용할 수 있지만 함수 표현식은..
1. dangerouslySetInnerHTML -코드에 HTML 텍스트를 넣었을 때 코드가 적용되는 것이 아니라 그대로 나오는 이유는 XSS(사이트 간 스크립팅) 공격을 막기 위해 리액트에서 일부러 설정해둔 것. 따라서 코드를 정상적으로 작동시키기 위해서는 dangerouslySetInnerHTML을 사용해야 한다. 보안상 중요하지 않은 경우 dangerouslySetInnerHTML을 사용하고 보안상 중요한 부분은 따로 모듈을 사용해야 한다. => 리액트를 공부하면서 그 외에 부가적인 가상 DOM, SPA 등에 대해 공부해볼 수 있어서 좋았다. 새롭게 알게 된 것을 그냥 알고 넘어가는 것이 아니라 포스팅을 통해 깊이있게 공부하면 좋을 것 같다. 작은 것이라도 포스팅으로 기록을 남기면 이후에 다시 복습..
1. 레이블 -중첩 반복문을 한 번에 모두 빠져나와야하는 경우 사용한다. -레이블은 반복문 앞에서 콜론과 함께 사용되는 식별자이다. outer: for (let i = 0; i >반복문을 알고리즘 문제를 풀면서 많이 접했지만 레이블이라는 개념은 처음이었다. 알아두..
1.자바스크립트 클로저 -클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경의 조합이다. 즉, 내부함수가 외부함수에 의해 선언됐을 때 리턴되는 내부함수와 외부함수의 스코프의 조합이 되는 것이다. 따라서 함수는 호출된 뒤에는 그 함수 안에 있는 변수에 접근할 방법이 없지만 내부함수 즉, 클로저가 있는 경우 별도로 외부함수의 변수를 참조할 수 있다. -클로저를 이용하는 경우 class의 private를 흉내낼 수 있다. 함수 내부의 변수는 외부에서 접근할 수 없기 때문에 함수 내부에서 this를 이용해 메소드를 사용하면 함수 내부의 변수 은닉화가 가능해진다. -클로저는 전역변수의 사용을 억제하고 최신 값을 유지하는 데에 유용하다. 만약 전역변수에 값이 변경되면 안되는 경우 외부에서의 접근을 막기 위해 함수..
1. 리액트 챕터3 마무리 -CrateContext를 사용하면 컴포넌트끼리 값을 쉽게 전달할 수 있다. -리액트에서 함수 반환 값은 무조건 하나여야 하는데 이를 위해 를 사용하는 것보다 frogment를 사용하는 것이 좋다. -react-router-dom 에선 a태그와 유사한 Link 태그가 사용된다. 2. 프로그래머스 레벨1 알고리즘 3. 모던 자바스크립트 튜토리얼 -연산이 되는 대상을 모두 피연산자라고 부름. 피연산자가 하나면 단항 연산자, 두 개 이상이면 다항 연산자. -== (동등 연산자), ===(일치 연산자) : 일치 연산자는 형을 변환하지 않고 비교한다. -null과 undifined는 동등 연산자로 비교하면 true이지만 서로와 자신을 제외한 모든 것은 false -하지만 null과 un..
어제는 코테를 보고 휴식! 1. 프로그래머스 레벨 1 3개 -코테를 보고 나니 조금만 어려워져도 못 푸는 것 같다. 레벨1부터 차근차근 해결해보면서 알고리즘 강의를 들어야겠다. 2. 모던자바스크립트 튜토리얼 -변수명에서 특수문자는 $와 _만 사용가능 -크롬, 오페라에서 사용되는 자바스크립트 엔진을 v8, 파이어폭스에서 사용하는 자바스크립트 엔진을 spiderMonkey라고 한다.
