前言:

  金秋九月的最后一天,突然发现这个月博客啥也没更新,不写点什么总觉得这个月没啥长进,逆水行舟,不进则退,前进的路上贵在坚持,说好的每个月至少一到两篇,不能半途而废!好多知识写下来也能加深一下自身的记忆。所以在国庆前一天和大家分享下自己收藏的一些JS 的数组或对象处理或者非常简单的算法问题。

  1、根据属性来更新一个数组中的对象

 const arr = [ {id: , score: }, {id: , score: }, {id: , score: }];
//更新的值
const newValue = {id: 3, score: 3}

  更新数组中id为3的score值。

  Es6 装逼写法如下:

const result = initial.map(x => x.id === newValue.id ? newValue : x); //是不是很装B??
 console.log(updated) // => [ { id: 1, score: 1 }, { id: 2, score: 2 }, { id: 3, score: 3 } ]

  

  首先数组是利用数组map方法去遍历arr的每一个值,然后进行于newValue的id进行对比,不同返回原来的项,相同返回newValue.

  不装逼清晰点写法:

const updated = arr.map(function(item){
return item.id == newValue.id ? newValue : item ;
});
 console.log(updated) // => [ { id: 1, score: 1 }, { id: 2, score: 2 }, { id: 3, score: 3 } ]

2、数组去重

  对于大神来说,我有一百种方法处理这个问题。

   方案 A

// 遍历数组,建立新数组,利用indexOf判断是否存在于新数组中,不存在则push到新数组,最后返回新数组
function unique(ar) {
var ret = []; for (var i = , j = ar.length; i < j; i++) {
if (ret.indexOf(ar[i]) === -) {
ret.push(ar[i]);
}
} return ret;
}

  方案B

//遍历数组,利用object对象保存数组值,判断数组值是否已经保存在object中,未保存则push到新数组并用object[arrayItem]=1的方式记录保存,这个效率比A高
function unique(ar) {
var tmp = {},
ret = []; for (var i = , j = ar.length; i < j; i++) {
if (!tmp[ar[i]]) {
tmp[ar[i]] = ;
ret.push(ar[i]);
}
} return ret;
}

  方案C

//ES6
const numbers = [, , , , , , , , ];
const uniq = [...new Set(numbers)] // => [ 1, 2, 3, 4 ];
const uniq2 = Array.from(new Set(numbers)) // => [ 1, 2, 3, 4 ];

  稍等,我还有方案D

  方案D

//filter 
function unique (arr) {
var res = arr.filter(function (item, index, array) {
return array.indexOf(item) === index; //array.indexOf(item) === index 说明这个元素第一次出现,后面这个item再出现他的item肯定不是index了
}) return res; }

欢迎大家留言区给出剩下96种方案。

三、根据属性删除数组中的一个对象

 // 根据属性删除数组中的对象,利用filter进行过滤数组中id相同的项
const initial = [ {id: , score: }, {id: , score: }, {id: , score: }];
const removeId = ;
const without3 = initial.filter(x => x.id !== removeId);
console.log(without3) // => [ { id: 1, score: 1 }, { id: 2, score: 2 } ]

四、删除一个对象上的属性(key)

//利用es6的 ...运算符将其他属性和a属性分开来,这波操作很亮眼 !
const obj = {a: , b: , c: };
const {a, ...newObj} = obj;
console.log(newObj) // => {b: 2, c: 3};

五、两个Set对象相减

//利用filter对s1进行过滤 ,去掉s2中存在的数字
const s1 = [ , , , , ];
const s2 = [ , ];
const subtracted = s1.filter(x => s2.indexOf(x) < );
console.log(subtracted);//[1,3,5]

同理这样是可以去出一个数组中指定的元素

//去掉s3中的2和4
const s3 = [ , , , , , , , , , , ];
const s2 = [ , ];
const subtracted1 = s3.filter(x => s2.indexOf(x) < );
console.log(subtracted1); // [1, 3, 5, 5, 6]

六、判断一个单词是否是回文

回文是指把相同的词汇或句子,在下文中调换位置或颠倒过来,产生首尾回环的情趣,叫做回文。例如 12345654321  abcdedbcba 等。
//利用reverse 进行字符串反转,然后和原字符串对比是否相等
function isPalindrom(str) {
return str == str.split('').reverse().join('');
}

七、统计一个字符串出现最多的字母

//统计每个字母出现的次数,然后存起来,然后进行比较
function maxTimesChar(str) {
if(str.length == ) {
return str;
}
let charObj = {};
for(let i=;i<str.length;i++) {
if(!charObj[str.charAt(i)]) {
charObj[str.charAt(i)] = ;
}else{
charObj[str.charAt(i)] += ;
}
}
let maxChar = '',
maxValue = ;
for(var k in charObj) {
if(charObj[k] >= maxValue) {
maxChar = k;
maxValue = charObj[k];
}
}
return maxChar; }

感觉这个方法不够装B,欢迎大神的你进行提供更厉害的方法。请在留言区约起来!

