PHPを使用して配列をJSに渡してデータを処理する方法

最近 Web アプリケーションを開発する場合、PHP と JS 間のデータ転送、特に配列などの複雑なデータ構造の転送が頻繁に発生します。この記事では主に、PHPを使ってJSに配列を渡し、そのデータをJSで利用する方法を紹介します。

1. PHP 配列を JSON 形式に変換する

PHP では、配列を直接使用してデータを保存できます。ただし、JS では、配列は通常、JSON (JavaScript Object Notation) 形式で表されます。 JSON は、理解しやすく、処理しやすい軽量のデータ交換形式です。したがって、PHP 配列を JS に渡す前に、配列を JSON 形式に変換する必要があります。

PHP には、PHP 配列を JSON 形式に変換できる組み込み関数 json_encode() が用意されています。サンプル コードは次のとおりです。

<?php
$array = array(
    'name' => '张三',
    'age' => 25,
    'interests' => array('篮球', '游泳', '音乐')
);
$json = json_encode($array);
echo $json;
?>

上記のコードでは、連想配列 $array を定義し、JSON 形式に変換し、echo ステートメントを使用して JSON を画面に出力します。出力結果は次のとおりです:

{"name":"张三","age":25,"interests":["篮球","游泳","音乐"]}

2. JS での JSON データの解析

JS では、組み込みの JSON オブジェクトを使用して JSON データを解析できます。 JSON オブジェクトには、parse() と stringify() という 2 つの主なメソッドがあります。このうち、parse() メソッドは JSON 文字列を解析して JS オブジェクトまたは配列に変換するために使用され、stringify() メソッドは JS オブジェクトまたは配列を JSON 文字列に変換するために使用されます。

以下は、JSON.parse() メソッドを使用して前のセクションの JSON データ出力を解析するサンプル コードです。

var json = '{"name":"张三","age":25,"interests":["篮球","游泳","音乐"]}';
var obj = JSON.parse(json);
console.log(obj.name);          //输出：张三
console.log(obj.age);           //输出：25
console.log(obj.interests[0]);  //输出：篮球

上記のコードでは、JSON 文字列 json を定義します。を取得し、JSON.parse() メソッドを使用してそれを JS オブジェクト obj に解析します。次に、obj のプロパティにアクセスして、配列内のデータを取得できます。

JSON 文字列形式が正しくない場合、parse() メソッドは例外をスローすることに注意してください。

3. JSON データを JS に渡す

これで、PHP で配列を JSON 形式に変換し、JS で JSON データを解析する方法はすでにわかりました。次に、JSON データを JS に渡す方法を見てみましょう。

JSON データを JS に渡す一般的な方法は 2 つあります。JSON 文字列を JS 変数として直接使用する方法と、AJAX テクノロジを使用してサーバーから JSON データを取得する方法です。

1. JSON 文字列を JS 変数として使用する

この方法は、すでに JSON 文字列がある状況に適しています。 JSON 文字列を JS 変数として直接使用できます。

以下は、JSON 文字列を JS 変数として使用するサンプル コードです:

<?php
$array = array(
    'name' => '张三',
    'age' => 25,
    'interests' => array('篮球', '游泳', '音乐')
);
$json = json_encode($array);
?>
<script type="text/javascript">
var json = '<?php echo $json; ?>';
var obj = JSON.parse(json);
console.log(obj.name);          //输出：张三
console.log(obj.age);           //输出：25
console.log(obj.interests[0]);  //输出：篮球
</script>

上記のコードでは、PHP コードで JSON 文字列を生成し、それを JavaScript 変数に渡しました。ジェソン。次に、JSON.parse() メソッドを使用して json 文字列を解析し、obj のプロパティにアクセスして配列内のデータを取得します。

JSON 文字列に一重引用符や二重引用符などの特殊文字が含まれている場合、JS コード エラーが発生する可能性があることに注意してください。これを回避するには、JSON 文字列でエスケープ文字を使用する必要があります。

2. AJAX を使用して JSON データを取得する

JSON データをサーバーから動的に取得する必要がある場合は、AJAX (Asynchronous JavaScript and XML) テクノロジを使用できます。 AJAX は、ページを更新せずにサーバーにリクエストを送信してデータを取得し、そのデータをページに表示できます。

以下は、AJAX を使用して JSON データを取得するサンプル コードです。

<?php
$array = array(
    'name' => '张三',
    'age' => 25,
    'interests' => array('篮球', '游泳', '音乐')
);
$json = json_encode($array);
?>
<script type="text/javascript">
//创建XMLHttpRequest对象
var xhr;
if(window.XMLHttpRequest) {
    xhr = new XMLHttpRequest();  //IE7+、Firefox、Chrome、Opera、Safari
} else {
    xhr = new ActiveXObject("Microsoft.XMLHTTP");  //IE6、IE5
}

//发送AJAX请求
xhr.open('GET', 'get_json.php');
xhr.onreadystatechange = function() {
    if(xhr.readyState == 4 && xhr.status == 200) {
        var json = xhr.responseText;
        var obj = JSON.parse(json);
        console.log(obj.name);          //输出：张三
        console.log(obj.age);           //输出：25
        console.log(obj.interests[0]);  //输出：篮球
    }
}
xhr.send();
</script>

上記のコードでは、XMLHttpRequest オブジェクトを使用して AJAX リクエストを作成します。次に、open() メソッドを呼び出してリクエスト接続を開き、リクエスト メソッドを GET に設定し、リクエストされた URL を get_json.php に設定します。次に、AJAX リクエストのステータスが変化したときに返されたデータを処理するために、onreadystatechange イベント処理関数を設定します。最後に、send() メソッドを呼び出して AJAX リクエストを送信しました。

AJAX リクエストを使用する場合、リクエストされた URL が正しいこと、およびサーバーがリクエスト パラメータを正しく解析して JSON 形式でデータを返すことができることを確認する必要があることに注意してください。

4. 概要

Web アプリケーション開発では、多くの場合、複雑なデータ構造 (配列など) を PHP から JS に渡す必要があります。この目標を達成するには、PHP 配列を JSON 形式に変換し、JSON データを JS で解析します。ここでは、JSON データを渡す 2 つの方法を紹介します。JSON 文字列を JS 変数として直接使用する方法と、AJAX テクノロジーを使用してサーバーから JSON データを取得する方法です。実際の開発では、効率的なデータ転送を実現するために、状況に応じて適切な方法を選択する必要があります。

以上がPHPを使用して配列をJSに渡してデータを処理する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。