[혼공스] 1주차_준비운동

1) 자바스크립트 개요와 개발 환경 설정

1. 표현식과 문장

표현식 : 값을 만들어내는 간단한 코드 예) 1 + 2 + 3
문장 : 하나 이상의 표현식이 모여 구성되는 것, 코드를 읽어들이는 기본 단위
예) var num1 = 1;

2. 키워드

프로그래밍 언어가 처음 만들어질 때 정해진 특별한 의미가 있는 단어

3. 식별자

프로그래머가 이름을 붙일 때 사용하는 단어
예) 변수, 상수의 이름, 함수 이름

4. 주석

프로그램 코드를 설명하는 문장, 프로그램 진행에는 영향을 주지 않는다.

5. 출력

경고창에 출력하기

alert("경고창에 출력하기");

콘솔에 출력하기

console.log("콘솔에 출력하기");

---

2) 자료와 변수

1. 자료형

자료형 : 자료의 종류(데이터의 모양 혹은 type)

문자열 자료형

문자열 : 문자들의 집합(js에서는 문자열이 하나든 여러 개든 모두 문자열 자료형이라고 한다.)

'안녕하세요'
"안녕하세요"

큰 따옴표든 작은 따옴표든 문자열 자료형에 해당한다.

'안녕하세요'[0] >> '안'

다음과 같이 인덱싱이 가능하다.

'안녕하세요'.length >> 5

length 속성을 사용하여 문자열의 길이를 얻을 수 있다.

숫자 자료형

js는 실수와 정수를 모두 같은 자료형으로 인식한다.
숫자를 입력하면 숫자 자료가 만들어진다.

1 // 수 자료형
typeof(1) >> Number

typeof연산자를 사용하여 해당 자료의 자료형을 얻을 수 있다.

불 자료형

참과 거짓을 나타내는 자료형 true와 false가 이에 해당한다.

typeof(true) >> Boolean
typeof(false) >> Boolean

2. 상수와 변수

상수

항상 같은 수, 변하지 않는 수

const number = 1;

js에서 상수는 const keyword를 사용하여 선언한다.
js에서 상수는 반드시 초기화를 해줘야 한다.(초기화 : 값을 할당해주는 것)

변수

변하는 수, 값을 가리키는 식별자

var num1 = 1;
let num2 = 2;

var, let 모두 변수를 선언하는데 사용되는 키워드이지만 일단 최대한 let을 사용하도록 하자.

선언과 할당

선언 : 메모리에 공간을 할당하는 것, 상수 또는 변수를 생성하는 것
할당 : 상수 또는 변수에 값을 넣는것

let num1; // 선언 (메모리에 공간이 잡히게 된다.)
num1 = 2; // 할당

3. 자료형 변환

js에서도 자료형 간에 변환이 가능하다.

숫자 자료형으로 변환하기

숫자 자료형으로의 변환은 Number() 메소드를 사용한다.

let a = '1'
console.log(a); // '1'
console.log(typeof a); // String 

a = Nubmer(a)  
console.log(a); // 1
console.log(typeof a); // Number

문자열 자료형으로 변환하기

문자열 자료형으로의 변환은 String() 메소드를 사용한다.

let b = 2;
console.log(b); // 2
console.log(typeof b); Number

b = String(b);
console.log(b); // '2'
console.log(typeof b); String

불 자료형으로 변환하기

불 자료형으로의 변환은 Boolean() 메소드를 사용한다.

대부분의 자료는 불로 변환했을 때 true로 변환된다.
다만 다음의 5가지 경우는 false로 변환되는걸 기억해두자.

Boolean(0);
Boolean(NaN);
Boolean("");
Boolean(null);
Boolean(undefined);

숙제)

기본숙제)

선택숙제)

인터넷을 돌아다니면서 보았던 쉽게 사용할 수 있고, 기능이 많다고 느꼈던 웹 사이트를 5개 정도 적어 보세요.

• 웹 사이트
  • Quizlet : 영단어 암기를 도와주는 사이트, 단어장마다 단어를 저장할 수 있으며, 다양한 방법으로 암기 현황을 테스트해 볼 수 있다.
  • Canva : 웹페이지에서 디자인을 할 수 있게 해주는 사이트, 포스터, 프레젠테이션, 카드 뉴스 다양한 컨텐츠들을 제작 할 수 있다.(애용중이다..!)
  • 토스증권 : 환율, 국내주식, 해외주식의 가격과 거래량을 확인할 수 있게 해주며, 거래또한 가능하게 해주는 웹사이트(디자인이 매우 예쁘다)
  • snake.io : 웹으로 지렁이 게임을 플레이할 수 있게 만들어주는 사이트
  • ChatGPT : 웹에서 LLM과 문답을 주고받을 수 있게 해놓은 사이트(매우 대단하다...!)