JSON对象和JSON字符串的区别

最新推荐文章于 2024-07-12 16:42:46 发布

柠夏小白

最新推荐文章于 2024-07-12 16:42:46 发布

阅读量491

点赞数

分类专栏： AJAX 文章标签： json javascript 前端

本文链接：https://blog.csdn.net/a2417841572/article/details/122343982

版权

AJAX 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

源码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>JSON通常用于与服务器交换数据</title>
		<script type="text/javascript"></script>
		<style>
		h2{text-align: center;}
		p{text-indent: 0.9em;}//首行缩进 
		</style>
	</head>
	<h2 style="text-align: center;">JSON对象和JSON字符串的区别</h2>
	<div id="object">
		<h3>1.JSON对象</h3>
		<p>JSON对象保存在大括号内。</p>
		<p>就像在JavaScript中，对象可以保存多个键/值对;对象的属性是可以用"对象.属性"来进行调用，例下：</p>
		<p>
		<img src="img/one.png" />
		<label>
		var student={"name":"小麦","sex":"女","age":"17"}; //json对象
		alert(student.name); //输出 小麦 
		alert(typeof student); //输出 object
		</label>
		</p>
	</div>
	<div id="string">
		<h3>2.JSON字符串</h3>
		<p>字符串，我们常说的JavaScript中的字符串是单引号或者双引号引起来的。</p>
		<p>student就是一个json字符串，之所以叫json字符串，因为字符串的格式符合json的格式，第三行代码也匹配其中的类型为string。</p>
		<p>
		<img src="img/two.png" >
		<label>
		var student = '{"name":"小麦","sex":"女",age:"17"}';//json字符串
		alert(student);//输出 {"name":"小麦","sex":"女",age:"17"}
		alert(typeof student)//输出 string
		</label>
		</p>
	</div>
	<div id="string-object">
		<h3>3.JSON字符串转JavaScript对象</h3>
		<p style="color: red;">语法说明：<img src="./img/grammar.png" /> </p>
		<p>首先，创建JavaScript字符串，字符串为JSON格式的数据</p>
		<p>然后，使用JavaScript内置函数JSON.parse()将字符串转换为JavaScript对象,输出newStudent.name</p>
		<p>
		<img src="img/three.png" >
		<label>
        var student='{"name":"小茗","sex":"男","age":"19"}'; //json字符串
		var newStudent = JSON.parse(student);//字符串转对象
		alert(newStudent.name);//输出 小茗
		</label>
		</p>
	</div>
	<div id="object-string">
		<h3>4.JavaScript对象转JSON字符串，调用stringify()方法</h3>
		<p style="color: red;">语法说明：<img src="./img/grammar1.png" /> </p>
		<p>
		<img src="img/four.png" >
		<label>
		var student={"name":"小茗","sex":"男","age":"19"}; //json字符串
		var newStudent = JSON.stringify(student);//对象转字符串
		alert(newStudent);//输出  {"name":"小茗","sex":"男","age":"19"}
		</lable>
		</p>
	</div>
	<body>
		<!-- <script>
		var student={"name":"小麦","sex":"女","age":"17"}; //json对象
		alert(student.name); //输出 小麦 
		alert(typeof student); //输出 object
		
		
		var student = '{"name":"小麦","sex":"女",age:"17"}';//json字符串
		alert(student);//输出 {"name":"小麦","sex":"女",age:"17"}
		alert(typeof student)//输出 string
		
		
		var student='{"name":"小茗","sex":"男","age":"19"}'; //json字符串
		var newStudent = JSON.parse(student);//字符串转对象
		alert(newStudent.name);//输出 小茗
		
				
		var student={"name":"小茗","sex":"男","age":"19"}; //json字符串
		var newStudent = JSON.stringify(student);//对象转字符串
		alert(newStudent);//输出  {"name":"小茗","sex":"男","age":"19"}
		</script> -->
	</body>
</html>

在这里插入图片描述

柠夏小白

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JSON对象和JSON字符串的区别

源码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>JSON通常用于与服务器交换数据</title> <script type="text/javascript"></script> <style> h2{text-align: center;} p{text-indent: 0.9em;}//首行缩
复制链接

扫一扫