每日一「講」JavaScript- Hello Wo

每日一「講」JavaScript: Hello World

.1 JavaScript: Hello, world!

從本講開始，我們正式踏上了JavaScript的夢(mèng)幻之旅啦！

還記得上一講中，如何打開console調(diào)試代碼嗎？可以借助調(diào)試器查看代碼運(yùn)行結(jié)果。另一種查看運(yùn)行結(jié)果的辦法是使用alert，當(dāng)然，這種方法不適合進(jìn)行復(fù)雜調(diào)試。選擇一種，開始吧！

script 標(biāo)簽

通常可以將JavaScript代碼寫在<script></script>標(biāo)簽內(nèi)，并且script標(biāo)簽可以插入HTML文檔的任何位置。

<!DOCTYPE HTML>
<html>
<body>
<p>之前...</p>
<script>
alert( 'Hello, world!' );
</script>
<p>...之后</p>
</body>
</html>

將代碼保存為debug.html，用瀏覽器打開debug.html，運(yùn)行結(jié)果：

標(biāo)簽屬性

類型屬性：<script type=…>

舊的HTML標(biāo)準(zhǔn)HTML4要求腳本具有類型。通常它是type=“ text / javascript”。

但是現(xiàn)在不再需要了。現(xiàn)代HTML標(biāo)準(zhǔn)完全改變了此屬性的含義。現(xiàn)在，它可以用于JavaScript模塊。

語言屬性：<script language=…>

此屬性旨在顯示腳本的語言。因?yàn)镴avaScript是默認(rèn)語言，所以該屬性不再有意義。不需要使用它。

腳本前后的注釋

在比較早期的書籍和指南中，您可能會(huì)在<script>標(biāo)記內(nèi)找到注釋，如下所示：

<script type="text/javascript"><!--
...
//--></script>

現(xiàn)代JavaScript不使用此技巧。這些注釋會(huì)在不知道如何處理<script>標(biāo)記的舊瀏覽器中隱藏JavaScript代碼。由于過去15年內(nèi)發(fā)布的瀏覽器沒有此問題，因此此類注釋可以幫助您識(shí)別真正的舊代碼。

外部腳本

當(dāng)我們有很多JavaScript代碼時(shí)，則可以將其放入單獨(dú)的文件中。

腳本文件通過src屬性附加到HTML：

<script src="/path/to/script.js"></script>

在這里，/path/to/script.js是從站點(diǎn)根目錄到腳本的絕對(duì)路徑。您還可以提供當(dāng)前頁面的相對(duì)路徑。例如，src=“ script.js”表示當(dāng)前文件夾中的文件“ script.js”。

我們也可以提供完整的URL。例如：

<script src="https://your.domain.com/libs/jquery.js"></script>

要附加多個(gè)腳本，則可以使用多個(gè)標(biāo)簽：

<script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…

小竅門：通常，僅將最簡單的腳本放入HTML。更復(fù)雜的文件位于單獨(dú)的文件中。單獨(dú)文件的好處是瀏覽器將下載該文件并將其存儲(chǔ)在其緩存中。引用同一腳本的其他頁面將從緩存中獲取而不是下載它，因此該文件實(shí)際上僅下載了一次。這樣可以減少訪問量并使頁面更快。

注意：如果設(shè)置了src，則腳本內(nèi)容將被忽略。單個(gè)<script>標(biāo)簽不能同時(shí)包含src屬性和代碼。

<script src="file.js">
alert(1); // 這里的代碼將被忽略，因?yàn)閟rc設(shè)置了文件
</script>

我們必須選擇帶有代碼的外部<script src=“…”>或常規(guī)的<script>。上面的示例可以分為兩個(gè)腳本工作：

<script src="file.js"></script>
<script>
alert(1);
</script>

本講小結(jié)

我們可以使用<script>標(biāo)記將JavaScript代碼添加到頁面。
類型和語言屬性不是必需的。
可以使用<script src=“ path/to/script.js”> </ script>插入外部文件中的腳本。

小練習(xí)

創(chuàng)建一個(gè)頁面，顯示“我愛JavaScript！”。
通過將腳本內(nèi)容提取到位于同一文件夾中的外部文件alert.js中進(jìn)行修改。

果用C語言輸出：Hello，world！，該如何編寫程序？

**代碼如下：**

#include<stdio.h>//包含標(biāo)準(zhǔn)庫的信息
main()//定義名為main的函數(shù)，不接受參數(shù)值
{//main函數(shù)的語句都放在花括號(hào)中，也表示函數(shù)體的開始
printf("Hello,world!\n"); //main函數(shù)調(diào)用庫函數(shù)printf以顯示字符序列
}//函數(shù)體結(jié)束

