认识JSON 结构

标签：include   clu   name   技术   员工信息   java   常量   arch   复用   

在现实的应用程序中， JSON 可作为异步请求的响应结果， 或者从JSON 提要( feed )中被检索。

网站一般会通过HTML 、CSS 和JavaScript 提供精美的视觉化用户界面。

但有些情况下， 数据供应商只专注于获取数据， 而数据提要则用于这一目的。

整体来讲， 提要是提供数据的一种粗糙方式， 其他人可对其加以复用，以在网站上显示数据;或者获取数据并在其上执行相关算法。

这一类数据提要一般较大， 且无法直接嵌入脚本标签中。

Include external javascript

This is a test program to learn how external javascript files can be included

当前示例中包含了example .j s 这一外部JavaScript 文件， 如下所示。

const x = "This is value of x and is being retrieved from external js file";

const 关键字用作变量标识符以表示不可变数据。一旦声明后， 常量x 便无法被重新赋值。

当从extemaljs.html 文件中访问位于example.j s 文件中的常量x 时， 需要在HTML 文件的脚本标签中编写程序。example.j s 文件须在与extemal尹.html 相同的文件夹中被创建， 对应的文件夹结构如图所示。

显示结果如下：

生成脚本调用，以获取外部JavaScript 文件， 下面采用相同的技术导入JSON 提要。

对此， 我们生成了包含100 条记录的employee JSON 数据提要以供测试使用。

在遍历JSON 提要时， 应注意数据的排列方式。

数据提要中的键是基本的员工信息， 如员工编号、出生日期、姓名、性别、雇用日期、职称，以及获得职称的日期。

另外，少数员工在整个任职内拥有同一职务， 而有些员工则拥有多个职务。

let data_json = [
{
"emp_no" : "10001",
"birth_date" : "1980-09-02",
"first_name" : "Georgi",
"last_name" : "Facello",
"gender" : "M",
"hire_date" : "2010-09-04",
"designation" : {
"title" : "Junior Engineer",
"From_date" : "2010-09-04",
"to_date" : "2017-10-11"
}
},
{
"emp_no" : "10002",
"birth_date" : "1970-09-02",
"first_name" : "Will",
"last_name" : "Scott",
"gender" : "M",
"hire_date" : "2005-09-04",
"designation" : {
"title" : ["Senior Engineer", "Author", "Trainer"],
"From_date" : "2005-09-04",
"to_date" : "2017-10-11"
}
},
{
"emp_no" : "10003",
"birth_date" : "1960-09-02",
"first_name" : "Jenny",
"last_name" : "Souza",
"gender" : "F",
"hire_date" : "2006-10-05",
"designation" : {
"title" : "Architect",
"From_date" : "2006-10-05",
"to_date" : "2017-10-11"
}
}
// And so on
]

考虑到将处理复杂的JSON 数据提要，对此， 需要将数据提要保存至某个文件中。在data json_feed.html 文件中， 我们导入了data.json 文件，该文件与HTML 文件处于同一个文件夹中。