介绍
“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
键,您应该会在浏览器中弹出以下警报:
控制台还将打印评估表达式的结果,当表达式未明确返回某些内容时,该表达式将读为undefined
。
弹出式警报可能会让您无法继续点击,所以让我们通过使用console.log()
登录到控制台,了解如何创建相同的程序。
使用console.log()
我们可以使用console.log()
方法将相同的字符串打印到JavaScript控制台之外。 使用此选项与在计算机终端环境中使用编程语言相似。
就像我们用alert()
,我们会通过"Hello, World!"
字符串到console.log()
方法之间的括号。 我们将用分号结束我们的声明,就像JavaScript语法习惯一样。
console.log("Hello, World!");
一旦我们按ENTER
, Hello, World!
消息将被打印到控制台:
OutputHello, World!
在下一节中,我们将介绍如何使该程序对用户更具互动性。
提示输入
每次运行我们现有的“Hello,World!”程序时,它会产生相同的输出。 让我们提醒一下运行我们的程序的人的名字。 然后,我们可以使用该名称来自定义输出。
对于我们上面使用的每个JavaScript方法,我们可以从一行提示输入开始。 我们将使用JavaScript的prompt()
方法,并将其传递给字符串"What is your name?"
询问用户的姓名。 用户输入的输入将被存储在变量name
。 我们用分号结束我们的表达。
let name = prompt("What is your name?");
当您按ENTER
运行这一行代码时,您将收到一个弹出提示:
通过Web浏览器窗口弹出的对话框包括用于输入用户输入的文本字段。 一旦用户在文本字段中输入值,就必须单击OK
才能存储的值。 用户还可以通过点击“ Cancel
按钮来阻止记录值。
只有在程序上下文中使用JavaScript prompt()
方法时,重要的是因为过度使用可能会使用户变得乏味。
此时,输入您希望程序打hello的名称。 对于这个例子,我们将使用名称Sammy
。
现在我们已经收集了用户名的值,我们可以继续使用该值来迎接用户。
用alert()
问候用户
如上所述, alert()
方法在浏览器窗口上创建一个弹出框。 我们可以使用这种方法通过使用变量name
来呼叫用户。
我们将使用字符串连接来写一个“Hello!”的问候语,直接发送给用户。 所以,让我们连接一下Hello
的字符串和name的变量:
"Hello, " + name + "!"
我们组合了两个字符串, "Hello, "
, "!"
其中的name
变量之间。 现在,我们可以将此表达式传递给alert()
方法。
alert("Hello, " + name + "!");
一旦我们按ENTER
,我们将在屏幕上收到以下对话框:
在这种情况下,用户的名字是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程序。