js-操作Array、String、Object其中的一些方法

• 遍历数组求和

    let arr = [
         {
             name:'一',
             data:0.1,
         },
         {
             name:'二',
             data:0.3,
         },
         {
             name:'三',
             data:0.5,
         }
     ];
     let newarr = [];
     for(let i in arr){
         newarr.push(arr[i].data)
     }
     function sum(newarr) {
         return eval(newarr.join("+"));
     };
     let a = sum(newarr)

    1.递归
    function sum(arr) {
        var len = arr.length;
        if(len == 0){
            return 0;
        } else if (len == 1){
            return arr[0];
        } else {
            return arr[0] + sum(arr.slice(1));
        }
    }
    2、常规循环
    function sum(arr) {
        var s = 0;
        for (var i=arr.length-1; i>=0; i--) {
            s += arr[i];
        }
        return s;
    }
    
    3.函数式编程 map-reduce
    function sum(arr) {
        return arr.reduce(function(prev, curr, idx, arr){
            return prev + curr;
        });
    }
    4、forEach遍历：
    function sum(arr) {
        var s = 0;
        arr.forEach(function(val, idx, arr) {
            s += val;
        }, 0);
      
        return s;
    };
    5、eval：
    function sum(arr) {
        return eval(arr.join("+"));
    };

• Array–reduce方法

arr.reduce(function(prev,cur,index,arr){
...
}, init);

或者

arr.reduce(function(prev,cur,index,arr){
...
},);

arr 表示将要原数组；
prev 表示上一次调用回调时的返回值，或者初始值 init;
cur 表示当前正在处理的数组元素；
index 表示当前正在处理的数组元素的索引，若提供 init 值，则索引为0，否则索引为1；
init 表示初始值。

常用的参数只有两个：prev 和 cur。

 

数组求和，求乘积

var  arr = [1, 2, 3, 4];
var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); //求和，10
console.log( mul ); //求乘积，24
计算数组中每个元素出现的次数

let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

let nameNum = names.reduce((pre,cur)=>{
  if(cur in pre){
    pre[cur]++
  }else{
    pre[cur] = 1 
  }
  return pre
},{})
console.log(nameNum); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}


数组去重
let arr = [1,2,3,4,4,1]
let newArr = arr.reduce((pre,cur)=>{
    if(!pre.includes(cur)){
      return pre.concat(cur)
    }else{
      return pre
    }
},[])
console.log(newArr);// [1, 2, 3, 4]


将二维数组转化为一维
let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
    return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]


将多维数组转化为一维
let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr = function(arr){
   return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
}
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]


对象里的属性求和
var result = [
    {
        subject: 'math',
        score: 10
    },
    {
        subject: 'chinese',
        score: 20
    },
    {
        subject: 'english',
        score: 30
    }
];

var sum = result.reduce(function(prev, cur) {
    return cur.score + prev;
}, 0);
console.log(sum) //60

• JS中判断某个字符串是否包含另一个字符串的方法

//String对象的方法
//方法一: indexOf()   (推荐)
var str = "123"
console.log(str.indexOf("2") != -1); // true
indexOf() //方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现，则该方法返回 -1。

//方法二:match()
var str = "123"
var reg = RegExp(/3/);
if(str.match(reg)){
 //包含；
}
match() //方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

//方法三: search()
var str = "123"
console.log(str.search("2") != -1); // true
search() //方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串，则返回 -1。

//RegExp对象的方法

//方法四: test()
var str = "123"
var reg = RegExp(/3/);
 console.log(reg.test(str) != -1); // true
test() //方法用于检索字符串中指定的值。返回 true 或 false。

//方法五:exec()
var str = "123"
var reg = RegExp(/3/);
if(reg.exec(str)){
 //包含；
}
exec() //方法用于检索字符串中的正则表达式的匹配。返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。

• JS对象总结(创建、属性、方法)

创建

1.字面量的方式创建

var obj = {
	name:'小花',
	say:function(){
		return this.name;
	}
}

2.new Object()

var obj = new Object();
obj.name = '小花';
obj.say = function(){
	return this.name;
}

3.构造函数创建

var obj = function(name){
	this.name = name,
	this.say = function(){
		return this,name;
	}
}
var obj1 = new obj('小花');

4.工厂模式

var creatobj = function(name){
	var obj = new Object();
	obj.name = name;
	obj.say = function(){
		return thia,name;
	};
	return obj;
}
var obj1 = creatobj('小花');

5.Object.create() ES5新增方法

