刚学 js，不太熟悉回调函数，想问下这个代码会出问题吗

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 1200 天前的主题，其中的信息可能已经有所发展或是发生改变。

function init(fn){
    document.onkeydown=(e)=>{
        if(e.key==="Enter"){
            fn(true);
        }else if(e.key==="Escape"){
            fn(false);
        }
    }
}

let fn=(arg)=>{
    if(arg){
        console.log("enter");
    }else{
        console.log("esc");
        init(fn);
    }
}

init(fn)

想监听 enter 和 esc 键，实现一个类似前进和后退的动作，不知道这个代码会出问题吗，一开始以为是无限递归，但是跑起来又好像没问题

12 条回复 • 2021-08-04 14:09:05 +08:00

3dwelcome

2021-08-03 22:39:56 +08:00 via Android

不知道为什么要函数套娃，好像没什么实际意义，单纯为了测试？

zxCoder

2021-08-03 22:52:24 +08:00

@3dwelcome 因为写着写着就需要这样子。。。。把业务相关的拿掉就是这个结构了。。。我也觉得怪怪的

xiangyuecn

2021-08-03 23:19:09 +08:00

很正常不过的代码了，原汁原味的 js

函数赋值了一下而已，并没有调用

wunonglin

2021-08-03 23:50:23 +08:00

```
function init() {
document.onkeydown = (e) => {
switch (e.key) {
case 'Enter':
isEnter()
break;
case 'Escape':
isEscape()
break;
}
}
}

function isEnter() {
//
}

function isEscape() {
//
}

init()
```

这样每个按键的 func 各做各的不就行咯。

wenzichel

2021-08-04 00:12:16 +08:00

点击 esc 是会再次执行 init 方法，但只是 onkeydown 方法再次被重新定义而已。

init 中传入 fn 方法也是可以的，这 fn 就是一个回调函数，然后执行 fn 这个函数。

emonc

2021-08-04 00:43:26 +08:00 via Android

可读性好差😪

Puteulanus

2021-08-04 01:32:43 +08:00

document.addEventListener('keydown', console.log)
考虑下 Listener 不

learningman

2021-08-04 02:02:58 +08:00 via Android

可以是可以，好丑

raaaaaar

2021-08-04 08:35:54 +08:00 via Android

@3dwelcome fp

wenzichel

2021-08-04 10:44:21 +08:00

@Puteulanus 你这种写法，多次执行时，会造成重复监听！

Puteulanus

2021-08-04 11:04:46 +08:00

@wenzichel 先不说为什么要多次执行。。

> getEventListeners(document)
< {click: Array(1), DOMContentLoaded: Array(1), mouseup: Array(1)}

> document.addEventListener('keydown', console.log)
< undefined

> document.addEventListener('keydown', console.log)
< undefined

> getEventListeners(document)
< {keydown: Array(1), click: Array(1), DOMContentLoaded: Array(1), mouseup: Array(1)}

不用匿名函数，你确定会重复监听吗
看看 https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#multiple_identical_event_listeners

wenzichel

2021-08-04 14:09:05 +08:00

@Puteulanus 哦，么事了，我是用匿名函数来注册的。