javascript base

null == undefined;
1 == '1';
'0xff' == 255;
true == 1;
new String('a') == 'a';
new Number(2) == 2;
[2] == 2;

typeof 1; // 'number'
typeof 2.5; // 'number'
typeof 'hello world'; // 'string'
typeof true; // 'boolean'
typeof undefined; // 'undefined'
typeof {}; // 'object'
typeof []; // 'object'
typeof null; // 'object'

const answer = prompt('이름이 무엇인가요?');
console.log(answer);
alert(answer);

// 객체의 생성
const obj = {
  x: 0, // 객체의 속성. 속성 이름: x, 속성 값: 0
  y: 1, // 객체의 속성. 속성 이름: y, 속성 값: 1
};

// 객체의 속성에 접근하기
obj.x;
obj['y'];

// 객체의 속성 변경하기
obj.x += 1;
obj['y'] -= 1;

// 객체의 속성 삭제하기
delete obj.x;

Number.isInteger(1); // true
Number.isInteger(0.1); // false

const thisIsNan = NaN;

// 주의! 이렇게 하면 안 됩니다.
thisIsNan === NaN; // false

// 이렇게 해야 합니다.
Number.isNaN(thisIsNan); // true
Object.is(thisIsNan, NaN); // true

Object.is(0, -0); // false

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

Number.isFinite(1); // true
Number.isFinite(Infinity); // false
Number.isFinite('1'); // false
isFinite('1'); // true - `isFinite`는 문자열을 숫자로 변환합니다.

[...'hello']; // ['h', 'e', 'l', 'l', 'o']

null === undefined; // false
null == undefined; // true

null == 1; // false
null == 'hello'; // false
null == false; // false

undefined == 1; // false
undefined == 'hello'; // false
undefined == false; // false

const personPrototype = {
  introduce: function () {
    return `안녕하세요, 제 이름은 ${this.name}입니다.`;
  },
};

const person1 = Object.create(personPrototype); // 새 객체를 생성하고 프로토타입을 지정합니다.
person1.name = '이윤희';

const person2 = Object.create(personPrototype);
person2.name = '윤희';

person1.introduce(); // 안녕하세요, 제 이름은 이윤희입니다.
person2.introduce(); // 안녕하세요, 제 이름은 윤희입니다.

person1.introduce === person2.introduce; // true

// `string` 타입은 래퍼 객체를 통해 iterable로 다루어질 수 있습니다.
Array.from('hello'); // ["h", "e", "l", "l", "o"]

const arr = [1, 2, 3, 4, 5];

// 전체를 0으로 채웁니다.
arr.fill(0);
console.log(arr); // [ 0, 0, 0, 0, 0 ];

// 인덱스 2와 4 사이를 1로 채웁니다.
arr.fill(1, 2, 4);
console.log(arr); // [ 0, 0, 1, 1, 0 ];

const a = [1, 2, 3, 4, 5];
console.log(a); // [1, 2, 3, 4, 5, 6]
a.push(6);
console.log(a); // [1, 2, 3, 4, 6]
a.pop();
console.log(a); // [1, 2, 3, 4, 5]
a.unshift(0);
console.log(a); // [0, 1, 2, 3, 4, 5]
a.shift();
console.log(a); // [1, 2, 3, 4, 5]

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 2, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

const array1 = [1, 2, 3];

console.log(array1.includes(2));
// expected output: true

const pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// expected output: true

console.log(pets.includes('at'));
// expected output: false

const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// expected output: true

const array = [1, 2, 3, 4, 5];

// checks whether an element is even
const even = (element) => element % 2 === 0;

console.log(array.some(even));
// expected output: true

const obj = Object.create({ inheritedProp: 'inheritedProp' });
obj.ownProp = 'ownProp';

console.log(obj.hasOwnProperty('inheritedProp')); // false
console.log(obj.hasOwnProperty('ownProp')); // true
console.log(obj.hasOwnProperty('constructor')); // false

const obj = {
  get prop() {
    console.log('getter가 호출되었습니다.');
    return this._hidden;
  },
  set prop(arg) {
    console.log('setter가 호출되었습니다.');
    this._hidden = arg;
  },
};
// `set prop` 메소드가 `1`을 인수로 해서 호출됩니다.
obj.prop = 1;

