トップ JavaScriptに関する質問 reduceで配列を組み替えたいのですが、上手く行きません。

編集履歴

回答編集履歴

テキスト修正

2019/10/14 22:27

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -20,7 +20,7 @@
 ```
-の引数、 table と item に型指定を追加して
+の、reduceに与えている関数の引数 `table` と `item` に型指定を追加して
 ```typescript
@@ -28,11 +28,7 @@
 ```
-としてみるといかがでしょうか？
+としてみるといかがでしょうか？次に、
-次に、
@@ -56,8 +52,6 @@
 なお上記のうち、3, 4, 5, 6 は、reduce を使わないコードになっています。

テキスト修正

2019/10/14 22:27

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -200,7 +200,7 @@
-これまでの3つとは異なり、joinで要素を結合した文字列を作り、正規表現でreplaceしてから、 split, map で配列に戻すコードです。
+これまでの3つとは異なり、文字列を経由した方法です。joinで要素を `#` で結合した文字列を作り、正規表現によるreplaceによって、一組になる要素を区切る `#` を `_` に置換してから、 split, map で、望む配列にするコードです。

テキスト修正

2019/10/14 17:44

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -168,15 +168,17 @@
-const ary2: StrAry[] = ary.map((e: string, i: number, self: StrAry) =>
+const ary2: StrAry[] = ary.map((str: string, i: number, self: StrAry) =>
-                         i % 2 ? null : (i+1 < self.length ? [e, self[i+1]] : [e])
+                         i % 2 ? null : (i+1 < self.length ? [str, self[i+1]] : [str])
-                       ).filter(e => e)
+                       ).filter((a: StrAry | null) => a)
-console.log(ary2)
+console.log(ary2)

テキスト修正

