Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[js] 第10天 简要描述下什么是回调函数并写一个例子出来 #30

Open
haizhilin2013 opened this issue Apr 25, 2019 · 36 comments
Labels
js JavaScript

Comments

@haizhilin2013
Copy link
Collaborator

第10天 简要描述下什么是回调函数并写一个例子出来

@haizhilin2013 haizhilin2013 added the js JavaScript label Apr 25, 2019
@tiyunchen
Copy link

通常将一个函数B传入另一个函数A,并且在 需要的时候再调用函数A。
promise 就有回调

@myprelude
Copy link

dom.addEventerlisten('click',function(){
  // do something
})

@Damon99999
Copy link

(callback) => {
    return (...args) => {
        const self = this;
        setTimeout(() => {
            callback.apply(self, args);
        }, 200);
    };
};

@AricZhu
Copy link

AricZhu commented Jun 19, 2019

回调函数就是指函数在初始定义的时候先不执行,等满足一定条件以后再拿出来执行。如下:
setTimeout(() => { console.log('在本轮任务最后执行!') }, 0);

@persist-xyz
Copy link

asyncFn: () => {
        // 1
        $('body').onclick = e => {
            console.log(e)
        }

        // 2
        document.querySelector('body').addEventListener('click', e => {
            console.log(e)
        })

        // 3
        setTimeout((e) => {
            console.log(e)
        }, 100)

        // 4
        $ajax('/url', res => {})
    }

@Konata9
Copy link

Konata9 commented Jul 6, 2019

回调函数首先作为一个函数的参数传入,当这个函数执行后再执行的函数,往往会依赖前一个函数执行的结果。
javascript 中,对于 I/O、HTTP 请求等异步操作,为了控制执行的顺序就需要使用回调的方法。

// 第三个参数就是回调函数
function func1(param1, param2, ..., callback){
  // To do some action
  // 往往会在最后调用 callback 并且传入操作过的参数
  callback(cbParam1, cbParam2, ...)
}

// 实际调用的时候
func1(param1, param2, ..., (cbParam1, cbParam2, ...) => {
  // To do some action
})

当有过个任务需要顺序执行时,如果采用回调函数的形式就会出现我们熟悉的“回调地狱”的情况。为了解决这个问题,在 ES6 中就有了 Promiseasync/await 方法。
目前看来 async/await 在异步写法上较为优雅。

@15190408121
Copy link

简单的这个算吗
var i = 0;
function callBack(I) {
if (I < 10) {
console.log(i)
callBack(i++)
} else {
console.log("回调成功")
}
}
callBack(i)

@Vi-jay
Copy link

Vi-jay commented Jul 25, 2019

简单的这个算吗
var i = 0;
function callBack(I) {
if (I < 10) {
console.log(i)
callBack(i++)
} else {
console.log("回调成功")
}
}
callBack(i)

不算 你这是递归

@Vi-jay
Copy link

Vi-jay commented Jul 25, 2019

回调是把一个函数作为参数传递给另一个函数,当该函数满足某个条件时触发该参数函数。
主要用于异步操作 例如网络请求 防止页面同步代码阻塞导致渲染线程停止

function longTask(callback,timeout) {
  setTimeout(callback,timeout)
}
longTask(()=>{console.log("回调任务被执行了");},2000);
console.log("我是同步代码 不会阻塞我");

@hc951221
Copy link

hc951221 commented Aug 7, 2019

function a() {
console.log('触发了函数a')
}
function b() {
console.log('触发了函数b')
}
function c(callback1, callback2) {
let num = Math.random() * 10
if (num > 6) {
callback1()
} else {
callback2()
}
}
c(a,b)

@15190408121
Copy link

// 比较简单的就是快排算法
function quick(arr) {
if(arr.length <= 1) {
return arr; //递归出口
}
var left = [],
right = [],
current = arr.splice(0,1); //注意splice后,数组长度少了一个
for(let i = 0; i < arr.length; i++) {
if(arr[i] < current) {
left.push(arr[i]) //放在左边
} else {
right.push(arr[i]) //放在右边
}
}
return quick(left).concat(current,quick(right)); //递归
}

@xcLtw
Copy link

xcLtw commented Sep 2, 2019

[1,2,3].map(x=>x+1)
按照依赖前置函数,作为参数传入的条件,这个是回调函数吧

@Yulingsong
Copy link

Yulingsong commented Sep 25, 2019

