-
[JS] Chapter 1. 타입, 변수codeStates front-end/Java Script 2023. 1. 4. 10:12반응형
코드 실행은 https://stackblitz 에서 진행했습니다.
타입
타입(type)은 값(value)의 종류
자주 쓰는 표현은 분류가 필요
정보를 전달하기 위해서 값(value)을 사용
2020; '안녕하세요'; true;
자주 쓰는 값을 분류
typeof 2020; //"number" typeof '안녕하세요'; //"string" typeof true; // boolean
각 타입은 고유한 속성과 메서드를 가진다.
'안녕하세요'.lenth; // 6 'hello world'.toUpperCase() // 'HELLO WORLD'
JS에는 다양한 타입 목록을 가진다.
Number 타입 - 정수와 실수
100; // 정수 -100; // 음수 100.123; // 실수
typeof 연산자로 해당 값이 숫자 타입인지 확인 가능
typeof 100; // 'number' typeof -100; // 'number' typeof 100.123; // 'number'
-산술 연산자
같은 숫자 값 간의 사칙 연산
console.log(1 + 2); // 3 console.log(1 - 2); // -1 console.log(1 * 2); // 2 console.log(1 / 2); // 0.5 console.log(9 % 2); // 1 (9를 2로 나눈 나머지 구하기)
Math 내장 객체
- Math.floor(): 괄호 안의 숫자를 내림 하여 반환합니다.
- Math.ceil(): 괄호 안의 숫자를 올림 하여 반환합니다.
- Math.round(): 괄호 안의 숫자를 반올림하여 반환합니다.
- Math.abs(): 괄호 안의 숫자의 절대값을 반환합니다.
- Math.sqrt(): 괄호 안의 숫자의 루트값을 반환합니다.
- Math.pow() : 괄호 안의 첫 번째 숫자를 밑, 두 번째 숫자를 지수인 숫자를 반환합니다.
Math.floor(100.621); // 100 Math.ceil(100.621); // 101 Math.round(100.621); // 101 Math.round(100.421); // 100 Math.abs(-100); // 100 Math.abs(100); // 100 Math.sqrt(4); // 2 Math.sqrt(2); // 1.4142135623730951 Math.pow(2, 5); // 32
String 타입 - 문자열
'사과' "JavaScript" "欢迎你" "안녕하세요" + "!!"; // 안녕하세요!! 문자열 연결 연산자 "감사합니다." + " " + "🙏" // 감사합니다. 🙏 1 + "1" // 11 console.log('欢迎你'.length); // 3 문자열 length 속성
인덱스(Index) - 문자 순서, 위치, 0부터 셈
let str = 'codestates'; console.log(str[0]); // 'c' console.log(str[4]); // 's'
문자열 주요 메서드
-
- toLowerCase() : 문자열을 소문자로 변경합니다.
- toUpperCase() : 문자열을 대문자로 변경합니다.
- concat() : 문자열 연결 연산자 + 처럼 문자열을 이어 붙일 수 있습니다.
- slice() : 문자열의 일부를 자를 수 있습니다.
- indexOf() : 문자열 내에 특정 문자나 문자가 몇 번째 위치하는지 확인합니다.
- 만약 찾는 문자가 2개 이상일 경우, 가장 앞에 있는 문자의 인덱스를 조회합니다.
- 포함되어 있지 않으면 1 을 반환합니다.
'HELLO WORLD'.toLowerCase(); // 'hello world' 'hello world'.toUpperCase(); // 'HELLO WORLD' 'hello '.concat('world'); // 'hello world' 'hello world'.slice(0, 5); // 'hello' '🍎🍓🍉🍇'.indexOf('🍎'); // 0 '🍎🍓🍉🍇'.indexOf('🖥'); // -1 '🍎🍓🍉🍇'.includes('🍎'); // true '🍎🍓🍉🍇'.includes('🖥'); // false
Boolean 타입
true; false;
비교연산자 : == , ≠= , > . < . ≤ , ≤
논리연산자 : || , &&
논리 부정 연산자 : !
변수
변수 선언 : let (var 도 가능하나 잘 사용 x)
값을 할당할 때는 할당 연산자(=)
동시 선언 가능
let name; name = 'kjh'; let name = 'kjh';
변수 활용
연산
let number = 10; console.log(number + 2); // 12 console.log(number - 5); // 5 console.log(number * 3); // 30 console.log(number / 2); // 5 console.log(number % 3); // 1 console.log(number); // 10
실습) 삼각형 너비 구해보기
반응형'codeStates front-end > Java Script' 카테고리의 다른 글
[JS] Chapter 6. 원시 자료형과 참조 자료형의 특징과 종류 (0) 2023.01.04 [JS] Chapter 5. 객체 (0) 2023.01.04 [JS] Chapter 4. 배열 (0) 2023.01.04 [JS] Chapter 3. 함수 (0) 2023.01.04 [JS] Chapter 2. 조건문, 반복문 (0) 2023.01.04