javascript
JavaScript编程用法——JavaScript运行环境
文章目錄
- 文件版本說(shuō)明
- JavaScript運(yùn)行環(huán)境
- 鑲嵌網(wǎng)頁(yè)
- JavaScript文件腳本：.js
- JavaScript打印
- 打印方式
- 打印級(jí)別
- 編寫代碼IDE平臺(tái):記事本 + 瀏覽器
- 調(diào)試代碼
- 編寫代碼IDE平臺(tái)：Visual Studio Code + Node.js
- 主程序
- 調(diào)試代碼
- 編寫代碼IDE平臺(tái)：Linux
- 中文支持
文件版本說(shuō)明
| 0.1 | 2018.05.01 | 撰寫草稿 | 鐘鑫 |
| 0.2 | 2018.05.05 | 添加js變量定義 | 鐘鑫 |
| 0.3 | 2018.05.05 | 添加js編譯環(huán)境 | 鐘鑫 |
| 0.4 | 2018.05.11 | 添加js函數(shù) | 鐘鑫 |
| 0.5 | 2018.05.14 | 添加解構(gòu)賦值 | 鐘鑫 |
| 0.6 | 2018.05.19 | 添加函數(shù)定義以及類定義 | 鐘鑫 |
| 0.7 | 2018.05.27 | 添加類的定義 | 鐘鑫 |
| 0.8 | 2018.06.09 | 添加時(shí)間定義 | 鐘鑫 |
JavaScript運(yùn)行環(huán)境
鑲嵌網(wǎng)頁(yè)
在一個(gè)html中鑲嵌JavaScript，鑲嵌標(biāo)簽
JsTest.html
顯示效果如下圖所示。
JavaScript文件腳本：.js
將js代碼寫入一個(gè)js文件中，然后通過(guò)html調(diào)用這個(gè)腳本。 function js_main(){ alert('main alert ZX test');console.log('main console ZX test');document.write('main document ZX test'); } js_main();將js文件鑲嵌到html文件中
<html><head><title> ZX test title </title><script src="./Jsmain.js"> </script></head><body></body> </html>顯示效果如下圖所示。
JavaScript打印
JavaScript的調(diào)試打印在瀏覽器中按F12調(diào)出，代碼中用console對(duì)象實(shí)現(xiàn)。
打印方式
JavaScript的調(diào)試打印有多中方式，包含可以直接打印數(shù)字、數(shù)組、字符串甚至結(jié)構(gòu)體和類。
源碼
執(zhí)行結(jié)果
打印級(jí)別
console對(duì)象對(duì)調(diào)試打印有著打印級(jí)別，對(duì)應(yīng)不同的調(diào)試環(huán)境。
源碼
function js_console_level(){ console.log("This is log level.");console.debug("This is debug level.");console.info("This is info level.");console.warn("This is warn level.");console.error("This is error level."); }執(zhí)行結(jié)果
點(diǎn)擊右邊的定位會(huì)跳轉(zhuǎn)到代碼調(diào)試選項(xiàng)
編寫代碼IDE平臺(tái):記事本 + 瀏覽器
只要安裝了瀏覽器，通過(guò)記事本就可以編寫js代碼。但要使js運(yùn)行起來(lái)，就必須將js鑲嵌到html文件中
瀏覽器打開html文件，就可以執(zhí)行js腳本。
調(diào)試代碼
在瀏覽器按F12調(diào)出調(diào)試環(huán)境，可以在源碼上打上斷點(diǎn)，單步調(diào)試，查看輸出。如下圖所示。
edge上調(diào)試代碼，如下圖所示
編寫代碼IDE平臺(tái)：Visual Studio Code + Node.js
用Visual Studio Code輕便，結(jié)合Node.js開發(fā)可以不用調(diào)用瀏覽器去調(diào)試代碼。
與瀏覽器不同的是，js文件可以單獨(dú)運(yùn)行而不需嵌入html中，通過(guò)Node.js加載運(yùn)行。
Visual Studio Code下載：https://code.visualstudio.com/
Node.js下載：https://nodejs.org/en/
安裝完之后打開指定文件夾，如下圖所示
編碼格式選擇LF，與linux保持一致，如下圖所示
主程序
在安裝好Node.js之后，配置Visual Studio Code的環(huán)境，就可以調(diào)試js的代碼。如下圖所示。
調(diào)試代碼
控制調(diào)試代碼的配置是由文件launch.json進(jìn)行控制的，可以在添加配置選項(xiàng)中配置調(diào)試選項(xiàng)。launch.json文件放置在工程目錄的.vscode文件夾下，如下圖所示。
編輯界面可以打斷點(diǎn)進(jìn)行調(diào)試，在調(diào)試控制臺(tái)可以看到輸出信息。變量欄可以時(shí)刻觀察js變量。如下圖所示。
編寫代碼IDE平臺(tái)：Linux
在linux中，支持JavaScript的調(diào)試，需要安裝nodejs
sudo apt-get install nodejs-legacy nodejs$ node -v v4.2.6執(zhí)行JavaScript腳本
$ node Jsmain.js string A 3 3.14159 [ 'zx', 6.626e-34, 'B', 8 ] { siindex: 1,strname: 'ZX Test',sinum: 2.71828,functest: [Function: stfunc] }中文支持
js文件保存的形式是utf-8模式保存，不然會(huì)出現(xiàn)亂碼，如下圖所示。
總結(jié)
以上是生活随笔為你收集整理的JavaScript编程用法——JavaScript运行环境的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Java 字节和字符流的读写+Buffe
- 下一篇： （三）Neo4j自带northwind案