// `get prop` 메소드가 호출되고 해당 메소드의 반환값을 읽어옵니다.
obj.prop; // 1

Object.getOwnPropertyDescriptors(obj);
// {
//   prop: {
//     get: [Function: get],
//     set: [Function: set],
//     enumerable: true,
//     configurable: true
//   },
//   ...
// }

let a = { a: 2, b: 3, e: { c: 4, d: 5 } };
let b = a;
let c = Object.assign({}, a);

a.a = 4;
a.e.c = 99;
console.log(a); // { a: 4, b: 3, e: { c: 99, d: 5 } }
console.log(b); // { a: 4, b: 3, e: { c: 99, d: 5 } }
console.log(c); // { a: 2, b: 3, e: { c: 99, d: 5 } }

// `func1`과 `func2`는 동일하게 동작합니다.
function func1(cond) {
  if (cond) {
    console.log('조건을 만족합니다.');
  }
}

function func2(cond) {
  cond && console.log('조건을 만족합니다.');
}

// `func1`과 `func2`는 동일하게 동작합니다.
function func1(arg) {
  if (!arg) {
    arg = 'hello';
  }
  console.log(arg);
}

function func2(arg) {
  arg = arg || 'hello';
  console.log(arg);
}

const numbers = [1, 2, 3];

const num = [...numbers];

numbers[1] = 3;

console.log(numbers); // [1, 3, 3]

console.log(num); // [1, 2, 3]

const [a, b, ...c] = [1, 2, 3, 4, 5];

console.log(c); // [3, 4, 5]

const {
  a,
  b: { c },
} = { a: 1, b: { c: 2 } };

console.log(a, c); // 1 2

const { a, b, ...rest } = { a: 1, b: 2, c: 3, d: 4 };

console.log(rest); // { c: 3, d: 4 }

// `c` 위치에는 대입될 값이 없으므로, 기본값인 `3`이 대신 사용됩니다.
let [a, b, c = 3] = [1, 2];

console.log(c); // 3

// `JSON.stringify`로 직렬화를 할 수 있습니다.
JSON.stringify({
  key: 'value',
  arr: [1, 2, 3],
  nullProp: null,
  undefinedProp: undefined, // 값이 `undefined`인 속성은 직렬화 과정에서 제외됩니다.
}); // '{"key":"value","arr":[1,2,3],"nullProp":null}'

// `JSON.parse`로 역직렬화를 할 수 있습니다.
JSON.parse('{"key":"value","arr":[1,2,3],"nullProp":null}');
// {key: "value", arr: Array(3), nullProp: null}

const now = new Date();
console.log(now.toString()); // Sun Dec 10 2017 12:49:31 GMT+0900 (KST)
console.log(now.toLocaleString()); // 2017. 12. 10. 오후 12:49:31
console.log(now.toDateString()); // Sun Dec 10 2017
console.log(now.toTimeString()); // 12:49:31 GMT+0900 (KST)
console.log(now.toISOString()); // 2017-12-10T03:49:31.145Z
console.log(now.toUTCString()); // Sun, 10 Dec 2017 03:49:31 GMT

// 해당 코드는 매 번 새로운 심볼을 생성합니다:
var sym1 = Symbol();
var sym2 = Symbol('foo');
var sym3 = Symbol('foo');

Symbol('foo') === Symbol('foo'); // false

// 꼭 심볼 래퍼 객체를 생성하고 싶다면, Object() 함수를 이용할 수 있습니다.
var sym = Symbol('foo');
typeof sym; // "symbol"
var symObj = Object(sym);
typeof symObj; // "object"

var sym = new Symbol(); // TypeError

// generator 함수 선언하기
function* gen1() {
  // ...
}

// 표현식으로 사용하기
const gen2 = function* () {
  // ...
};

// 메소드 문법으로 사용하기
const obj = {
  *gen3() {
    // ...
  },
};

function* numberGen() {
  yield 1;
  yield 2;
  yield 3;
}

function* numberGen2() {
  yield* numberGen();
  yield* numberGen();
}

