itunes_for_mac
iTunes Search / App Store Search API

Apple社のご存知「iTunes」サービスから、「Search API」が提供・公開されています。

iTunes全体のデータを検索する(データベースに問い合わせる)ことができます。

自分のWebサイトやアプリにiTunes検索機能をもたせたり、コンテンツに関連するiTunesデータを表示したりできます。

 

利用例

2013-05-27 18.54.36

Shazam(iOS)

周囲で流れている音楽をマイクから聴きとって、曲名を教えてくれるiOSアプリ。

(1)マイクでShazamアプリに曲を聴かせる

(2)音声データをコード化→Gracenoteエンジンで曲名ゲット

(3)曲名からiTunesAPIでカバーアート、プレビュー音声、購入リンクをゲット (左図参照)

 

参考) http://matome.naver.jp/odai/2133364016722604501

 

公式ドキュメント
http://www.apple.com/itunes/affiliates/resources/documentation/itunes-store-web-service-search-api.html

APIには、そのAPIをリリースしている団体(提供企業)が公開しているドキュメント(マニュアル)があります。マニュアルのなかで、APIの使い方が説明されています。
大きなインターネット企業のほとんどは日本国外の企業ですから、公式ドキュメントは大抵の場合英語で書かれています。(はてなAPIやmixiAPIなどの資料は日本語ですが)

 

APIにかぎらず、ITの世界では(特に技術者は)英語がある程度読めるようにならないといけません。「え〜英語!?まじカンベンしてください…」

→ 英語スキルが完全でなくても、それを補う2つの道があります。

 

(1)あらかじめ概念を理解しておく。
APIっていうのはこういうものだから、APIのドキュメントにはこういう説明がされているはず。そういう風に、あらかじめ内容や構成に予想を立てながら理解を試みれば、一言一句英語がわからなくても知りたいことは理解出来ます。

(2)日本語で書かれた解説記事をたくさん読む。

これも「あらかじめ概念を理解しておく」ことにつながりますが、うまくいけばほとんどは公式ドキュメントを読まなくても理解できるかもしれない。
ただ、公式ドキュメントの情報にまさるものはないので、日本語情報だけに「逃げる」のは絶対に良くないということは肝に銘じておいてください。

 

このAPIのエンドポイント

https://itunes.apple.com/search

 

パラメータ

term

キーワード文字列。

entity

得られる検索結果のタイプ。次のうちから選んで使う(右側の英語のほう)。

  • ムービー:movieArtist, movie
  • ポッドキャスト:podcastAuthor, podcast
  • ミュージック:musicArtist, musicTrack, album, musicVideo, mix, song
  • ミュージックビデオ:musicArtist, musicVideo
  • オーディオブック:audiobookAuthor, audiobook
  • ショートフィルム:shortFilmArtist, shortFilm
  • TV番組:tvEpisode, tvSeason
  • アプリ:software, iPadSoftware, macSoftware
  • 電子ブック:ebook
  • すべて:movie, album, allArtist, podcast, musicVideo, mix, audiobook, tvSeason, allTrack

country

日本の場合は JP

lang

日本語の場合は ja_JP

limit

取得したい件数。最大200

offset

何番目から取得するか。

 

 

 :songタイプで「beatles」を検索

 

クエリストリングでちょっと確認

http://itunes.apple.com/search?term=beatles&entity=song&country=JP

郵便番号の時も見たように、結果がJSONデータとして見えます。
JavaScript/jQueryコードを書いて、このJSONデータをAJAXで取得・操作します。

 

動作デモ1
http://dev.koekatamarin.com/zokei/20130528_itunes/

Aptanaでプロジェクト作成
Webプロジェクト → Boilerplate(cached)
プロジェクト名は「itunes」

index.htmlに記述

 
css/style.cssに記述(215行目あたり)

※とりあえず見やすくするためだけのスタイルなので、必須ではありません。自由に書き換えても構いません。

 
js/script.jsに記述

 
※「//」からはじまる灰色の文字は「コメント」なので、書かなくても良いです。

ここまで書けたら、今使っているPC内のローカルサーバーにアクセスして確認!
http://127.0.0.1:8020/itunes/

