如何编写您的第一个JavaScript程序

介绍

“Hello,World!”程序是计算机程序设计中经典而悠久的传统。 这是初学者的一个简短而完整的第一个程序,它是确保您的环境正确配置的好方法。

本教程将引导您在JavaScript中创建此程序。 然而,为了使程序更有趣,我们将修改传统的“Hello,World!”程序,以便向用户询问其名称。 然后,我们将在问候中使用该名称。 完成本教程后,您将有一个交互式的“Hello,World!”程序。

先决条件

您可以在Web浏览器中使用JavaScript开发者控制台完成本教程。 在开始本教程之前,您应该熟悉使用此工具。 要了解更多信息,您可以阅读我们的教程“ 如何使用JavaScript开发者控制台”

制作“Hello,World!”节目

要编写“Hello,World!”程序,首先打开您首选的Web浏览器的JavaScript控制台。

有两种主要方法可以用JavaScript(使用alert()方法和console.log()方法创建“Hello,World!”程序。

使用alert()

我们可以编写这个程序的第一种方法是使用alert()方法,它将在当前窗口中显示一条带有指定消息的警报框(在这种情况下,它将是“Hello,World!”)和OK按钮,允许用户关闭警报。

在该方法中,我们将传递字符串数据类型作为参数。 这个字符串将被设置为值Hello, World! 以便该值将打印到警报框中。

要编写第一个“Hello,World!”程序的样式,我们将把该字符串包含在alert()方法的括号中。 我们将用分号结束我们的JavaScript语句。

alert("Hello, World!");

一旦您按照JavaScript行的按ENTER键,您应该会在浏览器中弹出以下警报:

JavaScript控制台警报示例

控制台还将打印评估表达式的结果,当表达式未明确返回某些内容时,该表达式将读为undefined

弹出式警报可能会让您无法继续点击,所以让我们通过使用console.log()登录到控制台,了解如何创建相同的程序。

使用console.log()

我们可以使用console.log()方法将相同的字符串打印到JavaScript控制台之外。 使用此选项与在计算机终端环境中使用编程语言相似。

就像我们用alert() ,我们会通过"Hello, World!" 字符串到console.log()方法之间的括号。 我们将用分号结束我们的声明,就像JavaScript语法习惯一样。

console.log("Hello, World!");

一旦我们按ENTERHello, World! 消息将被打印到控制台:

OutputHello, World!

在下一节中,我们将介绍如何使该程序对用户更具互动性。

提示输入

每次运行我们现有的“Hello,World!”程序时,它会产生相同的输出。 让我们提醒一下运行我们的程序的人的名字。 然后,我们可以使用该名称来自定义输出。

对于我们上面使用的每个JavaScript方法,我们可以从一行提示输入开始。 我们将使用JavaScript的prompt()方法,并将其传递给字符串"What is your name?" 询问用户的姓名。 用户输入的输入将被存储在变量name 我们用分号结束我们的表达。

let name = prompt("What is your name?");

当您按ENTER运行这一行代码时,您将收到一个弹出提示:

JavaScript提示示例

通过Web浏览器窗口弹出的对话框包括用于输入用户输入的文本字段。 一旦用户在文本字段中输入值,就必须单击OK才能存储的值。 用户还可以通过点击“ Cancel按钮来阻止记录值。

只有在程序上下文中使用JavaScript prompt()方法时,重要的是因为过度使用可能会使用户变得乏味。

此时,输入您希望程序打hello的名称。 对于这个例子,我们将使用名称Sammy

现在我们已经收集了用户名的值,我们可以继续使用该值来迎接用户。

alert()问候用户

如上所述, alert()方法在浏览器窗口上创建一个弹出框。 我们可以使用这种方法通过使用变量name来呼叫用户。

我们将使用字符串连接来写一个“Hello!”的问候语,直接发送给用户。 所以,让我们连接一下Hello的字符串和name的变量:

"Hello, " + name + "!"

我们组合了两个字符串, "Hello, ""!" 其中的name变量之间。 现在,我们可以将此表达式传递给alert()方法。

alert("Hello, " + name + "!");

一旦我们按ENTER ,我们将在屏幕上收到以下对话框:

JavaScript提示输出

在这种情况下,用户的名字是Sammy,所以输出已经打了Sammy。

现在让我们重写这个,以便将输出打印到控制台。

console.log()问候用户

正如我们在上一节中看到的那样, console.log()方法将输出输出到控制台,就像print()函数可以在Python中将输出打印到终端。

我们将使用与alert()方法一起使用的相同的连接字符串,它将字符串"Hello, ""!" name变量:

"Hello, " + name + "!"

这个整个表达式将被放在console.log()方法的括号中,这样我们将接收到一个问候作为输出。

console.log("Hello, " + name + "!");

对于名为Sammy的用户,控制台上的输出将如下所示:

OutputHello, Sammy!

您现在有一个JavaScript程序可以从用户处输入并将其打印回屏幕。

结论

现在你知道如何编写经典的“Hello,World!”程序,并提示用户进行输入,并将其显示为输出,您可以进一步扩展程序。 例如,请求用户喜欢的颜色,并让程序说他们最喜欢的颜色是红色的。 您甚至可以尝试使用相同的技术来创建一个Mad Lib程序。

赞(52) 打赏
未经允许不得转载:优客志 » 系统运维
分享到:

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