位置: IT常识 - 正文
Javascript 基础知识学习(javascript入门基础)
编辑：rootadmin推荐整理分享Javascript 基础知识学习(javascript入门基础)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:javascript基础入门教程,javascript基础语法,javascript零基础,javascript基础编程,javascript基础语法,javascript零基础,javascript基础入门教程,javascript基础语法,内容如对您有帮助，希望把文章链接给更多的朋友！
参考自：https://www.w3cschool.cn/javascript/
javascript 简介JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript 是脚本语言JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript 很容易学习。
JavaScript 知识图谱JavaScript 数组Javascript 基本操作JavaScript 变量JavaScript 函数基础JavaScript 运算符JavaScript 流程语句JavaScript 数据类型JavaScript 正则表达式JavaScript 字符串函数Window 对象JavaScript 用法HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
<script> 标签如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。
<script> 和 </script> 之间的代码行包含了 JavaScript:
<script> alert("我的第一个 JavaScript");</script>// 那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。<body> 中的 JavaScript<!DOCTYPE html><html><body><script>document.write("<h1>这是一个标题</h1>");document.write("<p>这是一个段落</p>");</script></body></html>在 <head> 或者 <body> 的JavaScript您可以在 HTML 文档中放入不限数量的脚本。
脚本可位于 HTML 的 <body> 或 <head> 部分中，或者同时存在于两个部分中。
通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。
<head> 中的 JavaScript 函数在本例中，我们把一个 JavaScript 函数放置到 HTML 页面的 <head> 部分。
该函数会在点击按钮时被调用
<!DOCTYPE html><html><head><script>function myFunction(){ document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";}</script></head><body><h1>我的 Web 页面</h1><p id="demo">一个段落</p><button type="button" onclick="myFunction()">尝试一下</button></body></html><body> 中的 JavaScript 函数在本例中，我们把一个 JavaScript 函数放置到 HTML 页面的 <body> 部分。
该函数会在点击按钮时被调用：
<!DOCTYPE html><html><body><h1>我的 Web 页面</h1><p id="demo">一个段落</p><button type="button" onclick="myFunction()">尝试一下</button><script>function myFunction(){ document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";}</script></body></html>外部的 JavaScript也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件，请在 <script> 标签的 “src” 属性中设置该 .js 文件：
<!DOCTYPE html><html><body> <script src="myScript.js"></script></body></html>你可以将脚本放置于 <head> 或者 <body>中 实际运行效果与您在 <script> 标签中编写脚本完全一致。
myScript.js 文件代码如下：
function myFunction() { document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; }// 外部脚本不能包含 <script> 标签。JavaScript 浏览器中执行https://www.w3cschool.cn/javascript/javascript-5oi33l66.html
JavaScript 输出JavaScript 可以通过不同的方式来输出数据：
使用 window.alert() 弹出警告框。使用 document.write() 方法将内容写到 HTML 文档中。使用 innerHTML 写入到 HTML 元素。使用 console.log() 写入到浏览器的控制台。严格来说，JavaScript 没有任何打印或者输出的函数，以上几种方式都只不过是一种数据展示的方法，最接近输出的方法应该是console，但这种方法只是一种调试辅助工具。
使用 window.alert()你可以弹出警告框来显示数据：
<!DOCTYPE html><html><body><h1>我的第一个页面</h1><p>我的第一个段落。</p><script>window.alert(5 + 6);</script></body></html>操作 HTML 元素如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(*id*) 方法。
请使用 “id” 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容：
<!DOCTYPE html><html><body><h1>我的第一个 Web 页面</h1><p id="demo">我的第一个段落</p><script>document.getElementById("demo").innerHTML = "段落已修改。";</script></body></html>以上 JavaScript 语句（在 <script> 标签中）可以在 web 浏览器中执行：
document.getElementById(“demo”) 是使用 id 属性来查找 HTML 元素的 JavaScript 代码 。该方法是 HTML DOM 中定义的。
innerHTML = “Paragraph changed.” 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。
写到 HTML 文档使用 document.write() 方法将内容写到 HTML 文档中。此功能可用于写入文本和HTML。
出于测试目的，您可以将JavaScript直接写在HTML 文档中：
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> </head><body><h1>我的第一个 Web 页面</h1><p>我的第一个段落。</p><script>document.write(Date());</script></body></html>请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> </head><body><h1>我的第一个 Web 页面</h1><p>我的第一个段落。</p><button onclick="myFunction()">点我</button><script>function myFunction() { document.write(Date());}</script></body></html>写到控制台如果您的浏览器支持调试，你可以使用 console.log() 方法在浏览器中显示 JavaScript 值。
浏览器中使用 F12 来启用调试模式， 在调试窗口中点击 “Console” 菜单。
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> </head><body><h1>我的第一个 Web 页面</h1><p>浏览器中(Chrome, IE, Firefox) 使用 F12 来启用调试模式， 在调试窗口中点击 "Console" 菜单。</p><script>a = 5;b = 6;c = a + b;console.log(c);alert(c)</script></body></html>console.log() 方法能够让你看到你在页面中的输出内容，让你更容易调试javascript；与alert相比，console不会打断你页面的操作，console里面的内容非常丰富，你可以在控制台输入 console。程序中调试是测试，查找及减少bug(错误)的过程。
JavaScript 语法JavaScript 字面量在编程语言中，一个字面量是一个常量，如 3.14。
数字（Number）字面量 可以是整数或者是小数，或者是科学计数(e)。
3.141001123e5字符串（String）字面量 可以使用单引号或双引号 :
"John Doe"'John Doe'表达式字面量 用于计算：
5 + 65 * 10
数组（Array）字面量 定义一个数组：
[40, 100, 1, 5, 25, 10]对象（Object）字面量 定义一个对象：
{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}函数（Function）字面量 定义一个函数：
function myFunction(a, b) {return a * b;}JavaScript 变量在编程语言中，变量用于存储数据值。
JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值：
var x, lengthx = 5length = 6变量可以通过变量名访问。在指令式语言中，变量通常是可变的。字面量是一个恒定的值。变量是一个名称。字面量是一个值。
JavaScript 操作符JavaScript使用 算术运算符 来计算值:
(5 + 6) * 10JavaScript使用赋值运算符给变量赋值：
x = 5y = 6z = (x + y) * 10JavaScript语言有多种类型的运算符：
Type实例描述赋值，算术和位运算符= + - * /在 JS 运算符中描述条件，比较及逻辑运算符== != < >在 JS 比较运算符中描述JavaScript 语句在 HTML 中，JavaScript 语句向浏览器发出的命令。浏览器通过 JavaScript 语句明白要执行什么操作。
语句是用分号分隔：
x = 5 + 6;y = x * 10;JavaScript 关键词JavaScript 语句通常以关键词为开头。 var 关键词告诉浏览器创建一个新的变量：
var x = 5 + 6;var y = x * 10;JavaScript 标识符和其他任何编程语言一样，JavaScript 保留了一些标识符为自己所用。
JavaScript 同样保留了一些关键字，这些关键字在当前的语言版本中并没有使用，但在以后 JavaScript 扩展中会用到。
JavaScript 标识符必须以字母、下划线（_）或美元符（$）开始。
后续的字符可以是字母、数字、下划线或美元符（数字是不允许作为首字符出现的，以便 JavaScript 可以轻易区分开标识符和数字）。
以下是 JavaScript 中最重要的保留字（按字母顺序）：
abstractelseinstanceofsuperbooleanenumintswitchbreakexportinterfacesynchronizedbyteextendsletthiscasefalselongthrowcatchfinalnativethrowscharfinallynewtransientclassfloatnulltrueconstforpackagetrycontinuefunctionprivatetypeofdebuggergotoprotectedvardefaultifpublicvoiddeleteimplementsreturnvolatiledoimportshortwhiledoubleinstaticwithJavaScript 注释不是所有的 JavaScript 语句都是"命令"。双斜杠 // 后的内容将会被浏览器忽略：
// 我不会执行JavaScript 数据类型JavaScript 有多种数据类型：数字，字符串，数组，对象等等：
var length = 16; // Number 通过数字字面量赋值var points = x * 10; // Number 通过表达式字面量赋值var lastName = "Johnson"; // String 通过字符串字面量赋值var cars = ["Saab", "Volvo", "BMW"]; // Array 通过数组字面量赋值var person = {firstName:"John", lastName:"Doe"}; // Object 通过对象字面量赋值数据类型的概念编程语言中，数据类型是一个非常重要的内容。
为了可以操作变量，了解数据类型的概念非常重要。
如果没有使用数据类型，以下实例将无法执行：
16 + "Volvo"// 16 加上 "Volvo" 是如何计算呢? 以上会产生一个错误还是输出以下结果呢？"16Volvo"你可以在浏览器尝试执行以上代码查看效果。
在接下来的章节中你将学到更多关于数据类型的知识。
JavaScript 函数JavaScript 语句可以写在函数内，函数可以重复引用：
引用一个函数 = 调用函数(执行函数内的语句)。
function myFunction(a, b) { return a * b; // 返回 a 乘于 b 的结果}JavaScript 对大小写敏感JavaScript 对大小写是敏感的。
当编写 JavaScript 语句时，请留意是否关闭大小写切换键。
函数 getElementById 与 getElementbyID 是不同的。
同样，变量 myVariable 与 MyVariable 也是不同的。
**提示：**在本站的编程实战中，你可以通过练习理解JavaScript变量的大小写敏感性。
JavaScript 字符集JavaScript 使用 Unicode 字符集。
Unicode 覆盖了所有的字符，包含标点等字符。
如需进一步了解，请学习我们的 完整 Unicode 参考手册。
JavaScript 中，常见的是驼峰法的命名规则，如 lastName (而不是lastname)。
JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。
JavaScript 语句JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。
JavaScript 语句是发给浏览器的命令。
这些命令的作用是告诉浏览器要做的事情。
下面的 JavaScript 语句向 id=“demo” 的 HTML 元素输出文本 “Hello Dolly” ：
document.getElementById("demo").innerHTML = "你好 Dolly.";分号 ;分号用于分隔 JavaScript 语句。
通常我们在每条可执行的语句结尾添加分号。
使用分号的另一用处是在一行中编写多条语句。
例如:
a = 5;b = 6;c = a + b;下面这种写法同上:
a = 5; b = 6; c = a + b;您也可能看到不带有分号的案例。 在 JavaScript 中，用分号来结束语句是可选的。
JavaScript 代码JavaScript 代码是 JavaScript 语句的序列。
浏览器按照编写顺序依次执行每条语句。
本例向网页输出一个标题和两个段落：
document.getElementById("demo").innerHTML="你好 Dolly";document.getElementById("myDIV").innerHTML="你最近怎么样?";JavaScript 代码块JavaScript 可以分批地组合起来。
代码块以左花括号开始，以右花括号结束。
代码块的作用是一并地执行语句序列。
本例向网页输出一个标题和两个段落：
function myFunction(){document.getElementById("demo").innerHTML="你好Dolly";document.getElementById("myDIV").innerHTML="你最近怎么样?";}您将在稍后的章节学到更多有关函数的知识。
JavaScript 语句标识符JavaScript 语句通常以一个 语句标识符 为开始，并执行该语句。
语句标识符是保留关键字不能作为变量名使用。
下表列出了 JavaScript 语句标识符 (关键字) ：
语句描述break用于跳出循环。catch语句块，在 try 语句块执行出错时执行 catch 语句块。continue跳过循环中的一个迭代。do … while执行一个语句块，在条件语句为 true 时继续执行该语句块。for在条件语句为 true 时，可以将代码块执行指定的次数。for … in用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。function定义一个函数if … else用于基于不同的条件来执行不同的动作。return退出函数switch用于基于不同的条件来执行不同的动作。throw抛出（生成）错误 。try实现错误处理，与 catch 一同使用。var下一篇：Stable Diffusion 原理介绍与源码分析（一）(铡刀演示)