サンプルと同じように動いてますか?
動いていなかったら、
ブラウザ画面上で右クリック→要素の検証→Console
に、エラーの内容が表示されているはず。
それを見ながら「デバッグ(バグ取り)」しなければなりません。

 
このサンプルコードを改良

それでは次に、先ほどの表を改良したいと思います。

動作デモ2
http://dev.koekatamarin.com/zokei/20130528_itunes2/

  • 「画像」のところを、アドレスではなく実際のイメージに。
  • 「時間」のところを、人間にわかりやすい時間表記に。

以下のJavaScriptコードの、オレンジ色の行に注目し、先ほどのコードに新しいコードを追加・変更します。

js/script.js

動作デモ2と同じように動きましたか?

 

創意工夫してみる
このような流れで、各自で自由にプログラムを改良してみましょう。

たとえば、こんな感じ。
動作サンプル3
http://dev.koekatamarin.com/zokei/20130528_itunes3/

 

index.html

css/style.css

js/script.js

 

番外編:他のAPIに置き換えてみる「Giphy API」
プログラムコードはほぼこのままで、別のAPIを利用してみましょう。
GIFアニメを収集したサイト「Giphy」のAPIを使って、キーワードに応じたGIF画像をずらりと表示します。

Giphy
http://giphy.com/

Giphy API Documentation
https://github.com/giphy/GiphyAPI

動作サンプル4
http://dev.koekatamarin.com/zokei/gif/

style.cssに追加

 

js/script.js
変更箇所
・1行目
・19〜23行目
・37〜39行目

Have fun!(^ω^)

 

騙されたと思って、こちらの動画をご覧ください。

ももクロというグループの本質的な価値はともかくとして、
この曲の歌詞は働くことへの疑問に対して、おそらく現状でもっともわかりやすい説明のひとつだと思います。

もっときっちり突き詰めて考えたいんだという人は、ミシェル・フーコーの「監獄」の概念について理解すると良いと思います。

「学校」とは社会にでる前の人間、すなわち「犯罪者予備軍」を隔離しておくための「監獄」にすぎないという考え方です。

ミシェル・フーコーの監獄と監視の概念モデルは、「パノプティコン」などで現代思想界に広く知られています。現代あるいは未来において、管理社会について考える際のベースとなる考え方だとされています。

高度情報社会における私たちのコンピューティングについても無縁ではないテーマですので、東浩紀なんかが好きな人は知っておくといいです。

Mac OS Xの場合は、OSのバージョンを問わず、Javaがすでに入っているはずです。

ですから、インストール説明のJavaのところは飛ばしてください。

 

もしAptanaを起動しようとした時に「JDKがなくて動かない」場合は、こちら

http://www.oracle.com/technetwork/java/archive-139210.html

から、Java SE Download SDKの過去のバージョンをインストールしてみてください。

 

また、これでもうまくいかない場合は

http://support.apple.com/kb/DL1573?viewlocale=ja_JP

こちらも確認してください。

 

Macbookなら、学校に持ってきてくれれば授業後に一緒にやってみましょう。

 

それでもだめなら… OSXを最新のMountain Lion(10.8)に有償でアップグレードするか、新しいMac本体を購入すしたほうがいいかと…

あるいは、今はとりあえずAptanaを使わなくても、好きなテキストエディタを使えばいいと思います。Smultron(Fraise)が個人的にはおすすめです。

もちろんWeb用途に限定すれば、DreamWeaverでも全然問題ないですよ。

 

 

質問があればコメント欄にどうぞ…

(この記事は「オブジェクト指向」の概念を理解し始めた学生さん向けに書かれています)

 

本学の森岡教授の多岐にわたる研究テーマのひとつに「いかに少ない種類の食材でバラエティに飛んだランチメニューを提供するか」というトピックがあります。

食材の種類が少なければ少ないほど、カフェにおける利益ロスは減ります。通常、食材を絞れば、結果として出来上がるメニュー自体もラインナップに乏しくなります。

