2. 값

값

자바스크립에서 값은 중요한 요소라 생각한다. 이유는 자바스크립트는 타입을 값으로 추론하기 때문이고 이것에 따라 많은 문법이 파생이 된다고 생각 한다. 따라서 각 값과 타입이 어떤식으로 사용되어야하는지 파악할 수 있었다.

값 쓰임

• 배열

  • 기본적인 쓰임은 타 랭귀지와 동일

  • 크기 지정없이 동적으로 크기가 자동 늘어남

  • delete 연산자를 통해 삭제 가능

    -> 데이터 비게됨. 길이는 그대로 인걸로 봐서는 공간은 차지하는것 같음

  • 할당 안된 중간의 부분은 undefined

• 문자열

  • 자바스크립트에서 원시타입으로 기본값으로 간주

  • 유사배열 : 배열은 아니지만 배열같이 움직일 수 있는 구조

• 숫자

  • 기본적으로 정수, 실수 구분없이 사용 가능

  • 숫자가 커지면 지수법칙인가? 적용 e로 시작하는 거

  • 소숫점 0 생략

  • 가까운수 반올림

  • 진법 표기 : 0x, 0o, 0b 처럼 소문자로 표기하는 습관들이기

• null

  • 빈값

  • 값이 있었지만 현재 값이 없는 상태

• undefined

  • 할당안된 값

  • 아에 할당조차 안된 상태

• 값 vs 레퍼런스

  • 포인터란 개념이 없음

  • 기본적으로 자바와 같은 개념으로 생각하면 될 듯

  • 값 / 객체 관련

주요 개념 및 내용

배열, 문자열, 숫자 의 사용이 중요 undefined, null

• 유사배열 개념

  • 대표적인 DOM 원소 리스트

주의 사항

• 배열 인덱스에 일반문자열 -> 프로퍼티로 설정됨

    var a = [];
    a[0] = 1;
    a["foobar"] = 2;    // 프로퍼티로 들어감
    console.log(a);     // [ 1, foobar: 2 ]
    console.log(a.length);  // 1
    console.log(a.foobar);  // 2
    console.log(a[1]);      // undefined

• 배열 인덱스 문자열숫자 -> 인덱스로 인식

    var b = [];
    b["13"] = 42;           // b[13] = 42와 동일 : 0~12 undefined 로 설정
    console.log(b);         // [ <13 empty items>, 42 ]
    console.log(b.length);  // 14

• 숫자 덧셈 뺄셈

    // 정확한 값이 안나옴
    var a = 0.1;
    var b = 0.2;
    console.log(a + b) // 0.3 ? 0.300000000004 : 오차발생

• NaN 비교

    var a = 2 / "foo";    // NaN
    console.log(a == NaN);
    console.log(a == NaN);  // false
    console.log(a === NaN); // false  개소름..?
  
    console.log(isNaN(a));  // true
    console.log(isNaN("foo"));          // true   : 숫자만 체크하는 개념이 아님.. 버그성 비직관적
    console.log(Number.isNaN("foo"));;  // false  : es6 NaN만 체크

• -0, +0, +-Infinity

    var a = 0 / -3;
    var b = 0 / 3;
    console.log(a); // -0
    console.log(b); // 0
    console.log(a == b); // true
  
    console.log(a.toString());      // 0
    console.log(String(a));         // 0
    console.log(JSON.stringify(a)); // 0
  
    console.log(+"-0");             // -0
    console.log(Number("-0"));      // -0
    console.log(JSON.parse("-0"));  // -0
  
    // -0 체크는 이런 추가 작업이 필요함
    function isNegZero(n) {
        n = Number(n);
        return n === 0 && (1/n === -Infinity);
    }
  
    console.log(isNegZero(-0));
    console.log(isNegZero(0 / -3));
    console.log(isNegZero(-0 * 11));
    console.log(isNegZero(0));

그외 빠트린 부분 정리

• 정수 정확한 표현

  • isSafeInteger() / isInteger()

• void 연산자

  • 어떤 값이든 무효로 만듬 : undefined

• NaN

  • 유효하지 않은 숫자 / 실패한 숫자 / 몹쓸 녀석

  • NaN체크는 es6(Number.isNaN 으로 체크해야함)

