JS 톺아보기(JS 자료형, REACT기초)

수

수를 생각하면 기본적으로 사람들은 자연수를 생각하게 된다.

코딩을 좀 해본 사람들은 Int 형같은 정수를 생각하겠지만, JS에서는 조금 다르다.

JS에서 "수는 실수다" 즉 기본적으로 64비트의 floating Type 라고 보면된다.(binInt제외)

 

JS 에서 기본적인 수의 범위는 (-(2^53 − 1) and 2^53 − 1)으로 정의된다.

즉, +/- 9,007,199,254,740,991 이 범위이며 

영어로 nine quadrillion seven trillion one hundred ninety-nine billion two hundred fifty-four million seven hundred forty thousand nine hundred ninety-one 되시겠다.

 

메모리 기반 언어를 쓰던 사람들이라면 엥 왜 53비트이지라고 생각할 수 있는데, 11비트는 지수를 표현하는데 사용되었다.

혹시 더 공부하고 싶은 사람은 범위를 벗어나는 것 같기에 링크로 표시하겠다.(링크)

이미지로 보면 이른 느낌

위와같은 특징 때문에 JS에서는 이런 연산이 가능해진다.

console.log(3 / 2);             // 1.5, not 1 정수연산이었으면 1이었겠지만, 답은 1.5다.
console.log(Math.floor(3 / 2)); // 1

또한, CS 질문으로 자주나오는 0.1 + 0.1 != 0.2 문제도 발생한다.

0.1 + 0.2 == 0.30000000000000004; // True

특이하게도, 무한이라는 값을 가지고 있다.

 1 / 0; //  Infinity
-1 / 0; // -Infinity

기본적인 내용은 위와 같고, 추가적으로 알면 좋을만한 함수들로는 이런 것들이 있다.

 

ParseInt(문자열, 진수) // 문자열을 정수로 바꿔주는 함수

parseInt('123', 10) // 123 문자열이 10진수 -> 123으로 변화한다.
parseInt('11', 2) // 11을 2진수로 생각 -> 3으로 변환한다.
parseInt('010');  //  8
parseInt('0x10'); // 16

isNaN() // NaN(숫자가 아닙니다, Not a Number) 검사용 함수

Number.isNaN(NaN); // true
Number.isNaN('hello'); // false
Number.isNaN('1'); // false
Number.isNaN(undefined); // false
Number.isNaN({}); // false
Number.isNaN([1]) // false
Number.isNaN([1,2]) // false
isNaN('hello'); // true
isNaN('1'); // false
isNaN(undefined); // true
isNaN({}); // true
isNaN([1]) // false
isNaN([1,2]) // true

---

문자열

JS같이 국제적으로 쓰는 트렌디한 친구들은 유니코드를 쓴다.

맨날 아스키랑 놀다가 보니 친숙하지않지만, 크게 다를 것은 없다.

 

물론! 한국어를 변수명으로 쓸 수 있다는 놀라운 사실을 제외하고 말이다!!

 

var 갑을 = "병정";
var Früh = "foobar";

이 문자열들은 하나의 객체로 적용되기에 다양한 속성들을 가지고 있는데,

'hello'.length; // 5

이런식으로 문자열이 가지고 있는 속성을 확인할 수 있다.

C++에 익숙한 당신이라면, string 클래스를 생각하면 편할 것 같다.

 

'hello'.charAt(0); // "h"
'hello, world'.replace('hello', 'goodbye'); // "goodbye, world"
'hello'.toUpperCase(); // "HELLO"

이런식으로 놀랍게도 Method()들도 가지고 있는 것들을 확인할 수 있다.

---

부울

JS에서는 "값이 없음!"을 의도하는 null과 아직 값이 들어오지 않아서 자료형 모르겠음!을 나타내는 "undefined"를 구분한다.

이것을 알아야 부울을 어떻게 처리하는지 알 수 있는데, JS는 이 기준으로 처리한다.

 

False - false, 0, ""(빈 문자열), NaN, null, undefined

True - 위의 것 제외하고 다 True

Boolean('');  // false
Boolean(234); // true

이런 참과 거짓에 대한 판단을 정확하게 알아야하는 이유는 JS가 기본적인 논리연산자들을 지원하기 때문이다! 

if( !people )이라고 쳤는데, 만약 undefined가 False라는 것을 알지 못한다면.. 힘들 것이다.. 

---

함수

JavaScript에서 함수는 Function 객체이다( ㄴㅇㄱ)

 

그렇기 때문에 함수 안에는 다양한 속성값들이 있는데, 이들은 console.log()로 찍어보면 알 수 있다.

이 Function들이 Function.prototype을 상속받는다는 것만 명심하면 사용함에 있어서 어려움은 없다.

 

한번 찍어보기 위해서 남겨두면

속성

- argument : 함수에 전달되는 인수(argument)에 해당하는 배열

- arity(삭제됨)

- caller : 해당(this) 함수를 호출한 함수를 지정

- length : 함수에 의해 기대되는 인수의 수

-name : 함수명

-disPlayName : 함수의 표시명

 

메서드

- Function.prototype.apply() : 함수를 호출, this를 제공된 값으로 설정하기

- Function.prototype.bind() : 호출될 때 this를 제공된 값으로 설정하는 새로운 함수를 만들기!

- Function.prototype.call() : 함수를 호출, this를 제공된 값으로 설정(이 친구는 인수로 그대로 전달 가능, apply는 array형태로)

- Function.prototype.toSource() : 함수의 소스코드를 나타내는 문자열 반환

- Function.prototype.toString() : 위 toSource와 같음

---

객체

자바스크림트의 거의 대부분은 Object의 인스턴스이다. 

즉, 대부분은 Object.prototype 을 상속하여 그 친구가 가지고 있는 속성들을 가지게 된다.

 

이렇게만 말하면, 객체가 도대체 뭔지 모를 수 있으니 잘 정리된 링크 하나를 투척해본다. (링크)

자바스크립트에서 쓰는 것들은 다 이 친구를 상속하기에 우리가

x.toString() -> 문자열로 변환! 같은 마법같은 일들을 간단하게 해낼 수 있다.

(C로 만들려면.. 이하 생략)

---

기호(Symbol)

심볼은 값으로 익명의 객체 속성을 만들 수 있는 원시 데이터 형식이다.

이렇게 말하면 무슨 외계어 같으니까 하나씩 뜯어보자

 

Symbol은(말그대로 심볼은)

 

익명의 객체 속성을

(이름이 없는 객체, 원래를 객체를 만들기 위해 Class를 만들고 그것을 통해 객체를 만들어야되지만 한번만 쓰고 싶을 때! 쓰는 객체)

(쉽게 설명하면, 붕어빵을 만들기 위해 붕어빵 틀을 만들어야되는데 어차피 한번만 만들꺼라 틀 안만들고 조각해서 하나만 만들고 싶을 때)

 

원시 데이터 형식이다.

(프로그래밍 언어가 제공하는 자료형이다. 즉, 내장 혹은 기본적으로 제공하는 형식이다)

 

즉, 익명 객체다!

구체적인 사용법은 링크 참조