JavaScript - 全局对象

JavaScript 全局对象的介绍

你好，未来的 JavaScript 巫师们！今天，我们将踏上一段激动人心的旅程，探索 JavaScript 全局对象的世界。想象这些对象是 JavaScript 宇宙中的 VIP——无论你在代码的哪个地方，它们总是围绕在你身边，随时准备提供帮助。让我们深入探索这些无所不在的实体的力量！

JavaScript - Global Object

什么是全局对象？

JavaScript 中的全局对象就像编程中的瑞士军刀——它们是多功能的工具，随时供你使用。这些对象在开始运行 JavaScript 时自动创建，你可以在代码的任何地方访问它们。把它们想象成总是陪伴在你身边的助手，随时准备帮助你完成各种任务。

Window 对象：全局对象之王

在网页浏览器中，所有全局对象中的王者是 window 对象。它就像你网页的大老板，监督着发生的一切。让我们来看一个简单的例子：

console.log(window.innerWidth);
console.log(window.innerHeight);

当你在浏览器中运行这段代码时，它会显示浏览器窗口的宽度和高度。酷吧？就像给你的网页配备了一把内置的测量尺！

全局对象及其方法的示例

现在，让我们探索一些最常用的全局对象及其方法。我会向你展示它们如何让程序员的生活变得更轻松。

1. Math 对象：你的数学助手

Math 对象就像一个超级智能的计算器，总是触手可及。以下是一些示例：

console.log(Math.PI); // 输出：3.141592653589793
console.log(Math.round(4.7)); // 输出：5
console.log(Math.random()); // 输出：0 到 1 之间的随机数

在这个示例中，我们使用 Math 对象来访问 PI 的值、四舍五入一个数字以及生成一个随机数。就像拥有一个数学天才作为你的私人助手！

2. Date 对象：你的时间旅行伙伴

Date 对象帮助你处理日期和时间。它就像在你的代码中拥有了一台时间机器！

let today = new Date();
console.log(today.getFullYear()); // 输出：当前年份（例如，2023）
console.log(today.getMonth()); // 输出：当前月份（0-11）
console.log(today.getDate()); // 输出：当前月份的天数

这段代码创建了一个新的 Date 对象，代表当前日期和时间，然后提取了它的特定部分。就像问你的时间旅行伙伴：“嘿，现在是哪一年？”

3. String 对象：文本操作者

String 对象是处理文本的首选助手。来看看这些便捷的方法：

let message = "Hello, World!";
console.log(message.length); // 输出：13
console.log(message.toUpperCase()); // 输出：HELLO, WORLD!
console.log(message.split(", ")); // 输出：["Hello", "World!"]

在这里，我们使用 String 对象的方法来计算字符数、将消息转换为大写以及将消息拆分成部分。就像拥有一个善于处理文本的朋友，可以帮助你以各种方式操纵单词！

使用 JavaScript 全局对象进行 Polyfills

现在，让我们谈谈一个更高级的概念：polyfills。别担心，如果听起来令人畏惧——我会为你分解！

Polyfill 就像是一座连接旧版和新款 JavaScript 的桥梁。它允许你在不支持这些新特性的旧浏览器中使用 JavaScript 的新特性。全局对象在创建 polyfills 时起着关键作用。

以下是一个 Array.prototype.includes 方法的 polyfill 示例：

if (!Array.prototype.includes) {
Array.prototype.includes = function(searchElement, fromIndex) {
if (this == null) {
throw new TypeError('"this" 是 null 或未定义');
}

var o = Object(this);
var len = o.length >>> 0;

if (len === 0) {
return false;
}

var n = fromIndex | 0;
var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);

while (k < len) {
if (o[k] === searchElement) {
return true;
}
k++;
}
return false;
};
}

这段代码检查 Array.prototype 上是否存在 includes 方法。如果不存在，它会添加这个方法，即使在不原生支持 includes 的浏览器中也能使用它。

就像教老狗新把戏——我们正在给旧浏览器提供理解和使用新款 JavaScript 特性的能力！

结论

亲爱的学生们，以上就是我们的全部内容！我们进行了一次 JavaScript 全局对象的旋风之旅，从基础到一些更高级的概念。记住，这些全局对象是你在 JavaScript 世界中的忠实伙伴，总是准备帮助你。

在你继续编码之旅的过程中，你会发现自己越来越多地使用这些全局对象。它们就像一个熟练木匠的工具箱中的工具——使用得越多，你就越能欣赏它们的强大和多功能性。

继续练习，继续探索，最重要的是，继续在 JavaScript 中享受乐趣！谁知道呢？也许有一天你会创建出自己的惊人全局对象，未来的程序员会学习它。快乐编码！



以上是将原文翻译成简体中文的内容，使用 Markdown 格式呈现。

Credits: Image by storyset