2019/10/14 17:34

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -66,31 +66,31 @@
-まずはじめに、yuki_90453さんがご質問に挙げられているコードに近いものを挙げます。
+まずはじめに、yuki_90453さんがご質問に挙げられているコードに近いものを挙げます。（なお、以下のコードでは、ご質問のコードでは `table` という変数を、短い変数名の `t` にしています。）
-```typescript
+```typescript
-type StrAry = string[]
+type StrAry = string[]
-const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
-const ary2: StrAry[] = ary.reduce((a: StrAry[], str: string, i: number) => {
+const ary2: StrAry[] = ary.reduce((t: StrAry[], str: string, i: number) => {
   if (i % 2 === 0) {
-    return [...a, [str]]
+    return [...t, [str]]
   }
-  a[a.length - 1].push(str)
+  t[t.length - 1].push(str)
-  return a
+  return t
 }, [])
@@ -130,9 +130,9 @@
-const ary2: StrAry[] = ary.reduce((a: StrAry[], str: string, i: number) =>
+const ary2: StrAry[] = ary.reduce((t: StrAry[], str: string, i: number) =>
-  i % 2 ? [...a.slice(0, a.length-1), [a[a.length-1][0], str]] : [...a, [str]]
+  i % 2 ? [...t.slice(0, t.length-1), [t[t.length-1][0], str]] : [...t, [str]]
 , [])

テキスト修正

2019/10/14 17:31

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -2,7 +2,45 @@
+まず、
+> ① reduceメソッドの 戻り値の累積変数の型を指定方法はありますでしょうか？
+> 上記のコードの末尾 [[]]の事です。
+については、
+```javascript
+sku_list.reduce((table, item) => {
+```
+の引数、 table と item に型指定を追加して
+```typescript
+sku_list.reduce((table: string[][], item: string) => {
+```
+としてみるといかがでしょうか？
+次に、
+> ② reduceメソッドを使った方がわかりやすいと聞いて作ってみたのですが、私のコードは非常に見づらくわかりにくいです。わかりやすいように書きたいのですが、ご指摘頂けないでしょうか？
-この回答では、以下の６つのコードを順に挙げます。
+については、以下の６つのコード例を順に挙げます。
 1. yuki_90453さんがご質問に挙げられているコードに近いもの(reduceを使用）
@@ -20,15 +58,7 @@
-上記のうち、3, 4, 5, 6 は、ご質問に
-> ② reduceメソッドを使った方がわかりやすいと聞いて作ってみたのですが、私のコードは非常に見づらくわかりにくいです。わかりやすいように書きたいのですが、ご指摘頂けないでしょうか？
-とあったことにお応えして、 reduce を使わないコードになっています。
+なお上記のうち、3, 4, 5, 6 は、reduce を使わないコードになっています。

テキスト修正

2019/10/14 17:02

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -248,7 +248,7 @@
-上記のコード例 5  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作しました。
+上記のコード例 5  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様の関数`myChunk`を(再帰を使って、)自作しました。
 ```typescript

テキスト修正

2019/10/14 16:40

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -248,7 +248,7 @@
-上記のコード例 5  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作します。
+上記のコード例 5  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作しました。
 ```typescript

テキスト修正

2019/10/14 16:38

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -168,7 +168,7 @@
-これまでの3つとは異なり、joinによる文字列を経由して、正規表現によるreplace および split, map を使うコードです。
+これまでの3つとは異なり、joinで要素を結合した文字列を作り、正規表現でreplaceしてから、 split, map で配列に戻すコードです。

テキスト修正

2019/10/14 16:35

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -8,13 +8,13 @@
 2. 上記 1. の reduceに与える関数の、コード行を減らしたもの
+3. reduce の替わりに、map と filter を使用する例
+4. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
-3. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
+5. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
-4. 上記 3. の _.chunk と同様な関数を自作
+6. 上記 5. の _.chunk と同様な関数を自作
-5. reduce の替わりに、map と filter を使用する例
-6. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
@@ -36,6 +36,10 @@
+まずはじめに、yuki_90453さんがご質問に挙げられているコードに近いものを挙げます。
 ```typescript
 type StrAry = string[]
@@ -114,15 +118,105 @@
-上記のコードで、reduce を使って一度にやろうとしていることを、後述のコード例 5 では、map と filter の二段階にすることで、若干、読みやすくしています。
 ### コード例 3
+上記のコード例 2 で、reduce で一度にやろうとしていることを、map と filter の二段階を踏むコードです。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = ary.map((e: string, i: number, self: StrAry) =>
+                         i % 2 ? null : (i+1 < self.length ? [e, self[i+1]] : [e])
+                       ).filter(e => e)
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012](https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012)
+### コード例 4
+これまでの3つとは異なり、joinによる文字列を経由して、正規表現によるreplace および split, map を使うコードです。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = ary.join('#')
+　　　　　　　　　　　　　　 　 .replace(/([^#]+)#([^#]+)/g, '$1_$2')
+                          .split('#')
+                          .map((s: string) => s.split('_'))
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012](https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012)
+### コード例 5
-lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
+配列やオブジェクトの操作で便利なライブラリlodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
@@ -150,11 +244,11 @@
-### コード例 4
+### コード例 6
-先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作します。
+上記のコード例 5  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作します。
 ```typescript
@@ -204,80 +298,6 @@
-### コード例 5
-先のコード例 2 から考えたコードです。reduce で一度にやらずに、map と filter の二段階を踏むことで、若干、読みやすくなったかと思います。
-```typescript
-type StrAry = string[]
-const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
-const ary2: StrAry[] = ary.map((e: string, i: number, self: StrAry) =>
-                         i % 2 ? null : (i+1 < self.length ? [e, self[i+1]] : [e])
-                       ).filter(e => e)
-console.log(ary2)
-```
-- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012](https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012)
-### コード例 6
-joinによる文字列を経由して、正規表現によるreplace および split, map を使うコードです。
-```typescript
-type StrAry = string[]
-const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
-const ary2: StrAry[] = ary.join('#')
-　　　　　　　　　　　　　　 　 .replace(/([^#]+)#([^#]+)/g, '$1_$2')
-                          .split('#')
-                          .map((s: string) => s.split('_'))
-console.log(ary2)
-```
-- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012](https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012)

テキスト修正

2019/10/14 16:28

投稿

jun68ykt

スコア9058

test CHANGED Viewed

	@@ -114,7 +114,7 @@
114 114
115 115
116 116
117	-
117	+ 上記のコードで、reduce を使って一度にやろうとしていることを、後述のコード例 5 では、map と filter の二段階にすることで、若干、読みやすくしています。
118 118
119 119
120 120

テキスト修正

2019/10/14 16:19

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -10,7 +10,7 @@
 3. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
-4. 再帰を使って、上記 3. の _.chunk と同様な関数を自作
+4. 上記 3. の _.chunk と同様な関数を自作
 5. reduce の替わりに、map と filter を使用する例

テキスト修正

2019/10/14 16:14

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -154,7 +154,7 @@
-再帰を使って、先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を自作します。
+先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を(再帰を使って、)自作します。
 ```typescript

テキスト修正

2019/10/14 16:11

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -208,7 +208,7 @@
-先のコード例 2 から考えたコードです。reduce で一度にやらずに、map と filter を使うことで、若干、読みやすくなったかと思います。
+先のコード例 2 から考えたコードです。reduce で一度にやらずに、map と filter の二段階を踏むことで、若干、読みやすくなったかと思います。

テキスト修正

2019/10/14 16:09

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -208,7 +208,7 @@
-コード例 1 から考えたコードです。reduce の替わりに、map と filter を使います。
+先のコード例 2 から考えたコードです。reduce で一度にやらずに、map と filter を使うことで、若干、読みやすくなったかと思います。

テキスト修正

2019/10/14 16:08

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -12,7 +12,7 @@
 4. 再帰を使って、上記 3. の _.chunk と同様な関数を自作
-5. reduce も lodash も使わない例(map と filter を使用)
+5. reduce の替わりに、map と filter を使用する例
 6. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
@@ -208,7 +208,7 @@
-reduceを使わない、かつ、 lodash も使わない案も挙げておきます。mapとfilterを使います。
+コード例 1 から考えたコードです。reduce の替わりに、map と filter を使います。

テキスト修正

2019/10/14 16:00

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -10,11 +10,13 @@
 3. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
+4. 再帰を使って、上記 3. の _.chunk と同様な関数を自作
-4. reduce も lodash も使わない例(map と filter を使用)
+5. reduce も lodash も使わない例(map と filter を使用)
-5. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
+6. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
-6. 再帰を使って、上記 3. の _.chunk と同様な関数を自作
@@ -146,10 +148,66 @@
 ### コード例 4
+再帰を使って、先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChunk`を自作します。
+```typescript
+type StrAry = string[]
+const myChunk = (a: StrAry, n: number) => (a.length > 0 ? [a.slice(0, n), ...myChunk(a.slice(n), n)] : [])
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = myChunk(ary, 2)
+console.log(ary2)
+const ary3: StrAry[] = myChunk(ary, 3)
+console.log(ary3)
+const ary4: StrAry[] = myChunk(ary, 4)
+console.log(ary4)
+const ary7: StrAry[] = myChunk(ary, 7)
+console.log(ary7)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012](https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012)
+### コード例 5
 reduceを使わない、かつ、 lodash も使わない案も挙げておきます。mapとfilterを使います。
@@ -182,7 +240,7 @@
-### コード例 5
+### コード例 6
@@ -220,52 +278,6 @@
-### コード例 6
-再帰を使って、先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChank`を自作します。
-```typescript
-type StrAry = string[]
-const myChunk = (a: StrAry, n: number) => (a.length > 0 ? [a.slice(0, n), ...myChunk(a.slice(n), n)] : [])
-const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
-const ary2: StrAry[] = myChunk(ary, 2)
-console.log(ary2)
-const ary3: StrAry[] = myChunk(ary, 3)
-console.log(ary3)
-const ary4: StrAry[] = myChunk(ary, 4)
-console.log(ary4)
-const ary7: StrAry[] = myChunk(ary, 7)
-console.log(ary7)
-```
-- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012](https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012)

テキスト修正

2019/10/14 15:54

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -2,7 +2,7 @@
-この回答では、以下の5つのコードを順に挙げます。
+この回答では、以下の６つのコードを順に挙げます。
 1. yuki_90453さんがご質問に挙げられているコードに近いもの(reduceを使用）

テキスト修正

2019/10/14 15:49

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -14,9 +14,11 @@
 5. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
+6. 再帰を使って、上記 3. の _.chunk と同様な関数を自作
-上記のうち、3, 4, 5 は、ご質問に
+上記のうち、3, 4, 5, 6 は、ご質問に
@@ -218,4 +220,54 @@
+### コード例 6
+再帰を使って、先のコード例 3  で使った、lodash の [_.chunk](https://lodash.com/docs/#chunk) と同様な関数`myChank`を自作します。
+```typescript
+type StrAry = string[]
+const myChunk = (a: StrAry, n: number) => (a.length > 0 ? [a.slice(0, n), ...myChunk(a.slice(n), n)] : [])
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = myChunk(ary, 2)
+console.log(ary2)
+const ary3: StrAry[] = myChunk(ary, 3)
+console.log(ary3)
+const ary4: StrAry[] = myChunk(ary, 4)
+console.log(ary4)
+const ary7: StrAry[] = myChunk(ary, 7)
+console.log(ary7)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012](https://codepen.io/jun68ykt/pen/BaaKzMK?editors=0012)
 以上、参考になれば幸いです。

テキスト修正

2019/10/14 15:45

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -200,7 +200,7 @@
 const ary2: StrAry[] = ary.join('#')
-　　　　　　　　　　　　　　　 .replace(/([^#]+)#([^#]+)/g, '$1_$2')
+　　　　　　　　　　　　　　 　 .replace(/([^#]+)#([^#]+)/g, '$1_$2')
                           .split('#')

テキスト修正

2019/10/14 14:51

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -198,11 +198,19 @@
+const ary2: StrAry[] = ary.join('#')
-const ary2: StrAry[] = ary.join('#').replace(/([^#]+)#([^#]+)/g, '$1_$2').split('#').map((s: string) => s.split('_'))
+　　　　　　　　　　　　　　　 .replace(/([^#]+)#([^#]+)/g, '$1_$2')
+                          .split('#')
+                          .map((s: string) => s.split('_'))
-console.log(ary2)
+console.log(ary2)
 ```

テキスト修正

2019/10/14 14:49

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -16,6 +16,18 @@
+上記のうち、3, 4, 5 は、ご質問に
+> ② reduceメソッドを使った方がわかりやすいと聞いて作ってみたのですが、私のコードは非常に見づらくわかりにくいです。わかりやすいように書きたいのですが、ご指摘頂けないでしょうか？
+とあったことにお応えして、 reduce を使わないコードになっています。
 ### コード例 1
@@ -106,15 +118,7 @@
-ご質問にある、
-> ② reduceメソッドを使った方がわかりやすいと聞いて作ってみたのですが、私のコードは非常に見づらくわかりにくいです。わかりやすいように書きたいのですが、ご指摘頂けないでしょうか？
-に対する一案として、lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
+lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
@@ -144,7 +148,7 @@
-reduceを使わない、かつ、 lodash も使わない案も挙げておきます。
+reduceを使わない、かつ、 lodash も使わない案も挙げておきます。mapとfilterを使います。

テキスト修正

2019/10/14 14:44

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -10,7 +10,7 @@
 3. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
-4. reduce も lodash も使わない例
+4. reduce も lodash も使わない例(map と filter を使用)
 5. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例

テキスト修正

2019/10/14 14:40

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -2,7 +2,7 @@
-この回答では、以下の４つのコードを順に挙げます。
+この回答では、以下の5つのコードを順に挙げます。
 1. yuki_90453さんがご質問に挙げられているコードに近いもの(reduceを使用）
@@ -12,6 +12,8 @@
 4. reduce も lodash も使わない例
+5. 文字列を経由して、正規表現によるreplaceおよび split, map を使う例
 ### コード例 1
@@ -174,6 +176,34 @@
+### コード例 5
+joinによる文字列を経由して、正規表現によるreplace および split, map を使うコードです。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = ary.join('#').replace(/([^#]+)#([^#]+)/g, '$1_$2').split('#').map((s: string) => s.split('_'))
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012](https://codepen.io/jun68ykt/pen/rNNeeMa?editors=0012)
 以上、参考になれば幸いです。

テキスト修正

2019/10/14 14:36

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -8,7 +8,7 @@
 2. 上記 1. の reduceに与える関数の、コード行を減らしたもの
-3. loadsh の chunk を使用した例
+3. [loadsh](https://lodash.com) の [_.chunk](https://lodash.com/docs/#chunk) を使用した例
 4. reduce も lodash も使わない例

テキスト修正

2019/10/14 14:07

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -2,7 +2,19 @@
+この回答では、以下の４つのコードを順に挙げます。
+1. yuki_90453さんがご質問に挙げられているコードに近いもの(reduceを使用）
+2. 上記 1. の reduceに与える関数の、コード行を減らしたもの
+3. loadsh の chunk を使用した例
+4. reduce も lodash も使わない例
-以下でいかがでしょう？
+### コード例 1
@@ -48,7 +60,11 @@
+### コード例 2
-以下は、上記のコードの reduce に与える関数本体で、 return を使わないで済ませるようにしたものです。行数は減りましたが、可読性に難アリかもしれません。
+以下は、先のコード例1の reduce に与える関数本体で、 return を使わないで済ませるようにしたものです。行数は減りましたが、可読性に難アリかもしれません。
@@ -80,11 +96,15 @@
-参考になれば幸いです。
-### 補足
+### コード例 3
+ご質問にある、
@@ -92,7 +112,7 @@
-について補足しますと、lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
+に対する一案として、lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
@@ -118,7 +138,7 @@
-### 補足2
+### コード例 4
@@ -151,3 +171,9 @@
 ```
 - **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012](https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012)
+以上、参考になれば幸いです。

テキスト修正

2019/10/14 13:54

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -115,3 +115,39 @@
 ```
 - **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012](https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012)
+### 補足2
+reduceを使わない、かつ、 lodash も使わない案も挙げておきます。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = ary.map((e: string, i: number, self: StrAry) =>
+                         i % 2 ? null : (i+1 < self.length ? [e, self[i+1]] : [e])
+                       ).filter(e => e)
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012](https://codepen.io/jun68ykt/pen/XWWdXMo?editors=0012)

テキスト修正

2019/10/14 13:41

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -114,4 +114,4 @@
 ```
-- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWqBBZOzvmyq?editors=0012](https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012)
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012](https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012)

テキスト修正

2019/10/14 13:32

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -48,7 +48,7 @@
-以下は、上記のコードの reduce に与える関数本体で、 return を使わないで済ませるようにしたものです。
+以下は、上記のコードの reduce に与える関数本体で、 return を使わないで済ませるようにしたものです。行数は減りましたが、可読性に難アリかもしれません。

テキスト修正

2019/10/14 13:23

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -81,3 +81,37 @@
 参考になれば幸いです。
+### 補足
+> ② reduceメソッドを使った方がわかりやすいと聞いて作ってみたのですが、私のコードは非常に見づらくわかりにくいです。わかりやすいように書きたいのですが、ご指摘頂けないでしょうか？
+について補足しますと、lodash の [_.chunk](https://lodash.com/docs/#chunk) を使うと、以下でできます。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = _.chunk(ary, 2)
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWqBBZOzvmyq?editors=0012](https://codepen.io/jun68ykt/pen/qBBZOzv?editors=0012)

テキスト修正

2019/10/14 13:19

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -48,4 +48,36 @@
+以下は、上記のコードの reduce に与える関数本体で、 return を使わないで済ませるようにしたものです。
+```typescript
+type StrAry = string[]
+const ary: StrAry = ['aaa', 'bbb', 'ccc', 'ddd', 'eee', 'fff', 'ggg']
+const ary2: StrAry[] = ary.reduce((a: StrAry[], str: string, i: number) =>
+  i % 2 ? [...a.slice(0, a.length-1), [a[a.length-1][0], str]] : [...a, [str]]
+, [])
+console.log(ary2)
+```
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/XWWdmyq?editors=0012](https://codepen.io/jun68ykt/pen/XWWdmyq?editors=0012)
 参考になれば幸いです。

テキスト修正

2019/10/14 13:10

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -38,7 +38,7 @@
 ```
-- **動作確認用 jsFiddle:** [https://jsfiddle.net/jun68ykt/6cq5gdv8/6/](https://jsfiddle.net/jun68ykt/6cq5gdv8/6/)
+- **動作確認用 CodePen:** [https://codepen.io/jun68ykt/pen/wvvGKQW?editors=0012](https://codepen.io/jun68ykt/pen/wvvGKQW?editors=0012)