程序運(yùn)行結(jié)果：

###說明：

對(duì)于一個(gè)C語言程序，無論它的大小如何，都是由函數(shù)和變量組成的：

– 函數(shù)：包含一些語句，以指定所要執(zhí)行的計(jì)算操作

–變量：用于存儲(chǔ)計(jì)算過程中使用的值

#include<stdio.h>

用于告訴編譯器在本程序中包含標(biāo)準(zhǔn)輸入\輸出庫的信息

####main函數(shù)：

每個(gè)C語言程序都是從main函數(shù)的起點(diǎn)開始執(zhí)行，這就意味著每個(gè)程序都必須在某個(gè)位置包含一個(gè)main函數(shù)。

main函數(shù)通常會(huì)調(diào)用其他函數(shù)來幫助完成某些工作，被調(diào)用的函數(shù)可以是程序設(shè)計(jì)人員自己編寫的，也可以是來自于函數(shù)庫。

####參數(shù)：

-函數(shù)之間進(jìn)行數(shù)據(jù)交換的一種方法是調(diào)用函數(shù)向北調(diào)用函數(shù)提供一個(gè)值（這個(gè)值就稱為參數(shù)）列表；一般情況下在函數(shù)名后面用一對(duì)圓括號(hào)將參數(shù)列表括起來。在本例中，main函數(shù)不需要任何參數(shù)，所以用空函數(shù)表示。

####執(zhí)行語句：

-函數(shù)中的執(zhí)行語句用一對(duì)花括號(hào)**{ }**括起來,本例中的執(zhí)行語句就只包含一條語句：

printf("Hello,world!\n");

-調(diào)用函數(shù)時(shí)，只需要使用函數(shù)名加上用圓括號(hào)括起來的參數(shù)即可。

#####printf函數(shù)：

-是一個(gè)用于打印輸出的庫函數(shù)，在本例中，它將打印雙引號(hào)之間的字符串。

注：

-用雙引號(hào)括起來的字符序列稱為字符串或字符常量。

-printf函數(shù)不會(huì)自動(dòng)換行

-在printf函數(shù)的參數(shù)中，只能用\n表示換行符

####思考

若將上例中的字符序列\(zhòng)n改成如下所示，又是否運(yùn)行呢？

printf("Hello,world!");

如果改寫成如下樣式，又是否和原格式輸出一樣呢？

#include<stdio.h>
main()
{
printf("Hello,");
printf("world");
printf("\n");
}

話說回來，C/C++是一個(gè)既可以強(qiáng)化思維能力，又可以打好編程基礎(chǔ)的編程語言，你想要做軟件開發(fā)，成為核心程序員的話，學(xué)習(xí)C/C++是比較好的選擇，筆者有一個(gè)C/C++的編程千人湫羣（Q艘索：C語言編程學(xué)習(xí)聚集地（無言建立））你如果感覺自學(xué)C/C++語言有困難的話，有興趣學(xué)習(xí)或者了解一下C/C++編程的伙伴就可以進(jìn)來交流。下面給大家分享一下C/C++的學(xué)習(xí)路線圖：

lectron是一個(gè)使用javascript進(jìn)行跨平臺(tái)桌面應(yīng)用開發(fā)的解決方案。

首先在webstorm里面新建一個(gè)nodejs項(xiàng)目。

接著運(yùn)行

npm i --save-dev electron

添加對(duì)項(xiàng)目的依賴。這一步會(huì)下載electron的二進(jìn)制，時(shí)間會(huì)比較長。

國內(nèi)可以設(shè)置淘寶鏡像：

Windows上設(shè)置環(huán)境變量

set ELECTRON_MIRROR=https://cdn.npm.taobao.org/dist/electron/

新建一個(gè)index.js文件。

const { app, BrowserWindow }=require('electron');

function createWindow () {
    const win=new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
        }
    });

    win.loadFile('index.html');
}

app.whenReady().then(()=> {
    createWindow()
})

然后添加一個(gè)index.html，用于Electron里面的瀏覽器窗口加載。既然是HelloWorld，就寫個(gè)最簡單的html文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HelloWorld</title>
</head>
<body>
    HelloWorld
</body>
</html>

條件npm運(yùn)行腳本到package.json里面：

在WebStorm里面新建一個(gè)Configuration

點(diǎn)擊運(yùn)行：

可以看到HelloWorld窗口了。

在線咨詢

上一篇：Htmx走紅，從React“退回去”后：代碼減少 6
下一篇：如何寫好設(shè)計(jì)文檔

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。