본문 바로가기
[코드잇]/JavaScript 백엔드 개발자

프로그래밍과 데이터 in javaScript -자료형 심화-

by 수민띠 2023. 2. 19.

숫자 표기법

지수 표기법: 알파벳 e를 통해 표기하는 방식

e왼편에 있는 수에다가 e오른쪽에 있는 수가 양수일 경우 10의 거듭제곱을 곱하고, 음수일 경우 나눔

let b = 2e3; //2000
let c = 3.5e-3; // 0.0035

숫자 표기법

let hexadecimal = 0xff; //255
let octal = 0o377; //255
let binary = 0b11111111 // 255

숫자형 메소드

 

JS에서는 숫자도 객체이다.

toFixed(0~100), 소수를 다룰 때 사용

  • 파라미터의 값만큼 소수점 아래의 자릿수를 고정
  • 이외의 값은 반올림
  • 숫자값의 자릿수를 초과하는 경우 0으로 대체
  • 리턴 값은 문자열이기 때문에 +연산을 하려면 Number함수를 이용해 숫자형으로 형 변환해야 함

*tip - JS에서는 어떤 값 앞에 +를 붙여주면 Number함수와 똑같은 결과를 얻을 수 있음

       - 문자열에 * 1 하면 숫자로 형 변환 됨

let a = 0.3591;

a.toFixed(3); //0.359
a.toFixed(6); //0.359100

//Number함수를 이용한 형 변환
Number(a.toFixed(6)); //0.3591 //0은 생략되고 숫자형으로 바뀜

//+기호를 이용
+a.toFixed(2); //0.36

//문자열에 * 1 하기
console.log(typeof(a.toFixed(6)*1)); //number

 

toString(2~36), 파라미터로 전달하는 숫자의 진법으로 변환해 주는 메소드(리턴값: 문자형)

let a = 255;

a.toString(2); //11111111
a.toString(8); //377
a.toString(16); //ff

 

숫자에 바로 메소드를 사용 가능

let a = 255 ;
a.toString(2); // 숫자를 변수에 담아서 사용하는 방법

255..toString(2); //11111111 (점 2개 사용해야함)
(255).toString(2); // 괄호로 감싸기

 

문자열 심화

"문자"+"열"도 배열처럼 length프로퍼티가 있어 길이를 파악할 수 있다.

let a = 'Hi Codeit';

//요소 접근
a[3]; //대괄호 표기법 //C
a.charAt(3) //charAt 메소드 //C

//요소 탐색  없으면 -1 
a.indexOf('Hi'); //앞 부터  //0
a.lastIndexOf(i); // 뒤 부터 //7

//대소문자 변환
a.toUpperCase(); //대문자
a.toLowerCase(); //소문자

//양 끝 공백 제거
a.trim();

//부분 문자열 접근 slice(start, end)
a.slice(0,2); //Hi //start포함 end전까지
a.slice(3); //Codeit //end 생략시 시작 지점부터 끝까지 문자열 리턴
a.slice(); //Hi Codeit //모두 생략이 문자열 전체 리턴

 

배열과 비슷한 점

문자열은 반복될 때마다 배열의 각 요소가 변수에 할당되었던 for... of문도 사용가능하다.

let str = "Hi";

for (let a of str) {console.log(a);}
//H
//i

 

배열과 다른 점

배열은 'mutable(바뀔 수 있는)' 자료형. 문자열은 'immutable(바뀔 수 없는)' 자료형이다.

문자열은 한 번 할당된 값을 수정할 수 없기 때문에 변수에 할당된 문자열을 바꾸고 싶다면

새로운 문자열을 지정해 줘야 한다.

문자열이 가진 메소드들은 return값을 활용하고, 본래의 문자열 값은 수정하지 않는다.

따라서 문자열에 splice같은 메소드들은 사용할 수 없다.

let myArray = ['s', 'u', 'm', 'i', 'n'];
myArray[0] = 'B';
console.log(myArray); //(6) ['B', 'u', 'm', 'i', 'n']; //값이 바뀜

let myString = 'sumin';
myString[0] = 'B';
console.log(myString); //sumin  // 값이 바뀌지 않음

 

기본형과 참조형

기본형, 기본 타입 자료형 (Primitive Type) : Number, String, Boolean, Null, undefined

참조형(Reference Type) : 객체, 배열 (주소값을 참조해서 그 값에 접근)

기본형 값을 변수에 담아 사용할 때는 값이 그대로 할당되고,

참조형 값을 변수에 담아 사용할 때는 해당 객체를 가리키는 주소값이 할당된다.

객체는 참조형값이기 때문에 변수 x에는 주소 값이 저장

5번 줄) number 프로퍼티의 값이 배열이기 때문에 y에도 주소값 저장 (x.numbers와 y가 같은 배열을 가리킴)

6번 줄) title의 프로퍼티 값이 기본형이기 때문에 z에는 값이 그대로 복사 (x.title과 z는 같은 값이지만 독립적)

 

참조형 복사하기

배열의 경우 slice메소드를 호출할 때 파라미터에 값을 넘겨주지 않으면 원래 값이 리턴되는 특성 활용

let number1 = [1,2,3];
let number2 = number1.slice();

number2.push(4);

console.log(number1); // [1,2,3]
console.log(number2); // [1,2,3,4]

 

객체의 경우

1. Object객체의 assign메소드 활용

let course1 = {
  title: 'a'
  language: '1111'
};

let course2 = Object.assign{{},course1};

2. 메소드를 활용하지 않고 for..in문으로 객체 복사

let course2 ={}; //복사받을 변수에 빈 객체 할당

for (let key in course1){
	course2[key] = course1[key];
}

//함수 활용
function cloneObject(object){
  let temp = {};  
  for(let key in object){
  	  temp[key] = object[key];
    }
  return temp
}

주의)

객체나 배열 안에 중첩해서 객체나 배열이 있는 경우 복사할 때 또 주소값이 복사되기 때문에 예상치 못한 결과를 얻을 수 있다.(배열의 slice메서드나 오브젝트 객체의 assign메소드 모두 동일하게 발생하는 문제)

 

const키워드로 변수 선언 했는데 값이 바뀌는 경우

1. 객체 프로퍼티나 배열의 요소들이 변경되는 경우, 변수가 가진 주소값을 변경하는 것이 아님

const x = {name: 'sumin'};
x.birth = 2023; //프로퍼티 추가

 

2. 할당된 값이 객체나 배열일 경우 메소드를 통해 값을 변경할 수 있다.

let team1 = ['Drum', 'Bass', 'Saxophone'];
const team2 = team1;

team1.splice(2, 1, 'Trumpet');
team2.splice(2, 1, 'Piano');

console.log(team1); // ['Drum', 'Bass', 'Piano']
console.log(team2); // ['Drum', 'Bass', 'Piano']

 

문제

팰린드롬(거꾸로 읽어도 똑같은 단어) 여부 확인