jQueryの$.getと$.postの内部動作を解説

$.get()と$.post()は別の機能ではありません

結論から書きます。
jQueryの`$.get()`と`$.post()`は専用の通信機能ではありません。

どちらも中身は`$.ajax()`です。

つまり、

  • $.get() … GETを指定した$.ajaxのショートカット
  • $.post() … POSTを指定した$.ajaxのショートカット

単なる省略記法です。
通信の仕組みが変わるわけではありません。

これを知らないと、「GETは軽くてPOSTは重い」「$.postの方が安全」といった誤解を持ちやすくなります。

実際の内部動作

まず、次のコードを見てください。

$.get("/api/user", function(data){
  console.log(data);
});

これは内部的にはほぼ次と同じ処理になります。

$.ajax({
  url: "/api/user",
  type: "GET",
  success: function(data){
    console.log(data);
  }
});

`$.post()`も同様です。

$.post("/api/login", {id:"user", pass:"1234"});

内部ではこう変換されます。

$.ajax({
  url: "/api/login",
  type: "POST",
  data: {id:"user", pass:"1234"}
});

つまり`$.get`と`$.post`は、新しい通信手段ではなく、
`$.ajax`の設定を自動で埋めるラッパー関数です。

GETとPOSTの違い(jQueryの話ではない)

ここで重要なのは、違いはjQueryではなくHTTPにあります。

項目 GET POST
用途 取得 送信
データ位置 URLクエリ リクエストボディ
キャッシュ される 通常されない
長さ制限 あり ほぼなし

jQueryはこのHTTPメソッドを指定しているだけです。

例えば次のコード:

$.get("/search", {q:"javascript"});

実際にはURLがこうなります。

/search?q=javascript

一方POSTはボディに入ります。

jQueryが自動で行っている処理

`$.get()`と`$.post()`は、次の面倒な処理を自動化しています。

1. クエリ文字列の生成**

{a:1, b:2}

は自動で

a=1&b=2

に変換されます。

2. URLエンコード**

日本語や記号を安全な形式に変換します。
開発者が`encodeURIComponent`を書く必要はありません。

3. Content-Type設定(POST時)**

POSTでは自動的に以下が付与されます。

application/x-www-form-urlencoded

これはサーバ側でフォーム送信として受け取れる形式です。

4. レスポンス解析**

JSONが返れば自動でオブジェクト化されます。

返り値にも重要な意味がある

`$.get()`と`$.post()`の返り値は単なる結果ではありません。
jqXHRオブジェクト(Deferred)です。

つまり次のように書けます。

$.get("/user").done(function(u){
  console.log(u);
});

ここが普通の関数との違いです。
通信開始と結果取得が分離されています。

注意点:$.postはJSON送信ではない

非常に多い誤解です。

$.post("/api", {name:"taro"});

これはJSON送信ではありません。
フォーム送信です。

サーバにはこう届きます。

name=taro

JSONとして送りたい場合は`$.ajax()`を使います。

$.ajax({
  url:"/api",
  type:"POST",
  contentType:"application/json",
  data: JSON.stringify({name:"taro"})
});

ここを間違えるとAPIと通信できません。
jQuery利用時の典型的なトラブルです。

キャッシュの挙動

GETはブラウザキャッシュされます。
そのため、同じリクエストを送っても通信が発生しない場合があります。

jQueryはこれを避けるため、内部で次を追加することがあります。

?_={timestamp}

いわゆるキャッシュバスターです。
開発時に「通信していないように見える」問題の回避策でした。

なぜ$.getと$.postが用意されたのか

理由は可読性です。

当時のWeb開発ではAjax通信が頻繁に書かれていました。
毎回`$.ajax({ type:"GET"... })`と書くのは冗長です。

  • 取得 → $.get
  • 送信 → $.post

とすることでコードの意図が明確になります。

つまり機能の違いではなく、読みやすさのためのAPIです。

まとめ

`$.get()`と`$.post()`はjQuery独自の通信方式ではありません。
`$.ajax()`の設定を簡略化したショートカットです。

違いはjQueryではなくHTTPの仕様にあります。
そして内部では、クエリ生成・エンコード・ヘッダ設定・レスポンス解析といった多くの処理を自動で行っています。

便利な関数ですが、JSON送信ではない点だけは注意が必要です。
ここを理解すると、jQueryのAjax通信の挙動が一気に読み解けるようになります。