JSON


JSON

JavaScript Object Notation
JS对象表示法

JSON 格式

  1. 复合类型的值只能是数组或对象,不能是函数、正则表达式对象、日期对象。
  2. 原始类型的值只有四种:字符串、数值(必须以十进制表示)、布尔值和null(不能使用NaN, Infinity, -Infinityundefined)。
  3. 字符串必须使用双引号表示,不能使用单引号。
  4. 对象的键名必须放在双引号里面。
  5. 数组或对象最后一个成员的后面,不能加逗号。

JS中的对象只有JS自己认识,其他的语言都不认识
JSON就是一个特殊格式的字符串,这个字符串可以被任意的语言所识别,
并且可以转换为任意语言中的对象,JSON在开发中主要用来数据的交互
JSON和JS对象的格式一样,只不过JSON字符串中的属性名必须加双引号
其他的和JS语法一致
JSON分类:
1.对象 {}
2.数组 []

JSON中允许的值:
1.字符串
2.数值
3.布尔值
4.null
5.对象
6.数组

举例:

var arr = '[1,2,3,"hello",true]';

var obj2 = '{"arr":[1,2,3]}';

var arr2 ='[{"name":"孙悟空","age":18,"gender":"男"},{"name":"孙悟空","age":18,"gender":"男"}]';

JSON工具类

JSON.parse()

json 转 js对象

可以将以JSON字符串转换为js对象
它需要一个JSON字符串作为参数,会将该字符串转换为JS对象并返回

JSON.stringify()

JS对象 > JSON [-ify/fy,表示”使……化]

可以将一个JS对象转换为JSON字符串
需要一个js对象作为参数,会返回一个JSON字符串

JSON这个对象在IE7及以下的浏览器中不支持,所以在这些浏览器中调用时会报错,若要很好的解决它,就需要导入 一个 json包

other

localStorage

只读的localStorage 属性允许你访问一个Document 源(origin)的对象 Storage;其存储的数据能在跨浏览器会话保留。localStorage 类似 sessionStorage,但其区别在于:存储在 localStorage 的数据可以长期保留;而当页面会话结束——也就是说,当页面被关闭时,存储在 sessionStorage 的数据会被清除 。

eval()

eval()
这个函数可以用来执行一段字符串形式的JS代码,并将执行结果返回
如果使用eval()执行的字符串中含有{},它会将{}当成是代码块
如果不希望将其当成代码块解析,则需要在字符串前后各加一个()

eval()这个函数的功能很强大,可以直接执行一个字符串中的js代码,
但是在开发中尽量不要使用,首先它的执行性能比较差,然后它还具有安全隐患

var str = '{"name":"孙悟空","age":18,"gender":"男"}';  
var obj = eval("("+str+")");  

编码

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="UTF-8">  
        <title></title>  
        <script type="text/javascript">  

            /*  
             * 在字符串中使用转义字符输入Unicode编码  
             *     \u四位编码  
             */  
            console.log("\u2620");      
        </script>  
    </head>  
    <body>          
        <!--在网页中使用Unicode编码  
            &#编码; 这里的编码需要的是10进制  
        -->  
        <h1 style="font-size: 200px;">&#9760;</h1>  
        <h1 style="font-size: 200px;">&#9856;</h1>          
    </body>  
</html>  

confirm()用于弹出一个带有确认和取消按钮的提示框
需要一个字符串作为参数,该字符串将会作为提示文字显示出来
如果用户点击确认则会返回true,如果点击取消则返回false
var flag = confirm(“确认删除”+name+”吗?”);

原生js

原生js实现复制内容到剪切板

copy() {  
    const input = document.createElement("input");  
    document.body.appendChild(input);  
    input.setAttribute("value",this.solution.code);  
    input.select();  
    if (document.execCommand("copy")) {  
        document.execCommand("copy");  
        // console.log("复制成功");  
    }  
    document.body.removeChild(input);  
}  

文章作者: Liwker
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 Liwker !
评论
 上一篇
css3变量 和 less css3变量 和 less
less 简介less是一门预处理语言,它是一个css的增强版,通过less可以编写更少的代码实现更大的样式在less中添加了许多的新特性:像对变量的支持、对mixin的支持等等less的语法大体上和css语法一致,但是less中增添了许多
2021-02-16
下一篇 
js DOM js DOM
HTML DOMDocument Object Model文档对象模型,通过DOM可以来任意来修改网页中各个内容 文档 文档指的是网页,一个网页就是一个文档 对象 对象指将网页中的每一个节点都转换为对象 转换完对象以后,就
2021-02-07
  目录