본문 바로가기

전체 글75

[React] 한눈에 보는 리액트 React 리액트의 개요 React는 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리입니다. 처음부터 점진적으로 적용할 수 있도록 설계되었으며 필요한 만큼 React를 사용할 수 있습니다. JSX const element = Hello, World!JSX라 하며 JavaScript를 확장한 문법입니다. React Element(엘리먼트)를 생성합니다. JSX란? React에서는 이벤트가 처리되는 방식, 시간에 따라 state(상태)가 변하는 방식, 화면에 표시하기 위해 데이터가 준비되는 방식 등 렌더링 로직이 본질적으로 다른 UI 로직과 연결됩니다. 별도의 파일에 마크업과 로직을 넣어 기술을 인위적으로 분리하는 대신, 둘 다 포함하는 Component(컴포넌트) 부르는 느슨하게 연결된 유닛.. 2020. 8. 24.
[JS] iterator 이터러블 이터레이션 프로토콜 이터레이션 프로포콜은 순회 가능한 데이터 컬렉션(자료구조)을 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다. ES6 이전: 순회 가능한 데이터 컬렉션인 배열, 유사 배열 객체, 문자열 등은 통일된 규약없이 for문, for...in문, forEach등 다양한 방법으로 순회할 수 있었다. ES6: 배열, 유사 배열 객체, 문자열 등 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일하여 for...of문, 스프레드 문법, 디스트럭처링 할당의 대상으로 사용할 수 있도록 일원화하였다. 이터레이션 프로토콜에는 이터러블 프로토콜과 이터레이터 프로토콜이 있다. // 순회 가능한 자료 구조 [Symbol.iterator]() // iterat.. 2020. 7. 23.
[JS] Symbol Symbol ECMAScript로 표준화된 자바스크립트로 ES6에 새롭게 추가된 7번째 타입으로 변경 불가능한 원시 타입의 값이다. 다른 값과 중복되지 않는 유일무이한 값이며, 주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용한다. Symbol 생성 Symbol 함수 Symbol 함수를 호출하여 생성한다. 다른 원시값, 즉 문자열, 숫자, 불리언, undefined, null 타입의 값은 리터럴 표기법을 통해 값을 생성할 수 있지만 심볼 값은 Symbol 함수를 호출하여 생성해야 한다. Symbol함수는 String, Number, Boolean 생성자 함수와는 달리 new 연산자를 사용하지 않는다. new Symbol(); // TypeError description 프로퍼티와 to.. 2020. 7. 23.
[JS] 함수형 프로그래밍 - 기본 평가 코드가 계산되어 값을 만드는 것 일급 - 값으로 다룰 수 있다. 함수의 인자로 사용될 수 있다. 함수의 결과로 사용될 수 있다. const a = 10; // 값으로 다룰 수 있다. 변수에 담을 수 있다. const add10 = a => a + 10; // 함수의 인자로 사용될 수 있다. const r = add10(a); console.log(r); // 20 함수의 결과로 사용될 수 있다. 일급 함수 함수를 값으로 다룰 수 있다. 조합성과 추상화의 도구이다. const add5 = a => a + 5; console.log(add5); // a => a + 5 console.log(add5(5)); // 10 const f1 => () => () => 1; console.log(f1()); /.. 2020. 7. 20.