Hello World: How to Write Your First Program in JavaScript
JavaScript是驱动互联网的引擎。几乎你喜欢的每个网站都以某种方式使用JavaScript。从检查文本输入到创建提醒和动画,JavaScript在网页上有很多用途。
学习JavaScript是成为一个前端web开发人员的必要条件。它也是最容易掌握的语言之一,因此对于想要开始编程之旅的初学者来说,它是理想的。这JavaScript准备课程将教导您如何在您的网站上开始使用JavaScript。
在本教程中,我们将向您介绍一些JavaScript编程基础,并创建我们的第一个“Hello World”程序。
JavaScript是什么?
维基百科将JavaScript或JS定义为一种“解释型编程语言”,允许“客户端脚本与用户交互”。
如果所有人都对你完全毫无意见,那就没关系了。
让我们把这个定义分解成普通人可以理解的东西:
解释的编程语言:大多数编程语言要么编译或者解释.一个编译编程语言在执行之前必须先通过外部编译器。大多数语言 - Java,Python,Ruby等 - 就像那样。没有这样的要求解释型的编程语言.用解释语言编写的程序可以立即运行。对于JavaScript,这意味着您可以直接从浏览器本身运行程序。
客户端脚本:所有Web编程都可以分为两类:客户端和服务器端.服务器端程序(或脚本)是在web服务器上执行的,web页面实际上是存储在那里的。另一方面,客户端程序是在用户的web浏览器上执行的。对于JavaScript来说,这意味着一旦用户下载了网页,程序就会立即执行。你可以在本课程中了解有关JavaScript客户端脚本的更多信息.
JavaScript主要用于在网页上创建交互式元素。JavaScript的一些最常见用途是:
验证数据输入到一个web表单,如注册或联系我们的表单。
更新网页上的信息而不刷新它。
DOM(文档对象模型)脚本。这是使用JavaScript的一种相当高级的方式。现在别担心。一旦您熟悉了基本的JavaScript,我们就会了解它。
创建警报、新的浏览器窗口等。
通过像jQuery这样的插件库创建动画。
正如您所看到的,这涵盖了任何网页上的整个互动域。JavaScript插件库在此上下文中特别有用,因为它们会让您访问高级功能而不需要您的任何编码。我们将在稍后的教程中了解有关插件库的更多信息。目前,您应该知道的只是JavaScript将交互性添加到网页。
警告:JavaScript不是Java
第一个错误初学者之一假设JavaScript是Java的简化版本。不是。JavaScript与Java不同,因为粉笔来自奶酪。它们之间唯一常见的是几个杂散语法元素和名称本身。
对于未知的Java是一种强大的面向对象编程语言,用于创建复杂的平台(即,它们可以在任何操作系统上运行)程序。另一方面,JavaScript只能在Web浏览器中运行程序。Java大量用于商业软件,而JavaScript仅限于网页使用。
解决了这些困惑之后,让我们直接进入JavaScript编程。
Hello World: Writing Your First JavaScript Program
“Hello World”是编程课程的主要内容。这个程序的目标很简单:在计算机屏幕上输出文本“Hello World”。由于消息和语法简单,它通常是教给初学者的第一个程序。
在JavaScript中编写一个“Hello World”程序,正如我们将学习的那样,非常简单,不需要超过3行代码。
想成为网页开发者吗?学习如何使用JavaScript和成为从头开始的Web开发人员这门课。
你需要什么
由于JavaScript是由浏览器本身解释的,我们不需要任何花哨的编译器或额外的软件来编写JS程序。你所需要的就是:
文本编辑器.你谦卑的笔记薄会很好,但我们强烈推荐记事本++(免费)。
一个web浏览器.你可以使用任何你想要的谷歌Chrome, Firefox, Internet Explorer或Safari浏览器。
开始:创建HTML框架
JavaScript程序通常嵌入网页本身。这意味着它们与HTML一起编写,尽管您也可以在外部包含它们。
要开始,我们将首先创建一个简单的HTML文件,我们可以包含我们的JavaScript。
打开文本编辑器,输入以下代码:
<!doctype html>javascript hello world title> head> javascript hello world示例 h1> body> html>
将此文件另存为test.html(如果使用记事本,请确保保存为“所有文件”)。
这是一个标准的HTML模板,没有什么特别的关于它。对于甚至对HTML的基本掌握来说,任何人都应该很清楚。
添加JavaScript代码
我们现在可以继续编写JavaScript程序。
在
标签后添加以下代码并保存文件:
标签之间编写的。我们使用' alert '创建一个函数。要显示的文本被写在括号中的引号之间。
但如果我们想创建一个单独的“Hello World!”。我们可以随时打电话吗?
我们可以使用几行代码来做到这一点。
创建“Hello World”JavaScript函数
编程101:函数是任何可以在程序中“调用”任何次数的代码块。功能在编程中非常有用,因为您可以创建一次,请使用它们n次数。
我们创造了一个“你好世界!”提醒框在上面的例子中。现在我们将创建一个函数,每当我们想要时都会创建相同的警报框。
在以下代码中键入文本文件:
<!DOCTYPE HTML> < HTML> HTML>
将其保存为test2.html。
我们没有将脚本添加到
中,而是将脚本添加到中,并创建了一个名为' helloWorld '的函数。您可以将任何代码段封装在{}方括号中,并在其前面添加“function functionName()”,从而将其转换为函数。
现在我们已经创建了这个功能,我们可以任何次呼叫它。
在
body>标记之间添加以下代码:
< p > <按钮onclick = " myFunction ()创建一个对话框!< /按钮> < / p >< p > <按钮onclick = " myFunction ()创建另一个对话框!< /按钮> < / p >
完全,您的代码应该如下所示:
现在在web浏览器中打开test2.html文件。这是你应该看到的:
点击两个按钮中的任何一个,你会看到“Hello World!”对话框弹出。
恭喜你!现在您已经成功地在JavaScript中创建了一个函数。然而,这仅仅是个开始。在这个美妙的编程语言中还有很多东西需要学习。上这门课JavaScript新手应该能帮你开始。
但如果我们想创建一个单独的“Hello World!”。我们可以随时打电话吗?
我们可以使用几行代码来做到这一点。
创建“Hello World”JavaScript函数
编程101:函数是任何可以在程序中“调用”任何次数的代码块。功能在编程中非常有用,因为您可以创建一次,请使用它们n次数。
我们创造了一个“你好世界!”提醒框在上面的例子中。现在我们将创建一个函数,每当我们想要时都会创建相同的警报框。
在以下代码中键入文本文件:
<!DOCTYPE HTML> < HTML> HTML>
将其保存为test2.html。
我们没有将脚本添加到
中,而是将脚本添加到中,并创建了一个名为' helloWorld '的函数。您可以将任何代码段封装在{}方括号中,并在其前面添加“function functionName()”,从而将其转换为函数。现在我们已经创建了这个功能,我们可以任何次呼叫它。
在
body>标记之间添加以下代码:< p > <按钮onclick = " myFunction ()创建一个对话框!< /按钮> < / p >< p > <按钮onclick = " myFunction ()创建另一个对话框!< /按钮> < / p >
完全,您的代码应该如下所示:
现在在web浏览器中打开test2.html文件。这是你应该看到的:
点击两个按钮中的任何一个,你会看到“Hello World!”对话框弹出。
恭喜你!现在您已经成功地在JavaScript中创建了一个函数。然而,这仅仅是个开始。在这个美妙的编程语言中还有很多东西需要学习。上这门课JavaScript新手应该能帮你开始。