Serials Javascript Style Guide – Arrays - Hello, world! I'm Viet NT

Arrays

4.1 Literals

Khi tạo mới array nên sử dụng literal syntax. eslint: no-array-constructor

// bad
const items = new Array();

// good
const items = [];

4.2 Push

Sử dụng Array#push thay vì gán trực tiếp các phần tử vào array.

const someStack = [];

// bad
someStack[someStack.length] = 'abracadabra';

// good
someStack.push('abracadabra');

4.3 Array spreads

Sử dụng array spreads ... để sao chép arrays.

// bad
const len = items.length;
const itemsCopy = [];
let i;

for (i = 0; i < len; i += 1) {
  itemsCopy[i] = items[i];
}

// good
const itemsCopy = [...items];

4.4 From iterable

Để chuyển 1 iterable object sang array, sử dụng spreads ... thay vì Array.from.

const foo = document.querySelectorAll('.foo');

// good
const nodes = Array.from(foo);

// best
const nodes = [...foo];

4.5 From array like

Sử dụng Array.from để chuyển đổi 1 array-like object sang 1 array.

const arrLike = { 0: 'foo', 1: 'bar', 2: 'baz', length: 3 };

// bad
const arr = Array.prototype.slice.call(arrLike);

// good
const arr = Array.from(arrLike);

4.6 Mapping

Sử dụng Array.from thay vì spread ... để mapping thông qua iterables, vì để tránh tạo ra intermediate array.

// bad
const baz = [...foo].map(bar);

// good
const baz = Array.from(foo, bar);

4.7 Callback return

Hãy sử dụng lệnh return trong hàm callback của array. Nó có thể được bỏ qua nếu thân hàm trả về với 1 câu lệnh đơn. Tham khảo: 8.2. eslint: array-callback-return

// good
[1, 2, 3].map((x) => {
  const y = x + 1;
  return x * y;
});

// good
[1, 2, 3].map(x => x + 1);

// bad - no returned value means `acc` becomes undefined after the first iteration
[[0, 1], [2, 3], [4, 5]].reduce((acc, item, index) => {
  const flatten = acc.concat(item);
});

// good
[[0, 1], [2, 3], [4, 5]].reduce((acc, item, index) => {
  const flatten = acc.concat(item);
  return flatten;
});

// bad
inbox.filter((msg) => {
  const { subject, author } = msg;
  if (subject === 'Mockingbird') {
    return author === 'Harper Lee';
  } else {
    return false;
  }
});

// good
inbox.filter((msg) => {
  const { subject, author } = msg;
  if (subject === 'Mockingbird') {
    return author === 'Harper Lee';
  }

  return false;
});

4.8 Bracket newline

Sử dụng line breaks sau khi mở và đóng ngoặc array, nếu array có nhiều dòng.

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

const objectInArray = [{
  id: 1,
}, {
  id: 2,
}];

const numberInArray = [
  1, 2,
];

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

const objectInArray = [
  {
    id: 1,
  },
  {
    id: 2,
  },
];

const numberInArray = [
  1,
  2,
];