JS 基本操作
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 基本操作的更多相关文章
- two.js基本操作
今天介绍一个网络上并不常用的插件two.js,two.js是一款网页二维绘图软件,可以在指定区域内产生自设的各种动画效果 下载网址如下: https://two.js.org/#download 一: ...
- js基本操作
js操作页面三步骤 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 模仿WC.exe的功能实现--node.js
Github项目地址:https://github.com/102derLinmenmin/myWc WC 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要 ...
- IOS-网络(网页开发-UIWebView,HTML,CSS,JavaScript,OC和JS代码互调)
一.网页基础 // // ViewController.m // IOS_0218_网页开发1 // // Created by ma c on 16/2/18. // Copyright © 201 ...
- 如何让 JS 代码不可断点
绕过断点 调试 JS 代码时,单步执行(F11)可跟踪所有操作.例如这段代码,每次调用 alert 时都会被断住: debugger alert(11) alert(22) alert(33) ale ...
- vue中解决时间在ios上显示NAN的问题
最近在用vue,遇到倒计时在ios上显示为NAN的问题. 因为做的是倒计时支付,思路是获取服务器时间和下单时间,再转成秒级时间戳做差值. 在网上找到说是ios 不支持例如2018-09-01 10:0 ...
- js数组(列表)的基本操作
本文主要介绍JS对数组(列表)的基本操作.习惯了用数据库的操作顺序来说明:增.删.改.查:合并,裁剪,排序,格式化. 一.数组元素的添加(增加) 增加数组元素有三种方法:unshift() push ...
- H5JS二维动画制作!two.js的基本操作class1
今天介绍一个网络上并不常用的插件two.js,刚开始学习的过程中,发现网上并没有合适的教程,在此发表基本操作 two.js是一款网页二维绘图软件,可以在指定区域内产生自设的各种动画效果 下载网址如下: ...
- js对WebApi请求的基本操作
在WebAPI对外提供的,大概有4种接口,get,post,delete,put,现在,我就简单的来说一下js请求webApi的方式和大概的作用: get:在webApi中,get方法通常是用来获取数 ...
随机推荐
- 转载:tensorflow保存训练后的模型
训练完一个模型后,为了以后重复使用,通常我们需要对模型的结果进行保存.如果用Tensorflow去实现神经网络,所要保存的就是神经网络中的各项权重值.建议可以使用Saver类保存和加载模型的结果. 1 ...
- 全球 IPv4 地址正式耗尽
重要消息: 就在 2019/11/25 UTC+1 15:35 时,一封来自欧洲 RIPE NCC 的邮件中得到确认:全球的IPv4地址已经彻底耗尽. IPv4 大家应该很熟悉了,就是我们平常所知道的 ...
- 【06月19日】A股滚动市盈率PE最低排名
仅根据最新的市盈率计算公式进行排名,无法对未来的业绩做出预测. 方大集团(SZ000055) - 滚动市盈率PE:2.59 - 滚动市净率PB:1.16 - 滚动年化股息收益率:3.91% - 建筑 ...
- 日志篇 貌似win10有个磁盘bug,非常非常严重... 硬盘解密之后无法访问,参数错误 BitLocker解密
程序员就是要穷尽一切猜想... 我的加密的硬盘解密后无法访问了,我从一年前就遇到了,现在又突然出现了..... 然后找到一个人回答,他这个回答能从形式上解决,点我去原帖 用cmd管理员模式,执行,I要 ...
- linux shell获取show slave status方法
linux shell获取show slave status方法<pre>#!/bin/basharray=($(mysql -u数据库账号 -p数据库密码 -e "show s ...
- NanoPi NEO Plus2开发环境搭建
1.前言 NanoPi NEO Plus2是友善电子推出的一款非常小巧精致的开源硬件,该开源硬件的CPU是基于Allwinner公司的64位四核ARM Cortex-A53处理器H5,并且内置了六核M ...
- [原创]Python免杀ShellCode加载器(Cobaltstrike/Metasploit)
0x001 原理 采用分离法,即将ShellCode和加载器分离.方法较LOW但免杀. 本文主要将ShellCode转成HEX,再通过加载器执行ShellCode. PS: 何为SC加载器,即专门用于 ...
- MarkDown的常规用法
MarkDown的常规用法 标题 # 一级标题 ## 二级标题 ... ###### 六级标题 列表 第二级 - 和 空格 + 和 空额 * 和 空格 第三级 代码块 多行代码块 3个` 回车 单行代 ...
- HTML中的元素是有属性的:标准与解释器
元素的属性只有有标准和相应的解释器才有存在的意义. HTML中的元素是有属性的:这些额外的属性值可以配置元素或者以各种方式来调整元素的行为,进而满足用户所需的标准. https://developer ...
- .Net Core 获取应用物理路径的常见问题
如果要得到传统的ASP.Net应用程序中的相对路径或虚拟路径对应的服务器物理路径,只需要使用使用Server.MapPath()方法来取得Asp.Net根目录的物理路径. 但是在Asp.Net Cor ...