#7 숫자 Number
숫자(정수, 부동소수점)
숫자의 종류
- 정수 : 양의 수, 음의 수, 0 // 10, 100, -190...
- 부동소수점 float : 1.1, 10.1...
- 부동소수점 실수 double : IEEE754 표준 부동소수점보다 더 정밀한 데이터
부동소수점 => 컴퓨터에서 실수를 표현하는 방법 전기전자기술자협회의 정의 64비트
자바스크립트는 부동소수점 float, double 모두 number로 구분된다.
let x = 0.3;
let y = 0.1;
let retu = x + y;
console.log(retu); //0.30000000000000004🚨10진수가 계산을 위해 컴퓨터가 알아볼 수 있는 2진수로 변환되는 과정에서 소수 중 일부가 무한소수가 된다.
하지만 컴퓨터가 연산을 위해 할당할 수 있는 메모리는 한정적이다.
그렇기 때문에 컴퓨터는 무한소수를 어느 정도의 단위에서 자르고 유한소수를 만들어 연산을 진행한다.
이로인해 단순한 소수점 연산에서 추가적인 자릿수가 늘어나는 오차가 발생하기도 한다.
이를 해결하기 위한 몇가지 방법이 있는데
- toFixed(num) : num의 자리수 까지 반올림하여 string으로 반환한다. 소수점 아래까지 표현 가능하다.
- Math.round() : 반올림해주는 자바스크립트 내장함수. 정수를 표현하여 소수점 아래 값은 날린다.
- 기타 라이브러리 : Big.js, BigNumber.js, Decimal.js
숫자 리터럴
📍 상수(constant)와 리터럴(literal)의 차이
상수(constant) : 변하지 않는 변수
리터럴(literal) : 변하지 않는 데이터
예_) const age = 20;
상수 : age
리터럴 : 20
리터럴 표기법
var age = 20; // 숫자리터럴
var info = {age = 10, name = "miy"}; // 객체리터럴숫자 리터럴 종류
1. 정수리터럴 : 10진수 또는 16진수
2. 부동소수점 : 실수(1, 1.3, 0.11), 지수표기(2e2. 2e-2)
3. infinity(무한)
4. NaN(Not a Number)
5. 특수값
숫자 변환
자바스크립트는 리터럴값에 따라 형(type)이 자동으로 변환된다.
let age; // undefined
age = 10; // number type
age = "10"; // string type이렇게 자동으로 타입이 변화되는 것을 묵시적 변환이라하고,
타입을 지정해 주는 것을 명시적 변환 이라고 한다고 했다.
📍⭐️ 이를 이용해 데이터 타입을 Number로 변환하는 방법이 있다.
1. Number 함수 이용(문자열 or 불리언)
2. + 더하기 연산자를 앞에 붙이지 (문자열 or 불리언)
// let num = +("20"); typeof Number // let num = +("스물"); typeof NaN;
3. (문자열 or 불리언) 1 곱하기 1 연산을 한다.
// let num = ("20.5") 1 ; 20.5 Number
4. parseInt 함수 이용 (정수 문자열)
5. parseFloat 함수 이용 (실수 문자열
Not a Number (NaN)
숫자가 아님을 나타내는 특별한 값.
타입은 Number
Infinity
무한대를 나타내는 숫자값.
Number type
컴퓨터가 처리 가능한 가장 큰 수
양의 무한대
64비트 공간이 넘치는 경우
console.log(Infinity); /* Infinity */
console.log(Infinity + 1); /* Infinity */
console.log(Math.pow(10,1000)); /* Infinity */
console.log(Math.log(0)); /* -Infinity */
console.log(1 / Infinity); /* 0 */
console.log(1 / 0); /* Infinity */infinity 처리 방법
isFinite(val)
- 유한/무한 숫자를 판별하는 함수
- true 는 유한숫자
- false 는 무한숫자
- val은 검사할 값
Bigint
- Number의 최대값보다 큰 정수 표현
- Bigint 데이터타입
- Math 객체의 메소드와 사용불가
- 연산 시 Number 와 사용불가
const bigint = 9007199254740991n;
const bigint = BigInt("9007199254740991");Bigint는 Math 메소드와 연산 시 Number 와 사용불가 + / - / * / ** (제곱) / % 를 이용한 연산 가능 ("BigInt 객체 이용")
const bigint = BigInt(Number.MAX_SAFE_INTEGER); // 9007199254740991
const plus = bigint + 2n; // 9007199254740991n + 2n =9 007199254740993
const minus = bigint - 2n; // 9007199254740989
const mul = bigint * 2n; // 9007199254740989
const mul2 = bigint ** 2n; // 81129638414606663681390495662081
const mob = bigint % 2n; // 1
const mob2 = 5n / 2n; // 2.5n 인데 소수점 아래는 버리고 2 로 표시된다.
const plus2 = bigint + 2;
// Uncaught TypeError : cannot mix Bigint ather type, use explivit conversionsBigint 값의 비교를 하면
1n < 2 // true
0n === 0 // false - Bigint type과 Number type
0n == 0 // true - 0이긴 하고 0 이니까정수, 정수로 변환
Number.isInteger(num);
- 정수인지 판별하는 함수
- 매개변수 값 num은 확인하려는 값
- 반환값은 true(정수) / false(실수)
- 반환타입은 불리언 boolean
Number.isInteger(0); // true
Number.isInteger(1); // true
Number.isInteger(-100000); // true
Number.isInteger(9999999999999); // true
Number.isInteger(0.1); // false 실수
Number.isInteger(Math.PI); // false 3.14 파이
Number.isInteger(NaN); // false NaN
Number.isInteger(Infinity); // false Infinity
Number.isInteger(-Infinity); // false Infinity
Number.isInteger('10'); // false 문자
Number.isInteger(true); // false 불리언
Number.isInteger(false); // false 불리언
Number.isInteger([1]); // false 배열
Number.isInteger(Number(true)); // true 명시적 형변환으로 true를 Number type이라 명시 => true가 1로 변형됐다.Number.parseInt(num);
- 정수로 변환하는 함수
- 매개변수 num은 정수로 변환할 값
- 반환값은 변화된 정수값
- 반환타입은 Number
let age = "12.1472";
console.log(parseInt(age)); // 12
let age2 = 10.2938;
console.log(parseInt(age2)); // 10실수, 실수로 변환
Number.isInteger(num);
- 실수인지 판별하는 함수
- 매개변수 값 num은 확인하려는 값
- 반환값은 true(정수) / false(실수)
- 반환타입은 불리언 boolean
Number.parseFloat(val);
- 실수로 변환하는 함수
- 매개변수 값 val은 실수로 변환할 값
- 반환값은 변환된 값
- 반환타입은 Number
let age = "12.1472aaa";
console.log(parseFloat(age)); // 12.1472
let age2 = "10.2938";
console.log(parseFloat(age2)); // 10.2938
let age3 = "스물";
console.log(parseFloat(age3)); // NaN
let age4 = "aaa 123.567 aaa";
console.log(parseFloat(age4)); // NaN
let age5 = "123.567 aaa";
console.log(parseFloat(age5)); // 123.567
let age6 = "10 11 12";
console.log(parseFloat(age6)); // 10Number.isNaN(num)
- NaN인지 판별하는 함수
- 매개변수 num은 NaN인지 여부를 확인하려는 값
- 반환값은 true / false
- 반환타입은 불리언 boolean
Number.isNaN(NaN); // true
Number.isNaN(Number.NaN); // true
Number.isNaN(0 / 0) // true
// 예를 들면 이들은 global isNaN()으로는 true가 됐을 것임
Number.isNaN("NaN"); // false
Number.isNaN(undefined); // false
Number.isNaN({}); // false
Number.isNaN("blabla"); // false
// 모두
Number.isNaN(true); // false
Number.isNaN(null); // false
Number.isNaN(37); // false
Number.isNaN("37"); // false
Number.isNaN("37.37"); // false
Number.isNaN(""); // false
Number.isNaN(" "); // false
#8 문자열 String
문자열
- 텍스트 형식의 데이터, 값
- 부호 없는 정수 값 요소의 집합
- 문자열 리터럴이나 객체를 이용해 문자열 생성 가능
- 큰 따옴표, 작은 따옴표, 백틱(`)으로 표현 가능
let str = "String";
let str = 'String';
let str = `String`;📍 특수문자 표시
\n : 다음줄로 이동
\t : 탭(4칸)만큼 이동
\ : 문자표시
\" : 큰따옴표 표현
\' : 작은따옴표 표현
` : 백틱 표현
문자열 리터럴
📍 상수(constant)와 리터럴(literal)의 차이
상수(constant) : 변하지 않는 변수
리터럴(literal) : 변하지 않는 데이터
예_) const age = 20;
상수 : age
리터럴 : 20
리터럴 표기법
var info = "\'1.키: 160cm \n 2.이름: 김이박 \n" +
"3.나이:24세 \n 4.색상:보라\'"
'1.키: 160cm
2.이름: 김이박
3.나이:24세
4.색상:보라'문자열 접근
- charAt()
문자열에 접근하는 함수
let text = "hello";
text.chatAt(2); // h[0] e[1] l[2] l[3] o[4] => l
- charCodeAt()
- startsWith()
특정문자로 시작하는지 확인하는 함수
let text = "hello";
text.startsWith(searchStr); // searchStr 탐색할 문자열
text.startsWith(searchStr,position); // searchStr 탐색할 문자열, position 탐색을 시작할 위치
반환값은 true, false
- endsWith()
특정문자로 끝나는지 확인하는 함수
let text = "hello";
text.endsWith(searchStr); // searchStr 탐색할 문자열
text.endsWith(searchStr,position); // searchStr 탐색할 문자열, position 탐색을 시작할 위치
반환값은 true, false
let text = "hello";
let one = text.startsWith("he"); // true
let two = text.startsWith("el"); // false
let three = text.startsWith("123"); // false
let four = text.startsWith("el",1); // true
let text = "hello";
let one = text.endsWith("he"); // false
let two = text.endsWith("lo"); // true
let three = text.endsWith("123"); // false
let four = text.endsWith("o",5); // true
- indexOf()
문자열에서 검색하는 문자열과 같은 '첫번째' 인덱스를 반환하는 함수
let text = "hello";
text.indexOf(searchStr);
매개변수 searchStr는 탐색할 문자열
반환값은 [인덱스]
일치하는 값이 없는 경우 -1을 반환
|h|e|l|l|o| |
|0|1|2|3|4|-1|
let text = "hello";
let one = text.indexOf("l"); // 2
let two = text.indexOf("el"); // 1
let three = text.indexOf("123");// -1
- lastIndex()
- 문자열[index]
인덱스를 통해서 직접 문자열에 접근하는 방법
let text = "hello";
let one = text[0] // "h";
let two = text[1] // "e";
let three = text[2] // "l";
let four = text[3] // "l";
let five = text[4] // "o";
문자열 변환
- 더하기 연산
let text = 123 + ""; // 값 : 123 type : string- replace(), replaceAll()
replace() : 문자열 중 선택한 문자를 지정한 문자로 변환한다. 이때 선택한 문자와 동일한 첫번째 문자만 지정 문자로 변환하여 반환하는 함수
replaceAll() : 문자열 중 선택한 문자 전체를 지정한 문자로 변환한다.
let text = "hello";
text.replace( searchStr, replaceStr );
let rtn = text.replace("l","L"); // 반환값 : heLlo
let rtn2 = text.replaceAll("l","L"); // 반환값 : heLLo매개변수 searchStr은 문자열에서 탐색
매개변수 replaceStr은 변환할 문자
반환값은 변환된 값
- toLowerCase(), toUpperCase()
toLowerCase() : 문자열에서 대문자로 소문자로 변환하는 함수
toUpperCase() : 문자열에서 소문자로 대문자로 변환하는 함수
let text = "HELLO";
let text2 = "hello";
text.toLowerCase();
text2.toUpperCase();
let rtn = text.toLowerCase(); // 변환값 : hello type : string
let rtn2 = text2.toUpperCase(); // 변환값 : HELLO type : string- toLocaleLowerCase(), toLocaleUpperCase()
toLocaleLowerCase() :
toLocaleUpperCase() :
문자열 병합
문자열과 문자열을 합치는 것
- 더하기 연산
let text = "hello";
let text2 = "world";
let text3 = 123;
let rtn = text + " " + text2;
let rtn = text3 + " " + text;
document.write(rtn); // 변환값 : hello world type : string
document.write(rtn2); // 변환값 : 123 hello type : string- concat()📍
배열이나 값을 합쳐서 반환하는 함수
let text = "hello";
let text2 = "world";
let rtn = text.concat(text2); // 변환값 : helloworld type : string
let text3 = ["h", "e", "l"];
let text4 = ["l", "o", "!"];
let rtn2 = text3.concat(text4); // 변환값 : h,e,l,l,o,! type : object- join()
배열을 하나의 문자열로 합쳐서 반환하는 함수
let text = ["h","e","l","l","o"];
let rtn = text.join(); // 변환값 : h,e,l,l,o type : string
let rtn2 = text.join(""); // 변환값 : hello type : string
let rtn3 = text.join(","); // 변환값 : h,e,l,l,o type : string 문자열과 배열
- 배열
- 대괄호를 사용한 표현
- 각 요소 자료형이 고정되어 있지 않다.
- 배열의 길이가 존재한다.
let text = ["apple", 815]; text[0] // 값 : apple type : string text[1] // 값 : 815 type : number text.length // 값 : 2 (배열의 길이)
- split()
문자열을 구분자를 기준으로 분리해 배열로 반환하는 함수
let text = "a_b_c";
text.split(구분자);
let arr = text.split("_");
document.write(arr); // 반환값 : a,b,c ⇨ ["a","b","c"] type : object
document.write(arr[0]); // 반환값 : a
document.write(arr[1]); // 반환값 : b
document.write(arr[2]); // 반환값 : c
document.write(arr.length); // 반환값 : 3- Array.from()a,,b,,c
문자열을 분리해 배열로 반환하는 함수
let text = "king";
let arr = Array.from(text);
document.write(arr); // 반환값 : k,i,n,g ⇨ ["k","i","n","g"] type : object
document.write(arr[0]); // 반환값 : k
document.write(arr[1]); // 반환값 : i
document.write(arr[2]); // 반환값 : n
document.write(arr[3]); // 반환값 : g
document.write(arr.length); // 반환값 : 4
- 스프레드 연산자 [...변수명]
문자열을 분리해 배열로 반환하는 연산자
let text = "hello";
let rtn = [...text];
document.write(rtn); // ["h","e","l","l","o"] type : object템플릿 리터럴(템플릿 문자열)
문자열 안에 사용
백틱(`) 을 이용
표현식` ${expression} ` 을 이용
- 여러줄로 나누기
let text = "hello\nWorld"; // 기존 방식
let text2 = `hello
World`;
document.write(text2); //hello World type : string
- 표현식 삽입
let text = "hello World";
let textType = typeof text;
let rtn = `값 : ${text} 타입 : ${textType}`;
document.write(rtn); // 값 : hello World 타입 : string- 문자열 합치기
let text1 = "hello";
let text2 = "world";
let rtn = `${text1} ${text2}`;
document.write(rtn); // hello world
괴발개발