【JS】【TS】ループ操作 ～ map ～

JavaScript TypeScript

■ はじめに

https://dk521123.hatenablog.com/entry/2021/01/03/000000

を分冊。

pulumi で TypeScript を使っているのだが、
少しでも簡潔に書きたいと思い、調べていたら
結局 map を使うことにしたので、メモしておく。

目次

【０】ブラウザ上での実行環境
【１】map
【２】サンプル
　１）JavaScript
　２）TypeScript

【０】ブラウザ上での実行環境

１）JavaScript
https://paiza.io/ja/projects/new?language=javascript

* Google Chrome なら、以下のような方法もある

https://www.javadrive.jp/javascript/console/index1.html

その他の環境については、以下のサイトを参照。

https://qiita.com/zchee/items/7b68c0f194d07ee06e10

２）TypeScript
http://www.typescriptlang.org/Playground/

【１】map

* ループして、新しい配列を生成

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/map

【２】サンプル

１）JavaScript

例１ 

// 'value:1'...
[1, 2, 3, 4, 5].map(value => console.log('value:' + value));

例２ 

let people = [
  { name: 'Mike', age: 17 },
  { name: 'Sam', age: 23 },
  { name: 'Kevin', age: 41 },
  { name: 'Tom', age: 32 }
];

people.map(person => console.log(
  'name:' + person.name + ' age:' + person.age));

２）TypeScript

例１ 

// Example to convert Dictionary to List
const people = [
  { id: "0001", name: "Mike" },
  { id: "0002", name: "Tom" },
  { id: "0003", name: "Sam" },
  { id: "0004", name: "Kevin" },
  { id: "0005", name: "Ken" },
];

const idList = people.map(person => person.id);

// [ '0001', '0002', '0003', '0004', '0005' ]
console.log(idList);

例２ 

const list = [
  'data1',
  'data2',
  'data3',
]

const convertedList0 = list.map(value => `c:\\\\root\\test\\${value}.csv`)
const result0 = convertedList0.join(', ')
// result0 = c:\\root\test\data1.csv, c:\\root\test\data2.csv, c:\\root\test\data3.csv
console.log(`result0 = ${result0}`)

const convertedList1 = list.map(value => `s3://your-bucket/demo/${value}.csv`)
const result1 = convertedList1.join(', ')
// result1 = s3://your-bucket/demo/data1.csv, s3://your-bucket/demo/data2.csv, s3://your-bucket/demo/data3.csv
console.log(`result1 = ${result1}`)

関連記事

TypeScript ～ 入門編 ～
https://dk521123.hatenablog.com/entry/2020/12/21/180904
ループ操作
https://dk521123.hatenablog.com/entry/2021/01/03/000000
配列・リスト操作
https://dk521123.hatenablog.com/entry/2021/02/10/225119