0

0

php和js如何通过json互相传递数据相关问题探讨

高洛峰

高洛峰

发布时间:2016-12-01 15:01:28

|

1426人浏览过

|

来源于php中文网

原创

当我们在结合php和javascript实现某些功能时,经常会用到json。json是js的一种数据格式,可以直接被js解析。而php无法直接读取json数据,但是php提供了json_decode函数来对json数据进行转化,从而可以被php脚本访问。同时,php也提供了json_encode函数来将数据转化成json格式。那么,js中的原生json与php中通过json_encode函数转化后的json是否完全一样呢?今天,站长就和大家一起来探讨这个问题。

我们通过php向javascript传递数组数据时,通常要将其转化为json格式,一遍javascript来获取,那么我们就以数组为例,先来看一下两者之间的区别。 

1、一维数组 
考虑php数组 
复制代码 代码如下: 
$array=array("1","2","3"); 

使用json_encode函数转化后,对应的json字符串为 
复制代码 代码如下: 
["1","2","3"]。 

细心的朋友很快就发现,转化后得到的json字符串,就是javascript中的数组形式,那么是否可以用js的数组访问方式来访问呢? 
当然是可以的,但是你将这个json字符串传递给给js时,需要使用urlencode函数对其编码,如: 
复制代码 代码如下: 
 
我们可以用下面的js代码来验证: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r(decodeuri(str)); 
alert(jobj[2]); 


大家自己试一试就会发现,是的,可以用js中访问一维数组的方式来访问它。eval方法将json字符串解释为json对象,因为传递过来的是字符串,不转化的话,你得到将是字符串中第三个字符的值。 
我们再来对这个一维数组做一下变化,我们发现上面的一维数组没有指定索引,所以它默认为数字索引,现在我们来给它加上键名: 
考虑php数组 
复制代码 代码如下: 
$array=array('a'=>'1','b'=>'2','c'=>'3'); 

使用json_encode函数转化后,对应的json字符串为 
复制代码 代码如下: 
{"a":"1","b":"2","c":"3"} 

。 
我们很快就发现了其中的不同,最明显的就是字符串两端的[]变成了{},那么这个字符串是否也可以按上面那样处理后被js访问呢?我们不防试一试: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r(decodeuri(str)); 
alert(jobj.a); 


大家如果动手试了就知道,点击链接后,没有出现弹窗。为什么呢?是php生成的json字符串格式不对吗?不是的,这是我们在使用eval函数解释的时候,出错了。把上面的函数代码换成: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r('('+decodeuri(str)+')'); 
alert(jobj.a); 


再试试吧!怎么样,可以访问了吧。这告诉我们,在使用eval方法处理带有键名的json字符串时,需要在字符串两端加速括号。至于为什么,站长也不知道,站在巨人的肩膀上而已。 
这里要注意,尽管php生成的json字符串 
{"a":"1","b":"2","c":"3"}被传递给js后无法被直接解释为json格式,但是如果你在js中使用该字符串直接创建json数据,是可以的。试试下面的代码吧: 
复制代码 代码如下: 
var jobj={"a":"1","b":"2","c":"3"}; 
alert(jobj.b); 

2、二维数组 
二维数组在php用的应用非常广泛,因此了解二维数组转化后的json格式非常重要。有了上面的例子做铺垫,下面站长就直接给出示例代码: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r(decodeuri(str)); 
alert(jobj[0][0]); 


大家运行,会发现,这跟一维数组差不多,这是不带键名的例子,因此在show函数中,去掉字符串两端的括号也是可以的。 
下面,我们对二维数组进行一下变化,在第二维中加入键名,请看示例代码: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r('('+decodeuri(str)+')'); 
alert(jobj[0].a); 


大家运行代码后,发现,这里我们访问json数据的方式有点不一样。上面我们用的是 
alert(jobj[0][0]); 
而这里我们用的是 
alert(jobj[0].a);不要问我为什么,就是这样。这就是json的访问方式。 
上面的例子,我们对二维数组的第二维添加了键名,下面我们对第一维添加键名,看看访问方式又有什么不同: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r('('+decodeuri(str)+')'); 
alert(jobj.k[1]); 


