JavaScript find()方法及返回数据实例

顾名思义就是 查找传入的对应数据

当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。

如果没有符合条件的元素返回 undefined

// 定义一个需要被查找的数组
var memoList = [{
        id: 1, name: '1'
      },{
        id: 2, name: '2'
      },{
        id: 3, name: '3'
      }]
// 用 editItem 变量将 查找出来的数据进行接收
var editItem = memoList.find((ele) => {
               return ele.id == 2
            })
// 打印 editItem 得到的结果是 {id: 2, name: '2'}

这看起来和没什么区别呀。。。

但是～～

// 我们修改 接收后的值 editItem 的值
editItem.name = '我是修改后的'

// 我们再打印一下 editItem
console.log( editItem )  // {id: 2, name: '我是修改后的'}

感觉很正常嘛～

然后我们再打印一下 被查找的数据 memoList

console.log(memoList)
// [{id: 1, name: "1"}, {id: 2, name: "我是修改后的"}, {id: 3, name: "3"}]

// 看得没 memoList 内的数据也被修改了

这里就反应出 fine() 方法返回的结果内存指向依然是 memoList 所指向的内存地址

所有这里返回的是浅拷贝的数据

注意: find() 对于空数组，函数是不会执行的。

注意: find() 并没有改变数组的原始值。

浏览器支持

表格中的数字表示支持该方法的第一个浏览器版本号。

方法          
find() 45.0 12.0 25.0 7.1 32.0

注意: IE 11 及更早版本不支持 find() 方法。

array.find(function(currentValue, index, arr),thisValue)

参数

参数 描述
function(currentValue, index,arr) 必需。数组每个元素需要执行的函数。
函数参数:

参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引值
arr 可选。当前元素所属的数组对象
thisValue 可选。 传递给函数的值一般用 “this” 值。
如果这个参数为空， “undefined” 会传递给 “this” 值

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • spring boot 统一JSON格式的接口返回结果的实现

    spring boot 统一JSON格式的接口返回结果的实现

    前后端分离的项目开发前,会提前规定好数据返回格式,本文以JSON为例. 第一步,定义好JavaBean. package com.yclouds.myhelper.web.response; import com.fasterxml.jackson.annotation.JsonIgnore; import com.yclouds.myhelper.web.error.code.BaseEnumError; import java.io.Serializable; import lombok.D

  • Springboot2.0处理自定义异常并返回json

    Springboot2.0处理自定义异常并返回json

    这篇文章主要介绍了Springboot2.0处理自定义异常并返回json,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1. 编写自定义异常类 package cn.jfjb.crud.exception; /** * @author john * @date 2019/11/24 - 9:48 */ public class UserNotExistException extends RuntimeException { public Use

  • laravel 错误处理,接口错误返回json代码

    Laravel 默认已经为我们配置好了错误和异常处理,我们在 App\Exceptions\Handler 类中触发异常并将响应返回给用户. 所有异常都由类App\Exceptions\Handler处理,该类包含两个方法:report和render report方法只是将异常传递给异常被记录的基类,我们这里主要是针对 render 的修改: 先看代码: public function render($request, Exception $exception) { if($request->i

  • SpringBoot项目中处理返回json的null值(springboot项目为例)

    在后端数据接口项目开发中,经常遇到返回的数据中有null值,导致前端需要进行判断处理,否则容易出现undefined的情况,如何便捷的将null值转换为空字符串? 以SpringBoot项目为例,SSM同理. 1.新建配置类(JsonConfig.java) import com.fasterxml.jackson.core.JsonGenerator; import com.fasterxml.jackson.core.JsonProcessingException; import com.f

  • javascript跳转与返回和刷新页面的实例代码

    javascript中window.open()与window.location.href的区别 window.open('index.html') 表示新增一个窗口打开 index.html 这个页面,并不刷新 location.href('index.html') 表示在当前窗口重定向到新页面,打开并刷新 index.html 这个页面 window.location 是 window 对象的属性,用来替换当前页,也就是重新定位当前页 而window.open 是 window 对象的方法,

  • zabbix redis自动发现端口的脚本返回json格式

    在我们进行自动发现的时候,总会有一个脚本来获取端口等信息,并返回json格式,那以redis为例,下边是redis进行进行自动发现的脚本 redisport=(`ps aux|grep -w redis-server|grep -v "grep" |awk -F':' '{print $NF}'`) portnum=${#redisport[@]} count=`hostname | grep "\-SQ" | wc -l` if [ $count -eq 1 ];

  • Selenium执行Javascript脚本参数及返回值过程详解

    在Selenium中可以使用drvier.execute_script()来执行Javascript脚本,支持多行语句. 使用Javascript可以实现以下功能: 移除元素隐藏.禁用.只读等限制属性 为元素添加id或高亮样式 页面滚动 富文本框输入(HTML注入) 获取页面信息 使用Javascript参数 在使用Javascript语句时,还可以动态传入参数或元素对象,Javascript语句中使用占位符"argument[n]"来表示取第几个参数,如: js = "ar

  • JavaScript find()方法及返回数据实例

    顾名思义就是 查找传入的对应数据 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数. 如果没有符合条件的元素返回 undefined // 定义一个需要被查找的数组 var memoList = [{ id: 1, name: '1' },{ id: 2, name: '2' },{ id: 3, name: '3' }] // 用 editItem 变量将 查找出来的数据进行接收 var editItem = memoList.fin

  • jQuery处理xml格式的返回数据(实例解析)

    在这个示例程序中,我将使用$.ajax()方法,使用$.get()方法也可以,但我觉得$.ajax()更好一些,代码更容易懂,并且也不怎么复杂. 复制代码 代码如下: //定义用户名校验的方法function verify(){    //首先测试一下页面的按钮按下,可以调用这个方法    //使用javascript的alert方法,显示一个探出提示框    //alert("按钮被点击了!!!");    //1.获取文本框中的内容    //document.getElement

  • ES6 javascript中Class类继承用法实例详解

    本文实例讲述了ES6 javascript中Class类继承用法.分享给大家供大家参考,具体如下: 1. 基本用法 Class 之间可以通过extends关键字实现继承, 这比 ES5 的通过修改原型链实现继承, 要清晰和方便很多. class ColorPoint extends Point {} 上面代码定义了一个ColorPoint类, 该类通过extends关键字, 继承了Point类的所有属性和方法. 但是由于没有部署任何代码, 所以这两个类完全一样, 等于复制了一个Point类. 下

  • springboot统一接口返回数据的实现

    一,没有异常的情况,正常返回数据 希望接口统一返回的数据格式如下: { "status": 0, "msg": "成功", "data": null } 和接口数据对应的bean /** * 统一返回结果的实体 * @param <T> */ public class Result<T> implements Serializable { private static final long serial

  • javascript解析ajax返回的xml和json格式数据实例详解

    本文实例讲述了javascript解析ajax返回的xml和json格式数据.分享给大家供大家参考,具体如下: 写个例子,以备后用 一.JavaScript 解析返回的xml格式的数据: 1.javascript版本的ajax发送请求 (1).创建XMLHttpRequest对象,这个对象就是ajax请求的核心,是ajax请求和响应的信息载体,单是不同浏览器创建方式不同 (2).请求路径 (3).使用open方法绑定发送请求 (4).使用send() 方法发送请求 (5).获取服务器返回的字符串

  • Vue中请求本地JSON文件并返回数据的方法实例

    Vue中请求本地JSON文件并返回数据的方法实例

    目录 1.目录结构 2.检查一下自己是否安装了 json-server(以下截图代表安装了) 3.安装完成以后我们就可以运行自己的json文件了 4.看看浏览器里的数据呈现效果吧 5.为了保险起见,我还特地去 postman 上测试了一下(可以省略这步) 6.现在我们可以编写代码发送请求来获取数据啦 7.在控制台就可以看到我们数据请求回来了 总结 1.目录结构 直接在根目录下创建自己的JSON文件,在此我的JSON文件名为data.json 以下是我的JSON文件内容(此处是参照的黑马程序员的v

  • Ajax上传实现根据服务器端返回数据进行js处理的方法

    本文实例讲述了Ajax上传实现根据服务器端返回数据进行js处理的方法.分享给大家供大家参考.具体如下: Ajax上传说白了还是使用form表单提交,在当前页面加一个iframe,将提交的内容跳转到iframe中,造成一种页面无刷新的错觉. 以前也做过上传,基本是是使用commons-fileupload组件,基本的步骤是使用servlet处理完上传之后,使用PrintWrite的对象实例输出显示内容,可以是直接输出内容,也可以是输出script进行操作如 复制代码 代码如下: response.

  • php实现的返回数据格式化类实例

    本文实例讲述了php实现的返回数据格式化类及其用法,在字符串处理中非常具有实用价值.分享给大家供大家参考.具体方法如下: DataReturn.class.php类文件如下: <?php /** 返回数据格式化类 * Date: 2011-08-15 * Author: fdipzone */ class DataReturn{ // class start private $type; private $xmlroot; private $callback; private $returnDa

  • jquery访问servlet并返回数据到页面的方法

    本文实例讲述了jquery访问servlet并返回数据到页面的方法.分享给大家供大家参考.具体实现方法如下: 1. servlet:AjaxServlet.java如下: 复制代码 代码如下: package com.panlong.servlet; import java.io.IOException;  import java.io.PrintWriter;  import java.net.URLDecoder; import javax.servlet.ServletException;

  • 对Layer弹窗使用及返回数据接收的实例详解

    Layer做为弹窗,主页面代码: 注意1. callback()方法 返回字符串,再data:JSON.parse(res)转为ajax提交时的json参数 注意2. textarea 上使用append方法没有效果,改写: var str = $("#area").val() + "\n"+d; $("#area").val(str); //引入js 必须要有(1.8以上版本) jquery <script src="__PUB

随机推荐