しかし森岡教授は、いくつかのカフェでは限られた食材・限られた調理スキルでも非常にバラエティ豊かなランチメニューを提供することに成功していることに気づいたと言います。

なかなか興味深い話ですね。

 

さて、この話を手がかりにして、オブジェクト指向について説明してみたいと思います。

以下の図に示した寿司は、スシローという有名な回転寿司チェーンにおける実際のメニューの一部です。

OOS

ここで見られるのも、先ほどのカフェと同様の考え方です。

限られた寿司ネタで、メニューのバリエーションを増やす努力が垣間見られます。
鮮度が落ちてしまった寿司ネタでも、一手間加えて、鮮度の求められにくいメニューに変化させて新たなメニューとして提供することが可能です。
これにより、食材のロスが減り、メニューはラインナップ豊かになり、「鮮度」以外の価値を持つ寿司の可能性を顧客に提案できるのです。

 

このメニューのどこがオブジェクト指向なのか?

例えば、「焼とろサーモン」は、「サーモン」クラスを継承した子クラスです。

「焼とろサーモン」クラスには“焼き”という独自のメソッドや、”大根おろしのさっぱり感”といった独自のプロパティ拡張されています。

「サーモン」クラスの味覚を「焼とろサーモン」クラスはオーバーライドしているのです。

そして、「焼とろサーモン」クラスは決して「まぐろ」クラスを継承してはいません。

「サーモン」クラスの濃厚でまったりとした脂っこい味を継承し活用するように「焼とろサーモン」クラスは設計されています。

 

いかがでしょうか?

この図を連想することで、オブジェクト指向のイメージは輪郭が少しハッキリ見えてこないでしょうか。

飲食店のメニューを考案することは、プログラミング時にクラスを設計することに似ています

 

ところで、実際には食品衛生法などがありますから、おそらく一度レーンに流した回転寿司を一定時間後に回収して別のメニューとして提供する、ということは行われていないでしょう。でも、原理的には十分可能ですし、バリエーション豊かなメニューを構成するにはこのオブジェクト指向的に考えられたスシローのメニュー(クラス設計)は優れていると思います。

 

Have fun!(^ω^)

ミュージックシーンでの「マッシュアップ」

  • BPMを揃えて、曲と曲をつないで、エフェクトを掛ける「DJプレイ
  • ある曲のトラック素材をベースに、新たな素材とともに楽曲として再構成「リミックス
  • 曲と曲を合体させてしまう「マッシュアップ

マッシュアップの例

PSY vs Ghostbusters – Gangnam Busters – Mashup by FAROFF – YouTube https://www.youtube.com/watch?v=82LCKBdjywQ

30秒ぐらいからがわかりやすい

 

17歳が作った有名なマッシュアップ

Madeon – Pop Culture (live mashup) – YouTube
http://www.youtube.com/watch?v=lTx3G6h2xyA

トラックリスト(素材)

  • Alphabeat – BoyfriendAlphabeat – Fascination
  • Bag Raiders – Shooting Stars
  • Black Eyed Peas – Gotta Feeling
  • Britney Spears – …Baby One More Time
  • Capsule – Can I Have A Word
  • Chromeo – Momma’s Boy
  • Coldplay – Viva La Vida
  • Daft Punk – Aerodynamic
  • Daft Punk – Around The World
  • Deadmau5 – Raise Your Weapon (Madeon Remix)
  • Deadmau5 – Right This Second
  • Ellie Goulding – Starry Eyed
  • ELO – Mr. Blue Sky
  • Girls Aloud – Biology
  • Gorillaz – Dare
  • Gossip – Heavy Cross (Fred Falke Remix)
  • Gwen Stefani – What You Waitin For (Jacques Lu Cont Mix)
  • Housse de Racket – Oh Yeah
  • Justice – DVNO
  • Justice – Phantom Part II
  • Katy Perry – One Of The Boys
  • Ke$ha – Take It Off
  • Kylie Minogue – Wow
  • Lady Gaga – Alejandro
  • Linkin Park – Crawling
  • Madonna – Hung Up
  • Martin Solveig ft. Dragonette – Boys and Girls
  • Michael Jackson – Billie Jean
  • Nero – Me and You
  • One Republic – All The Right Moves (Danger Remix)
  • One-T – Magic Key
  • Ratatat – Shempi
  • Solange – I Decided (Freemasons Remix)
  • Stardust – Music Sounds Better With You
  • The Buggles – Video Killed The Radio Star
  • The Killers – Losing Touch
  • The Who – Baba O’Riley (SebastiAn Remix)
  • Yelle – Que Veux Tu (Madeon Remix)

 

