电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

JavaScript array常用方法代碼實例詳解

瀏覽:6日期:2023-10-16 14:58:44

1.map/reduce

map()

map()是array的一個方法

作用: 對array中每一個元素調用自定義函數

’use strict’;function pow(x){return x*x;}var arr=[1,2,3,4,5]var newarray=arr.map(pow)

map的回調函數有三個參數:

callback(currentValue, index, array)通常只要第一個參數

PS: map()傳入的參數是pow,即函數對象本身

通常map調用的自定義方法只包含一個參數

reduce()

reduce()也是array的一個方法

作用: 從數組的前兩個元素開始,作為函數參數,傳入函數得到結果,

結果再和下一個數組元素再一次調用函數,直到數組盡頭

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)PS: 通常reduce()調用的自定義方法只包含兩個個參數

2.filter(篩選)

作用:把Array的某些元素過濾掉,然后返回剩下的元素.

和map()類似,Array的filter()也接收一個函數。和map()不同的是,filter()把傳入的函數依次作用于每個元素,然后根據返回值是true還是false決定保留還是丟棄該元素。

//去掉空字符串

var arr = [’A’, ’’, ’B’, null, undefined, ’C’, ’ ’];var r = arr.filter(function (s) { return s && s.trim(); // 注意:IE9以下的版本沒有trim()方法});r; // [’A’, ’B’, ’C’]

回調函數

通常我們僅使用第一個參數,表示Array的某個元素。回調函數還可以接收另外兩個參數,表示元素的位置和數組本身:

var arr = [’A’, ’B’, ’C’];var r = arr.filter(function (element, index, self) { console.log(element); // 依次打印’A’, ’B’, ’C’ console.log(index); // 依次打印0, 1, 2 console.log(self); // self就是變量arr return true;});

篩選素數:

function get_primes(arr){if(elem===1){return false;}for(var i=2;i<=elem/2;i++){if(elem%i==0){return false;}}return true;});return x;}

PS: 關鍵在于正確實現一個“篩選”函數

3.sort(排序)

默認排序會把所有元素轉成String在排序,根據一個元素的ASCII值進行排序(非遞減)(TimSort算法)

兩兩比較,當回調函數返回值大于0時,交換元素值

自定義數字排序

’use strict’ var arr=[10,20,1,2];arr.sort(function(x,y){if (x < y) { return -1; } if (x > y) { return 1; } return 0;});console.log(arr); // [1, 2, 10, 20]

數字倒序排列

var arr = [10, 20, 1, 2];arr.sort(function (x, y) { if (x < y) { return 1; } if (x > y) { return -1; } return 0;}); // [20, 10, 2, 1]

4.其他的Array方法

every()和some()

作用: 可以判斷數組的所有元素是否滿足測試條件(通過函數提供)

every()是全部滿足的時候返回true,一個不滿足返回false,并終止檢測

some()是全部不滿足的時候返回false,有一個滿足就返回true

find()

作用: 查找第一個符合條件的元素

查找符合條件的第一個元素,如果找到了就返回這個元素,否則,返回undefined

findindex()

作用: 查找第一個符合條件的元素的索引

查找符合條件的第一個元素,找到這個元素就返回他的索引,如果沒有找到就返回-1

forEach()

作用: 常用于遍歷數組

(和map類似)把數組每個元素依次傳入函數,但不會返回新的數組.

函數作為返回值函數里再定義一個函數,返回值為里面定義的函數

調用函數作為返回值的函數式,每次調用都會返回一個新的函數,即使傳入相同參數

function lazy_sum(arr) { var sum = function () { return arr.reduce(function (x, y) { return x + y; }); } return sum;}//此時返回的是求和函數var f = lazy_sum([1, 2, 3, 4, 5]); // function sum()f(); // 15 此時調用,才進行計算

在函數lazy_sum中又定義了函數sum,并且,內部函數sum可以引用外部函數lazy_sum的參數和局部變量,當lazy_sum返回函數sum時,相關參數和變量都保存在返回的函數中,這種稱為“閉包(Closure)”的程序結構擁有極大的威力.

閉包(懵逼了)(吐彩虹)

有權訪問另一個函數作用域內變量的函數都是閉包。

函數里面的函數會隨著外部定義函數而改變

PS: 因為返回值就是一個函數,調用的時候要加小括號

返回閉包時牢記的一點就是:返回函數不要引用任何循環變量,或者后續會發生變化的變量。

如果一定要引用循環變量怎么辦?方法是再創建一個函數,用該函數的參數綁定循環變量當前的值,無論該循環變量后續如何更改,已綁定到函數參數的值不變:

箭頭函數(=>)(強噠)(參數...)=>{函數體}等價于function(參數...){函數體}

當返回的是一個對象時函數體大括號外邊加小括號

x=>({foo:x})

this

箭頭函數內部的this是詞法作用域,由上下文確定

var obj = { birth: 1990, getAge: function () { var b = this.birth; // 1990 var fn = () => new Date().getFullYear() - this.birth; // this指向obj對象 return fn(); }};obj.getAge(); // 25

箭頭函數完全修復了this指向,this總是指向詞法作用域,也就是外層調用 obj

generator(生成器)

ES6引入借鑒Python同名函數

寫法和函數類似,只是在function后加*,通過yield多次返回值,也可通過return返回值

函數在執行過程中,如果沒有遇到return語句(函數末尾如果沒有return,就是隱含的return undefined;),控制權無法交回被調用的代碼。

function* (x){yield x}function* fib(max) { var t, a = 0, b = 1, n = 0; while (n < max) { yield a; [a, b] = [b, a + b]; n ++; } return;}fib(5); // fib {[[GeneratorStatus]]: 'suspended', [[GeneratorReceiver]]: Window}

直接調用一個generator和調用函數不一樣,fib(5)僅僅是創建了一個generator對象,還沒有去執行它。

調用generator對象有兩個方法,

一是不斷地調用generator對象的next()方法:next()方法會執行generator的代碼,然后,每次遇到yield x;就返回一個對象{value: x, done: true/false},然后“暫停”。返回的value就是yield的返回值,done表示這個generator是否已經執行結束了。如果done為true,則value就是return的返回值。當執行到done為true時,這個generator對象就已經全部執行完畢,不要再繼續調用next()`了。

var f = fib(5);f.next(); // {value: 0, done: false}f.next(); // {value: 1, done: false}f.next(); // {value: 1, done: false}f.next(); // {value: 2, done: false}f.next(); // {value: 3, done: false}f.next(); // {value: undefined, done: true}

第二個方法是直接用for ... of循環迭代generator對象,這種方式不需要我們自己判斷done:

for (var x of fib(10)) { console.log(x); // 依次輸出0, 1, 1, 2, 3, ...}

generator還有另一個巨大的好處,就是把異步回調代碼變成“同步”代碼。這個好處要等到后面學了AJAX以后才能體會到。

try { r1 = yield ajax(’http://url-1’, data1); r2 = yield ajax(’http://url-2’, data2); r3 = yield ajax(’http://url-3’, data3); success(r3);}catch (err) { handle(err);}

看上去是同步的代碼,實際執行是異步的。

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持好吧啦網。

標簽: JavaScript
相關文章:
主站蜘蛛池模板: 闪电优家-卫生间防水补漏_酒店漏水渗水维修_防水堵漏公司 | 广州食堂承包_广州团餐配送_广州堂食餐饮服务公司 - 旺记餐饮 | SOUNDWELL 编码器|电位器|旋转编码器|可调电位器|编码开关厂家-广东升威电子制品有限公司 | 低压载波电能表-单相导轨式电能表-华邦电力科技股份有限公司-智能物联网综合管理平台 | 上海刑事律师|刑事辩护律师|专业刑事犯罪辩护律师免费咨询-[尤辰荣]金牌上海刑事律师团队 | 污泥烘干机-低温干化机-工业污泥烘干设备厂家-焦作市真节能环保设备科技有限公司 | 航空铝型材,7系铝型材挤压,硬质阳*氧化-余润铝制品 | 户外环保不锈钢垃圾桶_标识标牌制作_园林公园椅厂家_花箱定制-北京汇众环艺 | 武汉印刷厂-不干胶标签印刷厂-武汉不干胶印刷-武汉标签印刷厂-武汉标签制作 - 善进特种标签印刷厂 | 物联网卡_物联网卡购买平台_移动物联网卡办理_移动联通电信流量卡通信模组采购平台? | 天坛家具官网 | IP检测-检测您的IP质量| 全钢实验台,实验室工作台厂家-无锡市辰之航装饰材料有限公司 | 加热制冷恒温循环器-加热制冷循环油浴-杭州庚雨仪器有限公司 | 快速门厂家-快速卷帘门-工业快速门-硬质快速门-西朗门业 | 穿线管|波纹穿线管|包塑金属软管|蛇皮管?闵彬专注弱电工程? | 蜂窝块状沸石分子筛-吸附脱硫分子筛-萍乡市捷龙环保科技有限公司 | 物和码官网,物和码,免费一物一码数字化营销SaaS平台 | 玉米深加工机械,玉米加工设备,玉米加工机械等玉米深加工设备制造商-河南成立粮油机械有限公司 | 时代北利离心机,实验室离心机,医用离心机,低速离心机DT5-2,美国SKC采样泵-上海京工实业有限公司 工业电炉,台车式电炉_厂家-淄博申华工业电炉有限公司 | 大功率金属激光焊接机价格_不锈钢汽车配件|光纤自动激光焊接机设备-东莞市正信激光科技有限公司 定制奶茶纸杯_定制豆浆杯_广东纸杯厂_[绿保佳]一家专业生产纸杯碗的厂家 | 北京租车牌|京牌指标租赁|小客车指标出租 | 济南货架定做_仓储货架生产厂_重型货架厂_仓库货架批发_济南启力仓储设备有限公司 | 南京种植牙医院【官方挂号】_南京治疗种植牙医院那个好_南京看种植牙哪里好_南京茀莱堡口腔医院 尼龙PA610树脂,尼龙PA612树脂,尼龙PA1010树脂,透明尼龙-谷骐科技【官网】 | 哈尔滨治「失眠/抑郁/焦虑症/精神心理」专科医院排行榜-京科脑康免费咨询 一对一诊疗 | 空气能采暖,热泵烘干机,空气源热水机组|设备|厂家,东莞高温热泵_正旭新能源 | 成都办公室装修-办公室设计-写字楼装修设计-厂房装修-四川和信建筑装饰工程有限公司 | 塑料撕碎机_编织袋撕碎机_废纸撕碎机_生活垃圾撕碎机_废铁破碎机_河南鑫世昌机械制造有限公司 | 石家庄网站建设|石家庄网站制作|石家庄小程序开发|石家庄微信开发|网站建设公司|网站制作公司|微信小程序开发|手机APP开发|软件开发 | RS系列电阻器,RK_RJ启动调整电阻器,RQ_RZ电阻器-上海永上电器有限公司 | 艺术涂料_进口艺术涂料_艺术涂料加盟_艺术涂料十大品牌 -英国蒙太奇艺术涂料 | 甲级防雷检测仪-乙级防雷检测仪厂家-上海胜绪电气有限公司 | 成都LED显示屏丨室内户外全彩led屏厂家方案报价_四川诺显科技 | 众品家具网-家具品牌招商_家具代理加盟_家具门户的首选网络媒体。 | 南京试剂|化学试剂|分析试剂|实验试剂|cas号查询-专业60年试剂销售企业 | 欧美日韩国产一区二区三区不_久久久久国产精品无码不卡_亚洲欧洲美洲无码精品AV_精品一区美女视频_日韩黄色性爱一级视频_日本五十路人妻斩_国产99视频免费精品是看4_亚洲中文字幕无码一二三四区_国产小萍萍挤奶喷奶水_亚洲另类精品无码在线一区 | 环境模拟实验室_液体-气体控温机_气体控温箱_无锡双润冷却科技有限公司 | 武汉刮刮奖_刮刮卡印刷厂_为企业提供门票印刷_武汉合格证印刷_现金劵代金券印刷制作 - 武汉泽雅印刷有限公司 | 琉璃瓦-琉璃瓦厂家-安徽盛阳新型建材科技有限公司 | 专业广州网站建设,微信小程序开发,一物一码和NFC应用开发、物联网、外贸商城、定制系统和APP开发【致茂网络】 | 铝镁锰板_铝镁锰合金板_铝镁锰板厂家_铝镁锰金属屋面板_安徽建科 |