JavaScript基础入门
目录
任务描述
相关知识
JavaScript语言简介
JavaScript注释
搭建JavaScript的运行环境
JavaScript输出
弹出对话框模式
控制台模式
页面输出模式
编程要求
任务描述
要了解一门编程语言,要从输出开始。
本关任务:采用相关知识中介绍的任意一种方法输出Hello, JavaScript!。
相关知识
JavaScript语言简介
JavaScript 诞生于1995年。 Netscape 公司决定着手开发一种客户端语言解决简单的表单验证。就职于 Netscape 公司的布兰登·艾奇开始着手计划将1995年2月发布的 LiveScript 同时在浏览器和服务器中使用。 Netscape 与 Sun 公司成立了一个开发联盟。Sun 公司正是 Java 的拥有者,而此时,Netscape 为了搭上媒体热炒 Java 的顺风车,临时把 LiveScript 改名为 JavaScript 。
1997年,以 JavaScript1.1 为蓝本的建议被提交给了欧洲计算机制造商协会 (ECMA,European Computer Manufactures Association),该协会指定39号技术委员会负责将其进行标准化,TC39经过数月的努力完成了 ECMA-262——定义了一种名为 ECMAScript 的新脚本语言的标准。
现在开发人员常说的 JavaScript 包含三个部分:ECMAScript 、浏览器对象模型 ( BOM ) 和文档对象模型 ( DOM )。
JavaScript注释
JavaScript 的注释与 JAVA 几乎相同,单行注释以//开头,在其后添加注释。多行注释以/*开头,以*/结尾,在中间添加注释。
/************** 函数名:getAbsolute ******************/
/************** 功能:求一个整数的绝对值 **************/
/************** 作者:Bruce *************************/
/************** 时间:2018年2月1日 *******************/
function getAbsolute(a) {if(a < 0) {a = -a; // 取a的相反数}return a;
}
养成良好的注释习惯是一个优秀的开发人员的必备素质,通过代码注释能衡量开发人员的编程水平,一般来说,一个源代码文件需要有一个总体的注释,每一个函数也需要像上面一样的注释,对于复杂逻辑,别人难以看懂的,需要单行注释。
搭建JavaScript的运行环境
JavaScript 运行环境的搭建很简单,下载并安装任意一种浏览器就可以。 以下是运行一个 JavaScript 源代码的全过程:
- 新建一个文本编辑器,打开后输入 JavaScript 源代码,关闭时以
.js结尾; - 在 HTML 中调用刚刚建立的 JS 文件;
- 以浏览器方式打开 HTML 文件。 用 Windows 系统自带的文本编辑器不是很方便,推荐使用 Sublime 和 vsCode,这两个是免费的集成开发环境,具有轻量化、代码自动补全等很多优点。
JavaScript输出
JavaScript 的输出有三种方式,如下:
弹出对话框模式
通过alert()函数弹出对话框,这是最常用的方式。在script标签下,调用window.alert()函数,括号内填入输出的内容。将下面的代码以文本编辑器编辑后改为.html后缀,然后用浏览器打开后即可弹出对话框。
<!DOCTYPE html>
<html><body><script>window.alert("Hello,World!");</script></body>
</html>
以浏览器方式打开刚刚建立的HTMl文件,在浏览器上面可以看到,如图1:

图1
这里的标签是 HTML 中的内容,关于 JavaScript 和 HTML 的关系,将在下一关介绍。
控制台模式
通过console输出到控制台,在script标签下,调用console.log()函数,括号内填入输出的内容,以浏览器打开下面的代码后,按F12键即可在浏览器的控制台中实现输出。
<!DOCTYPE html>
<html><body><script>console.log("Hello,World!");</script></body>
</html>
在浏览器的控制台可以看到如下的内容,如图2:

图2
除此之外,还有console.error(),console.warn()等方式实现输出,分别表示输出错误,输出警告。
页面输出模式
通过document.write()实现输出到页面。在document.write()函数的括号中填入输出的内容即可。例子如下:
<!DOCTYPE html>
<html><body><script>document.write("Hello,World!");</script></body>
</html>
浏览器的页面输出如图3:

图3
此外,还有其他几种比较少用的输出方式,这里不做介绍,可参考相关文档。
编程要求
本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码,具体要求如下:
- 采用相关知识板块介绍的任意一种方法,实现输出
Hello,JavaScript!。
<!DOCTYPE html>
<html><head><!-- 请在此处编写代码 --><!---------Begin---------><script>document.write("Hello,JavaScript!");</script><!---------End---------></head><body></body>
</html>
相关文章:
JavaScript基础入门
目录 任务描述 相关知识 JavaScript语言简介 JavaScript注释 搭建JavaScript的运行环境 JavaScript输出 弹出对话框模式 控制台模式 页面输出模式 编程要求 任务描述 要了解一门编程语言,要从输出开始。 本关任务:采用相关知识中介绍的任意一…...
windows11子系统Ubuntu 22.04.4子安装图形化界面
1、windows11家庭版本设置 打开虚拟机安装许可 2、Microsoft Store下载安装ubuntu 我使用的是22.04.4 LTS版本 3、 打开ubuntu 命令窗口 1、打开win11的命令行,在下拉三角下标,打开,可以看到有Ubuntu 的选项,点击即可进入linux命…...
对 2024 年美赛选题的建议
对2024年美赛选题的建议包括: 1. 深入探讨当下全球面临的重大问题和挑战:鉴于美赛通常聚焦于全球性议题,如气候变化、可持续发展、数据分析等,参赛学生应关注这些议题,并深入研究相关数据与背景信息,以提出…...
PyTorch tutorials:快速学会使用PyTorch
准备深入学习transformer,并参考一些资料和论文实现一个大语言模型,顺便做一个教程,今天是番外篇,介绍下PyTorch,后面章节实现代码主要使用这个框架。 本系列禁止转载,主要是为了有不同见解的同学可以方便联…...
【CT】LeetCode手撕—手撕快排
目录 题目1-思路-快排1-1 快排的核心思想快速排序算法步骤优美的调整区间 1-2 ⭐快排的实现 2- 实现⭐912. 排序数组——题解思路 3- ACM 实现 题目 原题连接:912. 排序数组 1-思路-快排 1-1 快排的核心思想 选择一个基准 基准左侧的元素都小于该元素基准右侧的元…...
使用ARK工具ATool清除典型蠕虫MyDoom
1 概述 在长期的日常安全事件监测过程中,安天CERT经常捕获到大量的MyDoom蠕虫样本和传播该蠕虫的钓鱼邮件。受害主机感染MyDoom后会被放置后门,以便攻击者下发后续恶意软件,进行攻击或窃密等操作。MyDoom蠕虫最早发现于2004年&…...
在hue中使用ooize调度ssh任务无法执行成功,无法查看错误
ssh执行失败,但是hue没有给出明确的错误原因: 经过经验分析,原来是服务器上的sh文件用的是doc/window格式,需要使用notepad将格式改为unix之后就可以正常执行。 特此记录,避免遗忘知识点...
一套轻量、安全的问卷系统基座,提供面向个人和企业的一站式产品级解决方案
大家好,今天给大家分享的是一款轻量、安全的问卷系统基座。 XIAOJUSURVEY是一套轻量、安全的问卷系统基座,提供面向个人和企业的一站式产品级解决方案,快速满足各类线上调研场景。 内部系统已沉淀 40种题型,累积精选模板 100&a…...
3秒生成!这个AI模型画风也太治愈了,新手也能轻松驾驭
还在为不会画画而苦恼吗?别担心,今天给大家介绍一个超好用的AI模型——Soft and Squishy Linework,即使是小白也能轻松生成可爱的动漫图像! Soft and Squishy Linework:专门生成柔和的、低保真(lofi&#…...
数字人全拆解:如何构建一个基于大模型的实时对话3D数字人?
简单地说,数字人就是在数字世界的“人”。当前语境下我们谈到的数字人通常指的是借助AI技术驱动的虚拟世界人物,具备与真实人类相似甚至接近的外形、感知、交互与行为能力。 AI技术在智能数字人的应用中举足轻重,特别是随着大模型能力的涌现…...
实战 | 基于YOLOv10的车辆追踪与测速实战【附源码+步骤详解】
《博主简介》 小伙伴们好,我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源,可关注公-仲-hao:【阿旭算法与机器学习】,共同学习交流~ 👍感谢小伙伴们点赞、关注! 《------往期经典推…...
2024北京智源大会
北京智源大会是年度国际性人工智能高端学术交流的盛会,定位于内行的AI盛会。智源大会紧密围绕当前人工智能学术领域迫切需要解决的问题,以及产业落地过程中存在的诸多挑战,开展深入探讨。智源研究院是2018年11月份成立的一家人工智能领域的新…...
youlai-boot项目的学习—本地数据库安装与配置
数据库脚本 在项目代码的路径下,有两个版本的mysql数据库脚本,使用对应的脚本就安装对应的数据库版本,本文件选择了5 数据库安装 这里在iterm2下使用homebrew安装mysql5 brew install mysql5.7注:记得配置端终下的科学上网&a…...
Android平台如何实现多路低延迟RTSP|RTMP播放?
技术背景 实际上,我们在2015年做Android平台RTSP、RTMP播放模块的时候,第一版就支持了多实例播放,因为SDK设计比较灵活,做个简单的player实例封装即可实现多实例播放(Android Unity的就有多路demo)&#x…...
深入探索Java开发世界:Java基础~类型分析大揭秘
文章目录 一、基本数据类型二、封装类型三、类型转换四、集合类型五、并发类型 Java基础知识,类型知识点梳理~ 一、基本数据类型 Java的基本数据类型是语言的基础,它们直接存储在栈内存中,具有固定的大小和不变的行为。 八种基本数据类型的具…...
短URL服务设计
引言 在营销系统里,为了增加系统的活跃用户数,经常会有各种各样的营销活动。这类活动几乎都是为了充分利用存量用户的价值,促使他们分享产品或App以达到触达到更多用户的目的。又或者是出于营销目的,群发优惠券触达短信这种场景。…...
Kafka集成flume
1.flume作为生产者集成Kafka kafka作为flume的sink,扮演消费者角色 1.1 flume配置文件 vim $kafka/jobs/flume-kafka.conf # agent a1.sources r1 a1.sinks k1 a1.channels c1 c2# Describe/configure the source a1.sources.r1.type TAILDIR #记录最后监控文件…...
如何让视频有高级感 高级感视频制作方法 高级感视频怎么剪 会声会影视频剪辑制作教程 会声会影中文免费下载
高质量视频通常具有清晰的画面、优质的音频和令人印象深刻的视觉效果。这篇文章来了解如何让视频有高级感,高级感视频制作方法。 一、如何让视频有高级感 要让视频有高级感,要注意以下几个要点: 1、剧本和故事性:一个好的剧本和…...
详解|访问学者申请被拒原因有哪些?
访问学者项目为全球科研人员提供了一个难得的机会,让他们能够跨越国界,深入不同的学术环境,进行学术交流和合作。然而,并非所有申请者都能如愿以偿地获得这一机会。本文将对访问学者申请中常见的被拒原因进行详细解析,…...
[鹤城杯 2021]BabyRSA
题目: from Crypto.Util.number import getPrime, bytes_to_long from secret import flagp getPrime(1024) q getPrime(1024) n p * q e 65537 hint1 p >> 724 hint2 q % (2 ** 265) ct pow(bytes_to_long(flag), e, n) print(hint1) print(hint2) p…...
日语AI面试高效通关秘籍:专业解读与青柚面试智能助攻
在如今就业市场竞争日益激烈的背景下,越来越多的求职者将目光投向了日本及中日双语岗位。但是,一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧?面对生疏的日语交流环境,即便提前恶补了…...
Prompt Tuning、P-Tuning、Prefix Tuning的区别
一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...
遍历 Map 类型集合的方法汇总
1 方法一 先用方法 keySet() 获取集合中的所有键。再通过 gey(key) 方法用对应键获取值 import java.util.HashMap; import java.util.Set;public class Test {public static void main(String[] args) {HashMap hashMap new HashMap();hashMap.put("语文",99);has…...
基于Uniapp开发HarmonyOS 5.0旅游应用技术实践
一、技术选型背景 1.跨平台优势 Uniapp采用Vue.js框架,支持"一次开发,多端部署",可同步生成HarmonyOS、iOS、Android等多平台应用。 2.鸿蒙特性融合 HarmonyOS 5.0的分布式能力与原子化服务,为旅游应用带来…...
laravel8+vue3.0+element-plus搭建方法
创建 laravel8 项目 composer create-project --prefer-dist laravel/laravel laravel8 8.* 安装 laravel/ui composer require laravel/ui 修改 package.json 文件 "devDependencies": {"vue/compiler-sfc": "^3.0.7","axios": …...
【Java学习笔记】BigInteger 和 BigDecimal 类
BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点:传参类型必须是类对象 一、BigInteger 1. 作用:适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...
C++ 设计模式 《小明的奶茶加料风波》
👨🎓 模式名称:装饰器模式(Decorator Pattern) 👦 小明最近上线了校园奶茶配送功能,业务火爆,大家都在加料: 有的同学要加波霸 🟤,有的要加椰果…...
Web后端基础(基础知识)
BS架构:Browser/Server,浏览器/服务器架构模式。客户端只需要浏览器,应用程序的逻辑和数据都存储在服务端。 优点:维护方便缺点:体验一般 CS架构:Client/Server,客户端/服务器架构模式。需要单独…...
Scrapy-Redis分布式爬虫架构的可扩展性与容错性增强:基于微服务与容器化的解决方案
在大数据时代,海量数据的采集与处理成为企业和研究机构获取信息的关键环节。Scrapy-Redis作为一种经典的分布式爬虫架构,在处理大规模数据抓取任务时展现出强大的能力。然而,随着业务规模的不断扩大和数据抓取需求的日益复杂,传统…...
【Post-process】【VBA】ETABS VBA FrameObj.GetNameList and write to EXCEL
ETABS API实战:导出框架元素数据到Excel 在结构工程师的日常工作中,经常需要从ETABS模型中提取框架元素信息进行后续分析。手动复制粘贴不仅耗时,还容易出错。今天我们来用简单的VBA代码实现自动化导出。 🎯 我们要实现什么? 一键点击,就能将ETABS中所有框架元素的基…...
