1.判断数据是否包含某些数据

var ary=[{age:20,name:"a"},{age:20,name:"b"},,{age:30,name:"c"}]

我们需要判断数据中否有有年龄为20的数据

var isExist= ary.some(v=>v.age==20);

2.对象合并

var user={name:"ray"};

var user2=Object.assign({}, user, {
title: "经理"
});

user2 为 {name:"ray",title:"经理"};

user2 是一个新的用户对象。

var user={name:"ray"}
var user2=Object.assign(user, {age:20});

这种方式和第一种方式不同在于,user 和 user2 是同一个对象。

3.数组是否包含某个数据

var users=["a","b"];

var isExist=users.includes("a");

4.数组遍历

使用 entries 进行遍历

var users=[{name:"a",age:20},{name:"b",age:20},{name:"c",age:30}]
for (const [i, v] of users.entries()) {
if (v.age === 20) {
users.splice(i, 1)
//break
}
}
console.info(users)

5.获取数据在数组中的索引

var ary=["a","b","c"]

var idx=ary.indexOf("c");

idx 为2.

 6.过滤数组的数据

var ary=[{age:20,name:"a"},{age:20,name:"b"},{age:30,name:"c"}]

var ary2=ary.filter(v=>v.age==20);

这个是过滤年龄为20的数据。

var ary3=ary.filter(function(v){return v.age==20})

使用函数效果是一样的。

7.三个点操作符

... 的作用是将数组转化成 使用逗号分隔的参数序列。

比如:

var a=[1,2,3];

var b=[4,5];
a.push(...b);

那么a 就变成了 [1,2,3,4,5]

1.合并数组

var a=[3,4];

var b=[1, 2, ...a];

b 变成了 [1,2,3,4];

2.日期参数

var date=[2014,5,16];
var d=new Date(...date);

3.将字符串转成数组

[...'你好2'].length 显示长度为3

8. nodejs 的path reslove 解释

作用:path.resolve() 该方法将一些的 路径/路径段 解析为绝对路径。

语法:path.resolve( [from…],to )

说明:将参数to位置的字符解析到一个绝对路径里,[from … ]为选填项,路径源;

用法:

var path = require("path")     //引入node的path模块

path.resolve('/foo/bar', './baz')   // returns '/foo/bar/baz'
path.resolve('/foo/bar', 'baz') // returns '/foo/bar/baz'
path.resolve('/foo/bar', '/baz') // returns '/baz'
path.resolve('/foo/bar', '../baz') // returns '/foo/baz'
path.resolve('home','/foo/bar', '../baz') // returns '/foo/baz'
path.resolve('home','./foo/bar', '../baz') // returns '/home/foo/baz'
path.resolve('home','foo/bar', '../baz') // returns '/home/foo/baz'

总结:从后向前,若字符以 / 开头,不会拼接到前面的路径;若以 ../ 开头,拼接前面的路径,且不含最后一节路径;若以 ./ 开头 或者没有符号 则拼接前面路径;

9.非常简洁的构建树形数据代码

我们在开发中经常会需要将一个数组的有父子关系的数据,转换成 一个树结构。

下面的代码可以很简单的实现这个功能。

var list=[
{id:1,parentId:0,name:"一级菜单A",rank:1},
{id:2,parentId:0,name:"一级菜单B",rank:1},
{id:3,parentId:0,name:"一级菜单C",rank:1},
{id:4,parentId:1,name:"二级菜单A-A",rank:2},
{id:5,parentId:1,name:"二级菜单A-B",rank:2},
{id:6,parentId:2,name:"二级菜单B-A",rank:2},
{id:7,parentId:4,name:"三级菜单A-A-A",rank:3},
{id:8,parentId:7,name:"四级菜单A-A-A-A",rank:4},
{id:9,parentId:8,name:"五级菜单A-A-A-A-A",rank:5},
{id:10,parentId:9,name:"六级菜单A-A-A-A-A-A",rank:6},
{id:15,parentId:0,name:"一级菜单C",rank:1},
{id:16,parentId:0,name:"一级菜单C",rank:1},
{id:17,parentId:0,name:"一级菜单C",rank:1},
{id:18,parentId:0,name:"一级菜单C",rank:1},
{id:19,parentId:0,name:"一级菜单C",rank:1},
{id:20,parentId:0,name:"一级菜单C",rank:1},
{id:37,parentId:0,name:"一级菜单C",rank:1},
{id:38,parentId:0,name:"一级菜单C",rank:1},
{id:39,parentId:0,name:"一级菜单C",rank:1},
{id:40,parentId:0,name:"一级菜单end",rank:1}
];
var tmp =list.filter(father=>{ // 循环所有项,并添加children属性
let branchArr = list.filter(child=>father.id == child.parentId); // 返回每一项的子级数组
branchArr.length>0 ? father.children=branchArr : '' //给父级添加一个children属性,并赋值
return father.parentId==0; //返回第一层
});
console.info(tmp)

 10.js map 方法使用

var ary=
[{"groupId":1,"hasChild":0,"name":"A","alias":"A","parentId":0},{"groupId":2,"hasChild":2,"name":"B","alias":"B","parentId":0}];
ary.map(o=>{
o.isLeaf=o.hasChild==0
})
console.info(ary)