欢迎大家在留言区提供以上问题更优雅的解法,有不同意见或更好的思路欢迎指出,喜欢的话可以点个推荐或者关注( 楼主真不要脸,骗关注 !),最后祝大家国庆愉快!

注:本文出自博客园 https://home.cnblogs.com/u/mdengcc/ ,转载请注明出处。

JS 数据处理技巧及小算法汇总( 一)的更多相关文章

  1. JS 数据处理技巧及小算法汇总

    前言: 金秋九月的最后一天,突然发现这个月博客啥也没更新,不写点什么总觉得这个月没啥长进,逆水行舟,不进则退,前进的路上贵在坚持,说好的每个月至少一到两篇,不能半途而废!好多知识写下来也能加深一下自身 ...

  2. 【js】中的小技巧

    本文主要介绍一些JS中用到的小技巧 1. 类型强制转换   1.1 string强制转换为数字 可以用*1来转化为数字(实际上是调用.valueOf方法) 然后使用Number.isNaN来判断是否为 ...

  3. JS数组排序技巧汇总(冒泡、sort、快速、希尔等排序)

    本文实例总结了JS数组排序技巧.分享给大家供大家参考,具体如下: 1.冒泡排序 var temp = 0; for (var i = 0; i < array.length; i++) { fo ...

  4. JS、JQ相关小技巧积攒

    JS.JQ相关小技巧积攒,以备不时之需. 1.js 获取时间差:时间戳相减.new Date().getTime()  获得毫秒数,除以(1000*60*60*24) 获得天数. 2.重定向操作:页面 ...

  5. 必备的JS调试技巧汇总

    转自http://www.jb51.net/article/88891.htm 前言:任何一个编程者都少不了要去调试代码,不管你是高手还是菜鸟,调试程序都是一项必不可少的工作.一般来说调试程序是在编写 ...

  6. 排序算法汇总(C/C++实现)

    前言:     本人自接触算法近2年以来,在不断学习中越多地发觉各种算法中的美妙.之所以在这方面过多的投入,主要还是基于自身对高级程序设计的热爱,对数学的沉迷.回想一下,先后也曾参加过ACM大大小小的 ...

  7. Backbone.js的技巧和模式

    Backbone.js的技巧和模式 Backbone.js的技巧和模式   本文由白牙根据Phillip Whisenhunt的<Backbone.js Tips And Patterns> ...

  8. 前端开发中的JS调试技巧

    前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...

  9. PowerDesigner 12小技巧-pd小技巧-pd工具栏不见了-pd修改外键命名规则-pd添加外键

    PowerDesigner 12小技巧-pd小技巧-pd工具栏不见了-pd修改外键命名规则-pd添加外键 1. 附加:工具栏不见了 调色板(Palette)快捷工具栏不见了PowerDesigner ...

随机推荐

  1. 第三篇--Jmeter测试数据库Mysql

    Jmeter模拟100用户访问Mysql数据库 1.将Mysql数据库的驱动[mysql-connector-java-5.1.15-bin.jar]放到jmeter的lib目录下,新建线程组100[ ...

  2. HTML基础1

    网页的基本结构(双标签):html,title 页面标题,head 网页上控制信息,body 页面内容,所有属性都写在前面. body的属性:bgcolor 背景色:text 文字颜色:margin ...

  3. Java Integer封装类的IntegerCache内部类

    个人理解,不喜勿喷,欢迎指正. 首先看下面这段代码,猜一下输出结果是什么 Integer a = 10; Integer b = 10; System.out.println(a == b); a = ...

  4. java初步—参数的值传递

    校招季,本人匆匆忙忙地参加各种宣讲会,几次笔试下来都遇到同一个题目,而且全都错在同一想法上,方知自己的基础实在不太牢固,因此特别写在博客上提醒自己要脚踏实地地学习!不多说了,题目如下: public ...

  5. 手机端rem适应

    这段时间做了几个手机版的项目,因为没有用框架,所以用rem来做适应,下面就分享一下 //第一种是比较简单的代码 (function(win) { resizeRoot(); function resi ...

  6. URL.createObjectURL() 与 URL.revokeObjectURL()

    .URL.createObjectURL URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL ...

  7. Web in Linux小笔记001

    Linux灾难恢复: Root密码修复 Centos single Filesystem是硬盘文件根目录,无法再cd ..就像macitosh 硬盘图标 Pwd:显示绝对路径 MBR修复 模拟MBR被 ...

  8. java1.8新特性

    转自:http://www.oschina.NET/translate/everything-about-Java-8 建议去看原文,此处转载只是为了记录. 这篇文章是对Java8中即将到来的改进做一 ...

  9. 软工+C(2017第2期) 分数和checklist

    // 上一篇:题目设计.点评和评分 // 下一篇:超链接 教学里,建立清晰明确的评分规则并且一开始就公布,对于教师.助教.学生都是重要的. 公布时机 在课程开始的时候,就需要确定并公布评分机制,随着课 ...

  10. 201521123068《Java程序设计》第6周学习总结

    1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 点击->面向对象学习 2. 书面作业 1.clone ...