③Arrayメソッド「Vol.6 スプレッドシートの操作（実践編） ：ノンプロ研初心者向けプログラミング講座【GASコース第9期】

5年ぶりくらいにスタバのフラペチーノを飲んだ。大きさの言い方が店（ドトール、スターバックス、コメダ珈琲etc.）によって違うので、どの店でも1番小さいやつ、とか、1番大きいやつ、という雑な頼み方をしている。

↓の続きです。

演習６－03　flatメソッド

演習にやや手を加えたのが上記のコードとその結果。
flat前は2次元だが、flatにしたことで次元が一つ減る。

リファレンスを見てみよう。

Array.prototype.flat() - JavaScript | MDN

引数で深さを指定できる。

Infinity

flatメソッドは引数にInfinityをとると、元の配列が何次元あっても、１次元にしてくれる#ノンプロ研 #初級講座

— 山口征啓@機械学習中 (@ID_HelpDesk) June 11, 2021

n次元から直で1次元にする技：Infinity
名前がかっこよすぎる。

使いどころはよくわかってないけど、威力はちょっとわかった気がする。

flatについては、名言botをindex of　でどうにかしたときにも使っていた。

ここでは、getRangeで範囲をガッと取って、その範囲の値をgetValues()でゴソッっと取っていた。そして、その値は二次元配列なので、flatにしていたというわけだ。flatにして、やっとindex ofで数えていた。

演習６－04　宿題

以下のような二次元配列があるとします。
[['Bob'], ['Tom'], ['Ivy'], ...]
例えば「Bob」などの文字列を引数として渡すと、それが存在するかどうかを判定してブール値で返す関数を作成してください。

おおう、また関数だぜ。関数お好きですね！
演習6-02にflatメソッドを噛ます、という考えで合ってるかしらん？

//01　ノーマル形
function myFunction6_04_01() {
 const members = [['Bob'], ['Tom'], ['Ivy'], ['Jay']];
 const flatmembersArray = members.flat();
 console.log(returnboole(flatmembersArray, 'Bob')); //true
 console.log(returnboole(flatmembersArray, 'Dan')); //false
}
function returnboole(arraymember, name) {
 return arraymember.includes(name);
}


//02　アロー基本形
function myFunction6_04_02() {
 const returnbooleArrow01 = (arraymember, name) => {
   return arraymember.includes(name);
 }
 const members = [['Bob'], ['Tom'], ['Ivy'], ['Jay']];
 const flatmembersArray = members.flat();
 console.log(returnbooleArrow01(flatmembersArray, 'Bob')); //true
 console.log(returnbooleArrow01(flatmembersArray, 'Dan')); //false
}


//03　アロー省略形　戻り値が1つなので、｛｝とreturn省略OK
function myFunction6_04_03() {
 const returnbooleArrow02 = (arraymember, name) => arraymember.includes(name);
 
 const members = [['Bob'], ['Tom'], ['Ivy'], ['Jay']];
 const flatmembersArray = members.flat();
 console.log(returnbooleArrow02(flatmembersArray, 'Bob')); //true
 console.log(returnbooleArrow02(flatmembersArray, 'Dan')); //false
}

関数側でflat噛ますのか？

 ​
//04　関数側でflat
function myFunction6_04_04() {
 const members = [['Bob'], ['Tom'], ['Ivy'], ['Jay']];
 console.log(returnBooleFlat(members, 'Bob')); //true
 console.log(returnBooleFlat(members, 'Dan')); //false
}
function returnBooleFlat(arraymember, name) {
 return arraymember.flat().includes(name);
}

//05　関数側でflatしたものをアロー省略形
function myFunction6_04_05() {
 const returnBooleFlatArrow = (arraymember, name) => arraymember.flat().includes(name);
 const members = [['Bob'], ['Tom'], ['Ivy'], ['Jay']];
 console.log(returnBooleFlatArrow(members, 'Bob')); //true
 console.log(returnBooleFlatArrow(members, 'Dan')); //false
}

ここでは、flatの引数は指定せず、デフォルトで1次元減らす、ということにした。
アローにしたときに、アローが先に来て、その後に処理が来る、という順番、書き方に慣れてきたかなあ。すぐ忘れそう。

演習６－05　pushメソッド　shiftメソッド（破壊的メソッド）

演習のコードにpopを加えたのだ上記の図。
pushメソッドで配列の最後にJayが加わり、
shiftメソッドで配列の先頭要素（ここではヘッダにあたる['name', 'age', 'favorite']）が抜き出された＝消えた。

出来心でpopって何かなってやってみたら、配列の最後、Jayが消された。Jayがpopされた...。

Array.prototype.push() - JavaScript | MDN

Array.prototype.shift() - JavaScript | MDN

Array.prototype.pop() - JavaScript | MDN

これらは、破壊的メソッドと呼ばれ、操作するオブジェクトに変更を加えるメソッドとなる。

関連ツイート

shiftメソッドは首切りメソッド。
配列から最初の行を切り取ってしまう

実は戻り値があって、削除した最初の行（首）を返してくれる。

これを別の関数にいれておくと、後から配列（体）に戻せる。つまり首をつなげられる。#ノンプロ研 #初級講座

— 山口征啓@機械学習中 (@ID_HelpDesk) June 11, 2021

pushメソッドも破壊的メソッドなので、元のオブジェクトを保存したいときにはコピーして置かないといけないが　単純に代入すると参照渡しになるので、コピーしたことにならない。

きちんとコピーするには concateするか、sliceするか、スプレッド構文使うか#ノンプロ研 #初級講座

— 山口征啓@機械学習中 (@ID_HelpDesk) June 11, 2021

このあたり、スプシのヘッダの扱いということで、実戦的。

#ノンプロ研 #初級講座
複製の仕方はスライドにないが、さらっと講義が！

const members2 = member のようにしても、お互いmemberの中身を共有しているので、どちらかにpushすると両方に反映される。

— a03⛅ (@a03) June 11, 2021

#ノンプロ研 #初級講座
・こんかっと
・slice 若干わかりづらい？
・spread構文　[...members]

— a03⛅ (@a03) June 11, 2021

破壊的メソッドに対処するための複製の仕方は次のnoteで。