JavaScript高阶函数(split--join) ( forEach--map--filter ) ( trim ) ( slice--splice ) concat、reverse、( toUpperCase--substring )
对函数的使用和理解都有几个关键点,函数的使用者(对象),返回值,改不改变原对象
split--join
split 分开,通过()中的字符使String分开
split()
是对字符串进行操作,不会改变原对象,会返回一个数组
var a = 'abc'
var b = a.split('b')
//b=['a','c']
join 拼接,通过()中的字符使obj拼接成字符串
join()
方法将数组作为字符串返回,不会改变原数组,会返回一个字符串
forEach--map--fliter
forEach循环遍历
forEach循环,数组中有几项,循环几次,forEach(value,index,arr){}中value为遍历的值,index为遍历的下标,arr为遍历的数组,没有返回值
forEach() 被调用时,不会改变原数组,也就是调用它的数组(尽管 callback 函数在被调用时可能会改变原数组)。(译注:此处说法可能不够明确,具体可参考EMCA语言规范:'forEach does not directly mutate the object on which it is called but the object may be mutated by the calls to callbackfn.',即 forEach 不会直接改变调用它的对象,但是那个对象可能会被 callback 函数改变。)
forEach能不能改变原数组? 基本类型不能更改,引用类型可以更改
<script>
//split 分开,通过()中的字符使obj分开
//forEach循环,数组中有几项,循环几次,forEach(value,index,obj){}中value为 遍历的值,index为遍历的下标,obj为遍历的数组
//trim() 修剪,移除字符串两侧空白的字符
var obj = "a = 100 ; b = 200"
arrayObj = {}
obj.split(';').forEach(resultvalue => {
var arr = resultvalue.trim().split('=')
var key = arr[0]
var value = arr[1]
arrayObj[key] = value
})
console.log(arrayObj)
document.write('看控制台输出')
</script>
map() 和 filter()参数和filter一样
map() filter()
都是对数组进行操作,不会改变原数组,会返回一个新数组
map()和filter()的区别是map会返回满足条件的哪一项,filter会返回满足条件的所有项
<script>
var arr = [
{
id: '605ca11351415c2770313882',
num: 6
},
{
id: '605ca11351415c2770313883',
num: 3
}
]
//使用map没有{}直接item.d,可直接返回只包含id的数组。
var ids = arr.map(item => item.id)
console.log(ids)
//使用filter没有{}可直接返回满足条件的数组项,包含之前过滤数组的所有项。
var filterids = arr.filter(item => item.id==='605ca11351415c2770313882')
//使用map和filter有{}都要使用return 来返回
ar mapids = arr.map(item => {
return item
})
console.log(mapids)
</script>
const Order = require('../../models/Order')
const Product = require('../../models/Product')
const Address = require('../../models/Address')
!(async() => {
// 模拟一个订单的创建过程
const username = 'zhangsan'
const address_id = '605c8cd92fbbd5366c98299b'
// 商店信息
const shopId = '605c86672eab4d379c233996'
const shopName = '沃尔玛'
// 订单的商品 id 和数量
const products = [
{
id: '605ca11351415c2770313882',
num: 6
},
{
id: '605ca11351415c2770313883',
num: 3
}
]
//获得所有地址信息
const address = await Address.findById(address_id)
const productIds = products.map(p => p.id)
const productList = await Product.find({
_id: {
$in: productIds
},
shopId
})
// console.log(productList)
const productAndNumber = productList.map( p => {
// 商品 id
const id = p._id.toString()
//filter方法中,数组中的数组项是一项一项进行过滤的,productnum数组中只有一项,
const productnum = products.filter(item => item.id === id)
if (productnum.length === 0) {
// 没有找到匹配的数量,报错
throw new Error('未找到匹配的销量数据')
}
// console.log(productnum)
return {
orderSales: productnum[0].num,
product: p
}
})
// 创建订单
await Order.create({
username,
address,
shopId,
shopName,
isCanceled: false, // 是否被取消,依赖于前端的传入
products: productAndNumber
})
})()
trim
trim()
修剪,trim() 方法会从一个字符串的两端删除空白字符
trim()
是对字符串进行操作,不会改变原字符串,会返回一个新的字符串
var str = ' hello world '
var newStr = str.trim()
//newStr='hello world'
splice--slice--substring
splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
splice()
操作对象是数组不能是字符串,会改变原数组,返回被删除的数组。如果没有删除元素,则返回空数组。splice(start, deleteCount, item1, item2...)start开始删除的下标值,deletCount删除几个,item从start开始加入的数组
var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
var removed = myFish.splice(3, 1);
// 运算后的 myFish: ["angel", "clown", "drum", "sturgeon"]
// 被删除的元素removed: ["mandarin"]
splice()加入元素时需要注意, 加入的开始start下标,就是加入项成为的下标
从下标1加入5,加入的5的下标就是1
slice() 方法从已有的数组中返回选定的元素。
slice
操作对象是数组和字符串,不会改变原数组,返回一个被提取新的数组slice(start, end)start开始提取的数组下标,end结束提取的数组下标,左闭右开【start,end)提取包含start不包含end
var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
var citrus = fruits.slice(1, 3);
// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus contains ['Orange','Lemon']
参数:
start:必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
end: 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
substring与slice()方法不同的是,substring() 不接受负的参数。
concat
concat合并两个或多个数组
concat()
操作对象是数组,不会改变现有数组,返回被连接数组的新数组。
var num1 = [1, 2, 3],
num2 = [4, 5, 6],
num3 = [7, 8, 9];
var nums = num1.concat(num2, num3);
console.log(nums);
// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
reverse
reverse方法用于颠倒数组中元素的顺序。
reverse()
操作对象是数组,会改变原数组,返回这个被改变的数组
const a = [1, 2, 3];
console.log(a); // [1, 2, 3]
a.reverse();
console.log(a); // [3, 2, 1]
toUpperCase toLowerCase
toUpperCase() 方法用于把字符串转换为大写。
toLowerCase() 方法用于把字符串转换为小写。
操作对象都是字符串,会改回原字符串,返回新的字符串
str.toUpperCase
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了