map的作用是遍历数组,允许数组中的元素操作,将数组进行返回。

JS 基本操作的更多相关文章

  1. two.js基本操作

    今天介绍一个网络上并不常用的插件two.js,two.js是一款网页二维绘图软件,可以在指定区域内产生自设的各种动画效果 下载网址如下: https://two.js.org/#download 一: ...

  2. js基本操作

    js操作页面三步骤 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  3. 模仿WC.exe的功能实现--node.js

    Github项目地址:https://github.com/102derLinmenmin/myWc WC 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要 ...

  4. IOS-网络(网页开发-UIWebView,HTML,CSS,JavaScript,OC和JS代码互调)

    一.网页基础 // // ViewController.m // IOS_0218_网页开发1 // // Created by ma c on 16/2/18. // Copyright © 201 ...

  5. 如何让 JS 代码不可断点

    绕过断点 调试 JS 代码时,单步执行(F11)可跟踪所有操作.例如这段代码,每次调用 alert 时都会被断住: debugger alert(11) alert(22) alert(33) ale ...

  6. vue中解决时间在ios上显示NAN的问题

    最近在用vue,遇到倒计时在ios上显示为NAN的问题. 因为做的是倒计时支付,思路是获取服务器时间和下单时间,再转成秒级时间戳做差值. 在网上找到说是ios 不支持例如2018-09-01 10:0 ...

  7. js数组(列表)的基本操作

    本文主要介绍JS对数组(列表)的基本操作.习惯了用数据库的操作顺序来说明:增.删.改.查:合并,裁剪,排序,格式化. 一.数组元素的添加(增加) 增加数组元素有三种方法:unshift()  push ...

  8. H5JS二维动画制作!two.js的基本操作class1

    今天介绍一个网络上并不常用的插件two.js,刚开始学习的过程中,发现网上并没有合适的教程,在此发表基本操作 two.js是一款网页二维绘图软件,可以在指定区域内产生自设的各种动画效果 下载网址如下: ...

  9. js对WebApi请求的基本操作

    在WebAPI对外提供的,大概有4种接口,get,post,delete,put,现在,我就简单的来说一下js请求webApi的方式和大概的作用: get:在webApi中,get方法通常是用来获取数 ...

随机推荐

  1. 在pat考试中快速调整Dev-cpp颜色配置

    在菜单栏中:tool(工具)->Edit Options(编辑器环境) 点击General选项卡: 把Color调为黑色. 点击Color选项卡: 讲Select theme设置为Obsidia ...

  2. 题解 洛谷 P2010 【回文日期】

    By:Soroak 洛谷博客 知识点:模拟+暴力枚举 思路:题目中有提到闰年然后很多人就认为,闰年是需要判断的其实,含有2月29号的回文串,前四位是一个闰年那么我们就可以直接进行暴力枚举 一些小细节: ...

  3. vb.net 对字符串中的括号匹配进行判断,容许嵌套

    '   括号检查 '     括号共有四种:  1(英文圆括号),2(中文圆括号),3[方括号],4{花括号} '      要左右匹配(可以嵌套) Private Shared Function i ...

  4. 冰多多团队Gamma阶段发布说明

    Bingduoduo 语音Coding(Gamma):项目Github地址 Gamma版本新功能介绍 在gamma阶段我们推出了一个更加完整的IDE,完善了部分编辑器功能,并且优化了UI,增添了新的s ...

  5. docker-compose搭建zookeeper集群环境 CodingCode

    docker-compose搭建zookeeper集群环境 使用docker-compose搭建zookeeper集群环境 zookeeper是一个集群环境,用来管理微服务架构下面的配置管理功能. 这 ...

  6. TF-IDF算法简析

    TF-IDF算法可用来提取文档的关键词,关键词在文本聚类.文本分类.文献检索.自动文摘等方面有着重要应用. 算法原理 TF:Term Frequency,词频 IDF:Inverse Document ...

  7. [转帖]自动交互式脚本--expect

    自动交互式脚本--expect https://www.cnblogs.com/zhuiluoyu/p/4873869.html 我们经常会遇到一些需要与服务器程序打交道的场景,比如,从登陆某个服务器 ...

  8. Delphi支付宝支付【支持SHA1WithRSA(RSA)和SHA256WithRSA(RSA2)签名与验签】

    作者QQ:(648437169) 点击下载➨Delphi支付宝支付             支付宝支付api文档 [Delphi支付宝支付]支持条码支付.扫码支付.交易查询.交易退款.退款查询.交易撤 ...

  9. 百度前端技术学院-task1.10源代码

    任务十的源代码,其实有github的,但就是不知道怎么弄,近期会学会的.在IE和firefox上检测运行良好. <!DOCTYPE html> <html lang="en ...

  10. 100道MySQL常见面试题总结

    原文链接:https://juejin.im/post/5d351303f265da1bd30596f9 前言 本文主要受众为开发人员,所以不涉及到MySQL的服务部署等操作,且内容较多,大家准备好耐 ...