공부기록/JavaScript

#3일차 [JavaScript] 기초

taecode 2024. 11. 8. 19:21

JavaScript 란?

- 웹페이지를 동적이고 상호작용적으로 만드는데 사용되는 스크립팅 언어. 
- 웹페이지의 동작과 기능을 담당한다.

 

 

JavaScript 타입 목록

목록
원시 자료형 number, string, boolean, undefined, null 등
참조 자료형 함수, 배열, 객체 등

Java와 비슷한 부분은 쉽게 이해했지만 **undefined와 null의 차이를 유의해야겠다.

 

* undifined : 변수가 선언되었지만 값이 할당되지 않은 상태를 나타낸다.

> 함수가 명시적으로 값을 반환하지 않을 때 자동으로 반환된다.
> JavaScript 엔진이 자동으로 할당하는 값 

 

* null : 의도적으로 값이 없음을 나타내기 위해 개발자가 명시적으로 할당하는 값

> 객체가 의도적으로 비어있음

> typeof 연산자로 확인하면 'object'를 반환한다.(오래된 버그니까 당황하지 말자)

 

 

Number 타입 Math 내장 객체

Math.floor() 내림
Math.ceil() 올림
Math.round() 반올림
Math.abs() 절대값 반환
Math.sqrt() 루트값 반환
Math.pow( num1, num2 ) num1의 num2제곱, 연산자로도 num1 ** num2 식으로 표현 가능

 

 

> JavaScript 는 String 타입을 표기할 때 " " , ' ' , ` `  3가지 모두 가능하다.

 

- number 타입과 string 타입의 연산 가능
> num + str 가능 ( number가 string타입으로 변환)

> num - str 가능 (뺄 때는 string이 number로 바뀌어서 number 타입으로 연산됨)

> str - num 불가능(어떤 경우든 문자열 연산은 더하기만 가능하다.

 

 

-  str[n] 과 같은 n번 인덱스를 불러오는 경우 문자열을 벗어난 index 입력하면 undefined

 

 

- string 타입의 메소드

 concat(n1, n2) : 문자열 연결 연산자 + 처럼 문자열 이어붙인다.

 slice(n1, n2) : (인덱스 번호) n1번째부터 n2글자만큼 잘라온다. ( n2번 인덱스 앞까지 )

 indexOf("str") : 특정 문자나 문자가 몇 번째 위치하는지 확인 

 > 포함되지 않으면 -1 반환

 

 

- JavaScript 에서는 비교연산자가 == 이 아니고 === 이다. (Java와 헷갈리지 않도록 주의)

 

 

- const 로 선언한 변수는 바꾸지 못함 (상수)

 

 

- JavaScript 는 *동적 타입 언어

 

 

- JavaScript 는 선언하고 값을 담지 않아도 실행되고 undefined

 

 

- 네이밍 규칙 : 공백 안됨, 영문을 제외한 언어는 가능은 하지만 쓰지 않는다.

 > 가장 보편적인 언어이기도 하지만, 영어 외 언어를 사용할 시 인코딩 문제가 발생 될 수 있음 

 > 변수명은 문자, 숫자, _ , $ 만 쓸 수 있다.

 > 숫자로 시작은 허용하지 않음

 > *예약어는 식별자로 사용할 수 없다.

 

 

- *네이밍 컨벤션을 잘 지켜야 한다.

 > camelCase, snake_case, PascalCase

 

 

- 템플릿 리터럴 : 문자열 처리를 더 효율적이고 직관적으로 만들어준다.

// 템플릿 리터럴은 백틱(`)으로 문자열을 감싸서 표현한다.

// 변수나 표현식을 `${}` 구문을 사용해서 문자열 내에 직접 삽입 가능하고 내부에 JavaScript 표현식을포함할 수 있다. 
let name = "Taco";
let greetingHard = "Hello, " + name + "!"; // 템플릿 리터럴을 사용하지 않고 작성 시 가독성이 보다 좋지 않고 유지보수를 하기 힘들다
let greetingEasy = `Hello, ${name}!`; // 깔끔
console.log(greetingEasy); // "Hello, Taco!"

// 줄바꿈을 포함한 여러 줄 문자열을 보다 쉽게 작성 할 수 있다.
let multiLine = `
	My name is
	TaekHo
	Nam.
  `;

 

 

 


* 용어 정리

- 동적 타입 언어 : 변수의 타입이 러나입에 결정되는 특징을 가진다. ( 타입이 코드 실행 중에 결정되고, 하나의 변수에 다양한 타입의 값을 자유롭게 할당할 수 있으며, 변수 선언 시 명시적으로 타입을 지정할 필요x)

 

- 예약어 : 프로그래밍 언어에서 특별한 의미와 용도로 미리 정의된 단어

 

- 네이밍 컨벤션 : 프로그래밍에서 변수, 함수, 클래스 등의 이름을 정하는 규칙

 > 코드 이해도 향상, 오류 감소, 개발 속도 향상, 팀 협업 개선