// 1, 2, 3, 1, 2, 3이 순서대로 출력됩니다.
for (let n of numberGen2()) {
  console.log(n);
}

// 문자열은 iterable이므로 이로부터 iterator를 생성할 수 있습니다.
const strIterator = 'go'[Symbol.iterator]();
strIterator.next(); // { value: 'g', done: false }
strIterator.next(); // { value: 'o', done: false }
strIterator.next(); // { value: undefined, done: true }
strIterator.next(); // { value: undefined, done: true }

class Person {
  // 이전에서 사용하던 생성자 함수는 클래스 안에 `constructor`라는 이름으로 정의합니다.
  constructor({ name, age }) {
    this.name = name;
    this.age = age;
  }

  // 객체에서 메소드를 정의할 때 사용하던 문법을 그대로 사용하면, 메소드가 자동으로 `Person.prototype`에 저장됩니다.
  introduce() {
    return `안녕하세요, 제 이름은 ${this.name}입니다.`;
  }
}

const person = new Person({ name: '이윤희', age: 19 });
console.log(person.introduce()); // 안녕하세요, 제 이름은 이윤희입니다.
console.log(typeof Person); // function
console.log(typeof Person.prototype.constructor); // function
console.log(typeof Person.prototype.introduce); // function
console.log(person instanceof Person); // true

class Gen {
  *[Symbol.iterator]() {
    yield 1;
    yield 2;
    yield 3;
  }
}

// 1, 2, 3이 차례대로 출력됩니다.
for (let n of new Gen()) {
  console.log(n);
}

const timeoutId = setTimeout(() => {
  console.log('setTimeout이 실행된 지 2초가 지났습니다.');
}, 2000);

const intervalId = setInterval(() => {
  console.log('3초마다 출력됩니다.');
}, 3000);

clearTimeout(timeoutId);
clearInterval(intervalId);

// 실제 지연시간과 약간의 차이가 존재합니다.
// 또한 지연시간을 0으로 주었을 때는 코드가 기대한대로 동작하지 않습니다.

try {
  // code
} catch (error) {
  // try 안에서 에러 발생 시 동작
  // code
} finally {
  // catch 여부와 관계 없이 무조건 실행해야 하는 부분
}

throw new Error('짝수가 아닙니다.');

class MyError extends Error {
  constructor(value, ...params) {
    super(...params);
    this.value = value;
    this.name = 'MyError';
  }
}

try {
  const even = parseInt(prompt('짝수를 입력하세요'));
  if (even % 2 !== 0) {
    throw new MyError(even, '짝수가 아닙니다.');
  }
} catch (e) {
  if (e instanceof MyError) {
    console.log(e.value);
  }
}

const p = new Promise((resolve) => {
  const even = parseInt(prompt('짝수를 입력하세요'));
  if (even % 2 !== 0) {
    throw new Error('짝수가 아닙니다.');
  } else {
    resolve(even);
  }
});

p.then(
  (even) => {
    return '짝수입니다.';
  },
  (e) => {
    return e.message;
  },
).then(alert);

p.then((even) => {
  return '짝수입니다.';
})
  .catch((e) => {
    return e.message;
  })
  .then(alert);

<script type="module" src="index.mjs"></script>

// 기존
const x = 20;
let answer1;
if (x > 10) {
  answer1 = 'greater than 10';
} else {
  answer1 = 'less than 10';
}

// 축약기법
const answer2 = x > 10 ? 'greater than 10' : 'less than 10';
const answer3 = x > 10 ? ' greater than 10' : x;

// 기존
if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
  let variable2 = variable1;
}

// 축약기법
const variable3 = null;
const variable4 = variable3 || 'new';

let variable5;
let variable6 = variable5 || '';
console.log(variable6 === ''); // true

variable5 = 'foo';
variable6 = variable5 || '';
console.log(variable6); // foo

// 기존
let x;
let y;
let z = 3;

// 축약기법
let x,
  y,
  z = 3;

// 기존
if (likeJavaScript === true) {
}

// 축약기법
if (likeJavaScript) {
}

// 기존
let a;
if (a !== true) {
  // 코드 실행...
}

// 축약기법
let a;
if (!a) {
  // 코드실행...
}

// 기존
for (let i = 0; i < allImgs.length; i++) {}

