葵花宝典教程,一个自学编程平台

葵花宝典教程,一个自学编程平台

JavaScript - 变量

JavaScript 数据类型

编程语言最基本的特征之一是它支持的数据类型集。这些是可以在编程语言中表示和操作的值类型。

JavaScript 允许您使用三种原始数据类型 -

  • 数字,例如。123、120.50 等

  • 文本字符串,例如“此文本字符串”等。

  • 布尔值,例如真或假。

JavaScript 还定义了两种微不足道的数据类型,nullundefined,每一种都只定义一个值。除了这些原始数据类型之外,JavaScript 还支持一种称为object的复合数据类型。我们将在单独的章节中详细介绍对象。

注意- JavaScript 不区分整数值和浮点值。JavaScript 中的所有数字都表示为浮点值。JavaScript 使用 IEEE 754 标准定义的 64 位浮点格式表示数字。

JavaScript 变量

像许多其他编程语言一样,JavaScript 也有变量。变量可以被认为是命名容器。您可以将数据放入这些容器中,然后简单地通过命名容器来引用数据。

在 JavaScript 程序中使用变量之前,必须声明它。变量使用var关键字声明如下。

<script type = "text/javascript">
   <!--
      var money;
      var name;
   //--></script>

您还可以使用相同的var关键字声明多个变量,如下所示 -

<script type = "text/javascript">
   <!--
      var money, name;
   //--></script>

将值存储在变量中称为变量初始化您可以在创建变量时或稍后需要该变量时进行变量初始化。

例如,您可以创建一个名为money的变量,然后将值2000.50 分配给它。对于另一个变量,您可以在初始化时分配一个值,如下所示。

<script type = "text/javascript">
   <!--
      var name = "Ali";
      var money;
      money = 2000.50;
   //--></script>

注意- 仅将var关键字用于声明或初始化,一次用于文档中任何变量名的生命周期。您不应该两次重新声明相同的变量。

JavaScript 是无类型语言。这意味着 JavaScript 变量可以保存任何数据类型的值。与许多其他语言不同,您不必在变量声明期间告诉 JavaScript 变量将持有什么类型的值。变量的值类型可以在程序执行期间发生变化,JavaScript 会自动处理它。

JavaScript 变量范围

变量的范围是定义它的程序区域。JavaScript 变量只有两个作用域。

  • 全局变量- 全局变量具有全局范围,这意味着它可以在 JavaScript 代码中的任何位置定义。

  • 局部变量- 局部变量仅在定义它的函数中可见。函数参数始终是该函数的本地参数。

在函数体内,局部变量优先于同名的全局变量。如果你声明一个与全局变量同名的局部变量或函数参数,你实际上隐藏了全局变量。看看下面的例子。

<html>
   <body onload = checkscope();>   
      <script type = "text/javascript">
         <!--
            var myVar = "global";      // Declare a global variable
            function checkscope( ) {
               var myVar = "local";    // Declare a local variable
               document.write(myVar);
            }
         //-->
      </script>     
   </body></html>

这会产生以下结果 -

local

JavaScript 变量名

在 JavaScript 中命名变量时,请牢记以下规则。

  • 您不应使用任何 JavaScript 保留关键字作为变量名。这些关键字将在下一节中提到。例如,中断布尔变量名称无效。

  • JavaScript 变量名不应以数字 (0-9) 开头。它们必须以字母或下划线字符开头。例如,123test是一个无效的变量名,但_123test是一个有效的变量名。

  • JavaScript 变量名区分大小写。例如,名称名称是两个不同的变量。

JavaScript 保留字

下表给出了 JavaScript 中所有保留字的列表。它们不能用作 JavaScript 变量、函数、方法、循环标签或任何对象名称。





abstractelseinstanceofswitch
booleanenumintsynchronized
breakexportinterfacethis
byteextendslongthrow
casefalsenativethrows
catchfinalnewtransient
charfinallynulltrue
classfloatpackagetry
constforprivatetypeof
continuefunctionprotectedvar
debuggergotopublicvoid
defaultifreturnvolatile
deleteimplementsshortwhile
doimportstaticwith
doubleinsuper



JavaScript - HTML 文件中的位置

可以灵活地将 JavaScript 代码包含在 HTML 文档的任何位置。然而,在 HTML 文件中包含 JavaScript 的最优选方式如下:

  • <head>...</head> 部分中的脚本。

  • <body>...</body> 部分中的脚本。

  • <body>...</body> 和 <head>...</head> 部分中的脚本。

  • 在外部文件中编写脚本,然后包含在 <head>...</head> 部分中。

在下一节中,我们将了解如何以不同的方式将 JavaScript 放入 HTML 文件中。

<head>...</head> 部分中的 JavaScript

如果您想让脚本在某个事件上运行,例如当用户单击某处时,那么您将把该脚本放在头部,如下所示 -

<html>
   <head>      
      <script type = "text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>     
   </head>
   
   <body>
      <input type = "button" onclick = "sayHello()" value = "Say Hello" />
   </body>  </html>

