(자알쓰) 자료형(객체)

var a = [1];
var b = a;
b.push(2);
console.log(a); // [1, 2], 건드리지도 않은 a가 왜...?

var c = {};
var d = {};
console.log(c === d); // false, 둘은 똑같은 값이 아닌가...??
 
console.log(typeof function(){}); // 'function'
console.log(typeof {}); // 'object'
console.log(typeof []); // 'object', 배열의 타입도 object
console.log(typeof /a/); // 'object', 정규 표현식의 타입도 object
console.log(typeof new Date()); // 'object', 날짜의 타입도 object
console.log(typeof new WeakSet()); // 'object', 컬렉션의 타입도 object

var e = function(){};
e.asdf = 'qwer';
console.log(e.asdf); // 'qwer', 함수도 객체이므로 프로퍼티의 추가가 가능하다.

var a = 2;
var b = a;
var c = [1];
var d = c;

var a = [1];
var b = a;
b.push(2);

var a = [1];
var b = a;
b = [1, 2];

console.log({}.toString() === '[object Object]'); // true, 객체 검출 성공
console.log(Array.isArray([])); // true, 배열 검출 성공
console.log(Object.prototype.toString.call(/a/) === '[object RegExp]'); // true, 정규표현식 검출 성공
console.log(Object.prototype.toString.call(new Date()) === '[object Date]'); // true, 날짜 검출 성공
console.log(new Map().toString() === '[object Map]'); // true, 컬렉션 검출 성공
console.log(Math.toString() === '[object Math]'); // true, 컬렉션 검출 성공

const a = [1, 2];
const b = [...a];
b.push(3);
console.log(a); // [1, 2]
console.log(b); // [1, 2, 3]

const a = {name: '양권성'};
// 객체에 spread 연산자를 쓸 수 있게 해주는 것은 Stage-3 단계이다.  
// https://github.com/tc39/proposal-object-rest-spread
// 따라서 바벨의 stage-3 preset이나 transform-object-rest-spread 플러그인을 사용하면 된다.
const b = {...a};
b.age = 25;
console.log(a); // {name: '양권성'}
console.log(b); // {name: '양권성', age: 25}

const a = [1, [2]];
const b = [...a];
b.push(4);
b[1].push(3);
console.log(a); // [1, [2, 3]]
console.log(b); // [1, [2, 3], 4]

// 혹시 추후에 Array나 Object의 표준 메소드로 clone이 생길지 모르니 심볼을 통해 유니크한 값을 만들어서 쓰자.
const symClone = Symbol('clone');
Array.prototype[symClone] = function() {
  // 배열의 얕은 복사(Shallow Copy)를 한 번 함.
  let copy = [...this];
  // map 메소드는 원본 배열을 훼손시키지 않으므로 반환된 값을 원본 배열에 할당.
  copy = copy.map(v => {
    // 현재 배열의 요소가 배열 또는 객체라면
    // 그것들을 다시 얕은 복사하는 재귀함수를 호출.
    if(Array.isArray(v) || v.toString() === '[object Object]') v = v[symClone]();
    // 리턴 값이 없다면 배열에 undefined가 들어가게 됨.
    return v;
  });
  return copy;
};

Object.prototype[symClone] = function() {
  // 객체의 얕은 복사(Shallow Copy)를 한 번 함.
  let copy = {...this};
  // 객체의 키 값들을 순회
  for(const key of Object.keys(copy)) {
    // 현재 배열의 요소가 배열 또는 객체라면
    // 그것들을 다시 얕은 복사하는 재귀함수를 호출.
    if(Array.isArray(copy[key]) || copy[key].toString() === '[object Object]') copy[key] = copy[key][symClone]();
  }
  return copy;
};

// 무지하게 참조 뎁스가 복잡한 객체.
const obj = {
  name: 'asdf',
  arr: [ // 객체 안에 배열
    1, 2, 3, [ // 객체 안에 배열 안에 배열
      4, 5, 6, { // 객체 안에 배열 안에 배열 안에 객체
        age: 999
      }
    ]
  ]
};

const objClone = obj[symClone]();
objClone.arr[2] = 4;
objClone.arr[3].unshift(2);
objClone.arr[3][4].qwer = 'qwer';

// {
//   name: 'asdf',
//   arr: [ // 객체 안에 배열
//     1, 2, 4, [ // 객체 안에 배열 안에 배열
//       2, 4, 5, 6, { // 객체 안에 배열 안에 배열 안에 객체
//         age: 999,
//         qwer: 'qwer'
//       }
//     ]
//   ]
// };
console.log(objClone);

// { 원본 값은 전혀 바뀌지 않았다.
//   name: 'asdf',
//   arr: [ // 객체 안에 배열
//     1, 2, 3, [ // 객체 안에 배열 안에 배열
//       4, 5, 6, { // 객체 안에 배열 안에 배열 안에 객체
//         age: 999
//       }
//     ]
//   ]
// };
console.log(obj);