키모스토리

Computed Property : 객체내 프로퍼티를 let a = 'age';const user = { name: 'Mike', [a] : 30 // age :30}console.log(user.name, user.age);  객체 메소드 (Object Method) Object.assign() : 객체 복제const user = { name: 'Mike', age: 30}// 이렇게 하면 user 와 같은 객체를 바라보는 참조 변수만 생성됨const cloneUser = user; // 새로운 유저정보를 저장하는 객체 생성const newUser = Object.assign({}, user);// 객체+객체를 복제 가능const newUser2 = Object.assign({ gender:'mal..

객체 리터럴: 단일 사용을 위해 간편하게 객체를 만들어 사용할때let user = { name: 'Mike', age: 30,}  생성자 함수: 위와 같은 데이터 구조를 여러개가 필요할때 사용 (class 와 유사): new 연산자를 이용해 객체를 생성function User(name, age){ this.name = name; this.age = age;}let user1 = new User('Mike', 30);let user2 = new User('Jane', 23);let user3 = new User('Tom', 16);console.log(user1, user2, user3);  생성자 내 메서드 추가 가능function User(name, age){ this.name = name; th..

var, let, const의 차이점중복 선언과 재할당스코프 범위호이스팅중복 선언과 재할당varvar a = 5; console.log(a); // 5var a = 10;console.log(a); // 10a = 15;console.log(a); // 15var 에서는 중복 선언과 재할당이 모두 가능하다.마지막에 할당된 값이 최종으로 변수의 값으로 저장된다.letlet a = 5;let a = 10;cnosole.log(a); // SyntaxError: Identifier 'a' has already been declaredlet 에서는 중복 선언을 허용하지 않는다.중복 선언을 할 경우 SyntaxError 가 발생하게 된다.let a = 5;console.log(a); // 5a = 10;conso..

react 프로젝트가 실행이 되면 home\src\index.js  파일이  실행이 됨 코드를 보면 root element를 찾아서 root.render() 안에 있는 컴포넌트를 실행하도록 되어 있음 const root = ReactDOM.createRoot(document.getElementById('root'));root.render( ); 이때  /pulbic/index.html 파일 안에 있는 안에 의 내용을 삽입해 준 뒤에 브라우저로 랜더링이 된다.  /publc/index.html tag. To begin the development, run `npm start` or `yarn start`. To create a productio..

필요사항 Node.js v14.0.0 이상npm v6.14.0 이상VS Code  #  사용법$ npx create-react-app  # 실제 사용 예제$ npx create-react-app my-app # 경로변경 (change directory)$ cd my-app # 애플리케이션 실행$ npm start 리액트 웹개발을 위한 기본 템플릿이 설치되고 샘플 페이지가 실행이 된다. 예) D:\ReactHome\my-app 경로로 프로젝트를 생성하려면1. vscode => Open Folder 경로를 D:\ReactHome\ 지정하여 오픈2. Terminal > New Terminal 선택 하여 터미널창 열기 3. npx create-react-app my-app 입력 엔터 4. 설치 완료 확인  - ..

React 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 React는 facebook에서 제공해주는 프론트엔드 라이브러리라고 볼 수 있습니다.싱글 페이지 애플리케이션이나 모바일 애플리케이션의 개발 시 토대로 사용될 수 있습니다.  리액트의 장점빠른 업데이트 & 렌더링 속도Virtual DOM Component-Based - 재사용성(Reusability) - 개발 기간이 단축됨 - 유지 보수가 용이함모바일앱 개발에 용이함 (React Native) 리액트의 단점방대한 학습량 - Virtual DOM, JSX, Componet, State, Props 등등의 새로운 개념높은 상태관리 복잡도