此代码将产生以下结果 -

<body>...</body> 部分中的 JavaScript

如果您需要在页面加载时运行脚本以便脚本在页面中生成内容,则该脚本将进入文档的 <body> 部分。在这种情况下,您将不会使用 JavaScript 定义任何函数。看看下面的代码。

<html>
   <head>
   </head>
   
   <body>
      <script type = "text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
      
      <p>This is web page body </p>
   </body></html>

此代码将产生以下结果 -

<body> 和 <head> 部分中的 JavaScript

您可以将 JavaScript 代码完全放在 <head> 和 <body> 部分中,如下所示 -

<html>
   <head>
      <script type = "text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>
   </head>
   
   <body>
      <script type = "text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
      
      <input type = "button" onclick = "sayHello()" value = "Say Hello" />
   </body></html>

此代码将产生以下结果 -

外部文件中的 JavaScript

随着您开始更广泛地使用 JavaScript,您可能会发现在某些情况下您会在网站的多个页面上重用相同的 JavaScript 代码。

您不限于在多个 HTML 文件中维护相同的代码。script标签提供了一种机制,允许您将JavaScript 存储在外部文件中,然后将其包含到 HTML 文件中。

下面是一个示例,展示了如何使用script标签及其src属性在 HTML 代码中包含外部 JavaScript 文件。

<html>
   <head>
      <script type = "text/javascript" src = "filename.js" ></script>
   </head>
   
   <body>
      .......   </body></html>

要使用来自外部文件源的 JavaScript,您需要将所有 JavaScript 源代码写入扩展名为“.js”的简单文本文件中,然后如上所示包含该文件。

例如,您可以将以下内容保留在filename.js文件中,然后在包含 filename.js 文件后,您可以在 HTML 文件中使用sayHello函数。

function sayHello() {
   alert("Hello World")
}


JavaScript 运行

所有现代浏览器都内置了对 JavaScript 的支持。通常,您可能需要手动启用或禁用此支持。本章介绍在浏览器中启用和禁用 JavaScript 支持的过程:Internet Explorer、Firefox、chrome 和 Opera。


Internet Explorer 中的 JavaScript

以下是在 Internet Explorer 中打开或关闭 JavaScript 的简单步骤 -


  • 按照菜单中的工具 → Internet 选项。

  • 从对话框中选择安全选项卡。

  • 单击自定义级别按钮。

  • 向下滚动直到找到Scripting选项。

  • 选择Active scripting下的Enable单选按钮。

  • 最后点击OK就出来了


要在 Internet Explorer 中禁用 JavaScript 支持,您需要选择Active scripting下的Disable单选按钮。


Firefox 中的 JavaScript

以下是在 Firefox 中打开或关闭 JavaScript 的步骤 -


  • 打开一个新标签 → 在地址栏中输入about: config。

  • 然后你会发现警告对话框。选择我会小心的,我保证!

  • 然后您将在浏览器中找到配置选项列表。

  • 在搜索栏中,输入javascript.enabled。

  • 在那里,您将找到启用或禁用 javascript 的选项,方法是右键单击该选项的值 →选择切换。


如果 javascript.enabled 为真;单击时它会转换为false。如果 javascript 被禁用;它在单击切换时启用。


Chrome 中的 JavaScript

以下是在 Chrome 中打开或关闭 JavaScript 的步骤 -


  •     点击浏览器右上角的 Chrome 菜单。    

  •     选择设置。    

  •     单击页面末尾的显示高级设置。    

  •     在隐私部分下,单击内容设置按钮。    

  •     在“Javascript”部分,选择“不允许任何站点运行 JavaScript”或“允许所有站点运行 JavaScript(推荐)”。

    

Opera 中的 JavaScript

以下是在 Opera 中打开或关闭 JavaScript 的步骤 -


  • 按照菜单中的工具 → 首选项。

  • 从对话框中选择高级选项。

  • 从列出的项目中选择内容。

  • 选择启用 JavaScript复选框。

  • 最后点击确定就出来了。


要在 Opera 中禁用 JavaScript 支持,您不应选中Enable JavaScript 复选框。


非 JavaScript 浏览器的警告

如果您必须使用 JavaScript 做一些重要的事情,那么您可以使用<noscript>标记向用户显示警告消息。


您可以在脚本块之后立即添加一个noscript块,如下所示 -


<html>

   <body>

      <script language = "javascript" type = "text/javascript">

         <!--

            document.write("Hello World!")

         //-->

      </script>

      

      <noscript>

         Sorry...JavaScript is needed to go ahead.

      </noscript>      

   </body>

</html>

现在,如果用户的浏览器不支持 JavaScript 或未启用 JavaScript,则来自 </noscript> 的消息将显示在屏幕上。



Javascript - Syntax

Javascript - Syntax

Javascript - Overview

Javascript - Overview

Javascript - Home

Javascript - Home

<< 1 >>

Copyright www.jennal.cn Rights Reserved葵花宝典教程.鄂icp2022001145号-1

分享:

支付宝

微信