內建函式
## JavaScript 常用的內建函式簡介
JavaScript 提供許多常用函式,可以用來處理文字、數字、陣列、日期以及瀏覽器互動等功能。
### 1. 輸出相關
#### `console.log()`
將內容輸出到瀏覽器的開發者工具 Console。
```javascript
console.log("Hello, JavaScript!");
console.log(10 + 20); // 30
```
---
### 2. 瀏覽器互動函式
> `alert()`、`confirm()` 和 `prompt()` 通常稱為瀏覽器提供的內建函式或 Web API。
#### `alert()`
顯示提示訊息,使用者只能按下「確定」。
```javascript
alert("歡迎使用本網站!");
```
`alert()` 不會回傳有意義的結果,通常只用來顯示訊息。
---
#### `confirm()`
顯示確認視窗,使用者可以選擇「確定」或「取消」。
- 按下「確定」時回傳 `true`
- 按下「取消」時回傳 `false`
```javascript
const result = confirm("你確定要繼續嗎?");
console.log(result);
if (result) {
console.log("使用者選擇了確定");
} else {
console.log("使用者選擇了取消");
}
```
---
#### `prompt()`
顯示輸入視窗,讓使用者輸入文字。
```javascript
const name = prompt("請輸入你的姓名:");
console.log("使用者輸入的姓名是:" + name);
```
如果使用者按下「取消」,通常會回傳 `null`。
---
### 3. 數字處理
#### `parseInt()`
將文字轉換成整數。
```javascript
const number = parseInt("123", 10);
console.log(number); // 123
```
#### `parseFloat()`
將文字轉換成浮點數。
```javascript
const price = parseFloat("99.5");
console.log(price); // 99.5
```
#### `Number()`
將資料轉換成數字。
```javascript
console.log(Number("100")); // 100
console.log(Number("3.14")); // 3.14
```
#### `isNaN()`
判斷某個值是否不是有效數字。
```javascript
console.log(isNaN("abc")); // true
console.log(isNaN("123")); // false
```
---
## `alert()` 與 `confirm()` 綜合範例
```javascript
alert("歡迎來到會員註冊頁面!");
const shouldRegister = confirm("你要開始註冊嗎?");
console.log("confirm 回傳值:", shouldRegister);
if (shouldRegister) {
console.log("使用者選擇開始註冊");
} else {
console.log("使用者取消註冊");
}
```
執行程式時:
1. 先顯示 `alert()` 訊息。
2. 接著顯示 `confirm()` 確認視窗。
3. 使用者的選擇會透過 `console.log()` 印出:
- `true`:按下確定
- `false`:按下取消
相關學習地圖、教學課程
F2E 網站前端工程