ITにおけるマッシュアップ

(複数の)WebAPIを使って、様々なWebサービスが提供するデータをひとつのWebサイト・Webサービス・アプリで扱うこと。

近年では、東日本大震災やハリケーン・カトリーナといった大規模な災害が起こった時に、ソーシャルメディア・地図・写真・ニュースなどのAPIを用いて災害支援サービスを公開する事例が注目されています。

 

実例

まず、講師・入江が構築、運営しているTwitterAPIを利用したサービスです。

Twitterと政治(α) / ぽりったー(politter) http://politter.com/

Google Maps APIを利用して、航空機の現在地をリアルタイム表示するサービス。

Plane Finder – Live Flight Status Tracker http://planefinder.net/

次もGoogle Maps APIを使ったサービス。紹介記事から。

Googleマップを使った等時間地図(isochrone map)マッシュアップ
http://developer.cybozu.co.jp/akky/2011/10/googleisochrone-32e7/

次に、近頃話題になった「どこでもドア」サービス。

The Secret Door – Step Through To The Unknown… | Safestyle UK
http://www.safestyle-windows.co.uk/secret-door/

Amazonのデータベース情報を利用して、自分の持ち物を登録・管理するサービス。

書籍管理・CD管理システム「司書さん」 http://sasage.net/isbn/

他にも、

旅行の思い出を共有する | breadcrumbs(ブレッドクラム) http://www.bread-crumbs.info/

Wantedly:ソーシャル・リクルーティング https://www.wantedly.com/

などなど。

「マッシュアップ」という言葉は、WebAPIというものが普及し始めた5年ほど前まではよく使った言葉なのですが、今ではマッシュアップ事例はすごく多くて日常的に作られてありふれたものになっているので、以前ほど言葉としては使われなくなっています。

また、「複数のWebAPIを」使っているわけではなくて、APIひとつで成り立っているようなサービスも「マッシュアップ」と呼ばれるなど、近年曖昧な言葉にはなっています。

正確な言葉の定義を覚えるというよりも、イメージをつかんで、周囲の人達と認識を共有して話ができるようになることが大切です。

 

How To Mashup (by myself)

方針

  1. どのようなWebAPIが存在するのかを知る
  2. どのAPIを使ってどのようなサービスを作るのか企画する
  3. 個別のWebAPIの利用マニュアルを読む
  4. WebAPIを組み込んだプログラムを実装する

まずはここから

定番Web APIの使い方 – 定番Web APIを知る:ITpro
http://itpro.nikkeibp.co.jp/article/COLUMN/20100513/347983/

マッシュアップ情報|ワッフル/WAFL みんなで作るWeb API&マッシュアップ情報一覧サービスサイト http://wafl.net/mashups/

この続きは各自で。

 

Have fun!(^ω^)

改善点

  • 説明なしに、知らない専門用語を使わない
  • マイクの音量を上げる
  • 教室後方のモニターは2台とも必ずつける
  • プログラミング時のフォントを大きく
  • 授業内容の実用性をもっと高める
  • 毎回、手を動かす実装作業を必ず盛り込む
  • 遅刻・欠席者の授業進捗を把握してケアする

わかりにくかったであろう内容

  • 配列とオブジェクトの違い
  • ChromeのJavaScriptデバッグコンソール
  • 実用的な内容と、基礎がための内容の違い
  • コーディング時の思考プロセス、とっかかり

 

みなさん毎回アンケート記入ありがとうございます。

アンケート内容がすごく励みになりますし、認識が甘かった点に気付かされます。意見やリクエストを書いてもらえるととても助かります。

