这是我参与8月更文挑战的第2天，活动详情查看：8月更文挑战
设备事件可以用于确定用户使用设备的方式。
1. orientationchange 事件
苹果公司在移动 Safari 浏览器上创造了 orientationchange 事件，创建以方便开发者判断用户的设备是处于垂直模式还是水平模式。
它有以下 3 种值之一：0 表示垂直模式，90 表示左转水平模式（主屏幕键在右侧），–90 表示右转水平模式（主屏幕键在左）。
以下是这个事件典型的用法：
window.addEventListener("load", (event) => {
let div = document.getElementById("myDiv");
div.innerHTML = "Current orientation is " + window.orientation;
window.addEventListener("orientationchange", (event) => {
div.innerHTML = "Current orientation is " + window.orientation;
});
});
所有 iOS 设备都支持 orientationchange 事件和 window.orientation 属性。
2. deviceorientation 事件
deviceorientation 是DeviceOrientationEvent规范定义的事件。如果可以获取设备的加速计信息，而且数据发生了变化，这个事件就会在 window 上触发。
设备本身处于 3D 空间即拥有 x 轴、y 轴和 z 轴的坐标系中。如果把设备静止放在水平的表面上，那么三轴的值均为 0，其中，x 轴方向为从设备左侧到右侧，y 轴方向为从设备底部到上部，z 轴方向为从设备背面到正面。
当 deviceorientation 触发时，event 对象中会包含各个轴相对于设备静置时坐标值的变化，主要是以下 5 个属性。
- alpha：
0~360范围内的浮点值，表示围绕z轴旋转时y轴的度数（左右转）。 - beta：
–180~180范围内的浮点值，表示围绕x轴旋转时z轴的度数（前后转）。 - gamma：
–90~90范围内的浮点值，表示围绕y轴旋转时z轴的度数（扭转）。 - absolute：布尔值，表示设备是否返回绝对值。
- compassCalibrated：布尔值，表示设备的指南针是否正确校准。
下面是一个输出 alpha、beta 和 gamma 值的简单例子：
window.addEventListener("deviceorientation", (event) => {
let output = document.getElementById("output");
output.innerHTML =
`Alpha=${event.alpha}, Beta=${event.beta}, Gamma=${event.gamma}<br>`;
});
3. devicemotion 事件
DeviceOrientationEvent 规范也定义了 devicemotion 事件。这个事件用于提示设备实际上在移动，而不仅仅是改变了方向。
当 devicemotion 事件触发时，event 对象中包含如下额外的属性。
acceleration：对象，包含x、y和z属性，反映不考虑重力情况下各个维度的加速信息。accelerationIncludingGravity：对象，包含x、y和z属性，反映各个维度的加速信息，包含z轴自然重力加速度。interval：毫秒，距离下次触发devicemotion事件的时间。此值在事件之间应为常量。rotationRate：对象，包含alpha、beta和gamma属性，表示设备朝向。
除了 interval 在使用这些属性值之前都需要先判断值是否为 null。例如下面的例子：
window.addEventListener("devicemotion", (event) => {
let output = document.getElementById("output");
if (event.rotationRate !== null) {
output.innerHTML += `Alpha=${event.rotationRate.alpha}` +
`Beta=${event.rotationRate.beta}` +
`Gamma=${event.rotationRate.gamma}`;
}
});
