序文：
このセクションでは、es6メソッドを紹介します。最初に、違いについて説明しましょう。
- map、filter、find、findIndexはすべてデータを返します
- 一部、すべてがブール値を返します
- mapとfilterの違いは、mapが元の配列と同じ番号（添え字）の配列を返すことです。
- filterとfind、findの違いは、必ずしも配列ではなく、修飾されたものを直接返します。
- findとfindIndexの違いは、1つは添え字を返すことであり、もう1つはデータであるということです。これはdata（findIndex）= findとして理解できます。
言うまでもありませんが、通常はajaxやその他の方法を使用してデータをリクエストするため
、データを処理することが非常に重要です。たとえば、次のデータについて考える場合、カルーセルへのリンクの配列が必要です。
{
"message": [ {
"image_src": "https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3857696996,2875137765&fm=26&gp=0.jpg", "open_type": "navigate", "goods_id": 129, "navigator_url": "/pages/goods_detail/main?goods_id=129" }, {
"image_src": "https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3857696996,2875137765&fm=26&gp=0.jpg", "open_type": "navigate", "goods_id": 395, "navigator_url": "/pages/goods_detail/main?goods_id=395" }, {
"image_src": "https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3857696996,2875137765&fm=26&gp=0.jpg", "open_type": "navigate", "goods_id": 38, "navigator_url": "/pages/goods_detail/main?goods_id=38" } ], "meta": {
"msg": "获取成功", "status": 200 } }
要求、
数据中轮播图链接组成的一个数组それがオブジェクト内のキーで構成される配列である限り、オブジェクト配列内の他の要素は必要ありません
<script>
// 相当于请求到的数据
var res ={
"message": [ {
"image_src": "https://img2.woyaogexing.com/2020/11/27/04fb8525072a41dc832fcfcfdbb06b7b!1242x9999.jpeg", "open_type": "navigate", "goods_id": 129, "navigator_url": "/pages/goods_detail/main?goods_id=129" }, {
"image_src": "https://img2.woyaogexing.com/2020/11/27/04fb8525072a41dc832fcfcfdbb06b7b!1242x9999.jpeg", "open_type": "navigate", "goods_id": 395, "navigator_url": "/pages/goods_detail/main?goods_id=395" }, {
"image_src": "https://img2.woyaogexing.com/2020/11/27/04fb8525072a41dc832fcfcfdbb06b7b!1242x9999.jpeg", "open_type": "navigate", "goods_id": 38, "navigator_url": "/pages/goods_detail/main?goods_id=38" } ], "meta": {
"msg": "获取成功", "status": 200 } }
// 获取轮播图数据
var {
message} = res;
// 获取轮播图链接数组
var swiper = message.map(v=>v.image_src)
console.log(swiper);
</script>
需要、注文の作成時間をリクエストしたところ、タイムスタンプが返されましたが、機能しないことがわかったので、オブジェクトに
重新创建一个键入れました。値は標準時間です。
<script>
var res = [
{
name:'wei',age:10,create_time:1562221487},
{
name:'cun',age:20,create_time:1662221487},
{
name:'bin',age:30,create_time:1762221487},
]
var data = res.map((v,i) => ({
...v,ctime:(new Date(v.create_time).toLocaleString())}))
console.log(data);
</script>
需要、要求された商品の中には、ラベルが付いているものもあれば、ラベルが付いていないものもあります。
要把有标签的数据筛选出来（空，或未false）
<script>
var res = [
{
name:'wei',age:10,create_time:1562221487,tab:'1'},
{
name:'cun',age:20,create_time:1662221487,tab:''},
{
name:'bin',age:30,create_time:1762221487},
]
var data = res.filter((v,i) => v.demo)
console.log(data);
</script>
需要、年齢が20以上のデータをフィルタリングし、これらのデータを配列にグループ化する必要があります
<script>
var res = [
{
name:'wei',age:10},
{
name:'cun',age:20},
{
name:'bin',age:30},
]
var data = res.filter(v => v.age >= 20)
console.log(data);
</script>
需要、私は名前がweiであるすべての人々を見つける必要があります
<script>
var res = [
{
name:'wei',age:10},
{
name:'cun',age:20},
{
name:'bin',age:30},
{
name:'wei',age:30},
]
var data = res.filter(v => v.name == 'wei')
console.log(data);
</script>
データがたくさんあるので、欲しいデータの添え字が欲しい
<script>
var res = [
{
name:'wei',age:10,create_time:1562221487,tab:'1'},
{
name:'cun',age:20,create_time:1662221487,tab:''},
{
name:'bin',age:30,create_time:1762221487},
]
var data = res.findIndex((v,i) => v.name == 'cun')
console.log(data); //1
</script>
cunという名前の最初の人を見つけたいのですが、後でそのようなデータがあったとしても、それは必要ありません
<script>
var res = [
{
name:'wei',age:10,create_time:1562221487,tab:'1'},
{
name:'cun',age:20,create_time:1662221487,tab:''},
{
name:'cun',age:30,create_time:1762221487},
]
var data = res.find((v,i) => v.name == 'cun')
console.log(data);
</script>
データ内の名前がすべてweiであるかどうかを判別します（すべてこれです）
<script>
var res = [
{
name:'wei',age:10},
{
name:'cun',age:20},
{
name:'bin',age:30},
{
name:'wei',age:30},
]
var data = res.every(v => v.name == 'wei')
console.log(data); //false
</script>
データ内の名前にweiがあるかどうかを判断します（これである限り）
<script>
var res = [
{
name:'wei',age:10},
{
name:'cun',age:20},
{
name:'bin',age:30},
{
name:'wei',age:30},
]
var data = res.some(v => v.name == 'wei')
console.log(data); //true
</script>