少しずつでも、より意義のある授業を目指して改善し、学生の皆さんの将来に役立つよう力になっていきたいと思います。

プログラミングの基礎のところって、わかりにくいし、くどくどと話が続くし、実用性があるのか怪しいし、ちょっと退屈だなーと思いませんか?

僕も、プログラミングで新しいことに挑戦するとき、ちまちまと「お勉強」しないといけなかったら、そう感じることがあります。

実用とはつまり「応用」のことです。
「基礎があれば、応用は利く」なんて言い方をすることがあります。
これはちょっとうさんくさい言葉に思えますよね。
小中高と勉強してきたことのすべてが、今 そして未来の役に立つなんて、あまり信じられないですよね。

でも僕はWebの仕事をしていて結果的に「基礎が応用につながった」という経験が実際に自分の中にあるので、新しく勉強を始めることに退屈よりもワクワクを感じるほうが大きいんです。
基礎が退屈でたまらない、と感じる方は、もしかしたら「基礎と応用がつながる感覚」をまだ実感できていないのかもしれません。

この感覚をなるべく早く皆さんにお伝えしたいと思っています。

 

実は実用的な技術・知識というのは、ネットで解説記事をググって説明通りにステップバイステップでやれば誰でもわりと簡単に得られるんです。
たとえば… サイトの画像をまとめてスライドショーにしたい、というとき、

このコードをコピペすれば、こういうjQueryプラグインが動きます

とブログ記事に書いてあれば、おそらく皆さんは出来てしまう。やりたいことをやれるようになるのは本来すごく簡単なはずなんです。

ただ、その前に、HTMLとは何か、jQueryとは何かは最低限わかっていないといけないですよね。1〜2年で学習してきた「基礎」が必要になる瞬間です。
実用・応用とはちがって、基礎のところは「概念・イメージ」を自分で噛み砕いて理解しないといけません。これには結構時間が掛かるのです。

 

つまり、実用的なことをググって調べられれば、特に何の問題もなく、やりたいことができてしまいます。
ただし、どういう手順・方針で考えて、何を調べればいいのかがわからないと、調べられない。方向が間違っていると、間違った所にしか辿りつけない。
そこに必要なのは、基礎的な概念です
その概念・イメージのところを、教える側は授業で伝えたいのです。
概念・イメージが自分の中にあれば、その先の応用的なことは自分でできます。
逆に言うと、自分でできるようになってもらわないと、大学は一生面倒を見てあげられるわけではないので、末端の実用的なことばかりを扱う教育というのは無責任だと思うんです。

方向さえわかれば、きっと皆さんは自分の力で進み、飛翔できるでしょう。
大学教育とは、その方向を照らしてあげることだと思うのです。

 

もちろん、基礎的なことばかりやっていては一向にラチがあかない。つまらない。頭でっかちになる。
だから、実用的な内容とのバランスをとるべきだと思っています。

もしかしたら、第4回までの授業を行った時点での私(入江)のバランス感覚は、実用よりも基礎に寄りすぎていたのかもしれません。それは反省したいと思います。
これからはもう少し実用的なことを増やすよう心がけたいと思います。
そして、学生の皆さんは、基礎の部分にももう少し我慢しながらプログラミングに取り組んでみてください。

そう遠くない未来に「基礎と応用がつながる」「自分と社会がつながる」経験が必ず待っています

授業のために、「郵便番号API」というのを用意しました。
日本郵便のオフィシャルデータを元に、郵便番号から番地を検索することができます。
シンプルかつ標準的なAPIになっていますので、まずはこれを例にAPIに挑戦してみましょう。

郵便番号

エンドポイント
APIには必ずエンドポイントというのがあります。
Webサイトで言うところのアドレスのようなものです。

郵便番号APIのエンドポイント
http://dev.koekatamarin.com/zokei/zipcode/

ブラウザ上でこれをクリックしても、エラーらしきページが表示されるだけです。
なぜか?
パラメーター(引数)が何も指定されていないからです。

 

パラメーター(引数)

関数(function、メソッド)を実行するには、引数というものがありましたよね。
APIとは、ネット上に存在する関数のようなものです。
APIというネット上の関数を実行するには、大抵の場合、パラメーター=引数を指定する(渡す)必要があります。

