我是靠谱客的博主 积极草莓,最近开发中收集的这篇文章主要介绍js计算数组中每个元素出现的次数one:two:three:使用localstorage.setItem()存储对象four:合并对象的方法,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

摘自文章:js计算数组中每个元素出现的次数(2种方法)_莫问前程F6的博客-CSDN博客_js统计每个元素出现的次数 

one:

var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce((obj, name) => { 
  if (name in obj) {
    obj[name]++
  } else {
    obj[name]=1
  }
  return obj
}, {})
//reduce的第二个参数就是obj的初始值
console.log(countedNames)
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }

two:

function getEleNums(data) {
 var map = {}
 for (i = 0; i < data.length; i++) {
     var key = data[i]
     if (map[key]) {
         map[key] += 1
     } else {
         map[key] = 1
     }
 }
 return map
}
var data = ['b','a','c','a','b','b','b','c','c','a','c','a','a','a','b','c']
console.log(getEleNums(data))

three:使用localstorage.setItem()存储对象

使用localstorage.setItem(name,value)存储JSON对象时会发现浏览器存储的内容为[object,object],并不是我们想要的内容,这是因为我们在存储的时候没有进行类型转换,因此我们在使用localstorage.setItem()进行对象存储之前需要使用JSON.stringify(object)进行类型转换,转换成JSON字符串后进行存储就会是我们想要的样子了。

当在另一个组件中,没有监听方法的时候可以使用window.addEventListener("storage", this.handleStorage);  全局监听的方法。  在这个方法中使用let dataObj = JSON.parse(obj.newValue);即可将传来的对象字符串再次转成自己想要的对象,然后再进行操作。。。。

four:合并对象的方法

摘自文章:合并对象的方法_努力学编程呀(๑•ี_เ•ี๑)的博客-CSDN博客_对象合并

four.one:Object.assign()

        同名属性会被覆盖。Object.assign种第一个值是目标对象,第二个值是源对象。

const obj1={a:"1",b:"2"}
const obj2={c:"3",d:"4"}
const value= Object.assign(obj1,obj2)
//console.log(value)

注意:
1、使用该方法时,需提前判断原生Object是否支持该函数。
2、如果原生Object不支持该函数,则需创建函数assign,使用Object.defineProperty将该函数绑定到Object上
3、判断参数是否正确。
4、一定要注意:目标对象不能为空,我们可以直接设置{}传递进去,但必须设置值。


four.two:扩展运算符

扩展运算符合并对象obj1对象在前和在后最后打印的结果是不同的
const obj1={a:"1",b:"2"};
const obj2={b:"3",c:"4"};
const value= {...obj1,...obj2};
//console.log(value)
//a:1 b:3 c:4    
// obj1中b的值被后面传入的obj2的值给覆盖掉了

four:three: 没使用过,应该好用

 

最后

以上就是积极草莓为你收集整理的js计算数组中每个元素出现的次数one:two:three:使用localstorage.setItem()存储对象four:合并对象的方法的全部内容,希望文章能够帮你解决js计算数组中每个元素出现的次数one:two:three:使用localstorage.setItem()存储对象four:合并对象的方法所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(37)

评论列表共有 0 条评论

立即
投稿
返回
顶部