PHP的json_encode()函数与JSON对象

一、问题描述
这周搬砖的时候，前端通过ajax获取后端的数据后，照例用 对象.属性 的方式取值，然而结果总是总是不能如预期般展示在页面上。
先写个 demo 还原下场景：选中一个下拉框列表选项后，会在下拉框下面展示文字。
这是下拉框的html部分：

<html>
<head>
    <title>JSON DEMO</title>
    <meta charset="UTF-8">
</head>
<body>
    <select id="device">
        <option value="">终端设备</option>
        <option value="1">PC Web</option>
        <!-- <option>...</option> -->
    </select>
    <div id="tip"></div>
</body>
</html>

PHP代码如下：用来返回数据（接收、处理过程略）

<?php
$onLines = [
    1 => 'PC Web',
    2 => 'iPad HD',
    5 => 'Touch'
];
echo json_encode(['data' => $onLines]);

JS代码如下：

<script type="text/javascript">
    $("#device").change(function() {
        var selectVal = $("#device").val();
        if (selectVal == '') {
            $("#tip").html('');
            return;
        }
        # code... ajax 部分的代码见下
    });
</script>

ajax 部分的代码用来接收从后端（PHP）传过来的数据，并处理。

$.ajax({
    url: 'device.php',
    type: 'post',
    dateType: 'json',
    data: {
        device: selectVal
    },
    success: function(result) {
        var onlineDevices = result.data;
        var onlineTip = '允许' + onlineDevices[selectVal] + '类型的2台设备同时在线。';

        $("#tip").html('');
        $("#tip").append(onlineTip);
    }
});

使用 console.log 在控制台输出结果，如下图所示，可以看到后端返回的数据是没有问题的，
再使用 typeof 查看返回的数据类型，前端收到的数据是JSON字符串！而不是JSON对象！

success: function(result) {
    console.log(result);
    console.log(result.data);
    console.log(typeof result);
}

二、解决方法
找到问题就好办了，只需要把 json 字符串转成 json 对象就好了，最简单的办法是 JSON.parse()。

success: function(result) {
    var onlineDevices = JSON.parse(result).data;
    # code ...
}

三、总结
1、json字符串和json对象的区别

// JSON 字符串
var str1 = '{"data":{"1":"PC Web","2":"iPad HD","5":"Touch"}}';
// JSON 对象
var str2 = {"data":{"1":"PC Web","2":"iPad HD","5":"Touch"}};
console.log(str1);
console.log(typeof str1);
console.log(str2);
console.log(typeof str2);

可以看到json字符串和json对象的形式很像，但前者比后者多了一对引号，其内容包含在引号里了。调试台的结果如下：

2、json字符串转为json对象的方法
后端

  • 设置header头中的内容类型，将 Content-Type 设置为 text/json。
    header(‘Content-Type:text/json;charset=utf-8‘);
    注：前端直接处理即可，不需要 JSON.parse() 处理。
    但项目中用的是框架，所有的PHP文件（业务层）均没有显式设置 header，虽然在demo中此方法有效，可依然不明白为什么别的地方返回的是json对象，而这里返回的却是json字符串了。
  • 强制类型转换(object) 此方法无效！
    如果将一个对象转换成对象，它将不会有任何变化。如果其它任何类型的值被转换成对象，内置标准类 stdClass 的一个实例将被建立。
    以上面的数组为例，强制类型转换的结果如下：
var_dump((object)['data' => $onLines]);
// 结果如下：
object(stdClass)#1 (1) {
  ["data"]=>
  array(3) {
    [1]=>
    string(6) "PC Web"
    [2]=>
    string(7) "iPad HD"
    [5]=>
    string(5) "Touch"
  }
}

而json_encode((object)[‘data‘ => $onLines]);得到的还是json字符串。

前端

  • var obj = JSON.parse(str);
    JSON.parse()方法，必须保证传入的是json字符串，如果是json对象会报错。
  • var obj = jQuery.parseJSON(str);
    parseJSON()方法是jQuery方法，仅支持标准json格式，否则会报错。
    下面这些是无效的 JSON 字符串：
"{test: 1}"
//test是属性名称，必须加双引号

"{'test': 1}"
//test是属性名称，必须用双引号(不能用单引号)

"'test'"
//test是属性名称，必须用双引号(不能用单引号)

"undefined"
//undefined 不能表示一个 JSON 字符串; null可以

"NaN"
//NaN 不能表示一个 JSON 字符串; 用Infinity直接表示无限也是不允许的

  • var obj = eval(‘(‘ + str + ‘)‘);
    eval()方法是js方法，也是必须保证传入的是json字符串，否则会报错。

