質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Ionic

Ionicは、クロスプラットフォームに対応したモバイルアプリ開発のためのオープンソースUIフレームワークです。iOSやAndroid、Webのアプリケーションを1つのコードベースで開発できます。

Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

Q&A

解決済

1回答

1258閲覧

Ionicでjsonの子要素を範囲指定して表示したい

dauto

総合スコア38

Ionic

Ionicは、クロスプラットフォームに対応したモバイルアプリ開発のためのオープンソースUIフレームワークです。iOSやAndroid、Webのアプリケーションを1つのコードベースで開発できます。

Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

0グッド

0クリップ

投稿2019/07/27 09:35

編集2019/07/27 10:25

現在、私はTypeScriptで下記のようなjsonを取得しています。

json

1{ 2 id: 12, 3 point: { 4 id: 1, 5 pointA: 132, 6 pointB: 54, 7 pointC: 234, 8 pointD: 812, 9 pointE: 87, 10 customer_id: 12, 11 }, 12 }

ここからpointの子要素のキーにpointという文字列が入っているpointA、pointB、pointC、pointD、pointEの値のみを絞り込む為、以下のコードを書いたのですが、値は表示されませんでした。

typescript

1for(var i=0; i < Object.keys(user["point"]).length; i++) { 2 let point = user["point"][i]; 3}

JSは初心者な為、どこを修正すればいいのか見当もつかないのですが、どこを直せばいいのでしょうか。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

例えば以下のようなコードならどご希望にそえるでしょうか?

javascriptで文字列の中に特定の文字列が存在しているかどうかをチェックするためには
indexOfincludesを使うことが多いです。

また、filter関数は配列の中から特定の条件に合致する値のみを取り出すことができます。

ここらへんを組み合わせると、文字列の配列の中から特定の文字列が存在するもののみを取り出す事ができます。

TypeScriptで書くなら以下のようになると思います

TypeScript

1const json = { 2 id: 12, 3 point: { 4 id: 1, 5 pointA: 132, 6 pointB: 54, 7 pointC: 234, 8 pointD: 812, 9 pointE: 87, 10 customer_id: 12, 11 }, 12} 13 14const res = Object.keys(json.point).filter( key =>{ 15 return key.includes('point') 16}).map(key => ({[key]: (json.point as {[key:string]:number})[key]})) 17 18console.log(res)

余談ですが、Unix哲学の中で「スマートなデータを使うつまらないコードを書け」という有名な言葉があります。要は「複雑なロジックが必要になっているということはそもそもデータ構造が良くない」というような考え方なのですが、その考えに沿うなら、そもそも上記のようなfilterコードを書かなければいけないようなデータ構造になっている事自体が良くないのではないかと思います。私なら以下のようなデータ構造にして、filterをかけなくても扱えるようなデータ構造にするかなと思います。

{ customer_id: 12, pointId:1, points: { pointA: 132, pointB: 54, pointC: 234, pointD: 812, pointE: 87, }, }

以下はJavascriptのコードです。最初は以下を回答としていたのですが、TypeScriptでは、環境によってはObject.entries()が動かない場合がある(https://patrickdesjardins.com/blog/typescript-and-object-entries の対応が必要)のでObject.keys()を使った回答に変更しました。一応回答としては残しておきます。

js

1const json = { 2 id: 12, 3 point: { 4 id: 1, 5 pointA: 132, 6 pointB: 54, 7 pointC: 234, 8 pointD: 812, 9 pointE: 87, 10 customer_id: 12, 11 }, 12} 13 14const res = Object.entries(json.point).filter( ([key,value]) =>{ 15 return key.indexOf('point') !== -1 16}).map(([key,value]) => ({[key]: value})) 17 18console.log(res)

投稿2019/07/27 12:04

編集2019/07/27 13:11
KuwabataK

総合スコア306

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問