码迷,mamicode.com
首页 > 编程语言 > 详细

js 中的数组方法

时间:2020-03-05 22:31:16      阅读:85      评论:0      收藏:0      [点我收藏+]

标签:变现   table   end   清空   映射   get   rap   des   friends   

 

//1.数组去重
var fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"];
//方法一
var arr = Array.from(new Set(fruits))
// console.log(arr) //[ ‘banana‘, ‘apple‘, ‘orange‘, ‘watermelon‘, ‘grape‘ ]

//方法二
var arr2 = [...new Set(fruits)]
// console.log(arr2) //[ ‘banana‘, ‘apple‘, ‘orange‘, ‘watermelon‘, ‘grape‘ ]

//2.替换数组中的某一个值
var fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"];
fruits.splice(1, 2, "potato", "tomato")
// console.log(fruits) //[ ‘banana‘, ‘potato‘,‘tomato‘,‘watermelon‘,‘apple‘,‘orange‘,‘grape‘,‘apple‘ ]

//3.没有map的映射数组
var friends = [
    { name: "John", age: 22 },
    { name: "Peter", age: 23 },
    { name: "Mark", age: 24 },
    { name: "Maria", age: 22 },
    { name: "Monica", age: 21 },
    { name: "Martha", age: 19 },
]
var friendsNames = Array.from(friends,({name}) => name)
// console.log(friendsNames) //[ ‘John‘, ‘Peter‘, ‘Mark‘, ‘Maria‘, ‘Monica‘, ‘Martha‘ ]
//Array.from() 方法,用于数组的浅拷贝。就是将一个类数组对象或者可遍历对象转换成一个真正的数组。

//4.空数组
var fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"];
fruits.length = 0 //这种方法是让fruits的长度为0,清空数组的元素
fruits = [] //这种方法是让fruits重新指向一个空数组
// console.log(fruits.length)

//5.数组转对象
var fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"];
var objfruits = {...fruits}
// console.log(objfruits) //{0: "banana", 1: "apple", 2: "orange", 3: "watermelon", 4: "apple", 5: "orange", 6: "grape", 7: "apple"}

//6.对象转数组
//方法一:Object.values(object)
var obj = {
    0: ‘nihao‘,
    1: ‘haha‘,
    2: ‘gansha‘
}
var arrobj = Object.values(obj)
// console.log(arrobj) //[ ‘nihao‘, ‘haha‘, ‘gansha‘ ]
//方法二:Object.keys(object)
var arrobj2 = Object.keys(obj)
// console.log(arrobj2) //[ ‘0‘, ‘1‘, ‘2‘ ]
//方法三:Array.from
var arrobj3 = Array.from(obj)
// console.log(arrobj3) //[ ‘nihao‘, ‘haha‘, ‘gansha‘ ]

//7.初始化数组填充数据
var newArr = new Array(10).fill(‘nihao‘)
// console.log(newArr) //["nihao", "nihao", "nihao", "nihao", "nihao", "nihao", "nihao", "nihao", "nihao", "nihao"]

//8.合并数组
var fruits = ["apple", "banana", "orange"];
var meat = ["poultry", "beef", "fish"];
var vegetables = ["potato", "tomato", "cucumber"];
//方法一:.concat 该方法用于连接两个或多个数组,不会改变现有的数组,而仅仅会返回被连接数组的一个副本。array1.concat(arr2,arr3,...arrn)
var food = fruits.concat(meat,vegetables)
// console.log(food) //["apple", "banana", "orange", "poultry", "beef", "fish", "potato", "tomato", "cucumber"]
//方法二:扩展运算符...
var food2 = [...fruits,...meat,...vegetables]
// console.log(food2)
//其他方法:for循环,map方法 
// arr1.map(item=>{
//     arr2.push(item) 
// });
//9.两个数组的交集
//new Set 方法确两个数组中的值不重复,然后用filter和includes过滤每一项,
var nums1 = [1,2,4,5,7]
var nums2 = [2,4,6,8,10]
var nums = [...new Set(nums1)].filter(item =>{
    nums2.includes(item)
})
// console.log(nums)

//10.从数组中删除假值
//在Javascript中,假值是false, 0, " ", null, NaN, undefined。
var falsearr = [0, 1,"blue", "", NaN, 9, true, undefined, "white", false];
var turearr = falsearr.filter(Boolean)
// console.log(turearr) //[ 1, ‘blue‘, 9, true, ‘white‘ ]

//11.从数组中获取随机值
var colors = ["blue", "white", "green", "navy", "pink", "purple", "orange", "yellow", "black", "brown"];
var randomColors = [Math.floor(Math.random() * (colors.length))]
// console.log(randomColors)

//12.数组反转
var colors = ["blue", "white", "green", "navy", "pink", "purple", "orange", "yellow", "black", "brown"];
var reColors = colors.reverse()
// console.log(reColors)

//13.lastIndexOf()方法
//查找元素在数组中最后一次出现的位置
var colors = ["blue", "white", "green", "navy", "pink", "purple","blue", "white", "orange", "yellow", "black", "brown"];

var x = colors.lastIndexOf(‘blue‘)
console.log(x) //6
//14.将数组中的所有元素相加
//reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
var nums = [1, 5, 2, 6];
var y = nums.reduce( (x,y) => x+y)

 

 

 

 

 

js 中的数组方法

标签:变现   table   end   清空   映射   get   rap   des   friends   

原文地址:https://www.cnblogs.com/lyt0207/p/12408433.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!