使用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 相关文章推荐
使用jscript实现二进制读写脚本代码
Jun 09 Javascript
extJs 下拉框联动实现代码
Apr 09 Javascript
extjs之去除s.gif的影响
Dec 25 Javascript
20分钟成功编写bootstrap响应式页面 就这么简单
May 12 Javascript
详解angularjs中如何实现控制器和指令之间交互
May 31 Javascript
JavaScript实现一个空中避难的小游戏
Jun 06 Javascript
jQuery自动或手动图片切换效果
Oct 11 jQuery
了解JavaScript函数中的默认参数
May 30 Javascript
简单分析js中的this的原理
Aug 31 Javascript
vue data恢复初始化数据的实现方法
Oct 31 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
Feb 06 Javascript
ES6中Set和Map用法实例详解
Mar 02 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 在文件指定行插入数据的代码
2010/05/08 PHP
PHP的简易冒泡法代码分享
2012/08/28 PHP
windows中为php安装mongodb与memcache
2015/01/06 PHP
thinkphp表单上传文件并将文件路径保存到数据库中
2016/07/28 PHP
可兼容php5与php7的cURL文件上传功能实例分析
2018/05/11 PHP
JavaScript isPrototypeOf和hasOwnProperty使用区别
2010/03/04 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
2010/11/05 Javascript
js中关于new Object时传参的一些细节分析
2011/03/13 Javascript
JS trim去空格的最佳实践
2011/10/30 Javascript
jquery中子元素和后代元素的区别示例介绍
2014/04/02 Javascript
jquery控制背景音乐开关与自动播放提示音的方法
2015/02/06 Javascript
分享10个原生JavaScript技巧
2015/04/20 Javascript
javascript生成大小写字母
2015/07/03 Javascript
jQuery如何解决IE输入框不能输入的问题
2016/10/08 Javascript
JS简单实现表格排序功能示例
2016/12/20 Javascript
微信小程序-横向滑动scroll-view隐藏滚动条
2017/04/20 Javascript
nodejs中用npm初始化来创建package.json的实例讲解
2018/10/10 NodeJs
Vue切换Tab动态渲染组件的操作
2020/09/21 Javascript
Python编程中的异常处理教程
2015/08/21 Python
Python字符串格式化%s%d%f详解
2018/02/02 Python
Python cookbook(数据结构与算法)从序列中移除重复项且保持元素间顺序不变的方法
2018/03/13 Python
python 重定向获取真实url的方法
2018/05/11 Python
python爬取网易云音乐评论
2018/11/16 Python
Python实现的对本地host127.0.0.1主机进行扫描端口功能示例
2019/02/15 Python
python 实现查询Neo4j多节点的多层关系
2019/12/23 Python
解决margin 外边距合并问题
2019/07/03 HTML / CSS
Html5之自定义属性(data-,dataset)
2019/11/19 HTML / CSS
AVON雅芳官网:世界上最大的美容化妆品公司之一
2016/11/02 全球购物
鞋子女王塔玛拉·梅隆同名奢侈品牌:Tamara Mellon
2017/11/22 全球购物
共产党员公开承诺践诺书
2014/05/28 职场文书
班组长安全工作职责
2014/07/15 职场文书
环境保护建议书
2014/08/26 职场文书
领导班子专题民主生活会情况想汇报
2014/09/30 职场文书
销售工作决心书
2015/02/04 职场文书
2016年大学自主招生自荐信范文
2015/03/24 职场文书
Python 类,对象,数据分类,函数参数传递详解
2021/09/25 Python