对象的判空
- 将json对象转化成json字符串，然后进行判断是否等于字符串‘{}‘，直接写{}无法进行判断
let isObject = {};console.log(JSON.stringify(isObject) == ‘{}‘);- 使用for循环来判断，若不为空，则返回false
let listObject = { a: 1, b: 3, c: 4 };function isEmptyObject() { ???for(let key in listObject) { ???????return false; ???} ???return true;}console.log(isEmptyObject());- 使用Object.keys()来判断，返回的是一个数组，根据数组长度来判断
function isEmptyObject2(obj) { ???return Object.keys(obj).length == 0;}console.log(isEmptyObject2(isObject));- 对这个对象中一定存在的属性进行判断
console.log(isObject.id == null);
用对象的属性查找数组里的对象
var inventory = [ ???{name: ‘apples‘, quantity: 2}, ???{name: ‘bananas‘, quantity: 0}, ???{name: ‘cherries‘, quantity: 5}];function findCherries(fruit) { ????return function(value){ ??????return value.name == fruit ???}}console.log(inventory.find(findCherries(‘cherries‘))); // { name: ‘cherries‘, quantity: 5 }将对象转换成数组
Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组，值的顺序与使用for...in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。
var obj = { foo: ‘bar‘, baz: 42 };console.log(Object.values(obj)); // [‘bar‘, 42]// array like objectvar obj = { 0: ‘a‘, 1: ‘b‘, 2: ‘c‘ };console.log(Object.values(obj)); // [‘a‘, ‘b‘, ‘c‘]// array like object with random key ordering// when we use numeric keys, the value returned in a numerical order according to the keysvar an_obj = { 100: ‘a‘, 2: ‘b‘, 7: ‘c‘ };console.log(Object.values(an_obj)); // [‘b‘, ‘c‘, ‘a‘]// getFoo is property which isn‘t enumerablevar my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });my_obj.foo = ‘bar‘;console.log(Object.values(my_obj)); // [‘bar‘]// non-object argument will be coerced to an objectconsole.log(Object.values(‘foo‘)); // [‘f‘, ‘o‘, ‘o‘]Object.values()详细参考地址：《MDN：Object.values(obj)》
将类数组对象转换成数组
- Array.prototype.slice.call(arguments)或者
[].slice.call(arguments)
/* 该方法可以将类数组对象转换为数组，所谓类数组对象，就是含 length 和索引属性的对象* ?返回的数组长度取决于对象 length 属性的值，并且非索引属性的值或索引大于 length 的值都不会被返回到数组中* ?Array.prototype.slice.call(obj,start,end) start:方法中slice截取的开始位置，end终止位置，默认从0开始* */let testObject = { ???0: ‘a‘, ???1: ‘b‘, ???2: ‘c‘, ???name: ‘admin‘, ???length: 3,};/* 对象中必须定义length，且属性值不能为非数字，非数字无法返回 */console.log(Array.prototype.slice.call(testObject));/* 或者简写为[].slice.call(testObject) */console.log([].slice.call(testObject));- Array.from()
/* Array、Set、Map 和字符串都是可迭代对象（WeakMap/WeakSet 并不是可迭代对象）* ?这些对象都有默认的迭代器，即具有 Symbol.iterator 属性* ?所有通过生成器创建的迭代器都是可迭代对象* ?可以用 for of 循环 * */let testObject2 = { ???0: ‘a‘, ???1: ‘b‘, ???2: ‘c‘, ???name: ‘admin‘, ???length: 3,};console.log(Array.from(testObject2));判断是否为数组
let temporaryArray3 = [1,2,1,2,3];console.log(temporaryArray3 instanceof Array);console.log(temporaryArray3.constructor == Array);console.log(Array.isArray(temporaryArray3));console.log(Object.prototype.toString.call(temporaryArray3) === "[object Array]");
将数组转换成键值对对象
let transformObject = Object.assign({}, temporaryArray3);console.log(transformObject);let transformObject2 = {...temporaryArray3};console.log(transformObject2);深拷贝与浅拷贝
较常用的对象深拷贝方法：
let copyObject = JSON.parse(JSON.stringify(obj));
- Object.assign
assign对对象分配赋值,实现浅拷贝，但是它有一个特殊的地方，可以处理第一层的深拷贝。
assign(targetObject, obj, obj1) assign会改变targetObject的值，较好的做法就是将targetObject定义为空对象{}
assign是将这个3者合并，若有相同的属性，后面的属性会覆盖前面对象的属性
let temporaryObject2 = {a: 1, d: {e: 3}};let temporaryObject3 = {b: 1,a: 2};let mergeObject = Object.assign({}, temporaryObject2, temporaryObject3);console.log(mergeObject);/* mergeObject.d.e不会改变temporaryObject2里a的值，但会改变temporaryObject2里e的值 */mergeObject.a = 5;mergeObject.d.e = 5;console.log(mergeObject);- 数组slice浅拷贝
let copyArray1 = copyArray.slice(0);
- 数组concat浅拷贝
let copyArray2 = copyArray.concat();
Date类的相关例
// 以chrome为例new Date();// Mon Oct 23 2017 23:38:02 GMT+0800 (CST)new Date(false);// Thu Jan 01 1970 08:00:00 GMT+0800 (CST)new Date(0);// Thu Jan 01 1970 08:00:00 GMT+0800 (CST)new Date(null);// Thu Jan 01 1970 08:00:00 GMT+0800 (CST)new Date(‘‘);// Invalid Datenew Date(undefined);// Invalid Date
详情参考：你可能不知道的 Date 类
JS 将有父子关系的数组转换成树形数据
data.forEach(ele => { ?????let parentId = ele.parentId; ?????if (parentId === 0) { ???????//是根元素的hua ,不做任何操作,如果是正常的for-i循环,可以直接continue. ?????} else { ???????//如果ele是子元素的话 ,把ele扔到他的父亲的child数组中. ???????data.forEach(d => { ?????????if (d.id === parentId) { ???????????let childArray = d.child; ???????????if (!childArray) { ?????????????childArray = [] ???????????} ???????????childArray.push(ele); ???????????d.child = childArray; ?????????} ???????}) ?????} ???}); ???//去除重复元素 ???data = data.filter(ele => ele.parentId === 0); ???console.log(‘最终等到的tree结构数据: ‘, data);前端通过Blob下载文件流
先看下网上一个简单的代码片段：
let blob = new Blob([res], { ???type: `application / pdf` //word文档为msword,pdf文档为pdf});let objectUrl = URL.createObjectURL(blob);let link = document.createElement("a");let fname = `我的文档`; //下载文件的名字link.href = objectUrl;link.setAttribute("download", fname);document.body.appendChild(link);link.click();全面：
/** * @param {String} resource 文件流 * @param {String} fileType 文件类型 * @param {String} fileName 文件名 * */var downloadBlob=function(resource,fileType,fileName){ ???var data = new Blob([resource],{ ???????type:fileType ???}); ???if(‘download‘ in document.createElement(‘a‘)){ //非IE ???????var downloadUrl = window.URL.createObjectURL(data); ???????var anchor = document.createElement("a"); ???????anchor.href = downloadUrl; ???????anchor.download = fileName; ???????anchor.style.display = ‘none‘; ???????document.body.appendChild(anchor); ???????anchor.click(); ???????window.URL.revokeObjectURL(anchor.href); ????????document.body.removeChild(anchor); ???}else{ //IE10+下载 ???????navigator.msSaveBlob(data, fileName); ???} ???}调用方式：
downloadBlob(res,‘application/pdf‘,‘文档名称‘)
WEB前端资源代码：常用篇
原文地址：https://www.cnblogs.com/moqiutao/p/9848991.html