学习笔记 2020-11-17
JavaScript 高级程序设计(第4版) 阅读记录
事件
事件类型
用户界面事件
- DOMActivate
- load
- unload
- abort
- error
- select
- resize
- scroll
load 事件
一般来说,在 window 上发生的事件,都可以通过给
<body>
元素上对应的属性赋值来指定。unload 事件
resize 事件
scroll 事件
scroll 事件发生在 window 上。在混杂模式下,可以通过 body 元素检测 scrollLeft 和 scrollTop 属性的变化。在标准模式下,这些变化在除早期版的 Safari 之外的所有浏览器上都发生在 html 元素上。
window.addEventListener('scroll', event => { if (document.compatMode == 'CSS1Compat') { console.log(document.documentElement.scrollTop); } else { console.log(document.body.scrollTop); } });
焦点事件
- blur
- DOMFocusIn
- DOMFocusOut
- focus
- focusin
- focusout
鼠标和滚轮事件
- click,响应鼠标主键和键盘回车键。
- dbclick
- mousedown
- mouseenter,鼠标光标从元素外部移到元素内部。不冒泡。
- mouseleave,鼠标光标从元素内部移到元素外部。不冒泡。
- mousemove,鼠标光标在元素上移动。
- mouseout,鼠标光标从一个元素移到另一个元素。
- mouseover,鼠标光标从元素外部移到元素内部。
- mouseup
- mousewheel,鼠标滚轮事件。
触发顺序:
- mousedown
- mouseup
- click
- mousedown
- mouseup
- click
- dbclick
click 和 dbclick 依赖其他事件触发。
客户端坐标
- event.clientX
- event.clientY
鼠标光标在视口中的坐标。
页面坐标
- event.pageX
- event.pageY
鼠标光标在页面上的坐标。
屏幕坐标
- event.screenX
- event.screenY
鼠标光标在整个屏幕上的坐标。
修饰键
- event.shiftKey
- event.ctrlKey
- event.altKey
- event.metaKey
现代 JavaScript 教程
函数对象,NFE
属性,name
函数名
属性,length
函数形参个数,rest 参数不参与计数。
自定义属性
命名函数表达式
任务
为 counter 添加 set 和 decrease 方法
修改
makeCounter()
代码,使得 counter 可以进行减一和设置值的操作:counter()
应该返回下一个数字(与之前的逻辑相同)。counter.set(value)
应该将count
设置为value
。counter.decrease(value)
应该把count
减 1。
查看沙箱中的代码获取完整使用示例。
P.S. 你可以使用闭包或者函数属性来保持当前的计数,或者两种都写。
function makeCounter() { function counter() { return counter.count++; } counter.count = 0; counter.set = function (value) { this.count = value; }; counter.decrease = function (value) { this.count--; }; return counter; }
任意数量的括号求和
写一个函数
sum
,它有这样的功能:sum(1)(2) == 3; // 1 + 2 sum(1)(2)(3) == 6; // 1 + 2 + 3 sum(5)(-1)(2) == 6 sum(6)(-1)(-2)(-3) == 0 sum(0)(1)(2)(3)(4)(5) == 15
P.S. 提示:你可能需要创建自定义对象来为你的函数提供基本类型转换。
function sum(a) { let num = a; function f(n) { num += n; return f; } f.toString = function () { return num; }; return f; }