这里我们使用的是 
jobj.k[1]这样的方式,大家一定已经发现了,只要数组中含有键名,当数组被转化为json格式后,就要使用 
json对象.键名 
这样的方式来访问该键下的元素,上面的例子中,k键下的数组元素是数字索引,所以在json中使用k[1]这样的方式来访问。 
下面,我们对数组的第一维和第二维都添加键名: 
复制代码 代码如下: 
function show(str){ 
var jobj=eval_r('('+decodeuri(str)+')'); 
alert(jobj.k.a); 


正如上面所提到的,只要含有键名,就必须以 
json对象.键名 
的方式来访问,如果有多个键就要用 
json对象.键名.键名... 
,不要问我为什么,这就是json的访问方式,只有javascript的发明者能向你解释,他为什么要这样规定。 
结论: 
1、将php中的数组转化为json字符串传递给js时。如果数组没有指定键名,那么可以直接使用js的eval方法将其转化为json格式供js处理;如果数组中含有键名,那么在使用eval方法处理时,需要使用 
() 
将json字符串括起来。 
2、如果数组中含有键名,转化为json字符串后,在js中要用 
json对象.键名.键名... 
的方式来访问,如果是数字索引则用 
json对象[1] 
或者 
json对象.键名[1] 
这样的方式。 
上面,我们主要讨论了,在php向js传递json字符串时,需要注意的事项。下面我们再来讨论,用js向php传递json字符串时需要如何处理。 
聪明的你肯定已经知道了,只要将json数据用引号引起来作为字符串传递给php【通常用ajax进行】就可以用json_decode函数解码了。没错!就是这样!但是在构造json字符串的时候一定要仔细,如果你不经常构造json字符串,那么不妨用 
echo json_encode(array('k'=>array("a"=>'1','2','3'))) 
这样的方式,查看你需要构造的目标字符串的json格式。这样你就可以在js中根据你想要的结果来构造了! 
好了,今天对php和js之间如何使用json数据进行通信就讨论到这里,大家可以自己再试试将php的对象类型进行json编码后如何传递给js。

相关文章

PHP速学教程(入门到精通)
PHP速学教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

php

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
Python 序列化
Python 序列化

本专题整合了python序列化、反序列化相关内容,阅读专题下面的文章了解更多详细内容。

0

2026.02.02

AO3官网入口与中文阅读设置 AO3网页版使用与访问
AO3官网入口与中文阅读设置 AO3网页版使用与访问

本专题围绕 Archive of Our Own(AO3)官网入口展开,系统整理 AO3 最新可用官网地址、网页版访问方式、正确打开链接的方法,并详细讲解 AO3 中文界面设置、阅读语言切换及基础使用流程,帮助用户稳定访问 AO3 官网,高效完成中文阅读与作品浏览。

91

2026.02.02

主流快递单号查询入口 实时物流进度一站式追踪专题
主流快递单号查询入口 实时物流进度一站式追踪专题

本专题聚合极兔快递、京东快递、中通快递、圆通快递、韵达快递等主流物流平台的单号查询与运单追踪内容,重点解决单号查询、手机号查物流、官网入口直达、包裹进度实时追踪等高频问题,帮助用户快速获取最新物流状态,提升查件效率与使用体验。

27

2026.02.02

Golang WebAssembly(WASM)开发入门
Golang WebAssembly(WASM)开发入门

本专题系统讲解 Golang 在 WebAssembly(WASM)开发中的实践方法,涵盖 WASM 基础原理、Go 编译到 WASM 的流程、与 JavaScript 的交互方式、性能与体积优化,以及典型应用场景(如前端计算、跨平台模块)。帮助开发者掌握 Go 在新一代 Web 技术栈中的应用能力。

11

2026.02.02

PHP Swoole 高性能服务开发
PHP Swoole 高性能服务开发

本专题聚焦 PHP Swoole 扩展在高性能服务端开发中的应用,系统讲解协程模型、异步IO、TCP/HTTP/WebSocket服务器、进程与任务管理、常驻内存架构设计。通过实战案例,帮助开发者掌握 使用 PHP 构建高并发、低延迟服务端应用的工程化能力。

5

2026.02.02

Java JNI 与本地代码交互实战
Java JNI 与本地代码交互实战

本专题系统讲解 Java 通过 JNI 调用 C/C++ 本地代码的核心机制,涵盖 JNI 基本原理、数据类型映射、内存管理、异常处理、性能优化策略以及典型应用场景(如高性能计算、底层库封装)。通过实战示例,帮助开发者掌握 Java 与本地代码混合开发的完整流程。

5

2026.02.02

go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

62

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

55

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

27

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
PHP课程
PHP课程

共137课时 | 10.8万人学习

JavaScript ES5基础线上课程教学
JavaScript ES5基础线上课程教学

共6课时 | 11.2万人学习

PHP新手语法线上课程教学
PHP新手语法线上课程教学

共13课时 | 0.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号