使用angularjs.foreach时return的问题解决


Posted in Javascript onSeptember 30, 2018

AngularJS中当我们需要遍历某个数组的时候,我们会用到forEach语法。AngularJS中forEach的用法如下:

angular.forEach(array,function(obj,index){
doSomething();
})

array表示需要遍历的数组,obj表示遍历时的每个元素,index表示遍历时元素的下标。index不是必须的参数,可以不写。可以根据需要添加与否。

在写一个比较数组对象中是否存在一个对象,存在返回true,失败返回false.在return时,发现并没有退出方法,自己测试了一下.

首先先写一个数组对象,然后用angularjs的forEach方法循环比较,当存在名字为2的对象时,输出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;
 }();

刚开始认为,当找到value.name == 2的元素时,方法就会直接返回,所以应该只输出1 pass,true pass the test然后程序结束,但输出结果却是这样的:

使用angularjs.foreach时return的问题解决

结果发现在forEach里的return 居然只起到了for循环里的continue作用.

再把forEach循环的返回值和执行函数的返回值打印出来:

使用angularjs.foreach时return的问题解决

forEach函数返回的是循环的数组,函数的返回值是false.说明在forEach里return 并没有奏效,仅仅起到了continue的作用.
去网上搜了一下,并没有原因说明..

解决方案:用一个临时变量存储结果,当条件成立相同时将结果改为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());

使用angularjs.foreach时return的问题解决

这样虽然能获得正确的返回值,但却无法阻止forEach的循环,想来forEach应该是用在历遍数组元素来做一些操作,像这样的应该用for循环比较好一些.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的15款幻灯片插件
Apr 10 Javascript
jQuery提示效果代码分享
Nov 20 Javascript
jQuery插件datepicker 日期连续选择
Jun 12 Javascript
js+div+css下拉导航菜单完整代码分享
Dec 28 Javascript
深入浅析JavaScript中的RegExp对象
Sep 18 Javascript
css和js实现弹出登录居中界面完整代码
Nov 26 Javascript
Auto.js自动收取自己和好友蚂蚁森林能量脚本
Jun 28 Javascript
Vue在 Nuxt.js 中重定向 404 页面的方法
Apr 23 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
Apr 30 Javascript
vscode中eslint插件的配置(prettier配置无效)
Sep 10 Javascript
Vue实现数据请求拦截
Oct 23 Javascript
解决Vue keep-alive 调用 $destory() 页面不再被缓存的情况
Oct 30 Javascript
angular将html代码输出为内容的实例
Sep 30 #Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 #Javascript
对angularJs中$sce服务安全显示html文本的实例
Sep 30 #Javascript
vue  自定义组件实现通讯录功能
Sep 30 #Javascript
对angularJs中2种自定义服务的实例讲解
Sep 30 #Javascript
angularJs在多个控制器中共享服务数据的方法
Sep 30 #Javascript
iview Upload组件多个文件上传的示例代码
Sep 30 #Javascript
You might like
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
php的ZipArchive类用法实例
2014/10/20 PHP
php+ajax实现文章自动保存的方法
2014/12/30 PHP
PHP实现图片不变型裁剪及图片按比例裁剪的方法
2016/01/14 PHP
js 新浪的一个图片播放图片轮换效果代码
2008/07/15 Javascript
javascript笔试题目附答案@20081025_jb51.net
2008/10/26 Javascript
jquery自动完成插件(autocomplete)应用之PHP版
2009/12/15 Javascript
JavaScript CSS修改学习第一章 查找位置
2010/02/19 Javascript
JavaScript 基础篇之运算符、语句(二)
2012/04/07 Javascript
js控制网页前进和后退的方法
2015/06/08 Javascript
jQuery实现鼠标经过弹出提示信息的地图热点效果
2015/08/07 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
JavaScript SHA512加密算法详细代码
2016/10/06 Javascript
JS实现JSON.stringify的实例代码讲解
2017/02/07 Javascript
微信小程序微信支付接入开发实例详解
2017/04/12 Javascript
JavaScript算法教程之sku(库存量单位)详解
2017/06/29 Javascript
详解ES6系列之私有变量的实现
2018/11/21 Javascript
学习RxJS之JavaScript框架Cycle.js
2019/06/17 Javascript
150行Node.js实现的dns代理工具
2019/08/02 Javascript
微信小程序使用自定义组件导航实现当前页面高亮
2020/01/02 Javascript
JavaScript进制转换实现方法解析
2020/01/18 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
2020/04/17 Javascript
解决pycharm双击但是无法打开的情况
2020/10/31 Javascript
[42:04]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第一局
2016/03/03 DOTA
[42:25]EG vs Spirit Supermajor 败者组 BO3 第二场 6.4
2018/06/05 DOTA
Python简单实现网页内容抓取功能示例
2018/06/07 Python
Python使用线程来接收串口数据的示例
2019/07/02 Python
python dumps和loads区别详解
2020/02/04 Python
使用python自动追踪你的快递(物流推送邮箱)
2020/03/17 Python
在Matplotlib图中插入LaTex公式实例
2020/04/17 Python
python实现单机五子棋
2020/08/28 Python
英国文具、办公用品和科技商店:Ryman
2018/09/27 全球购物
大学生职业生涯规划书模板
2014/01/03 职场文书
2015年学校管理工作总结
2015/07/20 职场文书
Java实现给Word文件添加文字水印
2022/02/15 Java/Android
MySQL count(*)统计总数问题汇总
2022/09/23 MySQL