使用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 相关文章推荐
javascript+dom树型菜单类,希望朋友们一起进步
May 03 Javascript
js/jquery解析json和数组格式的方法详解
Jan 09 Javascript
javascript 兼容各个浏览器的事件
Feb 04 Javascript
深入探讨javascript函数式编程
Oct 11 Javascript
有关easyui-layout中的收缩层无法显示标题的解决办法
May 10 Javascript
JS简单实现无缝滚动效果实例
Aug 24 Javascript
jQuery过滤选择器用法示例
Sep 12 Javascript
jQuery事件对象总结
Oct 17 Javascript
JS基于设计模式中的单例模式(Singleton)实现封装对数据增删改查功能
Feb 06 Javascript
Vue2.0用户权限控制解决方案的示例
Feb 10 Javascript
浅谈JS的原型和继承
May 08 Javascript
js实现掷骰子小游戏
Oct 24 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
简单的过滤字符串中的HTML标记
2006/12/25 PHP
php购物车实现方法
2015/01/03 PHP
PHP读取并输出XML文件数据的简单实现方法
2017/12/22 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
Javascript 继承实现例子
2009/08/12 Javascript
经典海量jQuery插件 大家可以收藏一下
2010/02/07 Javascript
jquery lazyload延迟加载技术的实现原理分析
2011/01/24 Javascript
JQuery扩展插件Validate 2通过参数设置验证规则
2011/09/05 Javascript
浏览器打开层自动缓慢展开收缩实例代码
2013/07/04 Javascript
js和html5实现手机端刮刮卡抽奖效果完美兼容android/IOS
2013/11/18 Javascript
jquery操作复选框(checkbox)的12个小技巧总结
2014/02/04 Javascript
jQuery中extend函数详解
2015/02/13 Javascript
JavaScript使用shift方法移除素组第一个元素实例分析
2015/04/06 Javascript
用Move.js配合创建CSS3动画的入门指引
2015/07/22 Javascript
HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
2015/11/25 Javascript
javascript合并表格单元格实例代码
2016/01/03 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
2017/03/07 Javascript
教你快速搭建Node.Js服务器的方法教程
2017/03/30 Javascript
解决html input验证只能输入数字,不能输入其他的问题
2017/07/21 Javascript
JavaScript如何获取一个元素的样式信息
2019/07/29 Javascript
详解Vue-cli3.X使用px2rem遇到的问题
2019/08/09 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
2019/09/11 Javascript
vue项目配置同一局域网可使用ip访问的操作
2020/10/23 Javascript
[01:00] DOTA2英雄背景故事第五期之重力引力法则谜团
2020/07/16 DOTA
Python实现控制台输入密码的方法
2015/05/29 Python
浅谈Python中的可变对象和不可变对象
2017/07/07 Python
Python利用heapq实现一个优先级队列的方法
2019/02/03 Python
python使用BeautifulSoup与正则表达式爬取时光网不同地区top100电影并对比
2019/04/15 Python
python线程池如何使用
2020/05/28 Python
解决Pytorch自定义层出现多Variable共享内存错误问题
2020/06/28 Python
浅谈matplotlib 绘制梯度下降求解过程
2020/07/12 Python
大学本科毕业生的自我鉴定范文
2013/11/19 职场文书
中层竞聘演讲稿
2014/01/09 职场文书
Nginx 502 Bad Gateway错误原因及解决方案
2021/03/31 Servers
python 中的jieba分词库
2021/11/23 Python
vue如何清除浏览器历史栈
2022/05/25 Vue.js