エンドポイントにzipcodeパラメーターを付け加えると…
http://dev.koekatamarin.com/zokei/zipcode/?zipcode=560-0013

↑をブラウザ上でクリックすると、今度は

と表示されます。これは、JSON形式のデータです。
みごと、郵便番号から、番地が検索できたというわけです。
 
このJSONというデータ形式、これは要するにJavScriptの「オブジェクト」です。
(参考) http://ja.wikipedia.org/wiki/JavaScript_Object_Notation
 
取得したJSONデータの、階層構造になっているプロパティ(見出し)に、ドット記法(ドットシンタックス)でアクセスすることで、値を表示したりできます。
results.kana1 といった具合に。

 

GETとPOST(ちょっと脱線します)

ところで、さきほどエンドポイントの後ろに
?zipcode=560-0013
って付けましたが、こういうアドレスの付け方ってどこかで見たことありませんか?
そう、Google検索です。

https://www.google.co.jp/search?q=HTML5

この場合の ?q=HTML5 とは、
qというパラメータ(引数)に、「HTML5」というワードを指定していることになります。

この引数の付け方は、「GET方式でURLにクエリストリングをつけている」と言います。

?変数1=値1&変数2=値2… という風につないでいきます。

GETとPOSTというは、HTTPでデータを送信する際の2つの手法です。
htmlのformタグで見たことありませんか?

これです。
このformでは、POST方式でform内のいろいろな値をサーバーに送信します。

?q=HTML5 とか ?zipcode=560-0013 っていうのは、GET方式でサーバーにパラメーターを送信しているということです。

APIと呼ばれるものは、GET方式で利用します。

Google検索もたまたまGET方式を採用しています。
検索サービスの実装ではGET方式がしばしば使われますが、メール送信フォームやユーザー登録フォームなど、通常のWebサイトにデータを送信する場合はほとんどPOST方式が採用されます。

 

JavaScriptからAPIを利用するには?

話をAPIに戻します。
今のは、ブラウザから試しにAPIを叩いてみただけで、クエリストリング(?zipcode=)を使ったのも簡易的な指定方法にすぎません。
あんな生のデータがずらっと出た所で、あまり意味は無いですもんね。
実際には、JavaScriptからAPIを叩いて、データをコネコネするプログラムコードを書かないと始まりません。

JavaScriptからAPIに通信(非同期通信)することを何と言うでしょう?
そう「AJAX」です。

AJAXを処理するのに適した有名なライブラリといえば?
そう「jQuery」です。

 

jQueryでAPIとAJAX通信
いよいよ実際にコードを書きましょう。

まず、BoilerPlateまたはBoilerPlate(Cached)を選択して、プロジェクトzipcodeを作成します。
コードを書き込むところは js フォルダの中の、script.js ファイルです。

jQueryでAPIとAJAX通信する例

上記のコードをscript.jsに打ち込んでみましょう。
ほとんどそっくり打ち込むのはアホらしいと思うかもしれませんが、コーディングに慣れるためにも我慢しましょう。

var _zipcode = ‘560-0013’;
の部分は、ご自分のお住まいの郵便番号にしてみても構いません。

打ち込み終わったら、「実行」メニューの「実行」を実行してみてください(・ω・)

ブラウザのダイアログに「豊中市」と表示されますね(560-0013の場合)。

※ブラウザのページ自体がうまく開かない場合は、 http://127.0.0.1:8020/zipcode/index.html を開きましょう。

 

次のステップ
上記のサンプルコードで、APIからデータを取得することが出来ました。

ただし、検索する郵便番号を変えるには、ソースコードを書き換える必要があります。つまり、ユーザーにとってはあまり意味のないアプリケーションです。

また、ダイアログ表示するだけなのもダサいですよね。

皆さんならどう洗練させていきますか?
単純に「洗練」と言っても、様々なディレクションが考えられます。
そもそも「APIを使う」というのが出発点なだけで、このアプリケーションのコンセプトは白紙です。