// 축약기법
for (let index of allImgs) {
}

// Array.forEach 축약기법
function logArrayElements(element, index, array) {
  console.log('a[' + index + '] = ' + element);
}
[2, 5, 9].forEach(logArrayElements);
// logs:
// a[0] = 2
// a[1] = 5
// a[2] = 9

// 기존
let dbHost;
if (process.env.DB_HOST) {
  dbHost = process.env.DB_HOST;
} else {
  dbHost = 'localhost';
}

// 축약기법
const dbHost = process.env.DB_HOST || 'localhost';

// 기존
for (let i = 0; i < 10000; i++) {}

// 축약기법
for (let i = 0; i < 1e7; i++) {}

// All the below will evaluate to true
console.log(1 === 1);
console.log(1e1 === 10);
console.log(1e2 === 100);
console.log(1e3 === 1000);
console.log(1e4 === 10000);
console.log(1e5 === 100000);

// 기존
const obj = { x: x, y: y };

// 축약기법
const obj = { x, y };

// 기존
function sayHello(name) {
  console.log('Hello', name);
}
setTimeout(function () {
  console.log('Loaded');
}, 2000);
list.forEach(function (item) {
  console.log(item);
});

// 축약기법
sayHello = (name) => console.log('Hello', name);
setTimeout(() => console.log('Loaded'), 2000);
list.forEach((item) => console.log(item));

// 기존
function calcCircumference(diameter) {
	return Math.PI * diameter;
}

// 축약기법
calcCircumference = diameter => (
  Math.PI * diameter;
)

// 기존
function volume(l, w, h) {
  if (w === undefined) w = 3;
  if (h === undefined) h = 4;
  return l * w * h;
}

// 축약기법
volume = (l, w = 3, h = 4) => l * w * h;
volume(2); //output: 24

// 기존
const welcome = 'You have logged in as ' + first + ' ' + last + '.';
const db = 'http://' + host + ':' + port + '/' + database;

// 축약기법
const welcome = `You have logged in as ${first} ${last}`;
const db = `http://${host}:${port}/${database}`;

// 기존
const observable = require('mobx/observable');
const action = require('mobx/action');
const runInAction = require('mobx/runInAction');

const store = this.props.store;
const form = this.props.form;
const loading = this.props.loading;
const errors = this.props.errors;
const entity = this.props.entity;

// 축약기법
import { observable, action, runInAction } from 'mobx';

const { store, form, loading, errors, entity } = this.props;

// 축약기법으로 커스텀 변수명을 지정할 수 있습니다
const { store, form, loading, errors, entity: contact } = this.props;

// 기존
const lorem =
  'Lorem ipsum dolor sit amet, consectetur\n\t' +
  'adipisicing elit, sed do eiusmod tempor incididunt\n\t' +
  'ut labore et dolore magna aliqua. Ut enim ad minim\n\t' +
  'veniam, quis nostrud exercitation ullamco laboris\n\t' +
  'nisi ut aliquip ex ea commodo consequat. Duis aute\n\t' +
  'irure dolor in reprehenderit in voluptate velit esse.\n\t';

// 축약기법
const lorem = `Lorem ipsum dolor sit amet, consectetur
    adipisicing elit, sed do eiusmod tempor incididunt
    ut labore et dolore magna aliqua. Ut enim ad minim
    veniam, quis nostrud exercitation ullamco laboris
    nisi ut aliquip ex ea commodo consequat. Duis aute
    irure dolor in reprehenderit in voluptate velit esse.`;

// 기존
// joining arrays
const odd = [1, 3, 5];
const nums = [2, 4, 6].concat(odd);

// cloning arrays
const arr = [1, 2, 3, 4];
const arr2 = arr.slice();

// 축약기법
// joining arrays
const odd = [1, 3, 5];
const nums = [2, 4, 6, ...odd];
console.log(nums); // [ 2, 4, 6, 1, 3, 5 ]

// cloning arrays
const arr = [1, 2, 3, 4];
const arr2 = [...arr];

// concat()함수와는 다르게 전개 연산자를 이용하면 하나의 배열을 다른 배열의 아무 곳에나 추가할 수 있습니다.
const odd = [1, 3, 5];
const nums = [2, ...odd, 4, 6];

