WeCode Pre-Course 의 2주차 코스 JavaScript
우선 나는 JavaScript 의 기초도 모르며 경영을 전공한 비전공자이다. 밑바닥의 지식 수준에서 입문하는만큼 기초부터 차근차근 공부해나가려 한다. Pre-Course 4주 중 총 2주의 시간을 JavaScript (이하 'JS') 를 공부하는 커리큘럼이다. 코딩과는 연이 없던 내가 2주 기간의 준비로 본 코스 시작 전까지 얼마만큼의 지식을 쌓을 수 있을지 아니면 테트리스 터지듯 쌓아놓은 지식이 다 사라질지 모르겠지만 최대한 노력해볼 것이다.
WeCode의 1주차에서는 HTML 과 CSS 를 활용하여 자기소개 페이지를 제작하였었다
https://sui3422.github.io/intro-page/. 어떻게 시작해야할지도 감도 못잡았었다. 코딩 문맹인인 나에게 현대문명 지식의 보관소인 유튜브 덕분에 HTML과 CSS 를 생애최초로 접한 나는 바닥을 긁는 지식수준으로 겨우겨우 제작을 시작하였다. 비록 매우 간단한 페이지이지만 구현에 꽤 많은 기초공부와 시간을 많이 할애하여야 하였기에 velog 작성 자체를 잊어버렸다. 뭔가 일기처럼이라도 기록으로 남겼어야 했는데 안타까울 따름이다. 일주일 간의 내 지식수준으로 겨우 구현가능 한계점이라고 볼 수 있다.
1일차의 JS 학습 목표는 용어에 대한 개념 익히기와 자료형과 상수 변수에 대해서 공부하였다. 개인적으로 교재는 저자직강이 있는 강의를 선호하기에 '혼자 공부하는 자바스크립트' 라는 책을 선택하였고 저자분의 유튜브 강의를 통해 0 ~ 10강 까지 학습하였다. 이렇게하니 10강이나 들었으니 엄청 많이 공부한 것 같지만 앞에 0 ~ 4강은 학습환경 설정이므로 실질적인 개념강의는 6강이라고 볼 수 있다.
2021/05/10 JavaScript 개념 공부 요약
1. 기본용어
- 표현식 : 자바스크립트에서 값을 만들어내는 간단한 코드
- 문장 : 하나 이상의 표현식이 모인 것. 문장의 종결은 ; 또는 줄바꿈으로 표현
- 프로그램 : 문장들이 모인 것
- 키워드 : 자바스크립트가 만들어질 때 정해진 특별한 의미가 있는 단어들이며 식별자로 사용할 수 없다.
- 식별자 : 프로그래밍 언어에서 이름을 붙일 때 사용하는 단어이다. 주로 변수나 함수명에 사용된다. 자바스크립트에서 식별자를 만들 때 규칙은 키워드 사용불가, 숫자로 시작하면 안됨, 특수문자는 '_' 와 '$' 만 허용, 공백문자 포함불가 하다는 규칙이 있다.
- 주석 : 프로그램 코드를 설명하는 문장, 프로그램에 전혀 영향을 주지 않음.
2. 식별자의 종류
| 구분 | 단독으로 사용 | 다른 식별자와 사용 |
|---|---|---|
| 식별자 뒤에 괄호 없음 | 변수 | 속성 |
| 식별자 뒤에 괄호 있음 | 함수 | 메소드 |
3. 자료의 종류
- 숫자(Number)
- 문자열(String)
- 불(Boolean)
4. 문자열 자료형
- 문자의 집합을 문자열이라하며 자바스크립트에선 문자가 하나든 여러 개든 모두 문자열 자료형이라고 칭한다.
- 문자열 자료형을 만들때 "" 나 '' 모두 이용할 수 있지만 한종류로 일관되게 사용을 해야한다. 따옴표를 문자 그대로 사용하고 싶다면 이스케이프 문자( \ ) 를 따옴표 앞에 넣어주면 된다.
- 문자열도 연산자를 사용하여 연산처리 가능 예를 들어 '안녕' + '바이' = '안녕바이' 로 + 연산자를 통해 문자열을 연결가능하다.
- '문자열[숫자]' 는 '문자 선택 연산자'로 예를 들어 '반갑습니다' 라는 문자열을 반갑습니다[0] 이라는 문자 선택 연산자를 통해 출력하면 맨 앞글자인 '반' 을 출력한다. 참고로 프로그래밍 언어에서 숫자는 0부터 시작한다.
- 문자열의 길이를 구할때는 문자열 뒤에 .을 찍고 length 라고 입력하면 된다. ("반갑습니다".length = 결과값 5)
5. 숫자 자료형
- 자바스크립트에서는 소수점이 있는 숫자와 없는 숫자 모두 같은 숫자 자료형으로 인식한다.
-
연산자 설명 + 더하기 연산자 - 빼기 연산자 * 곱하기 연산자 / 나누기 연산자 % 나머지 연산자 - 연산자 간의 우선순위는 수학법칙과 같다. 곱셈과 나눗셈이 우선순위가 덧셈과 뺄셈 보다 높고 괄호 안의 연산을 먼저 수행한다.
- 불 자료형
- 자바스크립트에서 True 와 False 를 표현할 때 '불 자료형' 을 사용한다.
- 비교 연산자를 사용하여 불을 만들 수 있다. 아래 표와 같다.
| 연산자 | 설명 |
|---|---|
| === | 양쪽이 같다. |
| !== | 양쪽이 다르다. |
| > | 왼쪽이 큼 |
| < | 오른쪽이 큼 |
| >= | 왼쪽이 크거나 같다. |
| <= | 오른쪽이 크거나 같다. |
- 문자열 끼리도 비교가 가능하다. 사전의 앞쪽에 있을 수록 값이 적다.
- 논리 부정 연산자 '!' 를 사용하면 true 를 false 로 false 를 true 로 변경
- 불 논리합/논리곱 연산자
| 연산자 | 설명 | 사용법 |
|---|---|---|
| && | 논리곱 연산자 | 양변의 값이 모두 True 일 때만 Ture 그외는 False |
| || | 논리합 연산자 | 양변의 값 중 하나만 True 여도 True |
번외. 이스케이프 문자
- \n : 줄바꿈
- \t : 탭
- \\ : 문자 그대로의 역슬래시
비록 6강 정도 분량이지만 정리하고 나니 꽤 많은 분량으로 정리가 된다.
연산자 같은 경우 실생활과 비슷하지만 나머지 연산자 % 같은 특이한 것이 튀어나와 혼선을 주고 불 연산자의 경우 실생활과 동떨어진 개념이기에 차근히 이해를 하며 넘어가야할 것 같다.