「題材が郵便番号ではつまらない」と思うかもしれませんが、ぜひこのサンプルの改善にも取り組んでみてください。

Have fun!(^ω^)

6144JY0T0EL

If I have seen further it is by standing on the shoulders of giants.
もし私に遠くが見えているとしたら、それは巨人の肩の上に立っているからだ (アイザック・ニュートン)

APIとは
API = Application Programming Interface
アプリケーション間、またはハードウェアとの間で、データや機能を提供するためのインターフェイス。
例えば、ソフトウェア開発者がWindows OSの機能を利用するには、Windows APIを利用します。
Google Mapを援用したアプリやサービスを開発するには、Google Maps APIを利用します。

 

 

Web API
インターネット(Web)を介して利用するAPIのこと。
前述の例で言えば、Windows APIはひとつひとつのPC内で通信されるだけなのでWebAPIではありません。Google Maps APIやTwitter APIなどインターネット経由で提供されるAPIが、WebAPIにあたります。

 

zu01

 

もっと具体的な説明
通常、WebブラウザでWebサーバーのデータにアクセスすると、HTMLデータが返却されます。これが、Webサイトを見るということ。
WebAPIにアクセスすると、HTML形式よりもプログラムに利用しやすい形式のデータが返却されます。
プログラムで扱うデータには、HTML形式のタグやCSSといった情報は不要で、単純に「x=y(xの値はyである)」などと書かれたシンプルな定義のほうが効率的なのです。
具体的には

といったゲームのスコアデータや、

といったお天気データなど。
これはJSON形式(JSONP形式)の例です。
他にもXML形式などがあります。

 

JSON = JavaScript Object Notation
JavaScriptの表記法を用いて考案されたデータ記述言語。

 

JavaScriptとWebAPI

さまざまなプログラム言語で様々なWebAPIを利用する(呼ぶ・叩く)ことができますが、JavaScriptの場合に最も扱いやすいWebAPIのデータ形式は、JSON形式です。
ほとんどのWebAPIでJSON形式がサポートされています。

 

巨人の肩の上に立つ
みなさんもよくご存知かと思いますが、20世紀後半に現れたインターネットという技術には、距離の隔たりを解消して地球を丸ごと神経回路のようにつなぐ役割が期待されています。
有史以来、世界には情報があふれていますが、そのすべてにアクセス可能になり、すべてが密接に結びつき合い、人類の知に翼を持たせることがインターネット原理主義的な理想であると言えます。(例えばGoogle.incのミッションは「すべての情報にインデックスを付けること」だと謳われています。)

その「理想的な」世界を実現する具体的な方法のひとつが、まさにWebAPIなのです。
すでにこの世界に存在するはずの膨大なデータを用いることで、プログラマーは歴史上これまでになく新しい、社会の問題解決方法を提示することができるでしょう。

随分大げさな言い方をしましたが、WebAPIというもののダイナミズムは、使ってみればすぐに分かっていくと思います。

api1

比較演算子

比較演算子は、左辺と右辺を比較して、trueかfalseを返します。

if文(条件分岐)で使用します。

  • コメント欄の文字数はオーバーしていないか?
  • 今ログインしているユーザーは、一般ユーザーか管理者か?
  • 現在時刻は午前か?午後か?
  • 日本からアクセスしているのか?海外からか?

こんな風につかいます。

 

x < y

xがyより小さいかどうか(小さい時にtrueを返す)

x > y

xがyより大きいかどうか

x <= y

xがy以下かどうか

x >= y

xがy以上かどうか

x == y

xとyが等しいかどうか

x != y

xとyが等しくないかどうか

x === y

xとyが等しく、さらにが同じかどうか

x !== y

xとyが等しくない、またはが違うかどうか

 

型とは、リテラルの種類のことです。

文字列型、数値型、論理値型など。

 

論理演算子

!

値がfalseかどうか。

例)!x

&&

左辺と右辺がともに正しいかどうか。

例)x==y && a==b

xとyが等しく、さらにaとbも等しいかどうか。

||

左辺と右辺のいずれかが正しいかどうか。

例)x>y || a>b

xがyより大きいか、またはaがbより大きいかどうか。