js对数据常用处理方式 - 好文

**说明：**本文并没有对js处理数据进行深究，本人也不是专业前端人员，只是碰到js处理数据时，对当时的处理数据方式进行记录和总结，后续工作中碰到值得记录的会持续更新。

1、字符串转换成对象
代码：
var obj = JSON.parse(data); console.log(JSON.stringify(data.data));
说明：
①php中json_encode()转换返回给前端页面时，用“.”读取不到，是因为返回的是字符串格式，就是最外层带了引号的json数据格式，可以用var
obj = JSON.parse(data);转换成对象，也可以用tp框架中的$this->ajaxReturn();
②另外在vue中，有时候打印对象或者数组时，可能会出现看不懂其数据结构，可以用console.log(JSON.stringify(data.data));
打印出来，再复制出来，格式化结构。

2、js 判断一个 object 对象是否为空
if (JSON.stringify(data) === '{}') { return false // 如果为空,返回false，数组可以用同样的判断方式
} if (Object.keys(object).length === 0) { return false //
如果为空,返回false，Object.keys(object)会返回一个空数组[] }
3、数组中添加元素
代码：arr.push();
说明：
可以用arr.push()，在添加元素之前先确认变量arr是一个数组。可以自己定义var arr = []，并可以在数组中添加对象，例如
arr.push({"aa":"bb"})。

4、读取对象或这数组中的元素
var test = [{"a":"a"},{"b","b"}]; console.log(test[1].b); console.log(test[1].[
'b']);//不能用test.1.b
当键名是数字时，不能用“.”点拼接，只能用[]

5、当两个数组要根据各自某一个字段进行排序
举个例子，表格的表头和表中的值，分为了两个数组(如下)，表头和表中值要一一对应。另外，在Element的表格组件中，不用排序，其组件已做了排序的工作。

表头1 表头2 表头3
1 2 3
… … …
数组示例：数组1和数组2要根据key字段一一对应，可以根据这个字段先对两个数组进行排序，然后一一匹配，如冒泡排序等。
[ { "tabelHeader":"表头1", "key":"1" }, { "tabelHeader":"表头2", "key":"2" }, {
"tabelHeader":"表头3", "key":"3" } ] [ { "value":"2", "key":"2" }, { "value":"1",
"key":"1" }, { "value":"3", "key":"3" } ]
//根据数组中某个键的值冒泡排序，还有其他更优排序方式，这里不一一示例，可以搜索相关算法排序方式。 function bubbleSort(arr,
sortKey) { //console.time('2.快速排序耗时'); var len = arr.length; for (var i = 0; i <
len; i++) { for (var j = 0; j < len - 1 - i; j++) { if (arr[j][sortKey] > arr[j
+1][sortKey] ) { //相邻元素两两对比 var temp = arr[j+1]; //元素交换 arr[j+1] = arr[j]; arr[j
] = temp; } } } //console.timeEnd('222222.快速排序耗时'); return arr; }
6、转义与反转义兼容写法
代码：
//反转义 function HTMLDecode(text) { var temp = document.createElement("div");
temp.innerHTML = text; var output = temp.innerText || temp.textContent; temp =
null; return output; } //转义 function HTMLEncode(html) { var temp = document.
createElement ("div"); (temp.textContent != null) ? (temp.textContent = html) :
(temp.innerText = html); var output = temp.innerHTML; temp = null; return output
; }
说明：前端相关朋友说这么写是兼容性写法，我这里就不深究了，亲测可用。

7、剔除数组中的某些元素
目前只找到循环剔除，把需要的元素用push添加到新的数组中。使用splice
在循环中有问题，个人猜测是键名原因，未做深究，但我个人觉得肯定有更好方式，因为参照其他语言，都有更为简单的方式，知道的朋友请告知下，谢谢。
–更新–今天看到前端人员剔除数组中一些元素时，用到了filter函数，挺好用的。

8、将数组中字符串转换成整型
var arr = ["1","2","3"]; arr = arr.map(function (data) { return +data; });
//此时arr变成[1,2,3]
map是个好方法，我个人对map理解不深，对其使用有些别扭。

9、判断对象或数组中元素是否存在
typeof data.archiveRecordPage !== undefined
一搬如果typeof后边是表达式，就要用括号括起来，否则不用括起来。另外一般要判断该层级之前的层级也要存在
----更新： hasOwnProperty也可以对象某对象是否存在

10、将时间戳转换为时间格式

在网上找的一个示例，如果是php写的接口，一般是需要在返回的时间戳字段上乘以1000的，java写的接口一般不需要，这个与精确度有关。一个是精确到秒，一个是精确到毫秒。当然，在框架VUE中另有其他写法，这里暂时不做深究。
formatDate(timestamp) { var date = new Date(timestamp);
//时间戳为10位需*1000，时间戳为13位的话不需乘1000 var Y = date.getFullYear() + '-'; var M = (date
.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; var D =
(date.getDate() < 10 ? '0'+(date.getDate()) : date.getDate()) + ' '; var h = (
date.getHours() < 10 ? '0'+(date.getHours()) : date.getHours()) + ':'; var m = (
date.getMinutes() < 10 ? '0'+(date.getMinutes()) : date.getMinutes()) + ':'; var
s= (date.getSeconds() < 10 ? '0'+(date.getSeconds()) : date.getSeconds());
return Y+M+D+h+m+s; },
11、js判断数组中对象里的某一个值是否存在
function isInArray(arr,value){ for(var i = 0; i < arr.length; i++){ if(value
=== arr[i]['id']){ return true; } } return false; } var arr = [{id: "ccjl1"},{id
: "ccjl2"},{id: "ccjl3"}]; var test = isInArray(arr,'ccjl1'); console.log(test);

热门工具换一换