[JS기초] 자료형 심화

 

---

자료형 심화

• 다양한 숫자 표기

// 지수 표기법
let a = 1000000000;
let b = 1e9;
console.log(a === b);
>> true	// a와 b는 같은 의미

console.log(25e5 === 2500000);	>> true
console.log(5.3e3 === 5300);	>> true
console.log(-6.1e8 === -610000000);	>> true

console.log(16e-5 === 0.00016);	>> true
console.log(3.5e-3 === 0.0035);	>> true
console.log(-9.1e-5 === -0.000091);	>> true

// 16진법
let hex1 = 0xff; // 255
let hex2 = 0xFF; // 255
// 8진법
let octal = 0o377 // 255
// 2진법
let binary = 0b11111111; // 255

• 숫자형 메소드
  • toFixed() : 문자열로 계산됨(string) | 더하기 연결시 문자열이 이어짐... Number로 형 변화 후 사용하면 숫자형으로 사용 가능(Number, + 사용)
  • toString() : 파라미터 숫자의 진법으로 숫자를 변환해줌

let myNumber = 0.3591;

// toFixed(0~100) : 소수를 다룰 때 사용
console.log(myNumber.toFixed(3));
>> 0.359
console.log(myNumber.toFixed(7));
>> 0.359000

// 얘네 둘 다 number형으로 반환
console.log(+myNumber.toFixed(2));
console.log(Numner(myNumber.toFixed(2)));
>> 0.36

let myNumber = 255;

// toString(2~36)
console.log(myNumber.toString(2));
>> 11111111
console.log(myNumber.toString(8));
>> 377
console.log(myNumber.toString(16));
>> ff

// 직접적인 숫자 표기
console.log(255..toString(2));
>> 11111111
console.log((255).toString(8));
>> 377

• Math객체

// abs() : 절댓값
console.log(Math.abs(-10)); // 10
console.log(Math.abs(10));  // 10

// max(), min() : 최대/최소값
console.log(Math.max(2, -1, 4, 5, 0));
>> 5
console.log(Math.min(2, -1, 4, 5, 0));
>> -1

// pow() : 거듭제곱
console.log(Math.pow(2, 3)); // 8
console.log(Math.pow(5, 2)); // 25

// sqrt() : 제곱근
console.log(Math.sqrt(25)); // 5
console.log(Math.sqrt(49)); // 7

// round() : 반올림
console.log(Math.round(2.3)); // 2
console.log(Math.round(2.49)); // 2
console.log(Math.round(2.5));  // 3

// floor() : 버림
console.log(Math.floor(2.8)); // 2
// ceil() : 올림
console.log(Math.ceil(2.4)); // 3

// random() : 0 이상 1미만의 값이 랜덤으로 리턴
console.log(Math.random()); // 0.234142

• 문자열 심화
  • for of문 사용 가능... 그러나 string에서 사용시엔 string이고, 배열에서 사용할 땐 object형임.
  • 배열과 가장 큰 차이점은 배열은 바뀔 수 있는 자료형인 반면, 문자열은 바뀔 수 없는 자료형임.

let myString = 'Hi baNAna';

// length : 문자열 길이
console.log(myString.length);

// 요소 접근
console.log(myString[3]); // 대괄호 표기법
console.log(myStrig.cahrAt(3)); // charAt 메소드
>> b

// 요소 탐색
console.log(myString.indexOf('c')); // 앞부터
>> -1
console.log(myString.lastIndexOf('n'); // 뒤부터
>> 7

// 대소문자 변환
console.log(myString.toUpperCase()); // 대문자로
console.log(myString.toLowerCase()); // 소문자로

// 양 끝 공백 제거
console.log(myString.trim());

// 부분 문자열 접근 slice(strat, end)
console.log(myString.slice(0, 2)); // Hi
console.log(myString.slice(3)); // baNana
console.log(myString.slice()); // Hi baNAna

• 기본형과 참조형
  • 기본형(변수=값) : number, string, boolean, null, undefined | 객체를 제외한 나머지 타입들
  • 참조형(변수=주소값) : JS에서 객체 생성시 어딘가에 값이 생성되고, 그 변수에는 그 객체 값으로 가는 주소가 저장됨.
    • 따라서 다음 코드는 x, y 둘 다 같은 객체를 보고 있기에 y에 추가해도 같은 결과 출력(한쪽을 수정하면 다른 한쪽에도 적용) | 배열도 마찬가지

let x = {name: 'durian'};
let y = x;

console.log(x); // {name: 'durian'};
console.log(y); // {name: 'durian'};
y.birth = 2000;
console.log(x); // {name: 'durian', birth: 2000};
console.log(y); // {name: 'durian', birth: 2000};

• 참조형 복사하기 : 상황에 따라서 참조형을 복사만 하고 싶을 때 사용
  • slice() 메서드 사용
  • 객체에선 Object() 사용

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

number2.push(4);

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

// 객체
let course1 = {
	title: '공부',
    language: 'JS'
};
let course2 = Object.assign({}, course1);
course2.title = '정석';

console.log(course1); // {title: '공부', 'language: 'JS'}
console.log(course2); // {title: '정석', 'language: 'JS'}

// for in 문 사용
let course1 = {
	title: '공부',
    language: 'JS'
};
let course2 = {}; // 빈객체 생성
for(let key in course1) {
	course2[key] = course1[key];
}
course2.title = '정석';

console.log(course1); // {title: '공부', 'language: 'JS'}
console.log(course2); // {title: '정석', 'language: 'JS'}

// for in 문을 함수로 생성
function cloneObject(object) {
	let temp = {};
        for(let key in object) {
        temp[key] = object[key];
    }
    return temp;
};
let course2 = cloneObject(course1); // 파라미터만 변경하면 됨

• Const, 변수와 상수 사이
  
  • const와 let의 차이 : let은 재할당 가능, const는 재할당 불가능
  • 코드 속에 변수가 많을수록, 코드 일관성 유지하기 힘듦
  • 구분법
    • 변수 : 보통은 소문자... 두번째 단어 시작은 대문자 | myName
    • 상수 : 대문자... 단어 이을 때 밑줄 사용 | MY_NAME
  • 객체는 변수의 주소값이 저장... 할당 연산자로 값 변경 시 값을 재할당 하는 것처럼 오해할 수 있음
    • but, 객체의 프로퍼티나 배열의 요소들이 변경되는 경우는 변수가 가진 주소값들을 변경하는 게 아니기 때문에, const 키워드로 변수를 선언하더라도 변수의 값이 충분히 변할 수 있음!
  • 과거 JS에서 변수 선언시 var 키워드 사용
    • 문제점 : 중복 선언 허용 | scope 문제

var myVariable = 'hi';