神戸プログラミングアカデミーのブログ

「未経験から」「スキルアップ」「起業を目指す」無料で学べる神戸のプログラミング学校&学習コミュニティ

Object型

youtu.be

JavaScriptにおいて、プリミティブ型と呼ばれる基本の型以外は、全てObject型です。

developer.mozilla.org

実は…

const array = []
console.log(typeof array)

が、おそらく最初は理解できないので、今はこの話を忘れてください。

オブジェクト型とは

developer.mozilla.org

オブジェクト型とは keyvalueを持った型のことです。{}を代入するとオブジェクト型になります。同じkeyをもつ要素を複数もつことはできません。

const obj = {}
console.log(typeof obj)

key:参照するためのキーワード

valueとは:変数(String型、Number型、Array型、Function型などなど…)

です。

初期化する時は

const point = {
  x: 100,
  y: 300
}
console.log(point)

代入する時は

const point = {
  x: 100,
  y: 300
}
point.x = 200
point.y = 100
console.log(point)

または、

const point = {
  x: 100,
  y: 300
}
point['x'] = 200
point['y'] = 100
console.log(point)

valueには関数を入れることもできます。

const user = {
  firstName: '太郎',
  familyName: '山田',
  fullName: function () { return this.familyName + this.firstName }
}
console.log(user.fullName())

余談:ES6からClassという構文を使えるようになったので、以上のようなコードを書く場合は、Classを使って書くことをおすすめします。(いつかClassの話をします)

class User {
  constructor(familyName, firstName) {
    this.familyName = familyName;
    this.firstName = firstName;
  }
  get fullName () {
    return this.familyName + this.firstName
  }
}
const user = new User('山田', '太郎')
console.log(user.fullName)

valueには配列を入れることもできます。配列を入れる時は[]になります。

const users = {
  users: [
    {
      name: '鈴木',
      age: 25
    },
    {
      name: '山田',
      age: 33
    },
    {
      name: '佐藤',
      age: 12
    },
    {
      name: '高橋',
      age: 54
    },
  ]
}
console.log(users)
よく使うスタティックメソッド(クラスメソッド)
メソッド 効果
Object.freeze() オブジェクトを凍結する
Object.keys() キーを配列にして返す
Object.values() Valueを配列にして返す

問題準備

各自作業ディレクトリで、以下コマンドを実行してください。作業ディレクトリにsongs.jsonがあることを確認

curl https://s3-ap-northeast-1.amazonaws.com/prog-ac.assets/assets/songs.json > songs.json
curl https://s3-ap-northeast-1.amazonaws.com/prog-ac.assets/assets/playdata.json > playdata.json

プログラムソースコードに以下を貼り付けて実行してください。

const songs = require( "./songs.json" );
const playdata = require( "./playdata.json" );
for(let song of songs.songs) {
  console.log(song)
}
問題1

曲リストの中からavailabledがtrueのもののtitleを表示してください

問題2

曲リストの中からavailabledがtrueで且つseasonがtrueのもののtitleを表示してください

問題3

曲リストの中からavailabledがtrueのものをsort_priority順にソートしてtitleを表示してください

問題4

playdataのcountが大きい順にソートして、曲のtitleとplaydataのcountを[順位\t${title}\t${count}]のフォーマット表示してください

youtu.be