즉시실행함수 IIFE, Immediately-Invoked Function Expression
1. 생성자 함수(prototype) 생성자 함수의 이름은 파스칼케이스로 지음 firstName과 lastName은 user라는 생성자 함수가 실행될 때마다 다른내용이 들어올 수 있기 때문에 통일해서 메모리를 관리하기 어려움 getFullName은 로직이 같기 때문
String: "", '', `` Number Boolean: true, false undefined null Array: [] Object: {} 1. 문자(String) > String 전역 객체는 문자열(문자의 나열)의 생성자이다. 문자열은 String 전역
4. 객체(Object) 📌 정적 메소드(Static) > : Object객체의 prototype 속성의 메소드가 아닌 메소드 : 직접적으로 사용할 수 없는 메소드!!!! ex) {}.assign() -> 사용 못함 🔵 Object.assign() > 출처 객체
Object > - 여러 데이터를 Key:Value 형태로 저장합니다. { } 마지막에 쉼표(,)해야 이동, 삭제 시 유용함. 🔵 접근, 추가, 삭제 👾 #1 접근 2. 추가 3. 삭제 🔵 단축 프로퍼티 🔵 프로퍼티 존재 여부 확인 👉🏻 in
호이스팅(Hoisting) > 스코프 내부 어디서든 변수 선언은 최상위에 선언된 것 처럼 행동 TDZ(Temporal Dead Zone) 변수 선언 > var, let, const 🔵 var var는 선언하기 전에 사용할 수 있다. 👉🏻 아래와 같이 동
Symbol > 유일한 식별자를 만들기 위해 사용 인수로 해당 식별자의 설명을 부여할 수 있음. 👾 #1 👾 #2 property key:심볼형 👉🏻 Object.keys(user), Object.values(user), Object.entries(user
정규표현식 > 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식언어 문자열을 대상으로 패턴 매칭 기능을 제공함. 🔵 RegExp생성자 함수 > new RegExp(pattern,[, flags]) 🔵 RegExp 메서드 RegExp.prototy
...은 하나로 뭉쳐져 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만듬.Array, String, Map, Set, DOM컬렉션(NodeList, HTMLCollection), arguments와 같이 for of문으로 순회할 수 있는 이터러블에 한정됨.
DOM은 HTML문서의 계층적 구조와 정보를 표현하며 이를 에어할 수 있는 API, 즉 프러포티와 메서드를 제공하는 트리자료구조다.인수로 전달한 id 어트리뷰트 값을 갖는 하나의 요소 노드를 탐색하여 반환id를 갖는 HTML요소가 존재하지 않을 경우 null을 반환id
setter, getter모두 존재하는 접근자 프로퍼티로서 요소 노드의 HTML마크업을 취득하거나 변경함.요소 노드의 콘텐츠 영역 내에 포함된 모든 HTML마크업을 문자열로 반환함!!!할당 시 요소 노드의 모든 자식 노드가 제거되고 HTML마크업이 파싱되어 요소 노드의
이벤트 >- 이벤트 핸들러: 이벤트가 발생했을 때 호출될 함수 이벤트 핸들러 등록: 이벤트가 발생했을 때 브라우저에게 이벤트 핸들러의 호출을 위임하는 것 1. 이벤트 핸들러 등록 🔵 어트리뷰트 방식 > - 이벤트 핸들러 어트리뷰트 이름은 onClick과 같이 o
자바스크립트의 객체 표기법: package.json파일을 자동으로 생성함string: ""만 사용 가능함!!!\-> 객체의 속성명에 ""을 사용함!!!undefined는 데이터로 사용할 수 없음!!!.json파일은 하나의 데이터가 된다!!!ex)import myDat
1. 가져오기, 내보내기 🔵 가져오기(import) > Named export: import시 가져올 함수에 {}를 감싸야 함 import로 가져온 함수에 별칭 지정하기 : as 👾#1 🔵 내보내기(export) > Default export : 함수에 이
render() 메서드를 정의해줘야 함.render() {return React.Element 반환 필수}📎 import📎 정의📎 사용상속받거나 확장하는것이 아닌 순수한 함수📎 import📎 정의1📎 정의2📎 사용
npm i webpack webpack-cli webpack-dev-server@next : webpack-cli랑 webpack-dev-server의 버전을 같게 맞춰주기 위해 @next를 붙여줌. 개발서버 오픈 script 부분에 "dev" : "webpack-d
npm install --save styled-components요소에 대한 메소드를 가지고 있음.styled.button(), styled.button\`\`처럼, 버튼은 styled객체의 메소드임!👉🏻 고유한 클래스 이름을 갖기 때문에, 여기서 설정한 스타일은
create-react-app에서 제공.컴포넌트에 대해 고유한 클래스와 고유한 버전의 스타일과 클래스를 생성css파일에 스타일을 작성하고 우리가 사용하는 컴포넌트로만 범위를 한정할 수 있음.css코드와 자바스크립트 파일을 분리하여 사용 가능함.Button.module.
👾 \`\`\`jsimport React, { useState } from "react";function Hello() { return Hello;}function App() { const showing, setShowing = useState(false); c