WeCode Replit JavaScript 과정을 공부한 뒤 내용을 요약한 표입니다.
| Subject | Contents | Keywords |
|---|---|---|
| Introduction to Javascript | 1. JavaScript 소개 2. 알림창 띄우기 3. console.log | alert, console.log |
| 주석 | 1. 주석이란? 2. 주석을 사용하는 이유 3. 주석의 형태 | //, /* */ |
| Variables | 1. 변수의 사용 2. 변수의 생성 (선언) 3. 변수 이름 정하기 4. let, const 5. 변수 값 수정 cf. 변수의 선언, 값의 할당 | var, let, const, camelCase, snake_case, 변수 선언과 할당의 분리 |
| Function (함수) - 기본 | 1. 함수의 정의 2. 함수의 호출 3. 함수의 형태 | function variable() { }; variable(); |
| Function(함수) - 데이터 반환하기(1) | 1. 함수의 반환(return) 2. 매개변수와 인자 | return, parameter, argument |
| Math Expressions | 1. Math expressions 2. 다소 생소한 수학 표현식 3. 수학식 계산 순서 | +, -, *, /, num++, ++num, num--, --num |
| 텍스트 문자열의 연결 | 1. 텍스트 + 텍스트 조합 2. 텍스트 + 숫자 조합 | 텍스트 조합 시 + 연산자 사용, 텍스트 + 숫자 조합 시 에러 주의 |
| if문 | if문 사용법, 원리 | if, if else, else |
| 비교연산자 | 비교연산자와 동등연산자 | ===, !==, >, <, >=, <=, == |
| 논리연산자 | 논리연산자 작성법 | 논리연산자 작성 시 주의점, 괄호, and와 or 표기법 |
| Function(함수) - 데이터 받기 | 1. 함수의 기본 정의 및 실행 2. 함수에 데이터(= 인자, argument) 전달하기 3. 함수 데이터 전달 시 주의사항 | argument, parameter, 함수의 호출(데이터 전달) |
| Function(함수) - parameter, argument | 매개변수와 인자의 개념 | 매개변수, 인자 |
| Function(함수) - 여러 인자 | 여러 인자를 가진 함수 사용 | 매개 변수, 여러 인자, if문 |
| Function(함수) - 데이터 반환하기(2) | 1. return 함수 정의 2. return 함수의 호출 3. return 함수의 호출 결과 확인 4. 함수와 return 키워드 5. 함수 내부에서 다른 함수 호출하기 | return, undefined, 함수 내부에서 다른 함수 호출 |
| Array | 1. 배열의 필요성 2. 배열의 구조 3. 배열의 길이 | let array = [1, 2, 3]; array[0] // 1; array[1] // 2; array.length // 3; |
| for 문 | 1. for 문의 필요성 2. for 문의 구조 3. for 문의 작동 방식 | for (let i = 0; i < arr.length; i++); |
| 배열 조작하기 | 1. 요소 추가 2. push/unshift 함수 3. 배열 조작 방법 4. pop 함수 | index, push, unshift, pop |
| 데이터 타입 | typeof 연산자 | typeof, undefined, null, boolean, string, number, object, function |
| String | 1. String 표기법 2. 대소문자 바꾸기 3. 문자 길이 4. 문자열 찾기 | ' ', " ", toUpperCase(), toLowerCase(), string.length, string.indexOf, string.slice |
| String <-> Number 변환 | 문자, 숫자 간의 변환 | Number(), String(), NaN, parseInt(), parseFloat(), number.toString(), 1234 + "" => String, "1234" -0 => Number |
| 날짜와 시간 | 1. 날짜 객체 호출, 생성 2. 브라우저별 날짜 표현법 3. .getTime() 4. 특정 날짜의 Date | new Date(), .getFullYear(), .getMonth()+1, .getDate(), .getDay(), .getHours(), .getMinutes() .getTime() |
| Number | Math 객체의 메서드 | Math.round, Math.ceil, Math.floor |
| Object | 객체 선언법, 사용법 | let myObj = {key: value} |
| Scope | scope, block의 개념 | scope, block, global scope, global variable, block scope, local variable, global namespace, scope pollution |
| Class | Class의 개념 생성자(Constructor), 인스턴스(Instance), 메서드(Method) | Class, 객체, this, 생성자, 인스턴스, 메서드 |
| Object - 다시 :) | 객체의 구조, key 설정 방법, 프로퍼티 접근, 변수로 프로퍼티 접근하기, 프로퍼티 할당, 메서드, 중첩된 객체, reference | 객체, key, value, 프로퍼티, 변수로 프로퍼티 접근, 프로퍼티 할당, 객체에 저장된 값 = 함수 => 메서드, 중첩된 객체, reference |
| [es6] arrow function | ES6(ECMA Script 2015), arrow function | arrow function |
| [es6] template literals, string method | template literals, string method | ${variable}, startsWith, endsWith, includes, split |
| array methods | Array.map(), Array.forEach() | const arr = [1, 2, 3]; const squares = arr.map(x => x * x); // [1, 4, 9]; const arr2 = [1, 2, 3]; arr2.forEach(el => console.log(el)); // 1, 2, 3; |
| object (3) | 객체의 키를 변수로 접근하기, 객체 순회하기 | const information = {name: '김개발'}; const verb = 'developes'; const project = 'facebook'; information[verb] = project // facebook information.developes = 'facebook' // facebook object.keys, object.values, object.entries, for-in 문 |
Front-end developer