// 전개 연산자는 ES6의 구조화 대입법(destructuring notation)와 함께 사용할 수도 있습니다.
const { a, b, ...z } = { a: 1, b: 2, c: 3, d: 4 };
console.log(a); // 1
console.log(b); // 2
console.log(z); // { c: 3, d: 4 }

// 기존
function foo(bar) {
  if (bar === undefined) {
    throw new Error('Missing parameter!');
  }
  return bar;
}

// 축약기법
mandatory = () => {
  throw new Error('Missing parameter!');
};

foo = (bar = mandatory()) => {
  return bar;
};

const pets = [
  { type: 'Dog', name: 'Max' },
  { type: 'Cat', name: 'Karl' },
  { type: 'Dog', name: 'Tommy' },
];

// 기존
function findDog(name) {
  for (let i = 0; i < pets.length; ++i) {
    if (pets[i].type === 'Dog' && pets[i].name === name) {
      return pets[i];
    }
  }
}
findDog('Tommy');

// 축약기법
pet = pets.find((pet) => pet.type === 'Dog' && pet.name === 'Tommy');
console.log(pet); // { type: 'Dog', name: 'Tommy' }

// 기존
function validate(values) {
  if (!values.first) return false;
  if (!values.last) return false;
  return true;
}

console.log(validate({ first: 'Bruce', last: 'Wayne' })); // true

// 축약기법
// object validation rules (객체로 만든 validation 규칙)
const schema = {
  first: {
    required: true,
  },
  last: {
    required: true,
  },
};

// universal validation function (공통적으로 사용할 수 있는 validation 함수)
const validate = (schema, values) => {
  for (field in schema) {
    if (schema[field].required) {
      if (!values[field]) {
        return false;
      }
    }
  }
  return true;
};

console.log(validate(schema, { first: 'Bruce' })); // false
console.log(validate(schema, { first: 'Bruce', last: 'Wayne' })); // true

// 기존
Math.floor(4.9) === 4; //true

// 축약기법
~~4.9 === 4; //true

const isOfType = (() => {
  // 프로토 타입 없는 일반 객체 생성
  const type = Object.create(null);

  type.null = (x) => x === null;
  type.undefined = (x) => x === undefined;
  // null or undefined
  type.nil = (x) => type.null(x) || type.undefined(x);
  type.string = (x) =>
    !type.nil(x) && (typeof x === 'string' || x instanceof String);
  type.number = (x) =>
    !type.nil(x) &&
    ((!isNaN(x) && isFinite(x) && typeof x === 'number') ||
      x instanceof Number);
  type.boolean = (x) =>
    !type.nil(x) && (typeof x === 'boolean' || x instanceof Boolean);
  type.array = (x) => !type.nil(x) && Array.isArray(x);
  type.object = (x) => ({}.toString.call(x) === '[object Object]');
  type.type = (x, X) => !type.nil(x) && x instanceof X;
  type.set = (x) => type.type(x, Set);
  type.map = (x) => type.type(x, Map);
  type.date = (x) => type.type(x, Date);

  return type;
})();

function isEmpty(x) {
  if (Array.isArray(x) || typeof x === 'string' || x instanceof String) {
    return x.length === 0;
  }

  if (x instanceof Map || x instanceof Set) {
    return x.size === 0;
  }

  if ({}.toString.call(x) === '[object Object]') {
    return Object.keys(x).length === 0;
  }

  return false;
}

const { lstat } = require('fs-extra');

function lastItem(list) {
  if (Array.isArray(list)) {
    return list.slice(-1)[0];
  }

  if (list instanceof Set) {
    return Array.from(list).slice(-1)[0];
  }

  if (list instanceof Map) {
    return Array.from(list.values()).slice(-1)[0];
  }
}

function randomNumber(max = 1, min = 0) {
  if (min >= max) {
    return max;
  }

  return Math.floor(Math.random() * (max - min) + min);
}

// 현재 시간(밀리 초)부터 고유 ID 생성
// 요청할 때마다 1씩 증가합니다.
const uniqueId = () => {
  const id = (function* () {
    let mil = new Date().getTime();

    while (true) yield (mil += 1);
  })();

  return () => id.next().value;
};

