01. 추상화 # 추상화 : 어떤 구체적인 존재를 원하는 방향으로 간략화해서 나타내는 것 - 클래스를 설계하는 것도 추상화 - 클래스 이름, 프로퍼티 이름, 메소드 이름을 직관적으로, 이해하기 쉽도록 잘 정하는 것이 중요 03. 캡슐화 # 캡슐화 : 객체의 특정 프로퍼티에 직접 접근하지 못하도록 막는 것 - 안전성 높일 수 있음 - 멤버변수에 대한 직접 접근을 제한하려는 목적으로(혹은 getter, setter 이름과 구분을 위한 목적으로) 멤버변수의 이름을 언더바(_)로 시작하게 지정 # setter method set email(address){ if(address.includes('@')){ this._email = address; }else{ throw new Error('invaild email..
01. 객체 지향 프로그래밍이란? # 객체 지향 프로그래밍 : 객체 간의 상호작용을 중심으로 하는 프로그래밍 : 프로퍼티와 메소드로 이루어진 각 객체들의 상호작용을 중심으로 코드를 작성하는 것 # 객체 - 변수 : 객체의 상태 - 함수 : 객체의 행동 # 절차 지향 프로그래밍 : 변수와 함수를 가지고 작업의 순서에 맞게 코드를 작성하는 것 02. 객체 만들기 1-1 : Object-Literal # Object Literal : 중괄호 안에 프로퍼티와 메소드를 나열하는 것 03. 객체 만들기 1-2 : Factory function # factory function : 객체를 생성해서 리턴하는 함수 04. 객체 만들기 2 : Constructor function # Constructor function(..
01, 모듈이란? # 모듈 : 간단하게, 자바스크립트 파일 하나 # 모듈화 : 복잡하고 많은 양의 코드를 기능에 따라 각각의 파일(모듈)로 나누어 관리 - 더 효율적인 코드 관리 가능 - 비슷한 기능이 필요할 때 다른 프로그램에서 재사용 가능 02. 모듈 파일의 조건 # 모듈 스코프 : 모듈 파일이 가지는 독립적인 스코프 - 모듈 파일 내에서 선언한 함수나 변수는 모듈 파일 내에서만 사용이 가능 - HTML 파일에서 JS 파일을 불러올 때 모듈 스코프를 갖게 하려면 script 태그에 type 속성을 module로 지정해줘야 함 03. Live Server 설치하기 - 모듈 문법을 활용할 때에는 브라우저에서 직접 파일을 불러오는 방식이 아니라 서버를 통해 html 파일을 실행해야 함 => VS code ..
01. 배열 메소드Ⅰ. forEach와 map # 콜백함수 (CallBack Function) : 다른 함수가 실행을 끝낸 뒤 실행되는 callback되는 함수 # forEach 함수 (method) Array.forEach(callbackfn: (value: number, index: number, array: number[]) => void, thisArg?: any): void : 배열의 요소를 하나씩 살펴보면서 반복 작업을 하는 메소드 - 리턴 값이 없다. (undefined) - array 요소들을 제공된 함수로 한 번 실행 - 기존 배열 변경 가능 - 최대 반복 횟수는 최초 호출 시 요소의 개수 const numbers = [1,2,3,4]; numbers.forEach((x, i, arr)=..
01. 문장과 표현식 문장 (statements) : 어떤 동작이 일어나도록 작성된 최소한의 코드 덩어리 표현식 (expressions) : 결과적으로 하나의 값이 되는 모든 코드 표현식인 문장 vs 표현식이 아닌 문장 - 둘을 구분하는 가장 간단한 방법은 우리가 구분하고자 하는 문장을 변수에 할당하거나, 어떤 함수의 아규먼트로 전달해보는 것 let x; x = 3; console.log(if (x < 5) { console.log('x는 5보다 작다'); } else { console.log('x는 5보다 크다'); }); const someloop = for (let i = 0; i < 5; i++) { console.log(i); }; - console.log 메소드의 아규먼트로 if문을 전달하거나..
01. 함수를 만드는 방법 함수 선언(function declaration) : 가장 일반적인 방법, function 키워드를 통해 함수를 선언하는 방식 // 함수 선언 function sayHi() { console.log('Hi!'); } 03. 이름이 있는 함수 표현식 함수 표현식 (function expression) : 변수에 할당해서 함수를 선언 // 함수 표현식 const sayHi = function () { console.log('Hi!'); }; 05. 값으로서 함수 - 자바스크립트에서 함수는 값으로 취급 // 변수에 할당해서 활용 const printJS = function () { console.log('JavaScript'); }; // 객체의 메소드로 활용 const codeit..
01. 데이터 타입의 특징과 종류 - 자바스크립트는 데이터 타입이 상황에 따라 변할 수 있다 (유연한 데이터 타입) - 곱셈의 경우에는 연산 대상을 모두 숫자 형으로 형 변환을 한 다음 연산을 수행함 - 기본형(Primitive Type) : Number, String, Boolean, Null, Undefined, Symbol(ES2015, 유일한 값을 만들 때), BigInt(ES2010, 엄청 큰 숫자를 다룰 때) - 참조형(Reference Type) : Object 02. Symbol과 BigInt Symbol : 코드 내에서 유일한 값을 가진 변수 이름을 만들 때 사용하는데요. const user = Symbol(); - Symbol이라는 함수를 통해서 심볼 값을 만들어 낼 수 있음 const..
01. 모던 자바스크립트란? - 현시점에 사용하기 적합한 범위 내에서 최신 버전의 표준을 준수하는 자바 스크립트 02. Appetizer Quiz - ECMAScript의 첫 버전은 1997년에 등장 - 여섯 번째(ES6)부터는 매년 새로운 버전들이 출시되면서 ECMAScript의 버전을 부를 때 연호를 붙여ES2015(ES6), ES2016(ES7)으로 부르게 됨 - 자바스크립트 개발자들 사이에서는 ES2015 이후에 매년 출시된 버전들을 통칭하기 위해서 ES2015+ 혹은 ES6+라는 용어를 사용하기도 함 03. ECMAScript 더 알아보기 - JavaScript는 프로그래밍 언어이고, ECMAScript는 프로그래밍 언어의 표준 - ECMAScript는 JavaScript가 갖추어야 할 내용을 ..