1. IT分享知识网首页
  2. 开发语言
  3. java

JavaScript系列之JS基本语法

老牧童 • • java, JavaScript, 未分类 • 阅读 9

JavaScript系列之JS基本语法点击上方头像关注我 每周上午 09 00 准时推送 每月不定期赠送技术书籍 本文 3891 字 阅读约需 10 分钟 Hi 大家好 我是来输送技能的 CoCo Python 近年来成为编程领域中的佼佼者 得到了迅猛的发展

大家好，欢迎来到IT知识分享网。

JavaScript系列之JS基本语法

JavaScript系列之JS基本语法

点击上方头像关注我，每周上午 09:00准时推送，每月不定期赠送技术书籍。

本文3891字，阅读约需10分钟

Hi，大家好，我是来输送技能的CoCo。Python近年来成为编程领域中的佼佼者，得到了迅猛的发展。作为一门强类型的动态脚本语言，JavaScript与Python其实非常相似，无论是语法思维上还是内置API上，对于有Python基础的我们来说，学习JavaScript非常的友好。

在上一篇JS系列文章，主要对Web基础知识和JS进行了简单的介绍。今天介绍JS的语法，了解JS语法的时候，可以顺带联想一下Python的语法喔～

一

JavaScript基本语法

JS注释

学习一门语言，一般先学习语言的注释，因为注释是给我们自己看，也是给其他编码伙伴看，添加注释有利于我们以后阅读代码。

(1) 注释的作用

添加注释可以起到以下2种作用：

  • 解释某些语句的作用和功能：使程序更易于理解，通常用于代码的解释说明。
  • 暂时屏蔽某些语句：使浏览器对其暂时忽略，等需要时再取消注释，这些语句就会发挥作用，通常用于代码的调试。

(2) JS注释的分类

  • 单行注释：//用于单行注释。
  • 多行注释：/*…*/用于多行注释。多行注释符号分为开始和结束两部分，即在需要注释的内容前输入/*，同时在注释内容结束后输入*/表示注释结束。

编写如下代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS基本语法-ITester软件测试小栈</title>
</head>
<body>
<script type="text/javascript">
     // 我是一个单行注释
    alert('HelloWorld！')
    /*
    我是一个多行注释
   */
   /*
    注释的代码不会执行
    alert('我是一个弹出层')
    alert('我是一个弹出层')
    */
    alert('ITester软件测试小栈')
</script>
</body>
</html>

在浏览器打开页面，效果如下所示：

JavaScript系列之JS基本语法

JS执行顺序

JavaScript程序按照在HTML文件中出现的顺序逐行执行，如果需要在整个HTML文件中执行（如函数、全局变量等），最好将其放在HTML文件的<head>…</head>标记中。

编写如下代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS基本语法-ITester软件测试小栈</title>
</head>
<body>
<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>
<script>
document.write("<h1>标题</h1>");
document.write("<p>这是段落。</p>");
</script>
<p>
只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
</body>
</html>

在浏览器打开页面，效果如下所示：

JavaScript系列之JS基本语法

空格和换行

在JavaScript中会忽略程序中的空格、换行和制表符，除非这些符号是字符串或正则表达式中的一部分。JavaScript中的换行有“断句”的意思，即换行能判断一个语句是否已经结束。

⚠️：与Java语言不同，JavaScript并不要求必须以分号 ;作为语句的结束标记。最好的代码编写习惯是在每行代码的结尾处加上分号，这样可以保证代码的准确性。

JS输出语句

JavaScript 可以通过不同的方式来输出数据：

window.alert() ：弹出警告框。

document.write()： 将内容写到 HTML 文档中。

console.log() ：向浏览器的控制台输出。

编写如下代码：

<script> //控制浏览器弹出一个警告框 window.alert('HelloWorld！'); //向浏览器输出一个内容 document.write('ITester软件测试小栈'); //向控制台输出一个内容 console.log('ITester'); </script>

在浏览器打开页面，效果如下所示：

JavaScript系列之JS基本语法