// 제공된 값 또는 0에서 고유 ID 생성
const uniqueIncrementingId = ((lastId = 0) => {
  const id = (function* () {
    let numb = lastId;

    while (true) yield (numb += 1);
  })();

  return (length = 12) => `${id.next().value}`.padStart(length, '0');
})();

// 문자와 숫자로 고유 ID 생성
const uniqueAlphaNumericId = (() => {
  const heyStack = '0123456789abcdefghijklmnopqrstuvwxyz';
  const randomInt = () =>
    Math.floor(Math.random() * Math.floor(heyStack.length));

  return (length = 24) =>
    Array.from({ length }, () => heyStack[randomInt()]).join('');
})();

function range(maxOrStart, end = null, step = null) {
  if (!end) {
    return Array.from({ length: maxOrStart }, (_, i) => i);
  }

  if (end <= maxOrStart) {
    return [];
  }

  if (step !== null) {
    return Array.from(
      { length: Math.ceil((end - maxOrStart) / step) },
      (_, i) => i * step + maxOrStart,
    );
  }

  return Array.from(
    { length: Math.ceil(end - maxOrStart) },
    (_, i) => i + maxOrStart,
  );
}

const obj = {
  name: 'Yuni-Q',
  family: [{ name: 'Yuni-Q' }],
  something: [12, 3, 45],
  mothod() {
    return 'i am ignored';
  },
  set: new Set([1, 4, 5]),
  map: new Map([
    [1, 4],
    [5, 10],
  ]),
  symb: Symbol('test'),
};

const replacer = (key, val) => {
  if (typeof val === 'symbol') {
    return val.toString();
  }

  if (val instanceof Set) {
    return Array.from(val);
  }

  if (val instanceof Map) {
    return Array.from(val.entries());
  }

  if (typeof val === 'function') {
    return val.toString();
  }

  return val;
};

console.log(JSON.stringify(obj));
// {"name":"Yuni-Q","family":[{"name":"Yuni-Q"}],"something":[12,3,45],"set":{},"map":{}}
console.log(JSON.stringify(obj, null, 4));
// {
//   "name": "Yuni-Q",
//   "family": [
//       {
//           "name": "Yuni-Q"
//       }
//   ],
//   "something": [
//       12,
//       3,
//       45
//   ],
//   "set": {},
//   "map": {}
// }
console.log(JSON.stringify(obj, replacer));
// {"name":"Yuni-Q","family":[{"name":"Yuni-Q"}],"something":[12,3,45],"mothod":"mothod() {\n\t\treturn 'i am ignored';\n\t}","set":[1,4,5],"map":[[1,4],[5,10]],"symb":"Symbol(test)"}

const asyncSequentializer = (() => {
  const toPromise = (x) => {
    if (x instanceof Promise) return x;

    if (typeof x === 'function') {
      return (async () => await x())();
    }

    return Promise.resolve(x);
  };

  return (list) => {
    const results = [];

    return list
      .reduce((lastPromise, currentPromise) => {
        return lastPromise.then((res) => {
          results.push(res);
          return toPromise(currentPromise);
        });
      }, toPromise(list.shift()))
      .then((res) => Promise.resolve([...results, res]));
  };
})();

const { await } = require('signale');

async function poll(fn, validate, interval = 2500) {
	const resolver = async (resolve, reject) => {
		try {
			const result = await fn();
			const valid = validate(result);

			if (valid === true) {
				resolver(result);
			} else if (valid === false) {
				setTimeout(resolver, interval, resolve, reject);
			}
		} catch (e) {
			reject(e);
		}
	};

	return new Promise(resolver);
}

const prom1 = Promise.reject(12);
const prom2 = Promise.resolve(28);
const prom3 = Promise.resolve(48);
const prom4 = Promise.reject('error');

Promise.all([prom1, prom2, prom3, prom4])
  .then((res) => console.log('all', res))
  .catch((err) => console.log('all failed', err));
// all failed 12

Promise.allSettled([prom1, prom2, prom3, prom4])
  .then((res) => console.log('allSettled', res))
  .catch((err) => console.log('allSettled failed', JSON.stringify(err)));