var obj = Object.create({
	get:function(val){
		return val.toString();
	}
})
obj.name = '小花';
//Object.create();  参数是一个对象，并且该对象作为新创建对象的原型。

属性

f访问：通常通过 obj.attr 或者obj[‘attr’] 来访问属性，但是如果属性名称为关键字或者保留字的时候，要通过 obj[‘attr’] 访问，所以要注意变量的命名，尽量不要用关键字和保留字。
2.赋值

 let cuihua={
 	   name:"翠花",
       age:18,
       sex:"女",
   }
   cuihua.hobby="跳舞"  //增
   cuihua.name="小花"  //改
   cuihua = null;     //删除整个对象
   delete cuihua.name //删除对象某一个属性
   console.log(cuihua.name) //查

3.检测属性

// in 检测对象的自有属性和继承属性中是否有该属性。有则返回true， 否则返回false。
　var obj = {name:1,val:2};
　console.log('name' in obj , 'abc' in obj) //true,false  
//hasOwnProperty()　　　hasOwnProperty方法只能测试当前属性是不是对象的自有属性
var obj = {name:1,val:2}
console.log(obj.hasOwnProperty('name'),obj.hasOwnProperty('abc'))//true,false
//propertylsEnumerable()　　只有当当前的属性是自有属性，并且是可枚举的的时候，这一方法才会返回true。

4.枚举属性

//for/in 其可以遍历对象中的所有的可枚举属性，包括当前对象的自有属性和继承属性。
var obj = {name:1,val:2}
for(let i in obj){
    console.log(i,obj[i])
}
//Object.keys()　　遍历对象的自有属性，返回的是一个数组，其中存在的是对象中的可枚举属性名称组成。
// 不要怀疑这里对象里的key故意写成中文。哈哈
 let arr = [{"我":'my',"你":'you'},{"我":'my1',"你1":'you1'}];
 let str = '';
 arr.forEach((v,i)=>{
     str += `<li>${v.我}</li>`
 })
 document.querySelector('ul').innerHTML = str;
 let list = new Array;
 for(let i =0; i< arr.length; i++){
     let arrs = Object.keys(arr[i]); //主要是这句
    let data = arrs.map((item,value)=>{
         return{name:item,elname:arr[i][item]}
     })
    list.push(...data)
 }
 // Object.getOwnPropertyNames()　　其返回的是数组，但是是所有的自有属性名称的数组。

5.Object.assign(target, …resouce); 将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

• 根据已有的变量判断数组对象中是否存在某一属性

let code = 3;
    let arr = [{id:1},{id:2},{id:3}]

    第一种
    let res = arr.some((item)=>{
        if(item.id == code){
            return true;
        }
    })

    第二种
    let res = function (){
        let abc = false;
        for(let i=0; i<arr.length; i++){
            if(arr[i].id == code){
                abc = true;
            }
        }
        return abc;
    };
    let a = res();
    function you(a){
        if(a){
            console.log('不添加')
        }else{
            console.log('添加')
        }
    }
    you(a)

• 去重

var arr = [{
      key: '1',
      value: '1'
   }, {
      key: '2',
      value: '2'
   }, {
      key: '3',
      value: '3'
   },{
      key: '4',
      value: '4'
   },{
      key: '1',
      value: '1'
   }];


   //  方法1：利用对象访问属性的方法，判断对象中是否存在key
   var result = [];
   var obj = {};
   for(var i =0; i<arr.length; i++){
      if(!obj[arr[i].key]){
         result.push(arr[i]);
         obj[arr[i].key] = true;
      }
   }
   console.log(result); // [{key: "1", value: "1"},{key: "2", value: "2"},{key: "3", value: "3"},{key: "4", value: "4"}]



   //  方法2：利用reduce方法遍历数组,reduce第一个参数是遍历需要执行的函数，第二个参数是item的初始值
      var obj = {};
    arr = arr.reduce(function(item, next) {
        obj[next.key] ? '' : obj[next.key] = true && item.push(next);
        return item;
    }, []);
   console.log(arr); // [{key: "1", value: "1"},{key: "2", value: "2"},{key: "3", value: "3"},{key: "4", value: "4"}]
    

• js数组对象重复数据出现的次数

filterArr(arr){
	let newArr = [...new Set(arr.map(i => i.name))];
	let list = [];
	newArr.forEach(i => {
	  list.push(arr.filter(t => t.name === i));
	});
	let mlist = [];
	list.forEach((i, index) => {
	  mlist.push({
	    name: newArr[index],
	    num: i.length,
	  });
	});
	return mlist;
},