json eslint

1、介绍

ESLint 是一个可扩展，每条规则独立，被设计为完全可配置的lint工具。
可以用来检测代码，避免低级错误
可以用来规范代码的开发风格，统一代码习惯。

2、为什么使用 ESLint ？

统一代码规范 :
在开发中，可能会遇到很多不同的同事同时开发一个项目 ，或者在工作的调整中，会有接手一个项目，
这时候，就会发现完全和自己的开发风格不同，该起来非常痛苦。ESLint 统一代码规范，是我们在不
同的项目更好的融入项目开发。
检测代码 :
在开发中，会遇到一些非常低级的错误，如 alert 发到生产， 少一个 { 等，用了 ESLint ，我们可以在提交代码前，进行代码检测，避免这些不必要的错误发到生产。

3、ESLint 项目中规范的方案

ESLint + Airbnb
ESLint + Standard
ESLint + Prettier
大概就三种方案，可以根据不同的需求/业务进行搭建。
　执行检查，并且格式化代码

    eslint --fix

4、ESLint + Airbnb 项目配置

• 全局安装依赖包：

    1
    npm install -g eslint
    1
    npm install -g eslint-config-airbnb eslint-plugin-import eslint-plugin-react eslint-plugin-jsx-a11y babel-eslint

• 配置 eslintrc 文件：

网上有配置好的文件

5、ESLint + Standard 项目配置

• 全局安装依赖包 ：

1     npm install -g eslint babel-eslint
2     npm install  eslint-config-standard eslint-config-standard-react eslint-plugin-standard eslint-plugin-promise eslint-plugin-import  eslint-plugin-react

6、 ESLint + Prettier 项目配置

• 全局安装依赖包：

1   npm install -g eslint
2   nam -g install eslint-plugin-prettier eslint-config-prettier babel-eslint prettier eslint-plugin-html --save-dev

• 配置

// .eslintrc
   {
  "extends": [    //使用的扩展库
    "taro",
    "prettier"
  ],
  "rules": {     //自行配置的规则
    "no-unused-vars": ["error", { "varsIgnorePattern": "Taro" }],
    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx", ".tsx"] }],
    "prettier/prettier": "error"
  },
  "parser": "babel-eslint",   // 解析器用于解析代码
  "plugins": ["prettier"]    // 第三方插件
}	

//prettier.config

module.exports = {
  printWidth: 80, //一行的字符数，如果超过会进行换行，默认为80
  tabWidth: 2, //一个tab代表几个空格数，默认为80
  useTabs: false, //是否使用tab进行缩进，默认为false，表示用空格进行缩减
  singleQuote: true, //字符串是否使用单引号，默认为false，使用双引号
  semi: true, //行尾是否使用分号，默认为true
  trailingComma: 'none', //是否使用尾逗号，有三个可选值"<none|es5|all>"
  bracketSpacing: true, //对象大括号直接是否有空格，默认为true，效果：{ foo: bar }
  parser: 'babylon' //代码的解析引擎，默认为babylon，与babel相同。
};

———————————————————————————————————————————————
JSON 是用于存储和传输数据的格式，通常用于服务端向网页传递数据

什么是 JSON?

JSON英文全称 JavaScript Object Notation(JavaScript 对象表示法)，是一种轻量级的用于存储和交换文本信息的语法，被设计用于可读的数据交换，类似 XML，但比 XML 更小、更快，JSON具有自我描述性，更易理解

JSON 简介

JSON是从 JavaScript 脚本语言中演变而来，使用Javascript语法来描述数据对象，文件名扩展是 .json，但是JSON格式仅仅是一个文本，仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON

JSON 使用范围

JSON 格式可以用于通过网络连接序列化和传输结构化数据，用于编写基于 JavaScript 应用程序，包括浏览器扩展和网站。JSON 主要用于在服务器和 Web 应用程序之间传输数据，Web 服务和 APIs 可以使用 JSON 格式提供公用数据，还可以用于现代编程语言中

语法

JSON的语法可以表示三种类型的值：

• 简单值：使用与Javascript相同的语法，可以在JSON中表示字符串、数值、布尔值和null，但是不支持Javascript中的特殊值undefined。
• 对象：对象作为一种复杂数据结构，表示的是一种无序的键值对。每个键值对中的值可以是简单值，也可以是复杂数据类型的值。
• 数组：数组作为一种复杂数据结构，表示一组有序的值的列表，可以通过数值索引来访问其中的值。数组的值可以是任何类型——简单值、对象或数组。

1）、简单值：

数值表示：5
　　字符串表示：“Hello World!”
　　JSON字符串与Javascript字符串最大的不同是，JSON字符串必须使用双引号（单引号会引发语法错误）。

2）、对象：

举一个Javascript对象来对比说明，下面是一个Javascript中的对象字面量：

    var man = {
          name: "McBye",
          age: 24
    };

而在JSON中，这个对象字面量就必须写成：

  {
        "name": "McBye",
        "age": 24
  }

可以看出三个区别：

• 没有声明变量，这是因为JSON中没有变量的概念；
• 没有末尾的分号，因为这不是Javascript语句，不需要分号；
• 对象的属性必须加双引号。

3）、数组：

JSON数组采用的是Javascript中的数组字面量形式。举例如下：
Javascript数组字面量：var man = [“McBye”, 24, “pku”, true];
JSON中表示的同一个数组：[“McBye”, 24, “pku”, true]
可以看到，JSON数组也没有变量和分号。
将数组和对象结合起来，可以构成更复杂的数据集合，例如上面的JSON数组可以扩充为以下：

[
   [
　　 　 "name": "McBye",
   　　 "age": 24,
    　　"college": [
       　　　　　　"pku",
    　　　　　　　　"eecs"
        ]
　　],
　　[
　　　　"name": "King",
　　　　"age": 20,
　　]
]      

操作json数据

1）序列化
即js中的Object转化为字符串
1.使用stringify

     var obj = {
          name: "McBye",
          age: 24,
          skills: undefine,
    };
    var last=JSON.stringify(obj); //将对象转化为JSON字符 ，用于将数据传给后端
    
    {"name":"McBye","age":24}

（2）反序列化
即js中JSON字符串转化为Object

• 1.使用eval
  var obj=eval("("+data+")");
  // 为什么要 eval这里要添加 “(”+data+")”呢？
  //原因在于：eval本身的问题。 由于json是以”{}”的方式来开始以及结束的，在JS中，它会被当成一个语句块来处理，所以必须强制性的将它转换成一种表达式。
• 2.使用parse
  var obj = JSON.parse(data); //由JSON字符串转换为对象，一般用于处理后端传给我们的JOSN数据