不知道这个算不算,以前对请求方法做了一个简化,success和error算是回调函数吧,我的理解就是把函数当做参数放到另一个函数中。。

 GET: function (url, data, success, error) {
    $.ajax({
      type: 'get',
      url: url,
      dataType: "JSON",
      success: function (result) {
        success(result)
      },
      error: function erryFunction(err) {
        error(err);
      }
    });
  },

GET(url,data,function(res){
    //deal success result
},function(err){
    //deal error result
})

@crazyming9528
Copy link

我对回调函数的理解就是,定义了一个函数,不去调用他,但是这个函数会在特定时间条件下被调用

@Fa-haxiki
Copy link

回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。
回调方法 是 任何一个 被 以该回调方法为其第一个参数 的 其它方法 调用 的方法。很多时候,回调是一个当某些事件发生时被调用的方法。

@lizhesystem
Copy link

lizhesystem commented Mar 17, 2020

回调函数一般用来解决异步请求:
给每一个任务(函数)传入一个或多个回调函数(callback),前一个任务结束后(比如请求接口),不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

/**
 * 普通语法
 * @param scr:图片的url地址
 * @param callback:图片加载成功的回调函数
 * @param fail:图片加载失败的回调函数
 */
function loadImg(scr, callback, fail) {
    var img = document.createElement('img');

    // onload 事件在图片加载完成后立即执行,成功后执行callback函数,相当于一个回调函数。
    img.onload = function () {
        callback(img) // 图片加载成功执行的回调函数,传入img
    };
    // 图片加载失败执行这个函数
    img.onerror = function () {
        fail()  // 图片加载失败执行的回调函数,传入img
    };
    img.src = scr
}

var src = 'https://cdn.segmentfault.com/sponsor/20200202.png';

// 调用函数,传入2个回调函数,第一个是成功的回调,第二个是失败的回调。
loadImg(src, function (img) {
    console.log(img.width)  // 回调函数里打印图片的宽

}, function () {
    console.log('failed') // 这个是失败的回调函数
});

@rennzhang
Copy link

回调函数

任何一个函数都可以是回调函数,他单纯的就是一个函数

高阶函数

有很多说法都是,把函数作为参数传入另一个函数就是回调函数,其实这是错误的,这个应该叫做高阶函数

因为平时见到的大部分回调函数的应用,都是通过高阶函数来完成的

回调函数的应用

jQuery中,回调函数被广泛应用,比如:

$("#btn_1").click(function() {
  alert("Btn 1 Clicked");
});

理解

简单理解,就是满足某个条件的时候去调用一个函数,这个被调用的就是回调函数

@qiqingfu
Copy link

qiqingfu commented Apr 4, 2020

回调函数是作为其他函数的参数的函数

function loggle(msg, cb) {
    setTimeout(function () {
      // cb 是 print 回调函数的引用
      cb(msg);
    }, 1000)
  }

 // 我就是回调函数
  function print (msg) {
    console.log(msg); // Hello
  }

  // 一秒后打印 message
  loggle('Hello', print);

@artoriaforDY
Copy link

function doso(callback){
alert(1)
callback()
}
doso(function(){alert(2)})

@blueRoach
Copy link

blueRoach commented May 26, 2020

回调函数是,一个函数作为另一个函数的参数,当某个特定的条件发生,作为参数的函数就被执行。
比如向服务器发送一个请求,服务器返回一个code,前端根据这个code来反应是否成功响应

function a(b){
    setTimeout(b, 1000)
}
function b(){
    console.log(1)
}
a(b)

@giggleCYT
Copy link

回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。
简单的例子:

    function a(callback) {
        callback(1,2)
    }
    a(function (a,b) { // 匿名回调函数
        console.log(a*b) // 2
    })

@Alex-Li2018
Copy link

回调函数: 当一个操作是异步的时候,此时为了获取异步的返回值,通常使用回调函数来接收值

  1. dom的事件监听
  2. 定时器
  3. 异步操作

这里说下异步操作:

function asyncFn (fn) {
setTimeout(() => {
let val = 5
fn(val)
}, 1000);
}

asyncFn(val => {
console.log(val);
})

时隔一秒后打印5

@laboonly
Copy link

第10天 简要描述下什么是回调函数并写一个例子出来

回调函数就是一个通过函数指针调用的函数。 如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。 回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。