• -0, +0 개념

  • 벡터라봐야한다. 즉 플마는 방향성을 나타냄. 화면에 애니메이션 등 표현이 필요한 경우?

• Obejct.is()

  • 두값을 비교하는 메서드

    ```javascript

    var a = 2 / "foo"; // NaN

    var b = -3 * 0; // -0

  console.log(Object.is(a, NaN)); // true console.log(Object.is(b, -0)); // true console.log(Object.is(b, 0)); // false

  ```

테스트 코드

(function () {
    var a = [];
    a[0] = 2;
    a[2] = 3;   //  a[1] = ? -> undefined
    console.log(a);
    console.log(a.length);  // 3
    delete a[0];            // undefined : 공간은 차지
    console.log(a);
    console.log(a.length);  // 3

    console.log(typeof a[0]);
    console.log(typeof a[1]);
    console.log(typeof a[2]);

    console.log("==========");

    var a = [];
    a[0] = 1;
    a["foobar"] = 2;    // 프로퍼티로 들어감
    console.log(a);     // [ 1, foobar: 2 ]
    console.log(a.length);  // 1
    console.log(a.foobar);  // 2
    console.log(a[1]);      // undefined

    var b = [];
    b["13"] = 42;           // b[13] = 42와 동일 : 0~12 undefined 로 설정
    console.log(b);         // [ <13 empty items>, 42 ]
    console.log(b.length);  // 14

    console.log("===== 배열 =====");
    var a = "foo";
    var b = ["f", "o", "o"];
    console.log(a.length);
    console.log(b.length);
    console.log(a.indexOf("o"));
    console.log(b.indexOf("o"));

    var c = a.toUpperCase();
    console.log(c);
    console.log(a === c);

    b.push("!");
    console.log(b);

    var c = Array.prototype.join.call(a, "-");
    console.log(c);
    var d = Array.prototype.map.call(a, function (v) {
        return v.toUpperCase() + ".";
    }).join("");
    console.log(d);
    console.log(a.split("").reverse().join(""));

    console.log("===== 숫자 ======");
    var a = 0.2;
    var b = 0.3;
    console.log(b - a);   // 정확한 0.1 안나옴
    console.log(b + a);   // 정확한 0.1 안나옴

    console.log(Number.isInteger(42));
    console.log(Number.isInteger(42.00));
    console.log(Number.isSafeInteger(42.00));


    console.log("===== void 연산자 =====");
    var a = 42;
    console.log(void a, a); // a에는 영향을 안미침

    console.log("======= NaN =========");
    var a = 2 / "foo"; // NaN
    console.log(a);
    console.log(typeof a);
    console.log(NaN);
    console.log(typeof NaN);

    console.log(a == NaN);  // false
    console.log(a === NaN); // false  개소름..?

    console.log(isNaN(a));  // true
    console.log(isNaN("foo"));          // true
    console.log(Number.isNaN("foo"));;  // false

    console.log("======= -0, +0 =========");
    var a = 0 / -3;
    var b = 0 / 3;
    console.log(a); // -0
    console.log(b); // 0
    console.log(a == b); // true

    console.log(a.toString());      // 0
    console.log(String(a));         // 0
    console.log(JSON.stringify(a)); // 0

    console.log(+"-0");
    console.log(Number("-0"));
    console.log(JSON.parse("-0"));

    function isNegZero(n) {
        n = Number(n);
        return n === 0 && (1/n === -Infinity);
    }

    console.log(isNegZero(-0));
    console.log(isNegZero(0 / -3));
    console.log(isNegZero(-0 * 11));
    console.log(isNegZero(0));

    console.log("======= Object.is() ========");

    var a = 2 / "foo";    // NaN
    var b = -3 * 0;       // -0
    console.log(Object.is(a, NaN));         // true
    console.log(Object.is(b, -0));   // true
    console.log(Object.is(b, 0));    // false


    var a = [1, 2, 3];
    function testArr(x) {
        x.push(4);

        x.length = 0;
        x.push(4, 5, 6, 7);
    }

    testArr(a);
    console.log(a);
    console.log(a.slice());


})();