四、疑惑
查了一下PHP的 json_encode()函数，PHP手册给出的结论是成功时返回字符串。
Return Values
Returns a JSON encoded string on success or FALSE on failure.

既然json_encode()函数返回的是字符串，为什么在项目中其他地方可以直接使用 对象.属性 的方式呢？

原文地址：https://www.cnblogs.com/sunshineliulu/p/10422677.html

时间： 2024-10-03 21:17:54

PHP的json_encode()函数与JSON对象的相关文章

处理复杂的JSON对象

转载请注明出处:http://www.uphtm.com/js/226.html 我们可以使用对象直接量作为一个JSON对象中的值,换句话说,对象直接量嵌套在对象直接量中,从而创建甚至更为复杂的信息集合. 这里有一个例子.假设我们希望服务器使用JSON送回多个人的联络信息.我们将向名为contacts.php的文件发送一个请求,带上一个查询字符串,指明希望返回多少个联络人的信息.代码可能如下所示: $.getJSON('contacts.php','limit=2’,processContact

PHP中json_encode()使用须知，JSON数组和JSON对象

body { font: 12px/1.5 Tahoma, Arial, Helvetica, sans-serif } ? 偷偷的告诉你,这是一个很不谨慎就会踩得坑 ?  如下代码 (看了一下很简单,没毛病啊,老铁) $arr = array( '0'=>'a','1'=>'b','2'=>'c','3'=>'d' ); echo json_encode($arr); 但是结果是 ["a","b","c","d

JSON对象和JSON字符串以及JSON.parse 函数的使用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JSON.parse()</titl

jquery中ajax如何返回值到上层函数的方法以及对于js处理json对象方法的记录

①在我们做前端js处理的时候我们经常会将一些公用的js方法封装起来,方便别的地方调用,但是我们要做的是需要将请求返回的值传递给调用者,这里我记录了在js中采用ajax方法获取后台数据并返回给调用者的方法,我们平时使用ajax的方法基本为如: <span style="font-family:FangSong_GB2312;font-size:18px;">function AutoGetOpenid(){ var personJson; $.ajax({ url : &qu

python笔记5：装饰器、内置函数、json

装饰器 装饰器本质上是一个Python函数,它可以让其他函数在不需要做任何代码变动的前提下增加额外功能,装饰器的返回值也是一个函数对象. 先看简单例子: def run(): time.sleep(1) print('run....') 现有一个新的需求,希望可以记录下函数的运行时间,需要在代码中计算时间的代码: def run(): start_time = time.time() time.sleep(1) print('run....') end_time = time.time() pr

Json对象与Json字符串互转(转载)

一.jQuery插件支持的转换方式 1 $.paseJSON(jsonstr);//将json字符串转换为json对象 二.浏览器支持的转换方式(Firefox,Chrome,Opera,Safair,IE9,IE8) 1 JSON.parse(jaonstr);//将json字符串转换为json对象 2 JSON.stringify(jsonobj);//将json对象转换为json字符串 注意:由于ie8(兼容模式),ie7和ie6没有JSON对象,需要使用JSON官方的方式,引入json.

Json对象与Json字符串互转(4种转换方式)

一.jQuery插件支持的转换方式 1 $.paseJSON(jsonstr);//将json字符串转换为json对象 二.浏览器支持的转换方式(Firefox,Chrome,Opera,Safair,IE9,IE8) 1 JSON.parse(jaonstr);//将json字符串转换为json对象 2 JSON.stringify(jsonobj);//将json对象转换为json字符串 注意:由于ie8(兼容模式),ie7和ie6没有JSON对象,需要使用JSON官方的方式,引入json.

JSON对象和String之间的互转及处理

如题,本文列举了一些在web前端开发中常用的转换及处理方式.使用JSON而不是字符串,主要是为了方便处理. JSON:JavaScript 对象表示法(JavaScript Object Notation),其实JSON就是一个JavaScript的对象(Object)而已. 如有不清楚JSON,可以去w3cschool了解http://www.w3school.com.cn/json/ 1.在javascript中新建一个字符串(JSON文本). var txt = '{ "employees

js中把JSON字符串转换成JSON对象最好的方法

在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用jQuery的each方法来遍历 用jQuery解析JSON数据的方法,作为jQuery异步请求的传输对象,jQuery请求后返回的结果是json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject等插件封装的JSON对象,与此亦是大同小异,这里不再做说明. 这里首先