使用angularjs.foreach時(shí)return的問(wèn)題解決
AngularJS中當(dāng)我們需要遍歷某個(gè)數(shù)組的時(shí)候,我們會(huì)用到forEach語(yǔ)法。AngularJS中forEach的用法如下:
angular.forEach(array,function(obj,index){ doSomething(); })
array表示需要遍歷的數(shù)組,obj表示遍歷時(shí)的每個(gè)元素,index表示遍歷時(shí)元素的下標(biāo)。index不是必須的參數(shù),可以不寫(xiě)??梢愿鶕?jù)需要添加與否。
在寫(xiě)一個(gè)比較數(shù)組對(duì)象中是否存在一個(gè)對(duì)象,存在返回true,失敗返回false.在return時(shí),發(fā)現(xiàn)并沒(méi)有退出方法,自己測(cè)試了一下.
首先先寫(xiě)一個(gè)數(shù)組對(duì)象,然后用angularjs的forEach方法循環(huán)比較,當(dāng)存在名字為2的對(duì)象時(shí),輸出true并返回,否則輸出false并返回.
self.test = function() { var testArray = [{name: 1},{name:2},{name:3}]; angular.forEach(testArray, function(value, key){ if (value.name == 2) {console.log(true + ' pass the test');return;} console.log(value.name + ' pass'); }); console.log(false + ' pass the test'); return false; }();
剛開(kāi)始認(rèn)為,當(dāng)找到value.name == 2的元素時(shí),方法就會(huì)直接返回,所以應(yīng)該只輸出1 pass,true pass the test然后程序結(jié)束,但輸出結(jié)果卻是這樣的:
結(jié)果發(fā)現(xiàn)在forEach里的return 居然只起到了for循環(huán)里的continue作用.
再把forEach循環(huán)的返回值和執(zhí)行函數(shù)的返回值打印出來(lái):
forEach函數(shù)返回的是循環(huán)的數(shù)組,函數(shù)的返回值是false.說(shuō)明在forEach里return 并沒(méi)有奏效,僅僅起到了continue的作用.
去網(wǎng)上搜了一下,并沒(méi)有原因說(shuō)明..
解決方案:用一個(gè)臨時(shí)變量存儲(chǔ)結(jié)果,當(dāng)條件成立相同時(shí)將結(jié)果改為true:
self.test = function() { var testArray = [{name: 1},{name:2},{name:3}]; var result = false; angular.forEach(testArray, function(value, key){ if (value.name == 2) {result = true;} }); return result; }; console.log(self.test());
這樣雖然能獲得正確的返回值,但卻無(wú)法阻止forEach的循環(huán),想來(lái)forEach應(yīng)該是用在歷遍數(shù)組元素來(lái)做一些操作,像這樣的應(yīng)該用for循環(huán)比較好一些.
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Angular6實(shí)現(xiàn)拖拽功能指令drag實(shí)例詳解
這篇文章主要為大家介紹了Angular6實(shí)現(xiàn)拖拽功能指令drag實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11AngularJS頁(yè)面訪問(wèn)時(shí)出現(xiàn)頁(yè)面閃爍問(wèn)題的解決
這篇文章主要介紹了AngularJS框架使用中出現(xiàn)頁(yè)面閃爍問(wèn)題的解決方法,閃爍問(wèn)題一般是初始化未加載完畢造成的,需要的朋友可以參考下2016-03-03angular.JS實(shí)現(xiàn)網(wǎng)頁(yè)禁用調(diào)試、復(fù)制和剪切
這篇文章主要給大家介紹了angular.JS實(shí)現(xiàn)網(wǎng)頁(yè)禁用調(diào)試、復(fù)制和剪切的相關(guān)資料,文中介紹的非常詳細(xì),相信對(duì)大家具有一定的參考價(jià)值,需要的朋友們下面來(lái)一起看看吧。2017-03-03angularJs中$scope數(shù)據(jù)序列化的實(shí)例
今天小編就為大家分享一篇angularJs中$scope數(shù)據(jù)序列化的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09整理AngularJS框架使用過(guò)程當(dāng)中的一些性能優(yōu)化要點(diǎn)
這篇文章主要介紹了AngularJS框架使用過(guò)程當(dāng)中的一些性能優(yōu)化要點(diǎn),Angular通常被用來(lái)制作大型單頁(yè)應(yīng)用,因而性能問(wèn)題也是必須考慮的因素,需要的朋友可以參考下2016-03-03AngularJS動(dòng)態(tài)加載模塊和依賴的方法分析
這篇文章主要介紹了AngularJS動(dòng)態(tài)加載模塊和依賴的方法,結(jié)合實(shí)例形式分析了AngularJS使用ocLazyLoad實(shí)現(xiàn)動(dòng)態(tài)加載的相關(guān)操作技巧,需要的朋友可以參考下2016-11-11用WebStorm進(jìn)行Angularjs 2開(kāi)發(fā)(環(huán)境篇:Windows 10,Angular-cli方式)
這篇文章主要介紹了用WebStorm進(jìn)行Angularjs 2開(kāi)發(fā)(環(huán)境篇:Windows 10,Angular-cli方式),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-12-12