使用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 相关文章推荐
准确获得页面、窗口高度及宽度的JS
Nov 26 Javascript
限制上传文件大小和格式的jQuery插件实例
Jan 24 Javascript
jquery+json实现数据二级联动的方法
Nov 28 Javascript
JavaScript驾驭网页-获取网页元素
Mar 24 Javascript
jQuery实现的表头固定效果实例【附完整demo源码下载】
Aug 01 Javascript
jQuery Form插件使用详解_动力节点Java学院整理
Jul 17 jQuery
vue组件发布到npm简单步骤
Nov 30 Javascript
bmob js-sdk 在vue中的使用教程
Jan 21 Javascript
vue router 通过路由来实现切换头部标题功能
Apr 24 Javascript
JavaScript 处理树数据结构的方法示例
Jun 16 Javascript
layer.confirm点击第一个按钮关闭弹出框的方法
Sep 09 Javascript
如何让vue长列表快速加载
Mar 29 Vue.js
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 foreach正序倒序输出示例代码
2014/07/01 PHP
[原创]PHP简单开启curl的方法(测试可行)
2016/01/11 PHP
PHP二进制与字符串之间的相互转换教程
2016/10/14 PHP
php使用正则表达式获取字符串中的URL
2016/12/29 PHP
javascript中的对象和数组的应用技巧
2007/01/07 Javascript
修改好的jquery滚动字幕效果实现代码
2011/06/22 Javascript
js实现身份证号码验证的简单实例
2014/02/19 Javascript
JavaScript制作的可折叠弹出式菜单示例
2014/04/04 Javascript
js闭包实例汇总
2014/11/09 Javascript
JavaScript数组Array对象增加和删除元素方法总结
2015/01/20 Javascript
jQuery实现form表单元素序列化为json对象的方法
2015/12/09 Javascript
由浅入深讲解Javascript继承机制与simple-inheritance源码分析
2015/12/13 Javascript
Javascript实现鼠标框选操作  不是点击选取
2016/04/14 Javascript
如何判断Javascript对象是否存在的简单实例
2016/05/18 Javascript
jQuery 更改checkbox的状态,无效的解决方法
2016/07/22 Javascript
获取select的value、text值的简单示例(jquery与javascript)
2016/12/07 Javascript
Angular将填入表单的数据渲染到表格的方法
2017/09/22 Javascript
node基于puppeteer模拟登录抓取页面的实现
2018/05/09 Javascript
微信小程序wx:for循环的实例详解
2018/10/07 Javascript
jquery实现图片无缝滚动 蒙版遮蔽效果
2020/01/11 jQuery
vue数据响应式原理知识点总结
2020/02/16 Javascript
使用C语言扩展Python程序的简单入门指引
2015/04/14 Python
python使用分治法实现求解最大值的方法
2015/05/12 Python
python利用dir函数查看类中所有成员函数示例代码
2017/09/08 Python
Django后台管理系统的图文使用教学
2020/01/20 Python
python让函数不返回结果的方法
2020/06/22 Python
Python面向对象多态实现原理及代码实例
2020/09/16 Python
波兰运动鞋网上商店:Distance.pl
2020/07/30 全球购物
考试违纪检讨书
2014/02/02 职场文书
淘宝好评语大全
2014/05/05 职场文书
教师年终个人总结
2015/02/11 职场文书
商务司机岗位职责
2015/04/10 职场文书
2016年安康杯竞赛活动总结
2016/04/05 职场文书
详解MySQL主从复制及读写分离
2021/05/07 MySQL
关于@OnetoMany关系映射的排序问题,使用注解@OrderBy
2021/12/06 Java/Android
Redis实战高并发之扣减库存项目
2022/04/14 Redis