[JAVASCRIPT.INFO] 자료구조와 자료형

이 글은 [모던 JavaScript 튜토리얼]을 공부하며 정리한 글입니다.

 

 

👉 기본 환경

- Language: JavaScript

- IDE: VS code

---

1. 원시값의 메서드

* 원시값

    - 문자(string), 숫자(number), bigint, 불린(boolean), 심볼(symbol), null, undefined형 값

    - String / Number / Boolean: 인수를 원하는 형의 원시값(문자열, 숫자, 불린 값)으로 바꿔줌

* 객체

    - 프로퍼티에 다양한 종류의 값을 저장할 수 있음

    - 함수도 객체의 일종으로 프로퍼티로 저장할 수도 있음

 

let str = "Hello";
str.test = 5;
 
alert(str.test);
 

* use strict(엄격 모드)

- str의 프로퍼티에 접근할 때, 래퍼 객체가 만들어짐
- 래퍼 객체를 수정 시, 에러 발생
* 비 엄격 모드

- str의 프로퍼티에 접근할 때, 래퍼 객체가 만들어짐
- 래퍼 객체에 프로퍼티 test 추가

- 래퍼 객체 삭제

- 마지막 줄이 실행: 프로퍼티 test를 찾을 수 없음

 

 

---

2. 숫자형

 

* num.toString(base)

// base진법으로 num을 표현한 후, 이를 문자형으로 변환해 반환
let num = 255;
 
alert( num.toString(16) );  // ff
alert( num.toString(2) );   // 11111111
 

 

🚨 단, 숫자에서 직접 toString(base) 사용 시, 다음과 같이 작성해야 함

// 첫 번째 점 이후는 소수부로 인식되어 에러가 발생할 수 있음
123456.toString(36);
 
// 점 2개
123456..toString(36);
 
// 괄호
(123456).toString(36);
 

 

* 어림수 관련 함수

// 버림
Math.floor(3.1); // 3
Math.floor(-1.6); // -2
 
// 올림
Math.ceil(3.1); // 4
Math.ceil(-1.6); // -1
 
// 반올림
Math.round(3.1); // 3
Math.round(-1.6); // -2
 
// 소수부 무시
Math.trunc(3.1); // 3
Math.trunc(-1.6); // -1
 
// 소수 2째자리까지 표시
Math.floor(1.2345 * 100) / 100; // 1.23
 
// 반올림 + ( number -> String )
(1.2345).toFixed(2); // 1.23
// 숫자로 반환하고자 할 경우,
+(1.2345).toFixed(2); // 1.23
Number((1.2345).toFixed(2)); // 1.23
 

 

* isNaN과 isFinite

* Infinity / -Infinity: 그 어떤 숫자보다 큰 혹은 작은 특수 숫자 값
* NaN: Not a Number

// isNaN(value): 인수를 숫자로 변환한 다음 NaN인지 테스트
isNaN(NaN); // true
isNaN("str"); // true
 
 
// isFinite(value): 인수를 숫자로 변환, 변환 숫자가 NaN/Infinity/-Infinity가 아닌 일반 숫자인 경우 true 반환
isFinite("15"); // true
isFinite("str"); // false
isFinite(Infinity); // false
isFinite(""); // true
isFinite("    "); // true
 

 

🚨 빈 문자열이나 공백만 있는 문자열은 isFinite를 포함한 모든 숫자 관련 내장 함수에서 0으로 취급되므로 유의

 

* parseInt, parseFloat

    - 불가능할 때까지 문자열에서 숫자를 읽고, 숫자를 읽는 도중 오류가 발생하면 이미 수집된 숫자를 반환

console.log( parseInt('100px') ); // 100
console.log( parseFloat('12.5em') ); // 12.5
 
console.log( parseInt('12.3') ); // 12
console.log( parseFloat('12.3.4') ); // 12.3
 
// cf. parseInt(str, radix)
console.log( parseInt('ff', 16) ); // 255, 0x가 없어도 동작
 

 

// Sol1
let readNumber = function(){
  let input = prompt("enter a number");
  if(!isFinite(input)){
    readNumber();
  }
  else if(input === null || input === ''){
    return null;
  }
 
  return +input;
 
}
 
alert(`result:${readNumber()}`);
 
 
// Sol2
function readNumber() {
  let num;
 
  do {
    num = prompt("Enter a number please?", 0);
  } while ( !isFinite(num) );
 
  if (num === null || num === '') return null;
 
  return +num;
}
 
alert(`Read: ${readNumber()}`);
 

* 재귀 호출의 경우, 무한 재귀 호출에 대한 잠재적인 스택 오버플로우 오류가 발생할 수 있으므로 do...while 반복문 권장

 

// Create a function randomInteger(min, max) that generates a random integer number from min to max including both min and max as possible values.
// Any number from the interval min..max must appear with the same probability.
 
 
// wrong
function randomInteger(min, max) {
  let rand = min + Math.random() * (max - min);
  return Math.round(rand);
}
 
alert( randomInteger(1, 3) );
 
/*
values from 1    ... to 1.4999999999  become 1
values from 1.5  ... to 2.4999999999  become 2
values from 2.5  ... to 2.9999999999  become 3
*/
 
 
// correct
function randomInteger(min, max) {
  // now rand is from  (min-0.5) to (max+0.5)
  let rand = min - 0.5 + Math.random() * (max - min + 1);
  return Math.round(rand);
}
 
alert( randomInteger(1, 3) );
 
/*
values from 0.5  ... to 1.4999999999  become 1
values from 1.5  ... to 2.4999999999  become 2
values from 2.5  ... to 3.4999999999  become 3
*/
 

 

 

---

3. 문자열