teratail
回答率
85.35%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問動的にobjectを追加していく方法

編集履歴

質問編集履歴

2

質問内容を元に戻しました。

2021/12/11 01:08

投稿

nanase21
nanase21

スコア144

test CHANGED
@@ -1 +1 @@
1
- 動的に増えるデータに対する型定義方法について知りたい
1
+ 動的にobjectを追加していく方法
test CHANGED
@@ -2,7 +2,27 @@
2
2
 
3
3
 
4
4
 
5
+ ```json
6
+
7
+ [
8
+
9
+ {id: 1, title: 'test1', createdAt: '2021-12-10T00:00:00.001Z'},
10
+
11
+ {id: 2, title: 'test2', createdAt: '2021-12-11T00:00:00.001Z'},
12
+
13
+ {id: 3, title: 'test3', createdAt: '2021-12-12T00:00:00.001Z'},
14
+
15
+ {id: 4, title: 'test3', createdAt: '2021-12-12T00:00:00.001Z'},
16
+
17
+ ]
18
+
19
+ ```
20
+
5
- 以下のデータ構造の型定義方法を知りたい。
21
+ 上記のようなデータ構造があったときに、下記のようなデータ構造に整形する方法を知りたい。
22
+
23
+
24
+
25
+ 理想のデータ構造
6
26
 
7
27
 
8
28
 
@@ -24,24 +44,88 @@
24
44
 
25
45
 
26
46
 
27
- ```ts
47
+ # 現状できていること
28
-
29
- // {[key: string;]: { marked: boolean}}
30
-
31
- keyが動的の場合の型付けは上記の方法で出来るのですが、APIのレスポンスによって数が変わる場合の定義方法が分からなくて困っています。
32
48
 
33
49
 
34
50
 
35
- const test: {[key: string;]: { marked: boolean} } = {
51
+ 以下のようなコードで、配列型でそれっぽくは出来たのですが、上記のような「理想のデータ構造」にする方法が分からず困っています。
36
52
 
37
- 　　'2021-12-10': { marked: true },
38
53
 
39
- 　　'2021-12-11': { marked: true },
40
54
 
41
- 　　'2021-12-12': { marked: true },
55
+ ```js
42
56
 
43
- 　　'2021-12-13': { marked: true },
57
+ const arr = data.map((e) => {
44
58
 
59
+ const created_at = moment(e.created_at).format('YYYY-MM-DD');
60
+
61
+ return {
62
+
63
+ [created_at]: { marked: true },
64
+
45
- };
65
+ };
66
+
67
+ });
68
+
69
+
70
+
71
+ console.log(arr);
72
+
73
+ /*
74
+
75
+ Array [
76
+
77
+ Object {
78
+
79
+ "2021-12-10": Object {
80
+
81
+ "marked": true,
82
+
83
+ },
84
+
85
+ },
86
+
87
+ Object {
88
+
89
+ "2021-12-11": Object {
90
+
91
+ "marked": true,
92
+
93
+ },
94
+
95
+ },
96
+
97
+ Object {
98
+
99
+ "2021-12-12": Object {
100
+
101
+ "marked": true,
102
+
103
+ },
104
+
105
+ },
106
+
107
+ Object {
108
+
109
+ "2021-11-01": Object {
110
+
111
+ "marked": true,
112
+
113
+ },
114
+
115
+ },
116
+
117
+ Object {
118
+
119
+ "2021-12-13": Object {
120
+
121
+ "marked": true,
122
+
123
+ },
124
+
125
+ },
126
+
127
+ ],
128
+
129
+ */
46
130
 
47
131
  ```

1

質問の内容の変更

2021/12/11 01:08

投稿

nanase21
nanase21

スコア144

test CHANGED
@@ -1 +1 @@
1
- 動的にobjectを追加していく方法
1
+ 動的に増えるデータに対する型定義方法について知りたい
test CHANGED
@@ -2,27 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- ```json
6
-
7
- [
8
-
9
- {id: 1, title: 'test1', createdAt: '2021-12-10T00:00:00.001Z'},
10
-
11
- {id: 2, title: 'test2', createdAt: '2021-12-11T00:00:00.001Z'},
12
-
13
- {id: 3, title: 'test3', createdAt: '2021-12-12T00:00:00.001Z'},
14
-
15
- {id: 4, title: 'test3', createdAt: '2021-12-12T00:00:00.001Z'},
16
-
17
- ]
18
-
19
- ```
20
-
21
- 上記のようなデータ構造があったときに、下記のようなデータ構造に整形する方法を知りたい。
5
+ 以下のデータ構造の型定義方法を知りたい。
22
-
23
-
24
-
25
- 理想のデータ構造
26
6
 
27
7
 
28
8
 
@@ -44,88 +24,24 @@
44
24
 
45
25
 
46
26
 
47
- # 現状できていること
27
+ ```ts
28
+
29
+ // {[key: string;]: { marked: boolean}}
30
+
31
+ keyが動的の場合の型付けは上記の方法で出来るのですが、APIのレスポンスによって数が変わる場合の定義方法が分からなくて困っています。
48
32
 
49
33
 
50
34
 
51
- 以下のようなコードで、配列型でそれっぽくは出来たのですが、上記のような「理想のデータ構造」にする方法が分からず困っています。
35
+ const test: {[key: string;]: { marked: boolean} } = {
52
36
 
37
+ 　　'2021-12-10': { marked: true },
53
38
 
39
+ 　　'2021-12-11': { marked: true },
54
40
 
55
- ```js
41
+ 　　'2021-12-12': { marked: true },
56
42
 
57
- const arr = data.map((e) => {
43
+ 　　'2021-12-13': { marked: true },
58
44
 
59
- const created_at = moment(e.created_at).format('YYYY-MM-DD');
60
-
61
- return {
62
-
63
- [created_at]: { marked: true },
64
-
65
- };
45
+ };
66
-
67
- });
68
-
69
-
70
-
71
- console.log(arr);
72
-
73
- /*
74
-
75
- Array [
76
-
77
- Object {
78
-
79
- "2021-12-10": Object {
80
-
81
- "marked": true,
82
-
83
- },
84
-
85
- },
86
-
87
- Object {
88
-
89
- "2021-12-11": Object {
90
-
91
- "marked": true,
92
-
93
- },
94
-
95
- },
96
-
97
- Object {
98
-
99
- "2021-12-12": Object {
100
-
101
- "marked": true,
102
-
103
- },
104
-
105
- },
106
-
107
- Object {
108
-
109
- "2021-11-01": Object {
110
-
111
- "marked": true,
112
-
113
- },
114
-
115
- },
116
-
117
- Object {
118
-
119
- "2021-12-13": Object {
120
-
121
- "marked": true,
122
-
123
- },
124
-
125
- },
126
-
127
- ],
128
-
129
- */
130
46
 
131
47
  ```