// allSettled, [{status: "rejected", reason: 12}, {status: "fulfilled", value: 28}, {status: "fulfilled", value: 48}, {reason: 'error', status: 'rejected'}
Promise.any([prom1, prom2, prom3, prom4])
  .then((res) => console.log('any', res))
  .catch((err) => console.log('any failed', err));
// any 28
Promise.race([prom1, prom2, prom3, prom4])
  .then((res) => console.log('race', res))
  .catch((err) => console.log('race failed', err));
// race failed 12

const d = async () => {
  try {
    const a = await Promise.all([b(), await c()]);
    // argument가 먼저 판별되어야 함수(Promise.all)가 실행됩니다.
    // b는 실행이 되었고 argument await c가 판별 중 에러가 발생하여 Promise.all 실행되지 못해서 b의 Rejection을 Promise.all이 해결해주지 못함.
    // 14까지는 Warning(UnhandledPromiseRejectionWarning) 15부터는 Error로 처리되어 UnhandledPromiseRejection가 발생한다.
    // ++a, a++과 같은 연산의 우선순위, 비동기문맥 동기문맥이 어떻게 흘러가는지를 알 수 있는 좋은 예제이다.

    // 위 코드는 사실 아래의 코드와 같은게 된다(Promise.all은 실행되지 못했으니...)
    // b();
    // await c();

    console.trace(a, 5);
  } catch (e) {
    console.error({ e });
    console.error(6);
  }
};

const b = () =>
  new Promise((resolve, reject) => {
    console.trace(1);
    setTimeout(() => {
      console.trace(2);
      reject('b');
    }, 2000);
  });
const c = () =>
  new Promise((resolve, reject) => {
    console.trace(3);
    setTimeout(() => {
      console.trace(4);
      reject('c');
    }, 1000);
  });

d();

const array = [12, 24, 48];

const swapOldWay = (arr, i, j) => {
  const arrayCopy = [...arr];

  let temp = arrayCopy[i];
  arrayCopy[i] = arrayCopy[j];
  arrayCopy[j] = temp;

  return arrayCopy;
};

const swapNewWay = (arr, i, j) => {
  const arrayCopy = [...arr];

  [arrayCopy[i], arrayCopy[j]] = [arrayCopy[j], arrayCopy[i]];

  return arrayCopy;
};

const condition = true;

const sample = {
  someProperty: 'some value',
  ...(!!condition ? { newProperty: 'value' } : {}),
};

const property = 'newValidProp';

const sample = {
  someProperty: 'some value',
  [`${property}`]: 'value',
};

const sample = {
	prop: 'value',
};

console.log('prop' in sample); // true
console.log('toString' in sample); // true

