DAY 7 - TIL

데이터 타입 

원시 타입 (Primitive type)

---

• Number (숫자)
• Strings (문자열)
• Boolean (불리언)
• Undefined (정의되지 않음)
• Null (널)
• Symbol (ES6 추가)

객체 타입 (Object type)

---

• Array (배열)
• Function (함수)
• RegExp (정규표현식)

 

Split

spilt() 메서드는 String 객체를 지정한 구분자를 이용하여 여러 개의 문자열로 나눕니다. Return 배열

const str = 'This is an example';
const word = str.split(' ');
console.log(word);
//결과값 : ['This','is','an','example']

 

== VS ===

== 는 등치 연산자로 두개의 값이 같으면 true, 같지 않으면 거짓을 반환한다

===는 일치 연산자로 등치 연산자의 업그레이드 버전이다. 타입까지 비교한다. 

 

조건 연산자

(조건) ? true : false

var str = 'string';
var result = (str === 'string')? 'yes' : 'no';
console.log(result); //결과값 : yes

 

sort()

-기본적으로 오름차순으로 정렬한다.

-배열 요소를 문자열로 캐스팅하고 변환된 문자열을 비교하여 순서를 결정한다

-배열의 요소가 undefined인 경우 문자열로 변환되지 않으며 배열의 맨 끝으로 정렬된다.

var numbers = [1,10,2,20,3,30];
numbers.sort();
console.log(numbers); //결과값:[1,10,2,20,30,30]

[1,2,3,10,20,30]이라는 예상과는 다른 결과가 나왔다. 문자열을 비교했기 때문이다. "10" vs "2" -> "1" < "2" (글자순비교)

위 문제를 해결하기 위해 비교 함수를 sort()메서드에 전달해야 한다. 

 

--비교 함수

array.sort(compareFunction)

var numbers = [1,10,2,20,3,30];

numbers.sort(function(a,b){
	if(a>b) return 1;   //return value > 0이므로 a는 b뒤에 온다. 
    if(a<b) return -1;  //return value < 0이므로 a는 b앞에 온다.
    return 0;           //a와 b의 정렬을 유지한다.
});						//value는 a와b를 비교한 값: a-b

console.log(numbers);   //결과값 : [1,2,3,10,20,30]

위의 과정은 동작 방법을 세세히 설명한 것이고 아래는 간략하게 작성되는 것이다.

var numbers = [1,10,2,20,3,30];

numbers.sort(function(a,b)
    return a-b;          
});						

console.log(numbers);

-- 숫자 정렬 

var numbers = [1,10,2,20,3,30];

//오름차순
numbers.sort(function(a,b){
	return a-b;
});		
console.log(numbers);   //결과값 : [1,2,3,10,20,30]

//내림차순
numbers.sort(function(a,b){
	return b-a;
});	

console.log(numbers);   //결과값 : [30,20,10,3,2,1]

-- 문자 정렬

- 연산자를 사용하여 숫자 정렬처럼 사용할 경우 정상적인 정렬X

//오름차순
var str = ["BA","BB","AA","AB","CB","CA"];
str.sort();
console.log(str); //결과값: ["AA","AB","BA","BB","CA","CB"]

//내림차순
str.sort(functino(a,b){
	if(a>b) return -1;
    if(a<b) return 1;
    return 0;
});
console.log(str); //결과값: ["CB","CA","BB","BA","AB","AA"]

 

형변환

암시적변환

암시적 변환이란 자바스크립트 엔진이 필요에 따라 자동으로 데이터타입을 변환시키는 것이다.

+연산자

문자열과 숫자가 함께 덧셈 연산이 이루어진 경우 문자열로 자동형변환

<script>
        alert(10 + 20); //30 숫자 + 숫자 = 숫자
        alert('10' + 20) //1020 문자열 + 숫자 = 문자열
        alert(10 + '20'); //1020 숫자 + 문자열 = 문자열
        alert('10' + '20'); //1020 문자열 + 문자열 = 문자열
</script>

+이외의 연산자

+연산자를 제외한 사칙 연산자는 피연산자에 문자열이 있을 경우 숫자형으로 자동형변환

<script>
        alert('20' - 10); //10
        alert('20' * 10); //200
        alert('20' / 10); //2
        alert('20' % 3); //2
</script>

명시적 형 변환(Explicit Type Conversion)

명시적 변환이란 개발자가 의도를 가지고 데이터 타입을 변환시키는 것이다.

타입을 변경하는 기본적인 방법은 Object(), Number(), toString(), Boolean() 와 같은 함수를 이용하는데 new 연산자가 없다면 사용한 함수는 타입을 변환하는 함수로써 사용된다.

var trans = 100; //NumberObject(trans); //100
console.log(typeof trans); //NumberString(trans); //”100"
console.log(typeof trans); //StringBoolean(trans); //true
console.log(typeof trans); //Bolean

A Type → Number Type

다른 자료형을 숫자타입으로 변형하는 방법은 아래와 같다.

Number()

Number()는 정수형과 실수형의 숫자로 변환한다.

Number(“12345”); //12345
Number(“2”*2); //4

parseInt()

parseInt()는 정수형의 숫자로 변환한다. 만약 문자열이 `숫자 0` 으로 시작하면 8진수로 인식하고(구형브라우저 O, 신형브라우저X), `0x, 0X` 로 시작한다면 해당 문자열을 16진수 숫자로 인식한다. 또한 앞부분 빈 공백을 두고 나오는 문자는 모두 무시되어 NaN을 반환한다.

parseInt(“27”) //27
parseInt(0033); //27
parseInt(0x1b); //27
parseInt(“ 2”); //2
parseInt(“ 2ㅎ”); //2
parseInt(“ ㅎ2”); //NaN

parseFloat()

parseFloat()는 부동 소수점의 숫자로 변환한다. parseInt()와는 달리 parseFloat()는 항상 10진수를 사용하며 parseFloat() 또한 앞부분 빈 공백을 두고 나오는 문자는 모두 무시되어 NaN을 반환한다.

parseFloat(“!123”); //NaN
parseFloat(“123.123456”); //123.123456
parseInt(“123.123456”); //123
parseFloat(“ 123.123456”); //123.123456
parseFloat(“ a123.123456”); //NaN

A Type → String Type

다른 자료형을 문자타입으로 변형하는 방법은 아래와 같다.

String()

String(123); //”123"
String(123.456); //”123.456"

toString()

toString()는 인자로 기수를 선택할 수 있다. 인자를 전달하지 않으면 10진수로 변환한다.

var trans = 100;trans.toString(); //”100"
trans.toString(2); //”1100100"
trans.toString(8); //”144"var boolT = true;
var boolF = false;boolT.toString(); //”true”
boolF.toString(); //”false”

toFixed()

toFixed()의 인자를 넣으면 인자값만큼 반올림하여 소수점을 표현하며 소수점을 넘치는 값이 인자로 들어오면 `0`으로 길이를 맞춘 문자열을 반환한다.

var trans = 123.456789;
var roundOff = 99.987654;trans.toFixed(); //”123"
trans.toFixed(0); //”123"
trans.toFixed(2); //”123.46"
trans.toFixed(8); //”123.45678900"roundOff.toFixed(2); //”99.99"
roundOff.toFixed(0); //”100"

A Type → Boolean Type

다른 자료형을 불린타입으로 변형하는 방법은 아래와 같다.

Boolean()

Boolean(100); //true
Boolean(“1”); //true
Boolean(true); //true
Boolean(Object); //true
Boolean([]); //true
Boolean(0); //false
Boolean(NaN); //false
Boolean(null); //false
Boolean(undefined); //false
Boolean( ); //false