JS常量和变量

常量：在编程语言中，一般固定值称为常量。如数字（520）、字符串（ITester）。

变量：变量用于存储数据值，JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值。

⚠️注意：HTML并不区分大小写，但JavaScript对字母大小写是敏感的，需要严格区分字母大小写。在输入语言的关键字、函数名、变量以及其他标识符时，都必须采用正确的大小写形式。例如，变量username与变量userName是两个不同的变量。

JS标识符、关键字、保留字

JavaScript 关键字用于标识要执行的操作。和其他任何编程语言一样，JavaScript 保留了一些关键字为自己所用。

(1) 标识符

JavaScript 标识符（Identifier）包括变量名、函数名、参数名和属性名。

合法的标识符应该注意以下强制规则：

  • 第一个字符必须是字母、下划线（_）或美元符号（$）；
  • 不能是数字开头；
  • 除了第一个字符外，其他位置可以使用 Unicode 字符。
  • 不能与 JavaScript 关键字、保留字重名。

(2) 关键字

关键字是JavaScript 语言内部使用的一组名称，用户不能自定义同名的标识符。JavaScript关键字如下所示：

break

delete

if

this

while

case

do

in

throw

with

catch

else

instanceof

try

continue

finally

new

typeof

debugger

for

return

var

default

function

switch

void

(3) 保留字

保留字是 JavaScript 语言内部预备使用的一组名称，是为 JavaScript 升级版本预留备用的。JavaScript保留字如下所示：

abstract

double

goto

native

static

boolean

enum

implement

package

super

byte

export

import

private

synchronized

char

extends

int

protected

throws

class

final

interface

public

transient

const

float

long

short

volatile

二

JavaScript小实例

实例1

使用JavaScript代码编写一个欢迎访问弹出对话框，同时访问网页时显示当前系统时间。

编写代码如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS实例-ITester软件测试小栈</title>
</head>
<body>
<script type="text/javascript">
    var now =new Date();  //创建当前的日期对象
    var hour=now.getHours(); //获取小时数
    var min=now.getMinutes(); //获取分钟数
    alert("您好！现在是"+hour+"："+min+"\r欢迎访问ITester软件测试小栈！");
</script>
</body>
</html>

在浏览器打开页面，效果如下所示：

JavaScript系列之JS基本语法

实例2

使用JavaScript代码编写一个欢迎访问弹出对话框，点击按钮显示昵称。

编写代码如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS实例-ITester软件测试小栈</title>
<body>
<p>点击这个按钮，来调用带参数的函数。</p>
<button onclick="myFunction('CoCo','ITester软件测试小栈!')">点击这里</button>
<script>
function myFunction(name,platform)
{
alert("欢迎" + name + ", 访问 " + platform);
}
</script>
</body>
</head>
</html>

在浏览器打开页面，效果如下所示：

JavaScript系列之JS基本语法

以上就是今天的分享，如果大家想要获取今天以及后续的JS代码，可以在ITester软件测试小栈微信公众号后台回复“JS代码”，持续更新JavaScript系列。

JavaScript系列之JS基本语法

更多系列文章

敬请期待

我是CoCo，计算机科学与技术专业，深漂大厂互联网民工（女），坐标深圳。5年工作经验，3年持续输出技术文。ITester软件测试小栈（ID：ITestingA）号主，Boss直聘好文社区签约作者，腾讯云社区优质创作者。专注于软件测试技术和宝藏干货分享，每周准时更新原创技术文章，每月不定期赠送技术书籍，愿我们在更高处相逢。喜欢记得星标⭐我，每周及时获得最新推送，第三方转载请注明出处。

JavaScript系列之JS基本语法

JavaScript系列之JS基本语法

想获取更多最新干货内容

快来星标 置顶 关注我

JavaScript系列之JS基本语法

免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://yundeesoft.com/161361.html

赞 (0)
老牧童老牧童
0
上一篇 2024-12-09 21:26
下一篇 2024-12-09 21:33

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注微信