console.log(Math.max(5,2,14,9)); // 14

// このように書き換えられる
const data = [5,2,14,9];
console.log(Math.max(...data)); // 14

console.log(Math.max(data)); // NaN

const ary = ['Pen', 'Pineapple'];
const myAry = [...ary];

const ary = ['Pen', 'Pineapple'];

// ケース1 : そのまま代入（こんな事をする必要はないと思うが...）
const myAry0 = ary;
// ケース2 : スプレッド演算子で代入
const myAry1 = [...ary];

// どちらも中身は同じになる
console.log(myAry0); // [ 'Pen', 'Pineapple' ]
console.log(myAry1); // [ 'Pen', 'Pineapple' ]

/*
ただし、スプレッド演算子で改めて作ったものは、値としては同じだが、
インスタンスが別なので、比較するとfalse が返ってくるので、
中の要素を比較したい場合はループして配列の要素をそれぞれ比較するか
jsonなどに変換して比較する必要がある
*/
console.log(ary === myAry0);    // true
console.log(ary === myAry1);    // false

let ary = ['Pen', 'Pineapple'];
let myAry0 = ary;
// myAry0 に 'Applepen' を代入する
myAry0[2] = 'Applepen';

// myAry0 は ['Pen', 'Pineapple', 'Applepen' ] になるが...
console.log(myAry0); 

// ary の方も ['Pen', 'Pineapple', 'Applepen' ] になる。
console.log(ary);

// これは参照しているインスタンスが「同じ」だから

// オブジェクトを持つ配列fruitを作成
const fruits = [
  { 'banana': 100 },
  { 'cherry': 200 }
];

// fruitsをmyFruitsにスプレッド演算子を使って複製
const myFruits = [...fruits];

// 元の配列の値を操作
fruits["0"].banana = 300;
// fruitsを複製したmyFruitの値も変更される
console.log(myFruits); 

// 以下の場合４つめの項目にdata2が配列のまま入る
let data1 = [1, 2, 3];
let data2 = ['d', 'e', 'f'];
data1.push(data2); 
console.log(data1); // [ 1, 2, 3, [ 'd', 'e', 'f' ] ]

// スプレッド演算子で展開して結合する場合
data1 = [1, 2, 3];
data2 = ['d', 'e', 'f'];
data1.push(...data2);
console.log(data1);    // [1,2,3,"d","e","f"]

let data1 = [1, 2, 3];
let data2 = ['d', 'e', 'f'];
data1.unshift(...data2);
console.log(data1);   // [ 'd', 'e', 'f', 1, 2, 3 ]

let data1 = [1, 2, 3];
let data2 = ['d', 'e', 'f'];

const merged = ['あ', ...data1, 'い', ...data2, 'う'];
console.log(merged);  // [ 'あ', 1,  2,  3, 'い', 'd', 'e', 'f', 'う' ]

let [a, b, ...other] = [1, 2, 3, 4, 5];

console.log(a);        // 1
console.log(b);        // 2
console.log(other);    // [3, 4, 5]

const word = 'JavaScript';
const converted = [...word];

console.log(converted); // ["J","a","v","a","S","c","r","i","p","t" ]

const word = 'Java';

// 一文字づつループ操作する。
[...word].forEach(c => console.log(c)); 

// 結果 ↓
// J
// a
// v
// a

// - 文字列を反転する
// 配列に変換し右から左へたたみ込む。
const reversed = [...word].reduceRight((p, c) => p + c); 
console.log(reversed); // avaJ

const data = ['a', 'b', 'c', 'a', 'b', 'd'];
const dist = [...(new Set(data))];

console.log(dist);    // ["a","b","c","d"]

const sum = (...nums) => nums.reduce((p, c) => p + c);

console.log(sum(1, 2, 3, 4, 5));     // 15

const elems = document.getElementByClassName('checkboxClassName');

// 取得した **NodeList** から、**checked** プロパティが **true** かつ **class** プロパティに **'foo'** が含まれているものを抽出します。
const filtered = [...elems].filter(el => el.checked && el.classList.contains('foo'));

const setCheckBox = (name, ...values) => {
	// 引数でうけとったname属性の要素を取得
	const elems = document.getElementsByName(name);
	// ループしながら一個の要素 el に values で受け取った項目を含んでいたらチェックする
	elems.forEach(el => el.checked = values.includes(el.value));
}
// value が 'apple' 、'banana' のチェックボックスをチェックします。
setCheckBox('fruits', 'apple', 'banana');