function(callback,url) {
let xhr = new XMLHttpRequest();
... ....
xhr.onreadystatechange = callback();

    xhr.send();

}

@MrZ2019
Copy link

MrZ2019 commented Sep 4, 2020

回调是把一个函数作为参数传递给另一个函数,当该函数满足某个条件时触发该参数函数。
主要用于异步操作 例如网络请求 防止页面同步代码阻塞导致渲染线程停止

function longTask(callback,timeout) {
setTimeout(callback,timeout)
}
longTask(()=>{console.log("回调任务被执行了");},2000);
console.log("我是同步代码 不会阻塞我");

@lxt-ing
Copy link

lxt-ing commented Apr 16, 2021

回调函数,不马上执行,而是等到一些方法操作成功后才会执行。
document.addEventListener('click',clickEvent,false);
$.ajax({
url:'',
type:'',
data:'',
success:function(res){
console.log(res);
}
})

@378406712
Copy link

作为参数传递的函数,
new Promise((resolve,reject)=>{
try{
// do sth
resolve()
}
catch(err=>console.log(err))
})

@Injured-Double
Copy link

简单的说,就是一个函数在另一个函数内部杯调用

    function fn() {
        console.log('function name is fn');
    }


    function m1(f) {
        f();
    }

    m1(fn);  //function name is fn

@zxcdsaqwe123
Copy link

function callback(){
console.log('你调用我了')
}
function test(str,callback){
console.log(str);
callback();
}

test('我怎么知道',callback);

@amikly
Copy link

amikly commented Oct 28, 2021

含义

function print(callback) {  
    callback();
}

在上述代码中,print() 函数将另一个函数作为参数,并在函数体内调用它,这叫做回调

被传递给另一个函数作为参数并且最终被调用的函数叫做回调函数

作用

回调函数能帮助我们编写异步代码(I/O、HTTP 请求等),它能确保函数在某个任务完成之前不运行,在任务完成后立即运行

实现

// 在控制台打印一条消息(message),它在 3 秒之后显示
const message = function() {  
    console.log("This message is shown after 3 seconds");
}
 
setTimeout(message, 3000);

// ES6
setTimeout(() => { 
    console.log("This message is shown after 3 seconds");
}, 3000);

message 函数是在发生某事之后(在本示例中为 3 秒之后),而不是在此之前被调用。因此,message 函数就是一个回调函数

@tk12138
Copy link

tk12138 commented Nov 16, 2021

一个函数被作为参数传递给另一个函数,并在其中被调用。特点是:自己定义的函数;你没有调用;最终它执行了。
常见的回调函数:
// DOM事件回调
document.getElementById('btn').onclick = function (){
alert('btn')
}
// 定时器回调函数
let intervalId = null
intervalId = setInterval(function (){
alert('到点了')
}, 2000)

@github-cxtan
Copy link

回调是把一个函数作为参数传递给另一个函数,当该函数满足某个条件时触发该参数函数。
主要用于异步操作 例如网络请求 防止页面同步代码阻塞导致渲染线程停止

function longTask(callback,timeout) {
setTimeout(callback,timeout)
}
longTask(()=>{console.log("回调任务被执行了");},2000);
console.log("我是同步代码 不会阻塞我");

@yxllovewq
Copy link

yxllovewq commented Mar 8, 2022

回调函数:将回调函数a作为参数传入另一个函数b,在b执行中,满足某个条件时执行a。常用来获取且处理异步任务返回的数据。

function getName (callback) {
  setTimeout(() => Promise.resolve('myName').then(callback), 3000);
}

@syfine
Copy link

syfine commented Apr 13, 2022

回调函数是一个作为变量传递给另外一个函数的函数,它在主体函数执行完之后执行

@xiaoqiangz
Copy link

回调函数:可以理解一个把一个函数当做参数传给一个函数,可以理解为高阶函数,在函数内中执行时,满足某个条件时会执行该参数去执行回调,通常用来处理异步任务。

@wyy-g
Copy link

wyy-g commented Sep 9, 2022

有两个函数,函数a和函数b,函数a的参数是函数b,当函数a执行完以后再执行函数b,函数b就是回调函数
setTimeout(function(){
console.log('回调函数')
}, 1000)

@wuder-jie
Copy link

  • 函数作为形参,传入另一个函数,并在需要的时候,在这个函数内调用。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
js JavaScript
Projects
None yet
Development

No branches or pull requests