console.log(sample.hasOwnProperty('prop')); // true
console.log(sample.hasOwnProperty('toString'); // false

const numberArrays = [
  undefined,
  Infinity,
  12,
  NaN,
  false,
  5,
  7,
  null,
  12,
  false,
  5,
  undefined,
  89,
  9,
  null,
  Infinity,
  5,
  NaN,
];
const objArrays = [{ id: 1 }, { id: 4 }, { id: 1 }, { id: 5 }, { id: 4 }];
console.log(Array.from(new Set(numberArrays))); // 중복 제거
console.log(Array.from(new Set(objArrays))); // 중복 제거 되지 않음

const idSet = new Set();
console.log(
  objArrays.filter((obj) => {
    const existingId = idSet.has(obj.id);
    idSet.add(obj.id);

    return !existingId;
  }),
);

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

for (const number of numbers) {
  if (number % 2 === 0) {
    continue;
  }

  if (number > 5) {
    break;
  }

  console.log(number);
}

numbers.some((number) => {
  if (number % 2 === 0) {
    return false;
  }

  if (number > 5) {
    return true;
  }

  console.log(number);
});

const obj = {
  dt: { name: 'sample' },
};

function destructuring({ dt: data }) {
  console.log(data);
}

function defaultValues({ dt: { name, id = 10 } }) {
  console.log(name, id);
}

destructuring(obj); // { name: 'sample' }
defaultValues(obj); // sample, 10

const obj = {
  data: {
    container: {
      name: {
        value: 'sample',
      },
      int: {
        value: 0,
      },
    },
  },
};

console.log(obj.data.container.int.value || 'no int value'); // 'no int value'
console.log(obj.data.container.int.value ?? 'no int value'); // 0

console.log(obj.data.wrapper.name || 'no name'); // Uncaught TypeError: Cannot read property 'name' of undefined
console.log(
  (obj && obj.data && obj.data.wrapper && obj.data.wrapper.name) || 'no name',
); // no name
console.log(obj?.data?.wrapper?.name || 'no name'); // no name

function Parent() {
  const privateProps = 12;
  const privateMethod = () => privateProps + 10;

  this.publicMethod = (x = 0) => privateMethod() + x;
  this.publicProp = 10;
}

class Child extends Parent {
  myProp = 20;
}

const child = new Child();

console.log(child.myProp); // 20
console.log(child.publicProp); // 10
console.log(child.publicMethod(10)); // 32
console.log(child.privateProps); // undefined0
console.log(child.privateMethod()); // Uncaught TypeError: child.privateMethod is not a function

function Employee() {
  this.profession = 'Software Engineer';
  this.salary = '$150000';
}

function DeveloperFreelancer() {
  this.programmingLaguages = ['Javasciprt', 'Python', 'Swift'];
  this.avgPerHour = '$100';
}

function Engineer(name) {
  this.name = name;
  this.freelancer = {};

  Employee.apply(this);
  DeveloperFreelancer.apply(this.freelancer);
}

const yuni = new Engineer('yuni');

console.log(yuni.name); // yuni
console.log(yuni.profession); // Software Engineer
console.log(yuni.salary); // $150000
console.log(yuni.freelancer); // {programmingLaguages: ['Javasciprt', 'Python', 'Swift'], avgPerHour: "$100"}

function forEath(list, callback) {
  let entries;
  if (list instanceof Map || list instanceof Set) {
    list = Array.from(list);
  }
  entries = Object.entries(list);
  const len = entries.length;

  for (i = 0; i < len; i++) {
    const res = callback(entries[i][1], entries[i][0], list);

    if (res === true) break;
  }
}

forEath([1, 2, 3], console.log);
// 1 "0" [1,2,3]
// 2 "1" [1,2,3]
// 3 "2" [1,2,3]

forEath(new Set([1, 2, 3]), console.log);
// 1 "0" [1, 2, 3]
// 1 "1" [1, 2, 3]
// 1 "2" [1, 2, 3]
forEath(
  new Map([
    [1, 1],
    [2, 2],
    [3, 3],
  ]),
  console.log,
);
// [1,2], "0", [[1,1],[2,2],[3,3]]
forEath('123', console.log);
// 1 0 123
// 2 1 123
// 3 2 123
forEath({ a: 1, b: 2, c: 3 }, console.log);
// 1 "a" {a:1,b:2,c:3}
// 2 "b" {a:1,b:2,c:3}
// 3 "c" {a:1,b:2,c:3}

function required(argName = 'param') {
  throw new Error(`"${argName}" is required`);
}

function iHaveRequiredOptions(arg1 = required('arg1'), arg2 = 10) {
  console.log(arg1, arg2);
}

iHaveRequiredOptions(); // Uncaught Error: "arg1" is required
iHaveRequiredOptions(12); // 12, 10
iHaveRequiredOptions(12, 24); // 12, 24
iHaveRequiredOptions(undefined, 24); // Uncaught Error: "arg1" is required

class Service {
  name = 'service';
}

const service = (function () {
  const service = new Service();

  return () => service;
})();

const element = (function () {
  const element = document.createElement('DIV');

  return () => element;
})();

const deepClone = (obj) => {
  let clone = obj;
  if (obj && typeof obj === 'object') {
    clone = new obj.constructor();

    Object.getOwnPropertyNames(obj).forEach(
      (prop) => (clone[prop] = deepClone(obj[prop])),
    );
  }

  return clone;
};

const deepFreeze = (obj) => {
  if (obj && typeof obj === 'object') {
    if (!Object.isFrozen(obj))
      Object.getOwnPropertyNames(obj).forEach((prop) => deepFreeze(obj[prop]));
  }

  return obj;
};