diff --git a/404.html b/404.html new file mode 100644 index 00000000..e0d40c57 --- /dev/null +++ b/404.html @@ -0,0 +1,22 @@ + + + + + + 404 | 前端班課程講義 + + + + + + + + + + + +
前端班課程講義

主題

404

PAGE NOT FOUND

But if you don't change your direction, and if you keep looking, you may end up where you are heading.
Take me home
+ + + + \ No newline at end of file diff --git a/advanced/advanced.html b/advanced/advanced.html new file mode 100644 index 00000000..fbab00d6 --- /dev/null +++ b/advanced/advanced.html @@ -0,0 +1,124 @@ + + + + + + 進階 JavaScript 語法 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

進階 JavaScript 語法 ​

try catch、Promise 和 async await

try catch ​

try catch 可以處理程式的錯誤，讓程式不會因為錯誤而影響執行
也可以利用這種寫法進行流程控制

避免出現錯誤訊息 ​

使用一個不存在的函式

js
const message = () => {
+  try {
+    // 使用不存在的函式，觸發錯誤
+    alertt("Welcome guest!");
+  } catch(err) {
+    // 處理錯誤
+    console.log(err.message);
+  }
+}
+message();

流程控制 ​

輸入驗證流程範例

js
const validate = (input) => {
+  try {
+    // 可以使用 throw 拋出錯誤，通常會使用 new Error
+    if(input == '') throw new Error('empty');
+    if(isNaN(input)) throw new Error('not a number');
+    if(input < 5) throw new Error('too low');
+    if(input > 10) throw new Error('too high');
+    console.log('驗證成功');
+  }
+  catch(err) {
+    console.log = `驗證失敗: ${err.message}`;
+  }
+}
+validate(1);

Promise ​

Promise 就跟單字的意思一樣，就是承諾
當承諾達成時，執行 .then() 內的程式，若有錯誤則執行 .catch() 內的程式

假設媽媽說，如果你這禮拜考試及格，下個禮拜就給你零用錢
現在你不知道到底會不會拿到零用錢，有可能你考試順利及格，也有可能因為沒讀書而考不好
這就是一個 Promise ，且有三種狀態

  • pending 還沒發生或等待中，你還不知道考試結果
  • resolved 順利通過考試，拿到零用錢
  • rejected 沒讀書考不好，沒有零用錢

以上比喻轉成 Promise 物件程式碼

js
const passed = true
+const willGetMoney = new Promise((resolve, reject) => {
+  if (passed) {
+    resolve('得到零用錢')
+  } else {
+    reject(new Error('考試不及格'))
+  }
+})
+
+willGetMoney.then(res => {
+  console.log(res)
+}).catch(err => {
+  console.log(err.message)
+})

也可以包成 function

js
const willGetMoney = passed => {
+  return new Promise((resolve, reject) => {
+    if (passed) {
+      resolve('得到零用錢')
+    } else {
+      reject(new Error('考試不及格'))
+    }
+  })
+}
+
+willGetMoney(true).then(res => {
+  console.log(res)
+}).catch(err => {
+  console.log(err.message)
+})

async await ​

將 function 加上 async，就可以在 function 內使用等待程式執行完畢的 await，變成同步函式
也可以透過 await 的幫助，改善 Promise 可讀性

注意

await 只能加在 async function 內，且 await 只能加在 Promise 函式

js
const wait = time => {
+  return new Promise((resolve, reject) => {
+    // 只能接受數字
+    if(isNaN(time)) {
+      reject(new Error('不是數字'))
+    }
+    // 以 setTimeout 模擬長時間運算
+    setTimeout(() => {
+      resolve(`過了 ${time / 1000} 秒`)
+    }, time)
+  })
+}
+
+const asyncfunc = async () => {
+  // 建議搭配 try catch 使用
+  try {
+    // 當 await 的 promise 成功時，可以直接用變數接 .then() 內的值
+    const msg1 = await wait(3000)
+    console.log('msg1' + msg1)
+    const msg2 = await wait(2000)
+    console.log('msg2' + msg2)
+    // 當 await 的 promise 有錯誤時，會導向 下面的 catch
+    // const msg3 = await wait('abc')
+    // console.log('msg3' + msg3)
+    console.log('finish')
+    return msg1 + msg2
+  } catch (e) {
+    console.log('error' + e.message)
+    return Promise.reject(new Error(e.message))
+  }
+}
+
+// async function 回傳的資料型態是 Promise，所以要用 .then() 接
+// 也可以用 Promise.reject 拋出錯誤，讓 .catch() 接
+asyncfunc().then(result => {
+  console.log(result)
+}).catch(err => {
+  console.log(err)
+})

注意

在使用 await 的同時，不要錯過同時執行的機會
執行這段程式碼需要 3000 毫秒

js
const func1 = async () => {
+  const wait1 = await wait(1500);
+  const wait2 = await wait(1500);
+  return wait1 + wait2;
+}
+func1()

但是執行這段程式碼只需要 1500 毫秒，因為兩個 wait 同時發生

js
const func2 = async () => {
+  let wait1 = wait(1500);
+  let wait2 = wait(1500);
+  wait1 = await wait1;
+  wait2 = await wait2;
+  return wait1 + wait2;
+}
+func2()

練習

使用 AJAX 搭配以上的本章的函式
先在 https://jsonplaceholder.typicode.com/users 裡搜尋名為 Leanne Graham 的使用者 ID
接著用 https://jsonplaceholder.typicode.com/posts?userId= 獲取該使用者的所有文章
最後用條列式顯示所有文章的 title

+ + + + \ No newline at end of file diff --git a/advanced/ajax.html b/advanced/ajax.html new file mode 100644 index 00000000..419b1ea8 --- /dev/null +++ b/advanced/ajax.html @@ -0,0 +1,110 @@ + + + + + + HTTP 請求與 AJAX | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

HTTP 請求與 AJAX ​

AJAX 是一種非同步的技術，讓網頁不重新整理就可以跟伺服器交換資料

HTTP 請求 ​

以上網瀏覽網頁為例，HTTP 請求如圖

Request Line ​

Request Line 為請求的方式及目標網址
常見的請求方式有：

  • GET: 讀取資源
  • PATCH: 更新部分資源欄位
  • PUT: 更新全部資源欄位
  • DELETE: 刪除資源
  • POST: 新增資源

以上四種方式分別對應遠端伺服器資料庫的增改刪查動作，也就是 RESTful API

注意

HTML 的 form 標籤只支援 GET 和 POST

Status Line ​

Status Line 為請求的狀態資訊，也就是 HTTP 狀態碼

HTTP 狀態碼大致分為下列幾種

  • 1xx Informational 參考資訊
  • 2xx Successful 成功
  • 3xx Redirection 重新導向
  • 4xx Client Error 用戶端錯誤
  • 5xx Server Error 伺服器錯誤

常見的 HTTP 狀態碼有：

  • 100: 請求中
  • 200: 成功
  • 404: 找不到

Header 為資料的設定，比較重要的設定有：

  • Content-Type 資料類型
  • User-Agent 瀏覽器識別

Body ​

Body 則為資料的內容

注意

GET 沒有 Body，因為 GET 用 URL 傳遞資料

AJAX ​

AJAX 技術是在不重新整理網頁的情況下，發送 HTTP REQUEST
與後端伺服器資料交換後，可以透過 DOM 操作更新網頁內容
因為網頁沒有重新整理，減少了讀取時間，在瀏覽網頁時的使用者體驗會比一般網頁好
下面是幾個 AJAX 的應用範例

  • Google 搜尋依輸入文字顯示搜尋建議
  • YouTube、Facebook 不會重新載入網頁
  • 訂便當 登入後跳出成功或失敗動畫

基於安全性問題，大多數的伺服器都有設置跨網域防護 (CORS)
想像一下，如果你在瀏覽 Facebook 時，網站內的 JavaScript 能取得你的蝦皮訂單會是怎麼樣的情況
以下範例皆為瀏覽器 JavaScript 使用的 AJAX
以沒有擋 CORS 的 kktix API 為範例

XMLHttpRequest ​

最早的 JavaScript AJAX 是 XMLHttpRequest (XHR)

js
let xhr = new XMLHttpRequest();
+xhr.open('get', 'https://kktix.com/events.json')
+xhr.onload = () => {
+  console.log(xhr.responseText);
+}
+xhr.onerror = (err) => {
+  console.log(err);
+}
+xhr.send();

Fetch API ​

Fetch 是近年來號稱要取代XHR的新技術標準

js
fetch('https://kktix.com/events.json', { method: 'GET' })
+  .then(response => {
+    // 可以透過 .blob(), .json(), .text() 轉成可用的資訊
+    return response.json();
+  })
+  // 成功執行的 function
+  .then(json => {
+    console.log(json);
+  })
+  // 錯誤時執行的 function
+  .catch(error => {
+    console.log(error);
+  })
+  // 不管成功失敗都執行
+  .finally(() => {
+    console.log('final');
+  })

jQuery AJAX ​

作為 JavaScript 函式庫的 jQuery 也有自己的 AJAX 函式

js
$.ajax({
+  url: 'https://kktix.com/events.json',
+  type: 'GET',
+  // 返回的檔案格式是 json
+  dataType: 'json'
+  // 成功執行的 function
+  success: function(response) {
+    console.log(response);
+  }
+  // 錯誤時執行的 function
+  error: function(xhr, ajaxOptions, thrownError) {
+    console.log(xhr.status);
+    console.log(xhr.responseText);
+    console.log(thrownError)
+  }
+  // 不管成功或失敗都會執行
+  complete: function() {
+    console.log("完成")
+  }
+})
+
+$.ajax({
+    url: 'https://kktix.com/events.json',
+    type: 'GET',
+  })
+  // 成功執行的 function
+  .done(function(response){
+    console.log(response);
+  })
+  // 錯誤時執行的 function
+  .fail(function(error){
+    console.log(error.status);
+    console.log(error.responseText);
+  })
+  // 不管成功或失敗都會執行
+  .always(function(){
+  console.log("完成");
+  })
+
+$.get('https://kktix.com/events.json', function(response){
+  console.log(response);
+}, "json")
+
+$.get('https://kktix.com/events.json')
+  .then(function(response){
+    console.log(response);
+  }, function(error){
+    console.log(error.status);
+    console.log(error.responseText);
+  })

axios ​

axios 是最近相當熱門的 AJAX 套件，也是 Vue 官方推薦的 AJAX 套件

js
axios.get('https://kktix.com/events.json')
+  .then(response => {
+    // 成功
+    console.log(response);
+  })
+  .catch(error => {
+    // 失敗
+    console.log(error);
+  })
+  .then(() => {
+    // 不管成功失敗都執行
+    console.log('請求結束');
+  });

練習

以上面任一種方式連接 kktix API，並用表格顯示資料

+ + + + \ No newline at end of file diff --git a/assets/advanced_advanced.md.CH5MV-jo.js b/assets/advanced_advanced.md.CH5MV-jo.js new file mode 100644 index 00000000..25dc228f --- /dev/null +++ b/assets/advanced_advanced.md.CH5MV-jo.js @@ -0,0 +1,100 @@ +import{_ as s,c as i,o as a,a4 as n,a5 as l,a6 as p}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"進階 JavaScript 語法","description":"","frontmatter":{},"headers":[],"relativePath":"advanced/advanced.md","filePath":"advanced/advanced.md","lastUpdated":1712681240000}'),h={name:"advanced/advanced.md"},k=n(`

進階 JavaScript 語法 ​

try catch、Promise 和 async await

try catch ​

try catch 可以處理程式的錯誤，讓程式不會因為錯誤而影響執行
也可以利用這種寫法進行流程控制

避免出現錯誤訊息 ​

使用一個不存在的函式

js
const message = () => {
+  try {
+    // 使用不存在的函式，觸發錯誤
+    alertt("Welcome guest!");
+  } catch(err) {
+    // 處理錯誤
+    console.log(err.message);
+  }
+}
+message();

流程控制 ​

輸入驗證流程範例

js
const validate = (input) => {
+  try {
+    // 可以使用 throw 拋出錯誤，通常會使用 new Error
+    if(input == '') throw new Error('empty');
+    if(isNaN(input)) throw new Error('not a number');
+    if(input < 5) throw new Error('too low');
+    if(input > 10) throw new Error('too high');
+    console.log('驗證成功');
+  }
+  catch(err) {
+    console.log = \`驗證失敗: \${err.message}\`;
+  }
+}
+validate(1);

Promise ​

Promise 就跟單字的意思一樣，就是承諾
當承諾達成時，執行 .then() 內的程式，若有錯誤則執行 .catch() 內的程式

假設媽媽說，如果你這禮拜考試及格，下個禮拜就給你零用錢
現在你不知道到底會不會拿到零用錢，有可能你考試順利及格，也有可能因為沒讀書而考不好
這就是一個 Promise ，且有三種狀態

以上比喻轉成 Promise 物件程式碼

js
const passed = true
+const willGetMoney = new Promise((resolve, reject) => {
+  if (passed) {
+    resolve('得到零用錢')
+  } else {
+    reject(new Error('考試不及格'))
+  }
+})
+
+willGetMoney.then(res => {
+  console.log(res)
+}).catch(err => {
+  console.log(err.message)
+})

也可以包成 function

js
const willGetMoney = passed => {
+  return new Promise((resolve, reject) => {
+    if (passed) {
+      resolve('得到零用錢')
+    } else {
+      reject(new Error('考試不及格'))
+    }
+  })
+}
+
+willGetMoney(true).then(res => {
+  console.log(res)
+}).catch(err => {
+  console.log(err.message)
+})

async await ​

將 function 加上 async，就可以在 function 內使用等待程式執行完畢的 await，變成同步函式
也可以透過 await 的幫助，改善 Promise 可讀性

注意

await 只能加在 async function 內，且 await 只能加在 Promise 函式

js
const wait = time => {
+  return new Promise((resolve, reject) => {
+    // 只能接受數字
+    if(isNaN(time)) {
+      reject(new Error('不是數字'))
+    }
+    // 以 setTimeout 模擬長時間運算
+    setTimeout(() => {
+      resolve(\`過了 \${time / 1000} 秒\`)
+    }, time)
+  })
+}
+
+const asyncfunc = async () => {
+  // 建議搭配 try catch 使用
+  try {
+    // 當 await 的 promise 成功時，可以直接用變數接 .then() 內的值
+    const msg1 = await wait(3000)
+    console.log('msg1' + msg1)
+    const msg2 = await wait(2000)
+    console.log('msg2' + msg2)
+    // 當 await 的 promise 有錯誤時，會導向 下面的 catch
+    // const msg3 = await wait('abc')
+    // console.log('msg3' + msg3)
+    console.log('finish')
+    return msg1 + msg2
+  } catch (e) {
+    console.log('error' + e.message)
+    return Promise.reject(new Error(e.message))
+  }
+}
+
+// async function 回傳的資料型態是 Promise，所以要用 .then() 接
+// 也可以用 Promise.reject 拋出錯誤，讓 .catch() 接
+asyncfunc().then(result => {
+  console.log(result)
+}).catch(err => {
+  console.log(err)
+})

注意

在使用 await 的同時，不要錯過同時執行的機會
執行這段程式碼需要 3000 毫秒

js
const func1 = async () => {
+  const wait1 = await wait(1500);
+  const wait2 = await wait(1500);
+  return wait1 + wait2;
+}
+func1()

但是執行這段程式碼只需要 1500 毫秒，因為兩個 wait 同時發生

js
const func2 = async () => {
+  let wait1 = wait(1500);
+  let wait2 = wait(1500);
+  wait1 = await wait1;
+  wait2 = await wait2;
+  return wait1 + wait2;
+}
+func2()

練習

使用 AJAX 搭配以上的本章的函式
先在 https://jsonplaceholder.typicode.com/users 裡搜尋名為 Leanne Graham 的使用者 ID
接著用 https://jsonplaceholder.typicode.com/posts?userId= 獲取該使用者的所有文章
最後用條列式顯示所有文章的 title

`,24),t=[k];function e(r,E,d,g,c,y){return a(),i("div",null,t)}const o=s(h,[["render",e]]);export{b as __pageData,o as default}; diff --git a/assets/advanced_advanced.md.CH5MV-jo.lean.js b/assets/advanced_advanced.md.CH5MV-jo.lean.js new file mode 100644 index 00000000..7a8947a9 --- /dev/null +++ b/assets/advanced_advanced.md.CH5MV-jo.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n,a5 as l,a6 as p}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"進階 JavaScript 語法","description":"","frontmatter":{},"headers":[],"relativePath":"advanced/advanced.md","filePath":"advanced/advanced.md","lastUpdated":1712681240000}'),h={name:"advanced/advanced.md"},k=n("",24),t=[k];function e(r,E,d,g,c,y){return a(),i("div",null,t)}const o=s(h,[["render",e]]);export{b as __pageData,o as default}; diff --git a/assets/advanced_ajax.md.CFZo-rz0.js b/assets/advanced_ajax.md.CFZo-rz0.js new file mode 100644 index 00000000..74551415 --- /dev/null +++ b/assets/advanced_ajax.md.CFZo-rz0.js @@ -0,0 +1,86 @@ +import{_ as s,c as i,o as a,a4 as n,a7 as l}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"HTTP 請求與 AJAX","description":"","frontmatter":{},"headers":[],"relativePath":"advanced/ajax.md","filePath":"advanced/ajax.md","lastUpdated":1712681240000}'),p={name:"advanced/ajax.md"},h=n('

HTTP 請求與 AJAX ​

AJAX 是一種非同步的技術，讓網頁不重新整理就可以跟伺服器交換資料

HTTP 請求 ​

以上網瀏覽網頁為例，HTTP 請求如圖

Request Line ​

Request Line 為請求的方式及目標網址
常見的請求方式有：

以上四種方式分別對應遠端伺服器資料庫的增改刪查動作，也就是 RESTful API

注意

HTML 的 form 標籤只支援 GET 和 POST

Status Line ​

Status Line 為請求的狀態資訊，也就是 HTTP 狀態碼

HTTP 狀態碼大致分為下列幾種

常見的 HTTP 狀態碼有：

Header 為資料的設定，比較重要的設定有：

Body ​

Body 則為資料的內容

注意

GET 沒有 Body，因為 GET 用 URL 傳遞資料

AJAX ​

AJAX 技術是在不重新整理網頁的情況下，發送 HTTP REQUEST
與後端伺服器資料交換後，可以透過 DOM 操作更新網頁內容
因為網頁沒有重新整理，減少了讀取時間，在瀏覽網頁時的使用者體驗會比一般網頁好
下面是幾個 AJAX 的應用範例

基於安全性問題，大多數的伺服器都有設置跨網域防護 (CORS)
想像一下，如果你在瀏覽 Facebook 時，網站內的 JavaScript 能取得你的蝦皮訂單會是怎麼樣的情況
以下範例皆為瀏覽器 JavaScript 使用的 AJAX
以沒有擋 CORS 的 kktix API 為範例

XMLHttpRequest ​

最早的 JavaScript AJAX 是 XMLHttpRequest (XHR)

js
let xhr = new XMLHttpRequest();
+xhr.open('get', 'https://kktix.com/events.json')
+xhr.onload = () => {
+  console.log(xhr.responseText);
+}
+xhr.onerror = (err) => {
+  console.log(err);
+}
+xhr.send();

Fetch API ​

Fetch 是近年來號稱要取代XHR的新技術標準

js
fetch('https://kktix.com/events.json', { method: 'GET' })
+  .then(response => {
+    // 可以透過 .blob(), .json(), .text() 轉成可用的資訊
+    return response.json();
+  })
+  // 成功執行的 function
+  .then(json => {
+    console.log(json);
+  })
+  // 錯誤時執行的 function
+  .catch(error => {
+    console.log(error);
+  })
+  // 不管成功失敗都執行
+  .finally(() => {
+    console.log('final');
+  })

jQuery AJAX ​

作為 JavaScript 函式庫的 jQuery 也有自己的 AJAX 函式

js
$.ajax({
+  url: 'https://kktix.com/events.json',
+  type: 'GET',
+  // 返回的檔案格式是 json
+  dataType: 'json'
+  // 成功執行的 function
+  success: function(response) {
+    console.log(response);
+  }
+  // 錯誤時執行的 function
+  error: function(xhr, ajaxOptions, thrownError) {
+    console.log(xhr.status);
+    console.log(xhr.responseText);
+    console.log(thrownError)
+  }
+  // 不管成功或失敗都會執行
+  complete: function() {
+    console.log("完成")
+  }
+})
+
+$.ajax({
+    url: 'https://kktix.com/events.json',
+    type: 'GET',
+  })
+  // 成功執行的 function
+  .done(function(response){
+    console.log(response);
+  })
+  // 錯誤時執行的 function
+  .fail(function(error){
+    console.log(error.status);
+    console.log(error.responseText);
+  })
+  // 不管成功或失敗都會執行
+  .always(function(){
+  console.log("完成");
+  })
+
+$.get('https://kktix.com/events.json', function(response){
+  console.log(response);
+}, "json")
+
+$.get('https://kktix.com/events.json')
+  .then(function(response){
+    console.log(response);
+  }, function(error){
+    console.log(error.status);
+    console.log(error.responseText);
+  })

axios ​

axios 是最近相當熱門的 AJAX 套件，也是 Vue 官方推薦的 AJAX 套件

js
axios.get('https://kktix.com/events.json')
+  .then(response => {
+    // 成功
+    console.log(response);
+  })
+  .catch(error => {
+    // 失敗
+    console.log(error);
+  })
+  .then(() => {
+    // 不管成功失敗都執行
+    console.log('請求結束');
+  });

練習

以上面任一種方式連接 kktix API，並用表格顯示資料

`,38),e=[h];function k(t,r,E,d,c,g){return a(),i("div",null,e)}const b=s(p,[["render",k]]);export{y as __pageData,b as default}; diff --git a/assets/advanced_ajax.md.CFZo-rz0.lean.js b/assets/advanced_ajax.md.CFZo-rz0.lean.js new file mode 100644 index 00000000..aed99df4 --- /dev/null +++ b/assets/advanced_ajax.md.CFZo-rz0.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n,a7 as l}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"HTTP 請求與 AJAX","description":"","frontmatter":{},"headers":[],"relativePath":"advanced/ajax.md","filePath":"advanced/ajax.md","lastUpdated":1712681240000}'),p={name:"advanced/ajax.md"},h=n("",38),e=[h];function k(t,r,E,d,c,g){return a(),i("div",null,e)}const b=s(p,[["render",k]]);export{y as __pageData,b as default}; diff --git a/assets/app.BX1xcjKB.js b/assets/app.BX1xcjKB.js new file mode 100644 index 00000000..bc6264fb --- /dev/null +++ b/assets/app.BX1xcjKB.js @@ -0,0 +1 @@ +import{j as o,ak as p,al as u,am as l,an as c,ao as f,ap as d,aq as m,ar as h,as as A,at as g,Y as v,d as P,u as _,l as w,z as R,au as y,av as C,aw as E,ax as T}from"./chunks/framework.DWhUQBuX.js";import{R as b}from"./chunks/theme.MrCfoCxG.js";function i(e){if(e.extends){const a=i(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const s=i(b),S=P({name:"VitePressApp",setup(){const{site:e,lang:a,dir:t}=_();return w(()=>{R(()=>{document.documentElement.lang=a.value,document.documentElement.dir=t.value})}),e.value.router.prefetchLinks&&y(),C(),E(),s.setup&&s.setup(),()=>T(s.Layout)}});async function D(){globalThis.__VITEPRESS__=!0;const e=x(),a=j();a.provide(u,e);const t=l(e.route);return a.provide(c,t),a.component("Content",f),a.component("ClientOnly",d),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),s.enhanceApp&&await s.enhanceApp({app:a,router:e,siteData:m}),{app:a,router:e,data:t}}function j(){return h(S)}function x(){let e=o,a;return A(t=>{let n=g(t),r=null;return n&&(e&&(a=n),(e||a===n)&&(n=n.replace(/\.js$/,".lean.js")),r=v(()=>import(n),[])),o&&(e=!1),r},s.NotFound)}o&&D().then(({app:e,router:a,data:t})=>{a.go().then(()=>{p(a.route,t.site),e.mount("#app")})});export{D as createApp}; diff --git a/assets/basic_array-object.md.bl7hbNEI.js b/assets/basic_array-object.md.bl7hbNEI.js new file mode 100644 index 00000000..a2771ed7 --- /dev/null +++ b/assets/basic_array-object.md.bl7hbNEI.js @@ -0,0 +1,193 @@ +import{_ as p,E as h,c as k,J as i,w as a,a4 as l,o as e,a as n}from"./chunks/framework.DWhUQBuX.js";const C=JSON.parse('{"title":"陣列與物件","description":"","frontmatter":{},"headers":[],"relativePath":"basic/array-object.md","filePath":"basic/array-object.md","lastUpdated":1712681240000}'),t={name:"basic/array-object.md"},r=l(`

陣列與物件 ​

陣列是多種相似資料的集合
物件是一個東西的多種不同屬性的集合

陣列 ​

可以想像陣列是一台火車，每節車廂就是一筆資料，火車長度沒有限制

TIP

通常在命名陣列時，會用複數名詞，如 students、teachers、items 等

js
// 用陣列前
+const bendon1 = "雞排飯";
+const bendon2 = "排骨飯";
+const bendon3 = "魚排飯";
+
+// 用陣列後
+const bendons = ["雞排飯", "排骨飯", "魚排飯"];

如果把上面的陣列想像成一台火車

注意

在程式裡，陣列的索引是從 0 開始

在存取陣列資料時

js
const alphabets = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']
+
+// .length 取長度
+console.log(\`有 \${alphabets.length} 個字母<br>\`)
+
+// [索引] 取指定資料
+console.log(alphabets[0])     // a
+console.log(alphabets[1])     // b
+console.log(alphabets[1000])  // undefined
+
+// 以變數值當索引取資料
+const index = 2
+console.log(alphabets[index]) // c
+
+// 使用迴圈取得所有資料
+for (let i = 0; i < alphabets.length; i++) {
+  document.write(alphabets[i])
+}

物件 ​

物件保存了一個東西的不同種資料

js
const person = { 
+  name: "王小明",
+  age: 25,
+  number: 24
+}

如果把上面的物件想像成一個人

注意

物件無法直接使用 .length 取得長度，也不能用 [第幾個] 取得資料
但是可以用 ["索引名"] 取得某索引的資料

js
const person = { 
+    name: "王小明", 
+    age: 25, 
+    number: 24 
+}
+// 用 .key 取值
+console.log(person.name)
+// 用 ["key"] 取值
+console.log(person['name'])
+// 用變數當 key 取值
+const key = 'name'
+console.log(person[key])

解構賦值 ​

解構賦值可以把陣列或物件中的資料解開擷取成為獨立變數
相當於建立一個新變數，並設定為陣列或物件中的某個值
在解構時可以使用其餘運算子 ... 取得剩餘的資料

注意

其餘元素 ... 必須放在最後一個
[a, ...others, c] 是不正確的語法

陣列解構範例

js
const array = [1, 2, 3, 4]
+
+// 原始寫法
+const one = array[0]
+const two = array[1]
+const others = [array[2], array[3]]
+console.log(one)      // 1
+console.log(two)      // 2
+console.log(others)   // [3, 4]
+
+// 解構賦值
+// 依照順序取值
+const [one, two, ...apple] = array
+console.log(one)      // 1
+console.log(two)      // 2
+console.log(apple)    // [3, 4]

物件解構範例

js
const obj = { a: 1, b: 2, c: 3, d: 4 }
+
+// 原始寫法
+const a = obj.a
+const bbb = obj.b
+const others = { c: obj.c, d: obj.d }
+console.log(a)        // 1
+console.log(bbb)      // 2
+console.log(others)   // { c: 3, d: 4 }
+
+// 解構賦值
+// 依照 key 名稱取值，可用 : 重新命名
+const { a, b: bbb, ...others } = obj
+console.log(a)        // 1
+console.log(bbb)      // 2
+console.log(banana)   // { c: 3, d: 4 }

巢狀 ​

物件和 Array 可以依資料情況組合，儲存更複雜的資料

由物件組成的陣列範例

js
const people = [
+    { 
+        name: "小明",
+        age: 25,
+        number: 24
+    },
+    { 
+        name: "小美", 
+        age: 24, 
+        number: 25
+    }
+]

物件內值為陣列範例

js
const restaurant = {
+    name: "好好吃便當店",
+    tel: "02-21345678",
+    foods: ["雞排飯", "排骨飯", "魚排飯"]
+}
`,34),E=l(`

TIP

目前網路上給開發者使用的公開資料大多是物件和陣列的結合
所以熟悉物件和陣列的組合，對於串接 API 會有很大的幫助

可選串連 ​

當要存取的陣列索引或物件屬性可能不存在時，使用 ?. 可以避免出現錯誤

物件範例

js
const user = {
+  name: 'AAA',
+  info: {
+    email: 'aaa@gmail.com'
+  }
+}
+console.log(user.name)                // AAA
+console.log(user.info.email)          // aaa@gmail.com
+console.log(user.info.address)        // undefined
+
+// Uncaught TypeError: Cannot read properties of undefined (reading 'city')
+console.log(user.info.address.city)
+
+console.log(user.info.address?.city)            // undefined
+console.log(user.info.address?.city?.postcode)  // undefined

陣列範例

js
const restaurant = {
+  name: '好好吃便當店',
+  tel: '02-21345678',
+  menu: []
+}
+
+// Uncaught TypeError: Cannot read properties of undefined (reading 'price')
+console.log(restaurant.menu[0].price)
+
+// undefined
+console.log(restaurant.menu?.[0]?.price)

可選串連搭配短路求值範例，當資料不存在時使用預設值

js
const products = [
+  { name: 'iPhone 15', price: 48900 },
+  { 
+    name: 'Nothing Phone(2)',
+    price: 21900,
+    producer: {
+      name: 'Nothing',
+      url: 'https://tw.nothing.tech/'
+    }
+  },
+  { 
+    name: 'Nothing Phone(1)',
+    price: 14900,
+    producer: {
+      name: 'Nothing',
+      url: 'https://tw.nothing.tech/'
+    }
+  }
+]
+
+for (let i = 0; i < products.length; i++) {
+  document.write(\`
+    <p>
+      \${products[i].name}，價格為 \${products[i].price}
+      製造商為
+      <a href="\${products[i].producer?.url || '#'}">\${products[i].producer?.name || '不明'}</a>
+    </p>
+  \`)
+}

迴圈 ​

可以透過迴圈去取出陣列或物件裡的所有資料

for 迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(let i = 0; i < bendons.length; i++) {
+  console.log(i, bendons[i])
+}

for of 迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(const bendon of bendons) {
+  console.log(bendon);
+}

for in 陣列迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(const i in bendons) {
+  console.log(i, bendons[i]);
+}

for in 物件迴圈範例

js
const person = { 
+  name: "王小明", 
+  age: 25, 
+  number: 24 
+}
+for(const key in person) {
+  console.log(person[key]);
+}

傳值與傳址 ​

傳值 (Pass by value)

js
let test1 = 1
+let test2 = test1
+test2 = 100
+console.log(test1)    // 1
+console.log(test2)    // 100

傳址 (Pass by reference)

陣列傳址範例

js
const a = [1, 2, 3]
+const b = a
+b[0] = 100
+console.log(a)        // [100, 2, 3]
+console.log(b)        // [100, 2, 3]
+console.log(a === b)  // true

物件傳址範例

js
const obj1 = { 
+  a: 1,
+  b: 2,
+  c: 3
+}
+const obj2 = obj1
+obj1.a = 100
+console.log(obj1)     // {a: 100, b: 2, c: 3}
+console.log(obj2)     // {a: 100, b: 2, c: 3}

注意

在編寫時，以資料的型態決定是傳值還是傳址

陣列範例
指向的是陣列內的索引為 0 的值，而不是整個陣列
索引為 0 的值資料型態不是陣列也不是物件，所以是傳值

js
const a = [4, 5, 6]
+let b = a[0]
+b = 100
+console.log(a)        // [4, 5, 6]
+console.log(b)        // 100

物件範例
指向的是物件內的值，而不是整個物件
物件內的值是一般資料型態，所以是傳值

js
const obj1 = {
+  a: 1,
+  b: 2,
+  c: 3
+}
+const obj2 = {
+  a: obj1.a,
+  b: obj1.b,
+  c: obj1.c
+}
+obj2.a = 100
+console.log(obj1)     // {a: 1, b: 2, c: 3}
+console.log(obj2)     // {a: 100, b: 2, c: 3}

綜合練習 ​

練習

宣告一個數字陣列

js
const numbers = [33, 75, 69, 41, 50, 19]

練習

某國家發生通貨膨脹
饅頭第一天 1 元，第二天 2 元，第三天 3 元，以此類推
小明他從第一天起，連續買了 10 天的饅頭
每天買的饅頭數依序為 1, 8, 3, 4, 5, 6, 7, 2, 9, 10
求小明買饅頭花費的總金額

題目修改自 高中生程式解題系統

練習

假設某一公司有五種產品 A、B、C、D、E
其單價分別為 12、16、10、14、15 元
而該公司共有三位銷售員，他們在某個月份的銷售量如下所示

產品 A產品 B產品 C產品 D產品 E
銷售員 13332564533
銷售員 27733684523
銷售員 34355436765

請將上表的內容設定成二維陣列，並依序完成下列各題

js
const data = [
+  [33, 32, 56, 45, 33],
+  [77, 33, 68, 45, 23],
+  [43, 55, 43, 67, 65]
+]

作業

練習二維陣列
下表為某地星期一到星期四的時段一、時段二與時段三的氣溫

星期一星期二星期三星期四
時段一18.217.315.013.4
時段二23.825.120.617.8
時段三20.621.518.415.7

請將上表的內容設定成二維陣列，並依序完成下列各題

js
const data = [
+  [18.2, 17.3, 15.0, 13.4],
+  [23.8, 25.1, 20.6, 17.8],
+  [20.6, 21.5, 18.4, 15.7]
+]
`,36);function d(g,c,y,o,b,F){const s=h("ImageFigure");return e(),k("div",null,[r,i(s,{src:"/images/ch6/2array.jpg",title:"二維陣列概念",alt:"二維陣列概念"},{default:a(()=>[n("二維陣列概念，如 X 班 Y 號同學的成績")]),_:1}),i(s,{src:"/images/ch6/3array.jpg",title:"三維陣列概念",alt:"三維陣列概念"},{default:a(()=>[n("三維陣列概念，如 X 年 Y 班 Z 號同學的成績")]),_:1}),E])}const m=p(t,[["render",d]]);export{C as __pageData,m as default}; diff --git a/assets/basic_array-object.md.bl7hbNEI.lean.js b/assets/basic_array-object.md.bl7hbNEI.lean.js new file mode 100644 index 00000000..e79f4b8c --- /dev/null +++ b/assets/basic_array-object.md.bl7hbNEI.lean.js @@ -0,0 +1 @@ +import{_ as p,E as h,c as k,J as i,w as a,a4 as l,o as e,a as n}from"./chunks/framework.DWhUQBuX.js";const C=JSON.parse('{"title":"陣列與物件","description":"","frontmatter":{},"headers":[],"relativePath":"basic/array-object.md","filePath":"basic/array-object.md","lastUpdated":1712681240000}'),t={name:"basic/array-object.md"},r=l("",34),E=l("",36);function d(g,c,y,o,b,F){const s=h("ImageFigure");return e(),k("div",null,[r,i(s,{src:"/images/ch6/2array.jpg",title:"二維陣列概念",alt:"二維陣列概念"},{default:a(()=>[n("二維陣列概念，如 X 班 Y 號同學的成績")]),_:1}),i(s,{src:"/images/ch6/3array.jpg",title:"三維陣列概念",alt:"三維陣列概念"},{default:a(()=>[n("三維陣列概念，如 X 年 Y 班 Z 號同學的成績")]),_:1}),E])}const m=p(t,[["render",d]]);export{C as __pageData,m as default}; diff --git a/assets/basic_class.md.G_iOFQXA.js b/assets/basic_class.md.G_iOFQXA.js new file mode 100644 index 00000000..8e6414c5 --- /dev/null +++ b/assets/basic_class.md.G_iOFQXA.js @@ -0,0 +1,38 @@ +import{_ as n,E as l,c as p,J as i,a4 as a,o as e}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"物件導向","description":"","frontmatter":{},"headers":[],"relativePath":"basic/class.md","filePath":"basic/class.md","lastUpdated":1712681240000}'),t={name:"basic/class.md"},h=a(`

物件導向 ​

物件裡面的值除了可以是一般的文字、數字外，它的值也可以是 function
如果物件裡面包含 function 的話，就會是 物件導向 的程式設計

物件中的 function ​

js
const person = {
+  firstName: '小明',
+  lastName: '王',
+  // 物件內 function 定義方式
+  fullName: function () {
+    return this.firstName + this.lastName
+  },
+  // 物件內 function 定義方式簡寫
+  sayHi () {
+    return '你好，我是' + this.fullName()
+  },
+  // 物件內箭頭函式定義方式
+  // this 會指向 window 而不是物件
+  sayHi2: () => {
+    return '你好，我是' + this.fullName()
+  }
+}

上面的程式碼可以畫成像這樣的心智圖

`,6),k=a(`

TIP

可選串連也可以避免呼叫物件內不存在的 function 時的錯誤

js
person.sayGoodBye?.()

注意

this 在不同地方有不同意思，使用時需要特別注意
以下為瀏覽器常見的使用情況

類別 ​

類別是物件導向的基本概念，宣告一個模板後，用它來建立物件
使用 class 來宣告類別，並用 new 來建立物件

js
// 宣告類別
+class Person {
+  // constructor 是物件建立時會執行的 function
+  constructor(firstName, lastName) {
+    this.firstName = firstName
+    this.lastName = lastName
+  }
+  fullName () {
+    return this.firstName + this.lastName
+  }
+  sayHi () {
+    return '你好，我是' + this.fullName()
+  }
+}
+
+// 建立物件
+const Ming = new Person("小明", "王");
+const Mei = new Person("小美", "王");
+
+// 使用建立的物件
+document.write(Ming.sayHi())
+document.write(Mei.sayHi())
`,5);function r(d,c,o,E,g,u){const s=l("Mindmap");return e(),p("div",null,[h,i(s,{mindData:{options:{container:"mind1",theme:"primary",editable:!1},mind:{meta:{name:"mind1",author:"",version:""},format:"node_array",data:[{id:"root",isroot:!0,topic:"person","background-color":"orange"},{id:"sub1",parentid:"root",topic:"firstName"},{id:"sub2",parentid:"root",topic:"lastName"},{id:"sub3",parentid:"root",topic:"fullName","background-color":"lightseagreen"},{id:"sub4",parentid:"root",topic:"sayHi","background-color":"lightseagreen"}]}}}),k,i(s,{mindData:{options:{container:"mind2",theme:"primary",editable:!1},mind:{meta:{name:"mind2",author:"",version:""},format:"node_array",data:[{id:"root",isroot:!0,topic:"Person","background-color":"orange"},{id:"sub1",parentid:"root",direction:"right",topic:"姓"},{id:"sub2",parentid:"root",direction:"right",topic:"名"},{id:"sub3",parentid:"root",direction:"right",topic:"fullName","background-color":"lightseagreen"},{id:"sub4",parentid:"root",direction:"right",topic:"sayHi","background-color":"lightseagreen"},{id:"Ming",parentid:"root",direction:"left",topic:"Ming","background-color":"purple"},{id:"Mei",parentid:"root",direction:"left",topic:"Mei","background-color":"purple"}]}}})])}const m=n(t,[["render",r]]);export{b as __pageData,m as default}; diff --git a/assets/basic_class.md.G_iOFQXA.lean.js b/assets/basic_class.md.G_iOFQXA.lean.js new file mode 100644 index 00000000..4219b609 --- /dev/null +++ b/assets/basic_class.md.G_iOFQXA.lean.js @@ -0,0 +1 @@ +import{_ as n,E as l,c as p,J as i,a4 as a,o as e}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"物件導向","description":"","frontmatter":{},"headers":[],"relativePath":"basic/class.md","filePath":"basic/class.md","lastUpdated":1712681240000}'),t={name:"basic/class.md"},h=a("",6),k=a("",5);function r(d,c,o,E,g,u){const s=l("Mindmap");return e(),p("div",null,[h,i(s,{mindData:{options:{container:"mind1",theme:"primary",editable:!1},mind:{meta:{name:"mind1",author:"",version:""},format:"node_array",data:[{id:"root",isroot:!0,topic:"person","background-color":"orange"},{id:"sub1",parentid:"root",topic:"firstName"},{id:"sub2",parentid:"root",topic:"lastName"},{id:"sub3",parentid:"root",topic:"fullName","background-color":"lightseagreen"},{id:"sub4",parentid:"root",topic:"sayHi","background-color":"lightseagreen"}]}}}),k,i(s,{mindData:{options:{container:"mind2",theme:"primary",editable:!1},mind:{meta:{name:"mind2",author:"",version:""},format:"node_array",data:[{id:"root",isroot:!0,topic:"Person","background-color":"orange"},{id:"sub1",parentid:"root",direction:"right",topic:"姓"},{id:"sub2",parentid:"root",direction:"right",topic:"名"},{id:"sub3",parentid:"root",direction:"right",topic:"fullName","background-color":"lightseagreen"},{id:"sub4",parentid:"root",direction:"right",topic:"sayHi","background-color":"lightseagreen"},{id:"Ming",parentid:"root",direction:"left",topic:"Ming","background-color":"purple"},{id:"Mei",parentid:"root",direction:"left",topic:"Mei","background-color":"purple"}]}}})])}const m=n(t,[["render",r]]);export{b as __pageData,m as default}; diff --git a/assets/basic_condition.md.B_N2xuXU.js b/assets/basic_condition.md.B_N2xuXU.js new file mode 100644 index 00000000..21f768e0 --- /dev/null +++ b/assets/basic_condition.md.B_N2xuXU.js @@ -0,0 +1,222 @@ +import{_ as p,E as n,c as h,J as i,w as e,a4 as s,o as k,a as t}from"./chunks/framework.DWhUQBuX.js";const D=JSON.parse('{"title":"邏輯判斷式","description":"","frontmatter":{},"headers":[],"relativePath":"basic/condition.md","filePath":"basic/condition.md","lastUpdated":1712681240000}'),r={name:"basic/condition.md"},E=s(`

邏輯判斷式 ​

邏輯判斷式是程式運作不可或缺的部分，它可以讓程式根據不同的情況去執行不同的程式碼

認識語法 ​

當中文句型為

如果 ( 條件 ) { 條件成立時的動作 } 否則 { 條件不成立時的動作 }

如果 ( 外面下雨 ) { 在家裡待著電影 } 否則 { 出門和爬山 }

翻譯成程式就是

js
if (條件) {
+  條件成立時的程式碼
+} else {
+  條件不成立時的程式碼
+}
js
if (外面下雨) {
+  在家裡待著電影
+} else {
+  出門
+  去爬山
+}

TIP

當判斷式後的 {} 內只有一行程式碼時，可以省略 {}

js
if (條件) 執行程式碼
+else  執行程式碼

上面的範例可以寫成

js
if (外面下雨) 在家裡待著電影
+else {
+  出門
+  去爬山
+}

else 和中文 否則 一樣是非必要的

如果 ( 可以決定交作業時間 ) { 我希望永遠不必交 }

js
if (可以決定交作業時間) {
+  我希望永遠不必交
+}

比較運算子 ​

比較運算子是用來比較兩個值的大小
運算的結果會是布林值 true 或 false

注意

請注意符號的擺放位置，例如 a >= b 不能寫成 a => b
=> 代表 function 的箭頭函式，不是比較運算子

符號說明
a == ba 等於 b
a === ba 等於 b （資料型態也要相同）
a != ba 不等於 b
a <> ba 不等於 b
a !== ba 不等於 b （資料型態也不相等）
a > ba 大於 b （數值判斷）
a ＜ ba 小於 b （數值判斷）
a >= ba 大於 b 或是 a 等於 b
a <= ba 小於等於 b 或是 a 等於 b

數字大小比較範例

js
const a = 10, b = 20
+if (a > b) {
+  console.log('a 大於 b')
+} else {
+  console.log('a 不大於 b')
+}

資料型態比較範例

js
const a = 100, b = '100'
+if (a == b) {
+  console.log('a == b')
+} else {
+  console.log('a != b')
+}
+if (a === b) {
+  console.log('a === b')
+} else {
+  console.log('a !== b')
+}

若判斷的是布林值，可以直接用 if(變數) 來判斷

js
const ok = false
+// if (ok) --> if (ok === true)
+if (ok) {
+  console.log('ok')
+}
+// if (!ok) --> if (ok === false)
+if (!ok) {
+  console.log('not ok')
+}

邏輯運算子 ​

邏輯運算子是用來組合多個比較運算子的結果
運算的結果會是布林值 true 或 false

符號說明舉例
a && ba 與 b ，必須符合兩者如果颱風天沒颳風也沒下雨，我就去看電影
a || ba 或 b，符合其中一個A: 晚餐吃什麼？ B: 便當或麵都可以
!a否定、相反A: 你假日想做什麼事？ B: 除了練習程式外，其他都可以

&& 範例

js
const rain = false, wind = true
+if (!rain && !wind) console.log('看電影')
+else                console.log('在家發呆')

|| 範例

js
const dinner = '便當'
+if (dinner === '炸雞' || dinner === '可樂') {
+  console.log('好耶')
+} else {
+  console.log('不好耶')
+}

相反式範例

js
!(a==b)
+!(a>b)
+!(a>=b)
+!(a<b)

三元運算子 ​

如果是 2 選 1 的判斷式，可以運用三元運算子，節省程式碼文字

`,35),d=s(`

語法規則為

條件 ? 成立時執行的程式 : 否定時執行的程式

js
const like = confirm('你喜歡 JavaScript 嗎')
+
+// 使用三元運算子前
+if (message) {
+  console.log('喜歡')
+} else {
+  console.log('不喜歡')
+}
+
+// 使用三元運算子後，將結果放在變數
+const message = like ? '喜歡' : '不喜歡'
+console.log(message)
+
+// 使用三元運算子後，直接印出結果
+console.log(like ? '喜歡' : '不喜歡')

多條件式 ​

當條件有多筆需要判斷時，你可以用 () 組合判斷式

js
const coding = confirm('你會寫 code 嗎')
+const game = confirm('你有玩原神嗎')
+const player = confirm('你是可莉玩家嗎')
+if ((game && player) || coding) {
+  console.log('酷欸')
+} else {
+  console.log('加油')
+}

判斷式條件的延伸 ​

前面的判斷式，都是 2 選 1
但很多時候，遇到 3 選 1 、4 選 1 或更多的時候，就需要用到 else if

`,8),g=s(`

程式寫法範例

if( 條件一 ) { 符合時執行程式碼 }
else if ( 條件二 ) { 符合時執行程式碼 }
else if ( 條件三 ) { 符合時執行程式碼 }
else { 以上都不符合時執行程式碼 }

成績標準範例

if ( 成績 >= 95 ) { 你的成績是 S 級 }
else if ( 成績 >= 90 ) { 你的成績是 A 級 }
else if ( 成績 >= 80 ) { 你的成績是 B 級 }
else { 你的成績是 C 級 }

年齡分級判斷範例，編寫的時候要注意判斷順序

js
const age = prompt('請輸入年齡')
+
+// 錯誤的判斷寫法，永遠都是普遍級
+if (age >= 0) {
+  document.write('普遍級')
+} else if (age >= 6) {
+  document.write('保護級')
+} else if (age >= 12) {
+  document.write('輔12級')
+} else if (age >= 15) {
+  document.write('輔15級')
+} else if (age >= 18) {
+  document.write('限制級')
+}
+
+// 正確寫法
+if (age >= 18) {
+    document.write('限制級')
+} else if (age >= 15) {
+    document.write('輔15級')
+} else if (age >= 12) {
+    document.write('輔12級')
+} else if (age >= 6) {
+    document.write('保護級')
+} else if (age >= 0) {
+    document.write('普遍級')
+}

練習

使用 prompt() 製作一個選擇題

switch case ​

switch 是另一種判斷式，可以用來判斷多個條件
執行時會將 () 內的變數值，和 case 後面的值做比較

語言判斷，使用 if 寫法

js
if (lang === 'zh-tw') {
+  document.write('台灣中文')
+} else if (lang === 'ja-jp') {
+  document.write('日本日文')
+} else if (lang === 'en-us' || lang === 'en') {
+  document.write('英文')
+} else {
+  document.write('窩不知道')
+}

語言判斷，使用三元運算子寫法

js
const message = 
+  lang === 'zh-tw' ? '台灣中文' : 
+  lang === 'ja-jp' ? '日本日文' :
+  (lang === 'en-us' || lang === 'en') ? '英文' : '窩不知道'
+document.write(message)

語言判斷，使用 switch 寫法

js
switch (lang) {
+  case 'zh-tw':
+    document.write('台灣中文')
+    break
+  case 'jp':
+    document.write('日本')
+  case 'ja-jp':
+    document.write('日本日文')
+    break
+  case 'en-us':
+  case 'en':
+    document.write('英文')
+    break
+  default:
+    document.write('窩不知道')
+    break
+}

年齡分級判斷範例

js
const age = 18
+// 不能寫 switch (age)，只能寫 switch (true)
+// 當寫 switch(age) 時
+// age === (age >= 18)
+// 18 === (18 >= 18)
+// 18 === true
+// false
+switch (true) {
+  case (age >= 18):
+    document.write('限制級')
+    break
+  case (age >= 15):
+    document.write('輔15級')
+    break
+  case (age >= 12):
+    document.write('輔12級')
+    break
+  case (age >= 16):
+    document.write('保護級')
+    break
+  case (age >= 0):
+    document.write('普遍級')
+    break
+}

巢狀判斷式 ​

判斷式裡面還可以再使用判斷式，做更詳細的判斷

`,20),c=s(`
js
const weather = 'rain'
+const umbrella = false
+
+if (weather === 'rain') {
+  if (umbrella) {
+    document.write('下雨，有傘，沒事')
+  } else {
+    document.write('下雨，沒傘，有事')
+  }
+} else {
+  document.write('沒下雨，沒差')
+}

短路求值 ​

邏輯運算子也可以用在賦值

以下為 Boolean() 判斷為 false 的狀況

|| 使用範例

js
const x = null || 0 || undefined || 123 || 'abc' || 'dfgd' || false
+console.log(x)

&& 使用範例

js
const y = 'abc' && 123 && 456 && false && 'def' && undefined
+console.log(y)

?? 使用範例

js
const z = undefined ?? null ?? false ?? 'abc' ?? 123 ?? 456 ?? false ?? 'def'
+console.log(z)

實際應用範例

js
// 使用短路求值前，需要判斷變數是否有值
+let name = prompt('請輸入名字')
+if (name === '' || name === null) {
+  name = '路人'
+}
+
+// 使用短路求值後
+const name = prompt('請輸入名字') || '路人'
+console.log(name)

綜合練習 ​

使用判斷式製作問答題

js
let score = 0
+
+const ans1 = confirm('鳳梨是食物嗎')
+if (ans1) {
+    score += 10
+    alert('答對了')
+} else {
+    alert('答錯了')
+}
+
+const ans2 = confirm('披薩是食物嗎')
+if (ans2) {
+    score += 10
+    alert('答對了')
+} else {
+    alert('答錯了')
+}
+
+const ans3 = confirm('鳳梨披薩是食物嗎')
+if (ans3) {
+    score = 0
+    document.write('你輸了')
+} else {
+    score += 10
+    document.write(\`恭喜過關，你得了 \${score} 分\`)
+}

練習

製作一個星座判斷器，進入網頁時出現三個輸入視窗，分別是姓名、出生月份和出生日期
輸入完成後跳出訊息，格式為 OOO 你好，你的星座是 OOO 座

作業

自己設計 5 道題目問答題或選擇題，遊戲結束後會顯示得分

`,19);function y(F,o,b,u,m,C){const l=n("ImageFigure"),a=n("FlowChart");return k(),h("div",null,[E,i(l,{src:"/images/ch4/meme.jpg",title:"三元運算子",alt:"三元運算子"},{default:e(()=>[t("三元運算子")]),_:1}),d,i(a,{id:"flowchart_64a567ec",code:`st=>start: 開始 +cond1=>condition: if +cond2=>condition: else if +cond3=>condition: else if +cond4=>condition: else +e=>end: 結果 +process1=>operation: 執行區塊內程式碼 +process2=>operation: 執行區塊內程式碼 +process3=>operation: 執行區塊內程式碼 +process4=>operation: 執行區塊內程式碼 + +st->cond1 +cond1(yes)->process1->e +cond1(no)->cond2 +cond2(yes)->process2->e +cond2(no)->cond3 +cond3(yes)->process3->e +cond3(no)->cond4 +cond4(yes)->process4->e`,preset:"vue"}),g,i(a,{id:"flowchart_64a5612c",code:`st=>start: 開始 +cond1=>condition: if +e=>end: 結果 +process1=>operation: 執行 else 程式碼 +process11=>operation: 判斷式1 +process12=>operation: 判斷式2 +process13=>operation: 判斷式3 +st->cond1 +cond1(yes)->process11->process12->process13->e +cond1(no)->process1->e`,preset:"vue"}),c])}const B=p(r,[["render",y]]);export{D as __pageData,B as default}; diff --git a/assets/basic_condition.md.B_N2xuXU.lean.js b/assets/basic_condition.md.B_N2xuXU.lean.js new file mode 100644 index 00000000..3fdcdc9f --- /dev/null +++ b/assets/basic_condition.md.B_N2xuXU.lean.js @@ -0,0 +1,28 @@ +import{_ as p,E as n,c as h,J as i,w as e,a4 as s,o as k,a as t}from"./chunks/framework.DWhUQBuX.js";const D=JSON.parse('{"title":"邏輯判斷式","description":"","frontmatter":{},"headers":[],"relativePath":"basic/condition.md","filePath":"basic/condition.md","lastUpdated":1712681240000}'),r={name:"basic/condition.md"},E=s("",35),d=s("",8),g=s("",20),c=s("",19);function y(F,o,b,u,m,C){const l=n("ImageFigure"),a=n("FlowChart");return k(),h("div",null,[E,i(l,{src:"/images/ch4/meme.jpg",title:"三元運算子",alt:"三元運算子"},{default:e(()=>[t("三元運算子")]),_:1}),d,i(a,{id:"flowchart_64a567ec",code:`st=>start: 開始 +cond1=>condition: if +cond2=>condition: else if +cond3=>condition: else if +cond4=>condition: else +e=>end: 結果 +process1=>operation: 執行區塊內程式碼 +process2=>operation: 執行區塊內程式碼 +process3=>operation: 執行區塊內程式碼 +process4=>operation: 執行區塊內程式碼 + +st->cond1 +cond1(yes)->process1->e +cond1(no)->cond2 +cond2(yes)->process2->e +cond2(no)->cond3 +cond3(yes)->process3->e +cond3(no)->cond4 +cond4(yes)->process4->e`,preset:"vue"}),g,i(a,{id:"flowchart_64a5612c",code:`st=>start: 開始 +cond1=>condition: if +e=>end: 結果 +process1=>operation: 執行 else 程式碼 +process11=>operation: 判斷式1 +process12=>operation: 判斷式2 +process13=>operation: 判斷式3 +st->cond1 +cond1(yes)->process11->process12->process13->e +cond1(no)->process1->e`,preset:"vue"}),c])}const B=p(r,[["render",y]]);export{D as __pageData,B as default}; diff --git a/assets/basic_data-array.md.BwHwx0Os.js b/assets/basic_data-array.md.BwHwx0Os.js new file mode 100644 index 00000000..478fdd38 --- /dev/null +++ b/assets/basic_data-array.md.BwHwx0Os.js @@ -0,0 +1,136 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const c=JSON.parse('{"title":"資料處理 - 陣列","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-array.md","filePath":"basic/data-array.md","lastUpdated":1712681240000}'),l={name:"basic/data-array.md"},h=n(`

資料處理 - 陣列 ​

一些常用的陣列處理函式

基本處理 ​

注意

當參數為 function 時，需要注意變數型態

js
const func = (value) => {
+  console.log(value)
+}
+
+// 正確，func 是 function
+array.forEach(func)
+// 錯誤，func() 是 function 的回傳值
+// 會立即執行 func()，並將回傳值放入 setTimeout
+// 但 func() 沒有回傳值，所以會放入 undefined
+array.forEach(func())

.forEach() 範例

js
const numbers = [1, 2, 3, 4, 5]
+
+// .forEach() 使用匿名函式
+numbers.forEach((value, index, array) => {
+  console.log(value, index, array)
+})
+
+// .forEach() 使用已定義的函式
+const each = (value, index, array) => {
+  console.log(value, index, array)
+}
+numbers.forEach(each)

.join() 範例

js
const numbers = [1, 2, 3, 4, 5]
+console.log(numbers.join('-'))  // 1-2-3-4-5

增加、刪除範例

js
const fruits = ['蘋果', '香蕉', '西瓜']
+
+fruits.push('橘子')
+// ['蘋果', '香蕉', '西瓜', '橘子']
+console.log(fruits)
+
+fruits.push('葡萄', '藍莓')
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓']
+console.log(fruits)
+
+const fruits2 = ['草莓', '芭樂', '柳丁']
+fruits.push(...fruits2)
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '柳丁']
+console.log(fruits)
+
+fruits.unshift('榴槤')
+// ['榴槤', '蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '柳丁']
+console.log(fruits)
+
+const lastFruit = fruits.pop()
+console.log(lastFruit)  // 柳丁
+// ['榴槤', '蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(fruits)     
+
+const firstFruit = fruits.shift()
+console.log(firstFruit) // 榴槤
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(fruits)
+
+const otherFruits = ['櫻桃', '火龍果']
+fruits.splice(1, 2, ...otherFruits)
+// ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(otherFruits)
+
+const newFruits = phones.slice(1, 5)
+// newFruits = ['櫻桃', '火龍果', '橘子', '葡萄']
+// fruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(newFruits, fruits)
+
+const concatFruits = fruits.concat(['荔枝', '龍眼'])
+// concatFruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '荔枝', '龍眼']
+// fruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(concatFruits, fruits)
+
+fruits.reverse()
+// ['芭樂', '草莓', '藍莓', '葡萄', '橘子', '火龍果', '櫻桃', '蘋果']
+console.log(fruits)

尋找與取代 ​

注意

js
const arr = [{ a: 1 }]
+console.log(arr.includes({ a: 1 }))           // false
+const obj = { b: 2 }
+const arr2 = [obj]
+console.log(arr2.includes(obj))               // true
js
const numbers = [100, 200, 300, 400, 500]
+console.log(numbers.includes(200))            // true
+console.log(numbers.indexOf(100, 2))          // -1
+console.log(numbers.lastIndexOf(100, 2))      // 0
+
+const some = numbers.some((value) => {
+  return value > 300
+})
+console.log(some)                             // true
+
+const every = numbers.every((value) => {
+  return value > 300
+})
+console.log('every', every)                   // false
+
+const find = numbers.find((value) => {
+  return value > 300
+})
+console.log('find', find)                     // 400
+
+const findLast = numbers.findLast((value) => {
+  return value > 300
+})
+console.log('findLast', findLast)             // 500
+
+const findIndex = numbers.findIndex((value) => {
+  return value > 300
+})
+console.log('findIndex', findIndex)           // 3
+
+const findLastIndex = numbers.findLastIndex((value) => {
+  return value > 300
+})
+console.log('findLastIndex', findLastIndex)   // 4
+
+const filter = numbers.filter((value) => {
+  return value > 300
+})
+console.log(filter)                           // [400, 500]

其他 ​

js
const numbers1 = [100, 200, 300]
+const numbers1Double = numbers1.map(value => {
+  return value * 2
+})
+console.log(numbers1Double)  // [200, 400, 600]
+
+const numbers2 = [100, 200, 300, 400, 500]
+const numbers2Total = numbers2.reduce((total, value) => {
+  console.log(total, value)
+  return total + value
+})
+console.log(numbers2Total)  //  1500
+
+const numbers3 = [100, 1561, 154613, 1231, 564635, 15641310]
+numbers3.sort((a, b) => {
+  console.log(a, b)
+  return a - b
+})
+console.log(numbers3)       // [100, 1231, 1561, 154613, 564635, 15641310]
+
+const cn = ['零', '一', '二', '三', '四', '五']
+cn.sort((a, b) => a.localeCompare(b))
+console.log(cn)             // ['一', '三', '二', '五', '四', '零']
+
+const en = ['aaa', 'bbb', 'zzz', 'ccc', 'fff', 'ddd']
+en.sort((a, b) => a.localeCompare(b))
+console.log(en)             // ['aaa', 'bbb', 'ccc', 'ddd', 'fff', 'zzz']

綜合練習 ​

練習

將 prompt() 輸入的文字移除前後空白後倒過來後顯示在網頁上

挑戰

將 prompt() 輸入的英文文字大寫轉小寫，小寫轉大寫後顯示在網頁上

`,21),p=[h];function k(t,e,r,E,d,g){return a(),i("div",null,p)}const F=s(l,[["render",k]]);export{c as __pageData,F as default}; diff --git a/assets/basic_data-array.md.BwHwx0Os.lean.js b/assets/basic_data-array.md.BwHwx0Os.lean.js new file mode 100644 index 00000000..681b80b1 --- /dev/null +++ b/assets/basic_data-array.md.BwHwx0Os.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const c=JSON.parse('{"title":"資料處理 - 陣列","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-array.md","filePath":"basic/data-array.md","lastUpdated":1712681240000}'),l={name:"basic/data-array.md"},h=n("",21),p=[h];function k(t,e,r,E,d,g){return a(),i("div",null,p)}const F=s(l,[["render",k]]);export{c as __pageData,F as default}; diff --git a/assets/basic_data-number.md.CqG8J3Z_.js b/assets/basic_data-number.md.CqG8J3Z_.js new file mode 100644 index 00000000..f4fedd60 --- /dev/null +++ b/assets/basic_data-number.md.CqG8J3Z_.js @@ -0,0 +1,28 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"資料處理 - 數字","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-number.md","filePath":"basic/data-number.md","lastUpdated":1712681240000}'),l={name:"basic/data-number.md"},h=n(`

資料處理 - 數字 ​

數字處理相關語法

語法 ​

數字處理使用 Math 語法，提供了許多數學運算功能

js
Math.round(4.7)   // 5
+
+Math.ceil(4.4)    // 5
+
+Math.floor(4.8)   // 4
+
+Math.pow(8, 2)    // 64
+
+Math.sqrt(64)     // 8
+
+Math.sign(-100)   // -1
+
+Math.abs(-5)      // 5
+
+Math.min(0, 150, 30, 20, -8, -200)  // -200
+
+Math.max(0, 150, 30, 20, -8, -200)  // 150
+
+Math.random()     // 0.123456789

TIP

取陣列的最大值與最小值可以利用 ... 展開運算子

js
const arr = [0, 150, 30, 20, -8, -200]
+Math.min(...arr)  // -200
+Math.max(...arr)  // 150

綜合練習 ​

練習

從 0 到 100 隨機取一個整數

練習

製作隨機數字 function，提供最小整數和最大整數，回傳一個區間內的隨機整數

js
const rand = (min, max) => {
+  // 程式碼...
+}

作業

用上面練習完成的 function 製作威力彩號碼產生器
將隨機出的數字用 document.write() 顯示在網頁上
威力彩規則

練習

請寫一個 function，判斷傳入的數字是不是質數
並使用該 function 列出 1 ~ 100 間的所有質數
質數特性

挑戰

文文記性不太好，常常會忘東忘西。他也常忘記提款卡密碼，每次忘記密碼都得帶著身份證、存摺、印章親自到銀行去重設密碼，還得繳交 50 元的手續費，很是麻煩。後來他決定把密碼寫在提款卡上免得忘記，但是這樣一來，萬一提款卡掉了，存款就會被盜領。因此他決定以一個只有他看得懂的方式把密碼寫下來。

他的密碼有 6 位數，所以他寫下了 7 個大寫字母，相鄰的每兩個字母間的「距離」就依序代表密碼中的一位數。所謂「距離」指的是從較「小」的字母要數幾個字母才能數到較「大」字母。字母的大小則是依其順序而定，越後面的字母越「大」。

假設文文所寫的 7 個字母是 POKEMON，那麼密碼的第一位數就是字母 P 和 O 的「距離」，由於 P 就是 O 的下一個字母，因此，從 O 開始只要往下數一個字母就是 P 了，所以密碼的第一位數就是 1。密碼的第二位數則是字母 O 和 K 的「距離」，從 K 開始，往下數 4 個字母 (L, M, N, O) 就到了 O，所以第二位數是 4，以此類推。因此，POKEMON 所代表的密碼便是 146821。

噓！你千萬別把這個密秘告訴別人哦，要不然文文的存款就不保了。

文文可以透過 prompt 輸入文字 輸入文字後就將解密後的密碼回傳

js
const decrypt = (text) => {
+  // ... 在此寫你的程式碼
+}
+
+const input = prompt('輸入文字')
+console.log(decrypt(input))

測試資料

輸入輸出
POKEMON146821
TYPHOON598701

題目修改自 高中生程式解題系統

`,13),p=[h];function t(k,e,r,d,E,c){return a(),i("div",null,p)}const o=s(l,[["render",t]]);export{y as __pageData,o as default}; diff --git a/assets/basic_data-number.md.CqG8J3Z_.lean.js b/assets/basic_data-number.md.CqG8J3Z_.lean.js new file mode 100644 index 00000000..74b52401 --- /dev/null +++ b/assets/basic_data-number.md.CqG8J3Z_.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"資料處理 - 數字","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-number.md","filePath":"basic/data-number.md","lastUpdated":1712681240000}'),l={name:"basic/data-number.md"},h=n("",13),p=[h];function t(k,e,r,d,E,c){return a(),i("div",null,p)}const o=s(l,[["render",t]]);export{y as __pageData,o as default}; diff --git a/assets/basic_data-string.md.8cpA1SNA.js b/assets/basic_data-string.md.8cpA1SNA.js new file mode 100644 index 00000000..eeaea5a5 --- /dev/null +++ b/assets/basic_data-string.md.8cpA1SNA.js @@ -0,0 +1,106 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"資料處理 - 文字","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-string.md","filePath":"basic/data-string.md","lastUpdated":1712681240000}'),l={name:"basic/data-string.md"},p=n(`

資料處理 - 文字 ​

各種處理文字的語法

基本處理 ​

TIP

JavaScript 可以串連多個語法

js
const text = '  123 Abc Def GHI Jkl   '
+const result = text.trim().toUpperCase().toLowerCase()
+console.log(result)        // '123 abc def ghi jkl'
js
let text = '  123 Abc Def GHI Jkl   '
+console.log(text)           // '  123 Abc Def GHI Jkl   '
+
+text = text.trim()
+console.log(text)           // '123 Abc Def GHI Jkl'
+
+text = text.toUpperCase()
+console.log(text)           // '123 ABC DEF GHI JKL'
+
+text = text.toLowerCase()
+console.log(text)           // '123 abc def ghi jkl'

尋找與取代 ​

正則表達式語法參考:

注意

js
const curry = '外賣 咖哩拌飯 咖哩烏冬'
+
+const includesCurry1 = text2.includes('咖哩')
+console.log(includesCurry)    // true
+const includesCurry2 = text2.includes('咖哩', 3)
+console.log(includesCurry2)   // false
+
+const indexCurry = text2.indexOf('咖哩')
+console.log(indexCurry)       // 3
+
+const lastIndexCurry = text2.lastIndexOf('咖哩')
+console.log(lastIndexCurry)   // 9
+
+const matchCurry = text2.match(/咖哩/g)
+console.log(matchCurry)       // [ '咖哩', '咖哩' ]
+
+const matchAllCurry = text2.matchAll(/咖哩/g)
+console.log(matchAllCurry)    // RegExpStringIterator
+for (const match of matchAllCurry) {
+  // [ 
+  //   '咖哩',
+  //   index: 3,
+  //   input: '外賣 咖哩拌飯 咖哩烏冬',
+  //   groups: undefined
+  // ]
+  console.log(match)
+}
+
+const replaceCurry1 = text2.replace('咖哩', '三色豆')
+console.log(replaceCurry1)      // '外賣 三色豆拌飯 咖哩烏冬'
+
+const replaceCurry2 = text2.replace(/咖哩/g, '三色豆')
+console.log(replaceCurry2)      // '外賣 三色豆拌飯 三色豆烏冬'
+
+const email = 'aaaa@gmail.com'
+const emailMatch = email.match(/^[0-9a-z]+@[0-9a-z]+\\.[0-9a-z]+$/g)
+console.log(emailMatch)         // ['aaaa@gmail.com']
+
+const emailRegexGroup = /^([0-9a-z]+)@([0-9a-z]+)\\.([0-9a-z]+)$/g
+const emailMatchAllGroup = email.matchAll(emailRegexGroup)
+for (const match of emailMatchAllGroup) {
+  // 0: "aaaa@gmail.com"
+  // 1: "aaaa"
+  // 2: "gmail"
+  // 3: "com"
+  // groups: undefined
+  // index: 0
+  console.log(match)
+}
+
+const emailReplaceGroup = email.replace(emailRegexGroup, '帳號是 $1，網域是 $2.$3')
+console.log(emailReplaceGroup)  // '帳號是 aaaa，網域是 gmail.com'
+
+const emailRegexGroup2 = /^(?<account>[0-9a-z]+)@(?<domain>[0-9a-z]+)\\.(?<tld>[0-9a-z]+)$/g
+const emailMatchAllGroup2 = email.matchAll(emailRegexGroup2)
+for (const match of emailMatchAllGroup2) {
+  // 0: "aaaa@gmail.com"
+  // 1: "aaaa"
+  // 2: "gmail"
+  // 3: "com"
+  // groups: {
+  //   account: "aaa",
+  //   domain: "gmail",
+  //   tld: "com"
+  // }
+  // index: 0
+  console.log(match)
+}
+
+const emailReplaceGroup2 = email.replace(emailRegexGroup2, '帳號是 $<account>，網域是 $<domain>.$<tld>')
+console.log(emailReplaceGroup2)   // '帳號是 aaaa，網域是 gmail.com'

切割 ​

js
const text3 = 'abcdefg'
+
+console.log(text3.substr(3, 1))     // d
+
+console.log(text3.substr(3))        // defg
+
+// text3.substr(-3, 2)
+// text3.length = 7
+// -3 => 7 - 3 => 4
+// text3.substr(4, 2)
+console.log(text3.substr(-3, 2))    // ef
+
+console.log(text3.substring(2, 6))  // cdef
+
+console.log(text3.slice(2, 6))      // cdef
+
+// text3.slice(-4, -2)
+// text3.length = 7
+// -4 => 7 - 4 => 3
+// -2 => 7 - 2 => 5
+// text3.slice(3, 5)
+console.log(text3.slice(-4, -2))    // de

資料型態轉換 ​

綜合練習 ​

練習

將兩個 prompt() 輸入的數字相加顯示在網頁上，如果輸入的不是數字，跳出錯誤訊息

挑戰

製作凱薩密碼 (Caesar Cipher) 加密工具
使用者先輸入英文明文，再輸入數字密鑰
請編寫一個 function 處理資料
將明文和密鑰傳入，回傳處理完後的密文
最後在網頁上顯示出來

範例:

密鑰: 3
+明文: meet me after the toga party
+密文: PHHW PH DIWHU WKH WRJD SDUWB

提示:

`,19),h=[p];function k(e,t,r,d,E,g){return a(),i("div",null,h)}const F=s(l,[["render",k]]);export{y as __pageData,F as default}; diff --git a/assets/basic_data-string.md.8cpA1SNA.lean.js b/assets/basic_data-string.md.8cpA1SNA.lean.js new file mode 100644 index 00000000..10e3ef2d --- /dev/null +++ b/assets/basic_data-string.md.8cpA1SNA.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const y=JSON.parse('{"title":"資料處理 - 文字","description":"","frontmatter":{},"headers":[],"relativePath":"basic/data-string.md","filePath":"basic/data-string.md","lastUpdated":1712681240000}'),l={name:"basic/data-string.md"},p=n("",19),h=[p];function k(e,t,r,d,E,g){return a(),i("div",null,h)}const F=s(l,[["render",k]]);export{y as __pageData,F as default}; diff --git a/assets/basic_function.md.BuLdGG0n.js b/assets/basic_function.md.BuLdGG0n.js new file mode 100644 index 00000000..9d91ac62 --- /dev/null +++ b/assets/basic_function.md.BuLdGG0n.js @@ -0,0 +1,170 @@ +import{_ as i,c as a,o as n,a4 as s,m as l}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"function","description":"","frontmatter":{},"headers":[],"relativePath":"basic/function.md","filePath":"basic/function.md","lastUpdated":1712681240000}'),p={name:"basic/function.md"},h=s(`

function ​

function 可以將一段程式碼包裝起來，可以重複使用，也方便維護，寫成物件更可以將程式碼分類。

語法 ​

function 由下列幾個部分組成

TIP

使用 function expression 宣告時通常會使用 const 以避免 function 被覆寫

js
// 使用 function declartaion 宣告 function
+function GoodMorning () {
+  document.write('早上好，現在我有冰淇淋')
+}
+
+// 使用 function expression 宣告 function
+const GoodMorning = function () {
+  document.write('早上好，現在我有冰淇淋')
+}
+
+// 執行 function
+GoodMorning()

傳入資料 ​

將資料傳入 function 可以讓 function 有更多的彈性

注意

function 處理資料時盡量不要使用外部的變數，只針對傳入的資料做處理
這種不會影響到外部的資料的 function 叫做 Pure Function

js
function GoodMorning (time, item) {
+  console.log(arguments)
+  document.write(\`\${time}好，現在我有\${item}\`)
+}
+GoodMorning('早上', '冰淇淋')
+GoodMorning('中午', '桂格超大便當')
+GoodMorning('晚上')

參數可以設定預設值，當參數沒有收到傳入值時，就會使用預設值

js
function GoodMorning (time = '早上', item = '冰淇淋') {
+  document.write(\`\${time}好，現在我有\${item}\`)
+}
+GoodMorning('早上', '冰淇淋')
+GoodMorning('中午', '桂格超大便當')
+GoodMorning('晚上')
+GoodMorning(undefined, '炸雞排')

return ​

return 可以將程式處理完畢的結果傳出，讓 function 更有彈性

注意

js
function GoodMorning (time = '早上', item = '冰淇淋') {
+  return \`\${time}好，現在我有\${item}\`
+  // return 下面的程式碼不會執行
+  console.log(123)
+}
+
+const text = GoodMorning('早上', '冰淇淋')
+console.log(text)
+
+document.write(GoodMorning('中午', '桂格超大便當'))
+alert(GoodMorning('晚上', '雞排珍奶'))

箭頭函式 ​

箭頭函式可以將 function 的宣告寫得比較簡短

js
const GoodMorning = (time = '早上', item = '冰淇淋') => {
+  return \`\${time}好，現在我有\${item}\`
+}

TIP

簡寫範例

js
// 簡寫前
+const squre = (number) => {
+  return number * number
+}
+
+// 簡寫後
+const squre = number => number * number

物件回傳簡寫範例

js
// 簡寫前
+const getUserData = () => {
+  return { name: 'John', age: 18 }
+}
+
+// 簡寫後
+const getUserData = () => ({ name: 'John', age: 18 })

注意

箭頭函式無法使用 arguments 取得所有傳入的參數

js
const GoodMorning = (time = '早上', item = '冰淇淋') => {
+  // Uncaught ReferenceError: arguments is not defined
+  console.log(arguments)
+}

jsDoc ​

使用 jsDoc 格式編寫的 function 註解會有編輯器提示

js
/**
+ * 早安
+ */
+const GoodMorning = () => {}
+
+/**
+ * 早安
+ * @param time 時間
+ * @param item 物品
+ */
+const GoodMorning = (time, item) => {}
+
+/**
+ * 早安
+ * @param time {string} 時間
+ * @param item {string} 物品
+ */
+const GoodMorning = (time, item) => {}
+
+/**
+ * 早安
+ * @param [time=早上] {string} 時間
+ * @param [item=冰淇淋] {string} 物品
+ */
+const GoodMorning = (time = '早上', item = '冰淇淋') => {}
+
+/**
+ * 早安
+ * @param [time=早上] {string} 時間
+ * @param [item=冰淇淋] {string} 物品
+ * @returns {string} 組合完成的訊息
+ */
+const GoodMorning = (time = '早上', item = '冰淇淋') => {}

綜合練習 ​

練習

編寫一個 function，可以判斷傳入的數字是不是偶數，是的話回傳 true，不是則回傳 false

練習

小明喜歡數數
某天媽媽請他從 n 開始數，下一個數字是 n+1，再下一個數字是 n+2，以此類推
媽媽想知道，小明數了多少個數字後，數過的數字總和會超過 m

請寫一個程式，使用者可以用 prompt 輸入 n 和 m
請將兩個數字傳入 function 計算後將結果回傳

js
const calculate = (n, m) => {
+  // ... 在此寫你的程式碼
+}
+
+const number1 = parseInt(prompt('n'))
+const number2 = parseInt(prompt('m'))
+console.log(calculate(number1, number2))

測試資料

nm輸出
153
5102
100100010

題目修改自 高中生程式解題系統

練習

製作易經數字卦占卜程式
使用者輸入三個數字後，將數字以陣列方式傳進 function
並將處理後的上卦名、下卦名、變爻用陣列回傳

數字卦占卜方式：

範例：

範例程式碼

js
const gua = (array) => {
+  // ... 在此寫你的程式碼
+}
+
+const number1 = parseInt(prompt('第一個數字'))
+const number2 = parseInt(prompt('第二個數字'))
+const number3 = parseInt(prompt('第三個數字'))
+const numbers = [number1, number2, number3]
+const result = gua(numbers)
+console.log(result[0]) // 輸出 離
+console.log(result[1]) // 輸出 震
+console.log(result[2]) // 輸出 2

練習

請寫一個 function 判斷輸入的文字是不是正著讀和反著讀都一樣的迴文
for、for of 和 for in 可以迴圈文字

js
const isPalindrome = (text) => {
+  // ... 在此寫你的程式碼
+}
+const result = isPalindrome(prompt('輸入文字'))
+console.log(result)

測試資料

文字輸出
abbatrue
abcdfalse
abcbatrue

練習

請寫一個 function 判斷輸入的文字括號是否閉合

js
const isClose = (text) => {
+  // ... 在此寫你的程式碼
+}
+const result = isClose(prompt('輸入文字'))
+console.log(result)

測試資料

文字輸出
(()false
()true
(())true
(()))false
)()()false

遞迴 ​

使用遞迴函式是在函式中呼叫函式自己來重複執行動作

累加範例，求 1 + 2 + 3 + ... + n 的總和

js
// n = 5
+// sum(5) = 5 + sum(5 - 1) = 5 + sum(4) = 5 + 4 + 3 + 2 + 1 = 15
+// sum(4) = 4 + sum(4 - 1) = 4 + sum(3) = 4 + 3 + 2 + 1
+// sum(3) = 3 + sum(3 - 1) = 3 + sum(2) = 3 + 2 + 1
+// sum(2) = 2 + sum(2 - 1) = 2 + sum(1) = 2 + 1
+// sum(1) = 1
+const sum = n => {
+  if (n === 1) {
+    return 1
+  } else {
+    return n + sum(n - 1)
+  }
+  // return n === 1 ? 1 : n + sum(n - 1)
+}
+console.log(sum(5))

計算費氏數列的第 n 個數字
0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233

js
const fibonacci = (n) => {
+  if (n < 2) {
+    return n
+  } else {
+    return fibonacci(n - 1) + fibonacci(n - 2)
+  }
+}
+// n   = 0 1 2 3 4 5 6
+// 數字 = 0 1 1 2 3 5 8
+// fib(3) = fib(3 - 1) + fib(3 - 2) = fib(2) + fib(1) = 1 + 1 = 2
+// fib(2) = fib(2 - 1) + fib(2 - 2) = fib(1) + fib(0) = 1 + 0 = 1
+// fib(1) = 1
+// fib(0) = 0
+console.log(fibonacci(3))

以輾轉相除法求最大公因數

js
const gcd = (a, b) => {
+  if (a % b === 0) {
+    return b
+  } else {
+    return gcd(b, a % b)
+  }
+}
+// gcd(2002, 847) => a % b = 2002 % 847 = 308 => 308 != 0 => gcd(847, 308)
+// gcd(847, 308) => a % b = 847 % 308 = 231 => 231 != 0 => gcd(308, 231)
+// gcd(308, 231) => a % b = 308 % 231 = 77 => 77 != 0 => gcd(231, 77)
+// gcd(231, 77) => a % b = 231 % 77 = 0 => 77
+console.log(gcd(2002, 847))
`,40),k=l("iframe",{width:"560",height:"315",src:"https://www.youtube.com/embed/kCooBR9xwUE?t=176",frameborder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowfullscreen:""},null,-1),t=s(`

var 區域 ​

var 其實是以 function 為區域的區域變數

js
var a = 1
+a = 100
+var a = 2
+console.log(a)          // 2
+
+var b = 1
+function func () {
+  var b = 2
+  console.log('in', b)  // 2
+}
+func()
+console.log('out', b)   // 1

提升 ​

var 和 function 有提升的特性，宣告的變數會被提升到最上面，可以先使用再宣告變數

直接使用一個未宣告也未賦值的變數會出現錯誤

js
// Uncaught ReferenceError: text is not defined
+console.log(text)

在宣告 let 和 const 變數前使用變數會出現錯誤

js
// Uncaught ReferenceError: Cannot access 'text' before initialization
+console.log(text)
+const text = 'abc'

var 宣告的變數會被提升到最上面，但是不會賦值，所以會是 undefined

js
console.log(text)   // undefined
+var text = 'abc'

function declartaion 會被提升

js
hi('AAA')
+function hi (name) {
+  console.log('hi, ' + name)
+}

使用 var 的 function expression 會被提升，但是不會賦值，所以會是 undefined

js
// function expression
+console.log(hi)  // undefined
+// Uncaught TypeError: hi2 is not a function
+// hi('BBB')
+var hi = function (name) {
+  console.log('hi, ' + name)
+}
`,15),e=[h,k,t];function r(d,E,g,c,y,o){return n(),a("div",null,e)}const u=i(p,[["render",r]]);export{b as __pageData,u as default}; diff --git a/assets/basic_function.md.BuLdGG0n.lean.js b/assets/basic_function.md.BuLdGG0n.lean.js new file mode 100644 index 00000000..48c28a3f --- /dev/null +++ b/assets/basic_function.md.BuLdGG0n.lean.js @@ -0,0 +1 @@ +import{_ as i,c as a,o as n,a4 as s,m as l}from"./chunks/framework.DWhUQBuX.js";const b=JSON.parse('{"title":"function","description":"","frontmatter":{},"headers":[],"relativePath":"basic/function.md","filePath":"basic/function.md","lastUpdated":1712681240000}'),p={name:"basic/function.md"},h=s("",40),k=l("iframe",{width:"560",height:"315",src:"https://www.youtube.com/embed/kCooBR9xwUE?t=176",frameborder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowfullscreen:""},null,-1),t=s("",15),e=[h,k,t];function r(d,E,g,c,y,o){return n(),a("div",null,e)}const u=i(p,[["render",r]]);export{b as __pageData,u as default}; diff --git a/assets/basic_intro.md.BvLRp6WR.js b/assets/basic_intro.md.BvLRp6WR.js new file mode 100644 index 00000000..9a9f52da --- /dev/null +++ b/assets/basic_intro.md.BvLRp6WR.js @@ -0,0 +1,54 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const o=JSON.parse('{"title":"認識 JavaScript","description":"","frontmatter":{},"headers":[],"relativePath":"basic/intro.md","filePath":"basic/intro.md","lastUpdated":1712681240000}'),l={name:"basic/intro.md"},t=n(`

認識 JavaScript ​

JavaScript 是網頁開發者必學的三種語言之一，也是最流行的腳本語言

前端功能 ​

改變 HTML 內容範例

改變 HTML 屬性範例

改變 CSS 樣式範例

偵測使用者操作範例

後端功能 ​

其他功能 ​

缺點 ​

前端的使用方式 ​

網頁上的 JavaScript 程式碼必須要搭配 <script> 標籤使用

注意

載入時機錯誤可能會導致程式無效
例如在使用抓取網站元素的程式碼時，如果程式在網頁內容解析前執行，會找不到元素而出錯
所以通常會將程式碼放在 <body> 結尾標籤前面，確保網頁內容已經解析完畢

html
<html>
+   <head> </head>
+   <body>
+     <!-- 你的 HTML 網頁內容 -->
+     <h1>標題</h1>
+     <p>文字文字文字</p>
+     <!-- 你的 JavaScript 應該放在這裡 -->
+     <script>
+       // alert() 可以跳出一個警告訊息視窗，括號裡面放的是訊息文字
+       alert("Hello World!");
+     </script>
+   </body>
+</html>
`,23),h=[t];function p(e,k,E,r,d,g){return a(),i("div",null,h)}const y=s(l,[["render",p]]);export{o as __pageData,y as default}; diff --git a/assets/basic_intro.md.BvLRp6WR.lean.js b/assets/basic_intro.md.BvLRp6WR.lean.js new file mode 100644 index 00000000..8cba94fb --- /dev/null +++ b/assets/basic_intro.md.BvLRp6WR.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const o=JSON.parse('{"title":"認識 JavaScript","description":"","frontmatter":{},"headers":[],"relativePath":"basic/intro.md","filePath":"basic/intro.md","lastUpdated":1712681240000}'),l={name:"basic/intro.md"},t=n("",23),h=[t];function p(e,k,E,r,d,g){return a(),i("div",null,h)}const y=s(l,[["render",p]]);export{o as __pageData,y as default}; diff --git a/assets/basic_loop.md.tHwRw1NA.js b/assets/basic_loop.md.tHwRw1NA.js new file mode 100644 index 00000000..49319b75 --- /dev/null +++ b/assets/basic_loop.md.tHwRw1NA.js @@ -0,0 +1,98 @@ +import{_ as h,E as l,c as t,J as s,w as p,a4 as i,o as k,a as e}from"./chunks/framework.DWhUQBuX.js";const D=JSON.parse('{"title":"迴圈","description":"","frontmatter":{},"headers":[],"relativePath":"basic/loop.md","filePath":"basic/loop.md","lastUpdated":1712681240000}'),r={name:"basic/loop.md"},d=i('

迴圈 ​

迴圈則可以讓程式重複的執行一樣的動作，達到指定條件才會結束
常用的迴圈有 for 、 while 和 do while 三種
我們需要依照程式的情況來選擇使用不同的迴圈

for ​

for 迴圈通常會用在有固定執行次數的迴圈

',4),c=i(`

迴圈的程式寫法如下面範例

js
for(let i = start; i < max; i = i + 1) {
+	// code
+}
+
+// i=i+1 可以簡寫成 i++
+for(let i = start; i < max; i++) {
+	// code
+}

() 內宣告了迴圈執行的三種動作，以 ; 分隔

js
for(let i = 0; i < 10; i++) {
+  document.write(i)
+}

TIP

當回圈內的 {} 只有一行程式碼時，可以省略 {}

js
for(let i = 0; i < 10; i++) document.write(i)

練習

試試看自己寫一個迴圈，輸出這四個數字: 1, 4, 7, 10

挑戰

在網頁上產生一排 52 個顏色漸變的 ★，第一個星的顏色為 rgb(0,0,255)，最後一個 ★ 色碼為 rgb(255,0,0)，綠色值都是0

巢狀 for ​

如果 for 迴圈裡面又有一個 for 迴圈，可以處理更複雜的二維資料

練習

製作一個九九乘法表

while ​

這種迴圈結構較簡單，只有一個執行條件
先判斷是否符合條件，符合的話才執行程式碼，執行後後再判斷要不要執行下一次
用於不確定執行次數的迴圈

`,13),E=i(`

下面這個範例，使用者輸入 end 才會結束

js
let input = ''
+let count = 0
+while (input !== '123') {
+  input = prompt('123')
+  count++
+}
+document.write(\`輸入了\${count}次\`)

do while ​

do while 迴圈其實就只是把 while 迴圈倒過來寫
先執行程式碼後才判斷要不要執行下一次

`,4),o=i(`
js
let input = ''
+let count = 0
+do {
+  input = prompt('123')
+  count++
+} while (input !== '123')

比較 ​

`,3),g=i(`

break 與 continue ​

js
// 當 i 等於 5 時，跳過這次迴圈
+for(let i = 0; i < 10; i++) {
+  if(i === 5) {
+    continue;
+  }
+  document.write(i);
+}
js
for (let i = 1; i < 10; i++) {
+  if (i === 5) break
+  document.write(i + '<br>')
+}

注意

多層迴圈時，break 與 continue 只會影響出現語法的那層迴圈
需要對迴圈命名，才能控制到指定的迴圈

js
for (let i = 1; i <= 5; i++) {
+  for (let j = 1; j <= 5; j++) {
+    // 多層迴圈時 continue 只會影響出現語法的那層迴圈
+    // continue 會直接跳到 j++ 後進下一次 j 迴圈
+    if (i === 2) continue
+    document.write(\`\${i}x\${j}=\${i*j}<br>\`)
+  }
+}
+
+// 將外層迴圈命名為 loop1
+// 將內層迴圈命名為 loop2
+loop1: for (let i = 1; i <= 5; i++) {
+  loop2: for (let j = 1; j <= 5; j++) {
+    // 指定對 loop1 迴圈 continue
+    // continue 會直接跳到 i++ 後進下一次 i 迴圈
+    if (i === 2) continue loop1
+    console.log(\`\${i}, \${j}\`)
+  }
+}

綜合練習 ​

練習

試試看自己寫一個猜數字遊戲，並加入太大、太小等提示訊息

練習

一球從 100 公尺高度自由落下，每次落地後反跳回原高度的一半再落下，請問

練習

印星星塔，結構如下圖
使用者能用 prompt() 輸入星星塔層數

★
+★★
+★★★
+★★★★
+★★★★★

練習

印星星塔，結構如下圖
使用者能用 prompt() 輸入星星塔層數

☆☆☆☆★☆☆☆☆
+☆☆☆★★★☆☆☆
+☆☆★★★★★☆☆
+☆★★★★★★★☆
+★★★★★★★★★

練習

有四個數字，分別為 1、2、3、4
請使用這四個數字組成數字不重複的三位數

1 2 3
+1 2 4
+1 3 2
+1 3 4
+1 4 2
+1 4 3
+...

練習

使用者能用 prompt() 輸入層數
印出下面格式的數字圖案

1
+2 4
+3 6 9
+4 8 12 16
+5 10 15 20 25
+6 12 18 24 30 36
+7 14 21 28 35 42 49
+8 16 24 32 40 48 56 64
+9 18 27 36 45 54 63 72 81

作業

使用者可以輸入西元年、月、日，三個 prompt()
顯示使用者輸入的是該年的第幾天

挑戰

使用者能用 prompt() 輸入一個數字
印出到該數字的費氏數列

js
// 如果輸入 22
+0 1 1 2 3 5 8 13 21
`,14);function b(y,u,F,m,C,v){const a=l("FlowChart"),n=l("ImageFigure");return k(),t("div",null,[d,s(a,{id:"flowchart_382ee147",code:`st=>start: 開始 +start=>operation: i = 初始值 +cond=>condition: 符合執行條件 +code=>inputoutput: 執行 +plus=>operation: i++ +e=>end: 結束 + +st->start +start->cond +cond(yes)->code->plus +plus(left)->cond +cond(no)->e`,preset:"vue"}),c,s(n,{src:"/images/ch5/while_alive.png",alt:"while 迴圈範例",title:"while 迴圈範例"},{default:p(()=>[e("while 迴圈範例")]),_:1}),s(a,{id:"flowchart_382ee222",code:`st=>start: 開始 +cond=>condition: 檢查條件 +code=>inputoutput: 執行 +e=>end: 結束 + +st->cond +cond(yes)->code +code(left)->cond +cond(no)->e`,preset:"vue"}),E,s(a,{id:"flowchart_382ee242",code:`st=>start: 開始 +cond=>condition: 檢查條件 +code=>inputoutput: 執行 +e=>end: 結束 + +st->code +code->cond +cond(yes)->code +cond(no, left)->e`,preset:"vue"}),o,s(n,{src:"/images/ch5/while.jpg",alt:"while 與 do while 差異",title:"while 與 do while 差異"},{default:p(()=>[e("while 與 do while 差異")]),_:1}),g])}const _=h(r,[["render",b]]);export{D as __pageData,_ as default}; diff --git a/assets/basic_loop.md.tHwRw1NA.lean.js b/assets/basic_loop.md.tHwRw1NA.lean.js new file mode 100644 index 00000000..6f83b79e --- /dev/null +++ b/assets/basic_loop.md.tHwRw1NA.lean.js @@ -0,0 +1,28 @@ +import{_ as h,E as l,c as t,J as s,w as p,a4 as i,o as k,a as e}from"./chunks/framework.DWhUQBuX.js";const D=JSON.parse('{"title":"迴圈","description":"","frontmatter":{},"headers":[],"relativePath":"basic/loop.md","filePath":"basic/loop.md","lastUpdated":1712681240000}'),r={name:"basic/loop.md"},d=i("",4),c=i("",13),E=i("",4),o=i("",3),g=i("",14);function b(y,u,F,m,C,v){const a=l("FlowChart"),n=l("ImageFigure");return k(),t("div",null,[d,s(a,{id:"flowchart_382ee147",code:`st=>start: 開始 +start=>operation: i = 初始值 +cond=>condition: 符合執行條件 +code=>inputoutput: 執行 +plus=>operation: i++ +e=>end: 結束 + +st->start +start->cond +cond(yes)->code->plus +plus(left)->cond +cond(no)->e`,preset:"vue"}),c,s(n,{src:"/images/ch5/while_alive.png",alt:"while 迴圈範例",title:"while 迴圈範例"},{default:p(()=>[e("while 迴圈範例")]),_:1}),s(a,{id:"flowchart_382ee222",code:`st=>start: 開始 +cond=>condition: 檢查條件 +code=>inputoutput: 執行 +e=>end: 結束 + +st->cond +cond(yes)->code +code(left)->cond +cond(no)->e`,preset:"vue"}),E,s(a,{id:"flowchart_382ee242",code:`st=>start: 開始 +cond=>condition: 檢查條件 +code=>inputoutput: 執行 +e=>end: 結束 + +st->code +code->cond +cond(yes)->code +cond(no, left)->e`,preset:"vue"}),o,s(n,{src:"/images/ch5/while.jpg",alt:"while 與 do while 差異",title:"while 與 do while 差異"},{default:p(()=>[e("while 與 do while 差異")]),_:1}),g])}const _=h(r,[["render",b]]);export{D as __pageData,_ as default}; diff --git a/assets/basic_operator.md.jbTUCSlW.js b/assets/basic_operator.md.jbTUCSlW.js new file mode 100644 index 00000000..4ef96a38 --- /dev/null +++ b/assets/basic_operator.md.jbTUCSlW.js @@ -0,0 +1,21 @@ +import{_ as a,E as i,c as e,J as l,w as n,a4 as s,o as p,a as d}from"./chunks/framework.DWhUQBuX.js";const f=JSON.parse('{"title":"運算子","description":"","frontmatter":{},"headers":[],"relativePath":"basic/operator.md","filePath":"basic/operator.md","lastUpdated":1712681240000}'),h={name:"basic/operator.md"},r=s(`

運算子 ​

運算子用來做加減乘除等運算 需要特別注意 + 除了做數學運算外，還可以做文字連接

數學運算子 ​

這個表列出了常見的數學運算子
跟數學的四則運算一樣，先乘除後加減，先做的用 () 包起來

符號說明範例
+加號25 + 5 = 30
-減號25 - 5 = 20
*乘號10 * 20 = 200
/除號20 / 2 = 10
%餘數56 % 3 = 2

+ 和 - 還可以減寫成 ++ 和 --，代表加一和減一，稱為 遞增 和 遞減
不過會根據變數和運算子的位置而有不同的結果

符號範例結果
a++let a = 0, b = 10; a = b++;a = 10; b = 11
++alet a = 0, b = 10; a = ++b;a = 11; b = 11
a--let a = 0, b = 10; a = b--;a = 10; b = 9
--alet a = 0, b = 10; a = --b;a = 9; b = 9

a = b++ 代表先執行 a = b，才執行 b = b + 1
a = ++b 代表先執行 b = b + 1，才執行 a=b
b-- 和 --b 也是一樣的運作方式

js
let x = 100
+
+// 這行將數字加 10 後，沒有做任何事
+x + 10
+
+// 這行將數字加 10 後，將結果存回 x
+x = x + 10
+
+console.log(x)  // 110

指派運算子 ​

這個表列出了常見的指派運算子，用來簡化 = 的寫法

符號範例原寫法
+=x += 2x = x + 2
-=x -= 2x = x - 2
*=x *= 2x = x * 2
/=x /= 2x = x / 2
%=x %= 2x = x % 2
js
let x = 100
+x %= 7
+console.log("100 除以 7 的餘數是 " + x)   // 2

文字連接 ​

在 JavaScript 裡的 + 還有文字連接的功能

`,15),k=s(`

TIP

\` 引號裡面的文字不只可以換行，還可以搭配 \${} 插入變數
就可以避免一堆 + 和單雙引號造成閱讀困難

js
const firstName = "小明"
+const lastName = "王"
+
+// 使用 + 將文字連接起來
+const fullName = firstName + lastName
+
+// 使用 + 連接文字及變數
+const hello1 = "你好，我的名字是" + fullName + "請多指教"
+
+// 使用模板語法在文字中插入變數
+const Hello2 = \`你好，我的名字是\${fullName}請多指教\`
`,2);function c(o,g,y,b,x,u){const t=i("ImageFigure");return p(),e("div",null,[r,l(t,{src:"/images/ch3/meme.png",alt:"+ 號運算子",title:"+ 號運算子"},{default:n(()=>[d("+ 號運算子")]),_:1}),k])}const F=a(h,[["render",c]]);export{f as __pageData,F as default}; diff --git a/assets/basic_operator.md.jbTUCSlW.lean.js b/assets/basic_operator.md.jbTUCSlW.lean.js new file mode 100644 index 00000000..c7028da5 --- /dev/null +++ b/assets/basic_operator.md.jbTUCSlW.lean.js @@ -0,0 +1 @@ +import{_ as a,E as i,c as e,J as l,w as n,a4 as s,o as p,a as d}from"./chunks/framework.DWhUQBuX.js";const f=JSON.parse('{"title":"運算子","description":"","frontmatter":{},"headers":[],"relativePath":"basic/operator.md","filePath":"basic/operator.md","lastUpdated":1712681240000}'),h={name:"basic/operator.md"},r=s("",15),k=s("",2);function c(o,g,y,b,x,u){const t=i("ImageFigure");return p(),e("div",null,[r,l(t,{src:"/images/ch3/meme.png",alt:"+ 號運算子",title:"+ 號運算子"},{default:n(()=>[d("+ 號運算子")]),_:1}),k])}const F=a(h,[["render",c]]);export{f as __pageData,F as default}; diff --git a/assets/basic_timer.md.DTrbeSUS.js b/assets/basic_timer.md.DTrbeSUS.js new file mode 100644 index 00000000..a955866d --- /dev/null +++ b/assets/basic_timer.md.DTrbeSUS.js @@ -0,0 +1,30 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const o=JSON.parse('{"title":"計時器","description":"","frontmatter":{},"headers":[],"relativePath":"basic/timer.md","filePath":"basic/timer.md","lastUpdated":1712681240000}'),l={name:"basic/timer.md"},e=n(`

計時器 ​

計時器可在一段時間後執行 function

一般計時器 ​

setTimeout 延遲一段時間後執行一次 function 內的程式碼

注意

在使用已定義好的 function 時，需要注意變數型態

js
const msg = () => {
+  alert('經過 5 秒囉')
+}
+
+// 正確，msg 是 function
+setTimeout(msg, 5000)
+
+// 錯誤，msg() 是 function 的回傳值
+// 會立即執行 msg()，並將回傳值放入 setTimeout
+// 但 msg() 沒有回傳值，所以會放入 undefined
+setTimeout(msg(), 5000)

使用已定義好的 function

js
const msg = () => {
+  alert('經過 5 秒囉')
+}
+setTimeout(msg, 5000)

使用匿名函式

js
setTimeout(()=> {
+  alert('經過 5 秒囉')
+}, 5000)

清除計時器範例

js
const delay = setTimeout(() => {
+  alert('經過 5 秒囉')
+}, 5000)
+clearTimeout(delay)

Tip

在寫秒數時要特別注意，一些特別的數字可以用 const 定義
讓讀程式碼的人更容易了解你在寫什麼

js
// 86400000 代表什麼？
+setTimeout(() => {}, 86400000)
+
+// 86400000 是一天的毫秒數
+const MILLISECONDS_IN_A_DAY = 86400000
+setTimeout(() => {}, MILLISECONDS_IN_A_DAY)

重複計時器 ​

setInterval() 可以每隔一段時間執行指定的程式碼
基本語法和 setTimeout() 一樣，使用 clearInterval() 清除

js
const timer = setInterval(() => {
+  console.log('Hi')
+}, 1000)
+
+setTimeout(() => {
+  clearInterval(timer)
+}, 5000)

綜合練習 ​

練習

使用者輸入毫秒數，經過該時間後在網頁上顯示 時間到

練習

製作計時器，從 10 開始倒數到 0，每秒在網頁上印出一個數字

`,19),p=[e];function t(h,k,r,d,c,E){return a(),i("div",null,p)}const u=s(l,[["render",t]]);export{o as __pageData,u as default}; diff --git a/assets/basic_timer.md.DTrbeSUS.lean.js b/assets/basic_timer.md.DTrbeSUS.lean.js new file mode 100644 index 00000000..e33891a6 --- /dev/null +++ b/assets/basic_timer.md.DTrbeSUS.lean.js @@ -0,0 +1 @@ +import{_ as s,c as i,o as a,a4 as n}from"./chunks/framework.DWhUQBuX.js";const o=JSON.parse('{"title":"計時器","description":"","frontmatter":{},"headers":[],"relativePath":"basic/timer.md","filePath":"basic/timer.md","lastUpdated":1712681240000}'),l={name:"basic/timer.md"},e=n("",19),p=[e];function t(h,k,r,d,c,E){return a(),i("div",null,p)}const u=s(l,[["render",t]]);export{o as __pageData,u as default}; diff --git a/assets/basic_variable.md.B2Hzm79v.js b/assets/basic_variable.md.B2Hzm79v.js new file mode 100644 index 00000000..d7ccf4c0 --- /dev/null +++ b/assets/basic_variable.md.B2Hzm79v.js @@ -0,0 +1,65 @@ +import{_ as e,E as p,c as t,J as i,w as a,a4 as l,o as h,a as n,m as k}from"./chunks/framework.DWhUQBuX.js";const C=JSON.parse('{"title":"變數","description":"","frontmatter":{},"headers":[],"relativePath":"basic/variable.md","filePath":"basic/variable.md","lastUpdated":1712681240000}'),r={name:"basic/variable.md"},d=l(`

變數 ​

程式就像數學的代數一樣，需要給每個資料一個名字
不管是哪一種程式語言，都會需要用 變數 給資料一個名字

變數觀念 ​

在一元一次方程式或一元二次方程式等代數中，會使用字母儲存數值
而在程式裡，我們會給資料一個名字，這些代數被稱為 變數

數學代數範例

若 x＝2，則 5 × x＝ ?

轉換為程式後

js
const x = 5
+const result = x * 5
+console.log(result)

變數命名 ​

基本變數命名規則

變數命名規範參考:

`,14),c=k("a",{href:"https://www.sololearn.com/",target:"_blank"},"SoloLearn",-1),o=l(`

變數宣告 ​

在 JavaScript 裡，有三種變數宣告方式
變數宣告後，用 = 賦值或修改值

注意

不宣告變數會變成全域變數，在瀏覽器會被綁在 window 上，不推薦這樣使用

js
a = 1
+console.log(a)          // 1
+console.log(window.a)   // 1

var 變數宣告範例

js
var a = 1
+console.log(a)          // 1
+// 需要改值時不需要重複宣告，用 = 修改
+a = 2
+console.log(a)          // 2
+var a = 3
+console.log(a)          // 3

let 變數宣告範例

js
// let 區域變數
+// 區域內不能重複宣告，{} 為一區
+let b = 1
+console.log(b)          // 1
+// 重複宣告會出現錯誤
+// Uncaught SyntaxError: Identifier 'a' has already been declared
+// let b = 2
+b = 2
+console.log(b)          // 2

const 常數宣告範例

js
// const 區域常數
+// 區域內不能重複宣告，{} 為一區
+// 宣告後不能修改
+const c = 1
+console.log(c)
+// 修改會出現錯誤
+// Uncaught TypeError: Assignment to constant variable.
+// c = 2

let 與 const 以 {} 為一個區域
在存取變數時，會先找目前區域的變數，找不到再往上找全域變數

js
let a = 1
+{
+  let a = 2
+  console.log(a)        // 2
+}
+console.log(a)          // 1
+
+let b = 1
+{
+  b = 2
+  console.log(b)        // 2
+}
+console.log(b)          // 2

資料型態 ​

在程式語言裡的值都有資料型態，最基本的型態有下面幾種

注意

' 和 " 內的文字不能換行，只有 \` 可以

js
// 文字需用引號包起來
+const str1 = "文字"
+const str2 = '文字'
+const str3 = \`文字\`
+// \` 內的文字可以換行
+const str4 = \`aa
+aa\`
+
+// 數字
+const int = 123
+const float = 123.456
+
+// 布林值
+const bool = true
+
+// 使用 typeof 查看變數的資料型態
+console.log(typeof int)
`,17);function E(g,y,b,u,F,A){const s=p("ImageFigure");return h(),t("div",null,[d,i(s,{src:"/images/ch2/reserved.png"},{default:a(()=>[n(" 變數保留字，圖片取自 "),c]),_:1}),o,i(s,{src:"/images/ch2/datatype.jpg",alt:"資料型態分別",title:"資料型態分別"},{default:a(()=>[n(" 資料型態分別 ")]),_:1})])}const D=e(r,[["render",E]]);export{C as __pageData,D as default}; diff --git a/assets/basic_variable.md.B2Hzm79v.lean.js b/assets/basic_variable.md.B2Hzm79v.lean.js new file mode 100644 index 00000000..565baf3a --- /dev/null +++ b/assets/basic_variable.md.B2Hzm79v.lean.js @@ -0,0 +1 @@ +import{_ as e,E as p,c as t,J as i,w as a,a4 as l,o as h,a as n,m as k}from"./chunks/framework.DWhUQBuX.js";const C=JSON.parse('{"title":"變數","description":"","frontmatter":{},"headers":[],"relativePath":"basic/variable.md","filePath":"basic/variable.md","lastUpdated":1712681240000}'),r={name:"basic/variable.md"},d=l("",14),c=k("a",{href:"https://www.sololearn.com/",target:"_blank"},"SoloLearn",-1),o=l("",17);function E(g,y,b,u,F,A){const s=p("ImageFigure");return h(),t("div",null,[d,i(s,{src:"/images/ch2/reserved.png"},{default:a(()=>[n(" 變數保留字，圖片取自 "),c]),_:1}),o,i(s,{src:"/images/ch2/datatype.jpg",alt:"資料型態分別",title:"資料型態分別"},{default:a(()=>[n(" 資料型態分別 ")]),_:1})])}const D=e(r,[["render",E]]);export{C as __pageData,D as default}; diff --git a/assets/ch12/meow.mp3 b/assets/ch12/meow.mp3 new file mode 100644 index 00000000..2899b376 Binary files /dev/null and b/assets/ch12/meow.mp3 differ diff --git a/assets/ch26/uml.pdf b/assets/ch26/uml.pdf new file mode 100644 index 00000000..e9c57281 Binary files /dev/null and b/assets/ch26/uml.pdf differ diff --git a/assets/ch26/uml.pptx b/assets/ch26/uml.pptx new file mode 100644 index 00000000..89b4a994 Binary files /dev/null and b/assets/ch26/uml.pptx differ diff --git a/assets/chunks/@localSearchIndexroot.J6Gtuf3s.js b/assets/chunks/@localSearchIndexroot.J6Gtuf3s.js new file mode 100644 index 00000000..706c91f2 --- /dev/null +++ b/assets/chunks/@localSearchIndexroot.J6Gtuf3s.js @@ -0,0 +1 @@ +const t='{"documentCount":272,"nextId":272,"documentIds":{"0":"/F2E-book/advanced/advanced.html#進階-javascript-語法","1":"/F2E-book/advanced/advanced.html#try-catch","2":"/F2E-book/advanced/advanced.html#避免出現錯誤訊息","3":"/F2E-book/advanced/advanced.html#流程控制","4":"/F2E-book/advanced/advanced.html#promise","5":"/F2E-book/advanced/advanced.html#async-await","6":"/F2E-book/advanced/ajax.html#http-請求與-ajax","7":"/F2E-book/advanced/ajax.html#http-請求","8":"/F2E-book/advanced/ajax.html#request-line","9":"/F2E-book/advanced/ajax.html#status-line","10":"/F2E-book/advanced/ajax.html#header","11":"/F2E-book/advanced/ajax.html#body","12":"/F2E-book/advanced/ajax.html#ajax","13":"/F2E-book/advanced/ajax.html#xmlhttprequest","14":"/F2E-book/advanced/ajax.html#fetch-api","15":"/F2E-book/advanced/ajax.html#jquery-ajax","16":"/F2E-book/advanced/ajax.html#axios","17":"/F2E-book/basic/array-object.html#陣列與物件","18":"/F2E-book/basic/array-object.html#陣列","19":"/F2E-book/basic/array-object.html#物件","20":"/F2E-book/basic/array-object.html#解構賦值","21":"/F2E-book/basic/array-object.html#巢狀","22":"/F2E-book/basic/array-object.html#可選串連","23":"/F2E-book/basic/array-object.html#迴圈","24":"/F2E-book/basic/array-object.html#傳值與傳址","25":"/F2E-book/basic/array-object.html#綜合練習","26":"/F2E-book/basic/class.html#物件導向","27":"/F2E-book/basic/class.html#物件中的-function","28":"/F2E-book/basic/class.html#類別","29":"/F2E-book/basic/condition.html#邏輯判斷式","30":"/F2E-book/basic/condition.html#認識語法","31":"/F2E-book/basic/condition.html#比較運算子","32":"/F2E-book/basic/condition.html#邏輯運算子","33":"/F2E-book/basic/condition.html#三元運算子","34":"/F2E-book/basic/condition.html#多條件式","35":"/F2E-book/basic/condition.html#判斷式條件的延伸","36":"/F2E-book/basic/condition.html#switch-case","37":"/F2E-book/basic/condition.html#巢狀判斷式","38":"/F2E-book/basic/condition.html#短路求值","39":"/F2E-book/basic/condition.html#綜合練習","40":"/F2E-book/basic/data-array.html#資料處理-陣列","41":"/F2E-book/basic/data-array.html#基本處理","42":"/F2E-book/basic/data-array.html#尋找與取代","43":"/F2E-book/basic/data-array.html#其他","44":"/F2E-book/basic/data-array.html#綜合練習","45":"/F2E-book/basic/data-number.html#資料處理-數字","46":"/F2E-book/basic/data-number.html#語法","47":"/F2E-book/basic/data-number.html#綜合練習","48":"/F2E-book/basic/data-string.html#資料處理-文字","49":"/F2E-book/basic/data-string.html#基本處理","50":"/F2E-book/basic/data-string.html#尋找與取代","51":"/F2E-book/basic/data-string.html#切割","52":"/F2E-book/basic/data-string.html#資料型態轉換","53":"/F2E-book/basic/data-string.html#綜合練習","54":"/F2E-book/basic/function.html#function","55":"/F2E-book/basic/function.html#語法","56":"/F2E-book/basic/function.html#傳入資料","57":"/F2E-book/basic/function.html#return","58":"/F2E-book/basic/function.html#箭頭函式","59":"/F2E-book/basic/function.html#jsdoc","60":"/F2E-book/basic/function.html#綜合練習","61":"/F2E-book/basic/function.html#遞迴","62":"/F2E-book/basic/function.html#var-區域","63":"/F2E-book/basic/function.html#提升","64":"/F2E-book/basic/intro.html#認識-javascript","65":"/F2E-book/basic/intro.html#前端功能","66":"/F2E-book/basic/intro.html#後端功能","67":"/F2E-book/basic/intro.html#其他功能","68":"/F2E-book/basic/intro.html#缺點","69":"/F2E-book/basic/intro.html#前端的使用方式","70":"/F2E-book/basic/loop.html#迴圈","71":"/F2E-book/basic/loop.html#for","72":"/F2E-book/basic/loop.html#巢狀-for","73":"/F2E-book/basic/loop.html#while","74":"/F2E-book/basic/loop.html#do-while","75":"/F2E-book/basic/loop.html#比較","76":"/F2E-book/basic/loop.html#break-與-continue","77":"/F2E-book/basic/loop.html#綜合練習","78":"/F2E-book/basic/operator.html#運算子","79":"/F2E-book/basic/operator.html#數學運算子","80":"/F2E-book/basic/operator.html#指派運算子","81":"/F2E-book/basic/operator.html#文字連接","82":"/F2E-book/basic/timer.html#計時器","83":"/F2E-book/basic/timer.html#一般計時器","84":"/F2E-book/basic/timer.html#重複計時器","85":"/F2E-book/basic/timer.html#綜合練習","86":"/F2E-book/basic/variable.html#變數","87":"/F2E-book/basic/variable.html#變數觀念","88":"/F2E-book/basic/variable.html#變數命名","89":"/F2E-book/basic/variable.html#變數宣告","90":"/F2E-book/basic/variable.html#資料型態","91":"/F2E-book/database/api-advanced.html#進階-api","92":"/F2E-book/database/api-advanced.html#登入","93":"/F2E-book/database/api-advanced.html#jwt-介紹","94":"/F2E-book/database/api-advanced.html#安裝套件","95":"/F2E-book/database/api-advanced.html#設定-passport-js","96":"/F2E-book/database/api-advanced.html#編寫-middleware","97":"/F2E-book/database/api-advanced.html#登入-1","98":"/F2E-book/database/api-advanced.html#登出","99":"/F2E-book/database/api-advanced.html#檔案上傳","100":"/F2E-book/database/api-advanced.html#安裝套件-1","101":"/F2E-book/database/api-advanced.html#編寫-middleware-1","102":"/F2E-book/database/api-advanced.html#購物網","103":"/F2E-book/database/api-basic.html#資料庫-api","104":"/F2E-book/database/api-basic.html#mvc-架構圖","105":"/F2E-book/database/api-basic.html#前置作業","106":"/F2E-book/database/api-basic.html#安裝套件","107":"/F2E-book/database/api-basic.html#檔案結構","108":"/F2E-book/database/api-basic.html#編寫-api","109":"/F2E-book/database/api-basic.html#主體","110":"/F2E-book/database/api-basic.html#設定資料庫","111":"/F2E-book/database/api-basic.html#model","112":"/F2E-book/database/api-basic.html#route","113":"/F2E-book/database/api-basic.html#controller","114":"/F2E-book/database/api-basic.html#新增","115":"/F2E-book/database/api-basic.html#查詢","116":"/F2E-book/database/api-basic.html#修改","117":"/F2E-book/database/api-basic.html#刪除","118":"/F2E-book/database/mongo.html#mongodb-的安裝與操作","119":"/F2E-book/database/mongo.html#安裝","120":"/F2E-book/database/mongo.html#安裝版","121":"/F2E-book/database/mongo.html#免安裝","122":"/F2E-book/database/mongo.html#工具","123":"/F2E-book/database/mongo.html#使用語法","124":"/F2E-book/database/mongo.html#新增","125":"/F2E-book/database/mongo.html#索引","126":"/F2E-book/database/mongo.html#查詢","127":"/F2E-book/database/mongo.html#更新","128":"/F2E-book/database/mongo.html#刪除","129":"/F2E-book/database/mongo.html#聚合框架-aggregation-framework","130":"/F2E-book/database/mongo.html#資料管理","131":"/F2E-book/database/mongo.html#資料匯出","132":"/F2E-book/database/mongo.html#資料匯入","133":"/F2E-book/database/mongo.html#資料庫規劃","134":"/F2E-book/interaction/bom.html#bom","135":"/F2E-book/interaction/bom.html#介紹","136":"/F2E-book/interaction/bom.html#window","137":"/F2E-book/interaction/bom.html#location","138":"/F2E-book/interaction/bom.html#history","139":"/F2E-book/interaction/bom.html#navigator","140":"/F2E-book/interaction/bom.html#screen","141":"/F2E-book/interaction/bom.html#popup","142":"/F2E-book/interaction/clock.html#時鐘","143":"/F2E-book/interaction/clock.html#date","144":"/F2E-book/interaction/clock.html#時鐘-1","145":"/F2E-book/interaction/dom.html#dom","146":"/F2E-book/interaction/dom.html#介紹","147":"/F2E-book/interaction/dom.html#取得元素","148":"/F2E-book/interaction/dom.html#修改元素","149":"/F2E-book/interaction/dom.html#元素移動","150":"/F2E-book/interaction/dom.html#節點","151":"/F2E-book/interaction/dom.html#綜合練習","152":"/F2E-book/interaction/events.html#事件","153":"/F2E-book/interaction/events.html#概念","154":"/F2E-book/interaction/events.html#行內事件","155":"/F2E-book/interaction/events.html#事件綁定","156":"/F2E-book/interaction/events.html#事件監聽","157":"/F2E-book/interaction/events.html#event-物件","158":"/F2E-book/interaction/events.html#預設動作","159":"/F2E-book/interaction/events.html#事件冒泡","160":"/F2E-book/interaction/events.html#網頁載入狀態","161":"/F2E-book/interaction/events.html#應用範例","162":"/F2E-book/interaction/events.html#綜合練習","163":"/F2E-book/interaction/observer.html#observer","164":"/F2E-book/interaction/observer.html#mutation-observer","165":"/F2E-book/interaction/observer.html#resize-observer","166":"/F2E-book/interaction/observer.html#intersection-observer","167":"/F2E-book/interaction/observer.html#應用範例","168":"/F2E-book/intro/before-start.html#在開始之前","169":"/F2E-book/intro/before-start.html#課程介紹","170":"/F2E-book/intro/before-start.html#學習方法","171":"/F2E-book/intro/before-start.html#markdown","172":"/F2E-book/intro/before-start.html#如何問問題","173":"/F2E-book/intro/before-start.html#程式設計小遊戲","174":"/F2E-book/jquery/animation.html#jquery-動畫","175":"/F2E-book/jquery/animation.html#語法","176":"/F2E-book/jquery/animation.html#應用範例","177":"/F2E-book/jquery/cards.html#翻牌記憶小遊戲","178":"/F2E-book/jquery/cards.html#範例","179":"/F2E-book/jquery/dom.html#jquery-dom","180":"/F2E-book/jquery/dom.html#抓取","181":"/F2E-book/jquery/dom.html#修改","182":"/F2E-book/jquery/dom.html#事件","183":"/F2E-book/jquery/dom.html#綜合練習","184":"/F2E-book/jquery/zombie.html#打殭屍小遊戲","185":"/F2E-book/jquery/zombie.html#範例","186":"/F2E-book/node/intro.html#認識-node-js","187":"/F2E-book/node/intro.html#結構","188":"/F2E-book/node/intro.html#package-json","189":"/F2E-book/node/intro.html#node-modules","190":"/F2E-book/node/intro.html#模組化","191":"/F2E-book/node/intro.html#預設匯出-匯入","192":"/F2E-book/node/intro.html#具名匯出-匯入","193":"/F2E-book/node/intro.html#簡易網頁伺服器","194":"/F2E-book/node/line.html#ch-21-開放資料-line-機器人","195":"/F2E-book/node/line.html#架構","196":"/F2E-book/node/line.html#前置作業","197":"/F2E-book/node/line.html#line","198":"/F2E-book/node/line.html#ngrok","199":"/F2E-book/node/line.html#製作機器人","200":"/F2E-book/node/line.html#安裝套件","201":"/F2E-book/node/line.html#nodemon","202":"/F2E-book/node/line.html#dotenv","203":"/F2E-book/node/line.html#linebot","204":"/F2E-book/node/line.html#fs","205":"/F2E-book/node/line.html#部署","206":"/F2E-book/others/git.html#git","207":"/F2E-book/others/git.html#介紹","208":"/F2E-book/others/git.html#專有名詞","209":"/F2E-book/others/git.html#github","210":"/F2E-book/others/git.html#專有名詞-1","211":"/F2E-book/others/git.html#gitkraken","212":"/F2E-book/others/nuxt.html#nuxt-js","213":"/F2E-book/others/nuxt.html#nuxt","214":"/F2E-book/others/nuxt.html#安裝","215":"/F2E-book/others/nuxt.html#引用資源","216":"/F2E-book/others/nuxt.html#layout","217":"/F2E-book/others/nuxt.html#路由","218":"/F2E-book/others/nuxt.html#pinia","219":"/F2E-book/others/nuxt.html#非同步資料","220":"/F2E-book/others/nuxt.html#plugin","221":"/F2E-book/others/nuxt.html#css","222":"/F2E-book/others/nuxt.html#meta","223":"/F2E-book/others/nuxt.html#打包","224":"/F2E-book/others/pug.html#pug","225":"/F2E-book/others/pug.html#安裝","226":"/F2E-book/others/pug.html#基本語法","227":"/F2E-book/others/pug.html#vite","228":"/F2E-book/others/vuepress.html#vuepress-網站","229":"/F2E-book/others/vuepress.html#安裝","230":"/F2E-book/others/vuepress.html#檔案結構","231":"/F2E-book/others/vuepress.html#網站設定","232":"/F2E-book/others/vuepress.html#文章設定","233":"/F2E-book/vue/basic.html#ch-22-基礎-vue-js","234":"/F2E-book/vue/basic.html#介紹影片","235":"/F2E-book/vue/basic.html#工具","236":"/F2E-book/vue/basic.html#架構","237":"/F2E-book/vue/basic.html#html-語法","238":"/F2E-book/vue/basic.html#js-語法","239":"/F2E-book/vue/basic.html#生命週期","240":"/F2E-book/vue/basic.html#options-api","241":"/F2E-book/vue/basic.html#composition-api","242":"/F2E-book/vue/basic.html#存取-html-元素","243":"/F2E-book/vue/basic.html#元件","244":"/F2E-book/vue/basic.html#建立與使用","245":"/F2E-book/vue/basic.html#傳入資料","246":"/F2E-book/vue/basic.html#傳出資料","247":"/F2E-book/vue/basic.html#內外同步","248":"/F2E-book/vue/basic.html#子元件互傳資料","249":"/F2E-book/vue/basic.html#provide-inject","250":"/F2E-book/vue/basic.html#插槽","251":"/F2E-book/vue/packages.html#vite-的套件使用","252":"/F2E-book/vue/packages.html#套件","253":"/F2E-book/vue/packages.html#ui-套件","254":"/F2E-book/vue/packages.html#font-awesome","255":"/F2E-book/vue/router-pinia-pwa.html#vue-的路由、狀態與-pwa","256":"/F2E-book/vue/router-pinia-pwa.html#router","257":"/F2E-book/vue/router-pinia-pwa.html#pinia","258":"/F2E-book/vue/router-pinia-pwa.html#pwa","259":"/F2E-book/vue/vite-sfc.html#vite-與單元件檔案","260":"/F2E-book/vue/vite-sfc.html#vite","261":"/F2E-book/vue/vite-sfc.html#安裝","262":"/F2E-book/vue/vite-sfc.html#目錄結構","263":"/F2E-book/vue/vite-sfc.html#預處理器","264":"/F2E-book/vue/vite-sfc.html#eslint","265":"/F2E-book/vue/vite-sfc.html#路徑設定","266":"/F2E-book/vue/vite-sfc.html#單檔案元件","267":"/F2E-book/vue/vite-sfc.html#使用元件","268":"/F2E-book/vue/vite-sfc.html#引用資源","269":"/F2E-book/vue/vite-sfc.html#部署","270":"/F2E-book/vue/vite-sfc.html#編譯","271":"/F2E-book/vue/vite-sfc.html#github-actions"},"fieldIds":{"title":0,"titles":1,"text":2},"fieldLength":{"0":[3,1,7],"1":[2,3,6],"2":[1,5,18],"3":[1,5,39],"4":[1,3,53],"5":[2,3,113],"6":[3,1,4],"7":[2,3,4],"8":[2,4,25],"9":[2,4,31],"10":[1,4,10],"11":[1,4,10],"12":[1,3,38],"13":[1,3,27],"14":[2,3,30],"15":[2,3,43],"16":[1,3,30],"17":[1,1,3],"18":[1,1,82],"19":[1,1,36],"20":[1,1,43],"21":[1,1,44],"22":[1,1,75],"23":[1,1,42],"24":[1,1,56],"25":[1,1,98],"26":[1,1,10],"27":[2,1,47],"28":[1,1,37],"29":[1,1,3],"30":[1,1,39],"31":[1,1,52],"32":[1,1,54],"33":[1,1,33],"34":[1,1,25],"35":[1,1,89],"36":[2,1,68],"37":[1,1,49],"38":[1,1,48],"39":[1,1,44],"40":[2,1,2],"41":[1,2,103],"42":[1,2,69],"43":[1,2,76],"44":[1,2,8],"45":[2,1,2],"46":[1,2,58],"47":[1,2,133],"48":[2,1,2],"49":[1,2,31],"50":[1,2,121],"51":[1,2,36],"52":[1,2,1],"53":[1,2,56],"54":[1,1,6],"55":[1,1,35],"56":[1,1,50],"57":[1,1,34],"58":[1,1,52],"59":[1,1,25],"60":[1,1,129],"61":[1,1,51],"62":[2,1,18],"63":[1,1,48],"64":[2,1,4],"65":[1,2,85],"66":[1,2,14],"67":[1,2,6],"68":[1,2,28],"69":[1,2,60],"70":[1,1,10],"71":[1,1,78],"72":[2,1,10],"73":[1,1,47],"74":[2,1,36],"75":[1,1,10],"76":[3,1,54],"77":[1,1,99],"78":[1,1,6],"79":[1,1,60],"80":[1,1,20],"81":[1,1,36],"82":[1,1,3],"83":[1,1,59],"84":[1,1,19],"85":[1,1,11],"86":[1,1,7],"87":[1,1,23],"88":[1,1,67],"89":[1,1,75],"90":[1,1,66],"91":[2,1,3],"92":[1,2,7],"93":[2,3,38],"94":[1,3,8],"95":[3,3,89],"96":[2,3,68],"97":[1,3,47],"98":[1,3,32],"99":[1,2,3],"100":[1,3,8],"101":[2,3,84],"102":[1,2,13],"103":[2,1,7],"104":[2,2,21],"105":[1,2,1],"106":[1,3,18],"107":[1,3,20],"108":[2,2,1],"109":[1,3,56],"110":[1,3,26],"111":[1,3,103],"112":[1,3,49],"113":[1,3,26],"114":[1,3,93],"115":[1,3,62],"116":[1,3,74],"117":[1,3,116],"118":[2,1,3],"119":[1,2,1],"120":[1,3,34],"121":[1,3,40],"122":[1,3,6],"123":[1,2,1],"124":[1,3,35],"125":[1,3,27],"126":[1,3,61],"127":[1,3,26],"128":[1,3,12],"129":[4,2,10],"130":[1,2,1],"131":[1,3,11],"132":[1,3,10],"133":[1,2,1],"134":[1,1,8],"135":[1,1,11],"136":[1,1,36],"137":[1,1,25],"138":[1,1,15],"139":[1,1,32],"140":[1,1,34],"141":[1,1,38],"142":[1,1,4],"143":[1,1,84],"144":[1,1,166],"145":[1,1,8],"146":[1,1,10],"147":[1,1,118],"148":[1,1,97],"149":[1,1,96],"150":[1,1,88],"151":[1,1,14],"152":[1,1,5],"153":[1,1,36],"154":[1,1,39],"155":[1,1,42],"156":[1,1,20],"157":[2,1,42],"158":[1,1,42],"159":[1,1,47],"160":[1,1,25],"161":[1,1,4],"162":[1,1,20],"163":[1,1,8],"164":[2,1,96],"165":[2,1,94],"166":[2,1,116],"167":[1,1,123],"168":[1,1,3],"169":[1,1,1],"170":[1,1,31],"171":[1,1,26],"172":[1,1,65],"173":[1,1,9],"174":[2,1,4],"175":[1,2,110],"176":[1,2,89],"177":[1,1,7],"178":[1,1,127],"179":[2,1,1],"180":[1,2,90],"181":[1,2,91],"182":[1,2,25],"183":[1,2,24],"184":[1,1,7],"185":[1,1,127],"186":[3,1,5],"187":[1,3,1],"188":[2,4,44],"189":[2,4,11],"190":[1,3,50],"191":[2,4,24],"192":[2,4,36],"193":[1,3,44],"194":[5,1,7],"195":[1,5,1],"196":[1,5,1],"197":[1,6,13],"198":[1,6,24],"199":[1,5,1],"200":[1,6,31],"201":[1,6,22],"202":[1,6,32],"203":[1,6,45],"204":[1,6,21],"205":[1,5,26],"206":[1,1,6],"207":[1,1,22],"208":[1,2,35],"209":[1,1,23],"210":[1,2,14],"211":[1,1,20],"212":[2,1,8],"213":[1,2,20],"214":[1,2,42],"215":[1,2,45],"216":[1,2,56],"217":[1,2,24],"218":[1,2,17],"219":[1,2,118],"220":[1,2,48],"221":[1,2,26],"222":[1,2,122],"223":[1,2,13],"224":[1,1,7],"225":[1,1,21],"226":[1,1,61],"227":[1,1,24],"228":[2,1,6],"229":[1,2,30],"230":[1,2,35],"231":[1,2,85],"232":[1,2,17],"233":[5,1,6],"234":[1,5,1],"235":[1,5,5],"236":[1,5,38],"237":[2,5,144],"238":[2,5,20],"239":[1,7,18],"240":[2,7,63],"241":[2,7,88],"242":[3,5,99],"243":[1,5,4],"244":[1,6,43],"245":[1,6,49],"246":[1,6,49],"247":[1,6,34],"248":[1,6,39],"249":[2,6,38],"250":[1,6,64],"251":[2,1,9],"252":[1,2,1],"253":[2,3,26],"254":[2,3,52],"255":[4,1,7],"256":[1,4,96],"257":[1,4,104],"258":[1,4,183],"259":[2,1,8],"260":[1,2,1],"261":[1,2,64],"262":[1,2,17],"263":[1,2,27],"264":[1,2,45],"265":[1,2,24],"266":[1,2,31],"267":[1,3,19],"268":[1,2,88],"269":[1,2,1],"270":[1,3,21],"271":[2,3,76]},"averageFieldLength":[1.2647058823529407,2.1948529411764715,39.05147058823529],"storedFields":{"0":{"title":"進階 JavaScript 語法","titles":[]},"1":{"title":"try catch","titles":["進階 JavaScript 語法"]},"2":{"title":"避免出現錯誤訊息","titles":["進階 JavaScript 語法","try catch"]},"3":{"title":"流程控制","titles":["進階 JavaScript 語法","try catch"]},"4":{"title":"Promise","titles":["進階 JavaScript 語法"]},"5":{"title":"async await","titles":["進階 JavaScript 語法"]},"6":{"title":"HTTP 請求與 AJAX","titles":[]},"7":{"title":"HTTP 請求","titles":["HTTP 請求與 AJAX"]},"8":{"title":"Request Line","titles":["HTTP 請求與 AJAX","HTTP 請求"]},"9":{"title":"Status Line","titles":["HTTP 請求與 AJAX","HTTP 請求"]},"10":{"title":"Header","titles":["HTTP 請求與 AJAX","HTTP 請求"]},"11":{"title":"Body","titles":["HTTP 請求與 AJAX","HTTP 請求"]},"12":{"title":"AJAX","titles":["HTTP 請求與 AJAX"]},"13":{"title":"XMLHttpRequest","titles":["HTTP 請求與 AJAX","AJAX"]},"14":{"title":"Fetch API","titles":["HTTP 請求與 AJAX","AJAX"]},"15":{"title":"jQuery AJAX","titles":["HTTP 請求與 AJAX","AJAX"]},"16":{"title":"axios","titles":["HTTP 請求與 AJAX","AJAX"]},"17":{"title":"陣列與物件","titles":[]},"18":{"title":"陣列","titles":["陣列與物件"]},"19":{"title":"物件","titles":["陣列與物件"]},"20":{"title":"解構賦值","titles":["陣列與物件"]},"21":{"title":"巢狀","titles":["陣列與物件"]},"22":{"title":"可選串連","titles":["陣列與物件"]},"23":{"title":"迴圈","titles":["陣列與物件"]},"24":{"title":"傳值與傳址","titles":["陣列與物件"]},"25":{"title":"綜合練習","titles":["陣列與物件"]},"26":{"title":"物件導向","titles":[]},"27":{"title":"物件中的 function","titles":["物件導向"]},"28":{"title":"類別","titles":["物件導向"]},"29":{"title":"邏輯判斷式","titles":[]},"30":{"title":"認識語法","titles":["邏輯判斷式"]},"31":{"title":"比較運算子","titles":["邏輯判斷式"]},"32":{"title":"邏輯運算子","titles":["邏輯判斷式"]},"33":{"title":"三元運算子","titles":["邏輯判斷式"]},"34":{"title":"多條件式","titles":["邏輯判斷式"]},"35":{"title":"判斷式條件的延伸","titles":["邏輯判斷式"]},"36":{"title":"switch case","titles":["邏輯判斷式"]},"37":{"title":"巢狀判斷式","titles":["邏輯判斷式"]},"38":{"title":"短路求值","titles":["邏輯判斷式"]},"39":{"title":"綜合練習","titles":["邏輯判斷式"]},"40":{"title":"資料處理 - 陣列","titles":[]},"41":{"title":"基本處理","titles":["資料處理 - 陣列"]},"42":{"title":"尋找與取代","titles":["資料處理 - 陣列"]},"43":{"title":"其他","titles":["資料處理 - 陣列"]},"44":{"title":"綜合練習","titles":["資料處理 - 陣列"]},"45":{"title":"資料處理 - 數字","titles":[]},"46":{"title":"語法","titles":["資料處理 - 數字"]},"47":{"title":"綜合練習","titles":["資料處理 - 數字"]},"48":{"title":"資料處理 - 文字","titles":[]},"49":{"title":"基本處理","titles":["資料處理 - 文字"]},"50":{"title":"尋找與取代","titles":["資料處理 - 文字"]},"51":{"title":"切割","titles":["資料處理 - 文字"]},"52":{"title":"資料型態轉換","titles":["資料處理 - 文字"]},"53":{"title":"綜合練習","titles":["資料處理 - 文字"]},"54":{"title":"function","titles":[]},"55":{"title":"語法","titles":["function"]},"56":{"title":"傳入資料","titles":["function"]},"57":{"title":"return","titles":["function"]},"58":{"title":"箭頭函式","titles":["function"]},"59":{"title":"jsDoc","titles":["function"]},"60":{"title":"綜合練習","titles":["function"]},"61":{"title":"遞迴","titles":["function"]},"62":{"title":"var 區域","titles":["function"]},"63":{"title":"提升","titles":["function"]},"64":{"title":"認識 JavaScript","titles":[]},"65":{"title":"前端功能","titles":["認識 JavaScript"]},"66":{"title":"後端功能","titles":["認識 JavaScript"]},"67":{"title":"其他功能","titles":["認識 JavaScript"]},"68":{"title":"缺點","titles":["認識 JavaScript"]},"69":{"title":"前端的使用方式","titles":["認識 JavaScript"]},"70":{"title":"迴圈","titles":[]},"71":{"title":"for","titles":["迴圈"]},"72":{"title":"巢狀 for","titles":["迴圈"]},"73":{"title":"while","titles":["迴圈"]},"74":{"title":"do while","titles":["迴圈"]},"75":{"title":"比較","titles":["迴圈"]},"76":{"title":"break 與 continue","titles":["迴圈"]},"77":{"title":"綜合練習","titles":["迴圈"]},"78":{"title":"運算子","titles":[]},"79":{"title":"數學運算子","titles":["運算子"]},"80":{"title":"指派運算子","titles":["運算子"]},"81":{"title":"文字連接","titles":["運算子"]},"82":{"title":"計時器","titles":[]},"83":{"title":"一般計時器","titles":["計時器"]},"84":{"title":"重複計時器","titles":["計時器"]},"85":{"title":"綜合練習","titles":["計時器"]},"86":{"title":"變數","titles":[]},"87":{"title":"變數觀念","titles":["變數"]},"88":{"title":"變數命名","titles":["變數"]},"89":{"title":"變數宣告","titles":["變數"]},"90":{"title":"資料型態","titles":["變數"]},"91":{"title":"進階 API","titles":[]},"92":{"title":"登入","titles":["進階 API"]},"93":{"title":"JWT 介紹","titles":["進階 API","登入"]},"94":{"title":"安裝套件","titles":["進階 API","登入"]},"95":{"title":"設定 passport.js","titles":["進階 API","登入"]},"96":{"title":"編寫 middleware","titles":["進階 API","登入"]},"97":{"title":"登入","titles":["進階 API","登入"]},"98":{"title":"登出","titles":["進階 API","登入"]},"99":{"title":"檔案上傳","titles":["進階 API"]},"100":{"title":"安裝套件","titles":["進階 API","檔案上傳"]},"101":{"title":"編寫 middleware","titles":["進階 API","檔案上傳"]},"102":{"title":"購物網","titles":["進階 API"]},"103":{"title":"資料庫 API","titles":[]},"104":{"title":"MVC 架構圖","titles":["資料庫 API"]},"105":{"title":"前置作業","titles":["資料庫 API"]},"106":{"title":"安裝套件","titles":["資料庫 API","前置作業"]},"107":{"title":"檔案結構","titles":["資料庫 API","前置作業"]},"108":{"title":"編寫 API","titles":["資料庫 API"]},"109":{"title":"主體","titles":["資料庫 API","編寫 API"]},"110":{"title":"設定資料庫","titles":["資料庫 API","編寫 API"]},"111":{"title":"Model","titles":["資料庫 API","編寫 API"]},"112":{"title":"Route","titles":["資料庫 API","編寫 API"]},"113":{"title":"Controller","titles":["資料庫 API","編寫 API"]},"114":{"title":"新增","titles":["資料庫 API","編寫 API"]},"115":{"title":"查詢","titles":["資料庫 API","編寫 API"]},"116":{"title":"修改","titles":["資料庫 API","編寫 API"]},"117":{"title":"刪除","titles":["資料庫 API","編寫 API"]},"118":{"title":"MongoDB 的安裝與操作","titles":[]},"119":{"title":"安裝","titles":["MongoDB 的安裝與操作"]},"120":{"title":"安裝版","titles":["MongoDB 的安裝與操作","安裝"]},"121":{"title":"免安裝","titles":["MongoDB 的安裝與操作","安裝"]},"122":{"title":"工具","titles":["MongoDB 的安裝與操作","安裝"]},"123":{"title":"使用語法","titles":["MongoDB 的安裝與操作"]},"124":{"title":"新增","titles":["MongoDB 的安裝與操作","使用語法"]},"125":{"title":"索引","titles":["MongoDB 的安裝與操作","使用語法"]},"126":{"title":"查詢","titles":["MongoDB 的安裝與操作","使用語法"]},"127":{"title":"更新","titles":["MongoDB 的安裝與操作","使用語法"]},"128":{"title":"刪除","titles":["MongoDB 的安裝與操作","使用語法"]},"129":{"title":"聚合框架 (Aggregation Framework)","titles":["MongoDB 的安裝與操作"]},"130":{"title":"資料管理","titles":["MongoDB 的安裝與操作"]},"131":{"title":"資料匯出","titles":["MongoDB 的安裝與操作","資料管理"]},"132":{"title":"資料匯入","titles":["MongoDB 的安裝與操作","資料管理"]},"133":{"title":"資料庫規劃","titles":["MongoDB 的安裝與操作"]},"134":{"title":"BOM","titles":[]},"135":{"title":"介紹","titles":["BOM"]},"136":{"title":"window","titles":["BOM"]},"137":{"title":"location","titles":["BOM"]},"138":{"title":"history","titles":["BOM"]},"139":{"title":"navigator","titles":["BOM"]},"140":{"title":"screen","titles":["BOM"]},"141":{"title":"popup","titles":["BOM"]},"142":{"title":"時鐘","titles":[]},"143":{"title":"Date","titles":["時鐘"]},"144":{"title":"時鐘","titles":["時鐘"]},"145":{"title":"DOM","titles":[]},"146":{"title":"介紹","titles":["DOM"]},"147":{"title":"取得元素","titles":["DOM"]},"148":{"title":"修改元素","titles":["DOM"]},"149":{"title":"元素移動","titles":["DOM"]},"150":{"title":"節點","titles":["DOM"]},"151":{"title":"綜合練習","titles":["DOM"]},"152":{"title":"事件","titles":[]},"153":{"title":"概念","titles":["事件"]},"154":{"title":"行內事件","titles":["事件"]},"155":{"title":"事件綁定","titles":["事件"]},"156":{"title":"事件監聽","titles":["事件"]},"157":{"title":"Event 物件","titles":["事件"]},"158":{"title":"預設動作","titles":["事件"]},"159":{"title":"事件冒泡","titles":["事件"]},"160":{"title":"網頁載入狀態","titles":["事件"]},"161":{"title":"應用範例","titles":["事件"]},"162":{"title":"綜合練習","titles":["事件"]},"163":{"title":"Observer","titles":[]},"164":{"title":"Mutation Observer","titles":["Observer"]},"165":{"title":"Resize Observer","titles":["Observer"]},"166":{"title":"Intersection Observer","titles":["Observer"]},"167":{"title":"應用範例","titles":["Observer"]},"168":{"title":"在開始之前","titles":[]},"169":{"title":"課程介紹","titles":["在開始之前"]},"170":{"title":"學習方法","titles":["在開始之前"]},"171":{"title":"Markdown","titles":["在開始之前"]},"172":{"title":"如何問問題","titles":["在開始之前"]},"173":{"title":"程式設計小遊戲","titles":["在開始之前"]},"174":{"title":"jQuery - 動畫","titles":[]},"175":{"title":"語法","titles":["jQuery - 動畫"]},"176":{"title":"應用範例","titles":["jQuery - 動畫"]},"177":{"title":"翻牌記憶小遊戲","titles":[]},"178":{"title":"範例","titles":["翻牌記憶小遊戲"]},"179":{"title":"jQuery - DOM","titles":[]},"180":{"title":"抓取","titles":["jQuery - DOM"]},"181":{"title":"修改","titles":["jQuery - DOM"]},"182":{"title":"事件","titles":["jQuery - DOM"]},"183":{"title":"綜合練習","titles":["jQuery - DOM"]},"184":{"title":"打殭屍小遊戲","titles":[]},"185":{"title":"範例","titles":["打殭屍小遊戲"]},"186":{"title":"認識 Node.js","titles":[]},"187":{"title":"結構","titles":["認識 Node.js"]},"188":{"title":"package.json","titles":["認識 Node.js","結構"]},"189":{"title":"node_modules","titles":["認識 Node.js","結構"]},"190":{"title":"模組化","titles":["認識 Node.js"]},"191":{"title":"預設匯出/匯入","titles":["認識 Node.js","模組化"]},"192":{"title":"具名匯出/匯入","titles":["認識 Node.js","模組化"]},"193":{"title":"簡易網頁伺服器","titles":["認識 Node.js"]},"194":{"title":"Ch.21 開放資料 LINE 機器人","titles":[]},"195":{"title":"架構","titles":["Ch.21 開放資料 LINE 機器人"]},"196":{"title":"前置作業","titles":["Ch.21 開放資料 LINE 機器人"]},"197":{"title":"LINE","titles":["Ch.21 開放資料 LINE 機器人","前置作業"]},"198":{"title":"ngrok","titles":["Ch.21 開放資料 LINE 機器人","前置作業"]},"199":{"title":"製作機器人","titles":["Ch.21 開放資料 LINE 機器人"]},"200":{"title":"安裝套件","titles":["Ch.21 開放資料 LINE 機器人","製作機器人"]},"201":{"title":"nodemon","titles":["Ch.21 開放資料 LINE 機器人","製作機器人"]},"202":{"title":"dotenv","titles":["Ch.21 開放資料 LINE 機器人","製作機器人"]},"203":{"title":"linebot","titles":["Ch.21 開放資料 LINE 機器人","製作機器人"]},"204":{"title":"fs","titles":["Ch.21 開放資料 LINE 機器人","製作機器人"]},"205":{"title":"部署","titles":["Ch.21 開放資料 LINE 機器人"]},"206":{"title":"Git","titles":[]},"207":{"title":"介紹","titles":["Git"]},"208":{"title":"專有名詞","titles":["Git","介紹"]},"209":{"title":"GitHub","titles":["Git"]},"210":{"title":"專有名詞","titles":["Git","GitHub"]},"211":{"title":"GitKraken","titles":["Git"]},"212":{"title":"Nuxt.js","titles":[]},"213":{"title":"Nuxt","titles":["Nuxt.js"]},"214":{"title":"安裝","titles":["Nuxt.js","Nuxt"]},"215":{"title":"引用資源","titles":["Nuxt.js","Nuxt"]},"216":{"title":"Layout","titles":["Nuxt.js","Nuxt"]},"217":{"title":"路由","titles":["Nuxt.js","Nuxt"]},"218":{"title":"Pinia","titles":["Nuxt.js","Nuxt"]},"219":{"title":"非同步資料","titles":["Nuxt.js","Nuxt"]},"220":{"title":"Plugin","titles":["Nuxt.js","Nuxt"]},"221":{"title":"CSS","titles":["Nuxt.js","Nuxt"]},"222":{"title":"Meta","titles":["Nuxt.js","Nuxt"]},"223":{"title":"打包","titles":["Nuxt.js","Nuxt"]},"224":{"title":"Pug","titles":[]},"225":{"title":"安裝","titles":["Pug"]},"226":{"title":"基本語法","titles":["Pug"]},"227":{"title":"Vite","titles":["Pug"]},"228":{"title":"VuePress 網站","titles":[]},"229":{"title":"安裝","titles":["VuePress 網站"]},"230":{"title":"檔案結構","titles":["VuePress 網站"]},"231":{"title":"網站設定","titles":["VuePress 網站"]},"232":{"title":"文章設定","titles":["VuePress 網站"]},"233":{"title":"Ch.22 基礎 Vue.js","titles":[]},"234":{"title":"介紹影片","titles":["Ch.22 基礎 Vue.js"]},"235":{"title":"工具","titles":["Ch.22 基礎 Vue.js"]},"236":{"title":"架構","titles":["Ch.22 基礎 Vue.js"]},"237":{"title":"HTML 語法","titles":["Ch.22 基礎 Vue.js"]},"238":{"title":"JS 語法","titles":["Ch.22 基礎 Vue.js"]},"239":{"title":"生命週期","titles":["Ch.22 基礎 Vue.js","JS 語法"]},"240":{"title":"Options API","titles":["Ch.22 基礎 Vue.js","JS 語法"]},"241":{"title":"Composition API","titles":["Ch.22 基礎 Vue.js","JS 語法"]},"242":{"title":"存取 HTML 元素","titles":["Ch.22 基礎 Vue.js"]},"243":{"title":"元件","titles":["Ch.22 基礎 Vue.js"]},"244":{"title":"建立與使用","titles":["Ch.22 基礎 Vue.js","元件"]},"245":{"title":"傳入資料","titles":["Ch.22 基礎 Vue.js","元件"]},"246":{"title":"傳出資料","titles":["Ch.22 基礎 Vue.js","元件"]},"247":{"title":"內外同步","titles":["Ch.22 基礎 Vue.js","元件"]},"248":{"title":"子元件互傳資料","titles":["Ch.22 基礎 Vue.js","元件"]},"249":{"title":"provide/inject","titles":["Ch.22 基礎 Vue.js","元件"]},"250":{"title":"插槽","titles":["Ch.22 基礎 Vue.js","元件"]},"251":{"title":"Vite 的套件使用","titles":[]},"252":{"title":"套件","titles":["Vite 的套件使用"]},"253":{"title":"UI 套件","titles":["Vite 的套件使用","套件"]},"254":{"title":"Font Awesome","titles":["Vite 的套件使用","套件"]},"255":{"title":"Vue 的路由、狀態與 PWA","titles":[]},"256":{"title":"Router","titles":["Vue 的路由、狀態與 PWA"]},"257":{"title":"Pinia","titles":["Vue 的路由、狀態與 PWA"]},"258":{"title":"PWA","titles":["Vue 的路由、狀態與 PWA"]},"259":{"title":"Vite 與單元件檔案","titles":[]},"260":{"title":"Vite","titles":["Vite 與單元件檔案"]},"261":{"title":"安裝","titles":["Vite 與單元件檔案","Vite"]},"262":{"title":"目錄結構","titles":["Vite 與單元件檔案","Vite"]},"263":{"title":"預處理器","titles":["Vite 與單元件檔案","Vite"]},"264":{"title":"Eslint","titles":["Vite 與單元件檔案","Vite"]},"265":{"title":"路徑設定","titles":["Vite 與單元件檔案","Vite"]},"266":{"title":"單檔案元件","titles":["Vite 與單元件檔案"]},"267":{"title":"使用元件","titles":["Vite 與單元件檔案","單檔案元件"]},"268":{"title":"引用資源","titles":["Vite 與單元件檔案"]},"269":{"title":"部署","titles":["Vite 與單元件檔案"]},"270":{"title":"編譯","titles":["Vite 與單元件檔案","部署"]},"271":{"title":"GitHub Actions","titles":["Vite 與單元件檔案","部署"]}},"dirtCount":0,"index":[["跑馬燈區",{"2":{"271":1}}],["環境及預處理器",{"2":{"271":1}}],["步驟三",{"2":{"271":1}}],["步驟二",{"2":{"271":1}}],["步驟一",{"2":{"271":1}}],["工作步驟",{"2":{"271":1}}],["工作名稱",{"2":{"271":1}}],["工具",{"0":{"122":1,"235":1},"2":{"206":1,"251":1}}],["音效等資源有",{"2":{"268":1}}],["預處理器",{"0":{"263":1}}],["預設套用",{"2":{"216":1}}],["預設使用",{"2":{"214":1}}],["預設",{"2":{"192":1}}],["預設匯出",{"0":{"191":1}}],["預設為",{"2":{"166":2,"175":2}}],["預設動作",{"0":{"158":1}}],["預設只找一筆資料",{"2":{"127":1}}],["預設回來的",{"2":{"116":2}}],["預設遇到",{"2":{"69":1}}],["預設是陣列第一個值",{"2":{"43":1}}],["預設是",{"2":{"42":2,"50":3}}],["管理狀態",{"2":{"261":1}}],["方法二",{"2":{"261":1}}],["方法一",{"2":{"261":1}}],["方便同學與老師閱讀",{"2":{"172":1}}],["暫停與跳過倒數",{"2":{"258":1}}],["暫存檔案",{"2":{"208":1}}],["倒數完後能自動開始倒數下一個休息時間或事項",{"2":{"258":1}}],["倒數時間到響鈴",{"2":{"258":1}}],["倒序",{"2":{"43":1}}],["休息",{"2":{"258":1}}],["功能包括",{"2":{"258":1}}],["欄",{"2":{"258":1}}],["欄位名稱",{"2":{"111":1}}],["熟悉",{"2":{"255":1,"271":1}}],["狀態與",{"0":{"255":1},"1":{"256":1,"257":1,"258":1}}],["狀態碼有",{"2":{"9":1}}],["狀態碼大致分為下列幾種",{"2":{"9":1}}],["狀態碼",{"2":{"9":1}}],["根據",{"2":{"254":1}}],["張以上排列",{"2":{"250":1}}],["收回讚按鈕",{"2":{"250":1}}],["卡片需用子元件製作",{"2":{"250":1}}],["卡片範例",{"2":{"176":1}}],["官方建議使用",{"2":{"248":1}}],["官方推薦的",{"2":{"16":1}}],["幫助",{"2":{"257":1}}],["幫忙",{"2":{"248":1}}],["幫我們做中介",{"2":{"198":1}}],["帶出去",{"2":{"246":2}}],["子元件資料夾",{"2":{"262":1}}],["子元件互傳可以建立一個",{"2":{"248":1}}],["子元件互傳資料",{"0":{"248":1}}],["子元件觸發自訂義事件",{"2":{"246":2}}],["子元件內",{"2":{"246":1}}],["子元件傳出則需要使用",{"2":{"246":1}}],["子元素",{"2":{"149":1}}],["略",{"2":{"244":2}}],["略過一次執行",{"2":{"76":1}}],["未完成的事項",{"2":{"258":1}}],["未完成項目",{"2":{"242":2}}],["未定義",{"2":{"90":1}}],["已完成項目",{"2":{"242":2}}],["已完成打勾",{"2":{"242":1}}],["鍵的",{"2":{"242":1}}],["鍵可以取消編輯",{"2":{"242":1}}],["鍵盤事件則有按鍵修飾符",{"2":{"237":1}}],["鍵盤類事件可以取得按下的按鍵",{"2":{"157":1}}],["鍵盤按鍵放開時",{"2":{"153":1}}],["鍵盤按鍵按下去時",{"2":{"153":1}}],["鍵盤按鍵等",{"2":{"65":1}}],["類似",{"2":{"242":1}}],["類別是物件導向的基本概念",{"2":{"28":1}}],["類別",{"0":{"28":1}}],["渲染完",{"2":{"242":1}}],["觸發時機",{"2":{"271":1}}],["觸發事件",{"2":{"248":1}}],["觸發事件的",{"2":{"241":1}}],["觸發錯誤",{"2":{"2":1}}],["監聽指定物件屬性",{"2":{"240":1}}],["監視器",{"2":{"163":1}}],["深層監聽物件",{"2":{"240":1}}],["生命週期相關的直接寫",{"2":{"241":1}}],["生命週期",{"0":{"239":1},"2":{"240":1}}],["仍會收到一個",{"2":{"237":1}}],["呼叫",{"2":{"237":1,"257":1}}],["修飾符可以用",{"2":{"237":1}}],["修改狀態用的",{"2":{"257":1}}],["修改多個行內樣式",{"2":{"181":1}}],["修改行內樣式",{"2":{"181":1}}],["修改標籤屬性",{"2":{"181":1}}],["修改輸入欄位的值",{"2":{"181":1}}],["修改文字",{"2":{"181":1,"185":1}}],["修改獲取得元素屬性時",{"2":{"148":1}}],["修改元素內的",{"2":{"148":1}}],["修改元素內的文字",{"2":{"148":1}}],["修改元素屬性",{"2":{"148":2}}],["修改元素",{"0":{"148":1},"2":{"148":1,"165":2}}],["修改指定值",{"2":{"127":1}}],["修改庫存量",{"2":{"117":1}}],["修改使用者資料",{"2":{"116":1}}],["修改會出現錯誤",{"2":{"89":1}}],["修改",{"0":{"116":1,"181":1},"2":{"89":1,"117":1,"181":1,"257":1}}],["修改網頁",{"2":{"67":1}}],["拼湊出網頁",{"2":{"236":1,"243":1}}],["插槽可以在元件內預留一部分的",{"2":{"250":1}}],["插槽",{"0":{"250":1}}],["插件",{"2":{"231":1}}],["插入變數",{"2":{"81":1}}],["插入",{"2":{"41":1}}],["插入資料2",{"2":{"41":1}}],["插入資料1",{"2":{"41":1}}],["群組",{"2":{"231":1}}],["群組名稱",{"2":{"50":1}}],["側邊欄",{"2":{"231":1}}],["導覽列",{"2":{"231":1}}],["首頁可能會有其他設定",{"2":{"232":1}}],["首頁",{"2":{"230":1}}],["靜態資源",{"2":{"230":1,"262":1}}],["筆記做成網站",{"2":{"228":1}}],["全螢幕",{"2":{"258":1}}],["全部未完成",{"2":{"242":1}}],["全部標記已完成",{"2":{"242":1}}],["全部刪除",{"2":{"242":1}}],["全部屬性變更",{"2":{"241":1}}],["全域安裝",{"2":{"225":1}}],["全名叫",{"2":{"145":1}}],["端沒有",{"2":{"220":1}}],["載入頁面前先取得資料",{"2":{"219":1}}],["載入時機錯誤可能會導致程式無效",{"2":{"69":1}}],["非同步資料語法分下列幾種",{"2":{"219":1}}],["非同步資料",{"0":{"219":1}}],["非常快速",{"2":{"66":1}}],["|",{"2":{"217":4,"226":2,"271":1}}],["||",{"2":{"22":2,"32":2,"34":1,"36":2,"38":10,"96":1,"97":1,"203":1}}],["名",{"2":{"237":2}}],["名為",{"2":{"217":2}}],["名稱為",{"2":{"246":2}}],["名稱對大小寫敏感",{"2":{"88":1}}],["名稱",{"2":{"55":2,"117":1,"150":1,"258":1,"271":1}}],["名稱取值",{"2":{"20":1}}],["動態資源",{"2":{"262":1}}],["動態產生資料網址",{"2":{"219":1}}],["動態",{"2":{"216":1}}],["動畫預設只有",{"2":{"175":1}}],["動畫完成後要執行的",{"2":{"175":1}}],["動畫效果",{"2":{"175":1}}],["動畫時間",{"2":{"175":1}}],["動畫",{"0":{"174":1},"1":{"175":1,"176":1},"2":{"175":2}}],["問題",{"2":{"213":1}}],["問問題前",{"2":{"172":1}}],["整個",{"2":{"245":1}}],["整合",{"2":{"213":1}}],["整除",{"2":{"47":1}}],["軟體",{"2":{"211":2}}],["關注",{"2":{"210":1}}],["關閉自動回覆訊息",{"2":{"197":1}}],["關閉視窗",{"2":{"136":2}}],["關閉頁面",{"2":{"136":1}}],["議題",{"2":{"210":1}}],["搶修反而錯刪",{"2":{"209":1}}],["服務平台的資料都安全",{"2":{"209":1}}],["服務的平台",{"2":{"209":2}}],["遠端伺服器",{"2":{"208":1}}],["本機",{"2":{"208":1}}],["合併分支",{"2":{"208":1}}],["推",{"2":{"208":1}}],["拉",{"2":{"208":1}}],["保存修改紀錄",{"2":{"208":1}}],["保護級",{"2":{"35":2,"36":1}}],["儲存庫",{"2":{"208":1}}],["儲存更複雜的資料",{"2":{"21":1}}],["專有名詞",{"0":{"208":1,"210":1}}],["專案名稱",{"2":{"188":1,"261":2}}],["專案使用",{"2":{"188":1,"190":1}}],["專案的資訊",{"2":{"188":1}}],["之後",{"2":{"207":1}}],["之前的檔案可能會是這樣子",{"2":{"207":1}}],["體積小",{"2":{"207":1}}],["及",{"2":{"206":1,"214":1}}],["期中作業",{"2":{"205":1}}],["部署",{"0":{"205":1,"269":1},"1":{"270":1,"271":1},"2":{"271":1}}],["部分使用元件html",{"2":{"256":1}}],["部分套件不是使用",{"2":{"253":1}}],["部分常用事件已經有對應的函式",{"2":{"182":1}}],["部分",{"2":{"146":1,"220":1,"236":1,"244":1}}],["卻不知道哪裡錯",{"2":{"204":1}}],["訊息印成檔案",{"2":{"204":1}}],["訊息",{"2":{"204":1}}],["詳細的訊息事件可以參考",{"2":{"203":1}}],["雲端服務不需要自動重新啟動",{"2":{"201":1}}],["編譯",{"0":{"270":1},"2":{"271":1}}],["編譯網站時會一起編譯",{"2":{"262":1}}],["編譯網站時不會編譯",{"2":{"262":1}}],["編輯",{"2":{"198":1,"258":1}}],["編寫設定yml",{"2":{"271":1}}],["編寫套件給別人引用時才需要",{"2":{"188":1}}],["編寫動畫效果",{"2":{"174":1}}],["編寫資料表綱要",{"2":{"111":1}}],["編寫使用者的",{"2":{"97":1}}],["編寫",{"0":{"96":1,"101":1,"108":1},"1":{"109":1,"110":1,"111":1,"112":1,"113":1,"114":1,"115":1,"116":1,"117":1}}],["編寫一個",{"2":{"60":1}}],["編寫的時候要注意判斷順序",{"2":{"35":1}}],["填寫機器人帳號資訊",{"2":{"197":1}}],["填現有的元素是移動",{"2":{"181":2}}],["註冊元件",{"2":{"254":1}}],["註冊",{"2":{"205":1,"258":1}}],["註冊開發帳號",{"2":{"197":1}}],["註解",{"2":{"150":1}}],["註解以及元素等等",{"2":{"150":1}}],["註解會有編輯器提示",{"2":{"59":1}}],["機器人套件",{"2":{"200":1}}],["機器人的",{"2":{"198":1,"202":1}}],["機器人",{"0":{"194":1},"1":{"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1},"2":{"194":1,"203":1,"205":1}}],["埠啟動伺服器",{"2":{"193":1}}],["回報問題",{"2":{"210":1}}],["回應結束",{"2":{"193":1}}],["回應狀態碼",{"2":{"193":1}}],["回傳被刪除的元素",{"2":{"149":1}}],["回傳相應狀態碼",{"2":{"117":6}}],["回傳錯誤狀態碼",{"2":{"114":2,"116":2}}],["回傳處理完後的密文",{"2":{"53":1}}],["回傳一個區間內的隨機整數",{"2":{"47":1}}],["回傳最後一個執行",{"2":{"42":2}}],["回傳最後一個符合的索引",{"2":{"42":1,"50":1}}],["回傳第一個執行",{"2":{"42":2}}],["回傳第一個符合的索引",{"2":{"42":1,"50":1}}],["回傳",{"2":{"42":3,"50":2}}],["回傳的資料型態是",{"2":{"5":1}}],["簡化版",{"2":{"219":2}}],["簡易網頁伺服器",{"0":{"193":1}}],["簡寫後",{"2":{"58":2}}],["簡寫前",{"2":{"58":2}}],["簡寫範例",{"2":{"58":1}}],["具名",{"2":{"192":1}}],["具名一次匯入",{"2":{"192":1}}],["具名個別匯入",{"2":{"192":1}}],["具名匯出",{"0":{"192":1}}],["具名匯出時必須使用宣告變數的寫法",{"2":{"190":1}}],["匯入",{"0":{"191":1,"192":1}}],["匯入的變數是",{"2":{"190":1}}],["匯入時寫相對路徑",{"2":{"190":1}}],["匯出各",{"2":{"113":1}}],["匯出路由設定",{"2":{"112":1}}],["匯出",{"2":{"111":1}}],["電源供應器",{"2":{"190":4}}],["硬碟",{"2":{"190":4}}],["記憶體",{"2":{"190":4}}],["記錄了這個",{"2":{"188":1}}],["主題顏色",{"2":{"258":1}}],["主題顏色樣式",{"2":{"230":1}}],["主題設定",{"2":{"231":1}}],["主題檔案",{"2":{"230":1}}],["主要檔案結構",{"2":{"230":1}}],["主機板",{"2":{"190":4}}],["主體",{"0":{"109":1},"2":{"109":1}}],["版",{"2":{"251":1}}],["版面名稱",{"2":{"216":1}}],["版權",{"2":{"188":1}}],["版本控管就像時光機",{"2":{"207":1}}],["版本",{"2":{"188":1}}],["版本以及其他使用者資訊",{"2":{"139":1}}],["殭屍流水號",{"2":{"185":1}}],["遊戲查價機器人",{"2":{"205":1}}],["遊戲倒數計時",{"2":{"185":1}}],["遊戲時間",{"2":{"185":1}}],["遊戲結束後會顯示得分",{"2":{"39":1}}],["隱藏標準瀏覽器",{"2":{"258":1}}],["隱藏所有瀏覽器",{"2":{"258":1}}],["隱藏div",{"2":{"183":1}}],["隱藏背面",{"2":{"178":1}}],["綁定輸入欄位的",{"2":{"237":1}}],["綁定屬性",{"2":{"237":1}}],["綁定",{"2":{"182":1,"237":2,"241":1}}],["綁定事件",{"2":{"155":1}}],["行內樣式",{"2":{"181":1}}],["行內事件",{"0":{"154":1}}],["盡量不要使用箭頭函式",{"2":{"180":1}}],["往上層找直到選擇器間的東西",{"2":{"180":2}}],["往下數",{"2":{"47":1}}],["篩選不符合條件的元素",{"2":{"180":2}}],["篩選符合條件的元素",{"2":{"180":2}}],["美化你的遊戲",{"2":{"178":1,"185":1}}],["美化你的時鐘",{"2":{"144":1}}],["過濾可以使用",{"2":{"242":1}}],["過濾檔案類型",{"2":{"101":1}}],["過關",{"2":{"178":1}}],["過關判斷",{"2":{"178":1}}],["決定每張的數字",{"2":{"178":1}}],["空白時是黑色",{"2":{"242":1}}],["空白是黑色",{"2":{"242":1}}],["空一格放內文",{"2":{"226":1}}],["空間內",{"2":{"178":1}}],["空值",{"2":{"90":1}}],["翻回來",{"2":{"178":1}}],["翻牌",{"2":{"178":1}}],["翻牌記憶小遊戲",{"0":{"177":1},"1":{"178":1}}],["翻譯成程式就是",{"2":{"30":1}}],["半透明",{"2":{"175":2}}],["僅能修改值為數字的",{"2":{"175":1}}],["僅作用在",{"2":{"89":1}}],["至指定透明度",{"2":{"175":1}}],["至",{"2":{"175":2}}],["至原本高度",{"2":{"175":2}}],["滑出了",{"2":{"175":1}}],["滑出",{"2":{"175":3}}],["滑入了",{"2":{"175":1}}],["滑入",{"2":{"175":3}}],["滑鼠在元素內的座標",{"2":{"157":1}}],["滑鼠在螢幕的座標",{"2":{"157":1}}],["滑鼠在整個網頁的座標",{"2":{"157":1}}],["滑鼠在瀏覽器視窗的座標",{"2":{"157":1}}],["滑鼠類事件可以取得滑鼠座標",{"2":{"157":1}}],["滑鼠點輸入欄位外",{"2":{"153":1}}],["滑鼠點到輸入欄位",{"2":{"153":1}}],["滑鼠點擊",{"2":{"65":1,"153":1}}],["滑鼠移開",{"2":{"153":1}}],["滑鼠移到",{"2":{"153":1}}],["透明度",{"2":{"175":1}}],["透過標籤名稱抓取所有元素",{"2":{"147":1}}],["透過簡易圓形時鐘熟悉",{"2":{"142":1,"144":1}}],["透過",{"2":{"93":1,"147":4}}],["淡入了",{"2":{"175":1}}],["淡入",{"2":{"175":3}}],["淡出了",{"2":{"175":1}}],["淡出或淡入至指定透明度",{"2":{"175":1}}],["淡出",{"2":{"175":3}}],["停止",{"2":{"175":1}}],["停止動畫",{"2":{"175":2}}],["停止觀察某元素",{"2":{"165":2,"166":1}}],["停止觀察",{"2":{"164":1,"165":2,"166":1}}],["斜體",{"2":{"172":1}}],["白底黑字非常難閱讀",{"2":{"172":1}}],["把資料從電腦上傳到遠端",{"2":{"208":1}}],["把資料從遠端下載到電腦",{"2":{"208":1}}],["把資料放進陣列前面",{"2":{"41":1}}],["把資料放進陣列後面",{"2":{"41":1}}],["把東西放到指定的後面",{"2":{"181":2}}],["把東西放到指定的前面",{"2":{"181":2}}],["把你找的方法也一起傳過來",{"2":{"172":1}}],["附上你的程式碼以及錯誤訊息",{"2":{"172":1}}],["描述越詳細越好",{"2":{"172":1}}],["該開啟的有沒有開啟",{"2":{"172":1}}],["實際跑跑看就知道行不行了",{"2":{"172":1}}],["實作一個線上購物網站",{"2":{"102":1}}],["老師們也不是",{"2":{"172":1}}],["老師們也不是電腦",{"2":{"172":1}}],["老師們不會通靈",{"2":{"172":1}}],["線上筆記",{"2":{"171":1}}],["思考想要開發的項目",{"2":{"170":1}}],["學到的東西要立刻實作加深印象",{"2":{"170":1}}],["學習",{"2":{"211":1}}],["學習版本控管觀念",{"2":{"206":1}}],["學習程式不像以往學校考試",{"2":{"170":1}}],["學習方法",{"0":{"170":1}}],["輔助程式開發",{"2":{"170":1}}],["輔15級",{"2":{"35":2,"36":1}}],["輔12級",{"2":{"35":2,"36":1}}],["隨機",{"2":{"185":1}}],["隨機取一個整數",{"2":{"47":1}}],["隨機取小數",{"2":{"46":1}}],["隨時能查閱網路上的資料",{"2":{"170":1}}],["課程介紹",{"0":{"169":1}}],["單檔案元件",{"0":{"266":1},"1":{"267":1}}],["單元測試",{"2":{"261":1}}],["單純處理",{"2":{"257":1}}],["單位為毫秒",{"2":{"166":1}}],["單筆新增",{"2":{"124":1}}],["觀察元素",{"2":{"166":1}}],["觀察到變更時執行的",{"2":{"165":1}}],["表示以瀏覽器的可視窗口作為依據",{"2":{"166":2}}],["表單送出時",{"2":{"153":1}}],["表單欄位輸入時",{"2":{"153":1}}],["邊框",{"2":{"165":1}}],["調整觀察元素的寬高計算方式",{"2":{"165":1}}],["被建立的時間開始計算",{"2":{"166":1}}],["被移除的節點",{"2":{"164":2}}],["被新增的節點",{"2":{"164":2}}],["被覆寫",{"2":{"55":1}}],["延伸閱讀",{"2":{"172":1}}],["延伸作業內容",{"2":{"162":1}}],["延遲單位為毫秒",{"2":{"83":1}}],["延遲",{"2":{"83":1}}],["延遲一段時間後執行一次",{"2":{"83":1}}],["清單列出勝負紀錄",{"2":{"162":1}}],["清除",{"2":{"84":1}}],["石頭和布",{"2":{"162":1}}],["應用範例",{"0":{"161":1,"167":1,"176":1}}],["應該放在這裡",{"2":{"69":1}}],["圖片輪播範例",{"2":{"176":1}}],["圖片",{"2":{"167":1,"268":1}}],["圖片等資源下載中",{"2":{"160":1}}],["圖片取自",{"2":{"88":1}}],["阻止事件預設動作",{"2":{"158":1}}],["阻止事件的發生",{"2":{"153":1}}],["阻止",{"2":{"158":1}}],["看看會出現什麼",{"2":{"159":1}}],["看看你按哪個鍵",{"2":{"157":1}}],["看電影",{"2":{"32":1}}],["增加事件監聽器至元素",{"2":{"156":1}}],["按",{"2":{"242":1}}],["按鈕點下去後電腦隨機出拳",{"2":{"162":1}}],["按鈕",{"2":{"155":5}}],["按鍵盤等等",{"2":{"152":1}}],["複製程式碼",{"2":{"271":2}}],["複製一分別人的repo到自己的帳號",{"2":{"210":1}}],["複製一份資料",{"2":{"24":1}}],["複製",{"2":{"208":1}}],["複製時",{"2":{"153":1}}],["頁面內容",{"2":{"216":1}}],["頁面關閉時觸發事件",{"2":{"153":1}}],["頁面載入時觸發事件",{"2":{"153":1}}],["做到下面這些事",{"2":{"153":1}}],["做更詳細的判斷",{"2":{"37":1}}],["概念",{"0":{"153":1}}],["偵測",{"2":{"240":1,"241":5}}],["偵測變更",{"2":{"219":2}}],["偵測網頁上發生的事件",{"2":{"152":1}}],["偵測使用者操作範例",{"2":{"65":1}}],["事件為",{"2":{"242":1}}],["事件的話",{"2":{"237":1}}],["事件有",{"2":{"237":1}}],["事件名稱",{"2":{"182":2}}],["事件運作方式",{"2":{"159":1}}],["事件冒泡指的是事件逐層往上傳遞",{"2":{"159":1}}],["事件冒泡",{"0":{"159":1}}],["事件監聽相比事件綁定更為彈性",{"2":{"156":1}}],["事件監聽",{"0":{"156":1}}],["事件綁定",{"0":{"155":1}}],["事件裡的",{"2":{"154":1}}],["事件",{"0":{"152":1,"182":1},"1":{"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1},"2":{"153":1,"237":3}}],["顏色為藍色",{"2":{"151":1}}],["剩餘",{"2":{"151":1,"185":1}}],["搬移範例",{"2":{"149":1}}],["舊元素",{"2":{"149":1}}],["新元素",{"2":{"149":2}}],["新增功能",{"2":{"242":1}}],["新增欄位邊框小於兩個字時是紅色",{"2":{"242":1}}],["新增一個文字節點",{"2":{"150":1}}],["新增一個元素",{"2":{"149":1}}],["新增一個名為",{"2":{"95":1}}],["新增值",{"2":{"120":1}}],["新增到使用者的訂單陣列",{"2":{"114":1}}],["新增資料",{"2":{"114":2}}],["新增資源",{"2":{"8":1}}],["新增使用者資料",{"2":{"114":1}}],["新增",{"0":{"114":1,"124":1},"2":{"117":1,"148":2,"181":2,"237":1}}],["切入點",{"2":{"188":1}}],["切換分支",{"2":{"208":1}}],["切換滑入或滑出",{"2":{"175":1}}],["切換淡入或淡出",{"2":{"175":1}}],["切換",{"2":{"148":1}}],["切割",{"0":{"51":1}}],["切割陣列",{"2":{"41":1}}],["比",{"2":{"171":1}}],["比用",{"2":{"148":1}}],["比較需要注意的生命週期有",{"2":{"239":1}}],["比較特別的是",{"2":{"209":1}}],["比較",{"0":{"75":1}}],["比較運算子是用來比較兩個值的大小",{"2":{"31":1}}],["比較運算子",{"0":{"31":1}}],["比較重要的設定有",{"2":{"10":1}}],["偽元素",{"2":{"148":1}}],["串連語法範例",{"2":{"147":1}}],["抓取元素",{"2":{"180":1}}],["抓取",{"0":{"180":1}}],["抓取所有元素",{"2":{"147":1}}],["抓取一個元素",{"2":{"147":1}}],["q=85",{"2":{"144":1}}],["quality",{"2":{"261":1}}],["quasar",{"2":{"253":1}}],["quantity",{"2":{"111":1,"116":2}}],["quos",{"2":{"167":8}}],["quot",{"2":{"19":2,"38":2,"90":2,"126":8,"148":12,"263":8}}],["quibusdam",{"2":{"167":8}}],["queryselectorall",{"2":{"147":2}}],["queryselector",{"2":{"147":2,"159":2,"167":3}}],["query",{"2":{"117":1,"126":3,"127":2,"256":4}}],["依需求選擇套件及設定",{"2":{"261":1}}],["依需求安裝各類",{"2":{"254":1}}],["依序選擇設定",{"2":{"229":1}}],["依語言格式化輸出",{"2":{"143":1}}],["依語言格式化時間",{"2":{"143":1}}],["依語言格式化日期",{"2":{"143":1}}],["依照字元編碼排序文字",{"2":{"43":1}}],["依照",{"2":{"20":1,"107":1}}],["依照順序取值",{"2":{"20":1}}],["西元日期",{"2":{"143":1}}],["西瓜",{"2":{"41":7}}],["確定要刪除嗎",{"2":{"141":1}}],["確保網頁內容已經解析完畢",{"2":{"69":1}}],["螢幕方向",{"2":{"140":2}}],["螢幕高度",{"2":{"140":2}}],["螢幕寬度",{"2":{"140":2}}],["像是載入狀態",{"2":{"152":1}}],["像是寬度和高度等",{"2":{"140":1}}],["像是開啟頁面",{"2":{"136":1}}],["現代瀏覽器可以做到的事情非常多",{"2":{"139":1}}],["現在也有許多",{"2":{"170":1}}],["現在時間是",{"2":{"143":2}}],["現在我有$",{"2":{"56":2,"57":1,"58":1}}],["現在我有冰淇淋",{"2":{"55":2}}],["現在在執行",{"2":{"41":2}}],["現在你不知道到底會不會拿到零用錢",{"2":{"4":1}}],["負數代表往前幾頁",{"2":{"138":1}}],["負數為",{"2":{"46":1}}],["移動殭屍",{"2":{"185":1}}],["移動到最後",{"2":{"149":1}}],["移動到前面",{"2":{"149":1}}],["移動到目前頁面的相對歷史紀錄",{"2":{"138":2}}],["移除元素內的子元素",{"2":{"149":1}}],["移除元素",{"2":{"149":1}}],["移除",{"2":{"148":2,"181":2,"214":1}}],["移除前後空白",{"2":{"49":1}}],["移除第一個並回傳",{"2":{"41":1}}],["移除最後一個並回傳",{"2":{"41":1}}],["彈出設定",{"2":{"136":1}}],["目錄結構",{"0":{"262":1}}],["目前有很多網站使用這個語法撰寫說明文件或文章",{"2":{"171":1}}],["目前網址",{"2":{"137":2}}],["目前網路上給開發者使用的公開資料大多是物件和陣列的結合",{"2":{"21":1}}],["目標元素的尺寸與座標",{"2":{"166":1}}],["目標元素面積",{"2":{"166":1}}],["目標",{"2":{"136":1}}],["視窗大小",{"2":{"136":2}}],["視窗大小等等",{"2":{"136":1}}],["視窗內部高度",{"2":{"136":1}}],["視窗內部寬度",{"2":{"136":1}}],["視窗外部高度",{"2":{"136":1}}],["視窗外部寬度",{"2":{"136":1}}],["視圖",{"2":{"104":1,"236":1}}],["瀏覽器",{"2":{"258":1}}],["瀏覽器在模組化開發也有一些限制",{"2":{"190":1}}],["瀏覽器物件模型",{"2":{"134":1}}],["瀏覽器識別",{"2":{"10":1}}],["中加入",{"2":{"258":1}}],["中使用",{"2":{"227":1}}],["中按",{"2":{"158":1}}],["中文稱",{"2":{"134":1,"145":1}}],["中午",{"2":{"56":2,"57":1}}],["找出",{"2":{"126":1}}],["找不到資料",{"2":{"115":2,"116":2,"117":4}}],["找不到再往上找全域變數",{"2":{"89":1}}],["找不到",{"2":{"9":1}}],["啟動檔",{"2":{"121":1}}],["啟用",{"2":{"109":1}}],["免安裝",{"0":{"121":1}}],["打包工具的網站",{"2":{"261":1}}],["打包時會自動將",{"2":{"268":1}}],["打包時另存為",{"2":{"256":1}}],["打包時加上",{"2":{"215":1}}],["打包",{"0":{"223":1}}],["打殭屍小遊戲",{"0":{"184":1},"1":{"185":1}}],["打亂",{"2":{"178":1}}],["打開",{"2":{"120":1}}],["打斷迴圈的執行",{"2":{"76":1}}],["價格小於等於",{"2":{"117":1}}],["價格大於等於",{"2":{"117":1}}],["價格為",{"2":{"22":1}}],["商品庫存量",{"2":{"117":1}}],["商品說明",{"2":{"117":1}}],["商品價格",{"2":{"117":1}}],["商品名稱",{"2":{"117":1}}],["去做相對的動畫",{"2":{"175":1}}],["去掉",{"2":{"115":2}}],["去爬山",{"2":{"30":2}}],["伺服器發生錯誤",{"2":{"114":2,"115":3,"116":2,"117":2}}],["伺服器錯誤",{"2":{"9":1,"98":1,"101":1}}],["拒絕不是",{"2":{"114":2,"116":2}}],["資源盡量放在",{"2":{"268":1}}],["資建立",{"2":{"111":1}}],["資料繫結器",{"2":{"236":1}}],["資料",{"2":{"198":1,"219":1,"236":1,"257":1}}],["資料匯入",{"0":{"132":1}}],["資料匯出",{"0":{"131":1}}],["資料管理",{"0":{"130":1},"1":{"131":1,"132":1}}],["資料夾建立一個",{"2":{"220":1}}],["資料夾的檔案",{"2":{"217":1}}],["資料夾的內容不會經過",{"2":{"215":1}}],["資料夾的內容會經過",{"2":{"215":1}}],["資料夾存放這個專案用到的所有套件",{"2":{"189":1}}],["資料夾",{"2":{"121":3,"215":1,"216":1,"265":1,"268":2}}],["資料夾內",{"2":{"121":1}}],["資料夾內各種資料一個",{"2":{"111":1,"112":1,"113":1}}],["資料夾內再依資料區分檔案",{"2":{"107":1}}],["資料欄位",{"2":{"117":1}}],["資料格式為",{"2":{"117":6}}],["資料格式錯誤",{"2":{"114":2}}],["資料格式不符",{"2":{"97":1}}],["資料表名稱必須為複數",{"2":{"111":1}}],["資料表名稱",{"2":{"111":1}}],["資料表的",{"2":{"111":1}}],["資料的路由",{"2":{"109":1}}],["資料的值叫做",{"2":{"19":1}}],["資料顯示",{"2":{"104":1}}],["資料庫規劃",{"0":{"133":1}}],["資料庫連線檔",{"2":{"109":1}}],["資料庫連接",{"2":{"107":1}}],["資料庫",{"0":{"103":1},"1":{"104":1,"105":1,"106":1,"107":1,"108":1,"109":1,"110":1,"111":1,"112":1,"113":1,"114":1,"115":1,"116":1,"117":1}}],["資料傳入",{"2":{"96":1}}],["資料型態分別",{"2":{"90":1}}],["資料型態",{"0":{"90":1}}],["資料型態轉換",{"0":{"52":1}}],["資料型態也不相等",{"2":{"31":1}}],["資料型態也要相同",{"2":{"31":1}}],["資料2",{"2":{"41":2}}],["資料1",{"2":{"41":2}}],["資料處理",{"0":{"40":1,"45":1,"48":1},"1":{"41":1,"42":1,"43":1,"44":1,"46":1,"47":1,"49":1,"50":1,"51":1,"52":1,"53":1}}],["資料類型是文字",{"2":{"111":1}}],["資料類型",{"2":{"10":1}}],["訂單相關",{"2":{"112":1}}],["訂單為陣列",{"2":{"111":1}}],["訂便當",{"2":{"12":1}}],["信箱",{"2":{"229":1}}],["信箱格式錯誤",{"2":{"111":1}}],["信箱已使用",{"2":{"111":1}}],["信箱必填",{"2":{"111":1}}],["歲",{"2":{"111":1}}],["避免瀏覽器快取",{"2":{"268":1}}],["避免上傳",{"2":{"202":1}}],["避免自己混淆",{"2":{"147":1}}],["避免重複",{"2":{"111":1}}],["避免出現錯誤訊息",{"0":{"2":1}}],["必要引用",{"2":{"254":1}}],["必填",{"2":{"175":1}}],["必填欄位",{"2":{"111":1}}],["必須搭配",{"2":{"268":1}}],["必須將資料綁定到",{"2":{"250":1}}],["必須要有",{"2":{"258":2}}],["必須要有下列功能",{"2":{"242":1}}],["必須要另外做設定",{"2":{"190":1}}],["必須先執行",{"2":{"223":1}}],["必須在",{"2":{"221":1}}],["必須大於",{"2":{"111":1}}],["必須以字母開頭",{"2":{"88":1}}],["必須符合兩者",{"2":{"32":1}}],["必須放在最後一個",{"2":{"20":1}}],["查詢條件",{"2":{"127":1}}],["查詢動作",{"2":{"126":1}}],["查詢所有商品",{"2":{"117":1}}],["查詢所有使用者",{"2":{"115":1}}],["查詢單個商品",{"2":{"117":1}}],["查詢單個使用者",{"2":{"115":1}}],["查詢使用者資料",{"2":{"117":1}}],["查詢",{"0":{"115":1,"126":1},"2":{"126":1}}],["查詢時可以一起帶出對應的商品資料",{"2":{"111":1}}],["查看變數的資料型態",{"2":{"90":1}}],["聚合框架",{"0":{"129":1}}],["聚合",{"2":{"111":1}}],["檔名相同",{"2":{"268":1}}],["檔內包含三個部分",{"2":{"266":1}}],["檔並輸入環境設定channel",{"2":{"202":1}}],["檔",{"2":{"111":1,"112":1,"113":1,"220":1,"266":1}}],["檔案路徑",{"2":{"263":2}}],["檔案結尾沒有",{"2":{"220":1}}],["檔案結尾是",{"2":{"220":2}}],["檔案結構",{"0":{"107":1,"230":1}}],["檔案",{"2":{"192":1,"225":1,"258":1,"264":1}}],["檔案太大",{"2":{"101":1}}],["檔案上傳",{"0":{"99":1},"1":{"100":1,"101":1},"2":{"91":1}}],["檔案裡",{"2":{"69":1}}],["路由變數js",{"2":{"256":1}}],["路由連結",{"2":{"256":1}}],["路由",{"0":{"217":1},"2":{"256":2}}],["路徑設定",{"0":{"265":1}}],["路徑可以是檔案或資料夾",{"2":{"225":1}}],["路徑",{"2":{"225":2,"258":1,"268":1}}],["路徑為根目錄",{"2":{"256":1}}],["路徑為",{"2":{"117":6,"256":1}}],["路徑的請求使用",{"2":{"109":1}}],["路人甲",{"2":{"141":1}}],["路人",{"2":{"38":2}}],["允許跨域認證",{"2":{"109":1}}],["允許跨域請求",{"2":{"106":1}}],["允許任何來源網域的請求",{"2":{"109":1}}],["跨域套件",{"2":{"109":1}}],["└──",{"2":{"107":4,"230":5}}],["│",{"2":{"107":3,"230":26}}],["├──",{"2":{"107":5,"230":10}}],["讀取中",{"2":{"160":1}}],["讀取環境設定檔",{"2":{"106":1,"200":1,"202":1}}],["讀取資源",{"2":{"8":1}}],["操作和動畫",{"2":{"184":1}}],["操作的時候要注意",{"2":{"150":1}}],["操作元素的",{"2":{"148":1}}],["操作套件",{"2":{"106":1}}],["操作更新網頁內容",{"2":{"12":1}}],["對事件做出回應",{"2":{"104":1}}],["對於串接",{"2":{"21":1}}],["控制程式流程",{"2":{"104":1}}],["控制器",{"2":{"104":1}}],["模板語法和標籤的",{"2":{"237":1}}],["模組化開發的概念",{"2":{"190":1}}],["模組化",{"0":{"190":1},"1":{"191":1,"192":1}}],["模型",{"2":{"104":1}}],["模擬長時間運算",{"2":{"5":1}}],["架構",{"0":{"195":1,"236":1}}],["架構編寫",{"2":{"104":1}}],["架構圖",{"0":{"104":1}}],["架構的",{"2":{"93":1}}],["購物網",{"0":{"102":1}}],["限制檔案大小為",{"2":{"101":1}}],["限制級",{"2":{"35":2,"36":1}}],["登出",{"0":{"98":1},"2":{"102":1}}],["登入",{"0":{"92":1,"97":1},"1":{"93":1,"94":1,"95":1,"96":1,"97":1,"98":1},"2":{"102":1}}],["登入驗證",{"2":{"91":1,"96":1}}],["登入後跳出成功或失敗動畫",{"2":{"12":1}}],["統一呼叫",{"2":{"96":1}}],["自動編譯部署到",{"2":{"271":1}}],["自動打包部署",{"2":{"258":1}}],["自動引入樣式",{"2":{"230":1}}],["自動產生路由設定",{"2":{"217":1}}],["自動重新啟動",{"2":{"201":1}}],["自訂網站",{"2":{"230":1}}],["自訂元件",{"2":{"230":1}}],["自訂驗證規則",{"2":{"111":1}}],["自訂驗證錯誤訊息需要寫成",{"2":{"96":1}}],["自訂錯誤訊息",{"2":{"111":5}}],["自己設計",{"2":{"39":1}}],["初始狀態",{"2":{"257":1}}],["初始",{"2":{"208":1}}],["初始化專案時會自動產生",{"2":{"188":1}}],["初始化",{"2":{"95":1}}],["初始值是",{"2":{"219":3}}],["初始值可不設",{"2":{"43":1}}],["初始值",{"2":{"43":1,"71":1}}],["帳號",{"2":{"205":1}}],["帳號已使用",{"2":{"114":1}}],["帳號資料欄位名稱",{"2":{"95":1}}],["帳號是",{"2":{"50":4}}],["標題區",{"2":{"271":1}}],["標題",{"2":{"231":1}}],["標題模板",{"2":{"222":1}}],["標記驗證完成",{"2":{"95":1}}],["標籤引用",{"2":{"268":1}}],["標籤內即可",{"2":{"250":1}}],["標籤內的東西會在沒有使用插槽時顯示",{"2":{"250":1}}],["標籤內迴圈html",{"2":{"237":1}}],["標籤內判斷式",{"2":{"237":1}}],["標籤只剩名字",{"2":{"226":1}}],["標籤只支援",{"2":{"8":1}}],["標籤屬性",{"2":{"181":1}}],["標籤",{"2":{"147":1,"250":2}}],["標籤名",{"2":{"147":1,"149":1,"231":1}}],["標籤通常位在",{"2":{"69":1}}],["標籤使用",{"2":{"69":1}}],["解析完檔案",{"2":{"160":1}}],["解析傳入的資料",{"2":{"109":1}}],["解壓縮",{"2":{"121":1}}],["解碼後的資料",{"2":{"95":1}}],["解構賦值可以把陣列或物件中的資料解開擷取成為獨立變數",{"2":{"20":1}}],["解構賦值",{"0":{"20":1},"2":{"20":2}}],["策略",{"2":{"95":1}}],["設定社群分享資訊",{"2":{"258":1}}],["設定html",{"2":{"258":1}}],["設定jsimport",{"2":{"258":1}}],["設定路由",{"2":{"256":1}}],["設定可能會因主題而異",{"2":{"231":1,"232":1}}],["設定的",{"2":{"222":1}}],["設定各自的",{"2":{"222":1}}],["設定機器人監聽",{"2":{"203":1}}],["設定機器人",{"2":{"203":1}}],["設定子元素在",{"2":{"178":1}}],["設定觸發的比例門檻",{"2":{"166":2}}],["設定參數",{"2":{"166":1}}],["設定以",{"2":{"165":1}}],["設定觀察元素的寬高計算方式",{"2":{"165":1}}],["設定觀察元素",{"2":{"164":1,"165":1}}],["設定檔inidbpath=data",{"2":{"121":1}}],["設定檔會在",{"2":{"120":1}}],["設定環境變數",{"2":{"120":1}}],["設定資料庫",{"0":{"110":1}}],["設定跨域套件",{"2":{"109":1}}],["設定",{"0":{"95":1},"2":{"101":1,"127":1,"164":1,"165":1,"166":2,"216":1,"219":2,"222":1,"231":2,"255":1,"258":2,"265":1}}],["安裝核心套件npm",{"2":{"254":1}}],["安裝為開發環境套件",{"2":{"200":1}}],["安裝所有套件",{"2":{"189":1}}],["安裝目錄",{"2":{"120":1}}],["安裝版",{"0":{"120":1}}],["安裝",{"0":{"119":1,"214":1,"225":1,"229":1,"261":1},"1":{"120":1,"121":1,"122":1},"2":{"121":1,"200":2,"214":2,"218":1,"256":1,"257":1,"258":1,"263":3}}],["安裝套件",{"0":{"94":1,"100":1,"106":1,"200":1}}],["安全性不高",{"2":{"68":1}}],["簽發後就無法撤銷",{"2":{"93":1}}],["千萬不要將隱私資料存在",{"2":{"93":1}}],["漸漸興起",{"2":{"93":1}}],["驗證程式碼並保持風格一致json",{"2":{"200":1}}],["驗證使用者輸入內容",{"2":{"153":1}}],["驗證",{"2":{"95":1,"106":1,"111":1}}],["驗證規定日趨嚴格",{"2":{"93":1}}],["驗證成功",{"2":{"3":1}}],["近年瀏覽器對第三方",{"2":{"93":1}}],["介紹影片",{"0":{"234":1}}],["介紹",{"0":{"93":1,"135":1,"146":1,"207":1},"1":{"208":1}}],["布林的資料型態",{"2":{"240":1}}],["布林值",{"2":{"90":1}}],["布林等資料型態傳遞方式",{"2":{"24":1}}],["雙引號",{"2":{"90":1}}],["上層使用",{"2":{"249":1}}],["上層第一個符合選擇器的元素",{"2":{"180":1}}],["上一層",{"2":{"180":2}}],["上一頁",{"2":{"138":2}}],["上面所有的",{"2":{"150":1}}],["上傳錯誤",{"2":{"101":1}}],["上",{"2":{"89":1}}],["上卦為",{"2":{"60":1}}],["規劃並建立一個商品庫存",{"2":{"117":1}}],["規則和",{"2":{"89":1}}],["規範標準不一",{"2":{"68":1}}],["同一層的其他東西",{"2":{"180":2}}],["同一層後面直到選擇器間的東西",{"2":{"180":2}}],["同一層後面所有",{"2":{"180":2}}],["同一層後一個",{"2":{"180":2}}],["同一層前面直到選擇器間的東西",{"2":{"180":2}}],["同一層前面所有",{"2":{"180":2}}],["同一層前一個",{"2":{"180":2}}],["同一個",{"2":{"89":1}}],["同時發生",{"2":{"5":1}}],["賦值或修改值",{"2":{"89":1}}],["जावास्क्रिप्ट",{"2":{"88":2}}],["〱〱〱〱",{"2":{"88":2}}],["ħĕľļŏ",{"2":{"88":2}}],["ᾡ",{"2":{"88":2}}],["無限滾動",{"2":{"167":1}}],["無法取得",{"2":{"241":1}}],["無法存取",{"2":{"239":1}}],["無法立即取得資料",{"2":{"219":2}}],["無法檢視",{"2":{"207":1}}],["無法偵測圖片等資源的載入進度",{"2":{"160":1}}],["無法修改",{"2":{"148":1}}],["無法使用",{"2":{"147":1}}],["無瑕的程式碼",{"2":{"88":1}}],["無條件捨去",{"2":{"46":1}}],["無條件進位",{"2":{"46":1}}],["駝峰式大小寫",{"2":{"88":1}}],["×",{"2":{"87":1}}],["若使用",{"2":{"267":1}}],["若使用方法一安裝",{"2":{"264":1}}],["若名稱為",{"2":{"257":1}}],["若需要預設值",{"2":{"249":1}}],["若需修改顏色",{"2":{"175":1}}],["若屬性是",{"2":{"241":1}}],["若是有",{"2":{"226":1}}],["若沒設定則是使用",{"2":{"222":1}}],["若沒有要使用",{"2":{"214":1}}],["若不提供",{"2":{"219":1}}],["若無此檔案須自己建立",{"2":{"216":1}}],["若要存取的元素上有使用",{"2":{"242":1}}],["若要在",{"2":{"190":1,"238":1}}],["若要使用其他效果",{"2":{"175":1}}],["若要拒絕請求則是",{"2":{"109":1}}],["若設定為",{"2":{"166":2}}],["若",{"2":{"87":1,"115":2,"116":2,"117":2}}],["若有錯誤則執行",{"2":{"4":1}}],["給呼叫元件的地方使用",{"2":{"250":1}}],["給資料一個名字",{"2":{"86":1}}],["給這個",{"2":{"55":1}}],["都屬於",{"2":{"135":1}}],["都會需要用",{"2":{"86":1}}],["都是",{"2":{"35":1}}],["重命名",{"2":{"192":2}}],["重設時間及分數",{"2":{"185":1}}],["重複宣告會出現錯誤",{"2":{"89":1}}],["重複計時器",{"0":{"84":1}}],["重新取得資料",{"2":{"219":2}}],["重新載入頁面",{"2":{"137":2}}],["重新命名",{"2":{"20":1}}],["重新導向",{"2":{"9":1}}],["定義一個",{"2":{"257":1}}],["定義的指令",{"2":{"193":1}}],["定義的結構",{"2":{"111":1}}],["定義",{"2":{"83":1}}],["定義方式簡寫",{"2":{"27":1}}],["定義方式",{"2":{"27":1}}],["經過該時間後在網頁上顯示",{"2":{"85":1}}],["經過",{"2":{"83":4}}],["秒數減",{"2":{"185":1}}],["秒數不能變負數",{"2":{"151":1}}],["秒鐘",{"2":{"143":1}}],["秒囉",{"2":{"83":4}}],["秒",{"2":{"83":1,"151":1,"185":1}}],["秒`",{"2":{"5":1}}],["計算相交時的偏移量",{"2":{"166":2}}],["計算後將結果回傳",{"2":{"60":1}}],["計時器可在一段時間後執行",{"2":{"82":1}}],["計時器",{"0":{"82":1},"1":{"83":1,"84":1,"85":1}}],["引用jsimport",{"2":{"256":1,"257":1,"267":1}}],["引用節省資源js",{"2":{"254":1}}],["引用資源",{"0":{"215":1,"268":1}}],["引用套件和要使用的",{"2":{"254":1}}],["引用套件",{"2":{"203":1}}],["引用使用者資料庫",{"2":{"113":1}}],["引用插件",{"2":{"110":1}}],["引用",{"2":{"96":1,"110":2,"112":1,"193":1,"221":1,"257":1}}],["引號裡面的文字不只可以換行",{"2":{"81":1}}],["引擎打造",{"2":{"66":1}}],["原本圖片是科技高中校長",{"2":{"183":1}}],["原理是在指定的時間內將",{"2":{"175":1}}],["原寫法",{"2":{"80":1}}],["原始寫法",{"2":{"20":2}}],["遞減",{"2":{"79":1,"175":3}}],["遞增",{"2":{"79":1,"175":1}}],["遞迴",{"0":{"61":1}}],["稱為",{"2":{"79":1}}],["餘數",{"2":{"79":1}}],["乘號",{"2":{"79":1}}],["減少程式碼數量",{"2":{"224":1}}],["減少了讀取時間",{"2":{"12":1}}],["減號",{"2":{"79":1}}],["跟數學的四則運算一樣",{"2":{"79":1}}],["跟變數宣告一樣",{"2":{"55":1}}],["運算子用來做加減乘除等運算",{"2":{"78":1}}],["運算子",{"0":{"78":1},"1":{"79":1,"80":1,"81":1}}],["運算的結果會是布林值",{"2":{"31":1,"32":1}}],["天即可",{"2":{"77":1}}],["天的饅頭",{"2":{"25":1}}],["顯示模式",{"2":{"258":1}}],["顯示範圍",{"2":{"258":1}}],["顯示路由元件",{"2":{"256":1}}],["顯示div",{"2":{"183":1}}],["顯示",{"2":{"162":1}}],["顯示輸入框",{"2":{"141":1}}],["顯示確認框",{"2":{"141":1}}],["顯示訊息框",{"2":{"141":1}}],["顯示瀏覽器內建的對話框",{"2":{"141":1}}],["顯示欄位js",{"2":{"126":1}}],["顯示所有資料庫",{"2":{"126":1}}],["顯示索引",{"2":{"125":1}}],["顯示使用者輸入的是該年的第幾天",{"2":{"77":1}}],["顯示在網頁上",{"2":{"47":1}}],["日期區和版權區需要製作成元件",{"2":{"271":1}}],["日",{"2":{"77":1,"143":1}}],["日本",{"2":{"36":1}}],["日本日文",{"2":{"36":3}}],["月份",{"2":{"143":1}}],["月",{"2":{"77":1}}],["☆★★★★★★★☆",{"2":{"77":1}}],["☆☆★★★★★☆☆",{"2":{"77":1}}],["☆☆☆★★★☆☆☆",{"2":{"77":1}}],["☆☆☆☆★☆☆☆☆",{"2":{"77":1}}],["共經過多少公尺",{"2":{"77":1}}],["公尺高度自由落下",{"2":{"77":1}}],["太小等提示訊息",{"2":{"77":1}}],["試試看自己寫一個猜數字遊戲",{"2":{"77":1}}],["試試看自己寫一個迴圈",{"2":{"71":1}}],["才執行",{"2":{"79":2}}],["才能控制到指定的迴圈",{"2":{"76":1}}],["才會結束",{"2":{"73":1}}],["多筆新增",{"2":{"124":1}}],["多層迴圈時",{"2":{"76":2}}],["多條件式",{"0":{"34":1}}],["跳頁",{"2":{"137":1}}],["跳過這次迴圈",{"2":{"76":1}}],["跳出錯誤訊息",{"2":{"53":1}}],["差異",{"2":{"75":1}}],["適合不確定次數",{"2":{"75":1}}],["適合不確定次數的迴圈",{"2":{"75":1}}],["適合固定次數的迴圈",{"2":{"23":1,"75":1}}],["次",{"2":{"114":1,"244":1}}],["次反彈多高",{"2":{"77":1}}],["次落地時",{"2":{"77":1}}],["次`",{"2":{"73":1}}],["次方",{"2":{"46":2}}],["檢查是否觸發觀察者",{"2":{"165":2}}],["檢查是否有包含尋找文字",{"2":{"50":1}}],["檢查條件",{"2":{"73":1,"74":1}}],["先將網頁內容渲染好後才傳送給使用者",{"2":{"213":1}}],["先自己檢查該設定的有沒有設",{"2":{"172":1}}],["先自己檢查過沒有錯字",{"2":{"172":1}}],["先看過說明文件",{"2":{"172":1}}],["先看過錯誤訊息",{"2":{"172":1}}],["先搜尋過錯誤的解決方法",{"2":{"172":1}}],["先搜尋過錯誤訊息是什麼意思",{"2":{"172":1}}],["先做的用",{"2":{"79":1}}],["先乘除後加減",{"2":{"79":1}}],["先執行程式碼後才判斷要不要執行下一次",{"2":{"74":1}}],["先判斷是否符合條件",{"2":{"73":1}}],["先在",{"2":{"5":1}}],["綠色值都是0",{"2":{"71":1}}],["色碼為",{"2":{"71":1}}],["★★★★★★★★★",{"2":{"77":1}}],["★★★★★",{"2":{"77":1}}],["★★★★",{"2":{"77":1}}],["★★★",{"2":{"77":1}}],["★★",{"2":{"77":1}}],["★",{"2":{"71":2,"77":1}}],["意思是索引",{"2":{"71":1}}],["\\t",{"2":{"71":2}}],["達到指定條件才會結束",{"2":{"70":1}}],["括號裡面放的是訊息文字",{"2":{"69":1}}],["繼續處理網頁",{"2":{"69":2}}],["弱型別語言",{"2":{"68":1}}],["號運算子",{"2":{"81":1}}],["號不只可以做數學運算",{"2":{"68":1}}],["號同學的成績",{"2":{"21":2}}],["程式設計小遊戲",{"0":{"173":1}}],["程式學習五步驟",{"2":{"170":1}}],["程式學習三大原則",{"2":{"170":1}}],["程式語言和以往學校的國英數不一樣",{"2":{"170":1}}],["程式語言保留字無法當作變數名稱",{"2":{"88":1}}],["程式英文",{"2":{"88":1}}],["程式就像數學的代數一樣",{"2":{"86":1}}],["程式在執行時會自動補上",{"2":{"68":1}}],["程式結尾可以不加",{"2":{"68":1}}],["程式碼標記等",{"2":{"172":1}}],["程式碼和一般的文章不同",{"2":{"172":1}}],["程式碼排版的縮排空格也算是",{"2":{"150":1}}],["程式碼必須要搭配",{"2":{"69":1}}],["程式碼",{"2":{"37":1,"47":1,"154":1,"266":1}}],["缺點",{"0":{"68":1}}],["擴充性高",{"2":{"66":1}}],["開頭代表",{"2":{"268":2}}],["開頭的路徑指向",{"2":{"265":1}}],["開頭的檔名代表路由參數變數名稱",{"2":{"217":1}}],["開啟伺服器",{"2":{"223":1}}],["開啟開發伺服器",{"2":{"214":1}}],["開放資料",{"0":{"194":1},"1":{"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1}}],["開關",{"2":{"148":1}}],["開新網址",{"2":{"136":1}}],["開發完後使用",{"2":{"270":1}}],["開發工具可以使用單檔案元件",{"2":{"266":1}}],["開發工具",{"2":{"259":1,"261":1}}],["開發用指令",{"2":{"201":1}}],["開發環境使用套件",{"2":{"188":1}}],["開發的專案套件佔了空間一大半",{"2":{"68":1}}],["開發跨平台應用程式",{"2":{"67":1}}],["開發網頁後端",{"2":{"66":1}}],["開始畫面網址",{"2":{"258":1}}],["開始倒數",{"2":{"185":1}}],["開始倒數到",{"2":{"85":1}}],["開始遊戲",{"2":{"185":1}}],["開始數",{"2":{"60":1}}],["開始只要往下數一個字母就是",{"2":{"47":1}}],["開始位置",{"2":{"41":2,"51":3}}],["開始往下執行",{"2":{"36":1}}],["開始",{"2":{"18":1,"35":1,"37":1,"47":1,"71":1,"73":1,"74":1,"143":2}}],["點兩下的事件為",{"2":{"242":1}}],["點開始按鈕時",{"2":{"185":1}}],["點擊時可以刪除那個按鈕的項目",{"2":{"183":1}}],["點擊燈泡來開關這盞燈",{"2":{"65":1}}],["點按鈕換顯示的div",{"2":{"183":1}}],["點按鈕換文字",{"2":{"183":1}}],["點按鈕換圖片",{"2":{"183":1}}],["點按鈕時切換顯示內容",{"2":{"183":1}}],["點按鈕會將輸入欄位的字新增到清單",{"2":{"183":1}}],["點按鈕後換成書曼",{"2":{"183":1}}],["點按鈕修改",{"2":{"164":1,"165":1}}],["點點看紅色和藍色",{"2":{"159":1}}],["點連結不會跳頁",{"2":{"158":1}}],["點",{"2":{"158":1}}],["點我看時間",{"2":{"154":2}}],["點我",{"2":{"154":1,"246":1}}],["點我改變文字顏色",{"2":{"65":1}}],["點我改變連結網址",{"2":{"65":1}}],["點我去",{"2":{"65":1}}],["點我修改文字",{"2":{"65":1}}],["樣式名",{"2":{"148":1}}],["樣式範例",{"2":{"65":1}}],["樣式",{"2":{"65":1,"230":1}}],["屬性的話裡面的",{"2":{"266":1}}],["屬性html",{"2":{"237":1}}],["屬性可以將資料以",{"2":{"237":1}}],["屬性太多時可以換行",{"2":{"226":1}}],["屬性包在標籤後的",{"2":{"226":1}}],["屬性指定的網址",{"2":{"158":1}}],["屬性名",{"2":{"148":4}}],["屬性引入",{"2":{"69":1}}],["屬性範例",{"2":{"65":1}}],["屬性",{"2":{"65":1,"175":1,"231":1,"237":1}}],["前使用",{"2":{"247":1}}],["前置作業",{"0":{"105":1,"196":1},"1":{"106":1,"107":1,"197":1,"198":1}}],["前端的使用方式",{"0":{"69":1}}],["前端功能",{"0":{"65":1}}],["前面的判斷式",{"2":{"35":1}}],["認識",{"0":{"64":1,"186":1},"1":{"65":1,"66":1,"67":1,"68":1,"69":1,"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1},"2":{"186":1,"233":1}}],["認識語法",{"0":{"30":1}}],["提示",{"2":{"242":1}}],["提出建議與討論",{"2":{"210":1}}],["提交",{"2":{"208":1}}],["提問的智慧",{"2":{"172":1}}],["提高可用性",{"2":{"104":1}}],["提取",{"2":{"95":1}}],["提升",{"0":{"63":1}}],["提供",{"2":{"117":1}}],["提供最小整數和最大整數",{"2":{"47":1}}],["提供了許多數學運算功能",{"2":{"46":1}}],["累加範例",{"2":{"61":1}}],["卜問出來的卦即是離下震上的雷火豐卦",{"2":{"60":1}}],["除非遇到下列情況",{"2":{"268":1}}],["除非有特殊用途",{"2":{"88":1}}],["除號",{"2":{"79":1}}],["除了這個以外",{"2":{"211":1}}],["除了",{"2":{"209":1}}],["除了做數學運算外",{"2":{"78":1}}],["除了練習程式外",{"2":{"32":1}}],["除以",{"2":{"60":3,"80":1}}],["坤為地",{"2":{"60":1}}],["坤八",{"2":{"60":1}}],["艮為山",{"2":{"60":1}}],["艮七",{"2":{"60":1}}],["坎為水",{"2":{"60":1}}],["坎六",{"2":{"60":1}}],["巽為風",{"2":{"60":1}}],["巽五",{"2":{"60":1}}],["震",{"2":{"60":1}}],["震卦",{"2":{"60":1}}],["震為雷",{"2":{"60":1}}],["震四",{"2":{"60":1}}],["離開職訓進到公司後",{"2":{"172":1}}],["離開動作",{"2":{"71":1}}],["離",{"2":{"60":1}}],["離卦",{"2":{"60":1}}],["離為火",{"2":{"60":1}}],["離三",{"2":{"60":1}}],["兌為澤",{"2":{"60":1}}],["兌二",{"2":{"60":1}}],["乾為天",{"2":{"60":1}}],["八卦順序為乾一",{"2":{"60":1}}],["各數字算完的餘數照八卦的順序選取卦",{"2":{"60":1}}],["各種處理文字的語法",{"2":{"48":1}}],["媽媽想知道",{"2":{"60":1}}],["再點一下換成校長",{"2":{"183":1}}],["再繼續處理資料",{"2":{"96":1}}],["再加上",{"2":{"77":1}}],["再下一個數字是",{"2":{"60":1}}],["再輸入數字密鑰",{"2":{"53":1}}],["某些網頁元素有預設動作",{"2":{"158":1}}],["某些月份的天數是",{"2":{"77":2}}],["某天媽媽請他從",{"2":{"60":1}}],["某國家發生通貨膨脹",{"2":{"25":1}}],["組合",{"2":{"111":1}}],["組合完成的訊息",{"2":{"59":1}}],["組合判斷式",{"2":{"34":1}}],["物品",{"2":{"59":4}}],["物件型態",{"2":{"240":1}}],["物件讓你可以存取和操作瀏覽器的視窗",{"2":{"136":1}}],["物件內箭頭函式定義方式",{"2":{"27":1}}],["物件內",{"2":{"27":2}}],["物件內的值是一般資料型態",{"2":{"24":1}}],["物件裡面可以用",{"2":{"27":1}}],["物件裡面的值除了可以是一般的文字",{"2":{"26":1}}],["物件中的",{"0":{"27":1}}],["物件導向",{"0":{"26":1},"1":{"27":1,"28":1},"2":{"26":1}}],["物件迴圈範例",{"2":{"23":1}}],["物件範例",{"2":{"22":1}}],["物件和陣列的資料傳遞方式",{"2":{"24":1}}],["物件和",{"2":{"21":1}}],["物件無法直接使用",{"2":{"19":1}}],["物件保存了一個東西的不同種資料",{"2":{"19":1}}],["物件",{"0":{"19":1,"157":1},"2":{"90":1,"135":2,"237":1}}],["物件是一個東西的多種不同屬性的集合",{"2":{"17":1}}],["物件程式碼",{"2":{"4":1}}],["早安",{"2":{"59":5}}],["早上",{"2":{"56":3,"57":2,"58":2,"59":2}}],["早上好",{"2":{"55":2}}],["格式js",{"2":{"117":1}}],["格式",{"2":{"115":2,"116":2,"117":4}}],["格式不是",{"2":{"115":2,"116":2,"117":2}}],["格式不符",{"2":{"101":1,"114":2,"116":2}}],["格式編寫的",{"2":{"59":1}}],["格式為",{"2":{"39":1}}],["包裝了",{"2":{"219":2}}],["包括使用者行為和資料改變",{"2":{"104":1}}],["包起來的區塊",{"2":{"89":1}}],["包起來",{"2":{"58":1,"79":1}}],["包含圖片",{"2":{"250":1}}],["包含了訊息的類型",{"2":{"203":1}}],["包含了事件的資訊",{"2":{"157":1}}],["包含了所有東西",{"2":{"150":1}}],["包含了瀏覽器名稱",{"2":{"139":1}}],["包含文字",{"2":{"150":1}}],["包含工具列等",{"2":{"136":1}}],["包含工具列",{"2":{"136":2}}],["包含的資料與簽發時間",{"2":{"93":1}}],["包含",{"2":{"46":1,"126":1}}],["要改變的",{"2":{"175":1}}],["要用",{"2":{"58":1}}],["要不然文文的存款就不保了",{"2":{"47":1}}],["箭頭函式無法使用",{"2":{"58":1}}],["箭頭函式只有一行時",{"2":{"58":1}}],["箭頭函式只有一個參數時",{"2":{"58":1}}],["箭頭函式可以將",{"2":{"58":1}}],["箭頭函式",{"0":{"58":1}}],["雞排珍奶",{"2":{"57":1}}],["雞排飯",{"2":{"18":4,"21":1,"23":3}}],["更方便",{"2":{"266":1}}],["更有彈性",{"2":{"57":1}}],["更新指定",{"2":{"219":1}}],["更新資料",{"2":{"127":1}}],["更新",{"0":{"127":1},"2":{"219":3}}],["更新全部資源欄位",{"2":{"8":1}}],["更新部分資源欄位",{"2":{"8":1}}],["晚上",{"2":{"56":2,"57":1}}],["晚餐吃什麼",{"2":{"32":1}}],["桂格超大便當",{"2":{"56":2,"57":1}}],["冰淇淋",{"2":{"56":3,"57":2,"58":2,"59":2}}],["叫做",{"2":{"56":1}}],["只會套用到這個元件",{"2":{"266":1}}],["只會影響出現語法的那層迴圈",{"2":{"76":2}}],["只需要在",{"2":{"201":1}}],["只需要把想換的地方改掉就好",{"2":{"190":1}}],["只接收",{"2":{"198":1}}],["只接受",{"2":{"117":3}}],["只學習必要的部分",{"2":{"170":1}}],["只要加上事件名",{"2":{"154":1}}],["只包含元素",{"2":{"150":1}}],["只取",{"2":{"115":2}}],["只有保存檔案的差異",{"2":{"207":1}}],["只有部分常用事件有這種寫法",{"2":{"182":1}}],["只有",{"2":{"90":1,"241":2}}],["只有一個執行條件",{"2":{"73":1}}],["只有一行程式碼時",{"2":{"71":1}}],["只有一行簡寫時",{"2":{"58":1}}],["只針對傳入的資料做處理",{"2":{"56":1}}],["只能讀取",{"2":{"256":1}}],["只能接受陣列和物件",{"2":{"241":1}}],["只能接受數字",{"2":{"5":1}}],["只能偵測狀態",{"2":{"160":1}}],["只能取得行內樣式",{"2":{"148":1}}],["只能有一個",{"2":{"57":1}}],["只能在",{"2":{"56":1}}],["只能放正則表達式",{"2":{"50":1}}],["只能放文字",{"2":{"50":1,"222":1}}],["只能用迴圈取資料",{"2":{"50":1}}],["只能被",{"2":{"47":1}}],["只能寫",{"2":{"36":1}}],["只能加在",{"2":{"5":2}}],["得到所有傳入參數的陣列",{"2":{"56":1}}],["得到零用錢",{"2":{"4":2}}],["能開始",{"2":{"258":1}}],["能保存選擇的鈴聲",{"2":{"258":1}}],["能保存已完成",{"2":{"258":1}}],["能停用外層定義的",{"2":{"216":1}}],["能自訂各頁面的",{"2":{"213":1}}],["能與",{"2":{"213":1}}],["能清楚看到什麼時候修改了什麼檔案",{"2":{"207":1}}],["能隨時將目錄切換到某個版本時的狀態",{"2":{"207":1}}],["能註冊帳號",{"2":{"102":1}}],["能使用和前端一樣的語言進行開發",{"2":{"66":1}}],["能夠偵測使用者對網頁的操作",{"2":{"65":1}}],["能夠改變",{"2":{"65":3}}],["能以元件方式引用",{"2":{"254":1}}],["能以",{"2":{"56":1,"66":1,"67":2,"117":1}}],["能取得你的蝦皮訂單會是怎麼樣的情況",{"2":{"12":1}}],["隔開",{"2":{"56":1}}],["放入",{"2":{"258":1}}],["放",{"2":{"237":1}}],["放要引用的變數",{"2":{"192":1}}],["放在",{"2":{"56":1,"222":2}}],["放傳入",{"2":{"55":1}}],["參加相關社群等",{"2":{"170":1}}],["參考範例",{"2":{"205":1}}],["參考元素為",{"2":{"149":1}}],["參考元素",{"2":{"149":1}}],["參考資訊",{"2":{"9":1}}],["參數陣列",{"2":{"165":1}}],["參數可以有多個",{"2":{"56":1}}],["參數是一個陣列",{"2":{"164":1}}],["參數是",{"2":{"56":1}}],["參數",{"2":{"56":1,"166":1}}],["兩個字以上才能新增",{"2":{"242":2}}],["兩種做法",{"2":{"183":1}}],["兩種效果",{"2":{"175":1}}],["兩種",{"2":{"117":1}}],["兩種方式",{"2":{"55":1}}],["兩兩比較",{"2":{"43":1}}],["則不需要jsoncomponents",{"2":{"267":1}}],["則建立",{"2":{"257":1}}],["則可不必加標籤名稱",{"2":{"226":1}}],["則是更新",{"2":{"219":1}}],["則是要執行的程式碼",{"2":{"55":1}}],["則元素",{"2":{"166":2}}],["則",{"2":{"87":1}}],["則餘數即為除數",{"2":{"60":1}}],["則為資料的內容",{"2":{"11":1}}],["寫相對檔案的路徑",{"2":{"268":1}}],["寫入設定",{"2":{"270":1}}],["寫入設定jsexport",{"2":{"218":1}}],["寫入回應內容",{"2":{"193":1}}],["寫入txt",{"2":{"121":1}}],["寫在標籤內",{"2":{"154":1}}],["寫成物件更可以將程式碼分類",{"2":{"54":1}}],["寫法不一樣",{"2":{"241":1}}],["寫法",{"2":{"36":2}}],["需手動安裝",{"2":{"264":2}}],["需等下次",{"2":{"242":1}}],["需處理沒有拿到資料的情況",{"2":{"219":1}}],["需引入",{"2":{"175":1}}],["需另外使用語法",{"2":{"149":1}}],["需使用",{"2":{"148":1,"175":1,"215":1}}],["需考慮閏年",{"2":{"77":1}}],["需考慮密鑰超過",{"2":{"53":1}}],["需要動態引用路徑",{"2":{"268":1}}],["需要再安裝",{"2":{"264":1}}],["需要安裝",{"2":{"264":1}}],["需要時才讀取",{"2":{"256":1}}],["需要有獨立的",{"2":{"268":1}}],["需要有",{"2":{"250":1}}],["需要在",{"2":{"242":1}}],["需要取值時寫成",{"2":{"241":1}}],["需要使用",{"2":{"237":1}}],["需要使用單引號",{"2":{"90":1}}],["需要大量的實作練習",{"2":{"170":1}}],["需要注意這個方式取得的資訊是唯讀的",{"2":{"148":1}}],["需要注意變數型態",{"2":{"41":1,"83":1}}],["需要串聯語法",{"2":{"147":1}}],["需要改值時不需要重複宣告",{"2":{"89":1}}],["需要給每個資料一個名字",{"2":{"86":1}}],["需要特別注意",{"2":{"78":1}}],["需要對迴圈命名",{"2":{"76":1}}],["需要透過",{"2":{"68":1}}],["需要判斷變數是否有值",{"2":{"38":1}}],["字串",{"2":{"53":1,"93":1}}],["字母的大小則是依其順序而定",{"2":{"47":1}}],["字母",{"2":{"47":1}}],["明文",{"2":{"53":1}}],["密碼必填",{"2":{"111":1}}],["密碼資料欄位名稱",{"2":{"95":1}}],["密碼的第二位數則是字母",{"2":{"47":1}}],["密文",{"2":{"53":1}}],["密鑰",{"2":{"53":1}}],["處理後產生的",{"2":{"240":1}}],["處理",{"2":{"215":2}}],["處理請求",{"2":{"96":1}}],["處理資料時盡量不要使用外部的變數",{"2":{"56":1}}],["處理資料",{"2":{"53":1}}],["處理錯誤",{"2":{"2":1}}],["位置",{"2":{"149":1}}],["位置可以放負數",{"2":{"51":2}}],["位數",{"2":{"47":1}}],["長度不寫會直接取到結尾",{"2":{"51":1}}],["長度",{"2":{"51":1}}],["網站整體為",{"2":{"271":1}}],["網站啟動時的切入點",{"2":{"262":1}}],["網站主體",{"2":{"262":1}}],["網站的套件",{"2":{"256":1}}],["網站設定",{"0":{"231":1},"2":{"230":1}}],["網站說明",{"2":{"229":1,"231":1}}],["網站類型",{"2":{"229":1}}],["網站",{"0":{"228":1},"1":{"229":1,"230":1,"231":1,"232":1},"2":{"231":1,"261":1}}],["網站標題",{"2":{"222":1,"231":1}}],["網站名稱",{"2":{"214":1,"229":2,"261":1}}],["網站內的",{"2":{"12":1}}],["網址必須要有",{"2":{"258":1}}],["網址",{"2":{"136":1,"198":1}}],["網頁時不需要寫",{"2":{"236":1}}],["網頁有三個按鈕",{"2":{"162":1}}],["網頁捲動背景視差效果",{"2":{"161":1}}],["網頁載入進度條",{"2":{"161":1}}],["網頁載入狀態",{"0":{"160":1}}],["網頁載入完成",{"2":{"155":1}}],["網頁伺服器已啟動",{"2":{"109":1}}],["網頁伺服器",{"2":{"106":1}}],["網頁內容",{"2":{"69":1}}],["網頁上的",{"2":{"69":1}}],["網域是",{"2":{"50":4}}],["^",{"2":{"50":3}}],["咖哩",{"2":{"50":11}}],["咖哩烏冬",{"2":{"50":3}}],["咖哩拌飯",{"2":{"50":2}}],["外層可以統計總共按了幾個讚",{"2":{"250":1}}],["外層",{"2":{"246":1}}],["外部處理",{"2":{"246":2}}],["外部",{"2":{"222":2}}],["外",{"2":{"209":1}}],["外賣",{"2":{"50":4}}],["外面下雨",{"2":{"30":3}}],["轉成",{"2":{"171":1,"245":1}}],["轉成可用的資訊",{"2":{"14":1}}],["轉換成時間字串",{"2":{"143":1}}],["轉換成日期字串",{"2":{"143":1}}],["轉小寫",{"2":{"49":1}}],["轉大寫",{"2":{"49":1}}],["文章設定",{"0":{"232":1}}],["文件",{"2":{"203":1}}],["文件物件模型",{"2":{"145":1}}],["文字及按讚",{"2":{"250":1}}],["文字的",{"2":{"237":1}}],["文字等",{"2":{"203":1}}],["文字訊息支援粗體",{"2":{"172":1}}],["文字需用引號包起來",{"2":{"90":1}}],["文字連接",{"0":{"81":1}}],["文字被修改囉",{"2":{"65":1}}],["文字",{"0":{"48":1},"1":{"49":1,"50":1,"51":1,"52":1,"53":1},"2":{"60":2,"90":2,"150":1,"181":1,"240":1}}],["文文可以透過",{"2":{"47":1}}],["文文記性不太好",{"2":{"47":1}}],["輸出的檔案會有流水號檔名",{"2":{"262":1}}],["輸出html",{"2":{"237":1}}],["輸出這四個數字",{"2":{"71":1}}],["輸出",{"2":{"47":1,"60":6}}],["輸入機器人",{"2":{"205":1}}],["輸入欄位的值",{"2":{"181":1}}],["輸入後立刻輸出",{"2":{"170":1}}],["輸入秒數數字",{"2":{"151":1}}],["輸入一個數字",{"2":{"77":1}}],["輸入層數",{"2":{"77":1}}],["輸入星星塔層數",{"2":{"77":2}}],["輸入三個三位數數字",{"2":{"60":1}}],["輸入",{"2":{"47":1,"60":1,"120":1,"256":1,"257":1}}],["輸入文字後就將解密後的密碼回傳",{"2":{"47":1}}],["輸入文字",{"2":{"47":2,"60":2}}],["輸入的數字相加顯示在網頁上",{"2":{"53":1}}],["輸入的英文文字大寫轉小寫",{"2":{"44":1}}],["輸入的文字移除前後空白後倒過來後顯示在網頁上",{"2":{"44":1}}],["輸入完成後跳出訊息",{"2":{"39":1}}],["輸入驗證流程範例",{"2":{"3":1}}],["噓",{"2":{"47":1}}],["了",{"2":{"47":1}}],["由呼叫元件的地方自訂",{"2":{"250":1}}],["由下列幾個部分組成",{"2":{"55":1}}],["由於",{"2":{"47":1,"93":1,"198":1}}],["由物件組成的陣列範例",{"2":{"21":1}}],["那麼密碼的第一位數就是字母",{"2":{"47":1}}],["越後面的字母越",{"2":{"47":1}}],["指令就能編譯出",{"2":{"225":1}}],["指令打包檔案",{"2":{"223":1}}],["指令",{"2":{"188":1,"193":1}}],["指令進入終端機下資料庫指令",{"2":{"121":1}}],["指的是",{"2":{"134":1}}],["指的是從較",{"2":{"47":1}}],["指定路由名稱",{"2":{"256":2}}],["指定網址",{"2":{"256":2}}],["指定不同的值讓",{"2":{"219":2}}],["指定",{"2":{"216":1}}],["指定第幾個元素一定要使用",{"2":{"180":1}}],["指定取到的第幾個元素",{"2":{"180":1}}],["指定觀察的屬性名稱",{"2":{"164":2}}],["指定上傳的檔案儲存到",{"2":{"101":1}}],["指定對",{"2":{"76":1}}],["指派運算子",{"0":{"80":1}}],["指向的是物件內的值",{"2":{"24":1}}],["指向的是陣列內的索引為",{"2":{"24":1}}],["指向同一個記憶體位置",{"2":{"24":1}}],["所有上層",{"2":{"180":2}}],["所有的動畫都是基於",{"2":{"175":1}}],["所有預設的全域變數",{"2":{"135":1}}],["所有進到",{"2":{"109":1}}],["所代表的密碼便是",{"2":{"47":1}}],["所謂",{"2":{"47":1}}],["所以需要在",{"2":{"270":1}}],["所以需要透過其他方式製作載入進度的功能",{"2":{"160":1}}],["所以編寫時必須注意排版",{"2":{"226":1}}],["所以引用自己寫的",{"2":{"221":1}}],["所以安裝",{"2":{"220":1}}],["所以能把後端的",{"2":{"213":1}}],["所以你可以架設一個自己的",{"2":{"209":1}}],["所以就算沒有網路也能使用",{"2":{"207":1}}],["所以儲存的體積比較小",{"2":{"207":1}}],["所以我們需要使用",{"2":{"198":1}}],["所以我們可以使用",{"2":{"155":1}}],["所以在你提問前",{"2":{"172":1}}],["所以請同學們先培養自己先試著解決問題的良好習慣",{"2":{"172":1}}],["所以用",{"2":{"114":1}}],["所以必須將簽發出去的",{"2":{"93":1}}],["所以符合",{"2":{"93":1}}],["所以通常會將程式碼放在",{"2":{"69":1}}],["所以才會有",{"2":{"68":1}}],["所以會有",{"2":{"214":1}}],["所以會是",{"2":{"63":2}}],["所以會放入",{"2":{"41":1,"83":1}}],["所以第二位數是",{"2":{"47":1}}],["所以密碼的第一位數就是",{"2":{"47":1}}],["所以他寫下了",{"2":{"47":1}}],["所以是傳值",{"2":{"24":2}}],["所以可以對陣列使用",{"2":{"23":1}}],["所以熟悉物件和陣列的組合",{"2":{"21":1}}],["所以要用",{"2":{"5":1}}],["距離",{"2":{"47":4}}],["因此",{"2":{"47":2}}],["因此他決定以一個只有他看得懂的方式把密碼寫下來",{"2":{"47":1}}],["因為它連整個平台都開源",{"2":{"209":1}}],["因為可以使用",{"2":{"180":1}}],["因為取得的資料型態是",{"2":{"147":1}}],["因為網頁沒有重新整理",{"2":{"12":1}}],["因為",{"2":{"11":1,"93":1,"220":1}}],["因為兩個",{"2":{"5":1}}],["存取",{"0":{"242":1},"2":{"257":1}}],["存檔時自動重新啟動",{"2":{"200":1}}],["存入資料庫",{"2":{"93":1}}],["存款就會被盜領",{"2":{"47":1}}],["存摺",{"2":{"47":1}}],["萬一提款卡掉了",{"2":{"47":1}}],["很是麻煩",{"2":{"47":1}}],["還是要養成定期備份的習慣",{"2":{"209":1}}],["還有其他的",{"2":{"211":1}}],["還有其他提供",{"2":{"209":1}}],["還有文字連接的功能",{"2":{"81":1}}],["還要方便快速",{"2":{"171":1}}],["還會讓維護變得更麻煩",{"2":{"155":1}}],["還可以搭配",{"2":{"81":1}}],["還可以減寫成",{"2":{"79":1}}],["還可以做文字連接",{"2":{"78":1}}],["還可以連接文字",{"2":{"68":1}}],["還得繳交",{"2":{"47":1}}],["還沒發生或等待中",{"2":{"4":1}}],["印出到該數字的費氏數列",{"2":{"77":1}}],["印出下面格式的數字圖案",{"2":{"77":1}}],["印出陣列",{"2":{"25":1}}],["印星星塔",{"2":{"77":2}}],["印章親自到銀行去重設密碼",{"2":{"47":1}}],["他的密碼有",{"2":{"47":1}}],["他也常忘記提款卡密碼",{"2":{"47":1}}],["他們在某個月份的銷售量如下所示",{"2":{"25":1}}],["常數宣告範例",{"2":{"89":1}}],["常用的迴圈有",{"2":{"70":1}}],["常常會忘東忘西",{"2":{"47":1}}],["常見的日期處理套件",{"2":{"143":1}}],["常見的",{"2":{"9":1}}],["常見的請求方式有",{"2":{"8":1}}],["質數特性",{"2":{"47":1}}],["間的所有質數",{"2":{"47":1}}],["~",{"2":{"47":1,"215":2,"221":1}}],["列出",{"2":{"47":1}}],["區域常數",{"2":{"89":1}}],["區域內不能重複宣告",{"2":{"89":2}}],["區域變數",{"2":{"89":1}}],["區域",{"0":{"62":1}}],["區",{"2":{"47":2}}],["威力彩規則",{"2":{"47":1}}],["展開運算子",{"2":{"46":1}}],["到現在的毫秒數",{"2":{"143":1}}],["到期時間",{"2":{"93":1}}],["到",{"2":{"46":1,"47":2,"121":1,"143":4,"197":1}}],["絕對值",{"2":{"46":1}}],["平方根",{"2":{"46":1}}],["挑戰",{"2":{"44":1,"47":1,"53":1,"71":1,"77":1,"162":1}}],["五",{"2":{"43":2}}],["四個div",{"2":{"183":1}}],["四捨五入到整數",{"2":{"46":1}}],["四",{"2":{"43":2}}],["二",{"2":{"43":2}}],["零",{"2":{"43":2}}],["搭配",{"2":{"43":1,"160":1,"242":1}}],["搭配以上的本章的函式",{"2":{"5":1}}],["正式環境用指令",{"2":{"201":1}}],["正數代表往後幾頁",{"2":{"138":1}}],["正數為",{"2":{"46":1}}],["正則表達式語法參考",{"2":{"50":1}}],["正則表達式的取代文字可以使用",{"2":{"50":1}}],["正則表達式有設定",{"2":{"50":1}}],["正則表達式regex",{"2":{"50":2}}],["正負數判斷",{"2":{"46":1}}],["正序",{"2":{"43":1}}],["正確的更新資料",{"2":{"219":2}}],["正確",{"2":{"41":1,"83":1}}],["正確寫法",{"2":{"35":1}}],["後呼叫",{"2":{"257":1}}],["後使用",{"2":{"242":1,"263":3}}],["後將名稱傳入",{"2":{"216":1}}],["後會加上",{"2":{"175":1}}],["後可以回來新的資料",{"2":{"116":2}}],["後進下一次",{"2":{"76":2}}],["後端功能",{"0":{"66":1}}],["後來他決定把密碼寫在提款卡上免得忘記",{"2":{"47":1}}],["後",{"2":{"42":2,"79":2}}],["後面的值做比較",{"2":{"36":1}}],["後面接判斷式",{"2":{"30":1}}],["從外部傳入資料處裡",{"2":{"257":1}}],["從遠端複製一份到電腦",{"2":{"208":1}}],["從元素移除事件監聽器",{"2":{"156":1}}],["從星期天",{"2":{"143":1}}],["從使用者資料移除",{"2":{"98":1}}],["從開始位置取到結束位置",{"2":{"51":2}}],["從開始位置取指定長度的文字",{"2":{"51":1}}],["從第幾個字開始往前",{"2":{"50":1}}],["從第幾個字開始往後",{"2":{"50":1}}],["從第幾個字開始",{"2":{"50":1}}],["從第幾個開始往前",{"2":{"42":1}}],["從第幾個開始往後",{"2":{"42":1}}],["從",{"2":{"46":1,"47":3,"85":1,"95":1,"112":1,"143":2,"166":1}}],["從後面開始往前找",{"2":{"42":1}}],["從前面開始往後找",{"2":{"42":1}}],["從符合的",{"2":{"36":1}}],["尋找",{"2":{"231":1}}],["尋找貓咪遊戲",{"2":{"161":1}}],["尋找資料",{"2":{"115":2}}],["尋找陣列是否有東西符合尋找文字",{"2":{"50":2}}],["尋找陣列是否有東西符合搜尋內容",{"2":{"42":3}}],["尋找文字",{"2":{"50":3}}],["尋找與取代",{"0":{"42":1,"50":1}}],["搜尋引擎",{"2":{"172":1}}],["搜尋相關技術資料",{"2":{"170":1}}],["搜尋商品",{"2":{"117":1}}],["搜尋文字只會取代找到的第一個",{"2":{"50":1}}],["搜尋文字或",{"2":{"50":1}}],["搜尋內容",{"2":{"42":3}}],["搜尋依輸入文字顯示搜尋建議",{"2":{"12":1}}],["龍眼",{"2":{"41":2}}],["荔枝",{"2":{"41":2}}],["火龍果",{"2":{"41":7}}],["火車的名字叫做",{"2":{"18":1}}],["火車長度沒有限制",{"2":{"18":1}}],["櫻桃",{"2":{"41":7}}],["榴槤",{"2":{"41":4}}],["柳丁",{"2":{"41":4}}],["芭樂",{"2":{"41":10}}],["草莓",{"2":{"41":10}}],["藍莓",{"2":{"41":11}}],["葡萄",{"2":{"41":12}}],["橘子",{"2":{"41":13}}],["香蕉",{"2":{"41":7}}],["蘋果",{"2":{"41":12}}],["顛倒陣列",{"2":{"41":1}}],["產生各種大小的",{"2":{"258":1}}],["產生資料的",{"2":{"219":2}}],["產生新陣列",{"2":{"41":1}}],["產品",{"2":{"25":5}}],["結構",{"0":{"187":1},"1":{"188":1,"189":1}}],["結構圖",{"2":{"135":1,"146":1}}],["結構如下圖",{"2":{"77":2}}],["結尾加",{"2":{"111":1}}],["結尾標籤前面",{"2":{"69":2}}],["結束",{"2":{"71":1,"73":1,"74":1,"96":1}}],["結束位置不寫會直接取到結尾",{"2":{"51":2}}],["結束位置",{"2":{"41":1,"51":2}}],["結果會是陣列",{"2":{"147":3}}],["結果為",{"2":{"42":4}}],["結果",{"2":{"35":1,"37":1,"79":1}}],["刪除待辦事項",{"2":{"258":1}}],["刪除元素",{"2":{"181":2}}],["刪除線",{"2":{"172":1}}],["刪除多筆",{"2":{"128":1}}],["刪除一筆",{"2":{"128":1}}],["刪除一個陣列元素",{"2":{"117":1}}],["刪除索引",{"2":{"125":1}}],["刪除條件",{"2":{"117":1}}],["刪除訂單",{"2":{"117":1}}],["刪除使用者",{"2":{"117":1}}],["刪除範例",{"2":{"41":1}}],["刪除",{"0":{"117":1,"128":1},"2":{"41":1,"117":1,"214":1}}],["刪除數量",{"2":{"41":1}}],["刪除資源",{"2":{"8":1}}],["連結會跳頁",{"2":{"158":1}}],["連接資料庫",{"2":{"110":1}}],["連接陣列",{"2":{"41":1}}],["連接文字及變數",{"2":{"81":1}}],["連接文字",{"2":{"41":1}}],["連續買了",{"2":{"25":1}}],["基礎",{"0":{"233":1},"1":{"234":1,"235":1,"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1}}],["基本語法",{"0":{"226":1}}],["基本語法和",{"2":{"84":1}}],["基本變數命名規則",{"2":{"88":1}}],["基本處理",{"0":{"41":1,"49":1}}],["基於安全性問題",{"2":{"12":1}}],["一般的",{"2":{"268":1}}],["一般計時器",{"0":{"83":1}}],["一併寫在同一個專案裡面",{"2":{"213":1}}],["一小時玩程式",{"2":{"173":1}}],["一次完成",{"2":{"155":1}}],["一起帶出商品資料",{"2":{"115":1}}],["一樣",{"2":{"84":1,"89":1}}],["一樣是非必要的",{"2":{"30":1}}],["一些特別的數字可以用",{"2":{"83":1}}],["一些常用的陣列處理函式",{"2":{"40":1}}],["一球從",{"2":{"77":1}}],["一行一行的算式",{"2":{"72":1}}],["一個檔案裡面只能有一個預設匯出",{"2":{"190":1}}],["一個新增按鈕和一個清單",{"2":{"183":1}}],["一個文字輸入欄位",{"2":{"183":1}}],["一個",{"2":{"57":1}}],["一個名稱",{"2":{"55":1}}],["一",{"2":{"43":2}}],["道題目問答題或選擇題",{"2":{"39":1}}],["座",{"2":{"39":1}}],["出現和離開就會觸發",{"2":{"166":2}}],["出現",{"2":{"68":1}}],["出生月份和出生日期",{"2":{"39":1}}],["出門",{"2":{"30":2}}],["出門和爬山",{"2":{"30":1}}],["分組",{"2":{"237":1}}],["分類等等",{"2":{"232":1}}],["分支的根目錄建立",{"2":{"271":1}}],["分支合併請求",{"2":{"210":1}}],["分支",{"2":{"208":1,"271":1}}],["分散式系統不必隨時和伺服器溝通",{"2":{"207":1}}],["分散式的優點",{"2":{"207":1}}],["分",{"2":{"185":1}}],["分數",{"2":{"185":2}}],["分鐘",{"2":{"143":1,"258":2}}],["分成三個部分",{"2":{"93":1}}],["分別是剪刀",{"2":{"162":1}}],["分別是姓名",{"2":{"39":1}}],["分別為",{"2":{"77":1}}],["分隔",{"2":{"71":1}}],["分`",{"2":{"39":1}}],["鳳梨披薩是食物嗎",{"2":{"39":1}}],["鳳梨是食物嗎",{"2":{"39":1}}],["披薩是食物嗎",{"2":{"39":1}}],["答錯了",{"2":{"39":2}}],["答對了",{"2":{"39":2}}],["判斷",{"2":{"242":1}}],["判斷要修改的項目",{"2":{"117":1}}],["判斷輸入的文字括號是否閉合",{"2":{"60":1}}],["判斷輸入的文字是不是正著讀和反著讀都一樣的迴文",{"2":{"60":1}}],["判斷傳入的數字是不是質數",{"2":{"47":1}}],["判斷陣列所有東西執行",{"2":{"42":1}}],["判斷陣列有沒有東西執行",{"2":{"42":1}}],["判斷為",{"2":{"38":3}}],["判斷式3",{"2":{"37":1}}],["判斷式2",{"2":{"37":1}}],["判斷式1",{"2":{"37":1}}],["判斷式裡面還可以再使用判斷式",{"2":{"37":1}}],["判斷式條件的延伸",{"0":{"35":1}}],["短路求值",{"0":{"38":1}}],["窩不知道",{"2":{"36":3}}],["英文大寫",{"2":{"53":1}}],["英文",{"2":{"36":3}}],["台灣中文",{"2":{"36":3}}],["語言",{"2":{"143":1}}],["語言判斷",{"2":{"36":1}}],["語法規範",{"2":{"264":1}}],["語法規則為",{"2":{"33":1}}],["語法分為",{"2":{"238":1}}],["語法標準分為",{"2":{"190":1}}],["語法大全",{"2":{"171":1}}],["語法寫",{"2":{"171":1}}],["語法為",{"2":{"83":1}}],["語法更新頻繁",{"2":{"68":1}}],["語法",{"0":{"0":1,"46":1,"55":1,"175":1,"237":1,"238":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"239":1,"240":1,"241":1},"2":{"46":1,"171":1,"172":1,"175":1,"188":1,"233":1}}],["順序不變",{"2":{"43":1}}],["順序會影響執行",{"2":{"36":1}}],["順利通過考試",{"2":{"4":1}}],["直到根元素的過程",{"2":{"159":1}}],["直到遇到",{"2":{"36":1}}],["直接使用元件名的標籤",{"2":{"267":1}}],["直接使用一個未宣告也未賦值的變數會出現錯誤",{"2":{"63":1}}],["直接改也可以",{"2":{"257":1}}],["直接寫一般的",{"2":{"241":1}}],["直接寫名字則是匯入套件",{"2":{"190":1}}],["直接用",{"2":{"226":1}}],["直接修改元素",{"2":{"148":1}}],["直接取得元素",{"2":{"148":1}}],["直接印出結果",{"2":{"33":1}}],["製作網頁丙級第一題",{"2":{"271":1}}],["製作進階待辦清單",{"2":{"242":1}}],["製作機器人",{"0":{"199":1},"1":{"200":1,"201":1,"202":1,"203":1,"204":1}}],["製作打殭屍小遊戲",{"2":{"184":1}}],["製作丙級第二題健康天地標籤面板",{"2":{"183":1}}],["製作待辦清單",{"2":{"183":1}}],["製作翻牌記憶小遊戲",{"2":{"177":1}}],["製作",{"2":{"171":1}}],["製作兩色漸層顏色選擇器",{"2":{"162":1}}],["製作有隨機功能的顏色選擇器",{"2":{"162":1}}],["製作猜拳遊戲",{"2":{"162":1}}],["製作倒數計時器",{"2":{"151":1}}],["製作能增改刪查資料庫的網頁",{"2":{"103":1}}],["製作登入功能",{"2":{"92":1}}],["製作計時器",{"2":{"85":1}}],["製作成表格",{"2":{"72":1}}],["製作易經數字卦占卜程式",{"2":{"60":1}}],["製作凱薩密碼",{"2":{"53":1}}],["製作威力彩號碼產生器",{"2":{"47":1}}],["製作隨機數字",{"2":{"47":1}}],["製作一個番茄鐘",{"2":{"258":1}}],["製作一個卡片收集頁",{"2":{"250":1}}],["製作一個購物清單",{"2":{"242":1}}],["製作一個查詢公開資料的",{"2":{"205":1}}],["製作一個查詢開放資料的",{"2":{"194":1}}],["製作一個九九乘法表",{"2":{"72":1}}],["製作一個星座判斷器",{"2":{"39":1}}],["製作一個選擇題",{"2":{"35":1}}],["製造商為",{"2":{"22":1}}],["普遍級",{"2":{"35":2,"36":1}}],["永遠都是普遍級",{"2":{"35":1}}],["錯誤的訊息的",{"2":{"114":1}}],["錯誤的判斷寫法",{"2":{"35":1}}],["錯誤訊息",{"2":{"111":1}}],["錯誤",{"2":{"41":1,"83":1,"95":1}}],["錯誤時執行的",{"2":{"14":1,"15":2}}],["級",{"2":{"35":4}}],["遇到",{"2":{"35":1}}],["但要注意縮排",{"2":{"226":1}}],["但若要在不公開的儲存庫使用則需要付費",{"2":{"211":1}}],["但還是可以使用",{"2":{"147":1}}],["但只顯示",{"2":{"126":1}}],["但是不會偵測陣列和物件內部的變化",{"2":{"241":1}}],["但是不會賦值",{"2":{"63":2}}],["但是可以",{"2":{"219":2}}],["但是可以用",{"2":{"19":1}}],["但是",{"2":{"143":1}}],["但是僅回傳比數",{"2":{"124":1}}],["但是會發生補錯位置的情況",{"2":{"68":1}}],["但是英文大小寫編號間有其他字",{"2":{"53":1}}],["但是這樣一來",{"2":{"47":1}}],["但",{"2":{"41":1,"83":1}}],["但很多時候",{"2":{"35":1}}],["加入",{"2":{"258":1,"263":2}}],["加在標籤後",{"2":{"226":1}}],["加鹽",{"2":{"114":1}}],["加密",{"2":{"114":1}}],["加密套件",{"2":{"106":1}}],["加密工具",{"2":{"53":1}}],["加號",{"2":{"79":1}}],["加油",{"2":{"34":1}}],["加上",{"2":{"5":1,"116":2,"225":3,"266":2}}],["酷欸",{"2":{"34":1}}],["喜歡",{"2":{"33":3}}],["嗎",{"2":{"33":1,"34":1}}],["成績",{"2":{"35":3}}],["成績標準範例",{"2":{"35":1}}],["成立時執行的程式",{"2":{"33":1}}],["成功是藍色",{"2":{"242":1}}],["成功執行的",{"2":{"14":1,"15":2}}],["成功",{"2":{"9":2,"16":1}}],["成功時是藍色",{"2":{"242":1}}],["成功時",{"2":{"5":1}}],["節省傳到外面再傳進去的程式碼",{"2":{"248":1}}],["節省程式碼文字",{"2":{"33":1}}],["節點類型",{"2":{"150":1}}],["節點物件是",{"2":{"150":1}}],["節點",{"0":{"150":1}}],["節車廂的名字叫做",{"2":{"18":3}}],["節車廂",{"2":{"18":1}}],["選單區",{"2":{"271":1}}],["選擇是否使用單元測試",{"2":{"261":1}}],["選擇是否使用",{"2":{"261":8}}],["選擇想要使用的框架",{"2":{"261":1}}],["選擇",{"2":{"197":1}}],["選擇器篩選出來最近的一個",{"2":{"180":1}}],["選擇器抓取所有元素",{"2":{"147":1}}],["選擇器抓取第一個元素",{"2":{"147":1}}],["選擇器",{"2":{"147":4,"180":13}}],["選",{"2":{"33":1,"35":3,"120":1}}],["三個欄位",{"2":{"126":1}}],["三個",{"2":{"77":1}}],["三種",{"2":{"70":1}}],["三色豆烏冬",{"2":{"50":1}}],["三色豆拌飯",{"2":{"50":2}}],["三色豆",{"2":{"50":2}}],["三",{"2":{"43":2}}],["三元運算子",{"0":{"33":1},"2":{"33":1}}],["三維陣列概念",{"2":{"21":1}}],["好棒",{"2":{"154":1}}],["好",{"2":{"56":2,"57":1,"58":1}}],["好耶",{"2":{"32":1}}],["好好吃便當店",{"2":{"21":1,"22":1}}],["炸雞排",{"2":{"56":1}}],["炸雞",{"2":{"32":1}}],["便當",{"2":{"32":1}}],["便當或麵都可以",{"2":{"32":1}}],["right",{"2":{"144":3,"176":2}}],["runs",{"2":{"271":1}}],["run",{"2":{"120":1,"193":1,"214":1,"223":1,"270":1,"271":2}}],["rtnku0l0w",{"2":{"93":1}}],["rootbounds",{"2":{"166":1}}],["rootmargin",{"2":{"166":2,"167":1}}],["root",{"2":{"166":3,"167":1,"222":2,"264":4}}],["rotatey",{"2":{"178":2}}],["rotate",{"2":{"144":3}}],["route",{"0":{"112":1},"2":{"216":2,"222":1,"256":2}}],["routes",{"2":{"107":1,"109":1,"112":1,"256":1}}],["router",{"0":{"256":1},"2":{"95":1,"96":1,"112":12,"217":2,"255":1,"256":19,"257":1,"261":2}}],["round",{"2":{"46":2,"178":2,"185":1}}],["roman",{"2":{"88":1}}],["rgba",{"2":{"166":1}}],["rgb",{"2":{"71":2,"166":1}}],["raw",{"2":{"268":1}}],["radiovalue",{"2":{"237":2}}],["radio",{"2":{"237":3}}],["radius",{"2":{"144":5}}],["rabbids",{"2":{"173":1}}],["ratione",{"2":{"167":8}}],["rand",{"2":{"47":1,"185":6}}],["randomb",{"2":{"178":2}}],["randoma",{"2":{"178":2}}],["random",{"2":{"46":2,"178":2,"185":1}}],["rain",{"2":{"32":2,"37":2}}],["recommended",{"2":{"264":7}}],["real",{"2":{"258":1}}],["reactive",{"2":{"241":8,"268":1}}],["readme",{"2":{"230":2,"231":1}}],["readystate",{"2":{"160":2}}],["reading",{"2":{"22":2}}],["read",{"2":{"22":2}}],["remote",{"2":{"208":1}}],["removeclass",{"2":{"178":1,"181":3}}],["removechild",{"2":{"149":1}}],["removednodes",{"2":{"164":2}}],["removeeventlistener",{"2":{"156":3}}],["remove",{"2":{"148":3,"149":1,"181":3,"185":1}}],["render",{"2":{"205":2}}],["registersw",{"2":{"258":2}}],["register",{"2":{"256":4,"258":1}}],["region",{"2":{"198":1}}],["regular",{"2":{"254":1}}],["regex101",{"2":{"50":1}}],["regexr",{"2":{"50":1}}],["regex",{"2":{"50":2}}],["regexpstringiterator",{"2":{"50":2}}],["repo",{"2":{"229":2}}],["repo建立後必須要有第一次commit",{"2":{"208":1}}],["repository",{"2":{"208":1}}],["reply",{"2":{"203":2}}],["replacechild",{"2":{"149":2}}],["replacecurry2",{"2":{"50":2}}],["replacecurry1",{"2":{"50":2}}],["replace",{"2":{"50":6,"148":2}}],["repeat",{"2":{"178":4}}],["repellendus",{"2":{"167":8}}],["rel",{"2":{"222":3}}],["relative",{"2":{"144":1,"159":1,"166":1,"167":2,"176":1,"178":1,"185":1}}],["rel=",{"2":{"144":1,"222":1,"258":4}}],["reload",{"2":{"137":2}}],["refs",{"2":{"245":1}}],["ref=",{"2":{"242":1}}],["refreshnuxtdata",{"2":{"219":4}}],["refresh",{"2":{"219":10}}],["ref",{"2":{"111":1,"215":1,"216":1,"219":2,"222":3,"241":6,"242":1,"245":1,"249":3}}],["referenceerror",{"2":{"58":1,"63":2}}],["reference",{"2":{"24":1}}],["require",{"2":{"190":1}}],["required",{"2":{"111":4,"222":2,"245":1}}],["request",{"0":{"8":1},"2":{"8":1,"12":1,"210":1}}],["req",{"2":{"96":3,"97":6,"98":5,"101":3,"114":11,"115":5,"116":9,"117":5,"193":1}}],["redborder",{"2":{"237":1}}],["red",{"2":{"65":1,"148":4,"178":1,"181":4,"222":2,"237":2}}],["reduce",{"2":{"43":2}}],["redirection",{"2":{"9":1}}],["reverse",{"2":{"41":2}}],["returns",{"2":{"59":1}}],["return",{"0":{"57":1},"2":{"4":1,"5":5,"14":1,"27":3,"28":2,"42":9,"43":10,"57":5,"58":4,"61":7,"95":6,"96":2,"97":1,"111":1,"114":2,"116":2,"185":1,"191":1,"222":1,"236":1,"240":2,"241":2,"242":1,"244":2,"245":4,"246":2,"247":2,"248":1,"249":1,"257":5,"268":1}}],["resize2",{"2":{"165":2}}],["resize1",{"2":{"165":2}}],["resizeobserver",{"2":{"165":3}}],["resize",{"0":{"165":1},"2":{"165":5}}],["restaurant",{"2":{"21":1,"22":3}}],["restful",{"2":{"8":1,"93":1,"117":1}}],["response",{"2":{"14":2,"15":8,"16":2}}],["responsetext",{"2":{"13":1,"15":3}}],["results",{"2":{"117":2}}],["result",{"2":{"5":2,"49":2,"60":8,"87":2,"114":6,"115":12,"116":10,"117":4,"141":2}}],["res",{"2":{"4":4,"96":3,"97":3,"98":3,"101":4,"114":20,"115":19,"116":18,"117":18,"193":4}}],["resolve",{"2":{"4":4,"5":2,"265":2}}],["resolved",{"2":{"4":1}}],["reject",{"2":{"4":4,"5":4}}],["rejected",{"2":{"4":1}}],["範例程式碼",{"2":{"60":1}}],["範例",{"0":{"178":1,"185":1},"2":{"32":2,"41":2,"53":1,"60":1,"79":2,"80":1,"149":1}}],["相比原生",{"2":{"213":1}}],["相比原本的",{"2":{"213":1}}],["相關檔案",{"2":{"230":1}}],["相關的變數",{"2":{"220":1}}],["相關套件時需要在",{"2":{"220":1}}],["相關連結",{"2":{"171":1}}],["相關語法",{"2":{"150":1}}],["相交的時間",{"2":{"166":1}}],["相交的範圍",{"2":{"166":1}}],["相交的元素",{"2":{"166":1}}],["相交面積",{"2":{"166":1}}],["相交比例",{"2":{"166":1}}],["相鄰的每兩個字母間的",{"2":{"47":1}}],["相反",{"2":{"32":1}}],["相當於建立一個新變數",{"2":{"20":1}}],["否",{"2":{"126":1}}],["否定時執行的程式",{"2":{"33":1}}],["否定",{"2":{"32":1}}],["否則資料修改時不會動態更新",{"2":{"257":1}}],["否則可能會抓取不到",{"2":{"242":1}}],["否則元件被銷毀仍然會執行",{"2":{"239":1}}],["否則",{"2":{"30":3}}],["符合條件才顯示",{"2":{"237":1}}],["符合條件才出現在",{"2":{"237":1}}],["符合條件才出現html",{"2":{"237":1}}],["符合的話才執行程式碼",{"2":{"73":1}}],["符合的結果用",{"2":{"50":1}}],["符合的結果用陣列回傳",{"2":{"50":1}}],["符合執行條件",{"2":{"71":1}}],["符合時執行程式碼",{"2":{"35":3}}],["符合其中一個",{"2":{"32":1}}],["符號",{"2":{"31":1,"32":1,"79":2,"80":1}}],["與單元件檔案",{"0":{"259":1},"1":{"260":1,"261":1,"262":1,"263":1,"264":1,"265":1,"266":1,"267":1,"268":1,"269":1,"270":1,"271":1}}],["與變數才需要傳出去",{"2":{"241":1}}],["與基礎",{"2":{"233":1}}],["與",{"0":{"76":1},"2":{"32":1,"75":1,"76":1,"89":1,"102":1,"209":1,"211":1,"236":1,"238":1,"241":1,"258":1}}],["與後端伺服器資料交換後",{"2":{"12":1}}],["舉例",{"2":{"32":1}}],["邏輯運算子也可以用在賦值",{"2":{"38":1}}],["邏輯運算子是用來組合多個比較運算子的結果",{"2":{"32":1}}],["邏輯運算子",{"0":{"32":1}}],["邏輯判斷式是程式運作不可或缺的部分",{"2":{"29":1}}],["邏輯判斷式",{"0":{"29":1},"1":{"30":1,"31":1,"32":1,"33":1,"34":1,"35":1,"36":1,"37":1,"38":1,"39":1}}],["變更",{"2":{"240":3,"241":5}}],["變大了",{"2":{"175":1}}],["變大動畫",{"2":{"175":1}}],["變動前的值",{"2":{"164":2}}],["變動的屬性",{"2":{"164":2}}],["變動的元素",{"2":{"164":2,"165":2,"166":1}}],["變動的記錄包含的資訊",{"2":{"164":1}}],["變動類型",{"2":{"164":2}}],["變爻為",{"2":{"60":1}}],["變爻用陣列回傳",{"2":{"60":1}}],["變數名",{"2":{"241":1,"249":1}}],["變數名稱",{"2":{"202":1}}],["變數名稱設定跟元素名稱一樣",{"2":{"147":1}}],["變數宣告範例",{"2":{"89":2}}],["變數宣告後",{"2":{"89":1}}],["變數宣告",{"0":{"89":1}}],["變數保留字",{"2":{"88":1}}],["變數命名規範參考",{"2":{"88":1}}],["變數命名",{"0":{"88":1}}],["變數觀念",{"0":{"87":1}}],["變數或是數字的文字",{"2":{"77":1}}],["變數前使用變數會出現錯誤",{"2":{"63":1}}],["變數",{"0":{"86":1},"1":{"87":1,"88":1,"89":1,"90":1},"2":{"31":1,"86":1,"87":1,"237":1}}],["變成同步函式",{"2":{"5":1}}],["＜",{"2":{"31":1}}],["數值",{"2":{"150":1}}],["數值判斷",{"2":{"31":2}}],["數學代數範例",{"2":{"87":1}}],["數學運算子",{"0":{"79":1}}],["數過的數字總和會超過",{"2":{"60":1}}],["數字卦占卜方式",{"2":{"60":1}}],["數字3",{"2":{"46":2}}],["數字2",{"2":{"46":2}}],["數字1",{"2":{"46":2}}],["數字處理使用",{"2":{"46":1}}],["數字處理相關語法",{"2":{"45":1}}],["數字大小比較範例",{"2":{"31":1}}],["數字外",{"2":{"26":1}}],["數字",{"0":{"45":1},"1":{"46":1,"47":1},"2":{"24":1,"46":7,"53":1,"61":1,"90":1,"138":1,"240":1}}],["大多數語言的時間戳記都是以秒為單位",{"2":{"143":1}}],["大多數的伺服器都有設置跨網域防護",{"2":{"12":1}}],["大",{"2":{"47":2}}],["大於等於",{"2":{"126":1}}],["大於",{"2":{"31":3,"126":1}}],["說明及價格",{"2":{"117":1}}],["說明",{"2":{"31":1,"32":1,"79":1,"139":1,"143":1,"153":1,"188":1,"258":1}}],["例如使用",{"2":{"220":1}}],["例如使用者的密碼",{"2":{"93":1}}],["例如這個網站就是使用",{"2":{"171":1}}],["例如做一個簡單的時鐘",{"2":{"170":1}}],["例如想要取得同一層的下兩個元素",{"2":{"147":1}}],["例如在使用抓取網站元素的程式碼時",{"2":{"69":1}}],["例如廣告",{"2":{"69":1}}],["例如",{"2":{"31":1,"170":1,"172":1}}],["或重新命名變數",{"2":{"249":1}}],["或引用外部資源",{"2":{"222":1}}],["或其他預處理器的檔案",{"2":{"221":1}}],["或外部",{"2":{"221":1}}],["或建立後在",{"2":{"205":1}}],["或使用在",{"2":{"193":1}}],["或使用迴圈",{"2":{"147":1}}],["或加入更多的功能",{"2":{"144":1,"178":1,"185":1}}],["或獲取資訊",{"2":{"137":1}}],["或簡稱",{"2":{"90":1}}],["或稱作浮點",{"2":{"90":1}}],["或更多的時候",{"2":{"35":1}}],["或是在",{"2":{"263":2}}],["或是解構",{"2":{"257":1}}],["或是解構配",{"2":{"257":1}}],["或是自己的工具",{"2":{"253":1}}],["或是單獨轉成",{"2":{"245":1}}],["或是安裝套件",{"2":{"190":1}}],["或是詢問相關工程師",{"2":{"170":1}}],["或是將程式碼放在單獨的",{"2":{"69":1}}],["或是",{"2":{"31":2,"172":1,"229":1,"237":2,"256":1,"257":1}}],["或是陣列的",{"2":{"23":1}}],["或",{"2":{"31":1,"32":2,"50":1,"55":1,"60":1,"69":1,"90":3,"126":1,"208":1,"226":1,"237":1,"248":1,"258":1,"261":1}}],["我們先來了解一下這門課程的內容和學習方法",{"2":{"168":1}}],["我們可以透過偵測事件",{"2":{"153":1}}],["我們會給資料一個名字",{"2":{"87":1}}],["我們需要依照程式的情況來選擇使用不同的迴圈",{"2":{"70":1}}],["我的名字是$",{"2":{"81":1}}],["我的名字是",{"2":{"81":1}}],["我就去看電影",{"2":{"32":1}}],["我希望永遠不必交",{"2":{"30":2}}],["我是",{"2":{"27":2,"28":1,"240":1,"241":1}}],["條件三",{"2":{"35":1}}],["條件二",{"2":{"35":1}}],["條件一",{"2":{"35":1}}],["條件不成立時的程式碼",{"2":{"30":1}}],["條件不成立時的動作",{"2":{"30":1}}],["條件成立時的程式碼",{"2":{"30":1}}],["條件成立時的動作",{"2":{"30":1}}],["條件",{"2":{"30":3,"33":1}}],["它可以讓程式根據不同的情況去執行不同的程式碼",{"2":{"29":1}}],["它的值也可以是",{"2":{"26":1}}],["建立使用",{"2":{"261":2}}],["建立與使用",{"0":{"244":1}}],["建立網站",{"2":{"214":1,"229":1}}],["建立網頁伺服器",{"2":{"193":1}}],["建立時打開",{"2":{"205":1}}],["建立新的",{"2":{"205":1}}],["建立索引",{"2":{"125":2}}],["建立",{"2":{"109":1,"110":1,"112":1,"121":2,"164":1,"165":1,"166":1,"197":1,"202":1,"216":1,"220":1,"225":1}}],["建立一個資料名稱為",{"2":{"257":1}}],["建立一個觀察者",{"2":{"165":1,"166":1}}],["建立一個",{"2":{"95":1,"216":1}}],["建立物件",{"2":{"28":1}}],["建議在",{"2":{"265":1}}],["建議取得元素時使用",{"2":{"147":1}}],["建議使用套件",{"2":{"143":1}}],["建議使用",{"2":{"88":1}}],["建議使用有意義的文字當作名稱",{"2":{"88":1}}],["建議以程式碼的功能命名",{"2":{"55":1}}],["建議搭配",{"2":{"5":1}}],["宣告元件的",{"2":{"244":1}}],["宣告後不能修改",{"2":{"89":1}}],["宣告後就不能再修改值",{"2":{"89":1}}],["宣告了一個變數",{"2":{"71":1}}],["宣告變數",{"2":{"71":1}}],["宣告的變數會被提升到最上面",{"2":{"63":2}}],["宣告",{"2":{"55":2,"147":1}}],["宣告時通常會使用",{"2":{"55":1}}],["宣告時可以使用",{"2":{"55":1}}],["宣告類別",{"2":{"28":1}}],["宣告一個模板後",{"2":{"28":1}}],["宣告一個數字陣列",{"2":{"25":1}}],["來查詢商品",{"2":{"117":1}}],["來判斷",{"2":{"31":1}}],["來建立物件",{"2":{"28":1}}],["來宣告類別",{"2":{"28":1}}],["來代表這個物件",{"2":{"27":1}}],["代表傳入元件的",{"2":{"241":1}}],["代表同一層",{"2":{"226":1}}],["代表兩邊都執行",{"2":{"220":1}}],["代表只在瀏覽器執行",{"2":{"220":1}}],["代表只在",{"2":{"220":1}}],["代表迴圈到的元素或發生事件的元素",{"2":{"180":1}}],["代表被翻開",{"2":{"178":1}}],["代表目前網頁載入狀態",{"2":{"160":1}}],["代表元素",{"2":{"150":1}}],["代表整個網頁的根元素",{"2":{"147":1}}],["代表整個網頁",{"2":{"147":1}}],["代表整數數字",{"2":{"90":1}}],["代表回傳的請求",{"2":{"114":1}}],["代表進來的請求",{"2":{"114":1}}],["代表非數字",{"2":{"90":1}}],["代表布林值",{"2":{"90":1}}],["代表文字字串",{"2":{"90":1}}],["代表小數",{"2":{"90":1}}],["代表什麼",{"2":{"83":1}}],["代表先執行",{"2":{"79":2}}],["代表加一和減一",{"2":{"79":1}}],["代表倒數",{"2":{"51":1}}],["代表找到的東西",{"2":{"50":1}}],["代表找不到",{"2":{"42":2,"50":2}}],["代表前面的值",{"2":{"43":1}}],["代表後面的值",{"2":{"43":1}}],["代表否則",{"2":{"30":1}}],["代表如果",{"2":{"30":1}}],["代表",{"2":{"27":2,"31":1,"83":1,"147":2,"180":1,"222":1,"231":1,"258":1}}],["代表這個物件",{"2":{"27":1}}],["裡找檔名為",{"2":{"221":1}}],["裡面只能有一個",{"2":{"266":1}}],["裡面",{"2":{"238":1,"268":1}}],["裡面要放",{"2":{"237":2}}],["裡面放",{"2":{"237":1}}],["裡面的資源",{"2":{"268":1}}],["裡面的資源時使用相對路徑",{"2":{"268":1}}],["裡面的東西打包時僅是將檔案複製貼上",{"2":{"268":1}}],["裡面的東西打包時會為檔名加上",{"2":{"268":1}}],["裡面的最後一個東西後插入",{"2":{"181":2}}],["裡面的第一個東西前插入",{"2":{"181":2}}],["裡面包含所有相交的元素",{"2":{"166":1}}],["裡面包含所有變動的紀錄",{"2":{"164":1,"165":1}}],["裡面開一個空的",{"2":{"121":1}}],["裡的",{"2":{"81":1,"217":2}}],["裡",{"2":{"27":2,"89":1,"219":2}}],["裡搜尋名為",{"2":{"5":1}}],["你有上千個圖片",{"2":{"268":1}}],["你有玩原神嗎",{"2":{"34":1}}],["你需要在打包後指定特定檔案的名字",{"2":{"268":1}}],["你可以直接進語音頻道開螢幕分享",{"2":{"172":1}}],["你可以用",{"2":{"34":1}}],["你應該",{"2":{"172":1}}],["你點了按鈕",{"2":{"154":1,"155":1}}],["你千萬別把這個密秘告訴別人哦",{"2":{"47":1}}],["你的",{"2":{"69":2}}],["你的星座是",{"2":{"39":1}}],["你的成績是",{"2":{"35":4}}],["你得了",{"2":{"39":1}}],["你輸了",{"2":{"39":1}}],["你是可莉玩家嗎",{"2":{"34":1}}],["你會寫",{"2":{"34":1}}],["你喜歡",{"2":{"33":1}}],["你假日想做什麼事",{"2":{"32":1}}],["你好棒",{"2":{"155":1,"182":1}}],["你好",{"2":{"27":2,"28":1,"39":1,"81":1,"240":1,"241":1}}],["你還不知道考試結果",{"2":{"4":1}}],["王",{"2":{"27":1,"28":2,"81":1,"240":1,"241":1}}],["王小明",{"2":{"19":3,"23":1}}],["溫度最低的日子與時段",{"2":{"25":1}}],["溫度最高的日子與時段",{"2":{"25":1}}],["星期",{"2":{"143":1}}],["星期四",{"2":{"25":1}}],["星期三",{"2":{"25":1}}],["星期二",{"2":{"25":1}}],["星期一",{"2":{"25":1}}],["作者名",{"2":{"229":1}}],["作者",{"2":{"188":1}}],["作弊是可以的",{"2":{"170":1}}],["作法是將程式分割成以下三個元件",{"2":{"104":1}}],["作業系統",{"2":{"139":1}}],["作業",{"2":{"25":1,"39":1,"47":1,"77":1,"144":1,"162":1,"178":1,"185":1,"242":1,"258":1,"271":1}}],["作為值",{"2":{"27":1}}],["作為",{"2":{"15":1}}],["請使用",{"2":{"242":2,"250":1}}],["請使用這四個數字組成數字不重複的三位數",{"2":{"77":1}}],["請自己先上網尋找答案",{"2":{"172":1}}],["請多指教`",{"2":{"81":1}}],["請多指教",{"2":{"81":1}}],["請問",{"2":{"77":1}}],["請將兩個數字傳入",{"2":{"60":1}}],["請將上表的內容設定成二維陣列",{"2":{"25":2}}],["請編寫一個",{"2":{"53":1}}],["請寫一個程式",{"2":{"60":1}}],["請寫一個",{"2":{"47":1,"60":2}}],["請輸入使用者名字",{"2":{"141":1}}],["請輸入有效年齡",{"2":{"111":1}}],["請輸入名字",{"2":{"38":2}}],["請輸入年齡",{"2":{"35":1}}],["請注意符號的擺放位置",{"2":{"31":1}}],["請求方式為",{"2":{"117":6}}],["請求會執行",{"2":{"112":4}}],["請求先進去登入驗證的",{"2":{"96":1}}],["請求結束",{"2":{"16":1}}],["請求中",{"2":{"9":1}}],["請求如圖",{"2":{"7":1}}],["請求",{"0":{"7":1},"1":{"8":1,"9":1,"10":1,"11":1}}],["請求與",{"0":{"6":1},"1":{"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":1,"14":1,"15":1,"16":1}}],["銷售員",{"2":{"25":3}}],["而是",{"2":{"253":1}}],["而在程式裡",{"2":{"87":1}}],["而不是物件",{"2":{"27":1}}],["而不是整個檔案",{"2":{"207":1}}],["而不是整個物件",{"2":{"24":1}}],["而不是整個陣列",{"2":{"24":1}}],["而該公司共有三位銷售員",{"2":{"25":1}}],["其實是以",{"2":{"62":1}}],["其他數字",{"2":{"237":1}}],["其他地方不用動",{"2":{"190":1}}],["其他事件需使用",{"2":{"182":1}}],["其他商品",{"2":{"117":2}}],["其他錯誤",{"2":{"101":1}}],["其他功能",{"0":{"67":1}}],["其他陣列處理套件",{"2":{"43":1}}],["其他",{"0":{"43":1},"2":{"244":2}}],["其他都可以",{"2":{"32":1}}],["其單價分別為",{"2":{"25":1}}],["其餘文字",{"2":{"24":1}}],["其餘元素",{"2":{"20":1}}],["假設文文所寫的",{"2":{"47":1}}],["假設某一公司有五種產品",{"2":{"25":1}}],["假設媽媽說",{"2":{"4":1}}],["高中生程式解題系統",{"2":{"25":1,"47":1,"60":1}}],["題目修改自",{"2":{"25":1,"47":1,"60":1}}],["9s",{"2":{"144":1}}],["999",{"2":{"143":1}}],["99",{"2":{"111":1}}],["9a",{"2":{"50":9}}],["90px",{"2":{"178":1}}],["90",{"2":{"35":1}}],["95",{"2":{"35":1}}],["9",{"2":{"25":1,"50":1,"77":2,"79":3,"150":1}}],["70",{"2":{"185":4}}],["72",{"2":{"77":1}}],["734",{"2":{"60":2}}],["77",{"2":{"25":2,"61":6}}],["7",{"2":{"25":3,"46":1,"47":2,"51":5,"71":1,"77":1,"80":2,"97":1,"150":1}}],["75px",{"2":{"159":2}}],["75",{"2":{"25":1}}],["86400000",{"2":{"83":4}}],["81",{"2":{"77":1}}],["847",{"2":{"61":6}}],["89",{"2":{"61":1}}],["8080",{"2":{"193":3}}],["80",{"2":{"35":1}}],["8",{"2":{"25":5,"46":6,"60":4,"61":2,"77":3,"150":2,"178":1,"222":1,"258":1}}],["元件外使用jsimport",{"2":{"257":1}}],["元件資料",{"2":{"244":2}}],["元件模板",{"2":{"244":2}}],["元件會使用到的",{"2":{"240":1}}],["元件的資料",{"2":{"240":1}}],["元件被銷毀時",{"2":{"239":1}}],["元件被建立",{"2":{"239":2}}],["元件讓頁面套用版面",{"2":{"216":1}}],["元件",{"0":{"243":1},"1":{"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1},"2":{"214":1,"256":2}}],["元素或html",{"2":{"181":2}}],["元素縮放時會觸發",{"2":{"165":1}}],["元素變動時會執行指定的",{"2":{"164":1}}],["元素的寬高包含邊框",{"2":{"165":2}}],["元素的寬高不包含邊框",{"2":{"165":2}}],["元素的寬高與座標",{"2":{"165":2}}],["元素的寬度",{"2":{"165":4}}],["元素的高度",{"2":{"165":4}}],["元素的變化",{"2":{"163":1}}],["元素的事件可以像",{"2":{"154":1}}],["元素的行內樣式",{"2":{"148":1}}],["元素改變時",{"2":{"153":1}}],["元素上",{"2":{"153":1}}],["元素物件都是",{"2":{"150":1}}],["元素後標籤之後",{"2":{"149":1}}],["元素後標籤之前",{"2":{"149":1}}],["元素前標籤之後",{"2":{"149":1}}],["元素前標籤之前",{"2":{"149":1}}],["元素移動",{"0":{"149":1}}],["元素",{"0":{"242":1},"2":{"148":1,"149":1,"153":1,"164":1,"165":2,"166":2,"180":1,"266":1}}],["元素屬性",{"2":{"148":1}}],["元素內的",{"2":{"148":1}}],["元素內的文字",{"2":{"148":1}}],["元的手續費",{"2":{"47":1}}],["元",{"2":{"25":4}}],["饅頭第一天",{"2":{"25":1}}],["求小明買饅頭花費的總金額",{"2":{"25":1}}],["求",{"2":{"25":1,"61":1}}],["個別",{"2":{"254":1}}],["個別刪除",{"2":{"242":1}}],["個元素綁定事件",{"2":{"155":1}}],["個字",{"2":{"111":2}}],["個字母是",{"2":{"47":1}}],["個字母",{"2":{"18":1,"47":1}}],["個顏色漸變的",{"2":{"71":1}}],["個大寫字母",{"2":{"47":1}}],["個數字",{"2":{"47":2,"61":1}}],["個數字為",{"2":{"25":1}}],["綜合練習",{"0":{"25":1,"39":1,"44":1,"47":1,"53":1,"60":1,"77":1,"85":1,"151":1,"162":1,"183":1}}],["6+90",{"2":{"144":2}}],["66",{"2":{"144":1}}],["6px",{"2":{"144":3}}],["60",{"2":{"144":1}}],["600",{"2":{"43":1}}],["63",{"2":{"77":1}}],["64",{"2":{"46":2,"77":1}}],["65",{"2":{"25":2}}],["67",{"2":{"25":2}}],["68",{"2":{"25":2}}],["692",{"2":{"60":2}}],["69",{"2":{"25":1}}],["6",{"2":{"24":2,"25":5,"35":2,"47":2,"51":2,"60":3,"61":1,"77":2}}],["改為",{"2":{"214":1}}],["改成",{"2":{"201":1}}],["改變",{"2":{"65":3}}],["改變其中一個會影響另一個",{"2":{"24":1}}],["改變其中一個不會影響另一個",{"2":{"24":1}}],["改善了",{"2":{"212":1}}],["改善",{"2":{"5":1,"213":1}}],["傳出資料",{"0":{"246":1}}],["傳程式碼時請使用程式碼標記",{"2":{"172":1}}],["傳入的資料名及類型",{"2":{"245":1}}],["傳入的資料",{"2":{"96":1}}],["傳入的資料叫做",{"2":{"56":1}}],["傳入資料",{"0":{"56":1,"245":1}}],["傳值",{"2":{"24":1}}],["傳值與傳址",{"0":{"24":1}}],["傳遞資料",{"2":{"11":1}}],["進行實作",{"2":{"170":1}}],["進行迴圈",{"2":{"23":1}}],["進度分為三種",{"2":{"160":1}}],["進入網址時才載入",{"2":{"256":1}}],["進入網頁時出現三個輸入視窗",{"2":{"39":1}}],["進入某資料庫",{"2":{"126":1}}],["進來這裡的",{"2":{"112":4}}],["進階",{"0":{"0":1,"91":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"92":1,"93":1,"94":1,"95":1,"96":1,"97":1,"98":1,"99":1,"100":1,"101":1,"102":1}}],["針對物件的",{"2":{"23":1}}],["針對陣列的值進行迴圈",{"2":{"23":1}}],["迴圈到的元素",{"2":{"180":1}}],["迴圈到的索引",{"2":{"180":1}}],["迴圈每個元素",{"2":{"180":2}}],["迴圈處理",{"2":{"147":1}}],["迴圈取得的元素時",{"2":{"147":1}}],["迴圈倒過來寫",{"2":{"74":1}}],["迴圈其實就只是把",{"2":{"74":1}}],["迴圈裡面又有一個",{"2":{"72":1}}],["迴圈執行的條件",{"2":{"71":1}}],["迴圈通常會用在有固定執行次數的迴圈",{"2":{"71":1}}],["迴圈則可以讓程式重複的執行一樣的動作",{"2":{"70":1}}],["迴圈陣列",{"2":{"41":1,"42":7,"43":2}}],["迴圈範例",{"2":{"23":2,"73":1}}],["迴圈",{"0":{"23":1,"70":1},"1":{"71":1,"72":1,"73":1,"74":1,"75":1,"76":1,"77":1},"2":{"72":1,"76":3}}],["活動資訊",{"2":{"21":1}}],["政府資料開放平台",{"2":{"21":1}}],["zoom",{"2":{"231":1}}],["zombie",{"2":{"185":6}}],["zb$",{"2":{"185":3}}],["zbid++",{"2":{"185":1}}],["zbid",{"2":{"185":4}}],["zip",{"2":{"121":1}}],["zzz",{"2":{"43":2}}],["zh",{"2":{"36":3,"143":1,"154":2}}],["z",{"2":{"21":1,"38":2,"50":9,"53":2}}],["年齡必填",{"2":{"111":1}}],["年齡分級判斷範例",{"2":{"35":1}}],["年",{"2":{"21":1}}],["yml",{"2":{"271":1}}],["your",{"2":{"215":6,"229":5,"258":4}}],["youtube",{"2":{"12":1}}],["yes",{"2":{"35":4,"37":1,"71":1,"73":1,"74":1,"231":1}}],["y",{"2":{"21":2,"25":1,"38":2,"88":2,"166":1,"167":2,"172":1}}],["班",{"2":{"21":2}}],["小遊戲",{"2":{"173":1}}],["小時待命回答你的問題",{"2":{"172":1}}],["小時",{"2":{"143":1}}],["小寫",{"2":{"53":1}}],["小寫轉大寫後顯示在網頁上",{"2":{"44":1}}],["小",{"2":{"47":1}}],["小於兩個字時輸入欄位邊框是紅色",{"2":{"242":1}}],["小於等於",{"2":{"31":1,"126":1}}],["小於",{"2":{"31":1,"126":1}}],["小美",{"2":{"21":1,"28":1}}],["小明數了多少個數字後",{"2":{"60":1}}],["小明喜歡數數",{"2":{"60":1}}],["小明他從第一天起",{"2":{"25":1}}],["小明",{"2":{"21":1,"27":1,"28":1,"81":1,"240":1,"241":1}}],["巢狀判斷式",{"0":{"37":1}}],["巢狀",{"0":{"21":1,"72":1}}],["並解構",{"2":{"245":1}}],["並根據網址自動產生",{"2":{"219":2}}],["並不是所有儲存在",{"2":{"209":1}}],["並部署到",{"2":{"205":1}}],["並新增下面的設定",{"2":{"200":1}}],["並指定插入位置",{"2":{"149":1}}],["並熟悉",{"2":{"103":1}}],["並加入太大",{"2":{"77":1}}],["並將",{"2":{"214":1}}],["並將處理後的上卦名",{"2":{"60":1}}],["並將回傳值放入",{"2":{"41":1,"83":1}}],["並使用該",{"2":{"47":1}}],["並用",{"2":{"28":1}}],["並用表格顯示資料",{"2":{"16":1}}],["並依序完成下列各題",{"2":{"25":2}}],["並設定為陣列或物件中的某個值",{"2":{"20":1}}],["這樣在引用資源時比較好管理路徑",{"2":{"265":1}}],["這是編譯後會顯示出來的註解",{"2":{"226":6}}],["這是多行註解",{"2":{"226":3}}],["這張牌還沒配對",{"2":{"178":1}}],["這些語法都只能相對距離為",{"2":{"147":1}}],["這些語法可以串聯使用",{"2":{"147":1}}],["這些代數被稱為",{"2":{"87":1}}],["這裡也能設定",{"2":{"216":1}}],["這裡最後的路徑會是",{"2":{"112":4}}],["這裡的",{"2":{"96":1}}],["這行將數字加",{"2":{"79":2}}],["這個套件是內建的",{"2":{"204":1}}],["這個表列出了常見的指派運算子",{"2":{"80":1}}],["這個表列出了常見的數學運算子",{"2":{"79":1}}],["這個人的",{"2":{"19":3}}],["這種迴圈結構較簡單",{"2":{"73":1}}],["這種不會影響到外部的資料的",{"2":{"56":1}}],["這就是一個",{"2":{"4":1}}],["kodai",{"2":{"185":1}}],["kento",{"2":{"232":1}}],["kento520",{"2":{"148":2}}],["key=",{"2":{"268":1}}],["keyup",{"2":{"153":1}}],["keydown",{"2":{"153":1,"237":4,"242":1}}],["keyframes",{"2":{"144":1}}],["keys",{"2":{"114":3}}],["key",{"2":{"19":6,"20":1,"23":3,"101":2,"114":6,"125":2,"157":4,"219":9,"237":2}}],["kinggeorgeⅶ",{"2":{"88":2}}],["k",{"2":{"47":2}}],["kktix",{"2":{"12":1,"13":1,"14":1,"15":4,"16":2,"21":1,"219":4}}],["取到的元素數量",{"2":{"180":1}}],["取所有符合的",{"2":{"147":1}}],["取消",{"2":{"83":1}}],["取三個數字",{"2":{"60":1}}],["取代",{"2":{"148":2}}],["取代多筆資料",{"2":{"127":1}}],["取代文字只會取代找到的第一個",{"2":{"50":1}}],["取代文字",{"2":{"50":1}}],["取代陣列中的元素",{"2":{"41":1}}],["取",{"2":{"47":2}}],["取陣列的最大值與最小值可以利用",{"2":{"46":1}}],["取最大值",{"2":{"46":1}}],["取最小值",{"2":{"46":1}}],["取第一個符合的",{"2":{"147":1}}],["取第一個不是",{"2":{"38":1}}],["取第一個",{"2":{"38":2}}],["取值",{"2":{"19":3}}],["取得路由資訊",{"2":{"256":2}}],["取得行內樣式",{"2":{"181":1}}],["取得標籤屬性",{"2":{"181":1}}],["取得輸入欄位的值",{"2":{"181":1}}],["取得文字",{"2":{"181":1}}],["取得要觀察的元素",{"2":{"165":1,"166":1}}],["取得並移除已經發生但尚未處理記錄",{"2":{"164":1}}],["取得上一層節點",{"2":{"150":1}}],["取得上一層元素",{"2":{"147":1}}],["取得上一個同一層節點",{"2":{"150":1}}],["取得下一個同一層節點",{"2":{"150":1}}],["取得下一層最後一個元素",{"2":{"147":1}}],["取得下一層第一個元素",{"2":{"147":1}}],["取得下一層所有元素",{"2":{"147":1}}],["取得最後一個子節點",{"2":{"150":1}}],["取得最終樣式",{"2":{"148":1}}],["取得節點值",{"2":{"150":1}}],["取得節點名稱",{"2":{"150":1}}],["取得節點類型",{"2":{"150":1}}],["取得樣式範例",{"2":{"148":1}}],["取得同一層的上一個元素",{"2":{"147":1}}],["取得同一層的下一個元素",{"2":{"147":1}}],["取得所有子節點",{"2":{"150":1}}],["取得所有",{"2":{"147":3}}],["取得所有傳入的參數",{"2":{"58":1}}],["取得",{"2":{"147":1,"150":2,"181":1}}],["取得元素是同一層的第幾個",{"2":{"180":2}}],["取得元素內的",{"2":{"148":1}}],["取得元素內的文字",{"2":{"148":1}}],["取得元素的",{"2":{"148":1}}],["取得元素屬性",{"2":{"148":2}}],["取得元素",{"0":{"147":1},"2":{"148":1}}],["取得網址路徑",{"2":{"137":2}}],["取得網域名稱",{"2":{"137":2}}],["取得第一個子節點",{"2":{"150":1}}],["取得第一個",{"2":{"114":1}}],["取得剩餘的資料",{"2":{"20":1}}],["取得某索引的資料",{"2":{"19":1}}],["取得資料的方法",{"2":{"219":2}}],["取得資料",{"2":{"19":1,"249":1}}],["取得長度",{"2":{"19":1}}],["取指定資料",{"2":{"18":1}}],["取長度",{"2":{"18":1}}],["06",{"2":{"232":1}}],["07",{"2":{"232":1}}],["0555",{"2":{"176":2}}],["0554",{"2":{"176":2}}],["0553",{"2":{"176":2}}],["0552",{"2":{"176":2}}],["0551",{"2":{"176":2}}],["0104",{"2":{"175":1}}],["0ff",{"2":{"144":1}}],["0deg",{"2":{"144":3}}],["0px",{"2":{"144":10,"167":2}}],["04",{"2":{"143":1}}],["00ff7f",{"2":{"144":1}}],["00",{"2":{"143":5}}],["02",{"2":{"21":1,"22":1,"143":1}}],["0",{"2":{"18":5,"20":1,"22":3,"23":1,"24":4,"25":2,"35":2,"36":1,"38":2,"39":2,"42":2,"43":3,"46":8,"47":1,"50":15,"60":1,"61":12,"71":6,"73":1,"74":1,"76":1,"77":1,"79":4,"85":1,"114":3,"116":2,"117":10,"124":5,"143":8,"144":6,"166":7,"167":3,"175":4,"176":4,"178":4,"180":3,"181":4,"185":6,"188":2,"244":2,"257":1}}],["第一個",{"2":{"180":1}}],["第一個星的顏色為",{"2":{"71":1}}],["第一個數字",{"2":{"60":1}}],["第三個",{"2":{"180":1}}],["第三個數字",{"2":{"60":1}}],["第三天",{"2":{"25":1}}],["第二個數字",{"2":{"60":1}}],["第二個參數是選填",{"2":{"42":2,"50":3}}],["第二爻",{"2":{"60":1}}],["第二天",{"2":{"25":1}}],["第幾個",{"2":{"19":1}}],["第",{"2":{"18":3,"25":1,"77":2}}],["魚排飯",{"2":{"18":4,"21":1,"23":3}}],["排骨飯",{"2":{"18":4,"21":1,"23":3}}],["等等都放這裡",{"2":{"266":1}}],["等套件",{"2":{"248":1}}],["等頁面載入完後再取資料",{"2":{"219":1}}],["等問題",{"2":{"212":1}}],["等待提交",{"2":{"208":1}}],["等非文字檔案修改了哪些東西",{"2":{"207":1}}],["等環境變數",{"2":{"205":1}}],["等資訊寫入環境設定檔",{"2":{"202":1}}],["等代表匯入檔案",{"2":{"190":1}}],["等到所有變動都完成後再執行",{"2":{"164":1}}],["等同於",{"2":{"149":1}}],["等特殊符號開頭",{"2":{"88":1}}],["等網頁解析完後才依擺放順序執行",{"2":{"69":1}}],["等工具將新語法轉換成舊瀏覽器支援的語法",{"2":{"68":1}}],["等於",{"2":{"31":4,"76":1}}],["等",{"2":{"18":1,"68":1,"170":1}}],["如何問問題",{"0":{"172":1}}],["如果有",{"2":{"239":1}}],["如果有一連串尺寸變動",{"2":{"165":1}}],["如果可以帶資料進去時需要",{"2":{"237":1}}],["如果沒有設定",{"2":{"270":1}}],["如果沒有要傳資料",{"2":{"237":1}}],["如果沒有符合的",{"2":{"36":1}}],["如果需要網址",{"2":{"215":1}}],["如果怕變數名稱跟檔案內的重複",{"2":{"192":1}}],["如果想換別家的東西",{"2":{"190":1}}],["如果想要更方便的做時間處理的話",{"2":{"143":1}}],["如果到",{"2":{"185":1}}],["如果兩張一樣",{"2":{"178":1}}],["如果翻開兩張了",{"2":{"178":1}}],["如果已翻開數小於兩張",{"2":{"178":1}}],["如果一次要為",{"2":{"155":1}}],["如果找不到資料就新增",{"2":{"127":1}}],["如果重複宣告的話舊的會被蓋掉",{"2":{"89":1}}],["如果輸入",{"2":{"77":1}}],["如果輸入的不是數字",{"2":{"53":1}}],["如果程式在網頁內容解析前執行",{"2":{"69":1}}],["如果整除",{"2":{"60":1}}],["如果要取得最終樣式",{"2":{"148":1}}],["如果要回傳物件",{"2":{"58":1}}],["如果要全部取代的話可以用迴圈或正則表達式",{"2":{"50":1}}],["如果要用正則表達式的話要用",{"2":{"50":1}}],["如果是",{"2":{"33":1,"101":1}}],["如果颱風天沒颳風也沒下雨",{"2":{"32":1}}],["如果成立",{"2":{"30":1}}],["如果",{"2":{"30":3,"72":1,"237":1}}],["如果物件裡面包含",{"2":{"26":1}}],["如果索引不存在會回傳",{"2":{"18":1}}],["如果你是用",{"2":{"204":1}}],["如果你覺得打字描述太慢",{"2":{"172":1}}],["如果你找到的方法不能用",{"2":{"172":1}}],["如果你在瀏覽",{"2":{"12":1}}],["如果你這禮拜考試及格",{"2":{"4":1}}],["如",{"2":{"18":1,"21":2,"209":1,"211":1,"237":1,"258":1}}],["會在",{"2":{"258":2}}],["會收到傳出的值",{"2":{"246":2}}],["會偵測陣列和物件內部變化",{"2":{"241":1}}],["會自動格式化輸出的",{"2":{"225":1}}],["會自動偵測變更重新產生",{"2":{"225":1}}],["會自動尋找檔案",{"2":{"221":1}}],["會自動讀取",{"2":{"189":1,"217":1}}],["會變成原生",{"2":{"180":1}}],["會合併成一次紀錄",{"2":{"165":1}}],["會先儲存變動記錄",{"2":{"164":1}}],["會先找目前區域的變數",{"2":{"89":1}}],["會送出表單至",{"2":{"158":1}}],["會開機啟動",{"2":{"120":1}}],["會使用字母儲存數值",{"2":{"87":1}}],["會直接跳到",{"2":{"76":2}}],["會執行這個動作",{"2":{"71":1}}],["會找不到元素而出錯",{"2":{"69":1}}],["會被提升",{"2":{"63":2}}],["會取代全部找到的",{"2":{"50":1}}],["會立即執行",{"2":{"41":1,"83":1}}],["會指向",{"2":{"27":1}}],["會有很大的幫助",{"2":{"21":1}}],["會用複數名詞",{"2":{"18":1}}],["會導向",{"2":{"5":1}}],["通常在命名陣列時",{"2":{"18":1}}],["通常會使用",{"2":{"3":1}}],["值會在相依變數修改時動態更新",{"2":{"240":1}}],["值是要修改的資料js",{"2":{"117":1}}],["值為欄位名稱",{"2":{"114":1}}],["值累加",{"2":{"43":1}}],["值變成新的陣列",{"2":{"43":1}}],["值",{"2":{"18":2,"114":1,"148":1,"231":1,"237":1,"249":1,"257":1}}],["又稱",{"2":{"18":4}}],["索引為",{"2":{"24":1}}],["索引名",{"2":{"19":1}}],["索引",{"0":{"125":1},"2":{"18":3,"53":1,"180":3,"237":1}}],["每工作",{"2":{"258":1}}],["每筆資料使用",{"2":{"111":1}}],["每秒在網頁上印出一個數字",{"2":{"85":1}}],["每次落地後反跳回原高度的一半再落下",{"2":{"77":1}}],["每次忘記密碼都得帶著身份證",{"2":{"47":1}}],["每個項目有",{"2":{"242":1}}],["每個元件都可以使用",{"2":{"222":1}}],["每個東西都執行提供的",{"2":{"41":1,"42":7,"43":2}}],["每個資料名稱叫做",{"2":{"19":1}}],["每日的平均溫度",{"2":{"25":1}}],["每一項都有刪除按鈕",{"2":{"183":1}}],["每一項產品的銷售總金額",{"2":{"25":1}}],["每一個銷售員的銷售總金額",{"2":{"25":1}}],["每一節車廂的乘客就是",{"2":{"18":1}}],["每一節車廂的號碼就是",{"2":{"18":1}}],["每天買的饅頭數依序為",{"2":{"25":1}}],["每節車廂就是一筆資料",{"2":{"18":1}}],["陣列放變數名",{"2":{"249":1}}],["陣列欄位名稱",{"2":{"117":1}}],["陣列本身",{"2":{"41":1}}],["陣列範例",{"2":{"24":1}}],["陣列傳址範例",{"2":{"24":1}}],["陣列迴圈範例",{"2":{"23":1}}],["陣列有固定長度",{"2":{"23":1}}],["陣列解構範例",{"2":{"20":1}}],["陣列的索引是從",{"2":{"18":1}}],["陣列",{"0":{"18":1,"40":1},"1":{"41":1,"42":1,"43":1,"44":1},"2":{"41":1,"90":1,"147":1,"237":1}}],["陣列是多種相似資料的集合",{"2":{"17":1}}],["陣列與物件",{"0":{"17":1},"1":{"18":1,"19":1,"20":1,"21":1,"22":1,"23":1,"24":1,"25":1}}],["失敗訊息",{"2":{"117":5}}],["失敗訊息及商品資料",{"2":{"117":1}}],["失敗",{"2":{"16":1}}],["v4",{"2":{"271":1}}],["volar",{"2":{"235":1}}],["voluptate",{"2":{"167":8}}],["voluptatem",{"2":{"167":8}}],["v1",{"2":{"231":1}}],["v3",{"2":{"219":2,"271":1}}],["vscode",{"2":{"200":1}}],["version",{"2":{"188":1}}],["versionkey",{"2":{"111":1}}],["vertical",{"2":{"144":3}}],["v",{"2":{"125":2,"219":6,"237":24,"242":1,"245":1,"247":2,"250":2,"268":2}}],["virtual",{"2":{"258":1}}],["vitest",{"2":{"261":1}}],["vitepwa",{"2":{"258":2}}],["vite",{"0":{"227":1,"251":1,"259":1,"260":1},"1":{"252":1,"253":1,"254":1,"260":1,"261":2,"262":2,"263":2,"264":2,"265":2,"266":1,"267":1,"268":1,"269":1,"270":1,"271":1},"2":{"215":2,"227":1,"253":1,"258":4,"259":1,"261":5,"265":1,"266":1,"270":1,"271":1}}],["visibility",{"2":{"178":2}}],["visual",{"2":{"121":1}}],["view>",{"2":{"256":2}}],["viewmodel",{"2":{"236":2}}],["viewport",{"2":{"222":3,"258":1}}],["view",{"2":{"104":2,"217":1,"236":1}}],["v2",{"2":{"101":1}}],["v8",{"2":{"66":1}}],["vant",{"2":{"253":1}}],["variant",{"2":{"261":1}}],["variable",{"2":{"89":1,"205":1}}],["varlet",{"2":{"253":1}}],["var",{"0":{"62":1},"2":{"62":4,"63":4,"89":3}}],["val",{"2":{"181":5}}],["validationerror",{"2":{"114":2}}],["validator",{"2":{"106":1,"111":2,"245":2}}],["validate",{"2":{"3":2,"111":1}}],["value++",{"2":{"219":3}}],["value=",{"2":{"65":3,"141":3,"149":6,"154":3,"155":5,"164":1,"165":1,"175":7,"176":2,"185":1,"219":3,"237":5,"246":1}}],["value",{"2":{"18":2,"19":1,"24":1,"41":7,"42":14,"43":5,"111":2,"154":2,"219":2,"222":2,"237":4,"240":1,"241":5,"245":5,"246":4,"247":4,"249":1,"257":2}}],["vue3",{"2":{"264":7}}],["vuex",{"2":{"255":1}}],["vuestic",{"2":{"253":1}}],["vuetify",{"2":{"253":1}}],["vuejs",{"2":{"231":1}}],["vuepress",{"0":{"228":1},"1":{"229":1,"230":1,"231":1,"232":1},"2":{"228":1,"229":1,"230":2,"231":8,"232":1}}],["vueapp",{"2":{"220":1}}],["vuegtag",{"2":{"220":2}}],["vue",{"0":{"233":1,"255":1},"1":{"234":1,"235":1,"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1,"256":1,"257":1,"258":1},"2":{"16":1,"35":1,"37":1,"71":1,"73":1,"74":1,"96":1,"102":1,"212":1,"213":2,"214":1,"216":2,"217":6,"220":5,"232":1,"233":2,"235":1,"236":3,"238":3,"239":3,"241":2,"242":2,"243":1,"244":4,"246":2,"249":2,"251":1,"253":3,"254":3,"256":6,"257":1,"258":1,"259":1,"261":6,"264":17,"265":1,"266":3,"267":1,"270":1,"271":1}}],["套件僅支援瀏覽器端執行",{"2":{"220":1}}],["套件將",{"2":{"204":1}}],["套件能製作",{"2":{"203":1}}],["套件能讓",{"2":{"202":1}}],["套件能在檔案存檔時自動重啟",{"2":{"201":1}}],["套件js",{"2":{"200":1}}],["套件設定",{"2":{"101":1}}],["套件",{"0":{"252":1,"253":1},"1":{"253":1,"254":1},"2":{"16":2,"193":1,"200":1,"219":2}}],["完成的項目文字必須要有刪除線",{"2":{"242":1}}],["完成時的",{"2":{"175":9}}],["完成後再次嘗試開發新的項目",{"2":{"170":1}}],["完成",{"2":{"15":2,"160":1}}],["返回的檔案格式是",{"2":{"15":1}}],["bitbucket",{"2":{"209":1}}],["big",{"2":{"181":2,"237":1}}],["bind",{"2":{"237":2,"268":1}}],["bin",{"2":{"120":2,"121":2}}],["bg",{"2":{"148":2}}],["build",{"2":{"190":2,"223":1,"258":2,"270":1,"271":2}}],["bubble",{"2":{"159":6}}],["bulkwriteresult",{"2":{"124":1}}],["button>",{"2":{"244":1,"250":6}}],["button",{"2":{"65":3,"141":3,"149":6,"154":3,"155":5,"164":1,"165":1,"175":7,"176":2,"185":1,"219":3,"237":3,"244":1,"246":1}}],["bcrypt",{"2":{"95":3,"106":1,"114":2}}],["b++",{"2":{"79":2}}],["balmui",{"2":{"253":1}}],["bar",{"2":{"231":1}}],["backface",{"2":{"178":2}}],["backgroundcolor",{"2":{"148":1}}],["background",{"2":{"144":8,"148":1,"159":2,"164":1,"165":1,"166":2,"167":3,"178":9,"185":1,"215":2,"268":2}}],["back",{"2":{"138":2,"178":3,"231":1}}],["bat",{"2":{"121":1}}],["base",{"2":{"270":2}}],["base64",{"2":{"93":1}}],["bash",{"2":{"93":1}}],["babel",{"2":{"68":1}}],["banana",{"2":{"20":1}}],["blog",{"2":{"229":1,"245":1}}],["blood",{"2":{"185":1}}],["blocksize",{"2":{"165":4}}],["block",{"2":{"159":2}}],["blob",{"2":{"14":1}}],["blur",{"2":{"153":1}}],["blue",{"2":{"148":1,"159":1,"181":3}}],["black",{"2":{"148":2,"164":1,"165":4,"167":2,"185":1,"231":1}}],["blank",{"2":{"65":1,"136":1}}],["btnclick",{"2":{"246":4}}],["btnclick=",{"2":{"246":1}}],["btns",{"2":{"155":8}}],["btn4",{"2":{"149":4}}],["btn3",{"2":{"149":4}}],["btn2",{"2":{"149":8}}],["btn1",{"2":{"149":8}}],["btn",{"2":{"65":12,"155":2,"156":4,"164":4,"165":4}}],["bearer",{"2":{"95":1}}],["been",{"2":{"89":1}}],["beforeeach",{"2":{"257":1}}],["beforeend",{"2":{"149":4}}],["beforebegin",{"2":{"149":4}}],["before",{"2":{"63":1}}],["bendon",{"2":{"23":2}}],["bendons",{"2":{"18":2,"23":8}}],["bendon3",{"2":{"18":1}}],["bendon2",{"2":{"18":1}}],["bendon1",{"2":{"18":1}}],["boilerplate",{"2":{"229":1,"231":1}}],["both",{"2":{"261":1}}],["bot",{"2":{"203":3}}],["boundingclientrect",{"2":{"166":1}}],["box",{"2":{"165":9}}],["borderboxsize",{"2":{"165":4}}],["border",{"2":{"144":6,"149":1,"165":7,"167":1,"237":2}}],["bom",{"0":{"134":1},"1":{"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1},"2":{"134":1,"135":2,"146":1,"155":1}}],["bootstrapvue3",{"2":{"253":1}}],["bool",{"2":{"90":2}}],["boolean",{"2":{"38":3,"42":3,"50":1,"90":1}}],["book",{"2":{"65":3,"175":1,"176":10,"178":3,"185":3}}],["bodyparser",{"2":{"96":1}}],["body>",{"2":{"69":2}}],["body",{"0":{"11":1},"2":{"11":2,"69":2,"114":5,"116":2,"147":2,"222":4}}],["brands",{"2":{"254":2}}],["branches",{"2":{"271":1}}],["branch",{"2":{"208":1,"271":1}}],["browser",{"2":{"134":1,"139":1,"258":1}}],["br>",{"2":{"65":2,"76":1,"140":2,"175":1}}],["br>`",{"2":{"18":1,"76":1}}],["break",{"0":{"76":1},"2":{"36":10,"76":3}}],["by",{"2":{"24":2}}],["bbb",{"2":{"20":4,"43":2,"63":1,"124":2}}],["b",{"2":{"18":2,"20":3,"24":15,"25":2,"31":33,"32":7,"35":1,"42":1,"43":12,"47":1,"61":9,"62":4,"79":17,"89":9,"192":7}}],["og",{"2":{"222":3,"258":1}}],["ohmyfetch",{"2":{"219":4}}],["option",{"2":{"256":1}}],["options",{"0":{"240":1},"2":{"218":1,"219":4,"238":1,"242":1,"245":1,"246":1,"247":1,"248":1,"249":2}}],["open",{"2":{"13":1,"136":3}}],["odio",{"2":{"167":8}}],["odit",{"2":{"167":8}}],["owner",{"2":{"166":4,"167":2}}],["observe",{"2":{"164":2,"165":3,"166":2,"167":3}}],["observer",{"0":{"163":1,"164":1,"165":1,"166":1},"1":{"164":1,"165":1,"166":1,"167":1},"2":{"163":1,"164":3,"165":5,"166":4,"167":6}}],["objectid",{"2":{"111":1,"124":3}}],["object",{"2":{"90":1,"114":3,"134":1,"145":1,"241":1}}],["obj2",{"2":{"24":5}}],["obj1",{"2":{"24":9}}],["obj",{"2":{"20":6,"42":3,"240":7,"241":11}}],["oldvalue",{"2":{"164":2,"240":8,"241":13}}],["old",{"2":{"148":1}}],["overflow",{"2":{"144":1,"166":1,"167":2,"176":2,"185":1}}],["oid",{"2":{"112":1,"116":1}}],["oruga",{"2":{"253":1}}],["org",{"2":{"173":1,"219":2,"231":1}}],["orbitron",{"2":{"144":1}}],["orientation",{"2":{"140":4}}],["origin",{"2":{"109":3,"144":3}}],["ordered",{"2":{"124":2}}],["orders",{"2":{"112":4,"114":1,"115":2,"116":3,"117":2}}],["orderschema",{"2":{"111":1}}],["output",{"2":{"223":1}}],["outline",{"2":{"166":1}}],["outer",{"2":{"159":7}}],["outerheight",{"2":{"136":2}}],["outerwidth",{"2":{"136":2}}],["out",{"2":{"62":1}}],["o",{"2":{"47":6,"131":1,"225":1,"258":1}}],["other",{"2":{"218":1}}],["otherfruits",{"2":{"41":3}}],["others",{"2":{"20":6}}],["ooo",{"2":{"39":2}}],["ok",{"2":{"31":9,"88":1,"125":1,"178":3}}],["offsety",{"2":{"157":1}}],["offsetx",{"2":{"157":1}}],["off",{"2":{"65":2}}],["of",{"2":{"22":2,"23":3,"50":3,"60":1,"147":1,"155":1,"164":1,"165":1,"166":1,"167":1,"229":3,"253":1,"258":3}}],["onofflineready",{"2":{"258":1}}],["onneedrefresh",{"2":{"258":1}}],["oncreated",{"2":{"249":2}}],["onclick=",{"2":{"154":3}}],["onclick",{"2":{"65":4,"141":3,"149":6,"155":1,"158":1}}],["onmounted",{"2":{"241":2,"248":1}}],["onreadystatechange",{"2":{"160":2}}],["onkeydown",{"2":{"157":1}}],["onbtnclick",{"2":{"246":4}}],["onbtnclick2",{"2":{"156":3}}],["onbtnclick1",{"2":{"156":3}}],["on",{"2":{"65":2,"175":7,"178":1,"182":4,"185":2,"203":1,"237":2,"248":2,"271":2}}],["one",{"2":{"20":4}}],["onerror",{"2":{"13":1}}],["onload",{"2":{"13":1,"155":1}}],["是開發",{"2":{"256":1}}],["是欄位的值",{"2":{"237":1}}],["是使用者選的值",{"2":{"237":1}}],["是使用者的瀏覽紀錄",{"2":{"138":1}}],["是樣式名",{"2":{"237":1}}],["是本頁的",{"2":{"222":1}}],["是伺服器渲染版的",{"2":{"212":1}}],["是事件處理",{"2":{"182":1}}],["是新增",{"2":{"181":2}}],["是否有",{"2":{"181":2}}],["是否有該",{"2":{"148":1}}],["是否跳到動畫結束",{"2":{"175":1}}],["是否停止之後的動畫",{"2":{"175":1}}],["是否與可視範圍相交",{"2":{"166":1}}],["是否紀錄舊內容",{"2":{"164":2}}],["是否紀錄舊屬性",{"2":{"164":2}}],["是否觀察所有內層",{"2":{"164":1}}],["是否觀察所有內層元素",{"2":{"164":1}}],["是否觀察下一層元素",{"2":{"164":1}}],["是否觀察下一層元素的增減",{"2":{"164":1}}],["是否觀察內容變動",{"2":{"164":2}}],["是否觀察屬性變動",{"2":{"164":2}}],["是否成功",{"2":{"117":6}}],["是毫秒",{"2":{"143":1}}],["是內建的物件",{"2":{"143":1}}],["是瀏覽器使用的語法標準",{"2":{"190":1}}],["是瀏覽器頁面網址",{"2":{"137":1}}],["是瀏覽器功能的核心",{"2":{"135":1}}],["是商品",{"2":{"117":1}}],["是更新前的資料",{"2":{"116":2}}],["是從",{"2":{"96":1}}],["是常數",{"2":{"89":1}}],["是區塊變數",{"2":{"89":1}}],["是全域變數",{"2":{"89":1}}],["是不同的變數",{"2":{"88":1}}],["是不正確的語法",{"2":{"20":1}}],["是一個基本使用免費的",{"2":{"211":1}}],["是一個提供",{"2":{"209":1}}],["是一個陣列",{"2":{"166":1}}],["是一種分散式版本的版本控制系統",{"2":{"207":1}}],["是一種輕量級標記式語言",{"2":{"171":1}}],["是一種設計模式",{"2":{"104":1}}],["是一種非同步的技術",{"2":{"6":1}}],["是一組",{"2":{"93":1}}],["是一天的毫秒數",{"2":{"83":1}}],["是網頁開發者必學的三種語言之一",{"2":{"64":1}}],["是的話回傳",{"2":{"60":1}}],["是倒數第一個字",{"2":{"51":1}}],["是另一種判斷式",{"2":{"36":1}}],["是物件建立時會執行的",{"2":{"28":1}}],["是第幾個數字",{"2":{"25":1}}],["是這個陣列的",{"2":{"18":2}}],["是最近相當熱門的",{"2":{"16":1}}],["是近年來號稱要取代xhr的新技術標準",{"2":{"14":1}}],["是",{"2":{"13":1,"41":2,"83":2,"166":1,"190":1,"219":2,"224":1,"237":3,"238":1,"240":1,"261":1}}],["最小值",{"2":{"111":1}}],["最小長度",{"2":{"111":1}}],["最大的不同是使用",{"2":{"236":1}}],["最大值",{"2":{"111":1}}],["最大長度",{"2":{"111":1}}],["最大數字和最小數字",{"2":{"25":1}}],["最基本的型態有下面幾種",{"2":{"90":1}}],["最後在按鈕下方用",{"2":{"162":1}}],["最後在網頁上顯示出來",{"2":{"53":1}}],["最後一個",{"2":{"71":1}}],["最後一個除以",{"2":{"60":1}}],["最後用條列式顯示所有文章的",{"2":{"5":1}}],["最早的",{"2":{"13":1}}],["xxx",{"2":{"256":1}}],["x64",{"2":{"121":1}}],["x86",{"2":{"121":1}}],["x＝",{"2":{"87":1}}],["x＝2",{"2":{"87":1}}],["x$",{"2":{"76":1}}],["x26",{"2":{"32":2,"34":2,"38":10,"114":2,"144":5,"176":2,"178":4,"222":2,"257":2}}],["x",{"2":{"21":2,"25":1,"38":2,"79":6,"80":18,"87":2,"151":1,"172":1,"244":1}}],["xhr",{"2":{"13":7,"15":3}}],["xmlhttprequest",{"0":{"13":1},"2":{"13":2}}],["x3c",{"2":{"3":1,"18":2,"22":5,"23":1,"32":1,"50":6,"61":1,"65":28,"69":14,"71":4,"76":8,"88":6,"139":6,"140":8,"141":7,"144":29,"147":1,"148":2,"149":46,"150":5,"154":5,"155":7,"157":6,"158":6,"159":12,"164":9,"165":11,"166":16,"167":39,"175":13,"176":41,"178":17,"181":10,"185":18,"215":9,"216":20,"219":45,"222":17,"226":10,"227":2,"236":3,"237":43,"242":2,"244":5,"245":2,"246":5,"247":2,"250":33,"254":1,"256":6,"257":2,"258":12,"268":11}}],["時根據設定自動產生基本的底",{"2":{"258":1}}],["時根據設定自動產生",{"2":{"258":1}}],["時選擇",{"2":{"256":1,"257":1}}],["時必須要給插槽名字",{"2":{"250":1}}],["時必須要建立資料庫綱要",{"2":{"111":1}}],["時需要在這時",{"2":{"239":1}}],["時只寫名字",{"2":{"237":1}}],["時只要使用",{"2":{"55":1}}],["時洩漏資訊",{"2":{"202":1}}],["時鐘",{"0":{"142":1,"144":1},"1":{"143":1,"144":1}}],["時停止載入網頁",{"2":{"69":1}}],["時間到時文字變成紅色的",{"2":{"151":1}}],["時間到",{"2":{"85":1,"151":1,"185":1}}],["時間",{"2":{"59":4}}],["時的錯誤",{"2":{"27":1}}],["時段三的平均氣溫",{"2":{"25":1}}],["時段三",{"2":{"25":1}}],["時段二",{"2":{"25":2}}],["時段二與時段三的氣溫",{"2":{"25":1}}],["時段一",{"2":{"25":2}}],["時",{"2":{"12":1,"36":1,"41":1,"76":1,"83":1,"149":1,"220":1,"221":1,"271":1}}],["想像一下",{"2":{"12":1}}],["在要引用的大元件的",{"2":{"267":1}}],["在需要使用",{"2":{"254":1}}],["在元件內使用html",{"2":{"257":1}}],["在元件內用",{"2":{"250":1}}],["在元素內指定位置插入",{"2":{"149":1}}],["在編輯欄位可以按",{"2":{"242":1}}],["在編輯欄位按",{"2":{"242":1}}],["在編寫時",{"2":{"24":1}}],["在開發",{"2":{"236":1}}],["在開始之前",{"0":{"168":1},"1":{"169":1,"170":1,"171":1,"172":1,"173":1}}],["在每個文章最前面可以設定文章的標籤",{"2":{"232":1}}],["在載入頁面後執行",{"2":{"219":1}}],["在載入頁面前執行",{"2":{"219":1}}],["在下載網頁檔案後還需要等待呼叫",{"2":{"213":1}}],["在下一層找符合指定選擇器的元素",{"2":{"180":2}}],["在首頁顯示動態",{"2":{"210":1}}],["在匯出匯入使用的語法是",{"2":{"190":2}}],["在欄位輸入文字後",{"2":{"183":1}}],["在裡面找符合指定選擇器的元素",{"2":{"180":1}}],["在所有下層找符合指定選擇器的元素",{"2":{"180":1}}],["在寫程式相關的筆記時",{"2":{"171":1}}],["在寫秒數時要特別注意",{"2":{"83":1}}],["在正式開始之前",{"2":{"168":1}}],["在這裡會代表發生事件的元素",{"2":{"154":1}}],["在內部最前面插入一個元素",{"2":{"149":1}}],["在內部最後面插入一個元素",{"2":{"149":1}}],["在內部替換元素",{"2":{"149":1}}],["在彈出視窗開啟網址",{"2":{"136":1}}],["在新分頁開啟網址",{"2":{"136":1}}],["在根目錄建立",{"2":{"121":3}}],["在程式語言裡的值都有資料型態",{"2":{"90":1}}],["在程式裡",{"2":{"18":1}}],["在存取變數時",{"2":{"89":1}}],["在存取陣列資料時",{"2":{"18":1}}],["在瀏覽器會被綁在",{"2":{"89":1}}],["在瀏覽網頁時的使用者體驗會比一般網頁好",{"2":{"12":1}}],["在一元一次方程式或一元二次方程式等代數中",{"2":{"87":1}}],["在一般",{"2":{"27":1}}],["在",{"2":{"81":1,"89":1,"109":1,"158":1,"193":1,"202":1,"221":1,"227":1,"247":1,"254":1,"256":2,"257":1,"258":3,"267":1,"271":1}}],["在網頁上引用",{"2":{"236":1}}],["在網頁上產生一排",{"2":{"71":1}}],["在網頁只能有一行字顯示",{"2":{"151":1}}],["在網頁前端以明碼顯示",{"2":{"68":1}}],["在背景下載下載完後立刻執行",{"2":{"69":1}}],["在背景下載",{"2":{"69":1}}],["在此寫你的程式碼",{"2":{"47":1,"60":4}}],["在前",{"2":{"43":2}}],["在家發呆",{"2":{"32":1}}],["在家裡待著電影",{"2":{"30":3}}],["在箭頭函式裡",{"2":{"27":1}}],["在物件的",{"2":{"27":1}}],["在不同地方有不同意思",{"2":{"27":1}}],["在解構時可以使用其餘運算子",{"2":{"20":1}}],["在使用已定義好的",{"2":{"83":1}}],["在使用",{"2":{"5":1}}],["drop",{"2":{"144":5}}],["dropindex",{"2":{"125":1}}],["dl=diego",{"2":{"144":1}}],["d00b7eee80f1",{"2":{"144":1}}],["dblclick",{"2":{"242":1}}],["dbs",{"2":{"126":1}}],["dburl",{"2":{"110":1}}],["db",{"2":{"107":1,"109":1,"110":1,"122":1,"124":3,"125":3,"126":4,"127":2,"128":2,"129":1}}],["danger",{"2":{"214":1,"215":1,"226":2,"245":2}}],["datenum",{"2":{"143":1}}],["datestr",{"2":{"143":1}}],["date",{"0":{"143":1},"2":{"114":2,"143":4,"144":1,"154":2,"232":1}}],["data2",{"2":{"250":1}}],["data2=",{"2":{"250":1}}],["data=",{"2":{"250":1}}],["databasename",{"2":{"131":1,"132":1}}],["data",{"2":{"25":2,"93":1,"121":2,"178":3,"219":21,"236":1,"237":3,"240":2,"244":2,"247":6,"249":1,"250":1,"266":1,"268":1}}],["datatype",{"2":{"15":1}}],["days",{"2":{"97":1}}],["day",{"2":{"83":2,"143":1}}],["dirname",{"2":{"265":1}}],["dist",{"2":{"271":1}}],["disabled",{"2":{"185":2}}],["discord",{"2":{"171":1,"172":2}}],["disconnect",{"2":{"164":2,"165":2,"166":2}}],["display=swap",{"2":{"222":2}}],["display",{"2":{"144":3,"159":2,"175":1,"237":1,"258":1}}],["div2",{"2":{"165":4}}],["div1",{"2":{"165":5,"166":1}}],["div>",{"2":{"144":8,"149":1,"150":1,"159":2,"164":1,"165":2,"166":4,"167":4,"176":13,"178":4,"185":1,"216":1,"226":1,"236":1}}],["div",{"2":{"144":8,"149":12,"150":7,"159":2,"164":8,"165":10,"166":6,"167":4,"176":5,"178":4,"180":6,"185":1,"216":1,"226":3,"227":1,"236":1}}],["diwhu",{"2":{"53":1}}],["dinner",{"2":{"32":3}}],["ddd",{"2":{"43":2}}],["dfgd",{"2":{"38":1}}],["deploy",{"2":{"271":5}}],["dependencies",{"2":{"188":1}}],["deep",{"2":{"240":1,"241":2}}],["design",{"2":{"253":1}}],["desktop",{"2":{"211":1}}],["description>",{"2":{"250":1}}],["description",{"2":{"117":6,"188":1,"222":5,"229":1,"231":2,"250":1,"258":4}}],["debug",{"2":{"204":1}}],["development",{"2":{"261":1}}],["developers",{"2":{"197":1}}],["devtools",{"2":{"235":1}}],["dev",{"2":{"201":1,"214":1,"258":1}}],["devdependencies",{"2":{"188":1}}],["deg",{"2":{"144":3}}],["delay",{"2":{"83":2}}],["deletemany",{"2":{"128":1}}],["deleteone",{"2":{"128":1}}],["deleteuserorder",{"2":{"112":1,"113":1,"117":1}}],["deleteuser",{"2":{"112":3,"113":1,"117":1}}],["delete",{"2":{"8":1,"112":3,"116":2,"117":1}}],["declared",{"2":{"89":1}}],["declartaion",{"2":{"55":2,"63":1}}],["decrypt",{"2":{"47":2}}],["de",{"2":{"51":1}}],["defineconfig",{"2":{"258":1,"265":1,"270":1}}],["definestore",{"2":{"257":2}}],["definenuxtplugin",{"2":{"220":1}}],["definenuxtconfig",{"2":{"218":1,"222":1}}],["definepagemeta",{"2":{"216":1}}],["defined",{"2":{"58":1,"63":1}}],["defer",{"2":{"69":1}}],["defg",{"2":{"51":1}}],["def",{"2":{"38":2,"49":7}}],["default",{"2":{"36":2,"96":1,"101":1,"111":1,"112":1,"191":1,"216":1,"218":1,"220":1,"221":1,"222":1,"245":2,"249":1,"256":1,"258":1,"265":1,"268":1,"270":1}}],["d",{"2":{"18":1,"20":5,"25":2,"51":1,"131":1,"132":1,"144":4,"200":1,"214":2,"227":1,"258":1,"263":3,"264":4}}],["docs",{"2":{"229":1,"230":1,"231":3}}],["documentelement",{"2":{"147":1}}],["document",{"2":{"18":1,"22":1,"28":2,"35":10,"36":15,"37":3,"39":2,"47":1,"55":2,"56":2,"57":1,"65":7,"71":2,"73":1,"76":3,"88":1,"139":1,"140":1,"141":3,"144":6,"145":1,"146":1,"147":19,"148":2,"149":12,"150":6,"155":1,"157":2,"158":1,"159":2,"160":3,"164":2,"165":3,"166":2,"167":4,"242":1}}],["dolor",{"2":{"167":8}}],["dot",{"2":{"144":2}}],["dotenv",{"0":{"202":1},"2":{"101":1,"106":1,"110":2,"200":1,"202":2}}],["do",{"0":{"74":1},"2":{"70":1,"74":2,"75":2}}],["done",{"2":{"15":1,"95":11,"96":1}}],["domain",{"2":{"50":1}}],["domain>",{"2":{"50":2}}],["dom",{"0":{"145":1,"179":1},"1":{"146":1,"147":1,"148":1,"149":1,"150":1,"151":1,"180":1,"181":1,"182":1,"183":1},"2":{"12":1,"142":1,"144":1,"145":1,"146":2,"149":1,"150":1,"155":1,"163":1,"164":1,"165":1,"180":1,"184":1,"220":1,"237":1,"239":2,"242":1}}],["發送",{"2":{"12":1}}],["技術是在不重新整理網頁的情況下",{"2":{"12":1}}],["ubuntu",{"2":{"271":1}}],["utf",{"2":{"222":1,"258":1}}],["ui",{"0":{"253":1},"2":{"175":2,"251":1,"253":5,"258":4}}],["udemy",{"2":{"170":1}}],["ul>",{"2":{"149":2,"167":2,"237":2}}],["ul",{"2":{"149":2,"162":1,"167":1}}],["upsert",{"2":{"127":2}}],["upserted",{"2":{"124":1}}],["update",{"2":{"127":4,"247":2}}],["updateuserorder",{"2":{"112":1,"113":1,"116":1}}],["updateuser",{"2":{"112":3,"113":1,"116":1}}],["upload",{"2":{"101":2}}],["umbrella",{"2":{"37":2}}],["uses",{"2":{"271":2}}],["useuserstore",{"2":{"257":5}}],["useunifiedtopology",{"2":{"110":1}}],["usehead",{"2":{"222":2}}],["uselazyfetch",{"2":{"219":2}}],["uselazyasyncdata",{"2":{"219":9}}],["usefetch",{"2":{"219":6}}],["useasyncdata",{"2":{"219":8}}],["usenewurlparser",{"2":{"110":1}}],["use",{"2":{"95":3,"109":3,"126":1,"219":2,"220":1,"256":1,"257":1}}],["userouter",{"2":{"256":3}}],["useroute",{"2":{"216":1,"256":3}}],["userroutes",{"2":{"109":2}}],["username",{"2":{"95":3}}],["usernamefield",{"2":{"95":1}}],["user的資料",{"2":{"95":1}}],["user",{"2":{"10":1,"22":7,"95":8,"96":5,"97":3,"98":3,"120":1,"217":7,"256":2,"257":19}}],["userid=",{"2":{"5":1}}],["usersschema",{"2":{"111":1}}],["userschema",{"2":{"111":1}}],["userscript",{"2":{"67":1}}],["users",{"2":{"5":1,"95":4,"107":3,"109":5,"111":3,"112":5,"113":2,"114":2,"115":4,"116":2,"117":2}}],["us",{"2":{"36":3,"222":1}}],["unit",{"2":{"261":2}}],["unique",{"2":{"111":2,"125":2}}],["unmounted",{"2":{"239":1}}],["unjs",{"2":{"219":2}}],["unobserve",{"2":{"165":2,"166":2,"167":1}}],["unsplash",{"2":{"144":2}}],["unshift",{"2":{"41":2}}],["underscore",{"2":{"43":1,"88":1}}],["undefined",{"2":{"18":2,"22":6,"38":5,"41":1,"50":2,"56":1,"63":4,"83":1,"90":1}}],["uncaught",{"2":{"22":2,"58":1,"63":3,"89":2}}],["url",{"2":{"11":1,"15":2,"22":3,"144":1,"178":2,"185":1,"215":2,"258":2,"268":16}}],["用解構方式提取需要的東西",{"2":{"241":1}}],["用在建立repo",{"2":{"208":1}}],["用來簡化",{"2":{"80":1}}],["用於連結視圖和資料",{"2":{"236":1}}],["用於新增或移動元素",{"2":{"149":1}}],["用於驗證資料",{"2":{"93":1}}],["用於不確定執行次數的迴圈",{"2":{"73":1}}],["用於獨立且不依賴網站運作的程式",{"2":{"69":1}}],["用上面練習完成的",{"2":{"47":1}}],["用它來建立物件",{"2":{"28":1}}],["用變數當",{"2":{"19":1}}],["用陣列後",{"2":{"18":1}}],["用陣列前",{"2":{"18":1}}],["用",{"2":{"11":1,"19":2,"56":1,"69":1,"89":2,"171":1,"204":1}}],["用戶端錯誤",{"2":{"9":1}}],["為元件的",{"2":{"266":3}}],["為路由資訊",{"2":{"256":1}}],["為路由設定檔jsimport",{"2":{"256":1}}],["為回覆訊息",{"2":{"203":1}}],["為使用者傳送的文字",{"2":{"203":1}}],["為使用者的狀態與身分",{"2":{"139":1}}],["為文字",{"2":{"150":1}}],["為註解",{"2":{"150":1}}],["為乘值",{"2":{"127":1}}],["為加減值",{"2":{"127":1}}],["為是否格式化輸出",{"2":{"126":1}}],["為是否允許的回應",{"2":{"109":1}}],["為略過幾筆資料",{"2":{"126":1}}],["為查詢",{"2":{"126":1}}],["為資料排序",{"2":{"126":1}}],["為資料比數",{"2":{"126":1}}],["為資料表名稱",{"2":{"126":1}}],["為資料的設定",{"2":{"10":1}}],["為欄位值",{"2":{"111":1}}],["為請求來源網域",{"2":{"109":1}}],["為請求的狀態資訊",{"2":{"9":1}}],["為請求的方式及目標網址",{"2":{"8":1}}],["為避免程式碼混亂所以編寫",{"2":{"96":1}}],["為一個區域",{"2":{"89":1}}],["為一區",{"2":{"89":2}}],["為例",{"2":{"77":1,"248":1}}],["為區域的區域變數",{"2":{"62":1}}],["為止",{"2":{"36":1}}],["為",{"2":{"19":3,"46":1,"60":3,"88":2,"95":1,"126":1,"146":1,"147":3,"219":2,"237":4,"257":1}}],["為範例",{"2":{"12":1}}],["48",{"2":{"77":1}}],["48900",{"2":{"22":1}}],["49",{"2":{"77":1}}],["42",{"2":{"77":1}}],["40e0d0",{"2":{"144":1}}],["401",{"2":{"96":1}}],["40",{"2":{"77":1,"144":2}}],["400px",{"2":{"176":2,"185":2}}],["400",{"2":{"42":3,"43":2,"97":1,"101":1,"114":5,"116":2,"175":1,"176":7}}],["404",{"2":{"9":1,"115":2,"116":2,"117":4}}],["435",{"2":{"60":2}}],["43",{"2":{"25":4}}],["456",{"2":{"38":2,"90":1}}],["45",{"2":{"25":4,"77":1}}],["41",{"2":{"25":2}}],["4",{"2":{"20":6,"24":2,"25":5,"35":1,"41":3,"42":1,"46":5,"47":2,"51":6,"60":1,"61":8,"71":1,"77":7,"111":2,"120":1,"143":1,"150":1}}],["4xx",{"2":{"9":1}}],["3eaf7c",{"2":{"231":1}}],["3d",{"2":{"177":1,"178":2}}],["3px",{"2":{"144":3}}],["31",{"2":{"77":1}}],["35",{"2":{"77":1}}],["36",{"2":{"77":2,"166":1}}],["34",{"2":{"61":1}}],["30+90",{"2":{"144":1}}],["30px",{"2":{"144":1}}],["308",{"2":{"61":8}}],["30",{"2":{"46":3,"77":2,"79":1,"144":1,"185":2}}],["300px",{"2":{"144":1,"159":2,"166":1,"167":2,"176":3,"178":1}}],["300",{"2":{"42":8,"43":2}}],["3000",{"2":{"5":2,"109":3,"185":1,"198":2,"203":1}}],["32",{"2":{"25":2,"77":1}}],["33",{"2":{"25":7,"144":1}}],["3",{"2":{"18":1,"20":7,"24":9,"25":5,"35":1,"41":3,"42":1,"50":5,"51":8,"53":1,"60":2,"61":16,"77":8,"79":1,"89":2,"150":1,"191":1,"222":2,"238":1,"240":1,"241":1,"244":1}}],["3xx",{"2":{"9":1}}],["222506",{"2":{"144":1}}],["22",{"0":{"233":1},"1":{"234":1,"235":1,"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1},"2":{"77":1}}],["27",{"2":{"77":1}}],["28",{"2":{"77":1,"166":1}}],["26",{"2":{"53":1}}],["20px",{"2":{"144":4}}],["2024",{"2":{"143":2}}],["2020",{"2":{"139":1,"232":1}}],["2019",{"2":{"121":1}}],["2017",{"2":{"121":1}}],["2015",{"2":{"121":1}}],["20",{"2":{"25":4,"31":1,"46":3,"77":1,"79":3,"144":1,"178":1,"192":1}}],["200px",{"2":{"144":2,"167":2}}],["2002",{"2":{"61":3}}],["200",{"2":{"9":1,"42":2,"43":3,"46":5,"79":1,"97":1,"98":1,"114":2,"115":3,"116":2,"117":2,"126":7,"167":2,"193":2}}],["2000",{"2":{"5":1,"175":6}}],["237",{"2":{"166":1}}],["231",{"2":{"61":8}}],["233",{"2":{"61":1}}],["23",{"2":{"25":4,"143":1}}],["21",{"0":{"194":1},"1":{"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1},"2":{"25":2,"61":1,"77":2}}],["21900",{"2":{"22":1}}],["21345678",{"2":{"21":1,"22":1}}],["24",{"2":{"19":3,"21":2,"23":1,"77":2,"172":1}}],["255",{"2":{"71":2}}],["25",{"2":{"19":3,"21":2,"23":1,"25":2,"77":1,"79":2,"176":3,"258":1}}],["2",{"2":{"18":3,"20":7,"22":1,"24":9,"25":5,"33":1,"35":1,"41":4,"42":3,"43":1,"46":1,"47":2,"50":2,"51":9,"60":4,"61":22,"62":4,"76":2,"77":7,"79":2,"80":11,"89":11,"120":1,"125":3,"143":1,"144":4,"147":1,"150":1,"166":1,"167":2,"178":2,"180":2,"181":2,"191":3,"204":1,"237":4,"238":1,"240":1,"241":1,"244":2}}],["2xx",{"2":{"9":1}}],["svg+xml",{"2":{"258":1}}],["svg",{"2":{"254":8,"258":2}}],["syncdata",{"2":{"247":2}}],["syntaxerror",{"2":{"89":1}}],["swing",{"2":{"175":2}}],["switch",{"0":{"36":1},"2":{"36":6}}],["slot>",{"2":{"250":4}}],["slot>送出",{"2":{"250":1}}],["slot",{"2":{"250":9}}],["slow",{"2":{"175":9}}],["slidetoggle",{"2":{"175":1}}],["slideup",{"2":{"175":4}}],["slidedown",{"2":{"175":4}}],["slice",{"2":{"41":2,"51":5}}],["skyblue",{"2":{"159":1}}],["skip",{"2":{"126":2}}],["spa",{"2":{"256":1}}],["span>",{"2":{"144":3,"157":1,"185":2,"237":2}}],["span",{"2":{"144":3,"157":1,"185":2,"237":2}}],["splice",{"2":{"41":2}}],["short",{"2":{"258":2}}],["shop",{"2":{"222":2}}],["show=",{"2":{"237":1}}],["shownext",{"2":{"219":2}}],["showprev",{"2":{"219":2}}],["show",{"2":{"126":1,"183":1}}],["share",{"2":{"172":1}}],["shadow",{"2":{"144":5}}],["shift",{"2":{"41":2}}],["sidebar",{"2":{"231":1}}],["siblings",{"2":{"180":3}}],["site",{"2":{"222":4}}],["sit",{"2":{"167":8}}],["sizes=",{"2":{"258":2}}],["sizes",{"2":{"258":2}}],["size",{"2":{"101":1,"144":2,"178":2,"181":1}}],["single",{"2":{"101":1,"261":1}}],["signature",{"2":{"93":1}}],["sign",{"2":{"46":2,"97":1}}],["salary",{"2":{"240":1,"241":1}}],["sass",{"2":{"214":2,"263":3}}],["sacabambaspis",{"2":{"185":1}}],["save",{"2":{"97":1,"98":1}}],["sayhello",{"2":{"240":1,"241":2}}],["sayhi2",{"2":{"27":1}}],["sayhi",{"2":{"27":1,"28":3,"248":4}}],["saygoodbye",{"2":{"27":1}}],["src",{"2":{"65":3,"69":1,"167":2,"181":2,"185":1,"222":3,"256":1,"257":1,"258":2,"262":2,"265":2,"268":10}}],["src=",{"2":{"65":1,"167":1,"175":1,"176":10,"185":1,"215":3,"222":1,"237":5,"268":4}}],["scss",{"2":{"263":2}}],["scoped",{"2":{"266":1}}],["scope",{"2":{"258":1}}],["score++",{"2":{"185":1}}],["score",{"2":{"39":6,"185":7}}],["scale=1",{"2":{"222":3,"258":1}}],["scroll",{"2":{"166":1,"167":3}}],["screeny",{"2":{"157":1}}],["screenx",{"2":{"157":1}}],["screen",{"0":{"140":1},"2":{"140":11}}],["scripts",{"2":{"188":1,"201":1}}],["script",{"2":{"69":3,"215":1,"216":2,"219":6,"222":5,"244":1,"257":1,"264":2,"266":1,"267":2,"268":2}}],["script>",{"2":{"65":8,"69":2,"88":2,"139":2,"140":2,"141":2,"144":2,"149":4,"154":2,"155":2,"157":2,"158":2,"159":2,"164":2,"165":2,"166":2,"167":4,"175":2,"176":4,"178":2,"185":2,"215":1,"216":2,"219":6,"222":3,"244":1,"257":1,"268":3}}],["schema",{"2":{"110":2,"111":6}}],["squre",{"2":{"58":2}}],["sqrt",{"2":{"46":2}}],["sduwb",{"2":{"53":1}}],["support",{"2":{"261":1}}],["suscipit",{"2":{"167":8}}],["sunt",{"2":{"167":8}}],["subtree",{"2":{"164":2}}],["submit",{"2":{"153":1,"158":1,"182":1}}],["substring",{"2":{"51":2}}],["substr",{"2":{"51":6}}],["sum",{"2":{"61":17}}],["success",{"2":{"15":1,"96":1,"97":2,"98":2,"101":2,"114":9,"115":8,"116":8,"117":14,"245":2}}],["successfully",{"2":{"95":1}}],["successful",{"2":{"9":1}}],["sound",{"2":{"268":1}}],["sourcetree",{"2":{"211":1}}],["source",{"2":{"200":1}}],["solid",{"2":{"144":1,"149":1,"165":4,"166":1,"167":1,"237":1,"254":2}}],["sololearn",{"2":{"88":1}}],["sort",{"2":{"43":4,"126":2}}],["somedata2",{"2":{"250":1}}],["somedata",{"2":{"250":1}}],["somevalue",{"2":{"240":1,"241":1}}],["something",{"2":{"88":1}}],["some",{"2":{"42":4}}],["s",{"2":{"35":1,"88":1,"111":1,"144":3,"178":1,"222":2,"229":5}}],["steps",{"2":{"271":1}}],["styl",{"2":{"230":2}}],["stylus",{"2":{"221":1,"263":3}}],["style=",{"2":{"237":3}}],["styles",{"2":{"230":1}}],["stylesheet",{"2":{"144":1,"222":4}}],["style>",{"2":{"144":2,"149":2,"159":2,"164":2,"165":2,"166":2,"167":4,"176":4,"178":2,"185":2,"222":1}}],["style",{"2":{"65":1,"144":3,"148":4,"165":4,"178":1,"222":2,"231":1,"237":1,"263":3,"266":1}}],["storetorefs",{"2":{"257":3}}],["store",{"2":{"257":7}}],["storage",{"2":{"100":1,"101":2}}],["stop",{"2":{"175":4,"176":8,"185":1,"237":1}}],["strategy",{"2":{"95":2,"96":2}}],["str4",{"2":{"90":1}}],["str3",{"2":{"90":1}}],["str2",{"2":{"90":1}}],["str1",{"2":{"90":1}}],["stringinjected",{"2":{"249":2}}],["stringify",{"2":{"204":1}}],["string2",{"2":{"143":2}}],["string1",{"2":{"143":2}}],["string",{"2":{"50":1,"53":1,"59":7,"90":1,"111":3,"245":2,"247":1,"249":8}}],["st",{"2":{"35":1,"37":1,"71":1,"73":1,"74":1,"96":1}}],["standard",{"2":{"264":6}}],["standalone",{"2":{"258":2}}],["state",{"2":{"257":3,"261":1}}],["status",{"0":{"9":1},"2":{"9":1,"15":3,"96":1,"97":2,"98":2,"101":2,"114":9,"115":8,"116":8,"117":8,"231":1}}],["stage",{"2":{"208":1}}],["start=>operation",{"2":{"71":1}}],["start",{"2":{"35":1,"37":1,"71":4,"73":1,"74":1,"96":1,"121":1,"185":2,"188":1,"193":1,"201":1,"258":1}}],["students",{"2":{"18":1}}],["select",{"2":{"229":1,"261":2}}],["seo",{"2":{"212":1,"213":1}}],["sequi",{"2":{"167":8}}],["service",{"2":{"120":3,"205":1,"258":2}}],["server",{"2":{"9":1,"120":1,"193":2,"220":4,"223":1}}],["sec",{"2":{"185":9}}],["section",{"2":{"150":1}}],["sectextel",{"2":{"144":2}}],["secel",{"2":{"144":2}}],["secound",{"2":{"144":1}}],["second",{"2":{"144":4}}],["second=>operation",{"2":{"96":1}}],["secret=",{"2":{"202":1}}],["secretorkey",{"2":{"95":1}}],["secret",{"2":{"95":2,"97":1,"101":2,"203":1}}],["session",{"2":{"95":1,"96":1}}],["setage",{"2":{"257":4}}],["setattribute",{"2":{"65":1,"148":3}}],["set",{"2":{"247":2}}],["setup",{"2":{"236":1,"238":1,"241":2,"242":1,"245":1,"246":2,"247":1,"248":2,"249":2,"264":2,"266":2,"267":1}}],["setup>",{"2":{"215":1,"216":2,"219":6,"222":2,"257":1,"268":1}}],["setdate",{"2":{"144":3}}],["setinterval",{"2":{"84":2,"144":1,"185":1,"239":1}}],["settimeout",{"2":{"5":2,"41":1,"83":9,"84":2,"178":1,"185":1,"239":1}}],["send",{"2":{"13":1,"96":1,"97":2,"98":2,"101":2,"114":9,"115":8,"116":8,"117":8}}],["獲取該使用者的所有文章",{"2":{"5":1}}],["gh",{"2":{"271":2}}],["ghi",{"2":{"49":7}}],["generate",{"2":{"258":1}}],["generator",{"2":{"258":2}}],["getter",{"2":{"257":1}}],["getters",{"2":{"257":1}}],["gettime",{"2":{"143":1}}],["getcomputedstyle",{"2":{"148":3}}],["getattribute",{"2":{"148":3}}],["getelementsbyclassname",{"2":{"147":4,"155":1}}],["getelementsbytagname",{"2":{"147":2}}],["getelementbyid",{"2":{"65":7,"88":1,"139":1,"140":1,"141":3,"144":6,"147":12,"148":2,"149":9,"150":2,"157":1,"158":1,"164":2,"165":3,"166":2,"167":1,"242":1}}],["getseconds",{"2":{"143":2,"144":1}}],["getmilliseeonds",{"2":{"143":1}}],["getminutes",{"2":{"143":2,"144":1}}],["getmonth",{"2":{"143":1}}],["gethours",{"2":{"143":2,"144":1}}],["getday",{"2":{"143":1}}],["getdate",{"2":{"143":1}}],["getfullyear",{"2":{"143":1}}],["getindexes",{"2":{"125":1}}],["getuser",{"2":{"115":1}}],["getuserorder",{"2":{"112":1,"113":1,"115":1}}],["getusers",{"2":{"112":3,"113":1,"115":1}}],["getuserdata",{"2":{"58":2}}],["get",{"2":{"8":2,"11":2,"13":1,"14":1,"15":4,"16":1,"112":3,"117":3,"247":2}}],["ga",{"2":{"220":1}}],["gallery",{"2":{"176":2}}],["gametimer",{"2":{"185":3}}],["game",{"2":{"34":2,"178":4,"185":6}}],["gitignore",{"2":{"230":1}}],["gitlab損失300gb正式環境資料",{"2":{"209":1}}],["gitlab",{"2":{"209":3}}],["gitkraken",{"0":{"211":1},"2":{"206":1,"211":1}}],["git",{"0":{"206":1},"1":{"207":1,"208":1,"209":1,"210":1,"211":1},"2":{"207":5,"209":3,"211":2}}],["github",{"0":{"209":1,"271":1},"1":{"210":1},"2":{"172":1,"202":1,"206":1,"209":2,"211":3,"219":2,"229":1,"258":1,"271":3}}],["gist",{"2":{"172":1}}],["gif",{"2":{"65":3}}],["go",{"2":{"138":2}}],["goodmorning",{"2":{"55":3,"56":9,"57":4,"58":2,"59":5}}],["googleapis",{"2":{"144":1,"222":2}}],["google",{"2":{"12":1,"65":2,"66":1,"136":2,"137":1,"158":1,"172":1,"173":1,"181":1,"226":3}}],["gcd",{"2":{"61":10}}],["guide",{"2":{"231":2}}],["gui",{"2":{"211":2}}],["gua",{"2":{"60":2}}],["guest",{"2":{"2":1}}],["group",{"2":{"231":1}}],["groups",{"2":{"50":3}}],["gray",{"2":{"165":1,"167":1}}],["graham",{"2":{"5":1}}],["gtag",{"2":{"220":3}}],["gte",{"2":{"117":1}}],["gt",{"2":{"31":6,"35":3,"43":1,"50":1,"69":6,"147":3,"176":1,"214":1,"216":1,"227":1,"263":4,"264":2,"266":3,"267":3,"268":1}}],["gmail",{"2":{"22":2,"50":9}}],["g",{"2":{"18":1,"50":7,"198":1,"225":1}}],["handlebtnclick",{"2":{"246":4}}],["handler",{"2":{"240":1}}],["hackmd",{"2":{"171":2}}],["hash",{"2":{"215":1,"268":2}}],["hashsync",{"2":{"114":1}}],["hasclass",{"2":{"178":2,"181":3}}],["has",{"2":{"89":1}}],["hr>",{"2":{"149":2}}],["href",{"2":{"65":1,"137":3,"148":6,"164":1,"222":3,"268":7}}],["href=",{"2":{"22":1,"65":1,"144":1,"158":1,"181":1,"222":1,"226":2,"258":4}}],["home",{"2":{"216":2,"256":9}}],["hover",{"2":{"176":1}}],["hourtextel",{"2":{"144":2}}],["hourel",{"2":{"144":2}}],["hour",{"2":{"144":5}}],["hostname",{"2":{"137":2}}],["here",{"2":{"171":1}}],["height",{"2":{"140":4,"144":7,"159":2,"164":1,"165":1,"166":3,"167":4,"175":5,"176":5,"178":3,"185":2}}],["height=500",{"2":{"136":1}}],["height=",{"2":{"65":1,"237":5}}],["hello2",{"2":{"81":1}}],["hello1",{"2":{"81":1}}],["hello",{"2":{"69":1,"88":1,"141":1,"181":1,"193":1,"226":1,"227":1}}],["head>",{"2":{"69":2,"258":2}}],["head",{"2":{"69":1,"147":2,"222":1,"231":2}}],["headers",{"2":{"95":1,"97":2,"114":2,"116":2}}],["header",{"0":{"10":1},"2":{"10":1,"93":1,"147":2}}],["h1>123",{"2":{"148":1}}],["h1>標題",{"2":{"69":1}}],["h1>",{"2":{"65":2,"69":1,"148":1,"226":1,"242":1,"250":4}}],["h1",{"2":{"65":10,"147":2,"180":2,"181":10,"226":2,"242":1}}],["hide",{"2":{"183":1}}],["hidden",{"2":{"144":1,"176":2,"178":2,"185":1}}],["history",{"0":{"138":1},"2":{"138":7,"256":1}}],["hindi",{"2":{"88":1}}],["hi2",{"2":{"63":1}}],["hi",{"2":{"63":6,"84":1,"181":1,"237":1,"248":2}}],["high",{"2":{"3":1}}],["h",{"2":{"18":1,"144":3}}],["html=",{"2":{"237":1}}],["htmlcollection",{"2":{"147":1}}],["html>",{"2":{"65":8,"69":2,"88":2,"139":2,"140":2,"141":2,"144":2,"149":4,"157":2,"158":2,"159":2,"164":2,"165":2,"166":2,"167":4,"175":2,"176":4,"178":2,"185":2}}],["html",{"0":{"237":1,"242":1},"2":{"8":1,"65":8,"69":2,"88":1,"139":1,"140":1,"141":1,"144":1,"146":1,"147":1,"148":3,"149":4,"150":1,"153":2,"154":2,"155":1,"157":1,"158":1,"159":1,"164":1,"165":1,"166":1,"167":4,"175":1,"176":2,"178":1,"181":14,"185":1,"215":2,"216":3,"219":6,"222":2,"224":2,"225":3,"227":1,"236":2,"237":6,"241":2,"242":1,"244":2,"245":1,"246":1,"247":1,"250":8,"256":1,"258":1,"262":1,"266":2,"268":2}}],["http",{"0":{"6":1,"7":1},"1":{"7":1,"8":2,"9":2,"10":2,"11":2,"12":1,"13":1,"14":1,"15":1,"16":1},"2":{"7":1,"9":3,"12":1,"109":1,"193":5,"198":1}}],["https",{"2":{"5":2,"13":1,"14":1,"15":4,"16":1,"22":2,"65":2,"136":2,"137":1,"144":2,"148":2,"158":1,"167":1,"181":1,"198":1,"219":8,"222":8,"226":2,"231":1,"258":2}}],["練習二維陣列",{"2":{"25":1}}],["練習",{"2":{"5":1,"25":3,"44":1,"47":3,"53":1,"60":5,"71":1,"72":1,"77":6,"85":2,"151":1,"162":1,"177":1,"183":3,"184":1}}],["luxon",{"2":{"143":1}}],["l",{"2":{"47":1}}],["latest",{"2":{"256":1,"257":1,"261":1,"264":1,"271":1}}],["layouts",{"2":{"216":3}}],["layout",{"0":{"216":1},"2":{"216":7}}],["lazyload",{"2":{"167":8}}],["lazy",{"2":{"167":1}}],["last",{"2":{"167":2}}],["lastchild",{"2":{"147":1,"150":1}}],["lastelementchild",{"2":{"147":2}}],["lastindexcurry",{"2":{"50":2}}],["lastindexof",{"2":{"42":2,"50":2}}],["lastfruit",{"2":{"41":2}}],["lastname",{"2":{"27":2,"28":4,"81":2,"240":2,"241":3}}],["lang=",{"2":{"227":1,"263":4}}],["language",{"2":{"139":1}}],["lang",{"2":{"36":9}}],["library",{"2":{"254":2}}],["lib",{"2":{"222":4}}],["libs",{"2":{"222":2}}],["license",{"2":{"188":1}}],["live",{"2":{"172":1}}],["li",{"2":{"162":1,"167":2,"181":2,"237":1}}],["li>lorem",{"2":{"167":8}}],["li>果汁",{"2":{"149":1}}],["li>牛奶",{"2":{"149":1}}],["li>水",{"2":{"149":1}}],["li>咖啡",{"2":{"149":1}}],["li>可樂",{"2":{"149":1}}],["li>",{"2":{"149":6,"167":8,"237":1}}],["li>紅茶",{"2":{"149":1}}],["list2",{"2":{"149":5}}],["list1",{"2":{"149":6}}],["listen",{"2":{"109":1,"193":1,"203":1}}],["limits",{"2":{"101":1}}],["limit",{"2":{"101":3,"126":2}}],["light",{"2":{"65":3,"144":2}}],["link>",{"2":{"256":1}}],["linkaftercolor",{"2":{"148":1}}],["link",{"2":{"65":3,"144":1,"148":3,"158":2,"217":1,"222":3,"231":3,"256":1,"258":4}}],["linebot",{"0":{"203":1},"2":{"200":1,"203":4}}],["linear",{"2":{"144":1,"175":10}}],["line",{"0":{"8":1,"9":1,"194":1,"197":1},"1":{"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1},"2":{"8":1,"9":1,"194":1,"197":1,"198":2,"200":1,"202":1,"203":2,"205":1}}],["like",{"2":{"33":3}}],["lte",{"2":{"117":1}}],["lt",{"2":{"31":2,"43":1,"50":1,"69":6,"147":3,"176":1,"214":1,"216":1,"227":1,"263":4,"264":2,"266":3,"267":3,"268":1}}],["less",{"2":{"88":1}}],["left",{"2":{"71":1,"73":1,"74":1,"144":4,"159":1,"176":10,"178":1,"185":2}}],["learn",{"2":{"50":1}}],["leanne",{"2":{"5":1}}],["length",{"2":{"18":4,"19":1,"22":1,"23":1,"42":1,"50":1,"51":2,"176":1,"178":4,"180":1}}],["let",{"2":{"5":2,"18":1,"22":1,"23":1,"24":2,"38":1,"63":1,"71":4,"73":1,"74":1,"76":6,"79":4,"89":7,"101":1,"147":1,"176":1,"178":2,"185":5,"203":1}}],["lock",{"2":{"188":1}}],["location",{"0":{"137":1},"2":{"137":10}}],["localstorage",{"2":{"242":2}}],["localstrategy",{"2":{"95":4}}],["localhost",{"2":{"109":1,"193":1}}],["local",{"2":{"94":1,"95":1,"208":1}}],["localecompare",{"2":{"43":3}}],["load",{"2":{"167":1,"182":1}}],["loading",{"2":{"160":1}}],["loop2",{"2":{"76":2}}],["loop1",{"2":{"76":4}}],["lodash",{"2":{"43":1,"88":1}}],["low",{"2":{"3":1}}],["logo",{"2":{"268":1}}],["logout",{"2":{"98":1}}],["logpath=logs",{"2":{"121":1}}],["logs",{"2":{"121":1}}],["logged",{"2":{"95":1}}],["login",{"2":{"95":4,"96":3,"97":1,"257":2}}],["log",{"2":{"2":1,"3":2,"4":4,"5":7,"13":2,"14":3,"15":13,"16":3,"18":5,"19":3,"20":12,"22":8,"23":4,"24":11,"31":8,"32":4,"33":4,"34":2,"38":4,"41":16,"42":12,"43":7,"47":1,"49":5,"50":14,"51":6,"56":1,"57":2,"58":1,"60":6,"61":3,"62":3,"63":6,"76":1,"79":1,"80":1,"84":1,"87":1,"89":12,"90":1,"109":2,"114":2,"115":3,"121":3,"137":1,"141":2,"143":2,"148":6,"150":4,"158":1,"159":2,"160":1,"164":1,"165":1,"166":2,"175":6,"180":3,"181":5,"191":3,"192":6,"193":1,"216":1,"219":2,"222":1,"240":7,"241":7,"242":1,"245":1,"246":2,"248":2,"249":2,"256":2,"257":1}}],["毫秒",{"2":{"5":2,"143":1,"175":9}}],["不用回傳",{"2":{"241":1}}],["不符合時是",{"2":{"237":1}}],["不須輸入",{"2":{"205":1}}],["不需要另外安裝",{"2":{"204":1}}],["不需要使用迴圈",{"2":{"181":1}}],["不需要從課本的第一頁看到最後一頁",{"2":{"170":1}}],["不含頭尾",{"2":{"180":2}}],["不含工具列等",{"2":{"136":1}}],["不含工具列",{"2":{"136":2}}],["不填就是所有",{"2":{"180":5}}],["不只會影響閱讀",{"2":{"155":1}}],["不放的話就是現在",{"2":{"143":1}}],["不固定",{"2":{"114":1}}],["不要直接用",{"2":{"180":1}}],["不要為了提問而提問",{"2":{"172":1}}],["不要問程式這樣寫行不行",{"2":{"172":1}}],["不要只看不做",{"2":{"170":1}}],["不要死背",{"2":{"170":1}}],["不要紀錄資料修改次數",{"2":{"111":1}}],["不要錯過同時執行的機會",{"2":{"5":1}}],["不宣告變數會變成全域變數",{"2":{"89":1}}],["不推薦這樣使用",{"2":{"89":1}}],["不推薦",{"2":{"88":2}}],["不管是哪一種程式語言",{"2":{"86":1}}],["不管成功或失敗都會執行",{"2":{"15":2}}],["不管成功失敗都執行",{"2":{"14":1,"16":1}}],["不過會根據變數和運算子的位置而有不同的結果",{"2":{"79":1}}],["不包含",{"2":{"126":1}}],["不包含結束位置",{"2":{"51":2}}],["不包含1",{"2":{"46":1}}],["不能修改值",{"2":{"190":1}}],["不能放文字",{"2":{"50":1}}],["不能放正則表達式",{"2":{"50":1}}],["不能被",{"2":{"47":1}}],["不能被大於",{"2":{"47":1}}],["不能寫",{"2":{"36":1}}],["不能寫成",{"2":{"31":1}}],["不會提供",{"2":{"215":1}}],["不會立即執行",{"2":{"164":1}}],["不會修改原始陣列",{"2":{"41":2}}],["不會重新載入網頁",{"2":{"12":1}}],["不喜歡",{"2":{"33":3}}],["不好耶",{"2":{"32":1}}],["不大於",{"2":{"31":1}}],["不等於",{"2":{"31":3}}],["不是隨便就能用",{"2":{"190":1}}],["不是死背就能學會的",{"2":{"170":1}}],["不是單純的陣列",{"2":{"147":1}}],["不是則回傳",{"2":{"60":1}}],["不是比較運算子",{"2":{"31":1}}],["不是數字",{"2":{"5":1}}],["不成立時",{"2":{"30":1}}],["不明",{"2":{"22":1}}],["讓元件間的資料共享更方便",{"2":{"257":1}}],["讓該部分的",{"2":{"250":1}}],["讓讀程式碼的人更容易了解你在寫什麼",{"2":{"83":1}}],["讓網頁不重新整理就可以跟伺服器交換資料",{"2":{"6":1}}],["讓",{"2":{"5":1,"57":1}}],["讓程式不會因為錯誤而影響執行",{"2":{"1":1}}],["接收儲存庫的通知",{"2":{"210":1}}],["接著用",{"2":{"5":1}}],["接",{"2":{"5":2}}],["flex",{"2":{"204":4}}],["float",{"2":{"90":2,"176":2,"178":1}}],["floor",{"2":{"46":2}}],["fs",{"0":{"204":1},"2":{"204":4}}],["f0f",{"2":{"144":1}}],["ff1493",{"2":{"144":1}}],["ff0",{"2":{"144":3}}],["ffffff",{"2":{"258":3}}],["fff",{"2":{"43":2,"144":2}}],["fm=jpg",{"2":{"144":1}}],["f2e",{"2":{"65":3,"175":1,"176":10,"178":3,"185":3}}],["fb",{"2":{"65":1}}],["free",{"2":{"254":5}}],["fruit",{"2":{"237":2}}],["fruits2",{"2":{"41":2}}],["fruits",{"2":{"41":21,"237":1}}],["front",{"2":{"178":3}}],["fromauthheaderasbearertoken",{"2":{"95":1}}],["from",{"2":{"95":7,"96":2,"101":4,"109":3,"110":1,"112":2,"113":1,"144":1,"191":1,"192":6,"193":1,"203":1,"204":1,"220":1,"249":1,"254":4,"256":4,"257":5,"258":2,"265":1,"267":1}}],["fromcharcode",{"2":{"53":1}}],["fragment",{"2":{"150":1}}],["framework",{"0":{"129":1},"2":{"261":1}}],["fullscreen",{"2":{"258":1}}],["fullname",{"2":{"27":3,"28":2,"81":3,"240":2,"241":3}}],["func",{"2":{"41":7,"62":2}}],["func2",{"2":{"5":2}}],["func1",{"2":{"5":2}}],["function",{"0":{"27":1,"54":1},"1":{"55":1,"56":1,"57":1,"58":1,"59":1,"60":1,"61":1,"62":1,"63":1},"2":{"4":1,"5":4,"14":2,"15":13,"26":2,"27":7,"28":1,"31":1,"41":7,"42":20,"43":7,"47":4,"53":1,"54":1,"55":15,"56":7,"57":2,"58":1,"59":1,"60":5,"62":2,"63":6,"82":1,"83":6,"111":1,"112":1,"113":2,"156":2,"163":1,"164":3,"165":3,"166":2,"175":24,"176":5,"178":3,"180":3,"181":1,"182":5,"185":4,"219":7,"237":2,"240":2,"241":2,"257":1}}],["fixall",{"2":{"200":1}}],["fill",{"2":{"167":1}}],["filename",{"2":{"131":1,"132":1}}],["files",{"2":{"120":1}}],["filesize",{"2":{"101":1}}],["file",{"2":{"101":3,"215":1}}],["filefilter",{"2":{"101":1}}],["filter",{"2":{"42":4,"98":1,"144":5,"180":3,"242":1}}],["fib",{"2":{"61":12}}],["fibonacci",{"2":{"61":4}}],["first",{"2":{"149":4,"208":1}}],["firstchild",{"2":{"147":1,"150":4}}],["firstelementchild",{"2":{"147":2,"149":3}}],["first=>operation",{"2":{"96":1}}],["firstfruit",{"2":{"41":2}}],["firstname",{"2":{"27":2,"28":4,"81":2,"240":3,"241":4}}],["findbyidanddelete",{"2":{"117":1}}],["findbyidandupdate",{"2":{"114":1,"116":3}}],["findbyid",{"2":{"115":2}}],["findoneandupdate",{"2":{"116":1,"117":1}}],["findone",{"2":{"95":2}}],["findindex",{"2":{"42":5}}],["findlastindex",{"2":{"42":5}}],["findlast",{"2":{"42":5}}],["find",{"2":{"42":5,"115":1,"126":13,"178":1,"180":3}}],["final",{"2":{"14":1}}],["finally",{"2":{"14":1}}],["finish",{"2":{"5":1}}],["folder",{"2":{"271":1}}],["foo",{"2":{"231":1}}],["food",{"2":{"126":2}}],["foods",{"2":{"21":1}}],["focus",{"2":{"153":1}}],["fontawesomeicon",{"2":{"254":2}}],["fontawesome",{"2":{"254":5}}],["font",{"0":{"254":1},"2":{"144":2,"181":1,"251":1,"254":2}}],["fonts",{"2":{"144":1,"222":2}}],["found",{"2":{"95":1}}],["fortawesome",{"2":{"254":9}}],["for=",{"2":{"237":2,"245":1,"268":1}}],["fork",{"2":{"210":1,"211":1}}],["forward",{"2":{"138":2}}],["foreach",{"2":{"41":8,"147":1}}],["for",{"0":{"71":1,"72":1},"2":{"18":1,"22":1,"23":8,"50":3,"60":3,"70":1,"71":2,"72":2,"75":1,"76":4,"147":4,"155":1,"164":1,"165":1,"166":1,"167":1,"178":2,"261":6}}],["formating",{"2":{"261":1}}],["format",{"2":{"101":2}}],["form",{"2":{"8":1,"158":1}}],["f",{"2":{"18":1}}],["favicon",{"2":{"258":4}}],["fas",{"2":{"254":1}}],["fast",{"2":{"175":9}}],["fagoogleplus",{"2":{"254":2}}],["facoffee",{"2":{"254":2}}],["facebook",{"2":{"12":2,"65":1}}],["fadetoggle",{"2":{"175":1}}],["fadeto",{"2":{"175":4,"178":1}}],["fadein",{"2":{"175":4}}],["fadeout",{"2":{"175":5}}],["family=roboto",{"2":{"222":2}}],["family=orbitron",{"2":{"144":1}}],["family",{"2":{"144":1}}],["false",{"2":{"31":3,"32":2,"36":1,"37":1,"38":7,"42":2,"50":1,"60":5,"90":1,"95":5,"96":2,"97":1,"98":1,"101":3,"109":1,"111":1,"114":8,"115":5,"116":6,"117":6,"124":1,"166":1,"176":6,"185":1,"216":1,"231":1,"237":2}}],["fail",{"2":{"15":1}}],["fetch",{"0":{"14":1},"2":{"14":1}}],["下一頁",{"2":{"138":2}}],["下一個數字是",{"2":{"60":1}}],["下",{"2":{"121":1}}],["下載",{"2":{"120":1,"121":1,"198":1}}],["下載執行完後才繼續",{"2":{"69":1}}],["下卦為",{"2":{"60":1}}],["下卦名",{"2":{"60":1}}],["下雨",{"2":{"37":2}}],["下表為某地星期一到星期四的時段一",{"2":{"25":1}}],["下面是幾個",{"2":{"12":1}}],["下面的程式碼不會執行",{"2":{"57":2}}],["下面的",{"2":{"5":1}}],["下個禮拜就給你零用錢",{"2":{"4":1}}],["有些套件可能不相容",{"2":{"268":1}}],["有最小導覽列",{"2":{"258":1}}],["有使用限制",{"2":{"258":1}}],["有使用到的",{"2":{"241":1}}],["有使用到的變數才需要",{"2":{"241":1}}],["有許多的開源專案",{"2":{"209":1}}],["有免費",{"2":{"207":1}}],["有非常多地方提供程式碼分享服務",{"2":{"172":1}}],["有存取資料庫的權利",{"2":{"104":1}}],["有管理後台能上下架商品",{"2":{"102":1}}],["有購物車功能",{"2":{"102":1}}],["有三種變數宣告方式",{"2":{"89":1}}],["有三個參數可以使用",{"2":{"41":1}}],["有四個數字",{"2":{"77":1}}],["有相當多的套件可以使用",{"2":{"66":1}}],["有提升的特性",{"2":{"63":1}}],["有更多的彈性",{"2":{"56":1}}],["有事",{"2":{"37":1}}],["有傘",{"2":{"37":1}}],["有幾個奇數和幾個偶數",{"2":{"25":1}}],["有",{"2":{"18":1,"68":1,"182":1}}],["有錯誤時",{"2":{"5":1}}],["有可能你考試順利及格",{"2":{"4":1}}],["++b",{"2":{"79":2}}],["++a",{"2":{"79":1}}],["++",{"2":{"79":1}}],["+1",{"2":{"77":1}}],["+$",{"2":{"50":1}}],["+=10px",{"2":{"175":2}}],["+=",{"2":{"39":3,"80":2,"164":1,"167":1,"175":1}}],["+",{"2":{"5":7,"27":3,"28":2,"43":1,"50":8,"61":31,"63":2,"68":1,"71":1,"76":1,"78":1,"79":7,"80":2,"81":8,"88":8,"143":6,"166":1,"178":1,"185":4,"191":1,"192":1,"240":2,"241":2}}],["mp3",{"2":{"268":3}}],["mvvm",{"2":{"236":1}}],["mvc",{"0":{"104":1},"2":{"104":1,"107":1}}],["md",{"2":{"230":2,"231":1}}],["mdn",{"2":{"170":1}}],["mjs",{"2":{"223":1}}],["mutations",{"2":{"164":3,"165":3}}],["mutationobserver",{"2":{"164":2}}],["mutation",{"0":{"164":1},"2":{"164":7,"165":2}}],["multi",{"2":{"127":3}}],["multererror",{"2":{"101":2}}],["multer",{"2":{"100":2,"101":8}}],["mytemplate>",{"2":{"250":3}}],["mytemplate>按鈕",{"2":{"250":1}}],["mytext",{"2":{"242":5}}],["myborder",{"2":{"237":1}}],["mybtn",{"2":{"182":2}}],["myclass",{"2":{"226":2}}],["myawesome",{"2":{"222":2}}],["my",{"2":{"215":1,"216":2,"247":2}}],["myul",{"2":{"147":3}}],["mylink",{"2":{"158":2}}],["myli",{"2":{"147":1}}],["msi",{"2":{"120":1}}],["msg",{"2":{"83":9}}],["msg3",{"2":{"5":3}}],["msg2",{"2":{"5":4}}],["msg1",{"2":{"5":4}}],["mounted",{"2":{"239":1,"240":2,"241":1,"242":1,"248":1}}],["mount",{"2":{"236":1,"240":1,"241":1,"244":1,"246":2,"254":1,"256":1,"257":1}}],["mousemove",{"2":{"182":1}}],["mouseleave",{"2":{"182":1}}],["mouseenter",{"2":{"182":1}}],["mouseout",{"2":{"153":1}}],["mouseover",{"2":{"153":1}}],["mobile",{"2":{"231":2}}],["modules",{"0":{"189":1},"2":{"189":1,"218":1}}],["module",{"2":{"188":1,"190":1}}],["modeltext",{"2":{"237":2}}],["model=",{"2":{"237":6,"247":1}}],["model",{"0":{"111":1},"2":{"104":2,"111":4,"134":1,"145":1,"236":1,"237":3,"247":1}}],["models",{"2":{"95":1,"107":1,"111":1,"113":1}}],["movezb",{"2":{"185":3}}],["move+25",{"2":{"176":2}}],["move",{"2":{"176":7}}],["molestiae",{"2":{"167":8}}],["moment",{"2":{"143":1}}],["mongoimport",{"2":{"132":1}}],["mongoexport",{"2":{"131":1}}],["mongoerror",{"2":{"114":1}}],["mongo",{"2":{"120":2,"121":1,"172":1}}],["mongod",{"2":{"120":1,"121":3}}],["mongodb",{"0":{"118":1},"1":{"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1},"2":{"102":1,"106":1,"115":2,"116":2,"117":2,"118":1,"120":2,"121":1,"122":1,"127":2,"129":2}}],["mongoose",{"2":{"106":1,"110":6,"111":6}}],["mitt",{"2":{"248":3}}],["middle",{"2":{"144":3}}],["middleware",{"0":{"96":1,"101":1},"2":{"96":5,"101":1}}],["mimetype",{"2":{"101":1}}],["milliseconds",{"2":{"83":2}}],["minimal",{"2":{"258":1}}],["minutetextel",{"2":{"144":2}}],["minuteel",{"2":{"144":2}}],["minute",{"2":{"144":5}}],["minlength",{"2":{"111":1}}],["min",{"2":{"46":3,"47":1,"111":1,"222":2}}],["ming",{"2":{"28":2}}],["m",{"2":{"47":1,"60":5,"144":3}}],["master",{"2":{"271":3}}],["mask",{"2":{"258":1}}],["management",{"2":{"261":1}}],["manifest",{"2":{"258":3}}],["markdwon",{"2":{"171":2}}],["markdown",{"0":{"171":1},"2":{"171":7,"172":1,"228":1,"232":1}}],["margintop",{"2":{"176":6}}],["margin",{"2":{"144":4,"165":1,"176":1,"178":1}}],["magni",{"2":{"167":8}}],["main",{"2":{"144":2,"147":1,"188":1,"216":1,"220":1,"221":3,"254":1,"256":1,"257":1,"258":1,"262":1,"263":2}}],["matchcurry",{"2":{"50":2}}],["matchallcurry",{"2":{"50":3}}],["matchall",{"2":{"50":5}}],["match",{"2":{"50":10,"65":1}}],["math",{"2":{"46":22,"178":4,"185":2}}],["maxlength",{"2":{"111":1}}],["max",{"2":{"46":3,"47":1,"71":2,"111":1}}],["map",{"2":{"43":2}}],["meow",{"2":{"268":2}}],["medium",{"2":{"231":1}}],["measurement",{"2":{"220":1}}],["meta",{"0":{"222":1},"2":{"213":1,"216":1,"222":7,"231":3,"257":1,"258":6,"268":7}}],["methods",{"2":{"236":1,"240":1,"241":1,"246":2,"248":1,"266":1,"268":1}}],["method",{"2":{"14":1}}],["merge",{"2":{"208":1}}],["messaging",{"2":{"197":1}}],["message",{"2":{"2":3,"3":1,"4":2,"5":2,"33":3,"36":2,"95":3,"96":2,"97":2,"98":2,"101":6,"111":1,"114":13,"115":9,"116":8,"117":14,"203":4,"249":3}}],["me",{"2":{"53":1}}],["meet",{"2":{"53":1}}],["mei",{"2":{"28":2}}],["menu",{"2":{"22":3}}],["的檔名",{"2":{"268":1}}],["的檔名轉換為加了",{"2":{"268":1}}],["的檔案",{"2":{"257":1}}],["的地方引用元件html",{"2":{"254":1}}],["的種類引用",{"2":{"254":1}}],["的套件使用",{"0":{"251":1},"1":{"252":1,"253":1,"254":1}}],["的新語法",{"2":{"238":1}}],["的座號是",{"2":{"237":1}}],["的名稱可以顯示文字",{"2":{"237":1}}],["的概念開發網頁",{"2":{"236":1}}],["的開發概念是把網頁轉換成一個一個的元件",{"2":{"236":1,"243":1}}],["的預處理器",{"2":{"224":1}}],["的內建",{"2":{"193":1}}],["的結構",{"2":{"186":1}}],["的淡出效果在透明度變為",{"2":{"175":1}}],["的尺寸與座標",{"2":{"166":1}}],["的設定",{"2":{"166":1}}],["的行內樣式一樣",{"2":{"154":1}}],["的一種",{"2":{"150":1}}],["的處理速度快",{"2":{"148":1}}],["的所有元素",{"2":{"147":1}}],["的元素",{"2":{"147":3}}],["的操作和計時器",{"2":{"144":1}}],["的操作",{"2":{"142":1,"211":1}}],["的聚合工具輔助編寫語法",{"2":{"129":1}}],["的聚合框架能更進階的處理查詢請求",{"2":{"129":1}}],["的安裝以及增改刪查語法",{"2":{"118":1}}],["的安裝與操作",{"0":{"118":1},"1":{"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1,"130":1,"131":1,"132":1,"133":1}}],["的欄位是要修改的欄位",{"2":{"117":1}}],["的資料",{"2":{"126":1,"219":1}}],["的資料格式",{"2":{"114":2,"116":2}}],["的資料庫綱要除了能保持資料格式一致",{"2":{"111":1}}],["的路由",{"0":{"255":1},"1":{"256":1,"257":1,"258":1},"2":{"109":1}}],["的功能區分資料夾",{"2":{"107":1}}],["的上傳錯誤",{"2":{"101":1}}],["的驗證方式",{"2":{"95":1}}],["的加密演算法",{"2":{"93":1}}],["的語法",{"2":{"88":2}}],["的寫法",{"2":{"80":1}}],["的總和",{"2":{"61":1}}],["的餘數是",{"2":{"80":1}}],["的餘數",{"2":{"60":3}}],["的宣告寫得比較簡短",{"2":{"58":1}}],["的情況",{"2":{"53":1}}],["的是連續的",{"2":{"53":1}}],["的下一個字母",{"2":{"47":1}}],["的字母要數幾個字母才能數到較",{"2":{"47":1}}],["的索引",{"2":{"42":2}}],["的回傳值",{"2":{"41":1,"83":1}}],["的東西索引",{"2":{"41":1}}],["的東西值",{"2":{"41":1}}],["的狀況",{"2":{"38":1}}],["的程式碼",{"2":{"36":1}}],["的程式設計",{"2":{"26":1}}],["的判斷式",{"2":{"33":1}}],["的箭頭函式",{"2":{"31":1}}],["的話預設路徑是根目錄",{"2":{"270":1}}],["的話需要",{"2":{"241":1}}],["的話",{"2":{"26":1}}],["的值改為指定的數值",{"2":{"175":1}}],["的值產生為新陣列",{"2":{"42":1}}],["的值資料型態不是陣列也不是物件",{"2":{"24":1}}],["的值",{"2":{"24":1,"38":3,"42":2,"55":1,"222":1}}],["的應用範例",{"2":{"12":1}}],["的使用者",{"2":{"5":1}}],["的同時",{"2":{"5":1}}],["的",{"2":{"5":2,"8":1,"12":1,"43":2,"47":2,"63":1,"66":1,"93":1,"96":1,"146":1,"155":1,"165":1,"180":1,"184":1,"205":1,"214":1,"219":1,"221":1,"226":1,"257":1,"259":1,"261":2}}],["的幫助",{"2":{"5":1}}],["當推送到分支",{"2":{"271":1}}],["當收到訊息時",{"2":{"203":1}}],["當你在",{"2":{"172":1}}],["當你要附上你的程式碼時",{"2":{"172":1}}],["當元素相交時會觸發",{"2":{"166":1}}],["當元素變化時執行指定的",{"2":{"163":1}}],["當觀察的",{"2":{"164":1,"165":1}}],["當發生錯誤時是否停止執行",{"2":{"124":1}}],["當命名規則",{"2":{"88":1}}],["當回圈內的",{"2":{"71":1}}],["當參數沒有收到傳入值時",{"2":{"56":1}}],["當參數為",{"2":{"41":1}}],["當寫",{"2":{"36":1}}],["當條件有多筆需要判斷時",{"2":{"34":1}}],["當判斷式後的",{"2":{"30":1}}],["當中文句型為",{"2":{"30":1}}],["當資料不存在時使用預設值",{"2":{"22":1}}],["當要存取的陣列索引或物件屬性可能不存在時",{"2":{"22":1}}],["當",{"2":{"5":2,"30":1,"76":1}}],["當承諾達成時",{"2":{"4":1}}],["以縮排代表層級",{"2":{"226":1}}],["以縮排簡寫",{"2":{"224":1}}],["以及",{"2":{"177":1,"251":1,"255":2}}],["以哪個元素為依據",{"2":{"166":2}}],["以訂單",{"2":{"117":1}}],["以避免",{"2":{"55":1}}],["以下是常用的事件",{"2":{"153":1}}],["以下為",{"2":{"38":1}}],["以下為瀏覽器常見的使用情況",{"2":{"27":1}}],["以下範例皆為瀏覽器",{"2":{"12":1}}],["以此類推",{"2":{"25":1,"47":1,"60":1}}],["以資料的型態決定是傳值還是傳址",{"2":{"24":1}}],["以變數值當索引取資料",{"2":{"18":1}}],["以沒有擋",{"2":{"12":1}}],["以上都不符合時執行程式碼",{"2":{"35":1}}],["以上面任一種方式連接",{"2":{"16":1}}],["以上四種方式分別對應遠端伺服器資料庫的增改刪查動作",{"2":{"8":1}}],["以上網瀏覽網頁為例",{"2":{"7":1}}],["以上比喻轉成",{"2":{"4":1}}],["以",{"2":{"5":1,"27":1,"66":1,"68":1,"71":1,"77":1,"89":1,"102":1,"117":2,"202":1,"237":1,"248":1}}],["函式內的",{"2":{"180":1}}],["函式庫的",{"2":{"15":1}}],["函式",{"2":{"5":1,"15":1,"135":1,"143":1}}],["且要在出現時存取",{"2":{"242":1}}],["且這張牌還沒翻開",{"2":{"178":1}}],["且只記錄最終結果",{"2":{"165":1}}],["且每個都寫在標籤裡",{"2":{"155":1}}],["且有些程式語言不支援這種做法",{"2":{"88":1}}],["且有三種狀態",{"2":{"4":1}}],["且至少執行一次的迴圈",{"2":{"75":1}}],["且小於自身平方根的數整除",{"2":{"47":1}}],["且",{"2":{"5":1}}],["注意",{"2":{"5":1,"8":1,"11":1,"18":1,"19":1,"20":1,"27":1,"31":1,"41":1,"42":1,"50":1,"56":1,"57":1,"58":1,"69":1,"83":1,"89":1,"90":1,"143":1,"147":1,"148":1,"150":1,"160":1,"175":1,"180":2,"190":1,"207":1,"209":1,"211":1,"219":3,"231":1,"232":1,"242":1,"258":1,"268":1,"270":1}}],["可接受所有種類的資料型態",{"2":{"241":1}}],["可否摺疊",{"2":{"231":1}}],["可能因網站主題而異",{"2":{"231":1}}],["可能會用到函式",{"2":{"183":1}}],["可能會有文字編碼問題",{"2":{"88":1}}],["可參考",{"2":{"139":1}}],["可參考易學網解卦",{"2":{"60":1}}],["可不加",{"2":{"126":3}}],["可將字元編號轉回文字",{"2":{"53":1}}],["可取得指定文字的字元數字編號",{"2":{"53":1}}],["可樂",{"2":{"32":1}}],["可選串連也可以避免呼叫物件內不存在的",{"2":{"27":1}}],["可選串連",{"0":{"22":1}}],["可用高度",{"2":{"140":2}}],["可用寬度",{"2":{"140":2}}],["可用",{"2":{"20":1}}],["可讀性",{"2":{"5":1}}],["可以輸出靜態網頁",{"2":{"270":1}}],["可以放",{"2":{"268":1}}],["可以直接對",{"2":{"257":1}}],["可以直接用",{"2":{"31":1}}],["可以直接用變數接",{"2":{"5":1}}],["可以先將資料處理好用傳出",{"2":{"257":1}}],["可以先使用再宣告變數",{"2":{"63":1}}],["可以儲存網頁的狀態",{"2":{"257":1}}],["可以儲存編輯",{"2":{"242":1}}],["可以操作路由",{"2":{"256":1}}],["可以縮寫為",{"2":{"250":1}}],["可以點按鈕將所有項目標記為未完成",{"2":{"242":1}}],["可以點按鈕將所有項目標記為已完成",{"2":{"242":1}}],["可以點按鈕一次刪除全部項目",{"2":{"242":1}}],["可以點按鈕過濾顯示全部項目",{"2":{"242":1}}],["可以點兩下清單項目開啟編輯欄位",{"2":{"242":1}}],["可以個別刪除清單項目",{"2":{"242":1}}],["可以打勾標記已完成或未完成",{"2":{"242":1}}],["可以保存資料到",{"2":{"242":1}}],["可以綁定元素",{"2":{"242":1}}],["可以取得",{"2":{"241":2}}],["可以代入兩個東西",{"2":{"241":1}}],["可以存取",{"2":{"239":1}}],["可以只寫",{"2":{"237":1}}],["可以顯示目前過濾的方式及過濾後的項目總數",{"2":{"242":1}}],["可以顯示",{"2":{"237":1}}],["可以在使用者訪問指定路徑時載入指定的網頁元件",{"2":{"256":1}}],["可以在",{"2":{"231":1}}],["可以指定輸出位置",{"2":{"225":1}}],["可以忽略副檔名",{"2":{"221":1}}],["可以自己放設定的版面",{"2":{"216":1}}],["可以一次對選擇到的元素做修改",{"2":{"181":1}}],["可以的話千萬不要傳白底黑字的純文字",{"2":{"172":1}}],["可以觀察",{"2":{"163":1}}],["可以偵測網頁讀取進度",{"2":{"160":1}}],["可以為同一個元素綁定多個事件",{"2":{"156":1}}],["可以抓取同一層的上一個元素",{"2":{"147":1}}],["可以抓取同一層的下一個元素",{"2":{"147":1}}],["可以抓取下一層最後一個元素",{"2":{"147":1}}],["可以抓取下一層第一個元素",{"2":{"147":1}}],["可以抓取下一層所有元素",{"2":{"147":1}}],["可以抓取上一層元素",{"2":{"147":1}}],["可以對時間做簡單的處理",{"2":{"143":1}}],["可以獲取使用者的螢幕資訊",{"2":{"140":1}}],["可以避免資料庫欄位出現重複資料",{"2":{"125":1}}],["可以避免出現錯誤",{"2":{"22":1}}],["可以當作處理資料的層層關卡",{"2":{"96":1}}],["可以還原原始資料",{"2":{"93":1}}],["可以",{"2":{"90":1}}],["可以用選擇器過濾",{"2":{"180":6}}],["可以用",{"2":{"175":1}}],["可以用表內的函式取得時間後輸出",{"2":{"143":1}}],["可以用英文以外的文字",{"2":{"88":1}}],["可以用來判斷多個條件",{"2":{"36":1}}],["可以用來取得物件裡的其他屬性",{"2":{"27":1}}],["可以每隔一段時間執行指定的程式碼",{"2":{"84":1}}],["可以把文字轉數字",{"2":{"77":1}}],["可以處理更複雜的二維資料",{"2":{"72":1}}],["可以處理程式的錯誤",{"2":{"1":1}}],["可以簡寫成",{"2":{"71":1}}],["可以跳出一個警告訊息視窗",{"2":{"69":1}}],["可以迴圈文字",{"2":{"60":1}}],["可以判斷傳入的數字是不是偶數",{"2":{"60":1}}],["可以將清單資料保存到",{"2":{"242":1}}],["可以將資料以文字方式輸出html",{"2":{"237":1}}],["可以將程式碼放在標籤裡面",{"2":{"69":1}}],["可以將程式處理完畢的結果傳出",{"2":{"57":1}}],["可以將一段程式碼包裝起來",{"2":{"54":1}}],["可以讓",{"2":{"56":1}}],["可以重複使用",{"2":{"54":1}}],["可以串連多個語法",{"2":{"49":1}}],["可以運用三元運算子",{"2":{"33":1}}],["可以決定交作業時間",{"2":{"30":2}}],["可以省略",{"2":{"30":1,"58":2,"71":1}}],["可以依資料情況組合",{"2":{"21":1}}],["可以得到陣列的長度",{"2":{"18":1}}],["可以想像陣列是一台火車",{"2":{"18":1}}],["可以透過操控這個物件來完成跳轉頁面",{"2":{"137":1}}],["可以透過迴圈去取出陣列或物件裡的所有資料",{"2":{"23":1}}],["可以透過",{"2":{"12":1,"14":1}}],["可以使用屬性調整載入時機",{"2":{"69":1}}],["可以使用索引取得資料",{"2":{"18":1}}],["可以使用",{"2":{"3":1,"158":1,"192":1,"245":1}}],["內宣告使用",{"2":{"267":1}}],["內宣告了迴圈執行的三種動作",{"2":{"71":1}}],["內外同步",{"0":{"247":1}}],["內屬性的變更",{"2":{"241":1}}],["內多個屬性的變更",{"2":{"241":1}}],["內一個屬性的變更",{"2":{"241":1}}],["內呼叫要加",{"2":{"240":2}}],["內頁檔名",{"2":{"231":1}}],["內建元件設定",{"2":{"222":1}}],["內建在",{"2":{"219":2}}],["內建的物件功能有限",{"2":{"143":1}}],["內圖片",{"2":{"215":2}}],["內圖片的網址如",{"2":{"215":1}}],["內引用套件jsimport",{"2":{"202":1}}],["內第一個節點的類型",{"2":{"150":2}}],["內所有東西的通用名稱",{"2":{"150":1}}],["內可以指定時間",{"2":{"143":1}}],["內重複宣告會錯誤",{"2":{"89":1}}],["內容區做校長的話頁就好",{"2":{"271":1}}],["內容區",{"2":{"271":1}}],["內容為處理資料的",{"2":{"113":1}}],["內容為路由設定",{"2":{"112":1}}],["內容為資料表綱要",{"2":{"111":1}}],["內容為資料庫設定",{"2":{"110":1}}],["內容為",{"2":{"109":1}}],["內容範例",{"2":{"65":1}}],["內容",{"2":{"65":1}}],["內使用",{"2":{"56":1}}],["內使用等待程式執行完畢的",{"2":{"5":1}}],["內只有一行程式碼時",{"2":{"30":1}}],["內的資料夾",{"2":{"231":1}}],["內的純文字以",{"2":{"226":1}}],["內的",{"2":{"164":1}}],["內的文字可以換行",{"2":{"90":1}}],["內的文字不能換行",{"2":{"90":1}}],["內的變數",{"2":{"56":1}}],["內的變數值",{"2":{"36":1}}],["內的值",{"2":{"5":1}}],["內的程式碼",{"2":{"83":1}}],["內的程式碼處理完後",{"2":{"71":1}}],["內的程式",{"2":{"4":2}}],["內",{"2":{"5":1,"56":1,"226":1}}],["將所有元件的邏輯全部放到",{"2":{"238":1}}],["將所有執行結果為",{"2":{"42":1}}],["將指定作業上傳至",{"2":{"211":1}}],["將啟動的",{"2":{"201":1}}],["將按鈕停用",{"2":{"185":1}}],["將電腦出拳和勝負結果用",{"2":{"162":1}}],["將路由分類",{"2":{"109":1}}],["將程式的結構更加直覺化",{"2":{"104":1}}],["將上傳檔案寫成",{"2":{"101":1}}],["將檔案上傳至免費空間",{"2":{"99":1}}],["將這次請求的",{"2":{"98":1}}],["將文字包起來",{"2":{"90":1}}],["將文字連接起來",{"2":{"81":1}}],["將結果存回",{"2":{"79":1}}],["將結果放在變數",{"2":{"33":1}}],["將前兩個月的天數加起來",{"2":{"77":1}}],["將前兩個數字各除以",{"2":{"60":1}}],["將內層迴圈命名為",{"2":{"76":1}}],["將外層迴圈命名為",{"2":{"76":1}}],["將數字以陣列方式傳進",{"2":{"60":1}}],["將資料傳入子元件",{"2":{"245":1}}],["將資料傳入",{"2":{"56":1}}],["將明文和密鑰傳入",{"2":{"53":1}}],["將兩個",{"2":{"53":1}}],["將隨機出的數字用",{"2":{"47":1}}],["將每個東西執行",{"2":{"43":2}}],["將陣列用連接文字串成文字",{"2":{"41":1}}],["將陣列內容印出成表格",{"2":{"25":1}}],["將",{"2":{"5":1,"44":2,"171":1,"202":1,"228":1,"246":2}}],["考試不及格",{"2":{"4":2}}],["what",{"2":{"229":5}}],["white",{"2":{"144":1,"147":2,"148":2,"164":1,"166":1,"167":2,"226":2}}],["while",{"0":{"73":1,"74":1},"2":{"70":2,"73":2,"74":3,"75":4}}],["w",{"2":{"225":1}}],["wave",{"2":{"253":1}}],["warning",{"2":{"245":2}}],["watch",{"2":{"210":1,"219":4,"240":1,"241":6}}],["wandbox",{"2":{"172":1}}],["wait2",{"2":{"5":6}}],["wait1",{"2":{"5":6}}],["wait",{"2":{"5":9}}],["workflows",{"2":{"271":1}}],["workerjsimport",{"2":{"258":1}}],["worker",{"2":{"258":1}}],["word",{"2":{"171":1}}],["world",{"2":{"69":1,"141":1,"227":1}}],["w3schools",{"2":{"170":1}}],["wrong",{"2":{"95":1}}],["wrjd",{"2":{"53":1}}],["writefilesync",{"2":{"204":1}}],["writehead",{"2":{"193":1}}],["writeconcernerrors",{"2":{"124":1}}],["write",{"2":{"18":1,"22":1,"28":2,"35":10,"36":15,"37":3,"39":2,"47":1,"55":2,"56":2,"57":1,"71":2,"73":1,"76":3,"193":1}}],["wkh",{"2":{"53":1}}],["webhook",{"2":{"198":1}}],["web",{"2":{"92":1,"205":1,"231":2,"258":1}}],["weather",{"2":{"37":2}}],["welcome",{"2":{"2":1}}],["with",{"2":{"271":1}}],["width",{"2":{"140":4,"144":7,"159":2,"164":1,"165":1,"166":2,"167":4,"175":1,"176":4,"178":4,"185":1,"222":3,"258":1}}],["width=device",{"2":{"222":3,"258":1}}],["width=500",{"2":{"136":1}}],["width=",{"2":{"65":1,"215":3}}],["wind",{"2":{"32":2}}],["window",{"0":{"136":1},"2":{"27":3,"89":2,"135":2,"136":14}}],["willgetmoney",{"2":{"4":4}}],["沒提供的話會根據程式碼檔名和行數自動產生",{"2":{"219":2}}],["沒設定就是全部",{"2":{"164":2}}],["沒找到回傳",{"2":{"50":1}}],["沒差",{"2":{"37":1}}],["沒下雨",{"2":{"37":1}}],["沒傘",{"2":{"37":1}}],["沒事",{"2":{"37":1}}],["沒有則是觸發事件",{"2":{"182":1}}],["沒有做任何事",{"2":{"79":1}}],["沒有回傳值",{"2":{"41":1,"83":1}}],["沒有",{"2":{"11":1,"178":1,"220":1,"221":1}}],["沒有零用錢",{"2":{"4":1}}],["沒讀書考不好",{"2":{"4":1}}],["拿到零用錢",{"2":{"4":1}}],["pwa",{"0":{"255":1,"258":1},"1":{"256":1,"257":1,"258":1},"2":{"255":1,"258":9}}],["psd",{"2":{"207":1}}],["pc",{"2":{"190":2}}],["png",{"2":{"185":3,"215":7,"258":6,"268":4}}],["px`",{"2":{"176":6}}],["pdf",{"2":{"171":2}}],["pinia",{"0":{"218":1,"257":1},"2":{"218":2,"257":5,"261":2}}],["picsum",{"2":{"167":1,"181":1}}],["pid",{"2":{"112":1,"116":1}}],["p2",{"2":{"140":2}}],["p1",{"2":{"139":2}}],["p3xshz43zpwfztsuuexqouq7o3bysyosq",{"2":{"93":1}}],["plan",{"2":{"256":2}}],["plan=private",{"2":{"256":2}}],["play",{"2":{"268":5}}],["playground",{"2":{"172":1}}],["player",{"2":{"34":2}}],["platform",{"2":{"139":1}}],["plugins",{"2":{"220":2,"231":1,"258":1,"265":1,"270":1}}],["plugin",{"0":{"220":1},"2":{"110":1,"231":3,"258":3,"264":12}}],["plus",{"2":{"71":1,"253":1}}],["plus=>operation",{"2":{"71":1}}],["photos",{"2":{"167":1}}],["photo",{"2":{"144":1}}],["phones",{"2":{"41":1}}],["phone",{"2":{"22":2}}],["ph",{"2":{"53":1,"144":1}}],["phhw",{"2":{"53":1}}],["p",{"2":{"47":3,"88":5,"111":1,"115":1,"116":1,"139":3,"140":3,"149":4,"150":7,"157":2,"166":1,"219":3,"225":1,"226":1,"227":1,"237":5}}],["pointer",{"2":{"185":1}}],["porro",{"2":{"167":8}}],["port",{"2":{"109":1,"198":1,"203":2,"205":1}}],["position",{"2":{"144":6,"159":2,"166":1,"167":2,"176":2,"178":5,"185":2}}],["post>",{"2":{"245":1}}],["postcode",{"2":{"22":1}}],["post",{"2":{"8":2,"95":1,"96":1,"112":3,"117":1,"245":2}}],["posts=",{"2":{"245":1}}],["posts",{"2":{"5":1,"245":1}}],["pokemon",{"2":{"47":3}}],["pow",{"2":{"46":2}}],["popup",{"0":{"141":1},"2":{"141":1}}],["populate",{"2":{"115":1}}],["pop",{"2":{"41":2}}],["publicvue",{"2":{"258":1}}],["public",{"2":{"215":4,"230":1,"258":2,"262":1,"268":5}}],["pug",{"0":{"224":1},"1":{"225":1,"226":1,"227":1},"2":{"214":2,"224":1,"225":3,"226":2,"227":4,"263":3,"264":4}}],["pull",{"2":{"208":1,"210":1}}],["pure",{"2":{"56":1}}],["push",{"2":{"41":4,"97":1,"208":1,"256":8,"271":1}}],["put",{"2":{"8":1}}],["p>hello",{"2":{"226":1}}],["p>後面",{"2":{"181":1}}],["p>後面新的",{"2":{"181":1}}],["p>前面",{"2":{"181":1}}],["p>前面新的",{"2":{"181":1}}],["p>打開",{"2":{"159":1}}],["p>insertadjacenthtml",{"2":{"149":4}}],["p>123",{"2":{"149":1}}],["p>文字文字文字",{"2":{"69":1}}],["p>",{"2":{"22":2,"69":1,"88":1,"139":1,"140":1,"149":5,"150":1,"159":1,"166":1,"181":4,"185":4,"219":3,"226":1,"237":5,"250":2}}],["private",{"2":{"256":2}}],["primevue",{"2":{"253":1}}],["print",{"2":{"237":1,"240":1}}],["principal",{"2":{"175":10}}],["price",{"2":{"22":7,"117":8,"126":10}}],["prettier",{"2":{"261":2}}],["pretty",{"2":{"126":2}}],["prerelease",{"2":{"254":1}}],["pre",{"2":{"219":3}}],["pre>",{"2":{"219":9}}],["prepend",{"2":{"181":3}}],["preserve",{"2":{"178":1}}],["preset=",{"2":{"35":1,"37":1,"71":1,"73":1,"74":1,"96":1}}],["prevent",{"2":{"237":1}}],["preventdefault",{"2":{"158":2}}],["prevuntil",{"2":{"180":3}}],["prevall",{"2":{"180":3}}],["prev",{"2":{"176":2,"180":3,"219":1}}],["previoussibling",{"2":{"150":1}}],["previouselementsibling",{"2":{"147":3}}],["prop",{"2":{"247":1}}],["props",{"2":{"241":3,"245":7,"246":1,"247":3}}],["property",{"2":{"220":1,"222":3}}],["properties",{"2":{"22":2}}],["project",{"2":{"229":3,"261":2}}],["projection",{"2":{"126":3}}],["provide",{"0":{"249":1},"2":{"249":4}}],["provider",{"2":{"197":1}}],["provident",{"2":{"167":8}}],["problem",{"2":{"172":1}}],["program",{"2":{"120":1}}],["promptbtn",{"2":{"141":2}}],["prompt",{"2":{"35":2,"38":2,"44":2,"47":2,"53":1,"60":8,"73":1,"74":1,"77":5,"141":5,"151":1}}],["promise",{"0":{"4":1},"2":{"0":1,"4":5,"5":8}}],["processing",{"2":{"150":1}}],["process",{"2":{"95":1,"97":1,"101":3,"110":1,"202":1,"203":4}}],["process13=>operation",{"2":{"37":1}}],["process12=>operation",{"2":{"37":1}}],["process11=>operation",{"2":{"37":1}}],["process1=>operation",{"2":{"35":1,"37":1}}],["process4=>operation",{"2":{"35":1}}],["process3=>operation",{"2":{"35":1}}],["process2=>operation",{"2":{"35":1}}],["product",{"2":{"147":1}}],["products",{"2":{"22":6,"111":2,"114":2,"115":1,"116":2,"117":6,"126":2}}],["producer",{"2":{"22":4}}],["people",{"2":{"21":1}}],["person",{"2":{"19":5,"23":3,"27":1,"28":3}}],["pending",{"2":{"4":1,"219":8}}],["palette",{"2":{"230":1}}],["pastebin",{"2":{"172":1}}],["password",{"2":{"95":5,"111":1,"114":2,"115":1,"116":2,"181":2}}],["passwordfield",{"2":{"95":1}}],["passportjwt",{"2":{"95":3}}],["passport",{"0":{"95":1},"2":{"94":3,"95":15,"96":4}}],["pass",{"2":{"24":2}}],["passed",{"2":{"4":4}}],["pad",{"2":{"166":3,"167":3}}],["padstart",{"2":{"144":3}}],["pages",{"2":{"217":5,"256":2,"271":3}}],["page",{"2":{"216":2,"261":1}}],["pagey",{"2":{"157":1}}],["pagex",{"2":{"157":1}}],["paid",{"2":{"114":1}}],["package",{"0":{"188":1},"2":{"107":1,"188":2,"189":1,"193":1,"201":1,"230":1}}],["pathname",{"2":{"137":2}}],["path",{"2":{"101":2,"120":1,"217":3,"231":1,"256":6,"265":3}}],["patch",{"2":{"8":1,"112":3,"117":1}}],["payload",{"2":{"93":2}}],["parseroptions",{"2":{"264":1}}],["parseint",{"2":{"60":5,"77":1}}],["parentsuntil",{"2":{"180":3}}],["parents",{"2":{"180":3}}],["parent",{"2":{"180":3}}],["parentnode",{"2":{"150":1}}],["parentelement",{"2":{"147":3}}],["params",{"2":{"114":1,"115":2,"116":3,"117":3,"219":2}}],["param",{"2":{"59":8,"117":1}}],["party",{"2":{"53":1}}],["也請注意",{"2":{"172":1}}],["也將修改與功能擴充簡化",{"2":{"104":1}}],["也能以",{"2":{"88":1}}],["也方便維護",{"2":{"54":1}}],["也不可能會有前輩隨時回答你的問題",{"2":{"172":1}}],["也不可能",{"2":{"172":1}}],["也不是",{"2":{"38":1}}],["也不能用",{"2":{"19":1}}],["也是多筆新增",{"2":{"124":1}}],["也是一樣的運作方式",{"2":{"79":1}}],["也是最流行的腳本語言",{"2":{"64":1}}],["也是",{"2":{"16":1,"53":1}}],["也有自己的",{"2":{"15":1}}],["也有可能因為沒讀書而考不好",{"2":{"4":1}}],["也就是指整個網頁的",{"2":{"146":1}}],["也就是",{"2":{"8":1,"9":1,"135":1,"147":1,"266":1}}],["也可以不放東西",{"2":{"250":1}}],["也可以同時引用具名和預設",{"2":{"192":1}}],["也可以使用",{"2":{"192":1}}],["也可以設定為陣列",{"2":{"166":2}}],["也可以將時間依語言格式化輸出",{"2":{"143":1}}],["也可以做資料驗證",{"2":{"111":1}}],["也可以自訂欄位名稱",{"2":{"95":1}}],["也可以用",{"2":{"5":1,"180":1}}],["也可以透過",{"2":{"5":1}}],["也可以利用這種寫法進行流程控制",{"2":{"1":1}}],["執行工作的虛擬機作業系統",{"2":{"271":1}}],["執行的工作",{"2":{"271":1}}],["執行主體",{"2":{"107":1}}],["執行後後再判斷要不要執行下一次",{"2":{"73":1}}],["執行條件",{"2":{"71":1}}],["執行時會將",{"2":{"36":1}}],["執行區塊內程式碼",{"2":{"35":4}}],["執行程式碼",{"2":{"30":2}}],["執行這段程式碼需要",{"2":{"5":1}}],["執行",{"2":{"4":1,"37":1,"55":2,"71":1,"73":1,"74":1,"220":1,"223":1}}],["就好",{"2":{"201":1,"241":1}}],["就像是組電腦一樣",{"2":{"190":1}}],["就能引用了",{"2":{"267":1}}],["就能在雙引號內寫上要執行的",{"2":{"154":1}}],["就能進入終端機下資料庫指令",{"2":{"120":1}}],["就能接收檔案",{"2":{"101":1}}],["就能執行",{"2":{"55":1}}],["就可以取得更深層的元素",{"2":{"147":1}}],["就可以避免一堆",{"2":{"81":1}}],["就可以在",{"2":{"5":1}}],["就到了",{"2":{"47":1}}],["就是元件本身",{"2":{"241":1}}],["就是",{"2":{"47":1}}],["就是承諾",{"2":{"4":1}}],["就依序代表密碼中的一位數",{"2":{"47":1}}],["就需要用到",{"2":{"35":1}}],["就會使用預設值",{"2":{"56":1}}],["就會執行",{"2":{"36":1}}],["就會裡面的執行程式碼",{"2":{"30":2}}],["就會是",{"2":{"26":1}}],["就跟單字的意思一樣",{"2":{"4":1}}],["`+",{"2":{"249":1}}],["`data",{"2":{"249":1}}],["`https",{"2":{"219":2}}],["`url",{"2":{"178":1}}],["`rotate",{"2":{"144":3}}],["`瀏覽器語言",{"2":{"139":1}}],["`目前網址是",{"2":{"137":1}}],["`aa",{"2":{"90":1}}],["`文字`",{"2":{"90":1}}],["`你好",{"2":{"81":1}}],["`輸入了$",{"2":{"73":1}}],["`$",{"2":{"56":2,"57":1,"58":1,"76":2,"176":1,"222":1,"265":1}}],["`恭喜過關",{"2":{"39":1}}],["`有",{"2":{"18":1}}],["`過了",{"2":{"5":1}}],["`",{"2":{"3":1,"22":2,"56":2,"57":1,"58":1,"76":1,"81":1,"90":3,"137":1,"139":1,"140":2,"144":3,"176":5,"178":3,"185":5,"219":2,"265":1}}],["`驗證失敗",{"2":{"3":1}}],["$patch",{"2":{"257":2}}],["$pull",{"2":{"117":1}}],["$push",{"2":{"114":1}}],["$router",{"2":{"256":6}}],["$route",{"2":{"256":3}}],["$refs",{"2":{"242":1}}],["$ref",{"2":{"242":1}}],["$emit",{"2":{"240":1,"241":1,"246":2,"247":1}}],["$event",{"2":{"237":2}}],["$fetch",{"2":{"219":7}}],["$mul",{"2":{"127":1}}],["$not",{"2":{"126":2}}],["$nin",{"2":{"126":2}}],["$or",{"2":{"126":2}}],["$and",{"2":{"126":2}}],["$inc",{"2":{"127":1}}],["$in",{"2":{"126":2}}],["$lt",{"2":{"126":4}}],["$lte",{"2":{"126":2}}],["$gt",{"2":{"126":3}}],["$gte",{"2":{"126":2}}],["$set",{"2":{"116":1,"127":2}}],["$3",{"2":{"50":1}}],["$2",{"2":{"50":2}}],["$1",{"2":{"50":2}}],["$",{"2":{"3":1,"5":1,"15":3,"18":1,"22":3,"39":1,"50":6,"76":1,"81":1,"88":2,"137":1,"139":2,"140":5,"144":3,"175":9,"176":22,"178":20,"180":25,"181":21,"182":2,"185":16,"219":2}}],["1並手動新增至",{"2":{"264":1}}],["1在根目錄建立",{"2":{"264":1}}],["1使用多個",{"2":{"250":1}}],["1就能在",{"2":{"227":1}}],["1s",{"2":{"178":2}}],["1jsmodule",{"2":{"264":2}}],["1js",{"2":{"150":1,"242":1,"245":1,"247":1}}],["1px",{"2":{"149":1,"167":1}}],["1迴圈範例",{"2":{"147":1}}],["1可使用",{"2":{"129":1}}],["1mb",{"2":{"101":1}}],["1轉換為程式後",{"2":{"87":1}}],["11000",{"2":{"114":1}}],["110",{"2":{"79":1}}],["11",{"2":{"79":3,"150":1}}],["1~8",{"2":{"47":1}}],["1~38",{"2":{"47":1}}],["13html",{"2":{"237":1}}],["13",{"2":{"25":2,"61":1,"77":1}}],["17",{"2":{"25":4}}],["180x180",{"2":{"258":1}}],["180deg",{"2":{"178":2}}],["180",{"2":{"65":1}}],["18",{"2":{"25":4,"35":2,"36":7,"58":2,"77":2,"111":2,"257":1}}],["1489549132488",{"2":{"144":1}}],["144",{"2":{"61":1}}],["146821",{"2":{"47":2}}],["14",{"2":{"25":1,"77":1}}],["14900",{"2":{"22":1}}],["16x16",{"2":{"258":1}}],["16",{"2":{"25":1,"36":1,"77":2,"178":1}}],["12取得偽元素樣式範例",{"2":{"148":1}}],["12function",{"2":{"63":1}}],["12在宣告",{"2":{"63":1}}],["12增加",{"2":{"41":1}}],["12實際應用範例",{"2":{"38":1}}],["123jsvue",{"2":{"236":1}}],["123使用元件時將內容放進元件標籤內即可",{"2":{"250":1}}],["123使用",{"2":{"215":1,"268":1}}],["123cssbody",{"2":{"215":1,"268":1}}],["123清除計時器範例",{"2":{"83":1}}],["123var",{"2":{"63":1}}],["123tip",{"2":{"58":1,"71":1}}],["123提示",{"2":{"53":1}}],["1231",{"2":{"43":2}}],["123||",{"2":{"32":1}}],["123",{"2":{"30":1,"38":3,"46":1,"47":1,"49":8,"57":1,"73":2,"74":2,"80":1,"87":1,"89":1,"90":2,"100":1,"117":1,"126":2,"148":1,"155":1,"160":1,"200":1,"202":1,"204":1,"237":1,"254":1,"267":1}}],["1234jsmounted",{"2":{"268":1}}],["1234元件觸發",{"2":{"246":1}}],["1234vue",{"2":{"244":1}}],["1234就能在路由使用驗證方式",{"2":{"95":1}}],["1234tip",{"2":{"83":1}}],["1234注意",{"2":{"76":1}}],["1234使用匿名函式",{"2":{"83":1}}],["1234使用",{"2":{"63":1}}],["1234",{"2":{"32":1,"58":1,"94":1,"117":2,"128":1,"147":1,"193":1,"215":1,"227":1,"256":2,"257":1,"270":1}}],["1234for",{"2":{"23":3}}],["12345練習",{"2":{"250":1}}],["12345使用時將資料解構出來",{"2":{"250":1}}],["12345jsroutes",{"2":{"217":1}}],["12345jsif",{"2":{"30":1}}],["12345import",{"2":{"192":1}}],["123457",{"2":{"124":1}}],["12345測試資料",{"2":{"60":2}}],["12345語言判斷",{"2":{"36":1}}],["12345",{"2":{"25":2,"30":1,"42":1,"77":2,"96":1,"149":1,"181":1,"191":1,"221":1,"258":1,"268":1}}],["12345物件範例",{"2":{"24":1}}],["12345傳址",{"2":{"24":1}}],["12345二維陣列概念",{"2":{"21":1}}],["12345如果把上面的物件想像成一個人",{"2":{"19":1}}],["123456注意",{"2":{"93":1}}],["123456測試資料",{"2":{"47":1}}],["123456相反式範例",{"2":{"32":1}}],["123456資料型態比較範例",{"2":{"31":1}}],["123456",{"2":{"30":1,"74":1,"83":1,"117":1,"124":2,"201":1,"237":1,"257":1}}],["123456物件傳址範例",{"2":{"24":1}}],["1234567若使用",{"2":{"264":1}}],["1234567或在",{"2":{"222":1}}],["1234567也能套用自訂",{"2":{"216":1}}],["1234567cssbody",{"2":{"215":1}}],["1234567let",{"2":{"89":1}}],["1234567jsfor",{"2":{"76":1}}],["1234567測試資料",{"2":{"60":1}}],["1234567物件回傳簡寫範例",{"2":{"58":1}}],["1234567",{"2":{"56":1,"58":1,"63":1,"73":1,"77":1,"84":1,"139":1,"218":1,"232":1,"237":1,"250":1,"265":1}}],["1234567參數可以設定預設值",{"2":{"56":1}}],["1234567如果把上面的陣列想像成一台火車",{"2":{"18":1}}],["12345678若使用",{"2":{"264":1}}],["12345678使用元件時將內容放進",{"2":{"250":1}}],["12345678uselazyfetch",{"2":{"219":1}}],["12345678注意",{"2":{"190":1}}],["12345678模組化好處就是方便抽換",{"2":{"190":1}}],["12345678let",{"2":{"89":1}}],["123456789若使用",{"2":{"264":1}}],["123456789若要在插槽內使用元件內的資料",{"2":{"250":1}}],["123456789import",{"2":{"191":1}}],["123456789const",{"2":{"89":1}}],["123456789語言判斷",{"2":{"36":1}}],["123456789注意",{"2":{"24":1,"220":1}}],["123456789",{"2":{"13":1,"31":1,"38":1,"46":1,"77":1,"79":1,"138":1,"150":1,"157":1}}],["1234567891011練習",{"2":{"242":1}}],["1234567891011uselazyasyncdata",{"2":{"219":1}}],["1234567891011以",{"2":{"115":1}}],["1234567891011",{"2":{"49":1,"57":1,"65":3,"81":1,"83":1,"97":1,"117":2,"156":1,"158":1,"182":1,"237":1,"258":1}}],["1234567891011若判斷的是布林值",{"2":{"31":1}}],["1234567891011可選串連搭配短路求值範例",{"2":{"22":1}}],["123456789101112物件內值為陣列範例",{"2":{"21":1}}],["123456789101112",{"2":{"19":1,"37":1,"41":1,"55":1,"60":1,"61":1,"62":1,"65":1,"88":1,"106":1,"110":1,"113":1,"143":1,"216":1}}],["12345678910111213也能在",{"2":{"155":1}}],["12345678910111213",{"2":{"24":1,"69":1,"89":1,"117":2,"254":1,"264":1}}],["12345678910111213練習",{"2":{"16":1}}],["1234567891011121314呼叫",{"2":{"219":1}}],["1234567891011121314或是在元件內各別定義",{"2":{"216":1}}],["1234567891011121314最後改寫路由引用",{"2":{"96":1}}],["1234567891011121314以輾轉相除法求最大公因數",{"2":{"61":1}}],["123456789101112131415輸入指令執行",{"2":{"193":1}}],["123456789101112131415計算費氏數列的第",{"2":{"61":1}}],["123456789101112131415陣列範例",{"2":{"22":1}}],["12345678910111213141516vue",{"2":{"244":1}}],["12345678910111213141516",{"2":{"20":1,"140":1}}],["12345678910111213141516物件解構範例",{"2":{"20":1}}],["1234567891011121314151617也可以使用這些方法取得相對位置的元素",{"2":{"147":1}}],["1234567891011121314151617年齡分級判斷範例",{"2":{"36":1}}],["1234567891011121314151617上面的程式碼可以畫成像這樣的心智圖",{"2":{"27":1}}],["123456789101112131415161718usefetch",{"2":{"219":1}}],["1234567891011121314151617181920子元件就能使用",{"2":{"249":1}}],["1234567891011121314151617181920",{"2":{"192":1,"203":1}}],["123456789101112131415161718192021以訂單",{"2":{"117":1}}],["12345678910111213141516171819202122html",{"2":{"226":1}}],["1234567891011121314151617181920212223",{"2":{"256":1}}],["1234567891011121314151617181920212223或是使用",{"2":{"219":1}}],["12345678910111213141516171819202122232425",{"2":{"115":1,"249":1,"256":1}}],["12345678910111213141516171819202122232425聚合查詢使用者訂單",{"2":{"115":1}}],["1234567891011121314151617181920212223242526",{"2":{"247":1}}],["1234567891011121314151617181920212223242526在專案的資料夾使用",{"2":{"188":1}}],["1234567891011121314151617181920212223242526練習",{"2":{"39":1}}],["12345678910111213141516171819202122232425262728",{"2":{"125":1}}],["12345678910111213141516171819202122232425262728293031",{"2":{"149":1,"257":1}}],["12345678910111213141516171819202122232425262728293031323334cssbody",{"2":{"268":1}}],["1234567891011121314151617181920212223242526272829303132333435",{"2":{"167":1,"245":1}}],["1234567891011121314151617181920212223242526272829303132333435363738",{"2":{"159":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940",{"2":{"258":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041",{"2":{"248":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243",{"2":{"167":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445",{"2":{"181":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445在",{"2":{"95":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849新增訂單",{"2":{"114":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253",{"2":{"231":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556或是使用",{"2":{"222":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162",{"2":{"176":1,"240":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566",{"2":{"175":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677",{"2":{"241":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697",{"2":{"185":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104",{"2":{"178":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150",{"2":{"144":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576",{"2":{"111":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071",{"2":{"50":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061",{"2":{"166":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859",{"2":{"165":1}}],["123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354",{"2":{"101":1,"180":1}}],["12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152",{"2":{"164":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950",{"2":{"15":1}}],["1234567891011121314151617181920212223242526272829303132333435363738394041424344454647",{"2":{"41":1}}],["123456789101112131415161718192021222324252627282930313233343536373839",{"2":{"42":1,"114":1,"246":1}}],["123456789101112131415161718192021222324252627282930313233343536373839注意",{"2":{"5":1}}],["12345678910111213141516171819202122232425262728293031323334353637",{"2":{"148":1}}],["1234567891011121314151617181920212223242526272829303132333435作業",{"2":{"117":1}}],["12345678910111213141516171819202122232425262728293031323334修改訂單內商品數量",{"2":{"116":1}}],["12345678910111213141516171819202122232425262728293031323334",{"2":{"109":1,"116":1,"149":1,"176":1}}],["123456789101112131415161718192021222324252627282930313233",{"2":{"59":1}}],["1234567891011121314151617181920212223242526272829",{"2":{"22":1,"222":1,"271":1}}],["123456789101112131415161718192021222324252627",{"2":{"43":1,"112":1,"124":1}}],["123456789101112131415161718192021222324252627練習",{"2":{"35":1}}],["123456789101112131415161718192021222324",{"2":{"36":1}}],["12345678910111213141516171819202122",{"2":{"28":1,"51":1,"141":1,"257":1}}],["12345678910111213141516171819",{"2":{"76":1,"219":1}}],["12345678910111213141516171819tip",{"2":{"46":1}}],["123456789101112131415161718",{"2":{"18":1,"230":1,"237":1}}],["1234567891011121314151617",{"2":{"14":1,"90":1,"147":1,"217":1}}],["123456789101112131415",{"2":{"4":1,"33":1,"136":1,"244":1}}],["1234567891011121314也可以包成",{"2":{"4":1}}],["1234567891011121314",{"2":{"3":1,"137":1}}],["12345678910",{"2":{"2":1,"41":1,"98":1,"107":1,"226":1}}],["12345678",{"2":{"5":1,"23":1,"34":1,"71":1,"154":1,"200":1,"236":1}}],["123456但是執行這段程式碼只需要",{"2":{"5":1}}],["12上面的範例可以寫成",{"2":{"30":1}}],["12",{"2":{"25":1,"35":2,"36":1,"38":2,"77":3,"95":1,"111":2,"121":1,"127":1,"143":2,"148":1,"180":1,"237":1,"242":1,"254":1}}],["192x192",{"2":{"258":2}}],["1970",{"2":{"143":1}}],["19",{"2":{"25":1}}],["150px",{"2":{"159":2,"185":1}}],["150",{"2":{"46":5}}],["1500px",{"2":{"166":1,"167":1}}],["1500",{"2":{"5":5,"43":1}}],["15641310",{"2":{"43":2}}],["1561",{"2":{"43":2}}],["154613",{"2":{"43":2}}],["15",{"2":{"22":1,"25":5,"35":2,"36":1,"61":1,"77":1,"178":2}}],["1xx",{"2":{"9":1}}],["1",{"2":{"3":1,"18":3,"20":7,"22":1,"24":6,"25":6,"27":1,"33":1,"35":3,"41":5,"42":6,"46":4,"47":5,"50":5,"51":2,"60":2,"61":34,"62":3,"71":3,"76":5,"77":10,"79":2,"83":1,"89":11,"121":1,"125":6,"126":3,"131":1,"132":1,"138":1,"143":2,"144":2,"147":4,"150":1,"176":1,"178":2,"181":1,"185":1,"188":1,"191":3,"192":1,"202":1,"219":2,"222":4,"231":1,"237":6,"240":1,"241":1,"254":1,"256":1,"258":1,"267":1}}],["10px",{"2":{"144":6,"165":5,"178":1,"237":1}}],["1024",{"2":{"101":2}}],["100px",{"2":{"164":2,"165":2,"166":1,"176":3,"237":5}}],["100",{"2":{"9":1,"24":12,"31":2,"42":3,"43":4,"46":1,"47":2,"60":1,"62":1,"65":1,"77":1,"79":1,"80":2,"144":3,"155":1,"166":2,"167":3,"176":3,"178":4,"185":1,"215":3,"257":5}}],["1000",{"2":{"5":1,"18":1,"60":1,"83":1,"84":1,"144":1,"176":3,"178":2,"185":1}}],["10",{"2":{"3":1,"25":3,"31":1,"39":3,"60":2,"71":3,"76":2,"77":3,"79":12,"85":1,"114":2,"144":2,"150":1,"167":1,"185":1,"192":1}}],[">home",{"2":{"256":1}}],[">內文",{"2":{"250":1}}],[">標題",{"2":{"250":1}}],[">你點擊了",{"2":{"244":1}}],[">文字文字",{"2":{"242":1}}],[">123",{"2":{"237":1}}],[">123456",{"2":{"150":1}}],[">number",{"2":{"237":3}}],[">aaa",{"2":{"226":1}}],[">載入中",{"2":{"219":3}}],[">`",{"2":{"185":1}}],[">30",{"2":{"185":1}}],[">0",{"2":{"185":1}}],[">google",{"2":{"181":1,"226":1}}],[">isintersecting",{"2":{"166":1}}],[">inner",{"2":{"159":1}}],[">連結",{"2":{"158":1}}],[">由於",{"2":{"96":1}}],[">third",{"2":{"96":1}}],[">second",{"2":{"96":1}}],[">start",{"2":{"71":1}}],[">first",{"2":{"96":1}}],[">jslet",{"2":{"74":1}}],[">jsconst",{"2":{"37":1}}],[">下面這個範例",{"2":{"73":1}}],[">迴圈的程式寫法如下面範例",{"2":{"71":1}}],[">plus",{"2":{"71":1}}],[">process4",{"2":{"35":1}}],[">process3",{"2":{"35":1}}],[">process2",{"2":{"35":1}}],[">process13",{"2":{"37":1}}],[">process12",{"2":{"37":1}}],[">process11",{"2":{"37":1}}],[">process1",{"2":{"35":1,"37":1}}],[">code",{"2":{"71":1,"73":1,"74":2}}],[">cond",{"2":{"71":2,"73":2,"74":1}}],[">cond4",{"2":{"35":1}}],[">cond3",{"2":{"35":1}}],[">cond2",{"2":{"35":1}}],[">cond1",{"2":{"35":1,"37":1}}],[">點我去",{"2":{"65":1}}],[">我是一段文字",{"2":{"65":2}}],[">=",{"2":{"35":10,"36":7,"257":2}}],[">程式寫法範例",{"2":{"35":1}}],[">e",{"2":{"35":4,"37":2,"71":1,"73":1,"74":1,"96":1}}],[">$",{"2":{"22":1}}],[">",{"2":{"3":1,"31":3,"42":7,"65":4,"69":2,"88":1,"124":3,"125":3,"126":1,"127":1,"128":2,"135":1,"139":1,"140":1,"141":3,"144":12,"149":9,"150":2,"154":3,"155":5,"157":1,"159":1,"164":2,"165":3,"166":4,"167":5,"175":8,"176":17,"178":4,"185":3,"215":3,"216":7,"219":3,"222":5,"226":3,"227":1,"236":2,"237":28,"244":2,"245":1,"246":4,"247":1,"250":3,"254":1,"256":2,"258":8,"268":7}}],["512x512",{"2":{"258":2}}],["512px圖片路徑",{"2":{"258":1}}],["5千專案遭波及",{"2":{"209":1}}],["5px",{"2":{"144":4}}],["59",{"2":{"143":2}}],["598701",{"2":{"47":1}}],["54",{"2":{"77":1}}],["52",{"2":{"71":1}}],["55",{"2":{"25":2,"61":1}}],["564635",{"2":{"43":2}}],["56",{"2":{"25":2,"77":1,"79":1}}],["50px",{"2":{"166":2,"167":2,"176":1,"178":1,"181":1}}],["5000",{"2":{"83":5,"84":1}}],["500",{"2":{"42":3,"43":1,"98":1,"101":1,"114":2,"115":3,"116":2,"117":2,"176":2}}],["50",{"2":{"25":1,"47":1,"144":7,"166":2,"176":3,"185":2}}],["5xx",{"2":{"9":1}}],["5",{"2":{"3":1,"24":2,"25":3,"39":1,"41":4,"46":4,"51":2,"60":2,"61":10,"76":7,"77":4,"79":2,"83":4,"87":3,"166":3,"175":1,"185":1,"250":1,"258":1}}],["npx",{"2":{"214":1}}],["npm",{"2":{"94":4,"100":2,"106":6,"188":2,"189":1,"193":1,"198":1,"200":4,"214":3,"218":1,"223":1,"225":1,"227":1,"229":1,"231":1,"254":3,"256":2,"257":2,"258":1,"261":3,"263":3,"264":4,"270":1,"271":2}}],["ngrok",{"0":{"198":1},"2":{"198":3}}],["n牌顯示卡",{"2":{"190":2}}],["nth",{"2":{"167":2}}],["nindexeswas",{"2":{"125":1}}],["ninserted",{"2":{"124":1}}],["ns",{"2":{"125":2}}],["nremoved",{"2":{"124":1}}],["nmodified",{"2":{"124":1}}],["nmatched",{"2":{"124":1}}],["network",{"2":{"120":1}}],["nexttick",{"2":{"242":2}}],["nextuntil",{"2":{"180":3}}],["nextall",{"2":{"180":3}}],["nextsibling",{"2":{"150":1}}],["nextelementsibling",{"2":{"147":6}}],["next",{"2":{"96":3,"101":2,"176":2,"180":3,"219":1,"220":1}}],["newvalue",{"2":{"240":8,"241":10}}],["newdata",{"2":{"219":2}}],["newfruits",{"2":{"41":3}}],["new",{"2":{"3":5,"4":4,"5":3,"13":1,"28":3,"95":3,"101":2,"109":1,"111":2,"114":2,"116":4,"117":1,"143":3,"144":1,"148":1,"154":2,"164":2,"165":3,"166":2,"167":2,"244":1,"268":10}}],["n+2",{"2":{"60":1}}],["n+1",{"2":{"60":1}}],["n",{"2":{"47":1,"60":5,"61":16}}],["naive",{"2":{"253":1}}],["navbar",{"2":{"267":4}}],["nav",{"2":{"180":1,"231":1}}],["navigator",{"0":{"139":1},"2":{"139":3}}],["nan",{"2":{"38":1,"90":1}}],["name=",{"2":{"216":2,"222":2,"226":2,"250":3,"258":3}}],["name",{"2":{"19":6,"21":3,"22":10,"23":1,"38":6,"58":2,"63":4,"101":2,"111":1,"114":7,"115":6,"116":4,"117":9,"124":5,"125":2,"126":4,"128":2,"188":1,"217":3,"222":2,"229":2,"231":3,"237":2,"240":3,"241":5,"256":4,"257":5,"258":4,"261":2,"271":4}}],["nuxi",{"2":{"214":1}}],["nuxtapp",{"2":{"220":2}}],["nuxtjs",{"2":{"219":2}}],["nuxtlink",{"2":{"217":1}}],["nuxtlayout>",{"2":{"216":4}}],["nuxtlayout",{"2":{"216":4}}],["nuxtpage",{"2":{"216":2,"217":1}}],["nuxtwelcome",{"2":{"214":1}}],["nuxt",{"0":{"212":1,"213":1},"1":{"213":1,"214":2,"215":2,"216":2,"217":2,"218":2,"219":2,"220":2,"221":2,"222":2,"223":2},"2":{"212":1,"213":1,"214":4,"215":1,"217":3,"218":3,"219":4,"220":1,"221":4,"222":3}}],["nupserted",{"2":{"124":1}}],["num2",{"2":{"191":5}}],["num1",{"2":{"191":5,"192":1}}],["numerals",{"2":{"88":1}}],["num",{"2":{"47":1,"185":4}}],["number3",{"2":{"60":2}}],["number2",{"2":{"60":4,"192":2}}],["number1",{"2":{"60":4,"192":2}}],["numbers3",{"2":{"43":3}}],["numbers2total",{"2":{"43":2}}],["numbers2",{"2":{"43":2}}],["numbers1double",{"2":{"43":2}}],["numbers1",{"2":{"43":2}}],["numbers",{"2":{"25":1,"41":5,"42":11,"60":2,"191":4}}],["number",{"2":{"3":1,"19":3,"21":2,"23":1,"58":6,"90":2,"111":2,"178":6,"237":4}}],["null",{"2":{"38":5,"50":1,"90":1,"95":5,"101":1,"109":1,"117":2,"149":2,"166":3,"167":1,"204":1,"219":3,"242":1}}],["noscript>",{"2":{"222":1}}],["noscript>javascript",{"2":{"222":1}}],["noscript",{"2":{"222":1}}],["none",{"2":{"175":1,"185":1,"237":1}}],["nobis",{"2":{"167":8}}],["now++",{"2":{"176":1}}],["now",{"2":{"143":5,"176":6}}],["nodemon",{"0":{"201":1},"2":{"200":1,"201":3}}],["nodevalue",{"2":{"150":1}}],["nodename",{"2":{"150":1}}],["nodetype",{"2":{"150":5}}],["node",{"0":{"186":1,"189":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1},"2":{"66":2,"68":1,"102":1,"150":21,"186":1,"188":2,"189":1,"190":2,"193":3,"194":1,"200":1,"201":3,"202":2,"223":1,"259":1,"261":1}}],["no",{"2":{"35":3,"37":1,"71":1,"73":1,"74":1,"178":2}}],["nothing",{"2":{"22":6}}],["not",{"2":{"3":1,"31":1,"58":1,"63":2,"90":1,"95":1,"178":7,"180":3}}],["edit",{"2":{"268":1}}],["editor",{"2":{"200":1}}],["ecmaversion",{"2":{"264":1}}],["ecmascript",{"2":{"68":1,"188":1,"190":3}}],["e2e",{"2":{"261":1}}],["essential",{"2":{"264":4}}],["esc",{"2":{"242":3}}],["eslintrc",{"2":{"264":2}}],["eslint",{"0":{"264":1},"2":{"200":2,"261":2,"264":13}}],["equal",{"2":{"253":1}}],["eq",{"2":{"178":4,"180":6,"181":7}}],["eum",{"2":{"167":8}}],["eyjfawqioii2mdi3zte4njezodk2zjixyzhlyju2nzyilcjpyxqioje2mtmymzaxodcsimv4cci6mtyxmzgzndk4n30",{"2":{"93":1}}],["eyjhbgcioijiuzi1niisinr5cci6ikpxvcj9",{"2":{"93":1}}],["elit",{"2":{"167":8}}],["element",{"2":{"148":18,"149":2,"150":4,"180":3,"253":1}}],["electron",{"2":{"67":1}}],["el",{"2":{"147":4,"154":2}}],["else>number",{"2":{"237":1}}],["else>",{"2":{"219":3}}],["else",{"2":{"4":2,"30":6,"31":3,"32":2,"33":1,"34":1,"35":18,"36":3,"37":3,"39":3,"61":3,"65":1,"95":1,"101":5,"114":3,"115":2,"116":2,"117":4,"167":1,"176":1,"237":1}}],["extends",{"2":{"264":4}}],["extractjwt",{"2":{"95":3}}],["expiresin",{"2":{"97":1}}],["exports",{"2":{"190":1,"231":1,"264":4}}],["export",{"2":{"96":1,"101":1,"103":1,"111":1,"112":1,"113":8,"114":1,"190":2,"191":3,"192":7,"220":1,"221":1,"256":1,"257":1,"258":1,"265":1,"268":1}}],["express",{"2":{"96":1,"106":2,"109":4,"112":3,"213":1}}],["expression",{"2":{"55":3,"63":2}}],["example",{"2":{"139":2,"144":25,"150":4}}],["example4",{"2":{"65":2}}],["example3",{"2":{"65":4,"141":6}}],["example2",{"2":{"65":4,"88":2,"140":2,"149":8}}],["example1",{"2":{"65":4,"149":11}}],["ef",{"2":{"51":1}}],["eventbus",{"2":{"248":1}}],["event",{"0":{"157":1},"2":{"157":2,"158":1,"203":7,"237":2,"240":2}}],["events",{"2":{"13":1,"14":1,"15":4,"16":1,"185":1,"219":6}}],["every",{"2":{"42":5}}],["each",{"2":{"41":2,"178":1,"180":3,"181":1}}],["enter=",{"2":{"237":2}}],["enter",{"2":{"237":1,"242":1}}],["entry",{"2":{"166":3,"167":2}}],["entries",{"2":{"166":4,"167":5}}],["enhanceapp",{"2":{"230":1}}],["environment",{"2":{"205":2}}],["env",{"2":{"95":1,"97":1,"101":3,"110":1,"202":3,"203":4}}],["encryption",{"2":{"93":1}}],["end",{"2":{"73":1,"193":1,"261":2}}],["en",{"2":{"36":6,"43":3}}],["e=>end",{"2":{"35":1,"37":1,"71":1,"73":1,"74":1,"96":1}}],["emitter",{"2":{"248":6}}],["emit",{"2":{"241":1,"246":2,"247":2,"248":2}}],["emitevent",{"2":{"240":1,"241":2}}],["emailreplacegroup2",{"2":{"50":2}}],["emailreplacegroup",{"2":{"50":2}}],["emailregexgroup2",{"2":{"50":3}}],["emailregexgroup",{"2":{"50":3}}],["emailmatchallgroup2",{"2":{"50":2}}],["emailmatchallgroup",{"2":{"50":2}}],["emailmatch",{"2":{"50":2}}],["email",{"2":{"22":2,"50":6,"111":1,"114":4,"115":4,"116":2,"171":1,"229":1,"257":3}}],["empty",{"2":{"3":1}}],["e",{"2":{"5":3,"18":1,"25":2,"157":2,"158":3,"248":4}}],["errors",{"2":{"114":5}}],["error",{"2":{"3":5,"4":2,"5":3,"9":2,"14":2,"15":7,"16":2,"98":1,"101":5,"109":2,"114":12,"115":8,"116":4,"117":4,"219":4}}],["err",{"2":{"2":2,"3":2,"4":4,"5":2,"13":2,"95":3,"96":2,"114":1}}],["ico",{"2":{"258":1}}],["icon=",{"2":{"254":1}}],["icons",{"2":{"254":5,"258":2}}],["iconnpm",{"2":{"254":1}}],["icon",{"2":{"254":7,"258":7}}],["ionic",{"2":{"253":1}}],["i牌cpu",{"2":{"190":2}}],["ipsam",{"2":{"167":8}}],["ipsa",{"2":{"167":8}}],["ipsum",{"2":{"167":8}}],["iphone",{"2":{"22":1}}],["itaque",{"2":{"167":8}}],["italic",{"2":{"148":2}}],["item2",{"2":{"147":1}}],["item1",{"2":{"147":1}}],["item=冰淇淋",{"2":{"59":2}}],["item",{"2":{"56":4,"57":2,"58":3,"59":6}}],["items",{"2":{"18":1}}],["ixlib=rb",{"2":{"144":1}}],["i=i+1",{"2":{"71":1}}],["image2",{"2":{"268":1}}],["image1",{"2":{"268":1}}],["image",{"2":{"101":2,"144":1,"178":3,"215":6,"222":4,"237":5,"258":4,"268":6}}],["images",{"2":{"65":3,"144":1,"175":1,"176":10,"178":3,"185":3,"268":3}}],["import",{"2":{"95":5,"96":1,"101":4,"103":1,"109":3,"110":2,"112":1,"113":1,"190":12,"192":6,"193":1,"203":1,"254":4,"256":3,"257":2,"263":2,"268":7}}],["imgs2",{"2":{"176":5}}],["imgs",{"2":{"176":10}}],["imgtarget",{"2":{"167":4}}],["img",{"2":{"65":8,"167":1,"175":1,"176":13,"181":2,"185":4,"215":9,"237":5,"258":1,"268":7}}],["isloggedin",{"2":{"257":1}}],["isolderthan",{"2":{"257":3}}],["isadult",{"2":{"257":2}}],["issue",{"2":{"210":1}}],["isthereanydeal",{"2":{"205":1}}],["iste",{"2":{"167":8}}],["isc",{"2":{"188":1}}],["isclose",{"2":{"60":2}}],["isintersecting",{"2":{"166":3,"167":2}}],["isemail",{"2":{"111":1}}],["ispalindrome",{"2":{"60":2}}],["is",{"2":{"58":1,"63":2,"222":2}}],["isnan",{"2":{"3":1,"5":1}}],["i++",{"2":{"18":1,"22":1,"23":1,"71":5,"76":5,"147":1,"178":2}}],["i",{"2":{"18":4,"22":6,"23":7,"71":14,"76":19,"147":2,"178":4,"214":2,"256":1,"257":1,"258":1,"263":3,"264":4}}],["inject",{"0":{"249":1},"2":{"249":5}}],["initial",{"2":{"222":3,"258":1}}],["initialize",{"2":{"95":1}}],["initialization",{"2":{"63":1}}],["init",{"2":{"188":1,"208":2,"214":1,"256":1,"257":1,"261":1}}],["inlinesize",{"2":{"165":4}}],["infinite",{"2":{"144":1,"167":6}}],["info",{"2":{"22":6,"96":3,"166":4}}],["informational",{"2":{"9":1}}],["inner",{"2":{"159":6}}],["innerhtml",{"2":{"148":2,"167":1}}],["innerheight",{"2":{"136":2}}],["innerwidth",{"2":{"136":2}}],["innertext",{"2":{"65":2,"88":1,"139":1,"140":1,"144":3,"148":4,"157":1,"164":1,"166":1,"180":1,"242":1}}],["instruction",{"2":{"150":1}}],["instanceof",{"2":{"101":1}}],["install",{"2":{"94":4,"100":3,"106":6,"120":1,"189":1,"198":1,"200":4,"218":1,"225":1,"227":1,"254":5,"271":2}}],["insertafter",{"2":{"178":1,"181":3}}],["insertadjacenthtml",{"2":{"149":6}}],["insertbefore",{"2":{"149":4,"181":3}}],["insert",{"2":{"124":1}}],["insertmany",{"2":{"124":1}}],["insertedids",{"2":{"124":1}}],["insertedid",{"2":{"124":1}}],["insertone",{"2":{"124":1}}],["intersectionrect",{"2":{"166":1}}],["intersectionratio",{"2":{"166":1}}],["intersectionobserver",{"2":{"166":5,"167":2}}],["intersection",{"0":{"166":1},"2":{"166":10}}],["interactive",{"2":{"160":1}}],["int",{"2":{"90":3}}],["includescurry2",{"2":{"50":2}}],["includescurry",{"2":{"50":1}}],["includescurry1",{"2":{"50":1}}],["includes",{"2":{"42":4,"50":4,"97":1,"101":1,"114":2,"116":2,"245":2}}],["in",{"2":{"23":5,"60":1,"62":1,"83":2,"88":1,"95":1,"147":1,"237":2,"245":1,"268":1}}],["indexcurry",{"2":{"50":2}}],["indexof",{"2":{"42":2,"50":2}}],["index",{"2":{"18":4,"23":1,"41":5,"50":3,"71":1,"95":1,"107":1,"109":1,"178":2,"180":6,"188":2,"193":1,"201":2,"217":5,"223":1,"230":1,"237":1,"256":1,"258":1,"262":1}}],["input",{"2":{"3":5,"47":2,"50":1,"65":3,"73":3,"74":3,"141":5,"149":6,"153":1,"154":3,"155":5,"164":1,"165":1,"175":7,"176":2,"181":2,"185":1,"219":3,"226":2,"237":8,"246":1}}],["idx",{"2":{"268":2}}],["idplugin",{"2":{"110":1}}],["identifier",{"2":{"89":1}}],["id=",{"2":{"65":7,"88":1,"139":1,"140":1,"141":3,"144":11,"149":9,"150":2,"157":1,"158":1,"159":2,"164":2,"165":3,"166":3,"167":3,"175":8,"176":5,"178":1,"185":5,"202":1,"216":1,"226":2,"236":1,"244":1}}],["id",{"2":{"5":1,"95":2,"97":2,"111":2,"112":8,"114":3,"115":14,"116":7,"117":17,"125":2,"126":3,"147":5,"180":2,"185":3,"202":1,"203":1,"217":4,"219":7,"220":2,"226":4,"257":2}}],["if=",{"2":{"219":3,"237":2}}],["if",{"2":{"3":4,"4":2,"5":1,"30":2,"31":10,"32":2,"33":1,"34":1,"35":20,"36":3,"37":3,"38":1,"39":3,"61":3,"65":1,"76":4,"95":4,"96":1,"97":1,"101":5,"114":5,"115":2,"116":4,"117":4,"167":2,"176":3,"178":4,"185":2,"242":1,"257":1}}],["拋出錯誤",{"2":{"3":1,"5":1}}],["ts",{"2":{"214":2}}],["tsconfig",{"2":{"214":2}}],["tag",{"2":{"232":1}}],["takerecords",{"2":{"164":1}}],["target2",{"2":{"180":3}}],["target",{"2":{"158":1,"164":2,"165":2,"166":4,"167":4,"180":13,"181":5}}],["target=",{"2":{"65":1}}],["table",{"2":{"144":3}}],["txt",{"2":{"121":2}}],["tld",{"2":{"50":1}}],["tld>",{"2":{"50":2}}],["touch",{"2":{"258":2}}],["touppercase",{"2":{"49":3}}],["to=",{"2":{"256":1}}],["toref",{"2":{"245":1}}],["torefs",{"2":{"245":1}}],["todos",{"2":{"219":2}}],["todatestring",{"2":{"143":1}}],["toggle",{"2":{"148":2}}],["toga",{"2":{"53":1}}],["top",{"2":{"144":4,"159":1,"176":1,"185":2,"231":1}}],["tolocalestring",{"2":{"143":2,"154":2}}],["tolocaltimestring",{"2":{"143":1}}],["tolocaldatestring",{"2":{"143":1}}],["tolowercase",{"2":{"49":3}}],["totimestring",{"2":{"143":1}}],["total",{"2":{"43":3,"176":3}}],["tostring",{"2":{"97":1,"144":3}}],["token=",{"2":{"202":1}}],["tokens",{"2":{"97":1,"98":2}}],["token",{"2":{"92":1,"95":1,"97":3,"98":3,"203":1,"205":1}}],["to",{"2":{"89":1,"144":1,"231":1,"257":2,"261":1}}],["tool",{"2":{"157":1}}],["too",{"2":{"3":2,"88":1}}],["twitter",{"2":{"258":1}}],["tw",{"2":{"22":2,"36":3,"143":1,"148":2,"154":2}}],["two",{"2":{"20":4}}],["template",{"2":{"227":2,"244":3,"250":4,"261":1,"263":1,"266":1}}],["template>",{"2":{"215":4,"216":4,"219":12,"222":2,"227":1,"250":3}}],["testing",{"2":{"261":2}}],["test",{"2":{"125":2,"147":1,"188":1}}],["test2",{"2":{"24":3}}],["test1",{"2":{"24":3}}],["tech",{"2":{"22":2}}],["tel",{"2":{"21":1,"22":1}}],["teachers",{"2":{"18":1}}],["text=",{"2":{"237":1}}],["text3",{"2":{"51":13}}],["text2",{"2":{"50":8}}],["text",{"2":{"14":1,"47":1,"49":13,"57":2,"60":2,"63":7,"144":1,"147":6,"148":8,"150":3,"167":1,"180":1,"181":7,"185":4,"203":4,"222":2,"226":6,"231":3,"237":2,"240":2,"244":1,"245":6}}],["typhoon",{"2":{"47":1}}],["typeof",{"2":{"90":2}}],["typescript",{"2":{"68":1,"214":2,"261":3}}],["type=",{"2":{"65":3,"141":3,"149":6,"154":3,"155":5,"164":1,"165":1,"175":7,"176":2,"185":1,"219":3,"222":1,"226":2,"237":8,"244":1,"246":1,"258":2}}],["typeerror",{"2":{"22":2,"63":1,"89":1}}],["type",{"2":{"10":1,"15":2,"97":2,"111":7,"114":2,"116":2,"126":2,"140":1,"150":1,"164":2,"188":1,"222":1,"229":1,"245":2,"258":2}}],["typicode",{"2":{"5":2,"219":2}}],["tiny",{"2":{"248":1}}],["tip",{"2":{"18":1,"21":1,"27":1,"30":1,"49":1,"55":1,"81":1,"147":3,"148":1,"175":1,"181":1}}],["title=",{"2":{"250":1}}],["title>your",{"2":{"258":1}}],["title>",{"2":{"222":2,"250":1,"258":1}}],["title`",{"2":{"222":1}}],["titletemplate",{"2":{"222":3}}],["titlecolor",{"2":{"148":1}}],["title",{"2":{"5":1,"127":2,"147":2,"148":3,"216":2,"222":15,"226":2,"231":2,"250":2,"258":1}}],["timer",{"2":{"84":2}}],["time=早上",{"2":{"59":2}}],["time",{"2":{"5":4,"56":4,"57":2,"58":3,"59":6,"144":8,"154":2,"166":1}}],["transition",{"2":{"178":1}}],["transform",{"2":{"144":9,"178":4}}],["transparent",{"2":{"144":1}}],["trim",{"2":{"49":3}}],["true",{"2":{"4":2,"24":1,"31":2,"32":2,"36":3,"38":1,"42":10,"50":1,"60":5,"90":2,"97":1,"98":1,"101":1,"109":2,"110":2,"111":5,"114":3,"115":3,"116":6,"117":9,"124":2,"125":2,"127":2,"150":3,"164":6,"175":1,"176":10,"185":1,"200":1,"222":2,"237":2,"240":1,"241":2,"245":1,"264":4}}],["try",{"0":{"1":1},"1":{"2":1,"3":1},"2":{"0":1,"1":1,"2":1,"3":1,"5":2,"98":1,"114":2,"115":3,"116":2,"117":2}}],["threshold",{"2":{"166":2,"167":1}}],["thrownerror",{"2":{"15":2}}],["throw",{"2":{"3":5}}],["third=>operation",{"2":{"96":1}}],["this",{"2":{"27":10,"28":5,"154":3,"176":6,"178":5,"180":3,"181":1,"185":5,"240":5,"242":1,"246":1,"247":2,"249":2,"256":5,"257":3}}],["that",{"2":{"88":1}}],["themeconfig",{"2":{"231":1}}],["theme",{"2":{"230":1,"231":1,"258":2}}],["the",{"2":{"53":1,"229":4}}],["then",{"2":{"4":3,"5":3,"14":2,"15":1,"16":2}}],["流程控制",{"0":{"3":1}}],["cypress",{"2":{"261":1}}],["customevent",{"2":{"240":1,"241":1}}],["custom",{"2":{"216":3}}],["cursor",{"2":{"185":2}}],["curry",{"2":{"50":1}}],["cell",{"2":{"144":1}}],["center",{"2":{"144":5,"147":4,"148":1,"167":1,"178":2}}],["ceil",{"2":{"46":2}}],["cs=srgb",{"2":{"144":1}}],["css",{"0":{"221":1},"2":{"65":2,"144":1,"147":4,"148":2,"154":1,"175":5,"176":1,"177":1,"178":1,"181":7,"185":2,"221":4,"222":7,"266":2}}],["crreate",{"2":{"229":1}}],["crop=entropy",{"2":{"144":1}}],["createpinia",{"2":{"257":2}}],["createwebhashhistory",{"2":{"256":2}}],["createrouter",{"2":{"256":2}}],["created",{"2":{"239":1,"249":1}}],["createapp",{"2":{"236":1,"240":1,"241":1,"244":1,"246":2,"254":1,"256":1,"257":1}}],["createserver",{"2":{"193":1}}],["createtextnode",{"2":{"150":1}}],["createelement",{"2":{"149":3}}],["createindex",{"2":{"125":1}}],["create",{"2":{"114":1,"261":2}}],["createuserorder",{"2":{"112":1,"113":1,"114":1}}],["createuser",{"2":{"112":3,"113":1,"114":1}}],["credentials",{"2":{"109":1}}],["cdnjs",{"2":{"222":2}}],["cdata",{"2":{"150":1}}],["cd",{"2":{"121":1}}],["cdef",{"2":{"51":2}}],["c++",{"2":{"121":1}}],["cmd",{"2":{"120":1}}],["cfg",{"2":{"120":1}}],["chrome",{"2":{"258":2}}],["checkvalue",{"2":{"237":2}}],["checkbox",{"2":{"237":3,"242":1}}],["checkout",{"2":{"208":1,"271":3}}],["ch",{"0":{"194":1,"233":1},"1":{"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1,"234":1,"235":1,"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1}}],["channelaccesstoken",{"2":{"203":1}}],["channelsecret",{"2":{"203":1}}],["channelid",{"2":{"203":1}}],["channel",{"2":{"197":1,"202":2,"203":3}}],["change",{"2":{"153":1}}],["charset=",{"2":{"258":1}}],["charset",{"2":{"222":1}}],["characterdataoldvalue",{"2":{"164":2}}],["characterdata",{"2":{"164":2}}],["char",{"2":{"90":1}}],["charcodeat",{"2":{"53":1}}],["child",{"2":{"167":2}}],["childlist",{"2":{"164":2}}],["childnodes",{"2":{"150":1}}],["children",{"2":{"147":3,"180":3,"222":2,"231":1}}],["ch16",{"2":{"185":3}}],["ch17",{"2":{"178":3}}],["ch15",{"2":{"175":1,"176":10}}],["ch1",{"2":{"65":3}}],["cipher",{"2":{"53":1}}],["city",{"2":{"22":4}}],["ccc",{"2":{"43":2}}],["cn",{"2":{"43":3}}],["cli",{"2":{"225":1,"253":1}}],["click=",{"2":{"219":3,"237":1,"244":1,"246":1}}],["click2",{"2":{"156":1}}],["click1",{"2":{"156":1}}],["click",{"2":{"153":1,"156":4,"159":2,"164":1,"165":1,"175":7,"176":2,"178":1,"182":3,"185":2}}],["clienty",{"2":{"157":1}}],["clientx",{"2":{"157":1}}],["client",{"2":{"9":1,"220":3}}],["clone",{"2":{"208":1}}],["clock",{"2":{"144":25}}],["closest",{"2":{"180":3}}],["close",{"2":{"136":2,"178":13}}],["cloudflare",{"2":{"222":2}}],["cloud",{"2":{"101":1}}],["cloudinarystorage",{"2":{"101":2}}],["cloudinary",{"2":{"99":1,"100":2,"101":10}}],["clearinterval",{"2":{"84":2,"185":1,"239":1}}],["cleartimeout",{"2":{"83":2,"239":1}}],["classroom",{"2":{"211":1}}],["class=",{"2":{"155":5,"165":2,"166":2,"167":2,"178":3,"226":3,"237":1}}],["classlist",{"2":{"148":11}}],["classname",{"2":{"148":3}}],["class名",{"2":{"147":1}}],["class",{"2":{"28":2,"147":3,"148":15,"180":2,"181":6,"226":2,"237":2}}],["capable",{"2":{"231":1}}],["cards",{"2":{"178":4}}],["card",{"2":{"147":1,"178":36,"180":3}}],["cart",{"2":{"111":1}}],["cartschema",{"2":{"111":2}}],["casterror",{"2":{"115":2,"116":2,"117":2}}],["case",{"0":{"36":1},"2":{"36":13}}],["calc",{"2":{"144":5}}],["calculate",{"2":{"60":2}}],["callback",{"2":{"96":1,"101":3,"109":4}}],["caesar",{"2":{"53":1}}],["cannot",{"2":{"22":2,"63":1}}],["catch",{"0":{"1":1},"1":{"2":1,"3":1},"2":{"0":1,"1":1,"2":1,"3":1,"4":3,"5":5,"14":1,"16":1,"98":1,"114":2,"115":3,"116":2,"117":2}}],["c",{"2":{"18":2,"20":6,"24":8,"25":2,"35":1,"89":3,"120":1,"131":1,"132":1,"192":1}}],["coffee",{"2":{"254":1}}],["core",{"2":{"254":2}}],["cors",{"2":{"12":2,"106":1,"109":4}}],["copy",{"2":{"153":1}}],["cover",{"2":{"144":1}}],["collapsable",{"2":{"231":1}}],["collectionname",{"2":{"131":1,"132":1}}],["collection",{"2":{"124":3,"126":2,"127":2,"129":1}}],["col",{"2":{"125":1,"128":2}}],["color=",{"2":{"258":1}}],["color",{"2":{"65":1,"144":1,"148":3,"159":2,"164":1,"167":1,"181":3,"222":2,"231":1,"258":2}}],["cosmos",{"2":{"122":1}}],["cookie",{"2":{"93":1}}],["counter",{"2":{"244":5}}],["count++",{"2":{"73":1,"74":1,"244":1}}],["count",{"2":{"73":2,"74":1,"117":6,"219":2,"244":3,"248":3}}],["codeactionsonsave",{"2":{"200":1}}],["codepen",{"2":{"172":1}}],["code=>inputoutput",{"2":{"71":1,"73":1,"74":1}}],["code",{"2":{"34":1,"71":2,"73":1,"74":1,"101":2,"114":1,"157":1,"173":2,"261":2}}],["coding",{"2":{"34":2,"173":1}}],["connect",{"2":{"110":1}}],["config",{"2":{"101":2,"110":1,"121":3,"202":1,"214":3,"218":1,"221":2,"222":2,"230":1,"231":3,"258":1,"264":2,"265":1,"270":1}}],["confirmbtn",{"2":{"141":2}}],["confirm",{"2":{"33":1,"34":3,"39":3,"141":5}}],["context",{"2":{"241":3}}],["content=",{"2":{"222":2,"258":3}}],["contentboxsize",{"2":{"165":4}}],["contentrect",{"2":{"165":2}}],["content",{"2":{"10":1,"97":2,"114":2,"116":2,"144":2,"165":3,"222":5,"231":3}}],["contain",{"2":{"178":2}}],["contains",{"2":{"148":1}}],["container",{"2":{"144":2,"166":2,"167":7}}],["controllers",{"2":{"107":1,"112":1}}],["controller",{"0":{"113":1},"2":{"97":1,"104":2,"112":1,"113":1}}],["continue",{"0":{"76":1},"2":{"76":9}}],["concatfruits",{"2":{"41":3}}],["concat",{"2":{"41":2}}],["cond",{"2":{"71":2,"73":2,"74":2}}],["cond=>condition",{"2":{"71":1,"73":1,"74":1}}],["cond4",{"2":{"35":1}}],["cond4=>condition",{"2":{"35":1}}],["cond3",{"2":{"35":2}}],["cond3=>condition",{"2":{"35":1}}],["cond2",{"2":{"35":2}}],["cond2=>condition",{"2":{"35":1}}],["cond1",{"2":{"35":2,"37":2}}],["cond1=>condition",{"2":{"35":1,"37":1}}],["consectetur",{"2":{"167":8}}],["constant",{"2":{"89":1}}],["constructor",{"2":{"28":2}}],["const",{"2":{"4":1,"5":6,"18":5,"19":1,"20":8,"23":3,"24":3,"28":2,"33":1,"34":2,"37":1,"38":1,"39":3,"41":7,"42":9,"43":6,"47":1,"49":1,"50":19,"55":2,"57":1,"58":4,"59":5,"60":9,"61":1,"63":2,"65":7,"81":4,"83":2,"87":1,"88":6,"89":4,"90":7,"95":3,"97":2,"98":1,"101":1,"109":1,"110":1,"111":3,"112":1,"113":8,"114":8,"115":6,"116":4,"117":2,"139":1,"140":6,"141":5,"143":5,"144":11,"147":1,"148":3,"149":12,"150":2,"154":1,"155":2,"156":1,"157":1,"158":1,"159":2,"164":4,"165":5,"166":4,"167":5,"175":1,"176":3,"178":3,"185":2,"190":1,"191":3,"192":4,"193":1,"203":1,"215":1,"216":2,"219":11,"222":3,"241":7,"242":1,"245":2,"246":4,"247":1,"248":1,"249":4,"256":3,"257":5,"268":5}}],["console",{"2":{"2":1,"3":2,"4":4,"5":7,"13":2,"14":3,"15":13,"16":3,"18":5,"19":3,"20":12,"22":8,"23":4,"24":11,"31":8,"32":4,"33":4,"34":2,"38":4,"41":16,"42":12,"43":7,"47":1,"49":5,"50":14,"51":6,"56":1,"57":2,"58":1,"60":6,"61":3,"62":3,"63":5,"76":1,"79":1,"80":1,"84":1,"87":1,"89":12,"90":1,"109":2,"114":2,"115":3,"137":1,"141":2,"143":2,"148":6,"150":4,"158":1,"159":3,"160":1,"164":1,"165":1,"166":2,"175":6,"180":2,"181":5,"191":3,"192":6,"193":1,"216":1,"219":2,"222":1,"240":7,"241":7,"242":1,"245":1,"246":2,"248":2,"249":2,"256":2,"257":1}}],["combat",{"2":{"173":1}}],["commit",{"2":{"208":3}}],["comment",{"2":{"150":2}}],["commonjs",{"2":{"68":1,"190":2}}],["computed",{"2":{"240":2,"241":3,"242":1,"247":2}}],["composables",{"2":{"219":2}}],["composition",{"0":{"241":1},"2":{"111":1,"238":3,"242":3,"245":1,"246":1,"247":1,"248":1,"249":2,"250":1,"256":1,"266":1}}],["component2",{"2":{"248":2}}],["component1",{"2":{"248":2}}],["component>>",{"2":{"250":1}}],["component>",{"2":{"246":1,"247":1,"250":1}}],["components",{"2":{"230":1,"262":1,"267":2}}],["component",{"2":{"217":3,"244":2,"245":1,"246":5,"247":1,"248":4,"254":1,"256":2}}],["compass",{"2":{"122":1,"129":1}}],["comparesync",{"2":{"95":1}}],["complete",{"2":{"15":1,"120":1,"160":1}}],["com",{"2":{"5":2,"13":1,"14":1,"15":4,"16":1,"22":2,"50":9,"65":2,"136":2,"137":1,"144":2,"158":1,"181":1,"219":8,"222":4,"226":2}}],["使用相對路徑",{"2":{"268":1}}],["使用元件",{"0":{"267":1}}],["使用箭頭函式",{"2":{"257":1}}],["使用需要安裝",{"2":{"238":1}}],["使用則是要多安裝",{"2":{"227":1}}],["使用縮排代表標籤層級",{"2":{"226":1}}],["使用方式和平常一樣",{"2":{"218":1}}],["使用了伺服器渲染的方式呈現網頁",{"2":{"213":1}}],["使用環境變數",{"2":{"202":1}}],["使用日本節點並監聽",{"2":{"198":1}}],["使用指令",{"2":{"189":1}}],["使用套件",{"2":{"188":1}}],["使用事件的函式",{"2":{"182":1}}],["使用低技術門檻的教材學習",{"2":{"170":1}}],["使用設定觀察指定的元素",{"2":{"164":1,"165":1}}],["使用語法",{"0":{"123":1},"1":{"124":1,"125":1,"126":1,"127":1,"128":1}}],["使用時不需要",{"2":{"241":1}}],["使用時架構如下",{"2":{"236":1}}],["使用時須注意縮排",{"2":{"226":9}}],["使用時須先執行啟動檔後",{"2":{"121":1}}],["使用時需要特別注意",{"2":{"27":1}}],["使用驗證策略編寫自己的驗證方式",{"2":{"95":1}}],["使用已定義好的",{"2":{"83":1}}],["使用已定義的函式",{"2":{"41":1}}],["使用模板語法在文字中插入變數",{"2":{"81":1}}],["使用遞迴函式是在函式中呼叫函式自己來重複執行動作",{"2":{"61":1}}],["使用者能選擇響鈴鈴聲",{"2":{"258":1}}],["使用者能新增",{"2":{"258":1}}],["使用者能用",{"2":{"77":4}}],["使用者點按鈕執行動作",{"2":{"153":1}}],["使用者點滑鼠",{"2":{"152":1}}],["使用者用",{"2":{"151":1}}],["使用者名稱必填",{"2":{"111":1}}],["使用者名稱最大",{"2":{"111":1}}],["使用者名稱最小",{"2":{"111":1}}],["使用者可以輸入西元年",{"2":{"77":1}}],["使用者可以用",{"2":{"60":1}}],["使用者輸入毫秒數",{"2":{"85":1}}],["使用者輸入",{"2":{"73":1}}],["使用者輸入三個數字後",{"2":{"60":1}}],["使用者先輸入英文明文",{"2":{"53":1}}],["使用匿名函式",{"2":{"41":1}}],["使用判斷式製作問答題",{"2":{"39":1}}],["使用短路求值後",{"2":{"38":1}}],["使用短路求值前",{"2":{"38":1}}],["使用範例",{"2":{"38":3}}],["使用三元運算子寫法",{"2":{"36":1}}],["使用三元運算子後",{"2":{"33":2}}],["使用三元運算子前",{"2":{"33":1}}],["使用建立的物件",{"2":{"28":1}}],["使用迴圈取得所有資料",{"2":{"18":1}}],["使用的語法標準",{"2":{"190":1}}],["使用的",{"2":{"12":1,"271":1}}],["使用",{"2":{"5":2,"22":1,"28":1,"35":1,"36":2,"55":3,"59":1,"81":2,"83":1,"84":1,"90":1,"92":1,"95":1,"104":1,"111":2,"114":1,"115":2,"147":2,"148":5,"164":1,"165":1,"166":1,"171":1,"174":1,"180":2,"182":1,"193":1,"194":1,"198":2,"200":1,"201":1,"202":1,"203":1,"207":2,"214":4,"215":1,"216":1,"218":1,"219":1,"225":2,"228":1,"229":1,"231":1,"237":2,"245":1,"251":1,"256":3,"257":1,"258":3,"259":1,"261":2,"263":3,"266":1,"268":1,"271":1}}],["使用不存在的函式",{"2":{"2":1}}],["使用一個不存在的函式",{"2":{"2":1}}],["=$",{"2":{"76":1}}],["===",{"2":{"24":1,"31":5,"32":2,"36":11,"37":1,"38":2,"61":3,"76":4,"101":2,"114":4,"115":2,"116":2,"117":4,"150":3,"178":3}}],["==",{"2":{"3":1,"31":5,"73":1,"74":1,"98":1,"176":1,"185":1,"237":3}}],["=>",{"2":{"2":1,"3":1,"4":7,"5":8,"13":2,"14":4,"16":3,"27":1,"41":3,"42":7,"43":5,"47":2,"51":6,"58":6,"59":5,"60":4,"61":14,"65":4,"83":6,"84":2,"95":4,"96":3,"97":1,"98":2,"101":2,"109":1,"113":7,"114":2,"115":3,"116":2,"117":2,"141":3,"144":1,"149":6,"154":1,"155":2,"156":2,"157":1,"158":1,"159":2,"160":1,"164":2,"165":2,"166":1,"167":2,"185":4,"191":1,"193":2,"203":1,"219":9,"220":1,"222":1,"241":13,"246":2,"248":4,"249":1,"256":1,"257":4,"268":1}}],["=",{"2":{"2":1,"3":2,"4":3,"5":13,"13":3,"18":7,"19":3,"20":10,"21":2,"22":4,"23":5,"24":15,"25":3,"27":1,"28":4,"31":12,"32":3,"33":2,"34":3,"35":4,"36":2,"37":2,"38":6,"39":5,"41":15,"42":11,"43":7,"46":1,"47":3,"49":6,"50":17,"51":3,"55":1,"56":2,"57":3,"58":10,"59":9,"60":13,"61":41,"62":5,"63":3,"65":16,"71":6,"73":3,"74":3,"76":10,"79":32,"80":16,"81":5,"83":4,"84":1,"87":2,"88":7,"89":15,"90":7,"95":3,"96":1,"97":2,"98":2,"101":5,"109":1,"110":1,"111":4,"112":1,"113":9,"114":8,"115":6,"116":4,"117":2,"137":1,"139":2,"140":7,"141":8,"143":5,"144":17,"147":5,"148":10,"149":19,"150":2,"154":3,"155":3,"156":2,"157":3,"158":2,"159":2,"160":1,"164":3,"165":8,"166":6,"167":6,"175":2,"176":4,"178":5,"185":10,"191":4,"192":5,"193":1,"203":2,"215":1,"216":2,"219":11,"222":3,"231":1,"241":7,"242":2,"244":1,"245":2,"246":4,"247":1,"248":2,"249":4,"256":3,"257":8,"264":4,"268":8}}],["j1",{"2":{"240":1,"241":1}}],["jwtpayload",{"2":{"95":3}}],["jwtfromrequest",{"2":{"95":1}}],["jwtstrategy",{"2":{"95":2}}],["jwt",{"0":{"93":1},"2":{"92":1,"93":8,"94":1,"95":7,"97":2,"98":1}}],["j++",{"2":{"76":3}}],["jobs",{"2":{"271":1}}],["job",{"2":{"240":1,"241":3}}],["john",{"2":{"58":2}}],["join",{"2":{"41":3,"167":1}}],["jkl",{"2":{"49":7}}],["jpg",{"2":{"144":1,"175":1,"176":10,"178":3,"181":1,"268":5}}],["jp",{"2":{"36":4,"198":1}}],["jamesives",{"2":{"271":1}}],["ja",{"2":{"36":3}}],["javascript",{"0":{"0":1,"64":1},"1":{"1":1,"2":1,"3":1,"4":1,"5":1,"65":1,"66":1,"67":1,"68":1,"69":1},"2":{"12":2,"13":1,"15":1,"33":1,"49":1,"64":1,"68":1,"69":2,"81":1,"88":3,"89":1,"143":1,"154":1,"155":1,"157":1,"190":1,"222":1}}],["j",{"2":{"18":1,"76":8}}],["jquery",{"0":{"15":1,"174":1,"179":1},"1":{"175":1,"176":1,"180":1,"181":1,"182":1,"183":1},"2":{"15":1,"88":1,"174":1,"175":4,"177":1,"180":1,"181":1,"184":1,"222":4,"236":1}}],["jsx",{"2":{"261":2}}],["jsjsimport",{"2":{"257":1}}],["jsvue",{"2":{"240":1}}],["jsvar",{"2":{"62":1,"89":1}}],["jsmodule",{"2":{"231":1,"264":2}}],["jsmath",{"2":{"46":1}}],["jswindow",{"2":{"155":1}}],["js>",{"2":{"129":1,"131":1,"132":1}}],["jsnpm",{"2":{"100":1}}],["jsexport",{"2":{"97":1,"98":1,"114":1,"115":3,"116":2,"117":2,"222":1,"270":1}}],["jsimport",{"2":{"95":3,"96":1,"101":1,"109":1,"112":1,"190":2,"191":1,"204":1,"220":1,"265":1}}],["jsif",{"2":{"30":4,"36":1}}],["jsa",{"2":{"89":1}}],["jsaxios",{"2":{"16":1}}],["jssettimeout",{"2":{"83":1}}],["jsswitch",{"2":{"36":1}}],["jshi",{"2":{"63":1}}],["jsconsole",{"2":{"63":1,"180":1}}],["jsconst",{"2":{"2":1,"3":1,"4":2,"5":3,"18":1,"19":2,"20":2,"21":2,"22":3,"23":4,"24":4,"25":3,"27":1,"31":3,"32":2,"33":1,"34":1,"35":1,"36":2,"38":3,"41":4,"42":2,"43":1,"46":1,"47":2,"49":1,"50":1,"51":1,"58":2,"60":4,"61":2,"81":1,"83":3,"84":1,"87":1,"111":1,"147":2,"148":2,"149":1,"156":1,"191":1,"192":1,"242":1,"244":1,"248":1}}],["jsdocument",{"2":{"147":1,"160":1}}],["jsdoc",{"0":{"59":1},"2":{"59":1}}],["jsfiddle",{"2":{"172":1}}],["jsfor",{"2":{"71":3,"76":1}}],["jsfunction",{"2":{"56":2,"57":1}}],["jsfetch",{"2":{"14":1}}],["jsperson",{"2":{"27":1}}],["js",{"0":{"95":1,"186":1,"212":1,"233":1,"238":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1,"193":1,"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"234":1,"235":1,"236":1,"237":1,"238":1,"239":2,"240":2,"241":2,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1},"2":{"18":1,"28":1,"32":1,"38":1,"43":1,"55":1,"58":2,"59":1,"61":1,"63":3,"66":2,"68":1,"69":1,"76":1,"77":1,"83":1,"88":1,"89":2,"90":1,"95":4,"96":3,"102":1,"106":1,"107":5,"109":3,"110":2,"111":1,"112":2,"113":3,"114":1,"124":1,"125":1,"127":1,"128":1,"136":1,"137":1,"138":1,"143":3,"147":2,"148":1,"180":2,"181":1,"182":1,"186":1,"188":3,"190":2,"191":3,"192":6,"193":4,"194":1,"200":1,"201":3,"202":2,"203":1,"212":1,"213":2,"214":1,"218":1,"220":5,"221":4,"222":5,"230":3,"231":1,"233":1,"235":1,"236":1,"238":1,"240":2,"241":1,"244":1,"246":1,"249":2,"254":1,"256":3,"257":1,"258":2,"259":1,"261":1,"262":1,"263":2,"264":2,"265":1,"270":1}}],["js$",{"2":{"15":1,"181":1}}],["jsonjs",{"2":{"117":6}}],["jsonwebtoken",{"2":{"94":1}}],["json",{"0":{"188":1},"2":{"13":1,"14":5,"15":7,"16":1,"92":1,"97":1,"107":1,"109":1,"114":4,"116":4,"117":4,"131":1,"132":1,"188":3,"189":1,"193":1,"201":2,"204":2,"214":2,"219":4,"230":1,"237":2,"258":1}}],["jsonplaceholder",{"2":{"5":2,"219":2}}],["jslet",{"2":{"13":1,"24":1,"39":1,"49":1,"73":1,"79":1,"80":1,"89":1,"147":1}}],["audio",{"2":{"268":12}}],["auto",{"2":{"144":4,"185":1}}],["author",{"2":{"188":1,"232":1}}],["auth",{"2":{"96":4}}],["authenticate",{"2":{"95":1,"96":1}}],["authenticate的info",{"2":{"95":1}}],["awesome",{"0":{"254":1},"2":{"222":2,"251":1,"254":2}}],["await",{"0":{"5":1},"2":{"0":1,"5":14,"95":1,"97":1,"98":1,"114":2,"115":3,"116":2,"117":2,"219":3,"242":1}}],["a牌顯示卡",{"2":{"190":2}}],["a牌cpu",{"2":{"190":2}}],["attr",{"2":{"178":3,"181":5,"185":3}}],["attributefilter",{"2":{"164":2}}],["attributeoldvalue",{"2":{"164":2}}],["attributes",{"2":{"164":2}}],["attributename",{"2":{"164":2}}],["attribute",{"2":{"150":1}}],["ai",{"2":{"170":1,"207":1}}],["amet",{"2":{"167":8}}],["amp",{"2":{"32":4,"38":4}}],["aqua",{"2":{"149":1}}],["and",{"2":{"261":1,"271":1}}],["android",{"2":{"258":2}}],["ant",{"2":{"253":1}}],["animate",{"2":{"175":6,"176":12,"185":1}}],["animation",{"2":{"144":1}}],["ans3",{"2":{"39":2}}],["ans2",{"2":{"39":2}}],["ans1",{"2":{"39":2}}],["availheight",{"2":{"140":4}}],["availwidth",{"2":{"140":4}}],["advanced",{"2":{"205":1}}],["adipisicing",{"2":{"167":8}}],["addnum",{"2":{"191":2}}],["addclass",{"2":{"178":2,"181":5}}],["addednodes",{"2":{"164":2}}],["addeventlistener",{"2":{"156":3,"159":2,"164":1,"165":1}}],["add",{"2":{"148":3,"191":3,"237":2,"254":1,"258":1,"261":8}}],["address",{"2":{"22":4}}],["admin",{"2":{"125":4}}],["actions",{"0":{"271":1},"2":{"257":1,"258":1,"271":3}}],["action",{"2":{"158":1,"257":2,"271":2}}],["ac3",{"2":{"126":1}}],["acknowledged",{"2":{"124":2}}],["access",{"2":{"63":1,"202":1,"203":1}}],["account",{"2":{"50":1,"115":2,"116":2,"125":4,"226":2}}],["account>",{"2":{"50":2}}],["azure",{"2":{"122":1}}],["aggregate",{"2":{"129":1}}],["aggregation",{"0":{"129":1},"2":{"111":1}}],["age++",{"2":{"257":1}}],["age",{"2":{"19":3,"21":2,"23":1,"35":11,"36":10,"58":2,"111":1,"114":4,"115":4,"240":1,"241":3,"257":7}}],["agent",{"2":{"10":1}}],["aa",{"2":{"192":2}}],["aa`",{"2":{"90":1}}],["aaaa",{"2":{"50":8}}],["aaa",{"2":{"22":4,"43":2,"50":1,"63":1,"124":3,"222":1,"226":1}}],["asset",{"2":{"258":2}}],["assets",{"2":{"215":6,"221":2,"262":1,"268":11}}],["assumenda",{"2":{"167":8}}],["assignment",{"2":{"89":1}}],["as",{"2":{"95":1,"101":1,"120":2,"192":4}}],["asyncfunc",{"2":{"5":2}}],["async",{"0":{"5":1},"2":{"0":1,"5":6,"69":1,"95":1,"97":1,"98":1,"101":2,"114":2,"115":3,"116":2,"117":2,"219":2}}],["a=b",{"2":{"79":1}}],["a==b",{"2":{"32":1}}],["a++",{"2":{"79":1}}],["arguments",{"2":{"56":2,"58":3}}],["arr2",{"2":{"42":2}}],["arr",{"2":{"42":2,"46":3}}],["array",{"2":{"20":6,"21":1,"41":7,"42":1,"60":1,"90":1,"167":1}}],["afterend",{"2":{"149":4}}],["afterbegin",{"2":{"149":4}}],["after",{"2":{"53":1,"148":1}}],["about",{"2":{"222":1,"256":6}}],["abba",{"2":{"60":1}}],["absolute",{"2":{"144":4,"159":1,"176":1,"178":2,"185":1}}],["abs",{"2":{"46":2}}],["abc123",{"2":{"226":2}}],["abcba",{"2":{"60":1}}],["abcd",{"2":{"60":1,"126":2,"127":1,"246":6,"249":3}}],["abcdefg",{"2":{"51":1,"250":2}}],["abc",{"2":{"5":1,"38":3,"49":7,"63":2,"128":2}}],["a>=b",{"2":{"32":1}}],["a>b",{"2":{"32":1}}],["a>",{"2":{"22":1,"65":1,"158":1,"181":1,"226":1}}],["append",{"2":{"178":1,"181":3,"185":1}}],["appendchild",{"2":{"149":3}}],["application",{"2":{"97":1,"114":2,"116":2,"117":3,"261":1}}],["apple",{"2":{"20":2,"192":5,"231":2,"258":2}}],["app",{"2":{"95":1,"109":5,"214":1,"222":1,"231":2,"236":2,"240":1,"241":1,"244":4,"246":4,"248":4,"258":10,"271":1}}],["api",{"0":{"14":1,"91":1,"103":1,"108":1,"240":1,"241":1},"1":{"92":1,"93":1,"94":1,"95":1,"96":1,"97":1,"98":1,"99":1,"100":1,"101":1,"102":1,"104":1,"105":1,"106":1,"107":1,"108":1,"109":2,"110":2,"111":2,"112":2,"113":2,"114":2,"115":2,"116":2,"117":2},"2":{"8":1,"12":1,"16":1,"21":2,"101":2,"103":1,"104":1,"109":1,"117":1,"197":1,"213":2,"219":2,"238":4,"242":4,"245":2,"246":2,"247":2,"248":2,"249":4,"250":1,"256":2,"266":1}}],["axios",{"0":{"16":1},"2":{"16":1,"200":2}}],["alias",{"2":{"265":1}}],["align",{"2":{"144":4,"167":1}}],["alternate",{"2":{"258":1}}],["alt=",{"2":{"175":1,"176":10,"215":3}}],["already",{"2":{"89":1}}],["alertbtn",{"2":{"141":2}}],["alert",{"2":{"39":4,"57":1,"69":2,"83":4,"141":5,"154":1,"155":2,"156":2,"162":1,"178":1,"182":1,"185":1}}],["alertt",{"2":{"2":1}}],["alphabets",{"2":{"18":8}}],["always",{"2":{"15":1}}],["ajaxoptions",{"2":{"15":1}}],["ajax",{"0":{"6":1,"12":1,"15":1},"1":{"7":1,"8":1,"9":1,"10":1,"11":1,"12":1,"13":2,"14":2,"15":2,"16":2},"2":{"5":1,"6":1,"12":3,"13":1,"15":3,"16":2,"222":2}}],["a",{"2":{"3":1,"18":2,"20":7,"22":1,"24":17,"25":2,"31":33,"32":8,"35":1,"42":2,"43":12,"47":1,"53":2,"61":7,"62":4,"63":1,"65":3,"79":17,"83":2,"89":13,"90":1,"120":2,"158":2,"164":1,"180":1,"181":1,"192":9,"226":2,"258":1,"261":2}}],["和登入一樣在需要上傳檔案的路由引用",{"2":{"101":1}}],["和單雙引號造成閱讀困難",{"2":{"81":1}}],["和自身整除",{"2":{"47":1}}],["和中文",{"2":{"30":1}}],["和",{"2":{"0":1,"8":1,"36":1,"47":2,"55":1,"58":1,"60":2,"63":2,"68":1,"70":1,"79":4,"88":3,"90":2,"96":1,"103":1,"117":1,"121":1,"126":1,"147":1,"148":1,"162":1,"175":2,"188":1,"190":1,"219":4,"220":1,"226":2,"237":2,"241":1,"256":2,"264":1,"268":1}}]],"serializationVersion":2}';export{t as default}; diff --git a/assets/chunks/VPLocalSearchBox.B-xkvMVn.js b/assets/chunks/VPLocalSearchBox.B-xkvMVn.js new file mode 100644 index 00000000..66ef2100 --- /dev/null +++ b/assets/chunks/VPLocalSearchBox.B-xkvMVn.js @@ -0,0 +1,7 @@ +var It=Object.defineProperty;var Dt=(o,e,t)=>e in o?It(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t;var Oe=(o,e,t)=>(Dt(o,typeof e!="symbol"?e+"":e,t),t);import{Y as yt,h as oe,y as $e,ay as kt,az as Ot,d as _t,H as xe,aA as tt,k as Fe,aB as Rt,aC as Mt,z as Lt,aD as zt,l as _e,U as de,S as Ee,aE as Pt,aF as Bt,Z as Vt,j as $t,aG as Wt,o as ee,b as Kt,m as k,a2 as Jt,p as j,aH as Ut,aI as jt,aJ as Gt,c as re,n as rt,e as Se,G as at,F as nt,a as ve,t as pe,aK as Ht,q as qt,s as Qt,aL as it,aM as Yt,an as Zt,at as Xt,aN as er,_ as tr}from"./framework.DWhUQBuX.js";import{u as rr,a as ar}from"./theme.MrCfoCxG.js";const nr={root:()=>yt(()=>import("./@localSearchIndexroot.J6Gtuf3s.js"),[])};/*! +* tabbable 6.2.0 +* @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE +*/var mt=["input:not([inert])","select:not([inert])","textarea:not([inert])","a[href]:not([inert])","button:not([inert])","[tabindex]:not(slot):not([inert])","audio[controls]:not([inert])","video[controls]:not([inert])",'[contenteditable]:not([contenteditable="false"]):not([inert])',"details>summary:first-of-type:not([inert])","details:not([inert])"],Ne=mt.join(","),gt=typeof Element>"u",ue=gt?function(){}:Element.prototype.matches||Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector,Ce=!gt&&Element.prototype.getRootNode?function(o){var e;return o==null||(e=o.getRootNode)===null||e===void 0?void 0:e.call(o)}:function(o){return o==null?void 0:o.ownerDocument},Ie=function o(e,t){var r;t===void 0&&(t=!0);var n=e==null||(r=e.getAttribute)===null||r===void 0?void 0:r.call(e,"inert"),a=n===""||n==="true",i=a||t&&e&&o(e.parentNode);return i},ir=function(e){var t,r=e==null||(t=e.getAttribute)===null||t===void 0?void 0:t.call(e,"contenteditable");return r===""||r==="true"},bt=function(e,t,r){if(Ie(e))return[];var n=Array.prototype.slice.apply(e.querySelectorAll(Ne));return t&&ue.call(e,Ne)&&n.unshift(e),n=n.filter(r),n},wt=function o(e,t,r){for(var n=[],a=Array.from(e);a.length;){var i=a.shift();if(!Ie(i,!1))if(i.tagName==="SLOT"){var s=i.assignedElements(),u=s.length?s:i.children,l=o(u,!0,r);r.flatten?n.push.apply(n,l):n.push({scopeParent:i,candidates:l})}else{var h=ue.call(i,Ne);h&&r.filter(i)&&(t||!e.includes(i))&&n.push(i);var d=i.shadowRoot||typeof r.getShadowRoot=="function"&&r.getShadowRoot(i),v=!Ie(d,!1)&&(!r.shadowRootFilter||r.shadowRootFilter(i));if(d&&v){var y=o(d===!0?i.children:d.children,!0,r);r.flatten?n.push.apply(n,y):n.push({scopeParent:i,candidates:y})}else a.unshift.apply(a,i.children)}}return n},xt=function(e){return!isNaN(parseInt(e.getAttribute("tabindex"),10))},se=function(e){if(!e)throw new Error("No node provided");return e.tabIndex<0&&(/^(AUDIO|VIDEO|DETAILS)$/.test(e.tagName)||ir(e))&&!xt(e)?0:e.tabIndex},or=function(e,t){var r=se(e);return r<0&&t&&!xt(e)?0:r},sr=function(e,t){return e.tabIndex===t.tabIndex?e.documentOrder-t.documentOrder:e.tabIndex-t.tabIndex},Ft=function(e){return e.tagName==="INPUT"},ur=function(e){return Ft(e)&&e.type==="hidden"},lr=function(e){var t=e.tagName==="DETAILS"&&Array.prototype.slice.apply(e.children).some(function(r){return r.tagName==="SUMMARY"});return t},cr=function(e,t){for(var r=0;rsummary:first-of-type"),i=a?e.parentElement:e;if(ue.call(i,"details:not([open]) *"))return!0;if(!r||r==="full"||r==="legacy-full"){if(typeof n=="function"){for(var s=e;e;){var u=e.parentElement,l=Ce(e);if(u&&!u.shadowRoot&&n(u)===!0)return ot(e);e.assignedSlot?e=e.assignedSlot:!u&&l!==e.ownerDocument?e=l.host:e=u}e=s}if(vr(e))return!e.getClientRects().length;if(r!=="legacy-full")return!0}else if(r==="non-zero-area")return ot(e);return!1},yr=function(e){if(/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(e.tagName))for(var t=e.parentElement;t;){if(t.tagName==="FIELDSET"&&t.disabled){for(var r=0;r=0)},gr=function o(e){var t=[],r=[];return e.forEach(function(n,a){var i=!!n.scopeParent,s=i?n.scopeParent:n,u=or(s,i),l=i?o(n.candidates):s;u===0?i?t.push.apply(t,l):t.push(s):r.push({documentOrder:a,tabIndex:u,item:n,isScope:i,content:l})}),r.sort(sr).reduce(function(n,a){return a.isScope?n.push.apply(n,a.content):n.push(a.content),n},[]).concat(t)},br=function(e,t){t=t||{};var r;return t.getShadowRoot?r=wt([e],t.includeContainer,{filter:We.bind(null,t),flatten:!1,getShadowRoot:t.getShadowRoot,shadowRootFilter:mr}):r=bt(e,t.includeContainer,We.bind(null,t)),gr(r)},wr=function(e,t){t=t||{};var r;return t.getShadowRoot?r=wt([e],t.includeContainer,{filter:De.bind(null,t),flatten:!0,getShadowRoot:t.getShadowRoot}):r=bt(e,t.includeContainer,De.bind(null,t)),r},le=function(e,t){if(t=t||{},!e)throw new Error("No node provided");return ue.call(e,Ne)===!1?!1:We(t,e)},xr=mt.concat("iframe").join(","),Re=function(e,t){if(t=t||{},!e)throw new Error("No node provided");return ue.call(e,xr)===!1?!1:De(t,e)};/*! +* focus-trap 7.5.4 +* @license MIT, https://github.com/focus-trap/focus-trap/blob/master/LICENSE +*/function st(o,e){var t=Object.keys(o);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(o);e&&(r=r.filter(function(n){return Object.getOwnPropertyDescriptor(o,n).enumerable})),t.push.apply(t,r)}return t}function ut(o){for(var e=1;e0){var r=e[e.length-1];r!==t&&r.pause()}var n=e.indexOf(t);n===-1||e.splice(n,1),e.push(t)},deactivateTrap:function(e,t){var r=e.indexOf(t);r!==-1&&e.splice(r,1),e.length>0&&e[e.length-1].unpause()}},Ar=function(e){return e.tagName&&e.tagName.toLowerCase()==="input"&&typeof e.select=="function"},Tr=function(e){return(e==null?void 0:e.key)==="Escape"||(e==null?void 0:e.key)==="Esc"||(e==null?void 0:e.keyCode)===27},ge=function(e){return(e==null?void 0:e.key)==="Tab"||(e==null?void 0:e.keyCode)===9},Nr=function(e){return ge(e)&&!e.shiftKey},Cr=function(e){return ge(e)&&e.shiftKey},ct=function(e){return setTimeout(e,0)},ft=function(e,t){var r=-1;return e.every(function(n,a){return t(n)?(r=a,!1):!0}),r},ye=function(e){for(var t=arguments.length,r=new Array(t>1?t-1:0),n=1;n1?p-1:0),I=1;I=0)c=r.activeElement;else{var f=i.tabbableGroups[0],p=f&&f.firstTabbableNode;c=p||h("fallbackFocus")}if(!c)throw new Error("Your focus-trap needs to have at least one focusable element");return c},v=function(){if(i.containerGroups=i.containers.map(function(c){var f=br(c,a.tabbableOptions),p=wr(c,a.tabbableOptions),C=f.length>0?f[0]:void 0,I=f.length>0?f[f.length-1]:void 0,M=p.find(function(m){return le(m)}),z=p.slice().reverse().find(function(m){return le(m)}),P=!!f.find(function(m){return se(m)>0});return{container:c,tabbableNodes:f,focusableNodes:p,posTabIndexesFound:P,firstTabbableNode:C,lastTabbableNode:I,firstDomTabbableNode:M,lastDomTabbableNode:z,nextTabbableNode:function(x){var $=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!0,K=f.indexOf(x);return K<0?$?p.slice(p.indexOf(x)+1).find(function(H){return le(H)}):p.slice(0,p.indexOf(x)).reverse().find(function(H){return le(H)}):f[K+($?1:-1)]}}}),i.tabbableGroups=i.containerGroups.filter(function(c){return c.tabbableNodes.length>0}),i.tabbableGroups.length<=0&&!h("fallbackFocus"))throw new Error("Your focus-trap must have at least one container with at least one tabbable node in it at all times");if(i.containerGroups.find(function(c){return c.posTabIndexesFound})&&i.containerGroups.length>1)throw new Error("At least one node with a positive tabindex was found in one of your focus-trap's multiple containers. Positive tabindexes are only supported in single-container focus-traps.")},y=function w(c){var f=c.activeElement;if(f)return f.shadowRoot&&f.shadowRoot.activeElement!==null?w(f.shadowRoot):f},b=function w(c){if(c!==!1&&c!==y(document)){if(!c||!c.focus){w(d());return}c.focus({preventScroll:!!a.preventScroll}),i.mostRecentlyFocusedNode=c,Ar(c)&&c.select()}},E=function(c){var f=h("setReturnFocus",c);return f||(f===!1?!1:c)},g=function(c){var f=c.target,p=c.event,C=c.isBackward,I=C===void 0?!1:C;f=f||Ae(p),v();var M=null;if(i.tabbableGroups.length>0){var z=l(f,p),P=z>=0?i.containerGroups[z]:void 0;if(z<0)I?M=i.tabbableGroups[i.tabbableGroups.length-1].lastTabbableNode:M=i.tabbableGroups[0].firstTabbableNode;else if(I){var m=ft(i.tabbableGroups,function(B){var U=B.firstTabbableNode;return f===U});if(m<0&&(P.container===f||Re(f,a.tabbableOptions)&&!le(f,a.tabbableOptions)&&!P.nextTabbableNode(f,!1))&&(m=z),m>=0){var x=m===0?i.tabbableGroups.length-1:m-1,$=i.tabbableGroups[x];M=se(f)>=0?$.lastTabbableNode:$.lastDomTabbableNode}else ge(p)||(M=P.nextTabbableNode(f,!1))}else{var K=ft(i.tabbableGroups,function(B){var U=B.lastTabbableNode;return f===U});if(K<0&&(P.container===f||Re(f,a.tabbableOptions)&&!le(f,a.tabbableOptions)&&!P.nextTabbableNode(f))&&(K=z),K>=0){var H=K===i.tabbableGroups.length-1?0:K+1,q=i.tabbableGroups[H];M=se(f)>=0?q.firstTabbableNode:q.firstDomTabbableNode}else ge(p)||(M=P.nextTabbableNode(f))}}else M=h("fallbackFocus");return M},S=function(c){var f=Ae(c);if(!(l(f,c)>=0)){if(ye(a.clickOutsideDeactivates,c)){s.deactivate({returnFocus:a.returnFocusOnDeactivate});return}ye(a.allowOutsideClick,c)||c.preventDefault()}},T=function(c){var f=Ae(c),p=l(f,c)>=0;if(p||f instanceof Document)p&&(i.mostRecentlyFocusedNode=f);else{c.stopImmediatePropagation();var C,I=!0;if(i.mostRecentlyFocusedNode)if(se(i.mostRecentlyFocusedNode)>0){var M=l(i.mostRecentlyFocusedNode),z=i.containerGroups[M].tabbableNodes;if(z.length>0){var P=z.findIndex(function(m){return m===i.mostRecentlyFocusedNode});P>=0&&(a.isKeyForward(i.recentNavEvent)?P+1=0&&(C=z[P-1],I=!1))}}else i.containerGroups.some(function(m){return m.tabbableNodes.some(function(x){return se(x)>0})})||(I=!1);else I=!1;I&&(C=g({target:i.mostRecentlyFocusedNode,isBackward:a.isKeyBackward(i.recentNavEvent)})),b(C||i.mostRecentlyFocusedNode||d())}i.recentNavEvent=void 0},F=function(c){var f=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;i.recentNavEvent=c;var p=g({event:c,isBackward:f});p&&(ge(c)&&c.preventDefault(),b(p))},L=function(c){if(Tr(c)&&ye(a.escapeDeactivates,c)!==!1){c.preventDefault(),s.deactivate();return}(a.isKeyForward(c)||a.isKeyBackward(c))&&F(c,a.isKeyBackward(c))},R=function(c){var f=Ae(c);l(f,c)>=0||ye(a.clickOutsideDeactivates,c)||ye(a.allowOutsideClick,c)||(c.preventDefault(),c.stopImmediatePropagation())},V=function(){if(i.active)return lt.activateTrap(n,s),i.delayInitialFocusTimer=a.delayInitialFocus?ct(function(){b(d())}):b(d()),r.addEventListener("focusin",T,!0),r.addEventListener("mousedown",S,{capture:!0,passive:!1}),r.addEventListener("touchstart",S,{capture:!0,passive:!1}),r.addEventListener("click",R,{capture:!0,passive:!1}),r.addEventListener("keydown",L,{capture:!0,passive:!1}),s},N=function(){if(i.active)return r.removeEventListener("focusin",T,!0),r.removeEventListener("mousedown",S,!0),r.removeEventListener("touchstart",S,!0),r.removeEventListener("click",R,!0),r.removeEventListener("keydown",L,!0),s},_=function(c){var f=c.some(function(p){var C=Array.from(p.removedNodes);return C.some(function(I){return I===i.mostRecentlyFocusedNode})});f&&b(d())},A=typeof window<"u"&&"MutationObserver"in window?new MutationObserver(_):void 0,O=function(){A&&(A.disconnect(),i.active&&!i.paused&&i.containers.map(function(c){A.observe(c,{subtree:!0,childList:!0})}))};return s={get active(){return i.active},get paused(){return i.paused},activate:function(c){if(i.active)return this;var f=u(c,"onActivate"),p=u(c,"onPostActivate"),C=u(c,"checkCanFocusTrap");C||v(),i.active=!0,i.paused=!1,i.nodeFocusedBeforeActivation=r.activeElement,f==null||f();var I=function(){C&&v(),V(),O(),p==null||p()};return C?(C(i.containers.concat()).then(I,I),this):(I(),this)},deactivate:function(c){if(!i.active)return this;var f=ut({onDeactivate:a.onDeactivate,onPostDeactivate:a.onPostDeactivate,checkCanReturnFocus:a.checkCanReturnFocus},c);clearTimeout(i.delayInitialFocusTimer),i.delayInitialFocusTimer=void 0,N(),i.active=!1,i.paused=!1,O(),lt.deactivateTrap(n,s);var p=u(f,"onDeactivate"),C=u(f,"onPostDeactivate"),I=u(f,"checkCanReturnFocus"),M=u(f,"returnFocus","returnFocusOnDeactivate");p==null||p();var z=function(){ct(function(){M&&b(E(i.nodeFocusedBeforeActivation)),C==null||C()})};return M&&I?(I(E(i.nodeFocusedBeforeActivation)).then(z,z),this):(z(),this)},pause:function(c){if(i.paused||!i.active)return this;var f=u(c,"onPause"),p=u(c,"onPostPause");return i.paused=!0,f==null||f(),N(),O(),p==null||p(),this},unpause:function(c){if(!i.paused||!i.active)return this;var f=u(c,"onUnpause"),p=u(c,"onPostUnpause");return i.paused=!1,f==null||f(),v(),V(),O(),p==null||p(),this},updateContainerElements:function(c){var f=[].concat(c).filter(Boolean);return i.containers=f.map(function(p){return typeof p=="string"?r.querySelector(p):p}),i.active&&v(),O(),this}},s.updateContainerElements(e),s};function kr(o,e={}){let t;const{immediate:r,...n}=e,a=oe(!1),i=oe(!1),s=d=>t&&t.activate(d),u=d=>t&&t.deactivate(d),l=()=>{t&&(t.pause(),i.value=!0)},h=()=>{t&&(t.unpause(),i.value=!1)};return $e(()=>kt(o),d=>{d&&(t=Dr(d,{...n,onActivate(){a.value=!0,e.onActivate&&e.onActivate()},onDeactivate(){a.value=!1,e.onDeactivate&&e.onDeactivate()}}),r&&s())},{flush:"post"}),Ot(()=>u()),{hasFocus:a,isPaused:i,activate:s,deactivate:u,pause:l,unpause:h}}class fe{constructor(e,t=!0,r=[],n=5e3){this.ctx=e,this.iframes=t,this.exclude=r,this.iframesTimeout=n}static matches(e,t){const r=typeof t=="string"?[t]:t,n=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector;if(n){let a=!1;return r.every(i=>n.call(e,i)?(a=!0,!1):!0),a}else return!1}getContexts(){let e,t=[];return typeof this.ctx>"u"||!this.ctx?e=[]:NodeList.prototype.isPrototypeOf(this.ctx)?e=Array.prototype.slice.call(this.ctx):Array.isArray(this.ctx)?e=this.ctx:typeof this.ctx=="string"?e=Array.prototype.slice.call(document.querySelectorAll(this.ctx)):e=[this.ctx],e.forEach(r=>{const n=t.filter(a=>a.contains(r)).length>0;t.indexOf(r)===-1&&!n&&t.push(r)}),t}getIframeContents(e,t,r=()=>{}){let n;try{const a=e.contentWindow;if(n=a.document,!a||!n)throw new Error("iframe inaccessible")}catch{r()}n&&t(n)}isIframeBlank(e){const t="about:blank",r=e.getAttribute("src").trim();return e.contentWindow.location.href===t&&r!==t&&r}observeIframeLoad(e,t,r){let n=!1,a=null;const i=()=>{if(!n){n=!0,clearTimeout(a);try{this.isIframeBlank(e)||(e.removeEventListener("load",i),this.getIframeContents(e,t,r))}catch{r()}}};e.addEventListener("load",i),a=setTimeout(i,this.iframesTimeout)}onIframeReady(e,t,r){try{e.contentWindow.document.readyState==="complete"?this.isIframeBlank(e)?this.observeIframeLoad(e,t,r):this.getIframeContents(e,t,r):this.observeIframeLoad(e,t,r)}catch{r()}}waitForIframes(e,t){let r=0;this.forEachIframe(e,()=>!0,n=>{r++,this.waitForIframes(n.querySelector("html"),()=>{--r||t()})},n=>{n||t()})}forEachIframe(e,t,r,n=()=>{}){let a=e.querySelectorAll("iframe"),i=a.length,s=0;a=Array.prototype.slice.call(a);const u=()=>{--i<=0&&n(s)};i||u(),a.forEach(l=>{fe.matches(l,this.exclude)?u():this.onIframeReady(l,h=>{t(l)&&(s++,r(h)),u()},u)})}createIterator(e,t,r){return document.createNodeIterator(e,t,r,!1)}createInstanceOnIframe(e){return new fe(e.querySelector("html"),this.iframes)}compareNodeIframe(e,t,r){const n=e.compareDocumentPosition(r),a=Node.DOCUMENT_POSITION_PRECEDING;if(n&a)if(t!==null){const i=t.compareDocumentPosition(r),s=Node.DOCUMENT_POSITION_FOLLOWING;if(i&s)return!0}else return!0;return!1}getIteratorNode(e){const t=e.previousNode();let r;return t===null?r=e.nextNode():r=e.nextNode()&&e.nextNode(),{prevNode:t,node:r}}checkIframeFilter(e,t,r,n){let a=!1,i=!1;return n.forEach((s,u)=>{s.val===r&&(a=u,i=s.handled)}),this.compareNodeIframe(e,t,r)?(a===!1&&!i?n.push({val:r,handled:!0}):a!==!1&&!i&&(n[a].handled=!0),!0):(a===!1&&n.push({val:r,handled:!1}),!1)}handleOpenIframes(e,t,r,n){e.forEach(a=>{a.handled||this.getIframeContents(a.val,i=>{this.createInstanceOnIframe(i).forEachNode(t,r,n)})})}iterateThroughNodes(e,t,r,n,a){const i=this.createIterator(t,e,n);let s=[],u=[],l,h,d=()=>({prevNode:h,node:l}=this.getIteratorNode(i),l);for(;d();)this.iframes&&this.forEachIframe(t,v=>this.checkIframeFilter(l,h,v,s),v=>{this.createInstanceOnIframe(v).forEachNode(e,y=>u.push(y),n)}),u.push(l);u.forEach(v=>{r(v)}),this.iframes&&this.handleOpenIframes(s,e,r,n),a()}forEachNode(e,t,r,n=()=>{}){const a=this.getContexts();let i=a.length;i||n(),a.forEach(s=>{const u=()=>{this.iterateThroughNodes(e,s,t,r,()=>{--i<=0&&n()})};this.iframes?this.waitForIframes(s,u):u()})}}let Or=class{constructor(e){this.ctx=e,this.ie=!1;const t=window.navigator.userAgent;(t.indexOf("MSIE")>-1||t.indexOf("Trident")>-1)&&(this.ie=!0)}set opt(e){this._opt=Object.assign({},{element:"",className:"",exclude:[],iframes:!1,iframesTimeout:5e3,separateWordSearch:!0,diacritics:!0,synonyms:{},accuracy:"partially",acrossElements:!1,caseSensitive:!1,ignoreJoiners:!1,ignoreGroups:0,ignorePunctuation:[],wildcards:"disabled",each:()=>{},noMatch:()=>{},filter:()=>!0,done:()=>{},debug:!1,log:window.console},e)}get opt(){return this._opt}get iterator(){return new fe(this.ctx,this.opt.iframes,this.opt.exclude,this.opt.iframesTimeout)}log(e,t="debug"){const r=this.opt.log;this.opt.debug&&typeof r=="object"&&typeof r[t]=="function"&&r[t](`mark.js: ${e}`)}escapeStr(e){return e.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g,"\\$&")}createRegExp(e){return this.opt.wildcards!=="disabled"&&(e=this.setupWildcardsRegExp(e)),e=this.escapeStr(e),Object.keys(this.opt.synonyms).length&&(e=this.createSynonymsRegExp(e)),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),this.opt.diacritics&&(e=this.createDiacriticsRegExp(e)),e=this.createMergedBlanksRegExp(e),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.createJoinersRegExp(e)),this.opt.wildcards!=="disabled"&&(e=this.createWildcardsRegExp(e)),e=this.createAccuracyRegExp(e),e}createSynonymsRegExp(e){const t=this.opt.synonyms,r=this.opt.caseSensitive?"":"i",n=this.opt.ignoreJoiners||this.opt.ignorePunctuation.length?"\0":"";for(let a in t)if(t.hasOwnProperty(a)){const i=t[a],s=this.opt.wildcards!=="disabled"?this.setupWildcardsRegExp(a):this.escapeStr(a),u=this.opt.wildcards!=="disabled"?this.setupWildcardsRegExp(i):this.escapeStr(i);s!==""&&u!==""&&(e=e.replace(new RegExp(`(${this.escapeStr(s)}|${this.escapeStr(u)})`,`gm${r}`),n+`(${this.processSynomyms(s)}|${this.processSynomyms(u)})`+n))}return e}processSynomyms(e){return(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),e}setupWildcardsRegExp(e){return e=e.replace(/(?:\\)*\?/g,t=>t.charAt(0)==="\\"?"?":""),e.replace(/(?:\\)*\*/g,t=>t.charAt(0)==="\\"?"*":"")}createWildcardsRegExp(e){let t=this.opt.wildcards==="withSpaces";return e.replace(/\u0001/g,t?"[\\S\\s]?":"\\S?").replace(/\u0002/g,t?"[\\S\\s]*?":"\\S*")}setupIgnoreJoinersRegExp(e){return e.replace(/[^(|)\\]/g,(t,r,n)=>{let a=n.charAt(r+1);return/[(|)\\]/.test(a)||a===""?t:t+"\0"})}createJoinersRegExp(e){let t=[];const r=this.opt.ignorePunctuation;return Array.isArray(r)&&r.length&&t.push(this.escapeStr(r.join(""))),this.opt.ignoreJoiners&&t.push("\\u00ad\\u200b\\u200c\\u200d"),t.length?e.split(/\u0000+/).join(`[${t.join("")}]*`):e}createDiacriticsRegExp(e){const t=this.opt.caseSensitive?"":"i",r=this.opt.caseSensitive?["aàáảãạăằắẳẵặâầấẩẫậäåāą","AÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćč","CÇĆČ","dđď","DĐĎ","eèéẻẽẹêềếểễệëěēę","EÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïī","IÌÍỈĨỊÎÏĪ","lł","LŁ","nñňń","NÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøō","OÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rř","RŘ","sšśșş","SŠŚȘŞ","tťțţ","TŤȚŢ","uùúủũụưừứửữựûüůū","UÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿ","YÝỲỶỸỴŸ","zžżź","ZŽŻŹ"]:["aàáảãạăằắẳẵặâầấẩẫậäåāąAÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćčCÇĆČ","dđďDĐĎ","eèéẻẽẹêềếểễệëěēęEÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïīIÌÍỈĨỊÎÏĪ","lłLŁ","nñňńNÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøōOÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rřRŘ","sšśșşSŠŚȘŞ","tťțţTŤȚŢ","uùúủũụưừứửữựûüůūUÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿYÝỲỶỸỴŸ","zžżźZŽŻŹ"];let n=[];return e.split("").forEach(a=>{r.every(i=>{if(i.indexOf(a)!==-1){if(n.indexOf(i)>-1)return!1;e=e.replace(new RegExp(`[${i}]`,`gm${t}`),`[${i}]`),n.push(i)}return!0})}),e}createMergedBlanksRegExp(e){return e.replace(/[\s]+/gmi,"[\\s]+")}createAccuracyRegExp(e){const t="!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~¡¿";let r=this.opt.accuracy,n=typeof r=="string"?r:r.value,a=typeof r=="string"?[]:r.limiters,i="";switch(a.forEach(s=>{i+=`|${this.escapeStr(s)}`}),n){case"partially":default:return`()(${e})`;case"complementary":return i="\\s"+(i||this.escapeStr(t)),`()([^${i}]*${e}[^${i}]*)`;case"exactly":return`(^|\\s${i})(${e})(?=$|\\s${i})`}}getSeparatedKeywords(e){let t=[];return e.forEach(r=>{this.opt.separateWordSearch?r.split(" ").forEach(n=>{n.trim()&&t.indexOf(n)===-1&&t.push(n)}):r.trim()&&t.indexOf(r)===-1&&t.push(r)}),{keywords:t.sort((r,n)=>n.length-r.length),length:t.length}}isNumeric(e){return Number(parseFloat(e))==e}checkRanges(e){if(!Array.isArray(e)||Object.prototype.toString.call(e[0])!=="[object Object]")return this.log("markRanges() will only accept an array of objects"),this.opt.noMatch(e),[];const t=[];let r=0;return e.sort((n,a)=>n.start-a.start).forEach(n=>{let{start:a,end:i,valid:s}=this.callNoMatchOnInvalidRanges(n,r);s&&(n.start=a,n.length=i-a,t.push(n),r=i)}),t}callNoMatchOnInvalidRanges(e,t){let r,n,a=!1;return e&&typeof e.start<"u"?(r=parseInt(e.start,10),n=r+parseInt(e.length,10),this.isNumeric(e.start)&&this.isNumeric(e.length)&&n-t>0&&n-r>0?a=!0:(this.log(`Ignoring invalid or overlapping range: ${JSON.stringify(e)}`),this.opt.noMatch(e))):(this.log(`Ignoring invalid range: ${JSON.stringify(e)}`),this.opt.noMatch(e)),{start:r,end:n,valid:a}}checkWhitespaceRanges(e,t,r){let n,a=!0,i=r.length,s=t-i,u=parseInt(e.start,10)-s;return u=u>i?i:u,n=u+parseInt(e.length,10),n>i&&(n=i,this.log(`End range automatically set to the max value of ${i}`)),u<0||n-u<0||u>i||n>i?(a=!1,this.log(`Invalid range: ${JSON.stringify(e)}`),this.opt.noMatch(e)):r.substring(u,n).replace(/\s+/g,"")===""&&(a=!1,this.log("Skipping whitespace only range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:u,end:n,valid:a}}getTextNodes(e){let t="",r=[];this.iterator.forEachNode(NodeFilter.SHOW_TEXT,n=>{r.push({start:t.length,end:(t+=n.textContent).length,node:n})},n=>this.matchesExclude(n.parentNode)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT,()=>{e({value:t,nodes:r})})}matchesExclude(e){return fe.matches(e,this.opt.exclude.concat(["script","style","title","head","html"]))}wrapRangeInTextNode(e,t,r){const n=this.opt.element?this.opt.element:"mark",a=e.splitText(t),i=a.splitText(r-t);let s=document.createElement(n);return s.setAttribute("data-markjs","true"),this.opt.className&&s.setAttribute("class",this.opt.className),s.textContent=a.textContent,a.parentNode.replaceChild(s,a),i}wrapRangeInMappedTextNode(e,t,r,n,a){e.nodes.every((i,s)=>{const u=e.nodes[s+1];if(typeof u>"u"||u.start>t){if(!n(i.node))return!1;const l=t-i.start,h=(r>i.end?i.end:r)-i.start,d=e.value.substr(0,i.start),v=e.value.substr(h+i.start);if(i.node=this.wrapRangeInTextNode(i.node,l,h),e.value=d+v,e.nodes.forEach((y,b)=>{b>=s&&(e.nodes[b].start>0&&b!==s&&(e.nodes[b].start-=h),e.nodes[b].end-=h)}),r-=h,a(i.node.previousSibling,i.start),r>i.end)t=i.end;else return!1}return!0})}wrapMatches(e,t,r,n,a){const i=t===0?0:t+1;this.getTextNodes(s=>{s.nodes.forEach(u=>{u=u.node;let l;for(;(l=e.exec(u.textContent))!==null&&l[i]!=="";){if(!r(l[i],u))continue;let h=l.index;if(i!==0)for(let d=1;d{let u;for(;(u=e.exec(s.value))!==null&&u[i]!=="";){let l=u.index;if(i!==0)for(let d=1;dr(u[i],d),(d,v)=>{e.lastIndex=v,n(d)})}a()})}wrapRangeFromIndex(e,t,r,n){this.getTextNodes(a=>{const i=a.value.length;e.forEach((s,u)=>{let{start:l,end:h,valid:d}=this.checkWhitespaceRanges(s,i,a.value);d&&this.wrapRangeInMappedTextNode(a,l,h,v=>t(v,s,a.value.substring(l,h),u),v=>{r(v,s)})}),n()})}unwrapMatches(e){const t=e.parentNode;let r=document.createDocumentFragment();for(;e.firstChild;)r.appendChild(e.removeChild(e.firstChild));t.replaceChild(r,e),this.ie?this.normalizeTextNode(t):t.normalize()}normalizeTextNode(e){if(e){if(e.nodeType===3)for(;e.nextSibling&&e.nextSibling.nodeType===3;)e.nodeValue+=e.nextSibling.nodeValue,e.parentNode.removeChild(e.nextSibling);else this.normalizeTextNode(e.firstChild);this.normalizeTextNode(e.nextSibling)}}markRegExp(e,t){this.opt=t,this.log(`Searching with expression "${e}"`);let r=0,n="wrapMatches";const a=i=>{r++,this.opt.each(i)};this.opt.acrossElements&&(n="wrapMatchesAcrossElements"),this[n](e,this.opt.ignoreGroups,(i,s)=>this.opt.filter(s,i,r),a,()=>{r===0&&this.opt.noMatch(e),this.opt.done(r)})}mark(e,t){this.opt=t;let r=0,n="wrapMatches";const{keywords:a,length:i}=this.getSeparatedKeywords(typeof e=="string"?[e]:e),s=this.opt.caseSensitive?"":"i",u=l=>{let h=new RegExp(this.createRegExp(l),`gm${s}`),d=0;this.log(`Searching with expression "${h}"`),this[n](h,1,(v,y)=>this.opt.filter(y,l,r,d),v=>{d++,r++,this.opt.each(v)},()=>{d===0&&this.opt.noMatch(l),a[i-1]===l?this.opt.done(r):u(a[a.indexOf(l)+1])})};this.opt.acrossElements&&(n="wrapMatchesAcrossElements"),i===0?this.opt.done(r):u(a[0])}markRanges(e,t){this.opt=t;let r=0,n=this.checkRanges(e);n&&n.length?(this.log("Starting to mark with the following ranges: "+JSON.stringify(n)),this.wrapRangeFromIndex(n,(a,i,s,u)=>this.opt.filter(a,i,s,u),(a,i)=>{r++,this.opt.each(a,i)},()=>{this.opt.done(r)})):this.opt.done(r)}unmark(e){this.opt=e;let t=this.opt.element?this.opt.element:"*";t+="[data-markjs]",this.opt.className&&(t+=`.${this.opt.className}`),this.log(`Removal selector "${t}"`),this.iterator.forEachNode(NodeFilter.SHOW_ELEMENT,r=>{this.unwrapMatches(r)},r=>{const n=fe.matches(r,t),a=this.matchesExclude(r);return!n||a?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT},this.opt.done)}};function _r(o){const e=new Or(o);return this.mark=(t,r)=>(e.mark(t,r),this),this.markRegExp=(t,r)=>(e.markRegExp(t,r),this),this.markRanges=(t,r)=>(e.markRanges(t,r),this),this.unmark=t=>(e.unmark(t),this),this}var W=function(){return W=Object.assign||function(e){for(var t,r=1,n=arguments.length;r0&&a[a.length-1])&&(l[0]===6||l[0]===2)){t=0;continue}if(l[0]===3&&(!a||l[1]>a[0]&&l[1]=o.length&&(o=void 0),{value:o&&o[r++],done:!o}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function J(o,e){var t=typeof Symbol=="function"&&o[Symbol.iterator];if(!t)return o;var r=t.call(o),n,a=[],i;try{for(;(e===void 0||e-- >0)&&!(n=r.next()).done;)a.push(n.value)}catch(s){i={error:s}}finally{try{n&&!n.done&&(t=r.return)&&t.call(r)}finally{if(i)throw i.error}}return a}var Lr="ENTRIES",Et="KEYS",St="VALUES",G="",Me=function(){function o(e,t){var r=e._tree,n=Array.from(r.keys());this.set=e,this._type=t,this._path=n.length>0?[{node:r,keys:n}]:[]}return o.prototype.next=function(){var e=this.dive();return this.backtrack(),e},o.prototype.dive=function(){if(this._path.length===0)return{done:!0,value:void 0};var e=ce(this._path),t=e.node,r=e.keys;if(ce(r)===G)return{done:!1,value:this.result()};var n=t.get(ce(r));return this._path.push({node:n,keys:Array.from(n.keys())}),this.dive()},o.prototype.backtrack=function(){if(this._path.length!==0){var e=ce(this._path).keys;e.pop(),!(e.length>0)&&(this._path.pop(),this.backtrack())}},o.prototype.key=function(){return this.set._prefix+this._path.map(function(e){var t=e.keys;return ce(t)}).filter(function(e){return e!==G}).join("")},o.prototype.value=function(){return ce(this._path).node.get(G)},o.prototype.result=function(){switch(this._type){case St:return this.value();case Et:return this.key();default:return[this.key(),this.value()]}},o.prototype[Symbol.iterator]=function(){return this},o}(),ce=function(o){return o[o.length-1]},zr=function(o,e,t){var r=new Map;if(e===void 0)return r;for(var n=e.length+1,a=n+t,i=new Uint8Array(a*n).fill(t+1),s=0;st)continue e}At(o.get(y),e,t,r,n,E,i,s+y)}}}catch(f){u={error:f}}finally{try{v&&!v.done&&(l=d.return)&&l.call(d)}finally{if(u)throw u.error}}},Le=function(){function o(e,t){e===void 0&&(e=new Map),t===void 0&&(t=""),this._size=void 0,this._tree=e,this._prefix=t}return o.prototype.atPrefix=function(e){var t,r;if(!e.startsWith(this._prefix))throw new Error("Mismatched prefix");var n=J(ke(this._tree,e.slice(this._prefix.length)),2),a=n[0],i=n[1];if(a===void 0){var s=J(je(i),2),u=s[0],l=s[1];try{for(var h=D(u.keys()),d=h.next();!d.done;d=h.next()){var v=d.value;if(v!==G&&v.startsWith(l)){var y=new Map;return y.set(v.slice(l.length),u.get(v)),new o(y,e)}}}catch(b){t={error:b}}finally{try{d&&!d.done&&(r=h.return)&&r.call(h)}finally{if(t)throw t.error}}}return new o(a,e)},o.prototype.clear=function(){this._size=void 0,this._tree.clear()},o.prototype.delete=function(e){return this._size=void 0,Pr(this._tree,e)},o.prototype.entries=function(){return new Me(this,Lr)},o.prototype.forEach=function(e){var t,r;try{for(var n=D(this),a=n.next();!a.done;a=n.next()){var i=J(a.value,2),s=i[0],u=i[1];e(s,u,this)}}catch(l){t={error:l}}finally{try{a&&!a.done&&(r=n.return)&&r.call(n)}finally{if(t)throw t.error}}},o.prototype.fuzzyGet=function(e,t){return zr(this._tree,e,t)},o.prototype.get=function(e){var t=Ke(this._tree,e);return t!==void 0?t.get(G):void 0},o.prototype.has=function(e){var t=Ke(this._tree,e);return t!==void 0&&t.has(G)},o.prototype.keys=function(){return new Me(this,Et)},o.prototype.set=function(e,t){if(typeof e!="string")throw new Error("key must be a string");this._size=void 0;var r=ze(this._tree,e);return r.set(G,t),this},Object.defineProperty(o.prototype,"size",{get:function(){if(this._size)return this._size;this._size=0;for(var e=this.entries();!e.next().done;)this._size+=1;return this._size},enumerable:!1,configurable:!0}),o.prototype.update=function(e,t){if(typeof e!="string")throw new Error("key must be a string");this._size=void 0;var r=ze(this._tree,e);return r.set(G,t(r.get(G))),this},o.prototype.fetch=function(e,t){if(typeof e!="string")throw new Error("key must be a string");this._size=void 0;var r=ze(this._tree,e),n=r.get(G);return n===void 0&&r.set(G,n=t()),n},o.prototype.values=function(){return new Me(this,St)},o.prototype[Symbol.iterator]=function(){return this.entries()},o.from=function(e){var t,r,n=new o;try{for(var a=D(e),i=a.next();!i.done;i=a.next()){var s=J(i.value,2),u=s[0],l=s[1];n.set(u,l)}}catch(h){t={error:h}}finally{try{i&&!i.done&&(r=a.return)&&r.call(a)}finally{if(t)throw t.error}}return n},o.fromObject=function(e){return o.from(Object.entries(e))},o}(),ke=function(o,e,t){var r,n;if(t===void 0&&(t=[]),e.length===0||o==null)return[o,t];try{for(var a=D(o.keys()),i=a.next();!i.done;i=a.next()){var s=i.value;if(s!==G&&e.startsWith(s))return t.push([o,s]),ke(o.get(s),e.slice(s.length),t)}}catch(u){r={error:u}}finally{try{i&&!i.done&&(n=a.return)&&n.call(a)}finally{if(r)throw r.error}}return t.push([o,e]),ke(void 0,"",t)},Ke=function(o,e){var t,r;if(e.length===0||o==null)return o;try{for(var n=D(o.keys()),a=n.next();!a.done;a=n.next()){var i=a.value;if(i!==G&&e.startsWith(i))return Ke(o.get(i),e.slice(i.length))}}catch(s){t={error:s}}finally{try{a&&!a.done&&(r=n.return)&&r.call(n)}finally{if(t)throw t.error}}},ze=function(o,e){var t,r,n=e.length;e:for(var a=0;o&&a0)throw new Error("Expected documents to be present. Omit the argument to remove all documents.");this._index=new Le,this._documentCount=0,this._documentIds=new Map,this._idToShortId=new Map,this._fieldLength=new Map,this._avgFieldLength=[],this._storedFields=new Map,this._nextId=0}},o.prototype.discard=function(e){var t=this,r=this._idToShortId.get(e);if(r==null)throw new Error("MiniSearch: cannot discard document with ID ".concat(e,": it is not in the index"));this._idToShortId.delete(e),this._documentIds.delete(r),this._storedFields.delete(r),(this._fieldLength.get(r)||[]).forEach(function(n,a){t.removeFieldLength(r,a,t._documentCount,n)}),this._fieldLength.delete(r),this._documentCount-=1,this._dirtCount+=1,this.maybeAutoVacuum()},o.prototype.maybeAutoVacuum=function(){if(this._options.autoVacuum!==!1){var e=this._options.autoVacuum,t=e.minDirtFactor,r=e.minDirtCount,n=e.batchSize,a=e.batchWait;this.conditionalVacuum({batchSize:n,batchWait:a},{minDirtCount:r,minDirtFactor:t})}},o.prototype.discardAll=function(e){var t,r,n=this._options.autoVacuum;try{this._options.autoVacuum=!1;try{for(var a=D(e),i=a.next();!i.done;i=a.next()){var s=i.value;this.discard(s)}}catch(u){t={error:u}}finally{try{i&&!i.done&&(r=a.return)&&r.call(a)}finally{if(t)throw t.error}}}finally{this._options.autoVacuum=n}this.maybeAutoVacuum()},o.prototype.replace=function(e){var t=this._options,r=t.idField,n=t.extractField,a=n(e,r);this.discard(a),this.add(e)},o.prototype.vacuum=function(e){return e===void 0&&(e={}),this.conditionalVacuum(e)},o.prototype.conditionalVacuum=function(e,t){var r=this;return this._currentVacuum?(this._enqueuedVacuumConditions=this._enqueuedVacuumConditions&&t,this._enqueuedVacuum!=null?this._enqueuedVacuum:(this._enqueuedVacuum=this._currentVacuum.then(function(){var n=r._enqueuedVacuumConditions;return r._enqueuedVacuumConditions=Ue,r.performVacuuming(e,n)}),this._enqueuedVacuum)):this.vacuumConditionsMet(t)===!1?Promise.resolve():(this._currentVacuum=this.performVacuuming(e),this._currentVacuum)},o.prototype.performVacuuming=function(e,t){return Rr(this,void 0,void 0,function(){var r,n,a,i,s,u,l,h,d,v,y,b,E,g,S,T,F,L,R,V,N,_,A,O,w;return Mr(this,function(c){switch(c.label){case 0:if(r=this._dirtCount,!this.vacuumConditionsMet(t))return[3,10];n=e.batchSize||Je.batchSize,a=e.batchWait||Je.batchWait,i=1,c.label=1;case 1:c.trys.push([1,7,8,9]),s=D(this._index),u=s.next(),c.label=2;case 2:if(u.done)return[3,6];l=J(u.value,2),h=l[0],d=l[1];try{for(v=(_=void 0,D(d)),y=v.next();!y.done;y=v.next()){b=J(y.value,2),E=b[0],g=b[1];try{for(S=(O=void 0,D(g)),T=S.next();!T.done;T=S.next())F=J(T.value,1),L=F[0],!this._documentIds.has(L)&&(g.size<=1?d.delete(E):g.delete(L))}catch(f){O={error:f}}finally{try{T&&!T.done&&(w=S.return)&&w.call(S)}finally{if(O)throw O.error}}}}catch(f){_={error:f}}finally{try{y&&!y.done&&(A=v.return)&&A.call(v)}finally{if(_)throw _.error}}return this._index.get(h).size===0&&this._index.delete(h),i%n!==0?[3,4]:[4,new Promise(function(f){return setTimeout(f,a)})];case 3:c.sent(),c.label=4;case 4:i+=1,c.label=5;case 5:return u=s.next(),[3,2];case 6:return[3,9];case 7:return R=c.sent(),V={error:R},[3,9];case 8:try{u&&!u.done&&(N=s.return)&&N.call(s)}finally{if(V)throw V.error}return[7];case 9:this._dirtCount-=r,c.label=10;case 10:return[4,null];case 11:return c.sent(),this._currentVacuum=this._enqueuedVacuum,this._enqueuedVacuum=null,[2]}})})},o.prototype.vacuumConditionsMet=function(e){if(e==null)return!0;var t=e.minDirtCount,r=e.minDirtFactor;return t=t||Ve.minDirtCount,r=r||Ve.minDirtFactor,this.dirtCount>=t&&this.dirtFactor>=r},Object.defineProperty(o.prototype,"isVacuuming",{get:function(){return this._currentVacuum!=null},enumerable:!1,configurable:!0}),Object.defineProperty(o.prototype,"dirtCount",{get:function(){return this._dirtCount},enumerable:!1,configurable:!0}),Object.defineProperty(o.prototype,"dirtFactor",{get:function(){return this._dirtCount/(1+this._documentCount+this._dirtCount)},enumerable:!1,configurable:!0}),o.prototype.has=function(e){return this._idToShortId.has(e)},o.prototype.getStoredFields=function(e){var t=this._idToShortId.get(e);if(t!=null)return this._storedFields.get(t)},o.prototype.search=function(e,t){var r,n;t===void 0&&(t={});var a=this.executeQuery(e,t),i=[];try{for(var s=D(a),u=s.next();!u.done;u=s.next()){var l=J(u.value,2),h=l[0],d=l[1],v=d.score,y=d.terms,b=d.match,E=y.length||1,g={id:this._documentIds.get(h),score:v*E,terms:Object.keys(b),queryTerms:y,match:b};Object.assign(g,this._storedFields.get(h)),(t.filter==null||t.filter(g))&&i.push(g)}}catch(S){r={error:S}}finally{try{u&&!u.done&&(n=s.return)&&n.call(s)}finally{if(r)throw r.error}}return e===o.wildcard&&t.boostDocument==null&&this._options.searchOptions.boostDocument==null||i.sort(vt),i},o.prototype.autoSuggest=function(e,t){var r,n,a,i;t===void 0&&(t={}),t=W(W({},this._options.autoSuggestOptions),t);var s=new Map;try{for(var u=D(this.search(e,t)),l=u.next();!l.done;l=u.next()){var h=l.value,d=h.score,v=h.terms,y=v.join(" "),b=s.get(y);b!=null?(b.score+=d,b.count+=1):s.set(y,{score:d,terms:v,count:1})}}catch(R){r={error:R}}finally{try{l&&!l.done&&(n=u.return)&&n.call(u)}finally{if(r)throw r.error}}var E=[];try{for(var g=D(s),S=g.next();!S.done;S=g.next()){var T=J(S.value,2),b=T[0],F=T[1],d=F.score,v=F.terms,L=F.count;E.push({suggestion:b,terms:v,score:d/L})}}catch(R){a={error:R}}finally{try{S&&!S.done&&(i=g.return)&&i.call(g)}finally{if(a)throw a.error}}return E.sort(vt),E},Object.defineProperty(o.prototype,"documentCount",{get:function(){return this._documentCount},enumerable:!1,configurable:!0}),Object.defineProperty(o.prototype,"termCount",{get:function(){return this._index.size},enumerable:!1,configurable:!0}),o.loadJSON=function(e,t){if(t==null)throw new Error("MiniSearch: loadJSON should be given the same options used when serializing the index");return this.loadJS(JSON.parse(e),t)},o.getDefault=function(e){if(Be.hasOwnProperty(e))return Pe(Be,e);throw new Error('MiniSearch: unknown option "'.concat(e,'"'))},o.loadJS=function(e,t){var r,n,a,i,s,u,l=e.index,h=e.documentCount,d=e.nextId,v=e.documentIds,y=e.fieldIds,b=e.fieldLength,E=e.averageFieldLength,g=e.storedFields,S=e.dirtCount,T=e.serializationVersion;if(T!==1&&T!==2)throw new Error("MiniSearch: cannot deserialize an index created with an incompatible version");var F=new o(t);F._documentCount=h,F._nextId=d,F._documentIds=Te(v),F._idToShortId=new Map,F._fieldIds=y,F._fieldLength=Te(b),F._avgFieldLength=E,F._storedFields=Te(g),F._dirtCount=S||0,F._index=new Le;try{for(var L=D(F._documentIds),R=L.next();!R.done;R=L.next()){var V=J(R.value,2),N=V[0],_=V[1];F._idToShortId.set(_,N)}}catch(P){r={error:P}}finally{try{R&&!R.done&&(n=L.return)&&n.call(L)}finally{if(r)throw r.error}}try{for(var A=D(l),O=A.next();!O.done;O=A.next()){var w=J(O.value,2),c=w[0],f=w[1],p=new Map;try{for(var C=(s=void 0,D(Object.keys(f))),I=C.next();!I.done;I=C.next()){var M=I.value,z=f[M];T===1&&(z=z.ds),p.set(parseInt(M,10),Te(z))}}catch(P){s={error:P}}finally{try{I&&!I.done&&(u=C.return)&&u.call(C)}finally{if(s)throw s.error}}F._index.set(c,p)}}catch(P){a={error:P}}finally{try{O&&!O.done&&(i=A.return)&&i.call(A)}finally{if(a)throw a.error}}return F},o.prototype.executeQuery=function(e,t){var r=this;if(t===void 0&&(t={}),e===o.wildcard)return this.executeWildcardQuery(t);if(typeof e!="string"){var n=W(W(W({},t),e),{queries:void 0}),a=e.queries.map(function(g){return r.executeQuery(g,n)});return this.combineResults(a,n.combineWith)}var i=this._options,s=i.tokenize,u=i.processTerm,l=i.searchOptions,h=W(W({tokenize:s,processTerm:u},l),t),d=h.tokenize,v=h.processTerm,y=d(e).flatMap(function(g){return v(g)}).filter(function(g){return!!g}),b=y.map(Jr(h)),E=b.map(function(g){return r.executeQuerySpec(g,h)});return this.combineResults(E,h.combineWith)},o.prototype.executeQuerySpec=function(e,t){var r,n,a,i,s=W(W({},this._options.searchOptions),t),u=(s.fields||this._options.fields).reduce(function(M,z){var P;return W(W({},M),(P={},P[z]=Pe(s.boost,z)||1,P))},{}),l=s.boostDocument,h=s.weights,d=s.maxFuzzy,v=s.bm25,y=W(W({},ht.weights),h),b=y.fuzzy,E=y.prefix,g=this._index.get(e.term),S=this.termResults(e.term,e.term,1,g,u,l,v),T,F;if(e.prefix&&(T=this._index.atPrefix(e.term)),e.fuzzy){var L=e.fuzzy===!0?.2:e.fuzzy,R=L<1?Math.min(d,Math.round(e.term.length*L)):L;R&&(F=this._index.fuzzyGet(e.term,R))}if(T)try{for(var V=D(T),N=V.next();!N.done;N=V.next()){var _=J(N.value,2),A=_[0],O=_[1],w=A.length-e.term.length;if(w){F==null||F.delete(A);var c=E*A.length/(A.length+.3*w);this.termResults(e.term,A,c,O,u,l,v,S)}}}catch(M){r={error:M}}finally{try{N&&!N.done&&(n=V.return)&&n.call(V)}finally{if(r)throw r.error}}if(F)try{for(var f=D(F.keys()),p=f.next();!p.done;p=f.next()){var A=p.value,C=J(F.get(A),2),I=C[0],w=C[1];if(w){var c=b*A.length/(A.length+w);this.termResults(e.term,A,c,I,u,l,v,S)}}}catch(M){a={error:M}}finally{try{p&&!p.done&&(i=f.return)&&i.call(f)}finally{if(a)throw a.error}}return S},o.prototype.executeWildcardQuery=function(e){var t,r,n=new Map,a=W(W({},this._options.searchOptions),e);try{for(var i=D(this._documentIds),s=i.next();!s.done;s=i.next()){var u=J(s.value,2),l=u[0],h=u[1],d=a.boostDocument?a.boostDocument(h,"",this._storedFields.get(l)):1;n.set(l,{score:d,terms:[],match:{}})}}catch(v){t={error:v}}finally{try{s&&!s.done&&(r=i.return)&&r.call(i)}finally{if(t)throw t.error}}return n},o.prototype.combineResults=function(e,t){if(t===void 0&&(t=Ge),e.length===0)return new Map;var r=t.toLowerCase();return e.reduce($r[r])||new Map},o.prototype.toJSON=function(){var e,t,r,n,a=[];try{for(var i=D(this._index),s=i.next();!s.done;s=i.next()){var u=J(s.value,2),l=u[0],h=u[1],d={};try{for(var v=(r=void 0,D(h)),y=v.next();!y.done;y=v.next()){var b=J(y.value,2),E=b[0],g=b[1];d[E]=Object.fromEntries(g)}}catch(S){r={error:S}}finally{try{y&&!y.done&&(n=v.return)&&n.call(v)}finally{if(r)throw r.error}}a.push([l,d])}}catch(S){e={error:S}}finally{try{s&&!s.done&&(t=i.return)&&t.call(i)}finally{if(e)throw e.error}}return{documentCount:this._documentCount,nextId:this._nextId,documentIds:Object.fromEntries(this._documentIds),fieldIds:this._fieldIds,fieldLength:Object.fromEntries(this._fieldLength),averageFieldLength:this._avgFieldLength,storedFields:Object.fromEntries(this._storedFields),dirtCount:this._dirtCount,index:a,serializationVersion:2}},o.prototype.termResults=function(e,t,r,n,a,i,s,u){var l,h,d,v,y;if(u===void 0&&(u=new Map),n==null)return u;try{for(var b=D(Object.keys(a)),E=b.next();!E.done;E=b.next()){var g=E.value,S=a[g],T=this._fieldIds[g],F=n.get(T);if(F!=null){var L=F.size,R=this._avgFieldLength[T];try{for(var V=(d=void 0,D(F.keys())),N=V.next();!N.done;N=V.next()){var _=N.value;if(!this._documentIds.has(_)){this.removeTerm(T,_,t),L-=1;continue}var A=i?i(this._documentIds.get(_),t,this._storedFields.get(_)):1;if(A){var O=F.get(_),w=this._fieldLength.get(_)[T],c=Kr(O,L,this._documentCount,w,R,s),f=r*S*A*c,p=u.get(_);if(p){p.score+=f,jr(p.terms,e);var C=Pe(p.match,t);C?C.push(g):p.match[t]=[g]}else u.set(_,{score:f,terms:[e],match:(y={},y[t]=[g],y)})}}}catch(I){d={error:I}}finally{try{N&&!N.done&&(v=V.return)&&v.call(V)}finally{if(d)throw d.error}}}}}catch(I){l={error:I}}finally{try{E&&!E.done&&(h=b.return)&&h.call(b)}finally{if(l)throw l.error}}return u},o.prototype.addTerm=function(e,t,r){var n=this._index.fetch(r,pt),a=n.get(e);if(a==null)a=new Map,a.set(t,1),n.set(e,a);else{var i=a.get(t);a.set(t,(i||0)+1)}},o.prototype.removeTerm=function(e,t,r){if(!this._index.has(r)){this.warnDocumentChanged(t,e,r);return}var n=this._index.fetch(r,pt),a=n.get(e);a==null||a.get(t)==null?this.warnDocumentChanged(t,e,r):a.get(t)<=1?a.size<=1?n.delete(e):a.delete(t):a.set(t,a.get(t)-1),this._index.get(r).size===0&&this._index.delete(r)},o.prototype.warnDocumentChanged=function(e,t,r){var n,a;try{for(var i=D(Object.keys(this._fieldIds)),s=i.next();!s.done;s=i.next()){var u=s.value;if(this._fieldIds[u]===t){this._options.logger("warn","MiniSearch: document with ID ".concat(this._documentIds.get(e),' has changed before removal: term "').concat(r,'" was not present in field "').concat(u,'". Removing a document after it has changed can corrupt the index!'),"version_conflict");return}}}catch(l){n={error:l}}finally{try{s&&!s.done&&(a=i.return)&&a.call(i)}finally{if(n)throw n.error}}},o.prototype.addDocumentId=function(e){var t=this._nextId;return this._idToShortId.set(e,t),this._documentIds.set(t,e),this._documentCount+=1,this._nextId+=1,t},o.prototype.addFields=function(e){for(var t=0;t(qt("data-v-43c4f204"),o=o(),Qt(),o),qr=["aria-owns"],Qr={class:"shell"},Yr=["title"],Zr=Y(()=>k("span",{"aria-hidden":"true",class:"vpi-search search-icon local-search-icon"},null,-1)),Xr=[Zr],ea={class:"search-actions before"},ta=["title"],ra=Y(()=>k("span",{class:"vpi-arrow-left local-search-icon"},null,-1)),aa=[ra],na=["placeholder"],ia={class:"search-actions"},oa=["title"],sa=Y(()=>k("span",{class:"vpi-layout-list local-search-icon"},null,-1)),ua=[sa],la=["disabled","title"],ca=Y(()=>k("span",{class:"vpi-delete local-search-icon"},null,-1)),fa=[ca],ha=["id","role","aria-labelledby"],da=["aria-selected"],va=["href","aria-label","onMouseenter","onFocusin"],pa={class:"titles"},ya=Y(()=>k("span",{class:"title-icon"},"#",-1)),ma=["innerHTML"],ga=Y(()=>k("span",{class:"vpi-chevron-right local-search-icon"},null,-1)),ba={class:"title main"},wa=["innerHTML"],xa={key:0,class:"excerpt-wrapper"},Fa={key:0,class:"excerpt",inert:""},Ea=["innerHTML"],Sa=Y(()=>k("div",{class:"excerpt-gradient-bottom"},null,-1)),Aa=Y(()=>k("div",{class:"excerpt-gradient-top"},null,-1)),Ta={key:0,class:"no-results"},Na={class:"search-keyboard-shortcuts"},Ca=["aria-label"],Ia=Y(()=>k("span",{class:"vpi-arrow-up navigate-icon"},null,-1)),Da=[Ia],ka=["aria-label"],Oa=Y(()=>k("span",{class:"vpi-arrow-down navigate-icon"},null,-1)),_a=[Oa],Ra=["aria-label"],Ma=Y(()=>k("span",{class:"vpi-corner-down-left navigate-icon"},null,-1)),La=[Ma],za=["aria-label"],Pa=_t({__name:"VPLocalSearchBox",emits:["close"],setup(o,{emit:e}){var z,P;const t=e,r=xe(),n=xe(),a=xe(nr),i=rr(),{activate:s}=kr(r,{immediate:!0,allowOutsideClick:!0,clickOutsideDeactivates:!0,escapeDeactivates:!0}),{localeIndex:u,theme:l}=i,h=tt(async()=>{var m,x,$,K,H,q,B,U,Z;return it(Vr.loadJSON(($=await((x=(m=a.value)[u.value])==null?void 0:x.call(m)))==null?void 0:$.default,{fields:["title","titles","text"],storeFields:["title","titles"],searchOptions:{fuzzy:.2,prefix:!0,boost:{title:4,text:2,titles:1},...((K=l.value.search)==null?void 0:K.provider)==="local"&&((q=(H=l.value.search.options)==null?void 0:H.miniSearch)==null?void 0:q.searchOptions)},...((B=l.value.search)==null?void 0:B.provider)==="local"&&((Z=(U=l.value.search.options)==null?void 0:U.miniSearch)==null?void 0:Z.options)}))}),v=Fe(()=>{var m,x;return((m=l.value.search)==null?void 0:m.provider)==="local"&&((x=l.value.search.options)==null?void 0:x.disableQueryPersistence)===!0}).value?oe(""):Rt("vitepress:local-search-filter",""),y=Mt("vitepress:local-search-detailed-list",((z=l.value.search)==null?void 0:z.provider)==="local"&&((P=l.value.search.options)==null?void 0:P.detailedView)===!0),b=Fe(()=>{var m,x,$;return((m=l.value.search)==null?void 0:m.provider)==="local"&&(((x=l.value.search.options)==null?void 0:x.disableDetailedView)===!0||(($=l.value.search.options)==null?void 0:$.detailedView)===!1)}),E=Fe(()=>{var x,$,K,H,q,B,U;const m=((x=l.value.search)==null?void 0:x.options)??l.value.algolia;return((q=(H=(K=($=m==null?void 0:m.locales)==null?void 0:$[u.value])==null?void 0:K.translations)==null?void 0:H.button)==null?void 0:q.buttonText)||((U=(B=m==null?void 0:m.translations)==null?void 0:B.button)==null?void 0:U.buttonText)||"Search"});Lt(()=>{b.value&&(y.value=!1)});const g=xe([]),S=oe(!1);$e(v,()=>{S.value=!1});const T=tt(async()=>{if(n.value)return it(new _r(n.value))},null),F=new Hr(16);zt(()=>[h.value,v.value,y.value],async([m,x,$],K,H)=>{var be,He,qe,Qe;(K==null?void 0:K[0])!==m&&F.clear();let q=!1;if(H(()=>{q=!0}),!m)return;g.value=m.search(x).slice(0,16),S.value=!0;const B=$?await Promise.all(g.value.map(Q=>L(Q.id))):[];if(q)return;for(const{id:Q,mod:ae}of B){const ne=Q.slice(0,Q.indexOf("#"));let te=F.get(ne);if(te)continue;te=new Map,F.set(ne,te);const X=ae.default??ae;if(X!=null&&X.render||X!=null&&X.setup){const ie=Yt(X);ie.config.warnHandler=()=>{},ie.provide(Zt,i),Object.defineProperties(ie.config.globalProperties,{$frontmatter:{get(){return i.frontmatter.value}},$params:{get(){return i.page.value.params}}});const Ye=document.createElement("div");ie.mount(Ye),Ye.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach(he=>{var et;const we=(et=he.querySelector("a"))==null?void 0:et.getAttribute("href"),Ze=(we==null?void 0:we.startsWith("#"))&&we.slice(1);if(!Ze)return;let Xe="";for(;(he=he.nextElementSibling)&&!/^h[1-6]$/i.test(he.tagName);)Xe+=he.outerHTML;te.set(Ze,Xe)}),ie.unmount()}if(q)return}const U=new Set;if(g.value=g.value.map(Q=>{const[ae,ne]=Q.id.split("#"),te=F.get(ae),X=(te==null?void 0:te.get(ne))??"";for(const ie in Q.match)U.add(ie);return{...Q,text:X}}),await de(),q)return;await new Promise(Q=>{var ae;(ae=T.value)==null||ae.unmark({done:()=>{var ne;(ne=T.value)==null||ne.markRegExp(M(U),{done:Q})}})});const Z=((be=r.value)==null?void 0:be.querySelectorAll(".result .excerpt"))??[];for(const Q of Z)(He=Q.querySelector('mark[data-markjs="true"]'))==null||He.scrollIntoView({block:"center"});(Qe=(qe=n.value)==null?void 0:qe.firstElementChild)==null||Qe.scrollIntoView({block:"start"})},{debounce:200,immediate:!0});async function L(m){const x=Xt(m.slice(0,m.indexOf("#")));try{if(!x)throw new Error(`Cannot find file for id: ${m}`);return{id:m,mod:await yt(()=>import(x),[])}}catch($){return console.error($),{id:m,mod:{}}}}const R=oe(),V=Fe(()=>{var m;return((m=v.value)==null?void 0:m.length)<=0});function N(m=!0){var x,$;(x=R.value)==null||x.focus(),m&&(($=R.value)==null||$.select())}_e(()=>{N()});function _(m){m.pointerType==="mouse"&&N()}const A=oe(-1),O=oe(!1);$e(g,m=>{A.value=m.length?0:-1,w()});function w(){de(()=>{const m=document.querySelector(".result.selected");m&&m.scrollIntoView({block:"nearest"})})}Ee("ArrowUp",m=>{m.preventDefault(),A.value--,A.value<0&&(A.value=g.value.length-1),O.value=!0,w()}),Ee("ArrowDown",m=>{m.preventDefault(),A.value++,A.value>=g.value.length&&(A.value=0),O.value=!0,w()});const c=Pt();Ee("Enter",m=>{if(m.isComposing||m.target instanceof HTMLButtonElement&&m.target.type!=="submit")return;const x=g.value[A.value];if(m.target instanceof HTMLInputElement&&!x){m.preventDefault();return}x&&(c.go(x.id),t("close"))}),Ee("Escape",()=>{t("close")});const p=ar({modal:{displayDetails:"Display detailed list",resetButtonTitle:"Reset search",backButtonTitle:"Close search",noResultsText:"No results for",footer:{selectText:"to select",selectKeyAriaLabel:"enter",navigateText:"to navigate",navigateUpKeyAriaLabel:"up arrow",navigateDownKeyAriaLabel:"down arrow",closeText:"to close",closeKeyAriaLabel:"escape"}}});_e(()=>{window.history.pushState(null,"",null)}),Bt("popstate",m=>{m.preventDefault(),t("close")});const C=Vt($t?document.body:null);_e(()=>{de(()=>{C.value=!0,de().then(()=>s())})}),Wt(()=>{C.value=!1});function I(){v.value="",de().then(()=>N(!1))}function M(m){return new RegExp([...m].sort((x,$)=>$.length-x.length).map(x=>`(${er(x)})`).join("|"),"gi")}return(m,x)=>{var $,K,H,q;return ee(),Kt(Ht,{to:"body"},[k("div",{ref_key:"el",ref:r,role:"button","aria-owns":($=g.value)!=null&&$.length?"localsearch-list":void 0,"aria-expanded":"true","aria-haspopup":"listbox","aria-labelledby":"localsearch-label",class:"VPLocalSearchBox"},[k("div",{class:"backdrop",onClick:x[0]||(x[0]=B=>m.$emit("close"))}),k("div",Qr,[k("form",{class:"search-bar",onPointerup:x[4]||(x[4]=B=>_(B)),onSubmit:x[5]||(x[5]=Jt(()=>{},["prevent"]))},[k("label",{title:E.value,id:"localsearch-label",for:"localsearch-input"},Xr,8,Yr),k("div",ea,[k("button",{class:"back-button",title:j(p)("modal.backButtonTitle"),onClick:x[1]||(x[1]=B=>m.$emit("close"))},aa,8,ta)]),Ut(k("input",{ref_key:"searchInput",ref:R,"onUpdate:modelValue":x[2]||(x[2]=B=>Gt(v)?v.value=B:null),placeholder:E.value,id:"localsearch-input","aria-labelledby":"localsearch-label",class:"search-input"},null,8,na),[[jt,j(v)]]),k("div",ia,[b.value?Se("",!0):(ee(),re("button",{key:0,class:rt(["toggle-layout-button",{"detailed-list":j(y)}]),type:"button",title:j(p)("modal.displayDetails"),onClick:x[3]||(x[3]=B=>A.value>-1&&(y.value=!j(y)))},ua,10,oa)),k("button",{class:"clear-button",type:"reset",disabled:V.value,title:j(p)("modal.resetButtonTitle"),onClick:I},fa,8,la)])],32),k("ul",{ref_key:"resultsEl",ref:n,id:(K=g.value)!=null&&K.length?"localsearch-list":void 0,role:(H=g.value)!=null&&H.length?"listbox":void 0,"aria-labelledby":(q=g.value)!=null&&q.length?"localsearch-label":void 0,class:"results",onMousemove:x[7]||(x[7]=B=>O.value=!1)},[(ee(!0),re(nt,null,at(g.value,(B,U)=>(ee(),re("li",{key:B.id,role:"option","aria-selected":A.value===U?"true":"false"},[k("a",{href:B.id,class:rt(["result",{selected:A.value===U}]),"aria-label":[...B.titles,B.title].join(" > "),onMouseenter:Z=>!O.value&&(A.value=U),onFocusin:Z=>A.value=U,onClick:x[6]||(x[6]=Z=>m.$emit("close"))},[k("div",null,[k("div",pa,[ya,(ee(!0),re(nt,null,at(B.titles,(Z,be)=>(ee(),re("span",{key:be,class:"title"},[k("span",{class:"text",innerHTML:Z},null,8,ma),ga]))),128)),k("span",ba,[k("span",{class:"text",innerHTML:B.title},null,8,wa)])]),j(y)?(ee(),re("div",xa,[B.text?(ee(),re("div",Fa,[k("div",{class:"vp-doc",innerHTML:B.text},null,8,Ea)])):Se("",!0),Sa,Aa])):Se("",!0)])],42,va)],8,da))),128)),j(v)&&!g.value.length&&S.value?(ee(),re("li",Ta,[ve(pe(j(p)("modal.noResultsText"))+' "',1),k("strong",null,pe(j(v)),1),ve('" ')])):Se("",!0)],40,ha),k("div",Na,[k("span",null,[k("kbd",{"aria-label":j(p)("modal.footer.navigateUpKeyAriaLabel")},Da,8,Ca),k("kbd",{"aria-label":j(p)("modal.footer.navigateDownKeyAriaLabel")},_a,8,ka),ve(" "+pe(j(p)("modal.footer.navigateText")),1)]),k("span",null,[k("kbd",{"aria-label":j(p)("modal.footer.selectKeyAriaLabel")},La,8,Ra),ve(" "+pe(j(p)("modal.footer.selectText")),1)]),k("span",null,[k("kbd",{"aria-label":j(p)("modal.footer.closeKeyAriaLabel")},"esc",8,za),ve(" "+pe(j(p)("modal.footer.closeText")),1)])])])],8,qr)])}}}),Ja=tr(Pa,[["__scopeId","data-v-43c4f204"]]);export{Ja as default}; diff --git a/assets/chunks/framework.DWhUQBuX.js b/assets/chunks/framework.DWhUQBuX.js new file mode 100644 index 00000000..2b201bf3 --- /dev/null +++ b/assets/chunks/framework.DWhUQBuX.js @@ -0,0 +1,17 @@ +/** +* @vue/shared v3.4.21 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/function Ts(e,t){const n=new Set(e.split(","));return t?s=>n.has(s.toLowerCase()):s=>n.has(s)}const ee={},yt=[],xe=()=>{},Si=()=>!1,Wt=e=>e.charCodeAt(0)===111&&e.charCodeAt(1)===110&&(e.charCodeAt(2)>122||e.charCodeAt(2)<97),As=e=>e.startsWith("onUpdate:"),ce=Object.assign,Rs=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},Ti=Object.prototype.hasOwnProperty,Y=(e,t)=>Ti.call(e,t),U=Array.isArray,bt=e=>An(e)==="[object Map]",Zr=e=>An(e)==="[object Set]",q=e=>typeof e=="function",ne=e=>typeof e=="string",At=e=>typeof e=="symbol",Z=e=>e!==null&&typeof e=="object",eo=e=>(Z(e)||q(e))&&q(e.then)&&q(e.catch),to=Object.prototype.toString,An=e=>to.call(e),Ai=e=>An(e).slice(8,-1),no=e=>An(e)==="[object Object]",Ls=e=>ne(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,vt=Ts(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Rn=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},Ri=/-(\w)/g,Ne=Rn(e=>e.replace(Ri,(t,n)=>n?n.toUpperCase():"")),Li=/\B([A-Z])/g,ft=Rn(e=>e.replace(Li,"-$1").toLowerCase()),Ln=Rn(e=>e.charAt(0).toUpperCase()+e.slice(1)),hn=Rn(e=>e?`on${Ln(e)}`:""),Ze=(e,t)=>!Object.is(e,t),pn=(e,t)=>{for(let n=0;n{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},us=e=>{const t=parseFloat(e);return isNaN(t)?e:t},Oi=e=>{const t=ne(e)?Number(e):NaN;return isNaN(t)?e:t};let sr;const so=()=>sr||(sr=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof window<"u"?window:typeof global<"u"?global:{});function Os(e){if(U(e)){const t={};for(let n=0;n{if(n){const s=n.split(Fi);s.length>1&&(t[s[0].trim()]=s[1].trim())}}),t}function Is(e){let t="";if(ne(e))t=e;else if(U(e))for(let n=0;nne(e)?e:e==null?"":U(e)||Z(e)&&(e.toString===to||!q(e.toString))?JSON.stringify(e,oo,2):String(e),oo=(e,t)=>t&&t.__v_isRef?oo(e,t.value):bt(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[s,r],o)=>(n[qn(s,o)+" =>"]=r,n),{})}:Zr(t)?{[`Set(${t.size})`]:[...t.values()].map(n=>qn(n))}:At(t)?qn(t):Z(t)&&!U(t)&&!no(t)?String(t):t,qn=(e,t="")=>{var n;return At(e)?`Symbol(${(n=e.description)!=null?n:t})`:e};/** +* @vue/reactivity v3.4.21 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/let be;class Hi{constructor(t=!1){this.detached=t,this._active=!0,this.effects=[],this.cleanups=[],this.parent=be,!t&&be&&(this.index=(be.scopes||(be.scopes=[])).push(this)-1)}get active(){return this._active}run(t){if(this._active){const n=be;try{return be=this,t()}finally{be=n}}}on(){be=this}off(){be=this.parent}stop(t){if(this._active){let n,s;for(n=0,s=this.effects.length;n=4))break}this._dirtyLevel===1&&(this._dirtyLevel=0),ht()}return this._dirtyLevel>=4}set dirty(t){this._dirtyLevel=t?4:0}run(){if(this._dirtyLevel=0,!this.active)return this.fn();let t=Ye,n=ct;try{return Ye=!0,ct=this,this._runnings++,rr(this),this.fn()}finally{or(this),this._runnings--,ct=n,Ye=t}}stop(){var t;this.active&&(rr(this),or(this),(t=this.onStop)==null||t.call(this),this.active=!1)}}function Vi(e){return e.value}function rr(e){e._trackId++,e._depsLength=0}function or(e){if(e.deps.length>e._depsLength){for(let t=e._depsLength;t{const n=new Map;return n.cleanup=e,n.computed=t,n},bn=new WeakMap,at=Symbol(""),hs=Symbol("");function _e(e,t,n){if(Ye&&ct){let s=bn.get(e);s||bn.set(e,s=new Map);let r=s.get(n);r||s.set(n,r=fo(()=>s.delete(n))),ao(ct,r)}}function je(e,t,n,s,r,o){const i=bn.get(e);if(!i)return;let l=[];if(t==="clear")l=[...i.values()];else if(n==="length"&&U(e)){const c=Number(s);i.forEach((a,f)=>{(f==="length"||!At(f)&&f>=c)&&l.push(a)})}else switch(n!==void 0&&l.push(i.get(n)),t){case"add":U(e)?Ls(n)&&l.push(i.get("length")):(l.push(i.get(at)),bt(e)&&l.push(i.get(hs)));break;case"delete":U(e)||(l.push(i.get(at)),bt(e)&&l.push(i.get(hs)));break;case"set":bt(e)&&l.push(i.get(at));break}Ms();for(const c of l)c&&uo(c,4);Ps()}function Di(e,t){var n;return(n=bn.get(e))==null?void 0:n.get(t)}const Ui=Ts("__proto__,__v_isRef,__isVue"),ho=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!=="arguments"&&e!=="caller").map(e=>Symbol[e]).filter(At)),ir=Bi();function Bi(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const s=J(this);for(let o=0,i=this.length;o{e[t]=function(...n){dt(),Ms();const s=J(this)[t].apply(this,n);return Ps(),ht(),s}}),e}function Ki(e){const t=J(this);return _e(t,"has",e),t.hasOwnProperty(e)}class po{constructor(t=!1,n=!1){this._isReadonly=t,this._isShallow=n}get(t,n,s){const r=this._isReadonly,o=this._isShallow;if(n==="__v_isReactive")return!r;if(n==="__v_isReadonly")return r;if(n==="__v_isShallow")return o;if(n==="__v_raw")return s===(r?o?sl:yo:o?_o:mo).get(t)||Object.getPrototypeOf(t)===Object.getPrototypeOf(s)?t:void 0;const i=U(t);if(!r){if(i&&Y(ir,n))return Reflect.get(ir,n,s);if(n==="hasOwnProperty")return Ki}const l=Reflect.get(t,n,s);return(At(n)?ho.has(n):Ui(n))||(r||_e(t,"get",n),o)?l:de(l)?i&&Ls(n)?l:l.value:Z(l)?r?Fn(l):In(l):l}}class go extends po{constructor(t=!1){super(!1,t)}set(t,n,s,r){let o=t[n];if(!this._isShallow){const c=St(o);if(!vn(s)&&!St(s)&&(o=J(o),s=J(s)),!U(t)&&de(o)&&!de(s))return c?!1:(o.value=s,!0)}const i=U(t)&&Ls(n)?Number(n)e,On=e=>Reflect.getPrototypeOf(e);function Qt(e,t,n=!1,s=!1){e=e.__v_raw;const r=J(e),o=J(t);n||(Ze(t,o)&&_e(r,"get",t),_e(r,"get",o));const{has:i}=On(r),l=s?Ns:n?js:Vt;if(i.call(r,t))return l(e.get(t));if(i.call(r,o))return l(e.get(o));e!==r&&e.get(t)}function Zt(e,t=!1){const n=this.__v_raw,s=J(n),r=J(e);return t||(Ze(e,r)&&_e(s,"has",e),_e(s,"has",r)),e===r?n.has(e):n.has(e)||n.has(r)}function en(e,t=!1){return e=e.__v_raw,!t&&_e(J(e),"iterate",at),Reflect.get(e,"size",e)}function lr(e){e=J(e);const t=J(this);return On(t).has.call(t,e)||(t.add(e),je(t,"add",e,e)),this}function cr(e,t){t=J(t);const n=J(this),{has:s,get:r}=On(n);let o=s.call(n,e);o||(e=J(e),o=s.call(n,e));const i=r.call(n,e);return n.set(e,t),o?Ze(t,i)&&je(n,"set",e,t):je(n,"add",e,t),this}function ar(e){const t=J(this),{has:n,get:s}=On(t);let r=n.call(t,e);r||(e=J(e),r=n.call(t,e)),s&&s.call(t,e);const o=t.delete(e);return r&&je(t,"delete",e,void 0),o}function ur(){const e=J(this),t=e.size!==0,n=e.clear();return t&&je(e,"clear",void 0,void 0),n}function tn(e,t){return function(s,r){const o=this,i=o.__v_raw,l=J(i),c=t?Ns:e?js:Vt;return!e&&_e(l,"iterate",at),i.forEach((a,f)=>s.call(r,c(a),c(f),o))}}function nn(e,t,n){return function(...s){const r=this.__v_raw,o=J(r),i=bt(o),l=e==="entries"||e===Symbol.iterator&&i,c=e==="keys"&&i,a=r[e](...s),f=n?Ns:t?js:Vt;return!t&&_e(o,"iterate",c?hs:at),{next(){const{value:h,done:p}=a.next();return p?{value:h,done:p}:{value:l?[f(h[0]),f(h[1])]:f(h),done:p}},[Symbol.iterator](){return this}}}}function Ue(e){return function(...t){return e==="delete"?!1:e==="clear"?void 0:this}}function Xi(){const e={get(o){return Qt(this,o)},get size(){return en(this)},has:Zt,add:lr,set:cr,delete:ar,clear:ur,forEach:tn(!1,!1)},t={get(o){return Qt(this,o,!1,!0)},get size(){return en(this)},has:Zt,add:lr,set:cr,delete:ar,clear:ur,forEach:tn(!1,!0)},n={get(o){return Qt(this,o,!0)},get size(){return en(this,!0)},has(o){return Zt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!1)},s={get(o){return Qt(this,o,!0,!0)},get size(){return en(this,!0)},has(o){return Zt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=nn(o,!1,!1),n[o]=nn(o,!0,!1),t[o]=nn(o,!1,!0),s[o]=nn(o,!0,!0)}),[e,n,t,s]}const[Yi,Ji,Qi,Zi]=Xi();function $s(e,t){const n=t?e?Zi:Qi:e?Ji:Yi;return(s,r,o)=>r==="__v_isReactive"?!e:r==="__v_isReadonly"?e:r==="__v_raw"?s:Reflect.get(Y(n,r)&&r in s?n:s,r,o)}const el={get:$s(!1,!1)},tl={get:$s(!1,!0)},nl={get:$s(!0,!1)},mo=new WeakMap,_o=new WeakMap,yo=new WeakMap,sl=new WeakMap;function rl(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function ol(e){return e.__v_skip||!Object.isExtensible(e)?0:rl(Ai(e))}function In(e){return St(e)?e:Hs(e,!1,qi,el,mo)}function il(e){return Hs(e,!1,zi,tl,_o)}function Fn(e){return Hs(e,!0,Gi,nl,yo)}function Hs(e,t,n,s,r){if(!Z(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const o=r.get(e);if(o)return o;const i=ol(e);if(i===0)return e;const l=new Proxy(e,i===2?s:n);return r.set(e,l),l}function wt(e){return St(e)?wt(e.__v_raw):!!(e&&e.__v_isReactive)}function St(e){return!!(e&&e.__v_isReadonly)}function vn(e){return!!(e&&e.__v_isShallow)}function bo(e){return wt(e)||St(e)}function J(e){const t=e&&e.__v_raw;return t?J(t):e}function Ft(e){return Object.isExtensible(e)&&yn(e,"__v_skip",!0),e}const Vt=e=>Z(e)?In(e):e,js=e=>Z(e)?Fn(e):e;class vo{constructor(t,n,s,r){this.getter=t,this._setter=n,this.dep=void 0,this.__v_isRef=!0,this.__v_isReadonly=!1,this.effect=new Fs(()=>t(this._value),()=>Mt(this,this.effect._dirtyLevel===2?2:3)),this.effect.computed=this,this.effect.active=this._cacheable=!r,this.__v_isReadonly=s}get value(){const t=J(this);return(!t._cacheable||t.effect.dirty)&&Ze(t._value,t._value=t.effect.run())&&Mt(t,4),ks(t),t.effect._dirtyLevel>=2&&Mt(t,2),t._value}set value(t){this._setter(t)}get _dirty(){return this.effect.dirty}set _dirty(t){this.effect.dirty=t}}function ll(e,t,n=!1){let s,r;const o=q(e);return o?(s=e,r=xe):(s=e.get,r=e.set),new vo(s,r,o||!r,n)}function ks(e){var t;Ye&&ct&&(e=J(e),ao(ct,(t=e.dep)!=null?t:e.dep=fo(()=>e.dep=void 0,e instanceof vo?e:void 0)))}function Mt(e,t=4,n){e=J(e);const s=e.dep;s&&uo(s,t)}function de(e){return!!(e&&e.__v_isRef===!0)}function re(e){return wo(e,!1)}function Vs(e){return wo(e,!0)}function wo(e,t){return de(e)?e:new cl(e,t)}class cl{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:J(t),this._value=n?t:Vt(t)}get value(){return ks(this),this._value}set value(t){const n=this.__v_isShallow||vn(t)||St(t);t=n?t:J(t),Ze(t,this._rawValue)&&(this._rawValue=t,this._value=n?t:Vt(t),Mt(this,4))}}function Eo(e){return de(e)?e.value:e}const al={get:(e,t,n)=>Eo(Reflect.get(e,t,n)),set:(e,t,n,s)=>{const r=e[t];return de(r)&&!de(n)?(r.value=n,!0):Reflect.set(e,t,n,s)}};function Co(e){return wt(e)?e:new Proxy(e,al)}class ul{constructor(t){this.dep=void 0,this.__v_isRef=!0;const{get:n,set:s}=t(()=>ks(this),()=>Mt(this));this._get=n,this._set=s}get value(){return this._get()}set value(t){this._set(t)}}function fl(e){return new ul(e)}class dl{constructor(t,n,s){this._object=t,this._key=n,this._defaultValue=s,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}get dep(){return Di(J(this._object),this._key)}}class hl{constructor(t){this._getter=t,this.__v_isRef=!0,this.__v_isReadonly=!0}get value(){return this._getter()}}function pl(e,t,n){return de(e)?e:q(e)?new hl(e):Z(e)&&arguments.length>1?gl(e,t,n):re(e)}function gl(e,t,n){const s=e[t];return de(s)?s:new dl(e,t,n)}/** +* @vue/runtime-core v3.4.21 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/function Je(e,t,n,s){try{return s?e(...s):e()}catch(r){qt(r,t,n)}}function Se(e,t,n,s){if(q(e)){const o=Je(e,t,n,s);return o&&eo(o)&&o.catch(i=>{qt(i,t,n)}),o}const r=[];for(let o=0;o>>1,r=he[s],o=Ut(r);oMe&&he.splice(t,1)}function bl(e){U(e)?Et.push(...e):(!qe||!qe.includes(e,e.allowRecurse?ot+1:ot))&&Et.push(e),So()}function fr(e,t,n=Dt?Me+1:0){for(;nUt(n)-Ut(s));if(Et.length=0,qe){qe.push(...t);return}for(qe=t,ot=0;ote.id==null?1/0:e.id,vl=(e,t)=>{const n=Ut(e)-Ut(t);if(n===0){if(e.pre&&!t.pre)return-1;if(t.pre&&!e.pre)return 1}return n};function To(e){ps=!1,Dt=!0,he.sort(vl);try{for(Me=0;Mene(_)?_.trim():_)),h&&(r=n.map(us))}let l,c=s[l=hn(t)]||s[l=hn(Ne(t))];!c&&o&&(c=s[l=hn(ft(t))]),c&&Se(c,e,6,r);const a=s[l+"Once"];if(a){if(!e.emitted)e.emitted={};else if(e.emitted[l])return;e.emitted[l]=!0,Se(a,e,6,r)}}function Ao(e,t,n=!1){const s=t.emitsCache,r=s.get(e);if(r!==void 0)return r;const o=e.emits;let i={},l=!1;if(!q(e)){const c=a=>{const f=Ao(a,t,!0);f&&(l=!0,ce(i,f))};!n&&t.mixins.length&&t.mixins.forEach(c),e.extends&&c(e.extends),e.mixins&&e.mixins.forEach(c)}return!o&&!l?(Z(e)&&s.set(e,null),null):(U(o)?o.forEach(c=>i[c]=null):ce(i,o),Z(e)&&s.set(e,i),i)}function Nn(e,t){return!e||!Wt(t)?!1:(t=t.slice(2).replace(/Once$/,""),Y(e,t[0].toLowerCase()+t.slice(1))||Y(e,ft(t))||Y(e,t))}let le=null,$n=null;function En(e){const t=le;return le=e,$n=e&&e.type.__scopeId||null,t}function Qa(e){$n=e}function Za(){$n=null}function El(e,t=le,n){if(!t||e._n)return e;const s=(...r)=>{s._d&&Sr(-1);const o=En(t);let i;try{i=e(...r)}finally{En(o),s._d&&Sr(1)}return i};return s._n=!0,s._c=!0,s._d=!0,s}function Gn(e){const{type:t,vnode:n,proxy:s,withProxy:r,props:o,propsOptions:[i],slots:l,attrs:c,emit:a,render:f,renderCache:h,data:p,setupState:_,ctx:b,inheritAttrs:I}=e;let P,K;const B=En(e);try{if(n.shapeFlag&4){const y=r||s,F=y;P=Re(f.call(F,y,h,o,_,p,b)),K=c}else{const y=t;P=Re(y.length>1?y(o,{attrs:c,slots:l,emit:a}):y(o,null)),K=t.props?c:Cl(c)}}catch(y){jt.length=0,qt(y,e,1),P=oe(ve)}let g=P;if(K&&I!==!1){const y=Object.keys(K),{shapeFlag:F}=g;y.length&&F&7&&(i&&y.some(As)&&(K=xl(K,i)),g=et(g,K))}return n.dirs&&(g=et(g),g.dirs=g.dirs?g.dirs.concat(n.dirs):n.dirs),n.transition&&(g.transition=n.transition),P=g,En(B),P}const Cl=e=>{let t;for(const n in e)(n==="class"||n==="style"||Wt(n))&&((t||(t={}))[n]=e[n]);return t},xl=(e,t)=>{const n={};for(const s in e)(!As(s)||!(s.slice(9)in t))&&(n[s]=e[s]);return n};function Sl(e,t,n){const{props:s,children:r,component:o}=e,{props:i,children:l,patchFlag:c}=t,a=o.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&c>=0){if(c&1024)return!0;if(c&16)return s?dr(s,i,a):!!i;if(c&8){const f=t.dynamicProps;for(let h=0;he.__isSuspense;function Oo(e,t){t&&t.pendingBranch?U(e)?t.effects.push(...e):t.effects.push(e):bl(e)}const Rl=Symbol.for("v-scx"),Ll=()=>xt(Rl);function Bs(e,t){return Hn(e,null,t)}function nu(e,t){return Hn(e,null,{flush:"post"})}const sn={};function ke(e,t,n){return Hn(e,t,n)}function Hn(e,t,{immediate:n,deep:s,flush:r,once:o,onTrack:i,onTrigger:l}=ee){if(t&&o){const L=t;t=(...N)=>{L(...N),F()}}const c=ue,a=L=>s===!0?L:lt(L,s===!1?1:void 0);let f,h=!1,p=!1;if(de(e)?(f=()=>e.value,h=vn(e)):wt(e)?(f=()=>a(e),h=!0):U(e)?(p=!0,h=e.some(L=>wt(L)||vn(L)),f=()=>e.map(L=>{if(de(L))return L.value;if(wt(L))return a(L);if(q(L))return Je(L,c,2)})):q(e)?t?f=()=>Je(e,c,2):f=()=>(_&&_(),Se(e,c,3,[b])):f=xe,t&&s){const L=f;f=()=>lt(L())}let _,b=L=>{_=g.onStop=()=>{Je(L,c,4),_=g.onStop=void 0}},I;if(Xt)if(b=xe,t?n&&Se(t,c,3,[f(),p?[]:void 0,b]):f(),r==="sync"){const L=Ll();I=L.__watcherHandles||(L.__watcherHandles=[])}else return xe;let P=p?new Array(e.length).fill(sn):sn;const K=()=>{if(!(!g.active||!g.dirty))if(t){const L=g.run();(s||h||(p?L.some((N,T)=>Ze(N,P[T])):Ze(L,P)))&&(_&&_(),Se(t,c,3,[L,P===sn?void 0:p&&P[0]===sn?[]:P,b]),P=L)}else g.run()};K.allowRecurse=!!t;let B;r==="sync"?B=K:r==="post"?B=()=>ge(K,c&&c.suspense):(K.pre=!0,c&&(K.id=c.uid),B=()=>Pn(K));const g=new Fs(f,xe,B),y=io(),F=()=>{g.stop(),y&&Rs(y.effects,g)};return t?n?K():P=g.run():r==="post"?ge(g.run.bind(g),c&&c.suspense):g.run(),I&&I.push(F),F}function Ol(e,t,n){const s=this.proxy,r=ne(e)?e.includes(".")?Io(s,e):()=>s[e]:e.bind(s,s);let o;q(t)?o=t:(o=t.handler,n=t);const i=zt(this),l=Hn(r,o.bind(s),n);return i(),l}function Io(e,t){const n=t.split(".");return()=>{let s=e;for(let r=0;r0){if(n>=t)return e;n++}if(s=s||new Set,s.has(e))return e;if(s.add(e),de(e))lt(e.value,t,n,s);else if(U(e))for(let r=0;r{lt(r,t,n,s)});else if(no(e))for(const r in e)lt(e[r],t,n,s);return e}function su(e,t){if(le===null)return e;const n=Un(le)||le.proxy,s=e.dirs||(e.dirs=[]);for(let r=0;r{e.isMounted=!0}),$o(()=>{e.isUnmounting=!0}),e}const we=[Function,Array],Fo={mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:we,onEnter:we,onAfterEnter:we,onEnterCancelled:we,onBeforeLeave:we,onLeave:we,onAfterLeave:we,onLeaveCancelled:we,onBeforeAppear:we,onAppear:we,onAfterAppear:we,onAppearCancelled:we},Fl={name:"BaseTransition",props:Fo,setup(e,{slots:t}){const n=Dn(),s=Il();return()=>{const r=t.default&&Po(t.default(),!0);if(!r||!r.length)return;let o=r[0];if(r.length>1){for(const p of r)if(p.type!==ve){o=p;break}}const i=J(e),{mode:l}=i;if(s.isLeaving)return zn(o);const c=pr(o);if(!c)return zn(o);const a=gs(c,i,s,n);ms(c,a);const f=n.subTree,h=f&&pr(f);if(h&&h.type!==ve&&!it(c,h)){const p=gs(h,i,s,n);if(ms(h,p),l==="out-in")return s.isLeaving=!0,p.afterLeave=()=>{s.isLeaving=!1,n.update.active!==!1&&(n.effect.dirty=!0,n.update())},zn(o);l==="in-out"&&c.type!==ve&&(p.delayLeave=(_,b,I)=>{const P=Mo(s,h);P[String(h.key)]=h,_[Ge]=()=>{b(),_[Ge]=void 0,delete a.delayedLeave},a.delayedLeave=I})}return o}}},Ml=Fl;function Mo(e,t){const{leavingVNodes:n}=e;let s=n.get(t.type);return s||(s=Object.create(null),n.set(t.type,s)),s}function gs(e,t,n,s){const{appear:r,mode:o,persisted:i=!1,onBeforeEnter:l,onEnter:c,onAfterEnter:a,onEnterCancelled:f,onBeforeLeave:h,onLeave:p,onAfterLeave:_,onLeaveCancelled:b,onBeforeAppear:I,onAppear:P,onAfterAppear:K,onAppearCancelled:B}=t,g=String(e.key),y=Mo(n,e),F=(T,$)=>{T&&Se(T,s,9,$)},L=(T,$)=>{const E=$[1];F(T,$),U(T)?T.every(j=>j.length<=1)&&E():T.length<=1&&E()},N={mode:o,persisted:i,beforeEnter(T){let $=l;if(!n.isMounted)if(r)$=I||l;else return;T[Ge]&&T[Ge](!0);const E=y[g];E&&it(e,E)&&E.el[Ge]&&E.el[Ge](),F($,[T])},enter(T){let $=c,E=a,j=f;if(!n.isMounted)if(r)$=P||c,E=K||a,j=B||f;else return;let A=!1;const G=T[rn]=ie=>{A||(A=!0,ie?F(j,[T]):F(E,[T]),N.delayedLeave&&N.delayedLeave(),T[rn]=void 0)};$?L($,[T,G]):G()},leave(T,$){const E=String(e.key);if(T[rn]&&T[rn](!0),n.isUnmounting)return $();F(h,[T]);let j=!1;const A=T[Ge]=G=>{j||(j=!0,$(),G?F(b,[T]):F(_,[T]),T[Ge]=void 0,y[E]===e&&delete y[E])};y[E]=e,p?L(p,[T,A]):A()},clone(T){return gs(T,t,n,s)}};return N}function zn(e){if(Gt(e))return e=et(e),e.children=null,e}function pr(e){return Gt(e)?e.children?e.children[0]:void 0:e}function ms(e,t){e.shapeFlag&6&&e.component?ms(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function Po(e,t=!1,n){let s=[],r=0;for(let o=0;o1)for(let o=0;o!!e.type.__asyncLoader;/*! #__NO_SIDE_EFFECTS__ */function ru(e){q(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:s,delay:r=200,timeout:o,suspensible:i=!0,onError:l}=e;let c=null,a,f=0;const h=()=>(f++,c=null,p()),p=()=>{let _;return c||(_=c=t().catch(b=>{if(b=b instanceof Error?b:new Error(String(b)),l)return new Promise((I,P)=>{l(b,()=>I(h()),()=>P(b),f+1)});throw b}).then(b=>_!==c&&c?c:(b&&(b.__esModule||b[Symbol.toStringTag]==="Module")&&(b=b.default),a=b,b)))};return Ks({name:"AsyncComponentWrapper",__asyncLoader:p,get __asyncResolved(){return a},setup(){const _=ue;if(a)return()=>Xn(a,_);const b=B=>{c=null,qt(B,_,13,!s)};if(i&&_.suspense||Xt)return p().then(B=>()=>Xn(B,_)).catch(B=>(b(B),()=>s?oe(s,{error:B}):null));const I=re(!1),P=re(),K=re(!!r);return r&&setTimeout(()=>{K.value=!1},r),o!=null&&setTimeout(()=>{if(!I.value&&!P.value){const B=new Error(`Async component timed out after ${o}ms.`);b(B),P.value=B}},o),p().then(()=>{I.value=!0,_.parent&&Gt(_.parent.vnode)&&(_.parent.effect.dirty=!0,Pn(_.parent.update))}).catch(B=>{b(B),P.value=B}),()=>{if(I.value&&a)return Xn(a,_);if(P.value&&s)return oe(s,{error:P.value});if(n&&!K.value)return oe(n)}}})}function Xn(e,t){const{ref:n,props:s,children:r,ce:o}=t.vnode,i=oe(e,s,r);return i.ref=n,i.ce=o,delete t.vnode.ce,i}const Gt=e=>e.type.__isKeepAlive;function Pl(e,t){No(e,"a",t)}function Nl(e,t){No(e,"da",t)}function No(e,t,n=ue){const s=e.__wdc||(e.__wdc=()=>{let r=n;for(;r;){if(r.isDeactivated)return;r=r.parent}return e()});if(jn(t,s,n),n){let r=n.parent;for(;r&&r.parent;)Gt(r.parent.vnode)&&$l(s,t,n,r),r=r.parent}}function $l(e,t,n,s){const r=jn(t,e,s,!0);kn(()=>{Rs(s[t],r)},n)}function jn(e,t,n=ue,s=!1){if(n){const r=n[e]||(n[e]=[]),o=t.__weh||(t.__weh=(...i)=>{if(n.isUnmounted)return;dt();const l=zt(n),c=Se(t,n,e,i);return l(),ht(),c});return s?r.unshift(o):r.push(o),o}}const De=e=>(t,n=ue)=>(!Xt||e==="sp")&&jn(e,(...s)=>t(...s),n),Hl=De("bm"),Rt=De("m"),jl=De("bu"),kl=De("u"),$o=De("bum"),kn=De("um"),Vl=De("sp"),Dl=De("rtg"),Ul=De("rtc");function Bl(e,t=ue){jn("ec",e,t)}function ou(e,t,n,s){let r;const o=n&&n[s];if(U(e)||ne(e)){r=new Array(e.length);for(let i=0,l=e.length;it(i,l,void 0,o&&o[l]));else{const i=Object.keys(e);r=new Array(i.length);for(let l=0,c=i.length;lSn(t)?!(t.type===ve||t.type===me&&!Ho(t.children)):!0)?e:null}function lu(e,t){const n={};for(const s in e)n[t&&/[A-Z]/.test(s)?`on:${s}`:hn(s)]=e[s];return n}const _s=e=>e?ti(e)?Un(e)||e.proxy:_s(e.parent):null,Pt=ce(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>_s(e.parent),$root:e=>_s(e.root),$emit:e=>e.emit,$options:e=>Ws(e),$forceUpdate:e=>e.f||(e.f=()=>{e.effect.dirty=!0,Pn(e.update)}),$nextTick:e=>e.n||(e.n=Mn.bind(e.proxy)),$watch:e=>Ol.bind(e)}),Yn=(e,t)=>e!==ee&&!e.__isScriptSetup&&Y(e,t),Kl={get({_:e},t){const{ctx:n,setupState:s,data:r,props:o,accessCache:i,type:l,appContext:c}=e;let a;if(t[0]!=="$"){const _=i[t];if(_!==void 0)switch(_){case 1:return s[t];case 2:return r[t];case 4:return n[t];case 3:return o[t]}else{if(Yn(s,t))return i[t]=1,s[t];if(r!==ee&&Y(r,t))return i[t]=2,r[t];if((a=e.propsOptions[0])&&Y(a,t))return i[t]=3,o[t];if(n!==ee&&Y(n,t))return i[t]=4,n[t];ys&&(i[t]=0)}}const f=Pt[t];let h,p;if(f)return t==="$attrs"&&_e(e,"get",t),f(e);if((h=l.__cssModules)&&(h=h[t]))return h;if(n!==ee&&Y(n,t))return i[t]=4,n[t];if(p=c.config.globalProperties,Y(p,t))return p[t]},set({_:e},t,n){const{data:s,setupState:r,ctx:o}=e;return Yn(r,t)?(r[t]=n,!0):s!==ee&&Y(s,t)?(s[t]=n,!0):Y(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(o[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:s,appContext:r,propsOptions:o}},i){let l;return!!n[i]||e!==ee&&Y(e,i)||Yn(t,i)||(l=o[0])&&Y(l,i)||Y(s,i)||Y(Pt,i)||Y(r.config.globalProperties,i)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:Y(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}};function cu(){return Wl().slots}function Wl(){const e=Dn();return e.setupContext||(e.setupContext=si(e))}function gr(e){return U(e)?e.reduce((t,n)=>(t[n]=null,t),{}):e}let ys=!0;function ql(e){const t=Ws(e),n=e.proxy,s=e.ctx;ys=!1,t.beforeCreate&&mr(t.beforeCreate,e,"bc");const{data:r,computed:o,methods:i,watch:l,provide:c,inject:a,created:f,beforeMount:h,mounted:p,beforeUpdate:_,updated:b,activated:I,deactivated:P,beforeDestroy:K,beforeUnmount:B,destroyed:g,unmounted:y,render:F,renderTracked:L,renderTriggered:N,errorCaptured:T,serverPrefetch:$,expose:E,inheritAttrs:j,components:A,directives:G,filters:ie}=t;if(a&&Gl(a,s,null),i)for(const X in i){const k=i[X];q(k)&&(s[X]=k.bind(n))}if(r){const X=r.call(n,n);Z(X)&&(e.data=In(X))}if(ys=!0,o)for(const X in o){const k=o[X],$e=q(k)?k.bind(n,n):q(k.get)?k.get.bind(n,n):xe,Yt=!q(k)&&q(k.set)?k.set.bind(n):xe,tt=se({get:$e,set:Yt});Object.defineProperty(s,X,{enumerable:!0,configurable:!0,get:()=>tt.value,set:Oe=>tt.value=Oe})}if(l)for(const X in l)jo(l[X],s,n,X);if(c){const X=q(c)?c.call(n):c;Reflect.ownKeys(X).forEach(k=>{Zl(k,X[k])})}f&&mr(f,e,"c");function V(X,k){U(k)?k.forEach($e=>X($e.bind(n))):k&&X(k.bind(n))}if(V(Hl,h),V(Rt,p),V(jl,_),V(kl,b),V(Pl,I),V(Nl,P),V(Bl,T),V(Ul,L),V(Dl,N),V($o,B),V(kn,y),V(Vl,$),U(E))if(E.length){const X=e.exposed||(e.exposed={});E.forEach(k=>{Object.defineProperty(X,k,{get:()=>n[k],set:$e=>n[k]=$e})})}else e.exposed||(e.exposed={});F&&e.render===xe&&(e.render=F),j!=null&&(e.inheritAttrs=j),A&&(e.components=A),G&&(e.directives=G)}function Gl(e,t,n=xe){U(e)&&(e=bs(e));for(const s in e){const r=e[s];let o;Z(r)?"default"in r?o=xt(r.from||s,r.default,!0):o=xt(r.from||s):o=xt(r),de(o)?Object.defineProperty(t,s,{enumerable:!0,configurable:!0,get:()=>o.value,set:i=>o.value=i}):t[s]=o}}function mr(e,t,n){Se(U(e)?e.map(s=>s.bind(t.proxy)):e.bind(t.proxy),t,n)}function jo(e,t,n,s){const r=s.includes(".")?Io(n,s):()=>n[s];if(ne(e)){const o=t[e];q(o)&&ke(r,o)}else if(q(e))ke(r,e.bind(n));else if(Z(e))if(U(e))e.forEach(o=>jo(o,t,n,s));else{const o=q(e.handler)?e.handler.bind(n):t[e.handler];q(o)&&ke(r,o,e)}}function Ws(e){const t=e.type,{mixins:n,extends:s}=t,{mixins:r,optionsCache:o,config:{optionMergeStrategies:i}}=e.appContext,l=o.get(t);let c;return l?c=l:!r.length&&!n&&!s?c=t:(c={},r.length&&r.forEach(a=>Cn(c,a,i,!0)),Cn(c,t,i)),Z(t)&&o.set(t,c),c}function Cn(e,t,n,s=!1){const{mixins:r,extends:o}=t;o&&Cn(e,o,n,!0),r&&r.forEach(i=>Cn(e,i,n,!0));for(const i in t)if(!(s&&i==="expose")){const l=zl[i]||n&&n[i];e[i]=l?l(e[i],t[i]):t[i]}return e}const zl={data:_r,props:yr,emits:yr,methods:It,computed:It,beforeCreate:pe,created:pe,beforeMount:pe,mounted:pe,beforeUpdate:pe,updated:pe,beforeDestroy:pe,beforeUnmount:pe,destroyed:pe,unmounted:pe,activated:pe,deactivated:pe,errorCaptured:pe,serverPrefetch:pe,components:It,directives:It,watch:Yl,provide:_r,inject:Xl};function _r(e,t){return t?e?function(){return ce(q(e)?e.call(this,this):e,q(t)?t.call(this,this):t)}:t:e}function Xl(e,t){return It(bs(e),bs(t))}function bs(e){if(U(e)){const t={};for(let n=0;n1)return n&&q(t)?t.call(s&&s.proxy):t}}function ec(e,t,n,s=!1){const r={},o={};yn(o,Vn,1),e.propsDefaults=Object.create(null),Vo(e,t,r,o);for(const i in e.propsOptions[0])i in r||(r[i]=void 0);n?e.props=s?r:il(r):e.type.props?e.props=r:e.props=o,e.attrs=o}function tc(e,t,n,s){const{props:r,attrs:o,vnode:{patchFlag:i}}=e,l=J(r),[c]=e.propsOptions;let a=!1;if((s||i>0)&&!(i&16)){if(i&8){const f=e.vnode.dynamicProps;for(let h=0;h{c=!0;const[p,_]=Do(h,t,!0);ce(i,p),_&&l.push(..._)};!n&&t.mixins.length&&t.mixins.forEach(f),e.extends&&f(e.extends),e.mixins&&e.mixins.forEach(f)}if(!o&&!c)return Z(e)&&s.set(e,yt),yt;if(U(o))for(let f=0;f-1,_[1]=I<0||b-1||Y(_,"default"))&&l.push(h)}}}const a=[i,l];return Z(e)&&s.set(e,a),a}function br(e){return e[0]!=="$"&&!vt(e)}function vr(e){return e===null?"null":typeof e=="function"?e.name||"":typeof e=="object"&&e.constructor&&e.constructor.name||""}function wr(e,t){return vr(e)===vr(t)}function Er(e,t){return U(t)?t.findIndex(n=>wr(n,e)):q(t)&&wr(t,e)?0:-1}const Uo=e=>e[0]==="_"||e==="$stable",qs=e=>U(e)?e.map(Re):[Re(e)],nc=(e,t,n)=>{if(t._n)return t;const s=El((...r)=>qs(t(...r)),n);return s._c=!1,s},Bo=(e,t,n)=>{const s=e._ctx;for(const r in e){if(Uo(r))continue;const o=e[r];if(q(o))t[r]=nc(r,o,s);else if(o!=null){const i=qs(o);t[r]=()=>i}}},Ko=(e,t)=>{const n=qs(t);e.slots.default=()=>n},sc=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=J(t),yn(t,"_",n)):Bo(t,e.slots={})}else e.slots={},t&&Ko(e,t);yn(e.slots,Vn,1)},rc=(e,t,n)=>{const{vnode:s,slots:r}=e;let o=!0,i=ee;if(s.shapeFlag&32){const l=t._;l?n&&l===1?o=!1:(ce(r,t),!n&&l===1&&delete r._):(o=!t.$stable,Bo(t,r)),i=t}else t&&(Ko(e,t),i={default:1});if(o)for(const l in r)!Uo(l)&&i[l]==null&&delete r[l]};function xn(e,t,n,s,r=!1){if(U(e)){e.forEach((p,_)=>xn(p,t&&(U(t)?t[_]:t),n,s,r));return}if(Ct(s)&&!r)return;const o=s.shapeFlag&4?Un(s.component)||s.component.proxy:s.el,i=r?null:o,{i:l,r:c}=e,a=t&&t.r,f=l.refs===ee?l.refs={}:l.refs,h=l.setupState;if(a!=null&&a!==c&&(ne(a)?(f[a]=null,Y(h,a)&&(h[a]=null)):de(a)&&(a.value=null)),q(c))Je(c,l,12,[i,f]);else{const p=ne(c),_=de(c);if(p||_){const b=()=>{if(e.f){const I=p?Y(h,c)?h[c]:f[c]:c.value;r?U(I)&&Rs(I,o):U(I)?I.includes(o)||I.push(o):p?(f[c]=[o],Y(h,c)&&(h[c]=f[c])):(c.value=[o],e.k&&(f[e.k]=c.value))}else p?(f[c]=i,Y(h,c)&&(h[c]=i)):_&&(c.value=i,e.k&&(f[e.k]=i))};i?(b.id=-1,ge(b,n)):b()}}}let Be=!1;const oc=e=>e.namespaceURI.includes("svg")&&e.tagName!=="foreignObject",ic=e=>e.namespaceURI.includes("MathML"),on=e=>{if(oc(e))return"svg";if(ic(e))return"mathml"},ln=e=>e.nodeType===8;function lc(e){const{mt:t,p:n,o:{patchProp:s,createText:r,nextSibling:o,parentNode:i,remove:l,insert:c,createComment:a}}=e,f=(g,y)=>{if(!y.hasChildNodes()){n(null,g,y),wn(),y._vnode=g;return}Be=!1,h(y.firstChild,g,null,null,null),wn(),y._vnode=g,Be&&console.error("Hydration completed but contains mismatches.")},h=(g,y,F,L,N,T=!1)=>{const $=ln(g)&&g.data==="[",E=()=>I(g,y,F,L,N,$),{type:j,ref:A,shapeFlag:G,patchFlag:ie}=y;let fe=g.nodeType;y.el=g,ie===-2&&(T=!1,y.dynamicChildren=null);let V=null;switch(j){case Tt:fe!==3?y.children===""?(c(y.el=r(""),i(g),g),V=g):V=E():(g.data!==y.children&&(Be=!0,g.data=y.children),V=o(g));break;case ve:B(g)?(V=o(g),K(y.el=g.content.firstChild,g,F)):fe!==8||$?V=E():V=o(g);break;case Ht:if($&&(g=o(g),fe=g.nodeType),fe===1||fe===3){V=g;const X=!y.children.length;for(let k=0;k{T=T||!!y.dynamicChildren;const{type:$,props:E,patchFlag:j,shapeFlag:A,dirs:G,transition:ie}=y,fe=$==="input"||$==="option";if(fe||j!==-1){G&&Fe(y,null,F,"created");let V=!1;if(B(g)){V=qo(L,ie)&&F&&F.vnode.props&&F.vnode.props.appear;const k=g.content.firstChild;V&&ie.beforeEnter(k),K(k,g,F),y.el=g=k}if(A&16&&!(E&&(E.innerHTML||E.textContent))){let k=_(g.firstChild,y,g,F,L,N,T);for(;k;){Be=!0;const $e=k;k=k.nextSibling,l($e)}}else A&8&&g.textContent!==y.children&&(Be=!0,g.textContent=y.children);if(E)if(fe||!T||j&48)for(const k in E)(fe&&(k.endsWith("value")||k==="indeterminate")||Wt(k)&&!vt(k)||k[0]===".")&&s(g,k,null,E[k],void 0,void 0,F);else E.onClick&&s(g,"onClick",null,E.onClick,void 0,void 0,F);let X;(X=E&&E.onVnodeBeforeMount)&&Ee(X,F,y),G&&Fe(y,null,F,"beforeMount"),((X=E&&E.onVnodeMounted)||G||V)&&Oo(()=>{X&&Ee(X,F,y),V&&ie.enter(g),G&&Fe(y,null,F,"mounted")},L)}return g.nextSibling},_=(g,y,F,L,N,T,$)=>{$=$||!!y.dynamicChildren;const E=y.children,j=E.length;for(let A=0;A{const{slotScopeIds:$}=y;$&&(N=N?N.concat($):$);const E=i(g),j=_(o(g),y,E,F,L,N,T);return j&&ln(j)&&j.data==="]"?o(y.anchor=j):(Be=!0,c(y.anchor=a("]"),E,j),j)},I=(g,y,F,L,N,T)=>{if(Be=!0,y.el=null,T){const j=P(g);for(;;){const A=o(g);if(A&&A!==j)l(A);else break}}const $=o(g),E=i(g);return l(g),n(null,y,E,$,F,L,on(E),N),$},P=(g,y="[",F="]")=>{let L=0;for(;g;)if(g=o(g),g&&ln(g)&&(g.data===y&&L++,g.data===F)){if(L===0)return o(g);L--}return g},K=(g,y,F)=>{const L=y.parentNode;L&&L.replaceChild(g,y);let N=F;for(;N;)N.vnode.el===y&&(N.vnode.el=N.subTree.el=g),N=N.parent},B=g=>g.nodeType===1&&g.tagName.toLowerCase()==="template";return[f,h]}const ge=Oo;function cc(e){return Wo(e)}function ac(e){return Wo(e,lc)}function Wo(e,t){const n=so();n.__VUE__=!0;const{insert:s,remove:r,patchProp:o,createElement:i,createText:l,createComment:c,setText:a,setElementText:f,parentNode:h,nextSibling:p,setScopeId:_=xe,insertStaticContent:b}=e,I=(u,d,m,v=null,w=null,S=null,O=void 0,x=null,R=!!d.dynamicChildren)=>{if(u===d)return;u&&!it(u,d)&&(v=Jt(u),Oe(u,w,S,!0),u=null),d.patchFlag===-2&&(R=!1,d.dynamicChildren=null);const{type:C,ref:M,shapeFlag:D}=d;switch(C){case Tt:P(u,d,m,v);break;case ve:K(u,d,m,v);break;case Ht:u==null&&B(d,m,v,O);break;case me:A(u,d,m,v,w,S,O,x,R);break;default:D&1?F(u,d,m,v,w,S,O,x,R):D&6?G(u,d,m,v,w,S,O,x,R):(D&64||D&128)&&C.process(u,d,m,v,w,S,O,x,R,pt)}M!=null&&w&&xn(M,u&&u.ref,S,d||u,!d)},P=(u,d,m,v)=>{if(u==null)s(d.el=l(d.children),m,v);else{const w=d.el=u.el;d.children!==u.children&&a(w,d.children)}},K=(u,d,m,v)=>{u==null?s(d.el=c(d.children||""),m,v):d.el=u.el},B=(u,d,m,v)=>{[u.el,u.anchor]=b(u.children,d,m,v,u.el,u.anchor)},g=({el:u,anchor:d},m,v)=>{let w;for(;u&&u!==d;)w=p(u),s(u,m,v),u=w;s(d,m,v)},y=({el:u,anchor:d})=>{let m;for(;u&&u!==d;)m=p(u),r(u),u=m;r(d)},F=(u,d,m,v,w,S,O,x,R)=>{d.type==="svg"?O="svg":d.type==="math"&&(O="mathml"),u==null?L(d,m,v,w,S,O,x,R):$(u,d,w,S,O,x,R)},L=(u,d,m,v,w,S,O,x)=>{let R,C;const{props:M,shapeFlag:D,transition:H,dirs:W}=u;if(R=u.el=i(u.type,S,M&&M.is,M),D&8?f(R,u.children):D&16&&T(u.children,R,null,v,w,Jn(u,S),O,x),W&&Fe(u,null,v,"created"),N(R,u,u.scopeId,O,v),M){for(const Q in M)Q!=="value"&&!vt(Q)&&o(R,Q,null,M[Q],S,u.children,v,w,He);"value"in M&&o(R,"value",null,M.value,S),(C=M.onVnodeBeforeMount)&&Ee(C,v,u)}W&&Fe(u,null,v,"beforeMount");const z=qo(w,H);z&&H.beforeEnter(R),s(R,d,m),((C=M&&M.onVnodeMounted)||z||W)&&ge(()=>{C&&Ee(C,v,u),z&&H.enter(R),W&&Fe(u,null,v,"mounted")},w)},N=(u,d,m,v,w)=>{if(m&&_(u,m),v)for(let S=0;S{for(let C=R;C{const x=d.el=u.el;let{patchFlag:R,dynamicChildren:C,dirs:M}=d;R|=u.patchFlag&16;const D=u.props||ee,H=d.props||ee;let W;if(m&&nt(m,!1),(W=H.onVnodeBeforeUpdate)&&Ee(W,m,d,u),M&&Fe(d,u,m,"beforeUpdate"),m&&nt(m,!0),C?E(u.dynamicChildren,C,x,m,v,Jn(d,w),S):O||k(u,d,x,null,m,v,Jn(d,w),S,!1),R>0){if(R&16)j(x,d,D,H,m,v,w);else if(R&2&&D.class!==H.class&&o(x,"class",null,H.class,w),R&4&&o(x,"style",D.style,H.style,w),R&8){const z=d.dynamicProps;for(let Q=0;Q{W&&Ee(W,m,d,u),M&&Fe(d,u,m,"updated")},v)},E=(u,d,m,v,w,S,O)=>{for(let x=0;x{if(m!==v){if(m!==ee)for(const x in m)!vt(x)&&!(x in v)&&o(u,x,m[x],null,O,d.children,w,S,He);for(const x in v){if(vt(x))continue;const R=v[x],C=m[x];R!==C&&x!=="value"&&o(u,x,C,R,O,d.children,w,S,He)}"value"in v&&o(u,"value",m.value,v.value,O)}},A=(u,d,m,v,w,S,O,x,R)=>{const C=d.el=u?u.el:l(""),M=d.anchor=u?u.anchor:l("");let{patchFlag:D,dynamicChildren:H,slotScopeIds:W}=d;W&&(x=x?x.concat(W):W),u==null?(s(C,m,v),s(M,m,v),T(d.children||[],m,M,w,S,O,x,R)):D>0&&D&64&&H&&u.dynamicChildren?(E(u.dynamicChildren,H,m,w,S,O,x),(d.key!=null||w&&d===w.subTree)&&Gs(u,d,!0)):k(u,d,m,M,w,S,O,x,R)},G=(u,d,m,v,w,S,O,x,R)=>{d.slotScopeIds=x,u==null?d.shapeFlag&512?w.ctx.activate(d,m,v,O,R):ie(d,m,v,w,S,O,R):fe(u,d,R)},ie=(u,d,m,v,w,S,O)=>{const x=u.component=vc(u,v,w);if(Gt(u)&&(x.ctx.renderer=pt),wc(x),x.asyncDep){if(w&&w.registerDep(x,V),!u.el){const R=x.subTree=oe(ve);K(null,R,d,m)}}else V(x,u,d,m,w,S,O)},fe=(u,d,m)=>{const v=d.component=u.component;if(Sl(u,d,m))if(v.asyncDep&&!v.asyncResolved){X(v,d,m);return}else v.next=d,yl(v.update),v.effect.dirty=!0,v.update();else d.el=u.el,v.vnode=d},V=(u,d,m,v,w,S,O)=>{const x=()=>{if(u.isMounted){let{next:M,bu:D,u:H,parent:W,vnode:z}=u;{const gt=Go(u);if(gt){M&&(M.el=z.el,X(u,M,O)),gt.asyncDep.then(()=>{u.isUnmounted||x()});return}}let Q=M,te;nt(u,!1),M?(M.el=z.el,X(u,M,O)):M=z,D&&pn(D),(te=M.props&&M.props.onVnodeBeforeUpdate)&&Ee(te,W,M,z),nt(u,!0);const ae=Gn(u),Ae=u.subTree;u.subTree=ae,I(Ae,ae,h(Ae.el),Jt(Ae),u,w,S),M.el=ae.el,Q===null&&Tl(u,ae.el),H&&ge(H,w),(te=M.props&&M.props.onVnodeUpdated)&&ge(()=>Ee(te,W,M,z),w)}else{let M;const{el:D,props:H}=d,{bm:W,m:z,parent:Q}=u,te=Ct(d);if(nt(u,!1),W&&pn(W),!te&&(M=H&&H.onVnodeBeforeMount)&&Ee(M,Q,d),nt(u,!0),D&&Wn){const ae=()=>{u.subTree=Gn(u),Wn(D,u.subTree,u,w,null)};te?d.type.__asyncLoader().then(()=>!u.isUnmounted&&ae()):ae()}else{const ae=u.subTree=Gn(u);I(null,ae,m,v,u,w,S),d.el=ae.el}if(z&&ge(z,w),!te&&(M=H&&H.onVnodeMounted)){const ae=d;ge(()=>Ee(M,Q,ae),w)}(d.shapeFlag&256||Q&&Ct(Q.vnode)&&Q.vnode.shapeFlag&256)&&u.a&&ge(u.a,w),u.isMounted=!0,d=m=v=null}},R=u.effect=new Fs(x,xe,()=>Pn(C),u.scope),C=u.update=()=>{R.dirty&&R.run()};C.id=u.uid,nt(u,!0),C()},X=(u,d,m)=>{d.component=u;const v=u.vnode.props;u.vnode=d,u.next=null,tc(u,d.props,v,m),rc(u,d.children,m),dt(),fr(u),ht()},k=(u,d,m,v,w,S,O,x,R=!1)=>{const C=u&&u.children,M=u?u.shapeFlag:0,D=d.children,{patchFlag:H,shapeFlag:W}=d;if(H>0){if(H&128){Yt(C,D,m,v,w,S,O,x,R);return}else if(H&256){$e(C,D,m,v,w,S,O,x,R);return}}W&8?(M&16&&He(C,w,S),D!==C&&f(m,D)):M&16?W&16?Yt(C,D,m,v,w,S,O,x,R):He(C,w,S,!0):(M&8&&f(m,""),W&16&&T(D,m,v,w,S,O,x,R))},$e=(u,d,m,v,w,S,O,x,R)=>{u=u||yt,d=d||yt;const C=u.length,M=d.length,D=Math.min(C,M);let H;for(H=0;HM?He(u,w,S,!0,!1,D):T(d,m,v,w,S,O,x,R,D)},Yt=(u,d,m,v,w,S,O,x,R)=>{let C=0;const M=d.length;let D=u.length-1,H=M-1;for(;C<=D&&C<=H;){const W=u[C],z=d[C]=R?ze(d[C]):Re(d[C]);if(it(W,z))I(W,z,m,null,w,S,O,x,R);else break;C++}for(;C<=D&&C<=H;){const W=u[D],z=d[H]=R?ze(d[H]):Re(d[H]);if(it(W,z))I(W,z,m,null,w,S,O,x,R);else break;D--,H--}if(C>D){if(C<=H){const W=H+1,z=WH)for(;C<=D;)Oe(u[C],w,S,!0),C++;else{const W=C,z=C,Q=new Map;for(C=z;C<=H;C++){const ye=d[C]=R?ze(d[C]):Re(d[C]);ye.key!=null&&Q.set(ye.key,C)}let te,ae=0;const Ae=H-z+1;let gt=!1,er=0;const Lt=new Array(Ae);for(C=0;C=Ae){Oe(ye,w,S,!0);continue}let Ie;if(ye.key!=null)Ie=Q.get(ye.key);else for(te=z;te<=H;te++)if(Lt[te-z]===0&&it(ye,d[te])){Ie=te;break}Ie===void 0?Oe(ye,w,S,!0):(Lt[Ie-z]=C+1,Ie>=er?er=Ie:gt=!0,I(ye,d[Ie],m,null,w,S,O,x,R),ae++)}const tr=gt?uc(Lt):yt;for(te=tr.length-1,C=Ae-1;C>=0;C--){const ye=z+C,Ie=d[ye],nr=ye+1{const{el:S,type:O,transition:x,children:R,shapeFlag:C}=u;if(C&6){tt(u.component.subTree,d,m,v);return}if(C&128){u.suspense.move(d,m,v);return}if(C&64){O.move(u,d,m,pt);return}if(O===me){s(S,d,m);for(let D=0;Dx.enter(S),w);else{const{leave:D,delayLeave:H,afterLeave:W}=x,z=()=>s(S,d,m),Q=()=>{D(S,()=>{z(),W&&W()})};H?H(S,z,Q):Q()}else s(S,d,m)},Oe=(u,d,m,v=!1,w=!1)=>{const{type:S,props:O,ref:x,children:R,dynamicChildren:C,shapeFlag:M,patchFlag:D,dirs:H}=u;if(x!=null&&xn(x,null,m,u,!0),M&256){d.ctx.deactivate(u);return}const W=M&1&&H,z=!Ct(u);let Q;if(z&&(Q=O&&O.onVnodeBeforeUnmount)&&Ee(Q,d,u),M&6)xi(u.component,m,v);else{if(M&128){u.suspense.unmount(m,v);return}W&&Fe(u,null,d,"beforeUnmount"),M&64?u.type.remove(u,d,m,w,pt,v):C&&(S!==me||D>0&&D&64)?He(C,d,m,!1,!0):(S===me&&D&384||!w&&M&16)&&He(R,d,m),v&&Qs(u)}(z&&(Q=O&&O.onVnodeUnmounted)||W)&&ge(()=>{Q&&Ee(Q,d,u),W&&Fe(u,null,d,"unmounted")},m)},Qs=u=>{const{type:d,el:m,anchor:v,transition:w}=u;if(d===me){Ci(m,v);return}if(d===Ht){y(u);return}const S=()=>{r(m),w&&!w.persisted&&w.afterLeave&&w.afterLeave()};if(u.shapeFlag&1&&w&&!w.persisted){const{leave:O,delayLeave:x}=w,R=()=>O(m,S);x?x(u.el,S,R):R()}else S()},Ci=(u,d)=>{let m;for(;u!==d;)m=p(u),r(u),u=m;r(d)},xi=(u,d,m)=>{const{bum:v,scope:w,update:S,subTree:O,um:x}=u;v&&pn(v),w.stop(),S&&(S.active=!1,Oe(O,u,d,m)),x&&ge(x,d),ge(()=>{u.isUnmounted=!0},d),d&&d.pendingBranch&&!d.isUnmounted&&u.asyncDep&&!u.asyncResolved&&u.suspenseId===d.pendingId&&(d.deps--,d.deps===0&&d.resolve())},He=(u,d,m,v=!1,w=!1,S=0)=>{for(let O=S;Ou.shapeFlag&6?Jt(u.component.subTree):u.shapeFlag&128?u.suspense.next():p(u.anchor||u.el);let Bn=!1;const Zs=(u,d,m)=>{u==null?d._vnode&&Oe(d._vnode,null,null,!0):I(d._vnode||null,u,d,null,null,null,m),Bn||(Bn=!0,fr(),wn(),Bn=!1),d._vnode=u},pt={p:I,um:Oe,m:tt,r:Qs,mt:ie,mc:T,pc:k,pbc:E,n:Jt,o:e};let Kn,Wn;return t&&([Kn,Wn]=t(pt)),{render:Zs,hydrate:Kn,createApp:Ql(Zs,Kn)}}function Jn({type:e,props:t},n){return n==="svg"&&e==="foreignObject"||n==="mathml"&&e==="annotation-xml"&&t&&t.encoding&&t.encoding.includes("html")?void 0:n}function nt({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function qo(e,t){return(!e||e&&!e.pendingBranch)&&t&&!t.persisted}function Gs(e,t,n=!1){const s=e.children,r=t.children;if(U(s)&&U(r))for(let o=0;o>1,e[n[l]]0&&(t[s]=n[o-1]),n[o]=s)}}for(o=n.length,i=n[o-1];o-- >0;)n[o]=i,i=t[i];return n}function Go(e){const t=e.subTree.component;if(t)return t.asyncDep&&!t.asyncResolved?t:Go(t)}const fc=e=>e.__isTeleport,$t=e=>e&&(e.disabled||e.disabled===""),Cr=e=>typeof SVGElement<"u"&&e instanceof SVGElement,xr=e=>typeof MathMLElement=="function"&&e instanceof MathMLElement,ws=(e,t)=>{const n=e&&e.to;return ne(n)?t?t(n):null:n},dc={name:"Teleport",__isTeleport:!0,process(e,t,n,s,r,o,i,l,c,a){const{mc:f,pc:h,pbc:p,o:{insert:_,querySelector:b,createText:I,createComment:P}}=a,K=$t(t.props);let{shapeFlag:B,children:g,dynamicChildren:y}=t;if(e==null){const F=t.el=I(""),L=t.anchor=I("");_(F,n,s),_(L,n,s);const N=t.target=ws(t.props,b),T=t.targetAnchor=I("");N&&(_(T,N),i==="svg"||Cr(N)?i="svg":(i==="mathml"||xr(N))&&(i="mathml"));const $=(E,j)=>{B&16&&f(g,E,j,r,o,i,l,c)};K?$(n,L):N&&$(N,T)}else{t.el=e.el;const F=t.anchor=e.anchor,L=t.target=e.target,N=t.targetAnchor=e.targetAnchor,T=$t(e.props),$=T?n:L,E=T?F:N;if(i==="svg"||Cr(L)?i="svg":(i==="mathml"||xr(L))&&(i="mathml"),y?(p(e.dynamicChildren,y,$,r,o,i,l),Gs(e,t,!0)):c||h(e,t,$,E,r,o,i,l,!1),K)T?t.props&&e.props&&t.props.to!==e.props.to&&(t.props.to=e.props.to):cn(t,n,F,a,1);else if((t.props&&t.props.to)!==(e.props&&e.props.to)){const j=t.target=ws(t.props,b);j&&cn(t,j,null,a,0)}else T&&cn(t,L,N,a,1)}zo(t)},remove(e,t,n,s,{um:r,o:{remove:o}},i){const{shapeFlag:l,children:c,anchor:a,targetAnchor:f,target:h,props:p}=e;if(h&&o(f),i&&o(a),l&16){const _=i||!$t(p);for(let b=0;b0?Le||yt:null,pc(),Bt>0&&Le&&Le.push(e),e}function uu(e,t,n,s,r,o){return Yo(Zo(e,t,n,s,r,o,!0))}function Jo(e,t,n,s,r){return Yo(oe(e,t,n,s,r,!0))}function Sn(e){return e?e.__v_isVNode===!0:!1}function it(e,t){return e.type===t.type&&e.key===t.key}const Vn="__vInternal",Qo=({key:e})=>e??null,gn=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?ne(e)||de(e)||q(e)?{i:le,r:e,k:t,f:!!n}:e:null);function Zo(e,t=null,n=null,s=0,r=null,o=e===me?0:1,i=!1,l=!1){const c={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Qo(t),ref:t&&gn(t),scopeId:$n,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:o,patchFlag:s,dynamicProps:r,dynamicChildren:null,appContext:null,ctx:le};return l?(zs(c,n),o&128&&e.normalize(c)):n&&(c.shapeFlag|=ne(n)?8:16),Bt>0&&!i&&Le&&(c.patchFlag>0||o&6)&&c.patchFlag!==32&&Le.push(c),c}const oe=gc;function gc(e,t=null,n=null,s=0,r=null,o=!1){if((!e||e===Ro)&&(e=ve),Sn(e)){const l=et(e,t,!0);return n&&zs(l,n),Bt>0&&!o&&Le&&(l.shapeFlag&6?Le[Le.indexOf(e)]=l:Le.push(l)),l.patchFlag|=-2,l}if(Sc(e)&&(e=e.__vccOpts),t){t=mc(t);let{class:l,style:c}=t;l&&!ne(l)&&(t.class=Is(l)),Z(c)&&(bo(c)&&!U(c)&&(c=ce({},c)),t.style=Os(c))}const i=ne(e)?1:Al(e)?128:fc(e)?64:Z(e)?4:q(e)?2:0;return Zo(e,t,n,s,r,i,o,!0)}function mc(e){return e?bo(e)||Vn in e?ce({},e):e:null}function et(e,t,n=!1){const{props:s,ref:r,patchFlag:o,children:i}=e,l=t?_c(s||{},t):s;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:l,key:l&&Qo(l),ref:t&&t.ref?n&&r?U(r)?r.concat(gn(t)):[r,gn(t)]:gn(t):r,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:i,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==me?o===-1?16:o|16:o,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&et(e.ssContent),ssFallback:e.ssFallback&&et(e.ssFallback),el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce}}function ei(e=" ",t=0){return oe(Tt,null,e,t)}function fu(e,t){const n=oe(Ht,null,e);return n.staticCount=t,n}function du(e="",t=!1){return t?(Xo(),Jo(ve,null,e)):oe(ve,null,e)}function Re(e){return e==null||typeof e=="boolean"?oe(ve):U(e)?oe(me,null,e.slice()):typeof e=="object"?ze(e):oe(Tt,null,String(e))}function ze(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:et(e)}function zs(e,t){let n=0;const{shapeFlag:s}=e;if(t==null)t=null;else if(U(t))n=16;else if(typeof t=="object")if(s&65){const r=t.default;r&&(r._c&&(r._d=!1),zs(e,r()),r._c&&(r._d=!0));return}else{n=32;const r=t._;!r&&!(Vn in t)?t._ctx=le:r===3&&le&&(le.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else q(t)?(t={default:t,_ctx:le},n=32):(t=String(t),s&64?(n=16,t=[ei(t)]):n=8);e.children=t,e.shapeFlag|=n}function _c(...e){const t={};for(let n=0;nue||le;let Tn,Es;{const e=so(),t=(n,s)=>{let r;return(r=e[n])||(r=e[n]=[]),r.push(s),o=>{r.length>1?r.forEach(i=>i(o)):r[0](o)}};Tn=t("__VUE_INSTANCE_SETTERS__",n=>ue=n),Es=t("__VUE_SSR_SETTERS__",n=>Xt=n)}const zt=e=>{const t=ue;return Tn(e),e.scope.on(),()=>{e.scope.off(),Tn(t)}},Tr=()=>{ue&&ue.scope.off(),Tn(null)};function ti(e){return e.vnode.shapeFlag&4}let Xt=!1;function wc(e,t=!1){t&&Es(t);const{props:n,children:s}=e.vnode,r=ti(e);ec(e,n,r,t),sc(e,s);const o=r?Ec(e,t):void 0;return t&&Es(!1),o}function Ec(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=Ft(new Proxy(e.ctx,Kl));const{setup:s}=n;if(s){const r=e.setupContext=s.length>1?si(e):null,o=zt(e);dt();const i=Je(s,e,0,[e.props,r]);if(ht(),o(),eo(i)){if(i.then(Tr,Tr),t)return i.then(l=>{Ar(e,l,t)}).catch(l=>{qt(l,e,0)});e.asyncDep=i}else Ar(e,i,t)}else ni(e,t)}function Ar(e,t,n){q(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:Z(t)&&(e.setupState=Co(t)),ni(e,n)}let Rr;function ni(e,t,n){const s=e.type;if(!e.render){if(!t&&Rr&&!s.render){const r=s.template||Ws(e).template;if(r){const{isCustomElement:o,compilerOptions:i}=e.appContext.config,{delimiters:l,compilerOptions:c}=s,a=ce(ce({isCustomElement:o,delimiters:l},i),c);s.render=Rr(r,a)}}e.render=s.render||xe}{const r=zt(e);dt();try{ql(e)}finally{ht(),r()}}}function Cc(e){return e.attrsProxy||(e.attrsProxy=new Proxy(e.attrs,{get(t,n){return _e(e,"get","$attrs"),t[n]}}))}function si(e){const t=n=>{e.exposed=n||{}};return{get attrs(){return Cc(e)},slots:e.slots,emit:e.emit,expose:t}}function Un(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(Co(Ft(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Pt)return Pt[n](e)},has(t,n){return n in t||n in Pt}}))}function xc(e,t=!0){return q(e)?e.displayName||e.name:e.name||t&&e.__name}function Sc(e){return q(e)&&"__vccOpts"in e}const se=(e,t)=>ll(e,t,Xt);function Cs(e,t,n){const s=arguments.length;return s===2?Z(t)&&!U(t)?Sn(t)?oe(e,null,[t]):oe(e,t):oe(e,null,t):(s>3?n=Array.prototype.slice.call(arguments,2):s===3&&Sn(n)&&(n=[n]),oe(e,t,n))}const Tc="3.4.21";/** +* @vue/runtime-dom v3.4.21 +* (c) 2018-present Yuxi (Evan) You and Vue contributors +* @license MIT +**/const Ac="http://www.w3.org/2000/svg",Rc="http://www.w3.org/1998/Math/MathML",Xe=typeof document<"u"?document:null,Lr=Xe&&Xe.createElement("template"),Lc={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,s)=>{const r=t==="svg"?Xe.createElementNS(Ac,e):t==="mathml"?Xe.createElementNS(Rc,e):Xe.createElement(e,n?{is:n}:void 0);return e==="select"&&s&&s.multiple!=null&&r.setAttribute("multiple",s.multiple),r},createText:e=>Xe.createTextNode(e),createComment:e=>Xe.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>Xe.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},insertStaticContent(e,t,n,s,r,o){const i=n?n.previousSibling:t.lastChild;if(r&&(r===o||r.nextSibling))for(;t.insertBefore(r.cloneNode(!0),n),!(r===o||!(r=r.nextSibling)););else{Lr.innerHTML=s==="svg"?`${e}`:s==="mathml"?`${e}`:e;const l=Lr.content;if(s==="svg"||s==="mathml"){const c=l.firstChild;for(;c.firstChild;)l.appendChild(c.firstChild);l.removeChild(c)}t.insertBefore(l,n)}return[i?i.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}},Ke="transition",Ot="animation",Kt=Symbol("_vtc"),ri=(e,{slots:t})=>Cs(Ml,Oc(e),t);ri.displayName="Transition";const oi={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};ri.props=ce({},Fo,oi);const st=(e,t=[])=>{U(e)?e.forEach(n=>n(...t)):e&&e(...t)},Or=e=>e?U(e)?e.some(t=>t.length>1):e.length>1:!1;function Oc(e){const t={};for(const A in e)A in oi||(t[A]=e[A]);if(e.css===!1)return t;const{name:n="v",type:s,duration:r,enterFromClass:o=`${n}-enter-from`,enterActiveClass:i=`${n}-enter-active`,enterToClass:l=`${n}-enter-to`,appearFromClass:c=o,appearActiveClass:a=i,appearToClass:f=l,leaveFromClass:h=`${n}-leave-from`,leaveActiveClass:p=`${n}-leave-active`,leaveToClass:_=`${n}-leave-to`}=e,b=Ic(r),I=b&&b[0],P=b&&b[1],{onBeforeEnter:K,onEnter:B,onEnterCancelled:g,onLeave:y,onLeaveCancelled:F,onBeforeAppear:L=K,onAppear:N=B,onAppearCancelled:T=g}=t,$=(A,G,ie)=>{rt(A,G?f:l),rt(A,G?a:i),ie&&ie()},E=(A,G)=>{A._isLeaving=!1,rt(A,h),rt(A,_),rt(A,p),G&&G()},j=A=>(G,ie)=>{const fe=A?N:B,V=()=>$(G,A,ie);st(fe,[G,V]),Ir(()=>{rt(G,A?c:o),We(G,A?f:l),Or(fe)||Fr(G,s,I,V)})};return ce(t,{onBeforeEnter(A){st(K,[A]),We(A,o),We(A,i)},onBeforeAppear(A){st(L,[A]),We(A,c),We(A,a)},onEnter:j(!1),onAppear:j(!0),onLeave(A,G){A._isLeaving=!0;const ie=()=>E(A,G);We(A,h),Pc(),We(A,p),Ir(()=>{A._isLeaving&&(rt(A,h),We(A,_),Or(y)||Fr(A,s,P,ie))}),st(y,[A,ie])},onEnterCancelled(A){$(A,!1),st(g,[A])},onAppearCancelled(A){$(A,!0),st(T,[A])},onLeaveCancelled(A){E(A),st(F,[A])}})}function Ic(e){if(e==null)return null;if(Z(e))return[Qn(e.enter),Qn(e.leave)];{const t=Qn(e);return[t,t]}}function Qn(e){return Oi(e)}function We(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e[Kt]||(e[Kt]=new Set)).add(t)}function rt(e,t){t.split(/\s+/).forEach(s=>s&&e.classList.remove(s));const n=e[Kt];n&&(n.delete(t),n.size||(e[Kt]=void 0))}function Ir(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let Fc=0;function Fr(e,t,n,s){const r=e._endId=++Fc,o=()=>{r===e._endId&&s()};if(n)return setTimeout(o,n);const{type:i,timeout:l,propCount:c}=Mc(e,t);if(!i)return s();const a=i+"end";let f=0;const h=()=>{e.removeEventListener(a,p),o()},p=_=>{_.target===e&&++f>=c&&h()};setTimeout(()=>{f(n[b]||"").split(", "),r=s(`${Ke}Delay`),o=s(`${Ke}Duration`),i=Mr(r,o),l=s(`${Ot}Delay`),c=s(`${Ot}Duration`),a=Mr(l,c);let f=null,h=0,p=0;t===Ke?i>0&&(f=Ke,h=i,p=o.length):t===Ot?a>0&&(f=Ot,h=a,p=c.length):(h=Math.max(i,a),f=h>0?i>a?Ke:Ot:null,p=f?f===Ke?o.length:c.length:0);const _=f===Ke&&/\b(transform|all)(,|$)/.test(s(`${Ke}Property`).toString());return{type:f,timeout:h,propCount:p,hasTransform:_}}function Mr(e,t){for(;e.lengthPr(n)+Pr(e[s])))}function Pr(e){return e==="auto"?0:Number(e.slice(0,-1).replace(",","."))*1e3}function Pc(){return document.body.offsetHeight}function Nc(e,t,n){const s=e[Kt];s&&(t=(t?[t,...s]:[...s]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}const Nr=Symbol("_vod"),$c=Symbol("_vsh"),Hc=Symbol(""),jc=/(^|;)\s*display\s*:/;function kc(e,t,n){const s=e.style,r=ne(n);let o=!1;if(n&&!r){if(t)if(ne(t))for(const i of t.split(";")){const l=i.slice(0,i.indexOf(":")).trim();n[l]==null&&mn(s,l,"")}else for(const i in t)n[i]==null&&mn(s,i,"");for(const i in n)i==="display"&&(o=!0),mn(s,i,n[i])}else if(r){if(t!==n){const i=s[Hc];i&&(n+=";"+i),s.cssText=n,o=jc.test(n)}}else t&&e.removeAttribute("style");Nr in e&&(e[Nr]=o?s.display:"",e[$c]&&(s.display="none"))}const $r=/\s*!important$/;function mn(e,t,n){if(U(n))n.forEach(s=>mn(e,t,s));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const s=Vc(e,t);$r.test(n)?e.setProperty(ft(s),n.replace($r,""),"important"):e[s]=n}}const Hr=["Webkit","Moz","ms"],Zn={};function Vc(e,t){const n=Zn[t];if(n)return n;let s=Ne(t);if(s!=="filter"&&s in e)return Zn[t]=s;s=Ln(s);for(let r=0;res||(qc.then(()=>es=0),es=Date.now());function zc(e,t){const n=s=>{if(!s._vts)s._vts=Date.now();else if(s._vts<=n.attached)return;Se(Xc(s,n.value),t,5,[s])};return n.value=e,n.attached=Gc(),n}function Xc(e,t){if(U(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(s=>r=>!r._stopped&&s&&s(r))}else return t}const Dr=e=>e.charCodeAt(0)===111&&e.charCodeAt(1)===110&&e.charCodeAt(2)>96&&e.charCodeAt(2)<123,Yc=(e,t,n,s,r,o,i,l,c)=>{const a=r==="svg";t==="class"?Nc(e,s,a):t==="style"?kc(e,n,s):Wt(t)?As(t)||Kc(e,t,n,s,i):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Jc(e,t,s,a))?Uc(e,t,s,o,i,l,c):(t==="true-value"?e._trueValue=s:t==="false-value"&&(e._falseValue=s),Dc(e,t,s,a))};function Jc(e,t,n,s){if(s)return!!(t==="innerHTML"||t==="textContent"||t in e&&Dr(t)&&q(n));if(t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA")return!1;if(t==="width"||t==="height"){const r=e.tagName;if(r==="IMG"||r==="VIDEO"||r==="CANVAS"||r==="SOURCE")return!1}return Dr(t)&&ne(n)?!1:t in e}const Ur=e=>{const t=e.props["onUpdate:modelValue"]||!1;return U(t)?n=>pn(t,n):t};function Qc(e){e.target.composing=!0}function Br(e){const t=e.target;t.composing&&(t.composing=!1,t.dispatchEvent(new Event("input")))}const ts=Symbol("_assign"),hu={created(e,{modifiers:{lazy:t,trim:n,number:s}},r){e[ts]=Ur(r);const o=s||r.props&&r.props.type==="number";mt(e,t?"change":"input",i=>{if(i.target.composing)return;let l=e.value;n&&(l=l.trim()),o&&(l=us(l)),e[ts](l)}),n&&mt(e,"change",()=>{e.value=e.value.trim()}),t||(mt(e,"compositionstart",Qc),mt(e,"compositionend",Br),mt(e,"change",Br))},mounted(e,{value:t}){e.value=t??""},beforeUpdate(e,{value:t,modifiers:{lazy:n,trim:s,number:r}},o){if(e[ts]=Ur(o),e.composing)return;const i=r||e.type==="number"?us(e.value):e.value,l=t??"";i!==l&&(document.activeElement===e&&e.type!=="range"&&(n||s&&e.value.trim()===l)||(e.value=l))}},Zc=["ctrl","shift","alt","meta"],ea={stop:e=>e.stopPropagation(),prevent:e=>e.preventDefault(),self:e=>e.target!==e.currentTarget,ctrl:e=>!e.ctrlKey,shift:e=>!e.shiftKey,alt:e=>!e.altKey,meta:e=>!e.metaKey,left:e=>"button"in e&&e.button!==0,middle:e=>"button"in e&&e.button!==1,right:e=>"button"in e&&e.button!==2,exact:(e,t)=>Zc.some(n=>e[`${n}Key`]&&!t.includes(n))},pu=(e,t)=>{const n=e._withMods||(e._withMods={}),s=t.join(".");return n[s]||(n[s]=(r,...o)=>{for(let i=0;i{const n=e._withKeys||(e._withKeys={}),s=t.join(".");return n[s]||(n[s]=r=>{if(!("key"in r))return;const o=ft(r.key);if(t.some(i=>i===o||ta[i]===o))return e(r)})},ii=ce({patchProp:Yc},Lc);let kt,Kr=!1;function na(){return kt||(kt=cc(ii))}function sa(){return kt=Kr?kt:ac(ii),Kr=!0,kt}const mu=(...e)=>{const t=na().createApp(...e),{mount:n}=t;return t.mount=s=>{const r=ci(s);if(!r)return;const o=t._component;!q(o)&&!o.render&&!o.template&&(o.template=r.innerHTML),r.innerHTML="";const i=n(r,!1,li(r));return r instanceof Element&&(r.removeAttribute("v-cloak"),r.setAttribute("data-v-app","")),i},t},_u=(...e)=>{const t=sa().createApp(...e),{mount:n}=t;return t.mount=s=>{const r=ci(s);if(r)return n(r,!0,li(r))},t};function li(e){if(e instanceof SVGElement)return"svg";if(typeof MathMLElement=="function"&&e instanceof MathMLElement)return"mathml"}function ci(e){return ne(e)?document.querySelector(e):e}const yu="/F2E-book/images/ch19/sync.jpg",bu="/F2E-book/images/ch19/callbackhell.jpg",vu=(e,t)=>{const n=e.__vccOpts||e;for(const[s,r]of t)n[s]=r;return n},wu="/F2E-book/images/ch18/request.gif",Eu="/F2E-book/images/ch27/MVC%20Express.png",Cu="/F2E-book/images/ch12/hw.png",xu="/F2E-book/images/ch21/webhook.png",Su="/F2E-book/images/ch30/git.png",Tu="/F2E-book/images/ch30/gitbefore.jpg",Au="/F2E-book/images/ch30/gitafter.png",Ru="/F2E-book/images/ch30/github.png",Lu="/F2E-book/images/ch30/gitkraken.png",Ou="/F2E-book/images/ch22/mvvm.png",Iu="/F2E-book/images/ch22/todo.png",Fu="/F2E-book/images/ch22/components.png",Mu="/F2E-book/images/ch22/card.png",ra="modulepreload",oa=function(e){return"/F2E-book/"+e},Wr={},Pu=function(t,n,s){let r=Promise.resolve();if(n&&n.length>0){const o=document.getElementsByTagName("link"),i=document.querySelector("meta[property=csp-nonce]"),l=(i==null?void 0:i.nonce)||(i==null?void 0:i.getAttribute("nonce"));r=Promise.all(n.map(c=>{if(c=oa(c),c in Wr)return;Wr[c]=!0;const a=c.endsWith(".css"),f=a?'[rel="stylesheet"]':"";if(!!s)for(let _=o.length-1;_>=0;_--){const b=o[_];if(b.href===c&&(!a||b.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${c}"]${f}`))return;const p=document.createElement("link");if(p.rel=a?"stylesheet":ra,a||(p.as="script",p.crossOrigin=""),p.href=c,l&&p.setAttribute("nonce",l),document.head.appendChild(p),a)return new Promise((_,b)=>{p.addEventListener("load",_),p.addEventListener("error",()=>b(new Error(`Unable to preload CSS for ${c}`)))})}))}return r.then(()=>t()).catch(o=>{const i=new Event("vite:preloadError",{cancelable:!0});if(i.payload=o,window.dispatchEvent(i),!i.defaultPrevented)throw o})},ia=window.__VP_SITE_DATA__;function Xs(e){return io()?(ki(e),!0):!1}function Pe(e){return typeof e=="function"?e():Eo(e)}const ai=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const la=Object.prototype.toString,ca=e=>la.call(e)==="[object Object]",Qe=()=>{},xs=aa();function aa(){var e,t;return ai&&((e=window==null?void 0:window.navigator)==null?void 0:e.userAgent)&&(/iP(ad|hone|od)/.test(window.navigator.userAgent)||((t=window==null?void 0:window.navigator)==null?void 0:t.maxTouchPoints)>2&&/iPad|Macintosh/.test(window==null?void 0:window.navigator.userAgent))}function ua(e,t){function n(...s){return new Promise((r,o)=>{Promise.resolve(e(()=>t.apply(this,s),{fn:t,thisArg:this,args:s})).then(r).catch(o)})}return n}const ui=e=>e();function fa(e,t={}){let n,s,r=Qe;const o=l=>{clearTimeout(l),r(),r=Qe};return l=>{const c=Pe(e),a=Pe(t.maxWait);return n&&o(n),c<=0||a!==void 0&&a<=0?(s&&(o(s),s=null),Promise.resolve(l())):new Promise((f,h)=>{r=t.rejectOnCancel?h:f,a&&!s&&(s=setTimeout(()=>{n&&o(n),s=null,f(l())},a)),n=setTimeout(()=>{s&&o(s),s=null,f(l())},c)})}}function da(e=ui){const t=re(!0);function n(){t.value=!1}function s(){t.value=!0}const r=(...o)=>{t.value&&e(...o)};return{isActive:Fn(t),pause:n,resume:s,eventFilter:r}}function ha(e){return e||Dn()}function fi(...e){if(e.length!==1)return pl(...e);const t=e[0];return typeof t=="function"?Fn(fl(()=>({get:t,set:Qe}))):re(t)}function di(e,t,n={}){const{eventFilter:s=ui,...r}=n;return ke(e,ua(s,t),r)}function pa(e,t,n={}){const{eventFilter:s,...r}=n,{eventFilter:o,pause:i,resume:l,isActive:c}=da(s);return{stop:di(e,t,{...r,eventFilter:o}),pause:i,resume:l,isActive:c}}function Ys(e,t=!0,n){ha()?Rt(e,n):t?e():Mn(e)}function Nu(e,t,n={}){const{debounce:s=0,maxWait:r=void 0,...o}=n;return di(e,t,{...o,eventFilter:fa(s,{maxWait:r})})}function $u(e,t,n){let s;de(n)?s={evaluating:n}:s=n||{};const{lazy:r=!1,evaluating:o=void 0,shallow:i=!0,onError:l=Qe}=s,c=re(!r),a=i?Vs(t):re(t);let f=0;return Bs(async h=>{if(!c.value)return;f++;const p=f;let _=!1;o&&Promise.resolve().then(()=>{o.value=!0});try{const b=await e(I=>{h(()=>{o&&(o.value=!1),_||I()})});p===f&&(a.value=b)}catch(b){l(b)}finally{o&&p===f&&(o.value=!1),_=!0}}),r?se(()=>(c.value=!0,a.value)):a}function _t(e){var t;const n=Pe(e);return(t=n==null?void 0:n.$el)!=null?t:n}const Te=ai?window:void 0;function Ve(...e){let t,n,s,r;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,s,r]=e,t=Te):[t,n,s,r]=e,!t)return Qe;Array.isArray(n)||(n=[n]),Array.isArray(s)||(s=[s]);const o=[],i=()=>{o.forEach(f=>f()),o.length=0},l=(f,h,p,_)=>(f.addEventListener(h,p,_),()=>f.removeEventListener(h,p,_)),c=ke(()=>[_t(t),Pe(r)],([f,h])=>{if(i(),!f)return;const p=ca(h)?{...h}:h;o.push(...n.flatMap(_=>s.map(b=>l(f,_,b,p))))},{immediate:!0,flush:"post"}),a=()=>{c(),i()};return Xs(a),a}let qr=!1;function Hu(e,t,n={}){const{window:s=Te,ignore:r=[],capture:o=!0,detectIframe:i=!1}=n;if(!s)return Qe;xs&&!qr&&(qr=!0,Array.from(s.document.body.children).forEach(p=>p.addEventListener("click",Qe)),s.document.documentElement.addEventListener("click",Qe));let l=!0;const c=p=>r.some(_=>{if(typeof _=="string")return Array.from(s.document.querySelectorAll(_)).some(b=>b===p.target||p.composedPath().includes(b));{const b=_t(_);return b&&(p.target===b||p.composedPath().includes(b))}}),f=[Ve(s,"click",p=>{const _=_t(e);if(!(!_||_===p.target||p.composedPath().includes(_))){if(p.detail===0&&(l=!c(p)),!l){l=!0;return}t(p)}},{passive:!0,capture:o}),Ve(s,"pointerdown",p=>{const _=_t(e);l=!c(p)&&!!(_&&!p.composedPath().includes(_))},{passive:!0}),i&&Ve(s,"blur",p=>{setTimeout(()=>{var _;const b=_t(e);((_=s.document.activeElement)==null?void 0:_.tagName)==="IFRAME"&&!(b!=null&&b.contains(s.document.activeElement))&&t(p)},0)})].filter(Boolean);return()=>f.forEach(p=>p())}function ga(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function ju(...e){let t,n,s={};e.length===3?(t=e[0],n=e[1],s=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],s=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:r=Te,eventName:o="keydown",passive:i=!1,dedupe:l=!1}=s,c=ga(t);return Ve(r,o,f=>{f.repeat&&Pe(l)||c(f)&&n(f)},i)}function ma(){const e=re(!1),t=Dn();return t&&Rt(()=>{e.value=!0},t),e}function _a(e){const t=ma();return se(()=>(t.value,!!e()))}function hi(e,t={}){const{window:n=Te}=t,s=_a(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let r;const o=re(!1),i=a=>{o.value=a.matches},l=()=>{r&&("removeEventListener"in r?r.removeEventListener("change",i):r.removeListener(i))},c=Bs(()=>{s.value&&(l(),r=n.matchMedia(Pe(e)),"addEventListener"in r?r.addEventListener("change",i):r.addListener(i),o.value=r.matches)});return Xs(()=>{c(),l(),r=void 0}),o}const an=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},un="__vueuse_ssr_handlers__",ya=ba();function ba(){return un in an||(an[un]=an[un]||{}),an[un]}function pi(e,t){return ya[e]||t}function va(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"?"object":Number.isNaN(e)?"any":"number"}const wa={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}},Gr="vueuse-storage";function Js(e,t,n,s={}){var r;const{flush:o="pre",deep:i=!0,listenToStorageChanges:l=!0,writeDefaults:c=!0,mergeDefaults:a=!1,shallow:f,window:h=Te,eventFilter:p,onError:_=E=>{console.error(E)},initOnMounted:b}=s,I=(f?Vs:re)(typeof t=="function"?t():t);if(!n)try{n=pi("getDefaultStorage",()=>{var E;return(E=Te)==null?void 0:E.localStorage})()}catch(E){_(E)}if(!n)return I;const P=Pe(t),K=va(P),B=(r=s.serializer)!=null?r:wa[K],{pause:g,resume:y}=pa(I,()=>L(I.value),{flush:o,deep:i,eventFilter:p});h&&l&&Ys(()=>{Ve(h,"storage",T),Ve(h,Gr,$),b&&T()}),b||T();function F(E,j){h&&h.dispatchEvent(new CustomEvent(Gr,{detail:{key:e,oldValue:E,newValue:j,storageArea:n}}))}function L(E){try{const j=n.getItem(e);if(E==null)F(j,null),n.removeItem(e);else{const A=B.write(E);j!==A&&(n.setItem(e,A),F(j,A))}}catch(j){_(j)}}function N(E){const j=E?E.newValue:n.getItem(e);if(j==null)return c&&P!=null&&n.setItem(e,B.write(P)),P;if(!E&&a){const A=B.read(j);return typeof a=="function"?a(A,P):K==="object"&&!Array.isArray(A)?{...P,...A}:A}else return typeof j!="string"?j:B.read(j)}function T(E){if(!(E&&E.storageArea!==n)){if(E&&E.key==null){I.value=P;return}if(!(E&&E.key!==e)){g();try{(E==null?void 0:E.newValue)!==B.write(I.value)&&(I.value=N(E))}catch(j){_(j)}finally{E?Mn(y):y()}}}}function $(E){T(E.detail)}return I}function gi(e){return hi("(prefers-color-scheme: dark)",e)}function Ea(e={}){const{selector:t="html",attribute:n="class",initialValue:s="auto",window:r=Te,storage:o,storageKey:i="vueuse-color-scheme",listenToStorageChanges:l=!0,storageRef:c,emitAuto:a,disableTransition:f=!0}=e,h={auto:"",light:"light",dark:"dark",...e.modes||{}},p=gi({window:r}),_=se(()=>p.value?"dark":"light"),b=c||(i==null?fi(s):Js(i,s,o,{window:r,listenToStorageChanges:l})),I=se(()=>b.value==="auto"?_.value:b.value),P=pi("updateHTMLAttrs",(y,F,L)=>{const N=typeof y=="string"?r==null?void 0:r.document.querySelector(y):_t(y);if(!N)return;let T;if(f&&(T=r.document.createElement("style"),T.appendChild(document.createTextNode("*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}")),r.document.head.appendChild(T)),F==="class"){const $=L.split(/\s/g);Object.values(h).flatMap(E=>(E||"").split(/\s/g)).filter(Boolean).forEach(E=>{$.includes(E)?N.classList.add(E):N.classList.remove(E)})}else N.setAttribute(F,L);f&&(r.getComputedStyle(T).opacity,document.head.removeChild(T))});function K(y){var F;P(t,n,(F=h[y])!=null?F:y)}function B(y){e.onChanged?e.onChanged(y,K):K(y)}ke(I,B,{flush:"post",immediate:!0}),Ys(()=>B(I.value));const g=se({get(){return a?b.value:I.value},set(y){b.value=y}});try{return Object.assign(g,{store:b,system:_,state:I})}catch{return g}}function Ca(e={}){const{valueDark:t="dark",valueLight:n="",window:s=Te}=e,r=Ea({...e,onChanged:(l,c)=>{var a;e.onChanged?(a=e.onChanged)==null||a.call(e,l==="dark",c,l):c(l)},modes:{dark:t,light:n}}),o=se(()=>r.system?r.system.value:gi({window:s}).value?"dark":"light");return se({get(){return r.value==="dark"},set(l){const c=l?"dark":"light";o.value===c?r.value="auto":r.value=c}})}function ns(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}function ku(e,t,n={}){const{window:s=Te}=n;return Js(e,t,s==null?void 0:s.localStorage,n)}function mi(e){const t=window.getComputedStyle(e);if(t.overflowX==="scroll"||t.overflowY==="scroll"||t.overflowX==="auto"&&e.clientWidth1?!0:(t.preventDefault&&t.preventDefault(),!1)}const fn=new WeakMap;function Vu(e,t=!1){const n=re(t);let s=null;ke(fi(e),i=>{const l=ns(Pe(i));if(l){const c=l;fn.get(c)||fn.set(c,c.style.overflow),n.value&&(c.style.overflow="hidden")}},{immediate:!0});const r=()=>{const i=ns(Pe(e));!i||n.value||(xs&&(s=Ve(i,"touchmove",l=>{xa(l)},{passive:!1})),i.style.overflow="hidden",n.value=!0)},o=()=>{var i;const l=ns(Pe(e));!l||!n.value||(xs&&(s==null||s()),l.style.overflow=(i=fn.get(l))!=null?i:"",fn.delete(l),n.value=!1)};return Xs(o),se({get(){return n.value},set(i){i?r():o()}})}function Du(e,t,n={}){const{window:s=Te}=n;return Js(e,t,s==null?void 0:s.sessionStorage,n)}function Uu(e={}){const{window:t=Te,behavior:n="auto"}=e;if(!t)return{x:re(0),y:re(0)};const s=re(t.scrollX),r=re(t.scrollY),o=se({get(){return s.value},set(l){scrollTo({left:l,behavior:n})}}),i=se({get(){return r.value},set(l){scrollTo({top:l,behavior:n})}});return Ve(t,"scroll",()=>{s.value=t.scrollX,r.value=t.scrollY},{capture:!1,passive:!0}),{x:o,y:i}}function Bu(e={}){const{window:t=Te,initialWidth:n=Number.POSITIVE_INFINITY,initialHeight:s=Number.POSITIVE_INFINITY,listenOrientation:r=!0,includeScrollbar:o=!0}=e,i=re(n),l=re(s),c=()=>{t&&(o?(i.value=t.innerWidth,l.value=t.innerHeight):(i.value=t.document.documentElement.clientWidth,l.value=t.document.documentElement.clientHeight))};if(c(),Ys(c),Ve("resize",c,{passive:!0}),r){const a=hi("(orientation: portrait)");ke(a,()=>c())}return{width:i,height:l}}var ss={BASE_URL:"/F2E-book/",MODE:"production",DEV:!1,PROD:!0,SSR:!1},rs={};const _i=/^(?:[a-z]+:|\/\/)/i,Sa="vitepress-theme-appearance",Ta=/#.*$/,Aa=/[?#].*$/,Ra=/(?:(^|\/)index)?\.(?:md|html)$/,Ce=typeof document<"u",yi={relativePath:"",filePath:"",title:"404",description:"Not Found",headers:[],frontmatter:{sidebar:!1,layout:"page"},lastUpdated:0,isNotFound:!0};function La(e,t,n=!1){if(t===void 0)return!1;if(e=zr(`/${e}`),n)return new RegExp(t).test(e);if(zr(t)!==e)return!1;const s=t.match(Ta);return s?(Ce?location.hash:"")===s[0]:!0}function zr(e){return decodeURI(e).replace(Aa,"").replace(Ra,"$1")}function Oa(e){return _i.test(e)}function Ia(e,t){var s,r,o,i,l,c,a;const n=Object.keys(e.locales).find(f=>f!=="root"&&!Oa(f)&&La(t,`/${f}/`,!0))||"root";return Object.assign({},e,{localeIndex:n,lang:((s=e.locales[n])==null?void 0:s.lang)??e.lang,dir:((r=e.locales[n])==null?void 0:r.dir)??e.dir,title:((o=e.locales[n])==null?void 0:o.title)??e.title,titleTemplate:((i=e.locales[n])==null?void 0:i.titleTemplate)??e.titleTemplate,description:((l=e.locales[n])==null?void 0:l.description)??e.description,head:vi(e.head,((c=e.locales[n])==null?void 0:c.head)??[]),themeConfig:{...e.themeConfig,...(a=e.locales[n])==null?void 0:a.themeConfig}})}function bi(e,t){const n=t.title||e.title,s=t.titleTemplate??e.titleTemplate;if(typeof s=="string"&&s.includes(":title"))return s.replace(/:title/g,n);const r=Fa(e.title,s);return n===r.slice(3)?n:`${n}${r}`}function Fa(e,t){return t===!1?"":t===!0||t===void 0?` | ${e}`:e===t?"":` | ${t}`}function Ma(e,t){const[n,s]=t;if(n!=="meta")return!1;const r=Object.entries(s)[0];return r==null?!1:e.some(([o,i])=>o===n&&i[r[0]]===r[1])}function vi(e,t){return[...e.filter(n=>!Ma(t,n)),...t]}const Pa=/[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g,Na=/^[a-z]:/i;function Xr(e){const t=Na.exec(e),n=t?t[0]:"";return n+e.slice(n.length).replace(Pa,"_").replace(/(^|\/)_+(?=[^/]*$)/,"$1")}const os=new Set;function $a(e){if(os.size===0){const n=typeof process=="object"&&(rs==null?void 0:rs.VITE_EXTRA_EXTENSIONS)||(ss==null?void 0:ss.VITE_EXTRA_EXTENSIONS)||"";("3g2,3gp,aac,ai,apng,au,avif,bin,bmp,cer,class,conf,crl,css,csv,dll,doc,eps,epub,exe,gif,gz,ics,ief,jar,jpe,jpeg,jpg,js,json,jsonld,m4a,man,mid,midi,mjs,mov,mp2,mp3,mp4,mpe,mpeg,mpg,mpp,oga,ogg,ogv,ogx,opus,otf,p10,p7c,p7m,p7s,pdf,png,ps,qt,roff,rtf,rtx,ser,svg,t,tif,tiff,tr,ts,tsv,ttf,txt,vtt,wav,weba,webm,webp,woff,woff2,xhtml,xml,yaml,yml,zip"+(n&&typeof n=="string"?","+n:"")).split(",").forEach(s=>os.add(s))}const t=e.split(".").pop();return t==null||!os.has(t.toLowerCase())}function Ku(e){return e.replace(/[|\\{}()[\]^$+*?.]/g,"\\$&").replace(/-/g,"\\x2d")}const Ha=Symbol(),ut=Vs(ia);function Wu(e){const t=se(()=>Ia(ut.value,e.data.relativePath)),n=t.value.appearance,s=n==="force-dark"?re(!0):n?Ca({storageKey:Sa,initialValue:()=>typeof n=="string"?n:"auto",...typeof n=="object"?n:{}}):re(!1);return{site:t,theme:se(()=>t.value.themeConfig),page:se(()=>e.data),frontmatter:se(()=>e.data.frontmatter),params:se(()=>e.data.params),lang:se(()=>t.value.lang),dir:se(()=>e.data.frontmatter.dir||t.value.dir),localeIndex:se(()=>t.value.localeIndex||"root"),title:se(()=>bi(t.value,e.data)),description:se(()=>e.data.description||t.value.description),isDark:s}}function ja(){const e=xt(Ha);if(!e)throw new Error("vitepress data not properly injected in app");return e}function ka(e,t){return`${e}${t}`.replace(/\/+/g,"/")}function Yr(e){return _i.test(e)||!e.startsWith("/")?e:ka(ut.value.base,e)}function Va(e){let t=e.replace(/\.html$/,"");if(t=decodeURIComponent(t),t=t.replace(/\/$/,"/index"),Ce){const n="/F2E-book/";t=Xr(t.slice(n.length).replace(/\//g,"_")||"index")+".md";let s=__VP_HASH_MAP__[t.toLowerCase()];if(s||(t=t.endsWith("_index.md")?t.slice(0,-9)+".md":t.slice(0,-3)+"_index.md",s=__VP_HASH_MAP__[t.toLowerCase()]),!s)return null;t=`${n}assets/${t}.${s}.js`}else t=`./${Xr(t.slice(1).replace(/\//g,"_"))}.md.js`;return t}let _n=[];function qu(e){_n.push(e),kn(()=>{_n=_n.filter(t=>t!==e)})}function Da(){let e=ut.value.scrollOffset,t=0,n=24;if(typeof e=="object"&&"padding"in e&&(n=e.padding,e=e.selector),typeof e=="number")t=e;else if(typeof e=="string")t=Jr(e,n);else if(Array.isArray(e))for(const s of e){const r=Jr(s,n);if(r){t=r;break}}return t}function Jr(e,t){const n=document.querySelector(e);if(!n)return 0;const s=n.getBoundingClientRect().bottom;return s<0?0:s+t}const Ua=Symbol(),Ss="http://a.com",Ba=()=>({path:"/",component:null,data:yi});function Gu(e,t){const n=In(Ba()),s={route:n,go:r};async function r(l=Ce?location.href:"/"){var c,a;if(l=is(l),await((c=s.onBeforeRouteChange)==null?void 0:c.call(s,l))!==!1){if(Ce){const f=new URL(location.href);l!==is(f.href)&&(history.replaceState({scrollPosition:window.scrollY},document.title),history.pushState(null,"",l),new URL(l,Ss).hash!==f.hash&&window.dispatchEvent(new Event("hashchange")))}await i(l),await((a=s.onAfterRouteChanged)==null?void 0:a.call(s,l))}}let o=null;async function i(l,c=0,a=!1){var p;if(await((p=s.onBeforePageLoad)==null?void 0:p.call(s,l))===!1)return;const f=new URL(l,Ss),h=o=f.pathname;try{let _=await e(h);if(!_)throw new Error(`Page not found: ${h}`);if(o===h){o=null;const{default:b,__pageData:I}=_;if(!b)throw new Error(`Invalid route component: ${b}`);n.path=Ce?h:Yr(h),n.component=Ft(b),n.data=Ft(I),Ce&&Mn(()=>{let P=ut.value.base+I.relativePath.replace(/(?:(^|\/)index)?\.md$/,"$1");if(!ut.value.cleanUrls&&!P.endsWith("/")&&(P+=".html"),P!==f.pathname&&(f.pathname=P,l=P+f.search+f.hash,history.replaceState(null,"",l)),f.hash&&!c){let K=null;try{K=document.getElementById(decodeURIComponent(f.hash).slice(1))}catch(B){console.warn(B)}if(K){Qr(K,f.hash);return}}window.scrollTo(0,c)})}}catch(_){if(!/fetch|Page not found/.test(_.message)&&!/^\/404(\.html|\/)?$/.test(l)&&console.error(_),!a)try{const b=await fetch(ut.value.base+"hashmap.json");window.__VP_HASH_MAP__=await b.json(),await i(l,c,!0);return}catch{}o===h&&(o=null,n.path=Ce?h:Yr(h),n.component=t?Ft(t):null,n.data=yi)}}return Ce&&(window.addEventListener("click",l=>{if(l.target.closest("button"))return;const a=l.target.closest("a");if(a&&!a.closest(".vp-raw")&&(a instanceof SVGElement||!a.download)){const{target:f}=a,{href:h,origin:p,pathname:_,hash:b,search:I}=new URL(a.href instanceof SVGAnimatedString?a.href.animVal:a.href,a.baseURI),P=new URL(location.href);!l.ctrlKey&&!l.shiftKey&&!l.altKey&&!l.metaKey&&!f&&p===P.origin&&$a(_)&&(l.preventDefault(),_===P.pathname&&I===P.search?(b!==P.hash&&(history.pushState(null,"",h),window.dispatchEvent(new Event("hashchange"))),b?Qr(a,b,a.classList.contains("header-anchor")):window.scrollTo(0,0)):r(h))}},{capture:!0}),window.addEventListener("popstate",async l=>{var c;await i(is(location.href),l.state&&l.state.scrollPosition||0),(c=s.onAfterRouteChanged)==null||c.call(s,location.href)}),window.addEventListener("hashchange",l=>{l.preventDefault()})),s}function Ka(){const e=xt(Ua);if(!e)throw new Error("useRouter() is called without provider.");return e}function wi(){return Ka().route}function Qr(e,t,n=!1){let s=null;try{s=e.classList.contains("header-anchor")?e:document.getElementById(decodeURIComponent(t).slice(1))}catch(r){console.warn(r)}if(s){let r=function(){!n||Math.abs(i-window.scrollY)>window.innerHeight?window.scrollTo(0,i):window.scrollTo({left:0,top:i,behavior:"smooth"})};const o=parseInt(window.getComputedStyle(s).paddingTop,10),i=window.scrollY+s.getBoundingClientRect().top-Da()+o;requestAnimationFrame(r)}}function is(e){const t=new URL(e,Ss);return t.pathname=t.pathname.replace(/(^|\/)index(\.html)?$/,"$1"),ut.value.cleanUrls?t.pathname=t.pathname.replace(/\.html$/,""):!t.pathname.endsWith("/")&&!t.pathname.endsWith(".html")&&(t.pathname+=".html"),t.pathname+t.search+t.hash}const ls=()=>_n.forEach(e=>e()),zu=Ks({name:"VitePressContent",props:{as:{type:[Object,String],default:"div"}},setup(e){const t=wi(),{site:n}=ja();return()=>Cs(e.as,n.value.contentProps??{style:{position:"relative"}},[t.component?Cs(t.component,{onVnodeMounted:ls,onVnodeUpdated:ls,onVnodeUnmounted:ls}):"404 Page Not Found"])}}),Xu=Ks({setup(e,{slots:t}){const n=re(!1);return Rt(()=>{n.value=!0}),()=>n.value&&t.default?t.default():null}});function Yu(){Ce&&window.addEventListener("click",e=>{var n;const t=e.target;if(t.matches(".vp-code-group input")){const s=(n=t.parentElement)==null?void 0:n.parentElement;if(!s)return;const r=Array.from(s.querySelectorAll("input")).indexOf(t);if(r<0)return;const o=s.querySelector(".blocks");if(!o)return;const i=Array.from(o.children).find(a=>a.classList.contains("active"));if(!i)return;const l=o.children[r];if(!l||i===l)return;i.classList.remove("active"),l.classList.add("active");const c=s==null?void 0:s.querySelector(`label[for="${t.id}"]`);c==null||c.scrollIntoView({block:"nearest"})}})}function Ju(){if(Ce){const e=new WeakMap;window.addEventListener("click",t=>{var s;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const r=n.parentElement,o=(s=n.nextElementSibling)==null?void 0:s.nextElementSibling;if(!r||!o)return;const i=/language-(shellscript|shell|bash|sh|zsh)/.test(r.className),l=[".vp-copy-ignore",".diff.remove"],c=o.cloneNode(!0);c.querySelectorAll(l.join(",")).forEach(f=>f.remove());let a=c.textContent||"";i&&(a=a.replace(/^ *(\$|>) /gm,"").trim()),Wa(a).then(()=>{n.classList.add("copied"),clearTimeout(e.get(n));const f=setTimeout(()=>{n.classList.remove("copied"),n.blur(),e.delete(n)},2e3);e.set(n,f)})}})}}async function Wa(e){try{return navigator.clipboard.writeText(e)}catch{const t=document.createElement("textarea"),n=document.activeElement;t.value=e,t.setAttribute("readonly",""),t.style.contain="strict",t.style.position="absolute",t.style.left="-9999px",t.style.fontSize="12pt";const s=document.getSelection(),r=s?s.rangeCount>0&&s.getRangeAt(0):null;document.body.appendChild(t),t.select(),t.selectionStart=0,t.selectionEnd=e.length,document.execCommand("copy"),document.body.removeChild(t),r&&(s.removeAllRanges(),s.addRange(r)),n&&n.focus()}}function Qu(e,t){let n=!0,s=[];const r=o=>{if(n){n=!1,o.forEach(l=>{const c=cs(l);for(const a of document.head.children)if(a.isEqualNode(c)){s.push(a);return}});return}const i=o.map(cs);s.forEach((l,c)=>{const a=i.findIndex(f=>f==null?void 0:f.isEqualNode(l??null));a!==-1?delete i[a]:(l==null||l.remove(),delete s[c])}),i.forEach(l=>l&&document.head.appendChild(l)),s=[...s,...i].filter(Boolean)};Bs(()=>{const o=e.data,i=t.value,l=o&&o.description,c=o&&o.frontmatter.head||[],a=bi(i,o);a!==document.title&&(document.title=a);const f=l||i.description;let h=document.querySelector("meta[name=description]");h?h.getAttribute("content")!==f&&h.setAttribute("content",f):cs(["meta",{name:"description",content:f}]),r(vi(i.head,Ga(c)))})}function cs([e,t,n]){const s=document.createElement(e);for(const r in t)s.setAttribute(r,t[r]);return n&&(s.innerHTML=n),e==="script"&&!t.async&&(s.async=!1),s}function qa(e){return e[0]==="meta"&&e[1]&&e[1].name==="description"}function Ga(e){return e.filter(t=>!qa(t))}const as=new Set,Ei=()=>document.createElement("link"),za=e=>{const t=Ei();t.rel="prefetch",t.href=e,document.head.appendChild(t)},Xa=e=>{const t=new XMLHttpRequest;t.open("GET",e,t.withCredentials=!0),t.send()};let dn;const Ya=Ce&&(dn=Ei())&&dn.relList&&dn.relList.supports&&dn.relList.supports("prefetch")?za:Xa;function Zu(){if(!Ce||!window.IntersectionObserver)return;let e;if((e=navigator.connection)&&(e.saveData||/2g/.test(e.effectiveType)))return;const t=window.requestIdleCallback||setTimeout;let n=null;const s=()=>{n&&n.disconnect(),n=new IntersectionObserver(o=>{o.forEach(i=>{if(i.isIntersecting){const l=i.target;n.unobserve(l);const{pathname:c}=l;if(!as.has(c)){as.add(c);const a=Va(c);a&&Ya(a)}}})}),t(()=>{document.querySelectorAll("#app a").forEach(o=>{const{hostname:i,pathname:l}=new URL(o.href instanceof SVGAnimatedString?o.href.animVal:o.href,o.baseURI),c=l.match(/\.\w+$/);c&&c[0]!==".html"||o.target!=="_blank"&&i===location.hostname&&(l!==location.pathname?n.observe(o):as.add(l))})})};Rt(s);const r=wi();ke(()=>r.path,s),kn(()=>{n&&n.disconnect()})}export{Zl as $,kn as A,nu as B,kl as C,Da as D,eu as E,me as F,ou as G,Vs as H,qu as I,oe as J,tu as K,_i as L,wi as M,_c as N,xt as O,Bu as P,Os as Q,Hu as R,ju as S,ri as T,Mn as U,Uu as V,Fn as W,ru as X,Pu as Y,Vu as Z,vu as _,ei as a,lu as a0,gu as a1,pu as a2,cu as a3,fu as a4,yu as a5,bu as a6,wu as a7,Eu as a8,Cu as a9,$u as aA,Du as aB,ku as aC,Nu as aD,Ka as aE,Ve as aF,$o as aG,su as aH,hu as aI,de as aJ,au as aK,Ft as aL,mu as aM,Ku as aN,xu as aa,Su as ab,Tu as ac,Au as ad,Ru as ae,Lu as af,Ou as ag,Iu as ah,Fu as ai,Mu as aj,Qu as ak,Ua as al,Wu as am,Ha as an,zu as ao,Xu as ap,ut as aq,_u as ar,Gu as as,Va as at,Zu as au,Ju as av,Yu as aw,Cs as ax,_t as ay,Xs as az,Jo as b,uu as c,Ks as d,du as e,$a as f,Yr as g,re as h,Oa as i,Ce as j,se as k,Rt as l,Zo as m,Is as n,Xo as o,Eo as p,Qa as q,iu as r,Za as s,Ja as t,ja as u,La as v,El as w,hi as x,ke as y,Bs as z}; diff --git a/assets/chunks/index.1SygLY1h.js b/assets/chunks/index.1SygLY1h.js new file mode 100644 index 00000000..774f36df --- /dev/null +++ b/assets/chunks/index.1SygLY1h.js @@ -0,0 +1,11 @@ +import{g as Di}from"./theme.MrCfoCxG.js";function Hi(c,f){for(var _=0;_b[L]})}}}return Object.freeze(Object.defineProperty(c,Symbol.toStringTag,{value:"Module"}))}Array.prototype.indexOf||(Array.prototype.indexOf=function(c){if(this===null)throw new TypeError;var f=Object(this),_=f.length>>>0;if(_===0)return-1;var b=0;if(arguments.length>0&&(b=Number(arguments[1]),b!=b?b=0:b!==0&&b!=1/0&&b!=-1/0&&(b=(b>0||-1)*Math.floor(Math.abs(b)))),b>=_)return-1;for(var L=b>=0?b:Math.max(_-Math.abs(b),0);L<_;L++)if(L in f&&f[L]===c)return L;return-1});Array.prototype.lastIndexOf||(Array.prototype.lastIndexOf=function(c){if(this===null)throw new TypeError;var f=Object(this),_=f.length>>>0;if(_===0)return-1;var b=_;arguments.length>1&&(b=Number(arguments[1]),b!=b?b=0:b!==0&&b!=1/0&&b!=-1/0&&(b=(b>0||-1)*Math.floor(Math.abs(b))));for(var L=b>=0?Math.min(b,_-1):_-Math.abs(b);L>=0;L--)if(L in f&&f[L]===c)return L;return-1});String.prototype.trim||(String.prototype.trim=function(){return this.replace(/^\s+|\s+$/g,"")});var yi={exports:{}};(function(c,f){(function(_,b){c.exports=b()})(window,function(){return function(_){var b={};function L(C){if(b[C])return b[C].exports;var A=b[C]={i:C,l:!1,exports:{}};return _[C].call(A.exports,A,A.exports,L),A.l=!0,A.exports}return L.m=_,L.c=b,L.d=function(C,A,u){L.o(C,A)||Object.defineProperty(C,A,{enumerable:!0,get:u})},L.r=function(C){typeof Symbol<"u"&&Symbol.toStringTag&&Object.defineProperty(C,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(C,"__esModule",{value:!0})},L.t=function(C,A){if(1&A&&(C=L(C)),8&A||4&A&&typeof C=="object"&&C&&C.__esModule)return C;var u=Object.create(null);if(L.r(u),Object.defineProperty(u,"default",{enumerable:!0,value:C}),2&A&&typeof C!="string")for(var a in C)L.d(u,a,(function(j){return C[j]}).bind(null,a));return u},L.n=function(C){var A=C&&C.__esModule?function(){return C.default}:function(){return C};return L.d(A,"a",A),A},L.o=function(C,A){return Object.prototype.hasOwnProperty.call(C,A)},L.p="",L(L.s=1)}([function(_,b,L){var C,A;C=[L(2)],(A=(function(u){function a(t){if(a.is(t,"function"))return j?t():u.on("raphael.DOMload",t);if(a.is(t,bt))return a._engine.create[H](a,t.splice(0,3+a.is(t[0],ct))).add(t);var e=Array.prototype.slice.call(arguments,0);if(a.is(e[e.length-1],"function")){var i=e.pop();return j?i.call(a._engine.create[H](a,e)):u.on("raphael.DOMload",function(){i.call(a._engine.create[H](a,e))})}return a._engine.create[H](a,arguments)}a.version="2.3.0",a.eve=u;var j,U,I=/[, ]+/,st={circle:1,rect:1,path:1,ellipse:1,text:1,image:1},mt=/\{(\d+)\}/g,lt="hasOwnProperty",tt={doc:document,win:window},gt={was:Object.prototype[lt].call(tt.win,"Raphael"),is:tt.win.Raphael},J=function(){this.ca=this.customAttributes={}},H="apply",Y="concat",rt="ontouchstart"in window||window.TouchEvent||window.DocumentTouch&&document instanceof DocumentTouch,P="",X=" ",B=String,Z="split",at="click dblclick mousedown mousemove mouseout mouseover mouseup touchstart touchmove touchend touchcancel"[Z](X),xt={mousedown:"touchstart",mousemove:"touchmove",mouseup:"touchend"},ot=B.prototype.toLowerCase,K=Math,nt=K.max,W=K.min,wt=K.abs,kt=K.pow,_t=K.PI,ct="number",bt="array",jt=Object.prototype.toString,l=(a._ISURL=/^url\(['"]?(.+?)['"]?\)$/i,/^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgba?\(\s*([\d\.]+%?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+%?(?:\s*,\s*[\d\.]+%?)?)\s*\)|hsba?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsla?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\))\s*$/i),o={NaN:1,Infinity:1,"-Infinity":1},s=/^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,p=K.round,y=parseFloat,v=parseInt,w=B.prototype.toUpperCase,O=a._availableAttrs={"arrow-end":"none","arrow-start":"none",blur:0,"clip-rect":"0 0 1e9 1e9",cursor:"default",cx:0,cy:0,fill:"#fff","fill-opacity":1,font:'10px "Arial"',"font-family":'"Arial"',"font-size":"10","font-style":"normal","font-weight":400,gradient:0,height:0,href:"http://raphaeljs.com/","letter-spacing":0,opacity:1,path:"M0,0",r:0,rx:0,ry:0,src:"",stroke:"#000","stroke-dasharray":"","stroke-linecap":"butt","stroke-linejoin":"butt","stroke-miterlimit":0,"stroke-opacity":1,"stroke-width":1,target:"_blank","text-anchor":"middle",title:"Raphael",transform:"",width:0,x:0,y:0,class:""},k=a._availableAnimAttrs={blur:ct,"clip-rect":"csv",cx:ct,cy:ct,fill:"colour","fill-opacity":ct,"font-size":ct,height:ct,opacity:ct,path:"path",r:ct,rx:ct,ry:ct,stroke:"colour","stroke-opacity":ct,"stroke-width":ct,transform:"transform",width:ct,x:ct,y:ct},M=/[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/,Q={hs:1,rg:1},D=/,?([achlmqrstvxz]),?/gi,it=/([achlmrqstvz])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi,pt=/([rstm])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi,dt=/(-?\d*\.?\d*(?:e[\-+]?\d+)?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/gi,ut=(a._radial_gradient=/^r(?:\(([^,]+?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*([^\)]+?)\))?/,{}),At=function(t,e){return y(t)-y(e)},Lt=function(t){return t},ft=a._rectPath=function(t,e,i,r,n){return n?[["M",t+n,e],["l",i-2*n,0],["a",n,n,0,0,1,n,n],["l",0,r-2*n],["a",n,n,0,0,1,-n,n],["l",2*n-i,0],["a",n,n,0,0,1,-n,-n],["l",0,2*n-r],["a",n,n,0,0,1,n,-n],["z"]]:[["M",t,e],["l",i,0],["l",0,r],["l",-i,0],["z"]]},Tt=function(t,e,i,r){return r==null&&(r=i),[["M",t,e],["m",0,-r],["a",i,r,0,1,1,0,2*r],["a",i,r,0,1,1,0,-2*r],["z"]]},Et=a._getPath={path:function(t){return t.attr("path")},circle:function(t){var e=t.attrs;return Tt(e.cx,e.cy,e.r)},ellipse:function(t){var e=t.attrs;return Tt(e.cx,e.cy,e.rx,e.ry)},rect:function(t){var e=t.attrs;return ft(e.x,e.y,e.width,e.height,e.r)},image:function(t){var e=t.attrs;return ft(e.x,e.y,e.width,e.height)},text:function(t){var e=t._getBBox();return ft(e.x,e.y,e.width,e.height)},set:function(t){var e=t._getBBox();return ft(e.x,e.y,e.width,e.height)}},Ot=a.mapPath=function(t,e){if(!e)return t;var i,r,n,h,g,d,x;for(n=0,g=(t=ke(t)).length;n',(Mt=Yt.firstChild).style.behavior="url(#default#VML)",!Mt||typeof Mt.adj!="object")return a.type=P;Yt=null}function Xt(t){if(typeof t=="function"||Object(t)!==t)return t;var e=new t.constructor;for(var i in t)t[lt](i)&&(e[i]=Xt(t[i]));return e}a.svg=!(a.vml=a.type=="VML"),a._Paper=J,a.fn=U=J.prototype=a.prototype,a._id=0,a.is=function(t,e){return(e=ot.call(e))=="finite"?!o[lt](+t):e=="array"?t instanceof Array:e=="null"&&t===null||e==typeof t&&t!==null||e=="object"&&t===Object(t)||e=="array"&&Array.isArray&&Array.isArray(t)||jt.call(t).slice(8,-1).toLowerCase()==e},a.angle=function(t,e,i,r,n,h){if(n==null){var g=t-i,d=e-r;return g||d?(180+180*K.atan2(-d,-g)/_t+360)%360:0}return a.angle(t,e,n,h)-a.angle(i,r,n,h)},a.rad=function(t){return t%360*_t/180},a.deg=function(t){return Math.round(180*t/_t%360*1e3)/1e3},a.snapTo=function(t,e,i){if(i=a.is(i,"finite")?i:10,a.is(t,bt)){for(var r=t.length;r--;)if(wt(t[r]-e)<=i)return t[r]}else{var n=e%(t=+t);if(nt-i)return e-n+t}return e};var Wt,me;a.createUUID=(Wt=/[xy]/g,me=function(t){var e=16*K.random()|0;return(t=="x"?e:3&e|8).toString(16)},function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(Wt,me).toUpperCase()}),a.setWindow=function(t){u("raphael.setWindow",a,tt.win,t),tt.win=t,tt.doc=tt.win.document,a._engine.initWin&&a._engine.initWin(tt.win)};var Qt=function(t){if(a.vml){var e,i=/^\s+|\s+$/g;try{var r=new ActiveXObject("htmlfile");r.write(""),r.close(),e=r.body}catch{e=createPopup().document.body}var n=e.createTextRange();Qt=It(function(g){try{e.style.color=B(g).replace(i,P);var d=n.queryCommandValue("ForeColor");return"#"+("000000"+(d=(255&d)<<16|65280&d|(16711680&d)>>>16).toString(16)).slice(-6)}catch{return"none"}})}else{var h=tt.doc.createElement("i");h.title="Raphaël Colour Picker",h.style.display="none",tt.doc.body.appendChild(h),Qt=It(function(g){return h.style.color=g,tt.doc.defaultView.getComputedStyle(h,P).getPropertyValue("color")})}return Qt(t)},ae=function(){return"hsb("+[this.h,this.s,this.b]+")"},oe=function(){return"hsl("+[this.h,this.s,this.l]+")"},_e=function(){return this.hex},he=function(t,e,i){if(e==null&&a.is(t,"object")&&"r"in t&&"g"in t&&"b"in t&&(i=t.b,e=t.g,t=t.r),e==null&&a.is(t,"string")){var r=a.getRGB(t);t=r.r,e=r.g,i=r.b}return(t>1||e>1||i>1)&&(t/=255,e/=255,i/=255),[t,e,i]},Ee=function(t,e,i,r){var n={r:t*=255,g:e*=255,b:i*=255,hex:a.rgb(t,e,i),toString:_e};return a.is(r,"finite")&&(n.opacity=r),n};function It(t,e,i){return function r(){var n=Array.prototype.slice.call(arguments,0),h=n.join("␀"),g=r.cache=r.cache||{},d=r.count=r.count||[];return g[lt](h)?(function(x,m){for(var T=0,$=x.length;T<$;T++)if(x[T]===m)return x.push(x.splice(T,1)[0])}(d,h),i?i(g[h]):g[h]):(d.length>=1e3&&delete g[d.shift()],d.push(h),g[h]=t[H](e,n),i?i(g[h]):g[h])}}a.color=function(t){var e;return a.is(t,"object")&&"h"in t&&"s"in t&&"b"in t?(e=a.hsb2rgb(t),t.r=e.r,t.g=e.g,t.b=e.b,t.hex=e.hex):a.is(t,"object")&&"h"in t&&"s"in t&&"l"in t?(e=a.hsl2rgb(t),t.r=e.r,t.g=e.g,t.b=e.b,t.hex=e.hex):(a.is(t,"string")&&(t=a.getRGB(t)),a.is(t,"object")&&"r"in t&&"g"in t&&"b"in t?(e=a.rgb2hsl(t),t.h=e.h,t.s=e.s,t.l=e.l,e=a.rgb2hsb(t),t.v=e.b):(t={hex:"none"}).r=t.g=t.b=t.h=t.s=t.v=t.l=-1),t.toString=_e,t},a.hsb2rgb=function(t,e,i,r){var n,h,g,d,x;return this.is(t,"object")&&"h"in t&&"s"in t&&"b"in t&&(i=t.b,e=t.s,r=t.o,t=t.h),d=(x=i*e)*(1-wt((t=(t*=360)%360/60)%2-1)),n=h=g=i-x,Ee(n+=[x,d,0,0,d,x][t=~~t],h+=[d,x,x,d,0,0][t],g+=[0,0,d,x,x,d][t],r)},a.hsl2rgb=function(t,e,i,r){var n,h,g,d,x;return this.is(t,"object")&&"h"in t&&"s"in t&&"l"in t&&(i=t.l,e=t.s,t=t.h),(t>1||e>1||i>1)&&(t/=360,e/=100,i/=100),d=(x=2*e*(i<.5?i:1-i))*(1-wt((t=(t*=360)%360/60)%2-1)),n=h=g=i-x/2,Ee(n+=[x,d,0,0,d,x][t=~~t],h+=[d,x,x,d,0,0][t],g+=[0,0,d,x,x,d][t],r)},a.rgb2hsb=function(t,e,i){var r,n;return t=(i=he(t,e,i))[0],e=i[1],i=i[2],{h:(((n=(r=nt(t,e,i))-W(t,e,i))==0?null:r==t?(e-i)/n:r==e?(i-t)/n+2:(t-e)/n+4)+360)%6*60/360,s:n==0?0:n/r,b:r,toString:ae}},a.rgb2hsl=function(t,e,i){var r,n,h,g;return t=(i=he(t,e,i))[0],e=i[1],i=i[2],r=((n=nt(t,e,i))+(h=W(t,e,i)))/2,{h:(((g=n-h)==0?null:n==t?(e-i)/g:n==e?(i-t)/g+2:(t-e)/g+4)+360)%6*60/360,s:g==0?0:r<.5?g/(2*r):g/(2-2*r),l:r,toString:oe}},a._path2string=function(){return this.join(",").replace(D,"$1")},a._preload=function(t,e){var i=tt.doc.createElement("img");i.style.cssText="position:absolute;left:-9999em;top:-9999em",i.onload=function(){e.call(this),this.onload=null,tt.doc.body.removeChild(this)},i.onerror=function(){tt.doc.body.removeChild(this)},tt.doc.body.appendChild(i),i.src=t};function Zt(){return this.hex}function le(t,e){for(var i=[],r=0,n=t.length;n-2*!e>r;r+=2){var h=[{x:+t[r-2],y:+t[r-1]},{x:+t[r],y:+t[r+1]},{x:+t[r+2],y:+t[r+3]},{x:+t[r+4],y:+t[r+5]}];e?r?n-4==r?h[3]={x:+t[0],y:+t[1]}:n-2==r&&(h[2]={x:+t[0],y:+t[1]},h[3]={x:+t[2],y:+t[3]}):h[0]={x:+t[n-2],y:+t[n-1]}:n-4==r?h[3]=h[2]:r||(h[0]={x:+t[r],y:+t[r+1]}),i.push(["C",(-h[0].x+6*h[1].x+h[2].x)/6,(-h[0].y+6*h[1].y+h[2].y)/6,(h[1].x+6*h[2].x-h[3].x)/6,(h[1].y+6*h[2].y-h[3].y)/6,h[2].x,h[2].y])}return i}a.getRGB=It(function(t){if(!t||(t=B(t)).indexOf("-")+1)return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:Zt};if(t=="none")return{r:-1,g:-1,b:-1,hex:"none",toString:Zt};!Q[lt](t.toLowerCase().substring(0,2))&&t.charAt()!="#"&&(t=Qt(t));var e,i,r,n,h,g,d=t.match(l);return d?(d[2]&&(r=v(d[2].substring(5),16),i=v(d[2].substring(3,5),16),e=v(d[2].substring(1,3),16)),d[3]&&(r=v((h=d[3].charAt(3))+h,16),i=v((h=d[3].charAt(2))+h,16),e=v((h=d[3].charAt(1))+h,16)),d[4]&&(g=d[4][Z](M),e=y(g[0]),g[0].slice(-1)=="%"&&(e*=2.55),i=y(g[1]),g[1].slice(-1)=="%"&&(i*=2.55),r=y(g[2]),g[2].slice(-1)=="%"&&(r*=2.55),d[1].toLowerCase().slice(0,4)=="rgba"&&(n=y(g[3])),g[3]&&g[3].slice(-1)=="%"&&(n/=100)),d[5]?(g=d[5][Z](M),e=y(g[0]),g[0].slice(-1)=="%"&&(e*=2.55),i=y(g[1]),g[1].slice(-1)=="%"&&(i*=2.55),r=y(g[2]),g[2].slice(-1)=="%"&&(r*=2.55),(g[0].slice(-3)=="deg"||g[0].slice(-1)=="°")&&(e/=360),d[1].toLowerCase().slice(0,4)=="hsba"&&(n=y(g[3])),g[3]&&g[3].slice(-1)=="%"&&(n/=100),a.hsb2rgb(e,i,r,n)):d[6]?(g=d[6][Z](M),e=y(g[0]),g[0].slice(-1)=="%"&&(e*=2.55),i=y(g[1]),g[1].slice(-1)=="%"&&(i*=2.55),r=y(g[2]),g[2].slice(-1)=="%"&&(r*=2.55),(g[0].slice(-3)=="deg"||g[0].slice(-1)=="°")&&(e/=360),d[1].toLowerCase().slice(0,4)=="hsla"&&(n=y(g[3])),g[3]&&g[3].slice(-1)=="%"&&(n/=100),a.hsl2rgb(e,i,r,n)):((d={r:e,g:i,b:r,toString:Zt}).hex="#"+(16777216|r|i<<8|e<<16).toString(16).slice(1),a.is(n,"finite")&&(d.opacity=n),d)):{r:-1,g:-1,b:-1,hex:"none",error:1,toString:Zt}},a),a.hsb=It(function(t,e,i){return a.hsb2rgb(t,e,i).hex}),a.hsl=It(function(t,e,i){return a.hsl2rgb(t,e,i).hex}),a.rgb=It(function(t,e,i){function r(n){return n+.5|0}return"#"+(16777216|r(i)|r(e)<<8|r(t)<<16).toString(16).slice(1)}),a.getColor=function(t){var e=this.getColor.start=this.getColor.start||{h:0,s:1,b:t||.75},i=this.hsb2rgb(e.h,e.s,e.b);return e.h+=.075,e.h>1&&(e.h=0,e.s-=.2,e.s<=0&&(this.getColor.start={h:0,s:1,b:e.b})),i.hex},a.getColor.reset=function(){delete this.start},a.parsePathString=function(t){if(!t)return null;var e=St(t);if(e.arr)return Rt(e.arr);var i={a:7,c:6,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,z:0},r=[];return a.is(t,bt)&&a.is(t[0],bt)&&(r=Rt(t)),r.length||B(t).replace(it,function(n,h,g){var d=[],x=h.toLowerCase();if(g.replace(dt,function(m,T){T&&d.push(+T)}),x=="m"&&d.length>2&&(r.push([h][Y](d.splice(0,2))),x="l",h=h=="m"?"l":"L"),x=="r")r.push([h][Y](d));else for(;d.length>=i[x]&&(r.push([h][Y](d.splice(0,i[x]))),i[x]););}),r.toString=a._path2string,e.arr=Rt(r),r},a.parseTransformString=It(function(t){if(!t)return null;var e=[];return a.is(t,bt)&&a.is(t[0],bt)&&(e=Rt(t)),e.length||B(t).replace(pt,function(i,r,n){var h=[];ot.call(r),n.replace(dt,function(g,d){d&&h.push(+d)}),e.push([r][Y](h))}),e.toString=a._path2string,e},this,function(t){if(!t)return t;for(var e=[],i=0;i1?1:x<0?0:x)/2,T=[-.1252,.1252,-.3678,.3678,-.5873,.5873,-.7699,.7699,-.9041,.9041,-.9816,.9816],$=[.2491,.2491,.2335,.2335,.2032,.2032,.1601,.1601,.1069,.1069,.0472,.0472],F=0,E=0;E<12;E++){var N=m*T[E]+m,S=fe(N,t,i,n,g),R=fe(N,e,r,h,d),z=S*S+R*R;F+=$[E]*K.sqrt(z)}return m*F}function be(t,e,i,r,n,h,g,d){if(!(nt(t,i)nt(n,g)||nt(e,r)nt(h,d))){var x=(t-i)*(h-d)-(e-r)*(n-g);if(x){var m=((t*r-e*i)*(n-g)-(t-i)*(n*d-h*g))/x,T=((t*r-e*i)*(h-d)-(e-r)*(n*d-h*g))/x,$=+m.toFixed(2),F=+T.toFixed(2);if(!($<+W(t,i).toFixed(2)||$>+nt(t,i).toFixed(2)||$<+W(n,g).toFixed(2)||$>+nt(n,g).toFixed(2)||F<+W(e,r).toFixed(2)||F>+nt(e,r).toFixed(2)||F<+W(h,d).toFixed(2)||F>+nt(h,d).toFixed(2)))return{x:m,y:T}}}}function ue(t,e,i){var r=a.bezierBBox(t),n=a.bezierBBox(e);if(!a.isBBoxIntersect(r,n))return i?0:[];for(var h=Vt.apply(0,t),g=Vt.apply(0,e),d=nt(~~(h/5),1),x=nt(~~(g/5),1),m=[],T=[],$={},F=i?0:[],E=0;E=0&&ht<=1.001&&vt>=0&&vt<=1.001&&(i?F++:F.push({x:yt.x,y:yt.y,t1:W(ht,1),t2:W(vt,1)}))}}return F}function we(t,e,i){t=a._path2curve(t),e=a._path2curve(e);for(var r,n,h,g,d,x,m,T,$,F,E=i?0:[],N=0,S=t.length;Net||z=t.x&&e<=t.x2&&i>=t.y&&i<=t.y2},a.isBBoxIntersect=function(t,e){var i=a.isPointInsideBBox;return i(e,t.x,t.y)||i(e,t.x2,t.y)||i(e,t.x,t.y2)||i(e,t.x2,t.y2)||i(t,e.x,e.y)||i(t,e.x2,e.y)||i(t,e.x,e.y2)||i(t,e.x2,e.y2)||(t.xe.x||e.xt.x)&&(t.ye.y||e.yt.y)},a.pathIntersection=function(t,e){return we(t,e)},a.pathIntersectionNumber=function(t,e){return we(t,e,1)},a.isPointInsidePath=function(t,e,i){var r=a.pathBBox(t);return a.isPointInsideBBox(r,e,i)&&we(t,[["M",e,i],["H",r.x2+10]],1)%2==1},a._removedFactory=function(t){return function(){u("raphael.log",null,"Raphaël: you are calling to method “"+t+"” of removed object",t)}};var Jt=a.pathBBox=function(t){var e=St(t);if(e.bbox)return Xt(e.bbox);if(!t)return{x:0,y:0,width:0,height:0,x2:0,y2:0};for(var i,r=0,n=0,h=[],g=[],d=0,x=(t=ke(t)).length;d1&&(i*=z=K.sqrt(z),r*=z);var et=i*i,V=r*r,q=(h==g?-1:1)*K.sqrt(wt((et*V-et*R*R-V*S*S)/(et*R*R+V*S*S))),G=q*i*R/r+(t+d)/2,yt=q*-r*S/i+(e+x)/2,ht=K.asin(((e-yt)/r).toFixed(9)),vt=K.asin(((x-yt)/r).toFixed(9));(ht=tvt&&(ht-=2*_t),!g&&vt>ht&&(vt-=2*_t)}var ge=vt-ht;if(wt(ge)>$){var Ce=vt,$t=d,Gt=x;vt=ht+$*(g&&vt>ht?1:-1),d=G+i*K.cos(vt),x=yt+r*K.sin(vt),E=Te(d,x,i,r,n,0,g,$t,Gt,[vt,Ce,G,yt])}ge=vt-ht;var xe=K.cos(ht),ye=K.sin(ht),Fe=K.cos(vt),Dt=K.sin(vt),se=K.tan(ge/4),Ie=4/3*i*se,fi=4/3*r*se,ui=[t,e],ve=[t+Ie*ye,e-fi*xe],ci=[d+Ie*Dt,x-fi*Fe],pi=[d,x];if(ve[0]=2*ui[0]-ve[0],ve[1]=2*ui[1]-ve[1],m)return[ve,ci,pi][Y](E);for(var di=[],ee=0,qi=(E=[ve,ci,pi][Y](E).join()[Z](",")).length;ee"1e12"&&(F=.5),wt(E)>"1e12"&&(E=.5),F>0&&F<1&&(x=ie(t,e,i,r,n,h,g,d,F),S.push(x.x),N.push(x.y)),E>0&&E<1&&(x=ie(t,e,i,r,n,h,g,d,E),S.push(x.x),N.push(x.y)),m=h-2*r+e-(d-2*h+r),$=e-r,F=(-(T=2*(r-e)-2*(h-r))+K.sqrt(T*T-4*m*$))/2/m,E=(-T-K.sqrt(T*T-4*m*$))/2/m,wt(F)>"1e12"&&(F=.5),wt(E)>"1e12"&&(E=.5),F>0&&F<1&&(x=ie(t,e,i,r,n,h,g,d,F),S.push(x.x),N.push(x.y)),E>0&&E<1&&(x=ie(t,e,i,r,n,h,g,d,E),S.push(x.x),N.push(x.y)),{min:{x:W[H](0,S),y:W[H](0,N)},max:{x:nt[H](0,S),y:nt[H](0,N)}}}),ke=a._path2curve=It(function(t,e){var i=!e&&St(t);if(!e&&i.curve)return Rt(i.curve);for(var r=ce(t),n=e&&ce(e),h={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},g={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},d=function(q,G,yt){var ht,vt;if(!q)return["C",G.x,G.y,G.x,G.y,G.x,G.y];switch(!(q[0]in{T:1,Q:1})&&(G.qx=G.qy=null),q[0]){case"M":G.X=q[1],G.Y=q[2];break;case"A":q=["C"][Y](Te[H](0,[G.x,G.y][Y](q.slice(1))));break;case"S":yt=="C"||yt=="S"?(ht=2*G.x-G.bx,vt=2*G.y-G.by):(ht=G.x,vt=G.y),q=["C",ht,vt][Y](q.slice(1));break;case"T":yt=="Q"||yt=="T"?(G.qx=2*G.x-G.qx,G.qy=2*G.y-G.qy):(G.qx=G.x,G.qy=G.y),q=["C"][Y](Kt(G.x,G.y,G.qx,G.qy,q[1],q[2]));break;case"Q":G.qx=q[1],G.qy=q[2],q=["C"][Y](Kt(G.x,G.y,q[1],q[2],q[3],q[4]));break;case"L":q=["C"][Y](pe(G.x,G.y,q[1],q[2]));break;case"H":q=["C"][Y](pe(G.x,G.y,q[1],G.y));break;case"V":q=["C"][Y](pe(G.x,G.y,G.x,q[1]));break;case"Z":q=["C"][Y](pe(G.x,G.y,G.X,G.Y))}return q},x=function(q,G){if(q[G].length>7){q[G].shift();for(var yt=q[G];yt.length;)T[G]="A",n&&($[G]="A"),q.splice(G++,0,["C"][Y](yt.splice(0,6)));q.splice(G,1),S=nt(r.length,n&&n.length||0)}},m=function(q,G,yt,ht,vt){q&&G&&q[vt][0]=="M"&&G[vt][0]!="M"&&(G.splice(vt,0,["M",ht.x,ht.y]),yt.bx=0,yt.by=0,yt.x=q[vt][1],yt.y=q[vt][2],S=nt(r.length,n&&n.length||0))},T=[],$=[],F="",E="",N=0,S=nt(r.length,n&&n.length||0);N.01;)et=Vt(m,T,$,F,E,N,S,R,q+=(etr){if(e&&!$.start){if(T+=["C"+(m=Ve(h,g,d[1],d[2],d[3],d[4],d[5],d[6],r-F)).start.x,m.start.y,m.m.x,m.m.y,m.x,m.y],n)return T;$.start=T,T=["M"+m.x,m.y+"C"+m.n.x,m.n.y,m.end.x,m.end.y,d[5],d[6]].join(),F+=x,h=+d[5],g=+d[6];continue}if(!t&&!e)return{x:(m=Ve(h,g,d[1],d[2],d[3],d[4],d[5],d[6],r-F)).x,y:m.y,alpha:m.alpha}}F+=x,h=+d[5],g=+d[6]}T+=d.shift()+d}return $.end=T,(m=t?F:e?$:a.findDotsAtSegment(h,g,d[0],d[1],d[2],d[3],d[4],d[5],1)).alpha&&(m={x:m.x,y:m.y,alpha:m.alpha}),m}},ri=Ge(1),ni=Ge(),Ue=Ge(0,1);a.getTotalLength=ri,a.getPointAtLength=ni,a.getSubpath=function(t,e,i){if(this.getTotalLength(t)-i<1e-6)return Ue(t,e).end;var r=Ue(t,i,1);return e?Ue(r,e).end:r},Ct.getTotalLength=function(){var t=this.getPath();if(t)return this.node.getTotalLength?this.node.getTotalLength():ri(t)},Ct.getPointAtLength=function(t){var e=this.getPath();if(e)return ni(e,t)},Ct.getPath=function(){var t,e=a._getPath[this.type];if(this.type!="text"&&this.type!="set")return e&&(t=e(this)),t},Ct.getSubpath=function(t,e){var i=this.getPath();if(i)return a.getSubpath(i,t,e)};var Pt=a.easing_formulas={linear:function(t){return t},"<":function(t){return kt(t,1.7)},">":function(t){return kt(t,.48)},"<>":function(t){var e=.48-t/1.04,i=K.sqrt(.1734+e*e),r=i-e,n=-i-e,h=kt(wt(r),1/3)*(r<0?-1:1)+kt(wt(n),1/3)*(n<0?-1:1)+.5;return 3*(1-h)*h*h+h*h*h},backIn:function(t){var e=1.70158;return t*t*((e+1)*t-e)},backOut:function(t){var e=1.70158;return(t-=1)*t*((e+1)*t+e)+1},elastic:function(t){return t==!!t?t:kt(2,-10*t)*K.sin(2*_t*(t-.075)/.3)+1},bounce:function(t){var e=7.5625,i=2.75;return t<1/i?e*t*t:t<2/i?e*(t-=1.5/i)*t+.75:t<2.5/i?e*(t-=2.25/i)*t+.9375:e*(t-=2.625/i)*t+.984375}};Pt.easeIn=Pt["ease-in"]=Pt["<"],Pt.easeOut=Pt["ease-out"]=Pt[">"],Pt.easeInOut=Pt["ease-in-out"]=Pt["<>"],Pt["back-in"]=Pt.backIn,Pt["back-out"]=Pt.backOut;var Bt=[],si=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(t){setTimeout(t,16)},qe=function(){for(var t=+new Date,e=0;e1&&!i.next){for(n in T)T[lt](n)&&(E[n]=i.totalOrigin[n]);i.el.attr(E),Be(i.anim,i.el,i.anim.percents[0],null,i.totalOrigin,i.repeat-1)}i.next&&!i.stop&&Be(i.anim,i.el,i.next,null,i.totalOrigin,i.repeat)}}}Bt.length&&si(qe)},De=function(t){return t>255?255:t<0?0:t};function Ui(t,e,i,r,n,h){var g=3*e,d=3*(r-e)-g,x=1-g-d,m=3*i,T=3*(n-i)-m,$=1-m-T;function F(E){return((x*E+d)*E+g)*E}return function(E,N){var S=function(R,z){var et,V,q,G,yt,ht;for(q=R,ht=0;ht<8;ht++){if(G=F(q)-R,wt(G)V)return V;for(;etG?et=q:V=q,q=(V-et)/2+et}return q}(E,N);return(($*S+T)*S+m)*S}(t,1/(200*h))}function qt(t,e){var i=[],r={};if(this.ms=e,this.times=1,t){for(var n in t)t[lt](n)&&(r[y(n)]=t[n],i.push(y(n)));i.sort(At)}this.anim=r,this.top=i[i.length-1],this.percents=i}function Be(t,e,i,r,n,h){i=y(i);var g,d,x,m,T,$,F=t.ms,E={},N={},S={};if(r)for(z=0,et=Bt.length;zr*t.top){i=t.percents[z],T=t.percents[z-1]||0,F=F/t.top*(i-T),m=t.percents[z+1],g=t.anim[i];break}r&&e.attr(t.anim[t.percents[z]])}if(g){if(d)d.initstatus=r,d.start=new Date-d.ms*r;else{for(var V in g)if(g[lt](V)&&(k[lt](V)||e.paper.customAttributes[lt](V)))switch(E[V]=e.attr(V),E[V]==null&&(E[V]=O[V]),N[V]=g[V],k[V]){case ct:S[V]=(N[V]-E[V])/F;break;case"colour":E[V]=a.getRGB(E[V]);var q=a.getRGB(N[V]);S[V]={r:(q.r-E[V].r)/F,g:(q.g-E[V].g)/F,b:(q.b-E[V].b)/F};break;case"path":var G=ke(E[V],N[V]),yt=G[1];for(E[V]=G[0],S[V]=[],z=0,et=E[V].length;zd&&(d=m)}!t[d+="%"].callback&&(t[d].callback=r)}return new qt(t,e)},Ct.animate=function(t,e,i,r){if(this.removed)return r&&r.call(this),this;var n=t instanceof qt?t:a.animation(t,e,i,r);return Be(n,this,n.percents[0],null,this.attr()),this},Ct.setTime=function(t,e){return t&&e!=null&&this.status(t,W(e,t.ms)/t.ms),this},Ct.status=function(t,e){var i,r,n=[],h=0;if(e!=null)return Be(t,this,-1,W(e,1)),this;for(i=Bt.length;h1)for(var X=0,B=P.length;X.5)-1;tt(y-.5,2)+tt(v-.5,2)>.25&&(v=st.sqrt(.25-tt(y-.5,2))*Tt+.5)&&v!=.5&&(v=v.toFixed(5)-1e-5*Tt)}return H})).split(/\s*\-\s*/),s=="linear"){var Q=o.shift();if(Q=-U(Q),isNaN(Q))return null;var D=[0,0,st.cos(u.rad(Q)),st.sin(u.rad(Q))],it=1/(mt(lt(D[2]),lt(D[3]))||1);D[2]*=it,D[3]*=it,D[2]<0&&(D[0]=-D[2],D[2]=0),D[3]<0&&(D[1]=-D[3],D[3]=0)}var pt=u._parseDots(o);if(!pt)return null;if(p=p.replace(/[\(\)\s,\xb0#]/g,"_"),l.gradient&&p!=l.gradient.id&&(O.defs.removeChild(l.gradient),delete l.gradient),!l.gradient){M=B(s+"Gradient",{id:p}),l.gradient=M,B(M,s=="radial"?{fx:y,fy:v}:{x1:D[0],y1:D[1],x2:D[2],y2:D[3],gradientTransform:l.matrix.invert()}),O.defs.appendChild(M);for(var dt=0,ut=pt.length;dt1?ft.opacity/100:ft.opacity});case"stroke":ft=u.getRGB(w),s.setAttribute(v,ft.hex),v=="stroke"&&ft[a]("opacity")&&B(s,{"stroke-opacity":ft.opacity>1?ft.opacity/100:ft.opacity}),v=="stroke"&&l._.arrows&&("startString"in l._.arrows&&ot(l,l._.arrows.startString),"endString"in l._.arrows&&ot(l,l._.arrows.endString,1));break;case"gradient":(l.type=="circle"||l.type=="ellipse"||j(w).charAt()!="r")&&Z(l,w);break;case"opacity":p.gradient&&!p[a]("stroke-opacity")&&B(s,{"stroke-opacity":w>1?w/100:w});case"fill-opacity":if(p.gradient){(Tt=u._g.doc.getElementById(s.getAttribute("fill").replace(/^url\(#|\)$/g,H)))&&(Et=Tt.getElementsByTagName("stop"),B(Et[Et.length-1],{"stop-opacity":w}));break}default:v=="font-size"&&(w=I(w,10)+"px");var Ot=v.replace(/(\-.)/g,function(Mt){return Mt.substring(1).toUpperCase()});s.style[Ot]=w,l._.dirty=1,s.setAttribute(v,w)}}wt(l,o),s.style.visibility=y},wt=function(l,o){if(l.type=="text"&&(o[a]("text")||o[a]("font")||o[a]("font-size")||o[a]("x")||o[a]("y"))){var s=l.attrs,p=l.node,y=p.firstChild?I(u._g.doc.defaultView.getComputedStyle(p.firstChild,H).getPropertyValue("font-size"),10):10;if(o[a]("text")){for(s.text=o.text;p.firstChild;)p.removeChild(p.firstChild);for(var v,w=j(o.text).split(` +`),O=[],k=0,M=w.length;k"));var oe=Qt.getBoundingClientRect();k.W=y.w=(oe.right-oe.left)/100,k.H=y.h=(oe.bottom-oe.top)/100,k.X=y.x,k.Y=y.y+k.H/2,("x"in s||"y"in s)&&(k.path.v=u.format("m{0},{1}l{2},{1}",st(y.x*at),st(y.y*at),st(y.x*at)+1));for(var _e=["x","y","text","font","font-family","font-weight","font-style","font-size"],he=0,Ee=_e.length;he.25&&(dt=I.sqrt(.25-y(pt-.5,2))*(2*(dt>.5)-1)+.5),w=pt+H+dt),Y})).split(/\s*\-\s*/),v=="linear"){var O=s.shift();if(O=-U(O),isNaN(O))return null}var k=u._parseDots(s);if(!k)return null;if(o=o.shape||o.node,k.length){o.removeChild(p),p.on=!0,p.method="none",p.color=k[0].color,p.color2=k[k.length-1].color;for(var M=[],Q=0,D=k.length;Q')}}catch{W=function(y){return s.createElement("<"+y+' xmlns="urn:schemas-microsoft.com:vml" class="rvml">')}}},u._engine.initWin(u._g.win),u._engine.create=function(){var o=u._getContainer.apply(0,arguments),s=o.container,p=o.height,y=o.width,v=o.x,w=o.y;if(!s)throw new Error("VML container not found.");var O=new u._Paper,k=O.canvas=u._g.doc.createElement("div"),M=k.style;return v=v||0,w=w||0,y=y||512,p=p||342,O.width=y,O.height=p,y==+y&&(y+="px"),p==+p&&(p+="px"),O.coordsize=216e5+H+216e5,O.coordorigin="0 0",O.span=u._g.doc.createElement("span"),O.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;",k.appendChild(O.span),M.cssText=u.format("top:0;left:0;width:{0};height:{1};display:inline-block;position:relative;clip:rect(0 {0} {1} 0);overflow:hidden",y,p),s==1?(u._g.doc.body.appendChild(k),M.left=v+"px",M.top=w+"px",M.position="absolute"):s.firstChild?s.insertBefore(k,s.firstChild):s.appendChild(k),O.renderfix=function(){},O},u.prototype.clear=function(){u.eve("raphael.clear",this),this.canvas.innerHTML=Y,this.span=u._g.doc.createElement("span"),this.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;",this.canvas.appendChild(this.span),this.bottom=this.top=null},u.prototype.remove=function(){for(var o in u.eve("raphael.remove",this),this.canvas.parentNode.removeChild(this.canvas),this)this[o]=typeof this[o]=="function"?u._removedFactory(o):null;return!0};var jt=u.st;for(var l in bt)bt[a](l)&&!jt[a](l)&&(jt[l]=function(o){return function(){var s=arguments;return this.forEach(function(p){p[o].apply(p,s)})}}(l))}}).apply(b,C))===void 0||(_.exports=A)}])})})(yi);var Wi=yi.exports;function vi(c,f){if(!c||typeof c=="function")return f;var _={};for(var b in f)_[b]=f[b];for(b in c)c[b]&&(typeof _[b]=="object"?_[b]=vi(_[b],c[b]):_[b]=c[b]);return _}function Qi(c,f){if(typeof Object.create=="function")c.super_=f,c.prototype=Object.create(f.prototype,{constructor:{value:c,enumerable:!1,writable:!0,configurable:!0}});else{c.super_=f;var _=function(){};_.prototype=f.prototype,c.prototype=new _,c.prototype.constructor=c}}var Ut={defaults:vi,inherits:Qi},Zi={x:0,y:0,"line-width":3,"line-length":50,"text-margin":10,"font-size":14,"font-color":"black","line-color":"black","element-color":"black",fill:"white","yes-text":"yes","no-text":"no","arrow-end":"block",class:"flowchart",scale:1,symbols:{start:{},end:{},condition:{},inputoutput:{},input:{},output:{},operation:{},subroutine:{},parallel:{}}};function Ji(c,f,_){var b,L,C="M{0},{1}";for(b=2,L=2*_.length+2;bgt.x?J=f.x-(f.x-gt.x)/2:J=gt.x-(gt.x-f.x)/2,f.y>gt.y?H=f.y-(f.y-gt.y)/2:H=gt.y-(gt.y-f.y)/2,tt?(J-=mt.getBBox().width/2,H-=c.options["text-margin"]):(J+=c.options["text-margin"],H-=mt.getBBox().height/2)):(J=f.x,H=f.y,tt?(f.x>gt.x?(J-=c.options["text-margin"]/2,lt="end"):J+=c.options["text-margin"]/2,H-=c.options["text-margin"]):(J+=c.options["text-margin"]/2,H+=c.options["text-margin"],f.y>gt.y&&(H-=c.options["text-margin"]*2))),mt.attr({"text-anchor":lt,"font-size":c.options["font-size"],fill:c.options["font-color"],x:J,y:H}),j&&mt.attr({font:j}),U&&mt.attr({"font-family":U}),I&&mt.attr({"font-weight":I})}return a}function tr(c,f,_,b,L,C,A,u){var a,j,U,I,st,mt={x:null,y:null,onLine1:!1,onLine2:!1};return a=(u-C)*(_-c)-(A-L)*(b-f),a===0||(j=f-C,U=c-L,I=(A-L)*j-(u-C)*U,st=(_-c)*j-(b-f)*U,j=I/a,U=st/a,mt.x=c+j*(_-c),mt.y=f+j*(b-f),j>0&&j<1&&(mt.onLine1=!0),U>0&&U<1&&(mt.onLine2=!0)),mt}var Ae={drawPath:Ji,drawLine:Ki,checkLineIntersection:tr},mi=Ae,zt=mi.drawLine,er=mi.checkLineIntersection;function Ft(c,f,_){this.chart=c,this.group=this.chart.paper.set(),this.symbol=_,this.connectedTo=[],this.symbolType=f.symbolType,this.flowstate=f.flowstate||"future",this.lineStyle=f.lineStyle||{},this.key=f.key||"",this.leftLines=[],this.rightLines=[],this.topLines=[],this.bottomLines=[],this.params=f.params,this.next_direction=f.next&&f.direction_next?f.direction_next:void 0,this.text=this.chart.paper.text(0,0,f.text),f.key&&(this.text.node.id=f.key+"t"),this.text.node.setAttribute("class",this.getAttr("class")+"t"),this.text.attr({"text-anchor":"start",x:this.getAttr("text-margin"),fill:this.getAttr("font-color"),"font-size":this.getAttr("font-size")});var b=this.getAttr("font"),L=this.getAttr("font-family"),C=this.getAttr("font-weight");b&&this.text.attr({font:b}),L&&this.text.attr({"font-family":L}),C&&this.text.attr({"font-weight":C}),f.link&&this.text.attr("href",f.link),f.function&&(this.text.attr({cursor:"pointer"}),this.text.node.addEventListener("click",function(lt){window[f.function](lt,f)},!1)),f.target&&this.text.attr("target",f.target);var A=this.getAttr("maxWidth");if(A){for(var u=f.text.split(" "),a="",j=0,U=u.length;jA?a+=` +`+I:a+=" "+I}this.text.attr("text",a.substring(1))}if(this.group.push(this.text),_){var st=this.getAttr("text-margin");_.attr({fill:this.getAttr("fill"),stroke:this.getAttr("element-color"),"stroke-width":this.getAttr("line-width"),width:this.text.getBBox().width+2*st,height:this.text.getBBox().height+2*st}),_.node.setAttribute("class",this.getAttr("class"));var mt=this.getAttr("roundness");isNaN(mt)||(_.node.setAttribute("ry",mt),_.node.setAttribute("rx",mt)),f.link&&_.attr("href",f.link),f.target&&_.attr("target",f.target),f.function&&(_.node.addEventListener("click",function(lt){window[f.function](lt,f)},!1),_.attr({cursor:"pointer"})),f.key&&(_.node.id=f.key),this.group.push(_),_.insertBefore(this.text),this.text.attr({y:_.getBBox().height/2}),this.initialize()}}Ft.prototype.getAttr=function(c){if(this.chart){var f=this.chart.options?this.chart.options[c]:void 0,_=this.chart.options.symbols?this.chart.options.symbols[this.symbolType][c]:void 0,b;return this.chart.options.flowstate&&this.chart.options.flowstate[this.flowstate]&&(b=this.chart.options.flowstate[this.flowstate][c]),b||_||f}};Ft.prototype.initialize=function(){this.group.transform("t"+this.getAttr("line-width")+","+this.getAttr("line-width")),this.width=this.group.getBBox().width,this.height=this.group.getBBox().height};Ft.prototype.getCenter=function(){return{x:this.getX()+this.width/2,y:this.getY()+this.height/2}};Ft.prototype.getX=function(){return this.group.getBBox().x};Ft.prototype.getY=function(){return this.group.getBBox().y};Ft.prototype.shiftX=function(c){this.group.transform("t"+(this.getX()+c)+","+this.getY())};Ft.prototype.setX=function(c){this.group.transform("t"+c+","+this.getY())};Ft.prototype.shiftY=function(c){this.group.transform("t"+this.getX()+","+(this.getY()+c))};Ft.prototype.setY=function(c){this.group.transform("t"+this.getX()+","+c)};Ft.prototype.getTop=function(){var c=this.getY(),f=this.getX()+this.width/2;return{x:f,y:c}};Ft.prototype.getBottom=function(){var c=this.getY()+this.height,f=this.getX()+this.width/2;return{x:f,y:c}};Ft.prototype.getLeft=function(){var c=this.getY()+this.group.getBBox().height/2,f=this.getX();return{x:f,y:c}};Ft.prototype.getRight=function(){var c=this.getY()+this.group.getBBox().height/2,f=this.getX()+this.group.getBBox().width;return{x:f,y:c}};Ft.prototype.render=function(){if(this.next){var c=this,f=this.getAttr("line-length");if(this.next_direction==="right"){var _=this.getRight();this.next.isPositioned||(this.next.setY(_.y-this.next.height/2),this.next.shiftX(this.group.getBBox().x+this.width+f),function C(){for(var A=!1,u,a=0,j=c.chart.symbols.length;ac.next.getCenter().y&&U<=c.next.width/2){A=!0;break}}if(A){if(c.next.symbolType==="end")return;c.next.setX(u.getX()+u.width+f),C()}}(),this.next.isPositioned=!0,this.next.render())}else if(this.next_direction==="left"){var b=this.getLeft();this.next.isPositioned||(this.next.setY(b.y-this.next.height/2),this.next.shiftX(-(this.group.getBBox().x+this.width+f)),function C(){for(var A=!1,u,a=0,j=c.chart.symbols.length;ac.next.getCenter().y&&U<=c.next.width/2){A=!0;break}}if(A){if(c.next.symbolType==="end")return;c.next.setX(u.getX()+u.width+f),C()}}(),this.next.isPositioned=!0,this.next.render())}else{var L=this.getBottom();this.next.isPositioned||(this.next.shiftY(this.getY()+this.height+f),this.next.setX(L.x-this.next.width/2),this.next.isPositioned=!0,this.next.render())}}};Ft.prototype.renderLines=function(){this.next&&(this.next_direction?this.drawLineTo(this.next,this.getAttr("arrow-text")||"",this.next_direction):this.drawLineTo(this.next,this.getAttr("arrow-text")||""))};Ft.prototype.drawLineTo=function(c,f,_){this.connectedTo.indexOf(c)<0&&this.connectedTo.push(c);var b=this.getCenter().x,L=this.getCenter().y,C=this.getRight(),A=this.getBottom(),u=this.getTop(),a=this.getLeft(),j=c.getCenter().x,U=c.getCenter().y,I=c.getTop(),st=c.getRight(),mt=c.getLeft(),lt=b===j,tt=L===U,gt=LU||this===c,H=b>j,Y=brt&&(rt=I.x);else if((!_||_==="bottom")&&Y)X=Math.max(c.topLines.length,this.bottomLines.length)*10,P=zt(this.chart,A,[{x:A.x,y:A.y+B/2-X},{x:A.x+(A.x-I.x)/2,y:A.y+B/2-X},{x:A.x+(A.x-I.x)/2,y:I.y-B/2-X},{x:I.x,y:I.y-B/2-X},{x:I.x,y:I.y}],f),this.bottomLines.push(P),c.topLines.push(P),this.bottomStart=!0,c.topEnd=!0,rt=A.x+(A.x-I.x)/2;else if(_&&_==="right"&&H)X=Math.max(c.topLines.length,this.rightLines.length)*10,P=zt(this.chart,C,[{x:C.x+B/2,y:C.y},{x:C.x+B/2,y:I.y-B/2-X},{x:I.x,y:I.y-B/2-X},{x:I.x,y:I.y}],f),this.rightLines.push(P),c.topLines.push(P),this.rightStart=!0,c.topEnd=!0,rt=C.x+B/2;else if(_&&_==="right"&&Y)X=Math.max(c.topLines.length,this.rightLines.length)*10,P=zt(this.chart,C,[{x:I.x,y:C.y-X},{x:I.x,y:I.y-X}],f),this.rightLines.push(P),c.topLines.push(P),this.rightStart=!0,c.topEnd=!0,rt=C.x+B/2;else if(_&&_==="bottom"&<&&J)X=Math.max(c.topLines.length,this.bottomLines.length)*10,P=zt(this.chart,A,[{x:A.x,y:A.y+B/2-X},{x:C.x+B/2,y:A.y+B/2-X},{x:C.x+B/2,y:I.y-B/2-X},{x:I.x,y:I.y-B/2-X},{x:I.x,y:I.y}],f),this.bottomLines.push(P),c.topLines.push(P),this.bottomStart=!0,c.topEnd=!0,rt=A.x+B/2;else if(_==="left"&<&&J){var at=a.x-B/2;mt.xw?(M=["L",k.x+Z*2,v],W.splice(o+1,0,M),M=["C",k.x+Z*2,v,k.x,v-Z*4,k.x-Z*2,v],W.splice(o+2,0,M),P.attr("path",W)):(M=["L",k.x-Z*2,v],W.splice(o+1,0,M),M=["C",k.x-Z*2,v,k.x,v-Z*4,k.x+Z*2,v],W.splice(o+2,0,M),P.attr("path",W)):v>O?(M=["L",y,k.y+Z*2],W.splice(o+1,0,M),M=["C",y,k.y+Z*2,y+Z*4,k.y,y,k.y-Z*2],W.splice(o+2,0,M),P.attr("path",W)):(M=["L",y,k.y-Z*2],W.splice(o+1,0,M),M=["C",y,k.y-Z*2,y+Z*4,k.y,y,k.y+Z*2],W.splice(o+2,0,M),P.attr("path",W)),o+=2}}}this.chart.lines.push(P),(this.chart.minXFromSymbols===void 0||this.chart.minXFromSymbols>a.x)&&(this.chart.minXFromSymbols=a.x)}(!this.chart.maxXFromLine||this.chart.maxXFromLine&&rt>this.chart.maxXFromLine)&&(this.chart.maxXFromLine=rt)};var Ht=Ft,_i=Ht,ir=Ut.inherits,rr=Ae,nr=rr.drawPath;function Xe(c,f){f=f||{},_i.call(this,c,f),this.yes_annotation=f.yes_annotation,this.no_annotation=f.no_annotation,this.textMargin=this.getAttr("text-margin"),this.yes_direction=f.direction_yes,this.no_direction=f.direction_no,!this.no_direction&&this.yes_direction==="right"?this.no_direction="bottom":!this.yes_direction&&this.no_direction==="bottom"&&(this.yes_direction="right"),this.yes_direction=this.yes_direction||"bottom",this.no_direction=this.no_direction||"right",this.text.attr({x:this.textMargin*2});var _=this.text.getBBox().width+3*this.textMargin;_+=_/2;var b=this.text.getBBox().height+2*this.textMargin;b+=b/2,b=Math.max(_*.5,b);var L=_/4,C=b/4;this.text.attr({x:L+this.textMargin/2});var A={x:L,y:C},u=[{x:L-_/4,y:C+b/4},{x:L-_/4+_/2,y:C+b/4+b/2},{x:L-_/4+_,y:C+b/4},{x:L-_/4+_/2,y:C+b/4-b/2},{x:L-_/4,y:C+b/4}],a=nr(c,A,u);a.attr({stroke:this.getAttr("element-color"),"stroke-width":this.getAttr("line-width"),fill:this.getAttr("fill")}),f.link&&a.attr("href",f.link),f.target&&a.attr("target",f.target),f.key&&(a.node.id=f.key),a.node.setAttribute("class",this.getAttr("class")),this.text.attr({y:a.getBBox().height/2}),this.group.push(a),a.insertBefore(this.text),this.symbol=a,this.initialize()}ir(Xe,_i);Xe.prototype.render=function(){var c=this;this.yes_direction&&(this[this.yes_direction+"_symbol"]=this.yes_symbol),this.no_direction&&(this[this.no_direction+"_symbol"]=this.no_symbol);var f=this.getAttr("line-length");if(this.bottom_symbol){var _=this.getBottom();this.bottom_symbol.isPositioned||(this.bottom_symbol.shiftY(this.getY()+this.height+f),this.bottom_symbol.setX(_.x-this.bottom_symbol.width/2),this.bottom_symbol.isPositioned=!0,this.bottom_symbol.render())}if(this.right_symbol){var b=this.getRight();this.right_symbol.isPositioned||(this.right_symbol.setY(b.y-this.right_symbol.height/2),this.right_symbol.shiftX(this.group.getBBox().x+this.width+f),function C(){for(var A=!1,u,a=0,j=c.chart.symbols.length;ac.right_symbol.getCenter().y&&U<=c.right_symbol.width/2){A=!0;break}}if(A){if(c.right_symbol.symbolType==="end")return;c.right_symbol.setX(u.getX()+u.width+f),C()}}(),this.right_symbol.isPositioned=!0,this.right_symbol.render())}if(this.left_symbol){var L=this.getLeft();this.left_symbol.isPositioned||(this.left_symbol.setY(L.y-this.left_symbol.height/2),this.left_symbol.shiftX(-(this.group.getBBox().x+this.width+f)),function C(){for(var A=!1,u,a=0,j=c.chart.symbols.length;ac.left_symbol.getCenter().y&&U<=c.left_symbol.width/2){A=!0;break}}if(A){if(c.left_symbol.symbolType==="end")return;c.left_symbol.setX(u.getX()+u.width+f),C()}}(),this.left_symbol.isPositioned=!0,this.left_symbol.render())}};Xe.prototype.renderLines=function(){this.yes_symbol&&this.drawLineTo(this.yes_symbol,this.yes_annotation?this.yes_annotation:this.getAttr("yes-text"),this.yes_direction),this.no_symbol&&this.drawLineTo(this.no_symbol,this.no_annotation?this.no_annotation:this.getAttr("no-text"),this.no_direction)};var bi=Xe,wi=Ht,sr=Ut.inherits;function Re(c,f){var _=c.paper.rect(0,0,0,0);f=f||{},wi.call(this,c,f,_),this.path1_annotation=f.path1_annotation||"",this.path2_annotation=f.path2_annotation||"",this.path3_annotation=f.path3_annotation||"",this.textMargin=this.getAttr("text-margin"),this.path1_direction="bottom",this.path2_direction="right",this.path3_direction="top",this.params=f.params,f.direction_next==="path1"&&!f[f.direction_next]&&f.next&&(f[f.direction_next]=f.next),f.direction_next==="path2"&&!f[f.direction_next]&&f.next&&(f[f.direction_next]=f.next),f.direction_next==="path3"&&!f[f.direction_next]&&f.next&&(f[f.direction_next]=f.next),f.path1&&f.direction_path1&&f.path2&&!f.direction_path2&&f.path3&&!f.direction_path3?f.direction_path1==="right"?(this.path2_direction="bottom",this.path1_direction="right",this.path3_direction="top"):f.direction_path1==="top"?(this.path2_direction="right",this.path1_direction="top",this.path3_direction="bottom"):f.direction_path1==="left"?(this.path2_direction="right",this.path1_direction="left",this.path3_direction="bottom"):(this.path2_direction="right",this.path1_direction="bottom",this.path3_direction="top"):f.path1&&!f.direction_path1&&f.path2&&f.direction_path2&&f.path3&&!f.direction_path3?f.direction_path2==="right"?(this.path1_direction="bottom",this.path2_direction="right",this.path3_direction="top"):f.direction_path2==="left"?(this.path1_direction="bottom",this.path2_direction="left",this.path3_direction="right"):(this.path1_direction="right",this.path2_direction="bottom",this.path3_direction="top"):f.path1&&!f.direction_path1&&f.path2&&!f.direction_path2&&f.path3&&f.direction_path3?f.direction_path2==="right"?(this.path1_direction="bottom",this.path2_direction="top",this.path3_direction="right"):f.direction_path2==="left"?(this.path1_direction="bottom",this.path2_direction="right",this.path3_direction="left"):(this.path1_direction="right",this.path2_direction="bottom",this.path3_direction="top"):(this.path1_direction=f.direction_path1,this.path2_direction=f.direction_path2,this.path3_direction=f.direction_path3),this.path1_direction=this.path1_direction||"bottom",this.path2_direction=this.path2_direction||"right",this.path3_direction=this.path3_direction||"top",this.initialize()}sr(Re,wi);Re.prototype.render=function(){this.path1_direction&&(this[this.path1_direction+"_symbol"]=this.path1_symbol),this.path2_direction&&(this[this.path2_direction+"_symbol"]=this.path2_symbol),this.path3_direction&&(this[this.path3_direction+"_symbol"]=this.path3_symbol);var c=this.getAttr("line-length");if(this.bottom_symbol){var f=this.getBottom();this.bottom_symbol.isPositioned||(this.bottom_symbol.shiftY(this.getY()+this.height+c),this.bottom_symbol.setX(f.x-this.bottom_symbol.width/2),this.bottom_symbol.isPositioned=!0,this.bottom_symbol.render())}if(this.top_symbol){var _=this.getTop();this.top_symbol.isPositioned||(this.top_symbol.shiftY(this.getY()-this.top_symbol.height-c),this.top_symbol.setX(_.x+this.top_symbol.width),this.top_symbol.isPositioned=!0,this.top_symbol.render())}var b=this;if(this.left_symbol){var L=this.getLeft();this.left_symbol.isPositioned||(this.left_symbol.setY(L.y-this.left_symbol.height/2),this.left_symbol.shiftX(-(this.group.getBBox().x+this.width+c)),function A(){for(var u=!1,a,j=0,U=b.chart.symbols.length;jb.left_symbol.getCenter().y&&I<=b.left_symbol.width/2){u=!0;break}}if(u){if(b.left_symbol.symbolType==="end")return;b.left_symbol.setX(a.getX()+a.width+c),A()}}(),this.left_symbol.isPositioned=!0,this.left_symbol.render())}if(this.right_symbol){var C=this.getRight();this.right_symbol.isPositioned||(this.right_symbol.setY(C.y-this.right_symbol.height/2),this.right_symbol.shiftX(this.group.getBBox().x+this.width+c),function A(){for(var u=!1,a,j=0,U=b.chart.symbols.length;jb.right_symbol.getCenter().y&&I<=b.right_symbol.width/2){u=!0;break}}if(u){if(b.right_symbol.symbolType==="end")return;b.right_symbol.setX(a.getX()+a.width+c),A()}}(),this.right_symbol.isPositioned=!0,this.right_symbol.render())}};Re.prototype.renderLines=function(){this.path1_symbol&&this.drawLineTo(this.path1_symbol,this.path1_annotation,this.path1_direction),this.path2_symbol&&this.drawLineTo(this.path2_symbol,this.path2_annotation,this.path2_direction),this.path3_symbol&&this.drawLineTo(this.path3_symbol,this.path3_annotation,this.path3_direction)};var ki=Re,ar=Wi,or=Ut.defaults,hr=Zi,lr=bi,fr=ki;function Me(c,f){f=f||{},this.paper=new ar(c),this.options=or(f,hr),this.symbols=[],this.lines=[],this.start=null}Me.prototype.handle=function(c){this.symbols.indexOf(c)<=-1&&this.symbols.push(c);var f=this;return c instanceof lr?(c.yes=function(_){return c.yes_symbol=_,c.no_symbol&&(c.pathOk=!0),f.handle(_)},c.no=function(_){return c.no_symbol=_,c.yes_symbol&&(c.pathOk=!0),f.handle(_)}):c instanceof fr?(c.path1=function(_){return c.path1_symbol=_,c.path2_symbol&&(c.pathOk=!0),f.handle(_)},c.path2=function(_){return c.path2_symbol=_,c.path3_symbol&&(c.pathOk=!0),f.handle(_)},c.path3=function(_){return c.path3_symbol=_,c.path1_symbol&&(c.pathOk=!0),f.handle(_)}):c.then=function(_){return c.next=_,c.pathOk=!0,f.handle(_)},c};Me.prototype.startWith=function(c){return this.start=c,this.handle(c)};Me.prototype.render=function(){var c=0,f=0,_=0,b=0,L=0,C=0,A=0,u=0,a,j;for(_=0,b=this.symbols.length;_c&&(c=a.width),a.height>f&&(f=a.height);for(_=0,b=this.symbols.length;_L&&(L=U),I>C&&(C=I)}for(_=0,b=this.lines.length;_L&&(L=mt),lt>C&&(C=lt)}var tt=this.options.scale,gt=this.options["line-width"];this.minXFromSymbols")<0&&j.indexOf("=>")<0&&j.indexOf("@>")<0?(_[u-1]+=` +`+j,_.splice(u,1),a--):u++}function U(v){var w=v.indexOf("(")+1,O=v.indexOf(")");return w>=0&&O>=0?v.substring(w,O):"{}"}function I(v){var w=v.indexOf("(")+1,O=v.indexOf(")");return w>=0&&O>=0?v.substring(w,O):""}function st(v){var w=v.indexOf("(")+1,O=v.indexOf(")");return w>=0&&O>=0?f.symbols[v.substring(0,w-1)]:f.symbols[v]}function mt(v){var w="next",O=v.indexOf("(")+1,k=v.indexOf(")");return O>=0&&k>=0&&(w=W.substring(O,k),w.indexOf(",")<0&&w!=="yes"&&w!=="no"&&(w="next, "+w)),w}function lt(v){var w=v.indexOf("(")+1,O=v.indexOf(")"),k=v.substring(w,O);k.indexOf(",")>0&&(k=k.substring(0,k.indexOf(",")));var M=k.split("@");if(M.length>1)return w>=0&&O>=0?M[1]:""}for(;_.length>0;){var tt=_.splice(0,1)[0].trim();if(tt.indexOf("=>")>=0){var gt=tt.split("=>"),J={key:gt[0].replace(/\(.*\)/,""),symbolType:gt[1],text:null,link:null,target:null,flowstate:null,function:null,lineStyle:{},params:{}},H=gt[0].match(/\((.*)\)/);if(H&&H.length>1)for(var Y=H[1].split(","),rt=0;rt=0&&(X=J.symbolType.split(": "),J.symbolType=X.shift(),J.text=X.join(": ")),J.text&&J.text.indexOf(":$")>=0?(X=J.text.split(":$"),J.text=X.shift(),J.function=X.join(":$")):J.symbolType.indexOf(":$")>=0?(X=J.symbolType.split(":$"),J.symbolType=X.shift(),J.function=X.join(":$")):J.text&&J.text.indexOf(":>")>=0?(X=J.text.split(":>"),J.text=X.shift(),J.link=X.join(":>")):J.symbolType.indexOf(":>")>=0&&(X=J.symbolType.split(":>"),J.symbolType=X.shift(),J.link=X.join(":>")),J.symbolType.indexOf(` +`)>=0&&(J.symbolType=J.symbolType.split(` +`)[0]),J.link){var B=J.link.indexOf("[")+1,Z=J.link.indexOf("]");B>=0&&Z>=0&&(J.target=J.link.substring(B,Z),J.link=J.link.substring(0,B-1))}if(J.text&&J.text.indexOf("|")>=0){var at=J.text.split("|");J.flowstate=at.pop().trim(),J.text=at.join("|")}f.symbols[J.key]=J}else if(tt.indexOf("->")>=0){var xt=lt(tt);xt&&(tt=tt.replace("@"+xt,""));for(var ot=tt.split("->"),K=0,nt=ot.length;K=0){var bt=kt.split(",");kt=bt[0],ct=bt[1].trim()}if(xt&&(_t.symbolType==="condition"?kt==="yes"||kt==="true"?_t.yes_annotation=xt:_t.no_annotation=xt:_t.symbolType==="parallel"&&(kt==="path1"?_t.path1_annotation=xt:kt==="path2"?_t.path2_annotation=xt:kt==="path3"&&(_t.path3_annotation=xt)),xt=null),f.start||(f.start=_t),K+1")>=0){for(var l=tt.split("@>"),o=0,s=l.length;oN[A]})}}}return Object.freeze(Object.defineProperty(Ln,Symbol.toStringTag,{value:"Module"}))}var ve={exports:{}};(function(Ln,Gn){(function(gt,N){Ln.exports=N()})(window,function(){return function(gt){var N={};function A(q){if(N[q])return N[q].exports;var x=N[q]={i:q,l:!1,exports:{}};return gt[q].call(x.exports,x,x.exports,A),x.l=!0,x.exports}return A.m=gt,A.c=N,A.d=function(q,x,E){A.o(q,x)||Object.defineProperty(q,x,{enumerable:!0,get:E})},A.r=function(q){typeof Symbol<"u"&&Symbol.toStringTag&&Object.defineProperty(q,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(q,"__esModule",{value:!0})},A.t=function(q,x){if(1&x&&(q=A(q)),8&x||4&x&&typeof q=="object"&&q&&q.__esModule)return q;var E=Object.create(null);if(A.r(E),Object.defineProperty(E,"default",{enumerable:!0,value:q}),2&x&&typeof q!="string")for(var D in q)A.d(E,D,(function(rt){return q[rt]}).bind(null,D));return E},A.n=function(q){var x=q&&q.__esModule?function(){return q.default}:function(){return q};return A.d(x,"a",x),x},A.o=function(q,x){return Object.prototype.hasOwnProperty.call(q,x)},A.p="/",A(A.s=4)}([function(gt,N,A){A.r(N);var q="http://www.w3.org/1999/xhtml",x={svg:"http://www.w3.org/2000/svg",xhtml:q,xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace",xmlns:"http://www.w3.org/2000/xmlns/"},E=function(r){var a=r+="",d=a.indexOf(":");return d>=0&&(a=r.slice(0,d))!=="xmlns"&&(r=r.slice(d+1)),x.hasOwnProperty(a)?{space:x[a],local:r}:r};function D(r){return function(){var a=this.ownerDocument,d=this.namespaceURI;return d===q&&a.documentElement.namespaceURI===q?a.createElement(r):a.createElementNS(d,r)}}function rt(r){return function(){return this.ownerDocument.createElementNS(r.space,r.local)}}var H=function(r){var a=E(r);return(a.local?rt:D)(a)};function L(){}var j=function(r){return r==null?L:function(){return this.querySelector(r)}};function lt(){return[]}var yt=function(r){return r==null?lt:function(){return this.querySelectorAll(r)}},Nt=function(r){return function(){return this.matches(r)}},tt=function(r){return new Array(r.length)};function at(r,a){this.ownerDocument=r.ownerDocument,this.namespaceURI=r.namespaceURI,this._next=null,this._parent=r,this.__data__=a}at.prototype={constructor:at,appendChild:function(r){return this._parent.insertBefore(r,this._next)},insertBefore:function(r,a){return this._parent.insertBefore(r,a)},querySelector:function(r){return this._parent.querySelector(r)},querySelectorAll:function(r){return this._parent.querySelectorAll(r)}};var ft="$";function vt(r,a,d,b,z,C){for(var Y,S=0,Z=a.length,Q=C.length;Sa?1:r>=a?0:NaN}function Ot(r){return function(){this.removeAttribute(r)}}function Ht(r){return function(){this.removeAttributeNS(r.space,r.local)}}function Rt(r,a){return function(){this.setAttribute(r,a)}}function Vt(r,a){return function(){this.setAttributeNS(r.space,r.local,a)}}function xt(r,a){return function(){var d=a.apply(this,arguments);d==null?this.removeAttribute(r):this.setAttribute(r,d)}}function Bt(r,a){return function(){var d=a.apply(this,arguments);d==null?this.removeAttributeNS(r.space,r.local):this.setAttributeNS(r.space,r.local,d)}}var Pt=function(r){return r.ownerDocument&&r.ownerDocument.defaultView||r.document&&r||r.defaultView};function Xt(r){return function(){this.style.removeProperty(r)}}function Qt(r,a,d){return function(){this.style.setProperty(r,a,d)}}function At(r,a,d){return function(){var b=a.apply(this,arguments);b==null?this.style.removeProperty(r):this.style.setProperty(r,b,d)}}function bt(r,a){return r.style.getPropertyValue(a)||Pt(r).getComputedStyle(r,null).getPropertyValue(a)}function ct(r){return function(){delete this[r]}}function Tt(r,a){return function(){this[r]=a}}function Wt(r,a){return function(){var d=a.apply(this,arguments);d==null?delete this[r]:this[r]=d}}function ht(r){return r.trim().split(/^|\s+/)}function Ft(r){return r.classList||new an(r)}function an(r){this._node=r,this._names=ht(r.getAttribute("class")||"")}function pn(r,a){for(var d=Ft(r),b=-1,z=a.length;++b=0&&(this._names.splice(a,1),this._node.setAttribute("class",this._names.join(" ")))},contains:function(r){return this._names.indexOf(r)>=0}};function gn(){this.textContent=""}function An(r){return function(){this.textContent=r}}function Nn(r){return function(){var a=r.apply(this,arguments);this.textContent=a??""}}function En(){this.innerHTML=""}function Jt(r){return function(){this.innerHTML=r}}function sn(r){return function(){var a=r.apply(this,arguments);this.innerHTML=a??""}}function vn(){this.nextSibling&&this.parentNode.appendChild(this)}function yn(){this.previousSibling&&this.parentNode.insertBefore(this,this.parentNode.firstChild)}function qn(){return null}function Et(){var r=this.parentNode;r&&r.removeChild(this)}function _n(){return this.parentNode.insertBefore(this.cloneNode(!1),this.nextSibling)}function tn(){return this.parentNode.insertBefore(this.cloneNode(!0),this.nextSibling)}var nn={},St=null;typeof document<"u"&&("onmouseenter"in document.documentElement||(nn={mouseenter:"mouseover",mouseleave:"mouseout"}));function Sn(r,a,d){return r=On(r,a,d),function(b){var z=b.relatedTarget;z&&(z===this||8&z.compareDocumentPosition(this))||r.call(this,b)}}function On(r,a,d){return function(b){var z=St;St=b;try{r.call(this,this.__data__,a,d)}finally{St=z}}}function Dt(r){return r.trim().split(/^|\s+/).map(function(a){var d="",b=a.indexOf(".");return b>=0&&(d=a.slice(b+1),a=a.slice(0,b)),{type:a,name:d}})}function jn(r){return function(){var a=this.__on;if(a){for(var d,b=0,z=-1,C=a.length;b=en&&(en=It+1);!(xn=ln[en])&&++en<$t;);Bn._next=xn||null}}return(S=new f(S,z))._enter=Z,S._exit=Q,S},enter:function(){return new f(this._enter||this._groups.map(tt),this._parents)},exit:function(){return new f(this._exit||this._groups.map(tt),this._parents)},join:function(r,a,d){var b=this.enter(),z=this,C=this.exit();return b=typeof r=="function"?r(b):b.append(r+""),a!=null&&(z=a(z)),d==null?C.remove():d(C),b&&z?b.merge(z).order():z},merge:function(r){for(var a=this._groups,d=r._groups,b=a.length,z=d.length,C=Math.min(b,z),Y=new Array(b),S=0;S=0;)(b=z[C])&&(Y&&4^b.compareDocumentPosition(Y)&&Y.parentNode.insertBefore(b,Y),Y=b);return this},sort:function(r){function a(kt,Ct){return kt&&Ct?r(kt.__data__,Ct.__data__):!kt-!Ct}r||(r=st);for(var d=this._groups,b=d.length,z=new Array(b),C=0;C1?this.each((a==null?Xt:typeof a=="function"?At:Qt)(r,a,d??"")):bt(this.node(),r)},property:function(r,a){return arguments.length>1?this.each((a==null?ct:typeof a=="function"?Wt:Tt)(r,a)):this.node()[r]},classed:function(r,a){var d=ht(r+"");if(arguments.length<2){for(var b=Ft(this.node()),z=-1,C=d.length;++zE?D:x=0&&(i=e.slice(s+1),e=e.slice(0,s)),e&&!n.hasOwnProperty(e))throw new Error("unknown type: "+e);return{type:e,name:i}})}function rt(t,n){for(var e,i=0,s=t.length;i0)for(var e,i,s=new Array(e),l=0;l>8&15|n>>4&240,n>>4&15|240&n,(15&n)<<4|15&n,1):(n=Ht.exec(t))?bt(parseInt(n[1],16)):(n=Rt.exec(t))?new ht(n[1],n[2],n[3],1):(n=Vt.exec(t))?new ht(255*n[1]/100,255*n[2]/100,255*n[3]/100,1):(n=xt.exec(t))?ct(n[1],n[2],n[3],n[4]):(n=Bt.exec(t))?ct(255*n[1]/100,255*n[2]/100,255*n[3]/100,n[4]):(n=Pt.exec(t))?an(n[1],n[2]/100,n[3]/100,1):(n=Xt.exec(t))?an(n[1],n[2]/100,n[3]/100,n[4]):Qt.hasOwnProperty(t)?bt(Qt[t]):t==="transparent"?new ht(NaN,NaN,NaN,0):null}function bt(t){return new ht(t>>16&255,t>>8&255,255&t,1)}function ct(t,n,e,i){return i<=0&&(t=n=e=NaN),new ht(t,n,e,i)}function Tt(t){return t instanceof ft||(t=At(t)),t?new ht((t=t.rgb()).r,t.g,t.b,t.opacity):new ht}function Wt(t,n,e,i){return arguments.length===1?Tt(t):new ht(t,n,e,i??1)}function ht(t,n,e,i){this.r=+t,this.g=+n,this.b=+e,this.opacity=+i}function Ft(t){return((t=Math.max(0,Math.min(255,Math.round(t)||0)))<16?"0":"")+t.toString(16)}function an(t,n,e,i){return i<=0?t=n=e=NaN:e<=0||e>=1?t=n=NaN:n<=0&&(t=NaN),new Mt(t,n,e,i)}function pn(t,n,e,i){return arguments.length===1?function(s){if(s instanceof Mt)return new Mt(s.h,s.s,s.l,s.opacity);if(s instanceof ft||(s=At(s)),!s)return new Mt;if(s instanceof Mt)return s;var l=(s=s.rgb()).r/255,p=s.g/255,m=s.b/255,M=Math.min(l,p,m),v=Math.max(l,p,m),O=NaN,I=v-M,U=(v+M)/2;return I?(O=l===v?(p-m)/I+6*(p0&&U<1?0:O,new Mt(O,I,U,s.opacity)}(t):new Mt(t,n,e,i??1)}function Mt(t,n,e,i){this.h=+t,this.s=+n,this.l=+e,this.opacity=+i}function dn(t,n,e){return 255*(t<60?n+(e-n)*t/60:t<180?e:t<240?n+(e-n)*(240-t)/60:n)}tt(ft,At,{displayable:function(){return this.rgb().displayable()},hex:function(){return this.rgb().hex()},toString:function(){return this.rgb()+""}}),tt(ht,Wt,at(ft,{brighter:function(t){return t=t==null?1/.7:Math.pow(1/.7,t),new ht(this.r*t,this.g*t,this.b*t,this.opacity)},darker:function(t){return t=t==null?.7:Math.pow(.7,t),new ht(this.r*t,this.g*t,this.b*t,this.opacity)},rgb:function(){return this},displayable:function(){return 0<=this.r&&this.r<=255&&0<=this.g&&this.g<=255&&0<=this.b&&this.b<=255&&0<=this.opacity&&this.opacity<=1},hex:function(){return"#"+Ft(this.r)+Ft(this.g)+Ft(this.b)},toString:function(){var t=this.opacity;return((t=isNaN(t)?1:Math.max(0,Math.min(1,t)))===1?"rgb(":"rgba(")+Math.max(0,Math.min(255,Math.round(this.r)||0))+", "+Math.max(0,Math.min(255,Math.round(this.g)||0))+", "+Math.max(0,Math.min(255,Math.round(this.b)||0))+(t===1?")":", "+t+")")}})),tt(Mt,pn,at(ft,{brighter:function(t){return t=t==null?1/.7:Math.pow(1/.7,t),new Mt(this.h,this.s,this.l*t,this.opacity)},darker:function(t){return t=t==null?.7:Math.pow(.7,t),new Mt(this.h,this.s,this.l*t,this.opacity)},rgb:function(){var t=this.h%360+360*(this.h<0),n=isNaN(t)||isNaN(this.s)?0:this.s,e=this.l,i=e+(e<.5?e:1-e)*n,s=2*e-i;return new ht(dn(t>=240?t-240:t+120,s,i),dn(t,s,i),dn(t<120?t+240:t-120,s,i),this.opacity)},displayable:function(){return(0<=this.s&&this.s<=1||isNaN(this.s))&&0<=this.l&&this.l<=1&&0<=this.opacity&&this.opacity<=1}}));var mn=Math.PI/180,zn=180/Math.PI,gn=.96422,An=1,Nn=.82521,En=4/29,Jt=6/29,sn=3*Jt*Jt,vn=Jt*Jt*Jt;function yn(t){if(t instanceof Et)return new Et(t.l,t.a,t.b,t.opacity);if(t instanceof Dt){if(isNaN(t.h))return new Et(t.l,0,0,t.opacity);var n=t.h*mn;return new Et(t.l,Math.cos(n)*t.c,Math.sin(n)*t.c,t.opacity)}t instanceof ht||(t=Tt(t));var e,i,s=St(t.r),l=St(t.g),p=St(t.b),m=_n((.2225045*s+.7168786*l+.0606169*p)/An);return s===l&&l===p?e=i=m:(e=_n((.4360747*s+.3850649*l+.1430804*p)/gn),i=_n((.0139322*s+.0971045*l+.7141733*p)/Nn)),new Et(116*m-16,500*(e-m),200*(m-i),t.opacity)}function qn(t,n,e,i){return arguments.length===1?yn(t):new Et(t,n,e,i??1)}function Et(t,n,e,i){this.l=+t,this.a=+n,this.b=+e,this.opacity=+i}function _n(t){return t>vn?Math.pow(t,1/3):t/sn+En}function tn(t){return t>Jt?t*t*t:sn*(t-En)}function nn(t){return 255*(t<=.0031308?12.92*t:1.055*Math.pow(t,1/2.4)-.055)}function St(t){return(t/=255)<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)}function Sn(t){if(t instanceof Dt)return new Dt(t.h,t.c,t.l,t.opacity);if(t instanceof Et||(t=yn(t)),t.a===0&&t.b===0)return new Dt(NaN,0,t.l,t.opacity);var n=Math.atan2(t.b,t.a)*zn;return new Dt(n<0?n+360:n,Math.sqrt(t.a*t.a+t.b*t.b),t.l,t.opacity)}function On(t,n,e,i){return arguments.length===1?Sn(t):new Dt(t,n,e,i??1)}function Dt(t,n,e,i){this.h=+t,this.c=+n,this.l=+e,this.opacity=+i}tt(Et,qn,at(ft,{brighter:function(t){return new Et(this.l+18*(t??1),this.a,this.b,this.opacity)},darker:function(t){return new Et(this.l-18*(t??1),this.a,this.b,this.opacity)},rgb:function(){var t=(this.l+16)/116,n=isNaN(this.a)?t:t+this.a/500,e=isNaN(this.b)?t:t-this.b/200;return new ht(nn(3.1338561*(n=gn*tn(n))-1.6168667*(t=An*tn(t))-.4906146*(e=Nn*tn(e))),nn(-.9787684*n+1.9161415*t+.033454*e),nn(.0719453*n-.2289914*t+1.4052427*e),this.opacity)}})),tt(Dt,On,at(ft,{brighter:function(t){return new Dt(this.h,this.c,this.l+18*(t??1),this.opacity)},darker:function(t){return new Dt(this.h,this.c,this.l-18*(t??1),this.opacity)},rgb:function(){return yn(this).rgb()}}));var jn=-.14861,wn=1.78277,o=-.29227,u=-.90649,c=1.97294,h=c*u,g=c*wn,f=wn*o-u*jn;function P(t,n,e,i){return arguments.length===1?function(s){if(s instanceof T)return new T(s.h,s.s,s.l,s.opacity);s instanceof ht||(s=Tt(s));var l=s.r/255,p=s.g/255,m=s.b/255,M=(f*m+h*l-g*p)/(f+h-g),v=m-M,O=(c*(p-M)-o*v)/u,I=Math.sqrt(O*O+v*v)/(c*M*(1-M)),U=I?Math.atan2(O,v)*zn-120:NaN;return new T(U<0?U+360:U,I,M,s.opacity)}(t):new T(t,n,e,i??1)}function T(t,n,e,i){this.h=+t,this.s=+n,this.l=+e,this.opacity=+i}tt(T,P,at(ft,{brighter:function(t){return t=t==null?1/.7:Math.pow(1/.7,t),new T(this.h,this.s,this.l*t,this.opacity)},darker:function(t){return t=t==null?.7:Math.pow(.7,t),new T(this.h,this.s,this.l*t,this.opacity)},rgb:function(){var t=isNaN(this.h)?0:(this.h+120)*mn,n=+this.l,e=isNaN(this.s)?0:this.s*n*(1-n),i=Math.cos(t),s=Math.sin(t);return new ht(255*(n+e*(jn*i+wn*s)),255*(n+e*(o*i+u*s)),255*(n+e*(c*i)),this.opacity)}}));var w=function(t){return function(){return t}};function k(t,n){return function(e){return t+e*n}}function B(t,n){var e=n-t;return e?k(t,e>180||e<-180?e-360*Math.round(e/360):e):w(isNaN(t)?n:t)}function R(t){return(t=+t)==1?_:function(n,e){return e-n?function(i,s,l){return i=Math.pow(i,l),s=Math.pow(s,l)-i,l=1/l,function(p){return Math.pow(i+p*s,l)}}(n,e,t):w(isNaN(n)?e:n)}}function _(t,n){var e=n-t;return e?k(t,e):w(isNaN(t)?n:t)}var V=function t(n){var e=R(n);function i(s,l){var p=e((s=Wt(s)).r,(l=Wt(l)).r),m=e(s.g,l.g),M=e(s.b,l.b),v=_(s.opacity,l.opacity);return function(O){return s.r=p(O),s.g=m(O),s.b=M(O),s.opacity=v(O),s+""}}return i.gamma=t,i}(1),F=function(t,n){return n-=t=+t,function(e){return t+n*e}},nt=/[-+]?(?:\d+\.?\d*|\.?\d+)(?:[eE][-+]?\d+)?/g,it=new RegExp(nt.source,"g"),G,ot,r,a,d=function(t,n){var e,i,s,l=nt.lastIndex=it.lastIndex=0,p=-1,m=[],M=[];for(t+="",n+="";(e=nt.exec(t))&&(i=it.exec(n));)(s=i.index)>l&&(s=n.slice(l,s),m[p]?m[p]+=s:m[++p]=s),(e=e[0])===(i=i[0])?m[p]?m[p]+=i:m[++p]=i:(m[++p]=null,M.push({i:p,x:F(e,i)})),l=it.lastIndex;return l180?O+=360:O-v>180&&(v+=360),U.push({i:I.push(s(I)+"rotate(",null,i)-2,x:F(v,O)})):O&&I.push(s(I)+"rotate("+O+i)}(l.rotate,p.rotate,m,M),function(v,O,I,U){v!==O?U.push({i:I.push(s(I)+"skewX(",null,i)-2,x:F(v,O)}):O&&I.push(s(I)+"skewX("+O+i)}(l.skewX,p.skewX,m,M),function(v,O,I,U,ut,wt){if(v!==I||O!==U){var $=ut.push(s(ut)+"scale(",null,",",null,")");wt.push({i:$-4,x:F(v,I)},{i:$-2,x:F(O,U)})}else I===1&&U===1||ut.push(s(ut)+"scale("+I+","+U+")")}(l.scaleX,l.scaleY,p.scaleX,p.scaleY,m,M),l=p=null,function(v){for(var O,I=-1,U=M.length;++I=0&&n._call.call(null,t),n=n._next;--$t})()}finally{$t=0,function(){for(var t,n,e=jt,i=1/0;e;)e._call?(i>e._time&&(i=e._time),t=e,e=e._next):(n=e._next,e._next=null,e=t?t._next=n:jt=n);Ut=t,Zn(i)}(),It=0}}function we(){var t=bn.now(),n=t-xn;n>Bn&&(en-=n,xn=t)}function Zn(t){$t||(cn&&(cn=clearTimeout(cn)),t-It>24?(t<1/0&&(cn=setTimeout(ae,t-bn.now()-en)),ln&&(ln=clearInterval(ln))):(ln||(xn=bn.now(),ln=setInterval(we,Bn)),$t=1,oe(ae)))}Xn.prototype=ue.prototype={constructor:Xn,restart:function(t,n,e){if(typeof t!="function")throw new TypeError("callback is not a function");e=(e==null?Hn():+e)+(n==null?0:+n),this._next||Ut===this||(Ut?Ut._next=this:jt=this,Ut=this),this._call=t,this._time=e,Zn()},stop:function(){this._call&&(this._call=null,this._time=1/0,Zn())}};var se=function(t,n,e){var i=new Xn;return n=n==null?0:+n,i.restart(function(s){i.stop(),t(s+n)},n,e),i},xe=L("start","end","cancel","interrupt"),be=[],ce=0,le=1,Kn=2,Yn=3,he=4,Qn=5,Rn=6,Vn=function(t,n,e,i,s,l){var p=t.__transition;if(p){if(e in p)return}else t.__transition={};(function(m,M,v){var O,I=m.__transition;function U($){var dt,Lt,qt,mt;if(v.state!==le)return wt();for(dt in I)if((mt=I[dt]).name===v.name){if(mt.state===Yn)return se(U);mt.state===he?(mt.state=Rn,mt.timer.stop(),mt.on.call("interrupt",m,m.__data__,mt.index,mt.group),delete I[dt]):+dtce)throw new Error("too late; already scheduled");return e}function rn(t,n){var e=Gt(t,n);if(e.state>Yn)throw new Error("too late; already running");return e}function Gt(t,n){var e=t.__transition;if(!e||!(e=e[n]))throw new Error("transition not found");return e}var Wn=function(t,n){var e,i,s,l=t.__transition,p=!0;if(l){for(s in n=n==null?null:n+"",l)(e=l[s]).name===n?(i=e.state>Kn&&e.state=0&&(m=m.slice(0,M)),!m||m==="start"})}(n)?Jn:rn;return function(){var p=l(this,t),m=p.on;m!==i&&(s=(i=m).copy()).on(n,e),p.on=s}}var Ie=j.selection.prototype.constructor;function pe(t){return function(){this.style.removeProperty(t)}}function He(t,n,e){var i,s;function l(){var p=n.apply(this,arguments);return p!==s&&(i=(s=p)&&function(m,M,v){return function(O){this.style.setProperty(m,M(O),v)}}(t,p,e)),i}return l._value=n,l}var Xe=0;function on(t,n,e,i){this._groups=t,this._parents=n,this._name=e,this._id=i}function de(){return++Xe}var Pn=j.selection.prototype;on.prototype={constructor:on,select:function(t){var n=this._name,e=this._id;typeof t!="function"&&(t=Object(j.selector)(t));for(var i=this._groups,s=i.length,l=new Array(s),p=0;pi?(i+s)/2:Math.min(0,i)||Math.max(0,s),p>l?(l+p)/2:Math.min(0,l)||Math.max(0,p))}var Ge=function(){var t,n,e=Ve,i=We,s=$e,l=Fe,p=Ue,m=[0,1/0],M=[[-1/0,-1/0],[1/0,1/0]],v=250,O=kt,I=L("start","zoom","end"),U=500,ut=150,wt=0;function $(y){y.property("__zoom",ge).on("wheel.zoom",$n).on("mousedown.zoom",In).on("dblclick.zoom",Ze).filter(p).on("touchstart.zoom",Ke).on("touchmove.zoom",Qe).on("touchend.zoom touchcancel.zoom",Je).style("touch-action","none").style("-webkit-tap-highlight-color","rgba(0,0,0,0)")}function dt(y,X){return(X=Math.max(m[0],Math.min(m[1],X)))===y.k?y:new un(X,y.x,y.y)}function Lt(y,X,W){var K=X[0]-W[0]*y.k,J=X[1]-W[1]*y.k;return K===y.x&&J===y.y?y:new un(y.k,K,J)}function qt(y){return[(+y[0][0]+ +y[1][0])/2,(+y[0][1]+ +y[1][1])/2]}function mt(y,X,W){y.on("start.zoom",function(){Yt(this,arguments).start()}).on("interrupt.zoom end.zoom",function(){Yt(this,arguments).end()}).tween("zoom",function(){var K=this,J=arguments,zt=Yt(K,J),pt=i.apply(K,J),Zt=W==null?qt(pt):typeof W=="function"?W.apply(K,J):W,hn=Math.max(pt[1][0]-pt[0][0],pt[1][1]-pt[0][1]),Mn=K.__zoom,fn=typeof X=="function"?X.apply(K,J):X,kn=O(Mn.invert(Zt).concat(hn/Mn.k),fn.invert(Zt).concat(hn/fn.k));return function(Kt){if(Kt===1)Kt=fn;else{var re=kn(Kt),ie=hn/re[2];Kt=new un(ie,Zt[0]-re[0]*ie,Zt[1]-re[1]*ie)}zt.zoom(null,Kt)}})}function Yt(y,X,W){return!W&&y.__zooming||new Cn(y,X)}function Cn(y,X){this.that=y,this.args=X,this.active=0,this.extent=i.apply(y,X),this.taps=0}function $n(){if(e.apply(this,arguments)){var y=Yt(this,arguments),X=this.__zoom,W=Math.max(m[0],Math.min(m[1],X.k*Math.pow(2,l.apply(this,arguments)))),K=Object(j.mouse)(this);if(y.wheel)y.mouse[0][0]===K[0]&&y.mouse[0][1]===K[1]||(y.mouse[1]=X.invert(y.mouse[0]=K)),clearTimeout(y.wheel);else{if(X.k===W)return;y.mouse=[K,X.invert(K)],Wn(this),y.start()}Dn(),y.wheel=setTimeout(function(){y.wheel=null,y.end()},ut),y.zoom("mouse",s(Lt(dt(X,W),y.mouse[0],y.mouse[1]),y.extent,M))}}function In(){if(!n&&e.apply(this,arguments)){var y=Yt(this,arguments,!0),X=Object(j.select)(j.event.view).on("mousemove.zoom",function(){if(Dn(),!y.moved){var zt=j.event.clientX-K,pt=j.event.clientY-J;y.moved=zt*zt+pt*pt>wt}y.zoom("mouse",s(Lt(y.that.__zoom,y.mouse[0]=Object(j.mouse)(y.that),y.mouse[1]),y.extent,M))},!0).on("mouseup.zoom",function(){X.on("mousemove.zoom mouseup.zoom",null),Nt(j.event.view,y.moved),Dn(),y.end()},!0),W=Object(j.mouse)(this),K=j.event.clientX,J=j.event.clientY;yt(j.event.view),ee(),y.mouse=[W,this.__zoom.invert(W)],Wn(this),y.start()}}function Ze(){if(e.apply(this,arguments)){var y=this.__zoom,X=Object(j.mouse)(this),W=y.invert(X),K=y.k*(j.event.shiftKey?.5:2),J=s(Lt(dt(y,K),X,W),i.apply(this,arguments),M);Dn(),v>0?Object(j.select)(this).transition().duration(v).call(mt,J,X):Object(j.select)(this).call($.transform,J)}}function Ke(){if(e.apply(this,arguments)){var y,X,W,K,J=j.event.touches,zt=J.length,pt=Yt(this,arguments,j.event.changedTouches.length===zt);for(ee(),X=0;X=0;)u+=c[h].value;else u=1;o.value=u}function H(o,u){var c,h,g,f,P,T=new yt(o),w=+o.value&&(T.value=o.value),k=[T];for(u==null&&(u=L);c=k.pop();)if(w&&(c.value=+c.data.value),(g=u(c.data))&&(P=g.length))for(c.children=new Array(P),f=P-1;f>=0;--f)k.push(h=c.children[f]=new yt(g[f])),h.parent=c,h.depth=c.depth+1;return T.eachBefore(lt)}function L(o){return o.children}function j(o){o.data=o.data.data}function lt(o){var u=0;do o.height=u;while((o=o.parent)&&o.height<++u)}function yt(o){this.data=o,this.depth=this.height=0,this.parent=null}yt.prototype=H.prototype={constructor:yt,count:function(){return this.eachAfter(rt)},each:function(o){var u,c,h,g,f=this,P=[f];do for(u=P.reverse(),P=[];f=u.pop();)if(o(f),c=f.children)for(h=0,g=c.length;h=0;--c)g.push(u[c]);return this},sum:function(o){return this.eachAfter(function(u){for(var c=+o(u.data)||0,h=u.children,g=h&&h.length;--g>=0;)c+=h[g].value;u.value=c})},sort:function(o){return this.eachBefore(function(u){u.children&&u.children.sort(o)})},path:function(o){for(var u=this,c=function(f,P){if(f===P)return f;var T=f.ancestors(),w=P.ancestors(),k=null;for(f=T.pop(),P=w.pop();f===P;)k=f,f=T.pop(),P=w.pop();return k}(u,o),h=[u];u!==c;)u=u.parent,h.push(u);for(var g=h.length;o!==c;)h.splice(g,0,o),o=o.parent;return h},ancestors:function(){for(var o=this,u=[o];o=o.parent;)u.push(o);return u},descendants:function(){var o=[];return this.each(function(u){o.push(u)}),o},leaves:function(){var o=[];return this.eachBefore(function(u){u.children||o.push(u)}),o},links:function(){var o=this,u=[];return o.each(function(c){c!==o&&u.push({source:c.parent,target:c})}),u},copy:function(){return H(this).eachBefore(j)}};var Nt=Array.prototype.slice,tt=function(o){for(var u,c,h=0,g=(o=function(P){for(var T,w,k=P.length;k;)w=Math.random()*k--|0,T=P[k],P[k]=P[w],P[w]=T;return P}(Nt.call(o))).length,f=[];h0&&c*c>h*h+g*g}function _t(o,u){for(var c=0;c(P*=P)?(h=(k+P-g)/(2*k),f=Math.sqrt(Math.max(0,P/k-h*h)),c.x=o.x-h*T-f*w,c.y=o.y-h*w+f*T):(h=(k+g-P)/(2*k),f=Math.sqrt(Math.max(0,g/k-h*h)),c.x=u.x+h*T-f*w,c.y=u.y+h*w+f*T)):(c.x=u.x+c.r,c.y=u.y)}function Vt(o,u){var c=o.r+u.r-1e-6,h=u.x-o.x,g=u.y-o.y;return c>0&&c*c>h*h+g*g}function xt(o){var u=o._,c=o.next._,h=u.r+c.r,g=(u.x*c.r+c.x*u.r)/h,f=(u.y*c.r+c.y*u.r)/h;return g*g+f*f}function Bt(o){this._=o,this.next=null,this.previous=null}function Pt(o){if(!(g=o.length))return 0;var u,c,h,g,f,P,T,w,k,B,R;if((u=o[0]).x=0,u.y=0,!(g>1))return u.r;if(c=o[1],u.x=-c.r,c.x=u.r,c.y=0,!(g>2))return u.r+c.r;Rt(c,u,h=o[2]),u=new Bt(u),c=new Bt(c),h=new Bt(h),u.next=h.previous=c,c.next=u.previous=h,h.next=c.previous=u;t:for(T=3;T0)throw new Error("cycle");return P}return c.id=function(h){return arguments.length?(o=At(h),c):o},c.parentId=function(h){return arguments.length?(u=At(h),c):u},c};function Jt(o,u){return o.parent===u.parent?1:2}function sn(o){var u=o.children;return u?u[0]:o.t}function vn(o){var u=o.children;return u?u[u.length-1]:o.t}function yn(o,u,c){var h=c/(u.i-o.i);u.c-=h,u.s+=c,o.c+=h,u.z+=c,u.m+=c}function qn(o,u,c){return o.a.parent===u.parent?o.a:c}function Et(o,u){this._=o,this.parent=null,this.children=null,this.A=null,this.a=this,this.z=0,this.m=0,this.c=0,this.s=0,this.t=null,this.i=u}Et.prototype=Object.create(yt.prototype);var _n=function(){var o=Jt,u=1,c=1,h=null;function g(w){var k=function(G){for(var ot,r,a,d,b,z=new Et(G,0),C=[z];ot=C.pop();)if(a=ot._.children)for(ot.children=new Array(b=a.length),d=b-1;d>=0;--d)C.push(r=ot.children[d]=new Et(a[d],d)),r.parent=ot;return(z.parent=new Et(null,0)).children=[z],z}(w);if(k.eachAfter(f),k.parent.m=-k.z,k.eachBefore(P),h)w.eachBefore(T);else{var B=w,R=w,_=w;w.eachBefore(function(G){G.xR.x&&(R=G),G.depth>_.depth&&(_=G)});var V=B===R?1:o(B,R)/2,F=V-B.x,nt=u/(R.x+V+F),it=c/(_.depth||1);w.eachBefore(function(G){G.x=(G.x+F)*nt,G.y=G.depth*it})}return w}function f(w){var k=w.children,B=w.parent.children,R=w.i?B[w.i-1]:null;if(k){(function(V){for(var F,nt=0,it=0,G=V.children,ot=G.length;--ot>=0;)(F=G[ot]).z+=nt,F.m+=nt,nt+=F.s+(it+=F.c)})(w);var _=(k[0].z+k[k.length-1].z)/2;R?(w.z=R.z+o(w._,R._),w.m=w.z-_):w.z=_}else R&&(w.z=R.z+o(w._,R._));w.parent.A=function(V,F,nt){if(F){for(var it,G=V,ot=V,r=F,a=G.parent.children[0],d=G.m,b=ot.m,z=r.m,C=a.m;r=vn(r),G=sn(G),r&&G;)a=sn(a),(ot=vn(ot)).a=V,(it=r.z+z-G.z-d+o(r._,G._))>0&&(yn(qn(r,V,nt),V,it),d+=it,b+=it),z+=r.m,d+=G.m,C+=a.m,b+=ot.m;r&&!vn(ot)&&(ot.t=r,ot.m+=z-b),G&&!sn(a)&&(a.t=G,a.m+=d-C,nt=V)}return nt}(w,R,w.parent.A||B[0])}function P(w){w._.x=w.z+w.parent.m,w.m+=w.parent.m}function T(w){w.x*=u,w.y=w.depth*c}return g.separation=function(w){return arguments.length?(o=w,g):o},g.size=function(w){return arguments.length?(h=!1,u=+w[0],c=+w[1],g):h?null:[u,c]},g.nodeSize=function(w){return arguments.length?(h=!0,u=+w[0],c=+w[1],g):h?[u,c]:null},g},tn=function(o,u,c,h,g){for(var f,P=o.children,T=-1,w=P.length,k=o.value&&(g-c)/o.value;++T_&&(_=T),it=B*B*nt,(V=Math.max(_/it,it/R))>F){B-=T;break}F=V}G.push(P={value:B,dice:w1?h:1)},c}(nn),On=function(){var o=Sn,u=!1,c=1,h=1,g=[0],f=bt,P=bt,T=bt,w=bt,k=bt;function B(_){return _.x0=_.y0=0,_.x1=c,_.y1=h,_.eachBefore(R),g=[0],u&&_.eachBefore(pn),_}function R(_){var V=g[_.depth],F=_.x0+V,nt=_.y0+V,it=_.x1-V,G=_.y1-V;it=_-1){var ot=T[R];return ot.x0=F,ot.y0=nt,ot.x1=it,void(ot.y1=G)}for(var r=k[R],a=V/2+r,d=R+1,b=_-1;d>>1;k[z]G-nt){var S=(F*Y+it*C)/V;B(R,d,C,F,nt,S,G),B(d,_,Y,S,nt,it,G)}else{var Z=(nt*Y+G*C)/V;B(R,d,C,F,nt,it,Z),B(d,_,Y,F,Z,it,G)}})(0,w,o.value,u,c,h,g)},jn=function(o,u,c,h,g){(1&o.depth?tn:Mt)(o,u,c,h,g)},wn=function o(u){function c(h,g,f,P,T){if((w=h._squarify)&&w.ratio===u)for(var w,k,B,R,_,V=-1,F=w.length,nt=h.value;++V1?h:1)},c}(nn);A.d(N,"cluster",function(){return D}),A.d(N,"hierarchy",function(){return H}),A.d(N,"pack",function(){return Wt}),A.d(N,"packSiblings",function(){return Xt}),A.d(N,"packEnclose",function(){return tt}),A.d(N,"partition",function(){return dn}),A.d(N,"stratify",function(){return En}),A.d(N,"tree",function(){return _n}),A.d(N,"treemap",function(){return On}),A.d(N,"treemapBinary",function(){return Dt}),A.d(N,"treemapDice",function(){return Mt}),A.d(N,"treemapSlice",function(){return tn}),A.d(N,"treemapSliceDice",function(){return jn}),A.d(N,"treemapSquarify",function(){return Sn}),A.d(N,"treemapResquarify",function(){return wn})}])})})(ve);var ye=ve.exports;const er=tr(ye),ir=nr({__proto__:null,default:er},[ye]);export{ir as i}; diff --git a/assets/chunks/jsmind.BLO5yOlf.js b/assets/chunks/jsmind.BLO5yOlf.js new file mode 100644 index 00000000..e8a2c0c6 --- /dev/null +++ b/assets/chunks/jsmind.BLO5yOlf.js @@ -0,0 +1,12 @@ +var Y=Object.defineProperty;var $=(w,y,g)=>y in w?Y(w,y,{enumerable:!0,configurable:!0,writable:!0,value:g}):w[y]=g;var j=(w,y,g)=>($(w,typeof y!="symbol"?y+"":y,g),g);import{g as J,c as q}from"./theme.MrCfoCxG.js";function G(w,y){for(var g=0;gh[v]})}}}return Object.freeze(Object.defineProperty(w,Symbol.toStringTag,{value:"Module"}))}var P={exports:{}};/** +* @license BSD-3-Clause +* @copyright 2014-2023 hizzgdev@163.com +* +* Project Home: +* https://github.com/hizzgdev/jsmind/ +*/(function(w,y){(function(g,h){w.exports=h()})(q,function(){const g="0.8.3";typeof String.prototype.startsWith!="function"&&(String.prototype.startsWith=function(s){return this.slice(0,s.length)===s});const h={left:-1,center:0,right:1,of:function(s){return s&&s!==-1&&s!==0&&s!==1?s==="-1"||s==="0"||s==="1"?parseInt(s):s.toLowerCase()==="left"?this.left:s.toLowerCase()==="right"?this.right:s.toLowerCase()==="center"?this.center:void 0:s}},v={show:1,resize:2,edit:3,select:4},x={debug:1,info:2,warn:3,error:4,disable:9};var b=function(){};let d=typeof console>"u"?{level:b,log:b,debug:b,info:b,warn:b,error:b}:{level:function(s){d.debug=s>x.debug?b:console.debug,d.info=s>x.info?b:console.info,d.warn=s>x.warn?b:console.warn,d.error=s>x.error?b:console.error},log:console.log,debug:console.debug,info:console.info,warn:console.warn,error:console.error};const _=new class{constructor(s){this.w=s,this.d=s.document,this.g=function(e){return this.d.getElementById(e)},this.c=function(e){return this.d.createElement(e)},this.t=function(e,t){e.hasChildNodes()?e.firstChild.nodeValue=t:e.appendChild(this.d.createTextNode(t))},this.h=function(e,t){t instanceof HTMLElement?(e.innerHTML="",e.appendChild(t)):e.innerHTML=t},this.i=function(e){return!!e&&typeof e=="object"&&e.nodeType===1&&typeof e.style=="object"&&typeof e.ownerDocument=="object"},this.on=function(e,t,i){e.addEventListener?e.addEventListener(t,i,!1):e.attachEvent("on"+t,i)}}}(window),z={file:{read:function(s,e){var t=new FileReader;t.onload=function(){typeof e=="function"&&e(this.result,s.name)},t.readAsText(s)},save:function(s,e,t){var i;if(typeof _.w.Blob=="function")i=new Blob([s],{type:e});else{var n=new(_.w.BlobBuilder||_.w.MozBlobBuilder||_.w.WebKitBlobBuilder||_.w.MSBlobBuilder);n.append(s),i=n.getBlob(e)}if(navigator.msSaveBlob)navigator.msSaveBlob(i,t);else{var o=(_.w.URL||_.w.webkitURL).createObjectURL(i),r=_.c("a");if("download"in r){r.style.visibility="hidden",r.href=o,r.download=t,_.d.body.appendChild(r);var a=_.d.createEvent("MouseEvents");a.initEvent("click",!0,!0),r.dispatchEvent(a),_.d.body.removeChild(r)}else location.href=o}}},json:{json2string:function(s){return JSON.stringify(s)},string2json:function(s){return JSON.parse(s)},merge:function(s,e){for(var t in e)t in s?typeof s[t]!="object"||Object.prototype.toString.call(s[t]).toLowerCase()!="[object object]"||s[t].length?s[t]=e[t]:z.json.merge(s[t],e[t]):s[t]=e[t];return s}},uuid:{newid:function(){return(new Date().getTime().toString(16)+Math.random().toString(16).substring(2)).substring(2,18)}},text:{is_empty:function(s){return!s||s.replace(/\s*/,"").length==0}}},W={container:"",editable:!1,theme:null,mode:"full",support_html:!0,log_level:"info",view:{engine:"canvas",hmargin:100,vmargin:50,line_width:2,line_color:"#555",line_style:"curved",draggable:!1,hide_scrollbars_when_draggable:!1,node_overflow:"hidden",zoom:{min:.5,max:2.1,step:.1},custom_node_render:null,expander_style:"char"},layout:{hspace:30,vspace:20,pspace:13,cousin_space:0},default_event_handle:{enable_mousedown_handle:!0,enable_click_handle:!0,enable_dblclick_handle:!0,enable_mousewheel_handle:!0},shortcut:{enable:!0,handles:{},mapping:{addchild:[45,4109],addbrother:13,editnode:113,delnode:46,toggle:32,left:37,up:38,right:39,down:40}},plugin:{}};class c{constructor(e,t,i,n,o,r,a,l){e?typeof t=="number"?(l===void 0&&(l=!0),this.id=e,this.index=t,this.topic=i,this.data=n||{},this.isroot=o,this.parent=r,this.direction=a,this.expanded=!!l,this.children=[],this._data={}):d.error("invalid node index"):d.error("invalid node id")}get_location(){var e=this._data.view;return{x:e.abs_x,y:e.abs_y}}get_size(){var e=this._data.view;return{w:e.width,h:e.height}}static compare(e,t){var i=e.index,n=t.index;return i>=0&&n>=0?i-n:i==-1&&n==-1?0:i==-1?1:n==-1?-1:0}static inherited(e,t){if(e&&t){if(e.id===t.id||e.isroot)return!0;for(var i=e.id,n=t;!n.isroot;)if((n=n.parent).id===i)return!0}return!1}static is_node(e){return!!e&&e instanceof c}}class k{constructor(){this.name=null,this.author=null,this.version=null,this.root=null,this.selected=null,this.nodes={}}get_node(e){return e in this.nodes?this.nodes[e]:(d.warn("the node[id="+e+"] can not be found"),null)}set_root(e,t,i){return this.root==null?(this.root=new c(e,0,t,i,!0),this._put_node(this.root),this.root):(d.error("root node is already exist"),null)}add_node(e,t,i,n,o,r,a){if(!c.is_node(e))return d.error("the parent_node "+e+" is not a node."),null;var l=new c(t,a||-1,i,n,!1,e,e.direction,r);return e.isroot&&(l.direction=o||h.right),this._put_node(l)?(e.children.push(l),this._update_index(e)):(d.error("fail, the node id '"+l.id+"' has been already exist."),l=null),l}insert_node_before(e,t,i,n,o){if(!c.is_node(e))return d.error("the node_before "+e+" is not a node."),null;var r=e.index-.5;return this.add_node(e.parent,t,i,n,o,!0,r)}get_node_before(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.get_node_before(t):(d.error("the node[id="+e+"] can not be found."),null)}if(e.isroot)return null;var i=e.index-2;return i>=0?e.parent.children[i]:null}insert_node_after(e,t,i,n,o){if(!c.is_node(e))return d.error("the node_after "+e+" is not a node."),null;var r=e.index+.5;return this.add_node(e.parent,t,i,n,o,!0,r)}get_node_after(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.get_node_after(t):(d.error("the node[id="+e+"] can not be found."),null)}if(e.isroot)return null;var i=e.index;return e.parent.children.length>i?e.parent.children[i]:null}move_node(e,t,i,n){return c.is_node(e)?(i||(i=e.parent.id),this._move_node(e,t,i,n)):(d.error("the parameter node "+e+" is not a node."),null)}_flow_node_direction(e,t){t===void 0?t=e.direction:e.direction=t;for(var i=e.children.length;i--;)this._flow_node_direction(e.children[i],t)}_move_node_internal(e,t){if(e&&t)if(t=="_last_")e.index=-1,this._update_index(e.parent);else if(t=="_first_")e.index=0,this._update_index(e.parent);else{var i=t?this.get_node(t):null;i!=null&&i.parent!=null&&i.parent.id==e.parent.id&&(e.index=i.index-.5,this._update_index(e.parent))}return e}_move_node(e,t,i,n){if(e&&i){var o=this.get_node(i);if(c.inherited(e,o))return d.error("can not move a node to its children"),null;if(e.parent.id!=i){for(var r=e.parent.children,a=r.length;a--;)if(r[a].id==e.id){r.splice(a,1);break}let l=e.parent;e.parent=o,o.children.push(e),this._update_index(l)}e.parent.isroot?n==h.left?e.direction=n:e.direction=h.right:e.direction=e.parent.direction,this._move_node_internal(e,t),this._flow_node_direction(e)}return e}remove_node(e){if(!c.is_node(e))return d.error("the parameter node "+e+" is not a node."),!1;if(e.isroot)return d.error("fail, can not remove root node"),!1;this.selected!=null&&this.selected.id==e.id&&(this.selected=null);for(var t=e.children,i=t.length;i--;)this.remove_node(t[i]);t.length=0;for(var n=e.parent,o=n.children,r=o.length;r--;)if(o[r].id==e.id){o.splice(r,1);break}for(var a in delete this.nodes[e.id],e)delete e[a];return e=null,this._update_index(n),!0}_put_node(e){return e.id in this.nodes?(d.warn("the node_id '"+e.id+"' has been already exist."),!1):(this.nodes[e.id]=e,!0)}_update_index(e){if(e instanceof c){e.children.sort(c.compare);for(var t=0;t0){t.children=[];for(var r=0;r0&&(n=t.length,a+=N)}return a},_extract_data:function(s){var e={};for(var t in s)t!="id"&&t!="topic"&&t!="parentid"&&t!="isroot"&&t!="direction"&&t!="expanded"&&(e[t]=s[t]);return e},_array:function(s,e){u.node_array._array_node(s.root,e)},_array_node:function(s,e){var t=u.node_array;if(s instanceof c){var i={id:s.id,topic:s.topic,expanded:s.expanded};if(s.parent&&(i.parentid=s.parent.id),s.isroot&&(i.isroot=!0),s.parent&&s.parent.isroot&&(i.direction=s.direction==h.left?"left":"right"),s.data!=null){var n=s.data;for(var o in n)i[o]=n[o]}e.push(i);for(var r=s.children.length,a=0;a'},get_mind:function(s){var e=u.freemind,t=new k;t.name=s.meta.name,t.author=s.meta.author,t.version=s.meta.version;var i=s.data,n=e._parse_xml(i),o=e._find_root(n);return e._load_node(t,null,o),t},get_data:function(s){var e=u.freemind,t={};t.meta={name:s.name,author:s.author,version:s.version},t.format="freemind";var i=[];return i.push(''),e._build_map(s.root,i),i.push(""),t.data=i.join(""),t},_parse_xml:function(s){var e=null;return window.DOMParser?e=new DOMParser().parseFromString(s,"text/xml"):((e=new ActiveXObject("Microsoft.XMLDOM")).async=!1,e.loadXML(s)),e},_find_root:function(s){for(var e=s.childNodes,t=null,i=null,n=0;n');var n=s.data;if(n!=null)for(var o in n)e.push('');for(var r=s.children,a=0;a")},_escape:function(s){return s.replace(/&/g,"&").replace(//g,">").replace(/'/g,"'").replace(/"/g,""")}},text:{example:{meta:C,format:"text",data:`jsMind text example + node1 + node1-sub + node1-sub + node2`},_line_regex:/\s*/,get_mind:function(s){var e=u.text,t=new k;t.name=s.meta.name,t.author=s.meta.author,t.version=s.meta.version;var i=s.data.split(/\n|\r/);return e._fill_nodes(t,i,0,0),t},_fill_nodes:function(s,e){let t=[],i=0;for(;i0)return void log.error("more than 1 root node was found: "+r);if(o>t.length)return void log.error("a suspended node was found: "+r);let a=t.length-o;for(;a--;)t.pop();if(o==0&&t.length==0){let l=s.set_root(z.uuid.newid(),r);t.push(l)}else{let l=s.add_node(t[o-1],z.uuid.newid(),r,{},null);t.push(l)}i++}t.length=0},get_data:function(s){var e=u.text,t={};t.meta={name:s.name,author:s.author,version:s.version},t.format="text";let i=[];return e._build_lines(i,[s.root],0),t.data=i.join(` +`),t},_build_lines:function(s,e,t){let i=new Array(t+1).join(" ");for(let n of e)s.push(i+n.topic),n.children&&u.text._build_lines(s,n.children,t+1)}}};class H{constructor(e){this.jm=e}init(){d.debug("data.init")}reset(){d.debug("data.reset")}load(e){var t=null,i=null;return(t=typeof e=="object"?e.format?e.format:"node_tree":"freemind")=="node_array"?i=u.node_array.get_mind(e):t=="node_tree"?i=u.node_tree.get_mind(e):t=="freemind"?i=u.freemind.get_mind(e):t=="text"?i=u.text.get_mind(e):d.warn("unsupported format"),i}get_data(e){var t=null;return e=="node_array"?t=u.node_array.get_data(this.jm.mind):e=="node_tree"?t=u.node_tree.get_data(this.jm.mind):e=="freemind"?t=u.freemind.get_data(this.jm.mind):e=="text"?t=u.text.get_data(this.jm.mind):d.error("unsupported "+e+" format"),t}}class X{constructor(e,t){this.opts=t,this.jm=e,this.isside=this.opts.mode=="side",this.bounds=null,this.cache_valid=!1}init(){d.debug("layout.init")}reset(){d.debug("layout.reset"),this.bounds={n:0,s:0,w:0,e:0}}calculate_next_child_direction(e){if(this.isside)return h.right;for(var t=e.children||[],i=t.length,n=0,o=0;o1&&n>0?h.left:h.right}layout(){d.debug("layout.layout"),this.layout_direction(),this.layout_offset()}layout_direction(){this._layout_direction_root()}_layout_direction_root(){var e=this.jm.mind.root,t=null;"layout"in e._data?t=e._data.layout:(t={},e._data.layout=t);var i=e.children,n=i.length;if(t.direction=h.center,t.side_index=0,this.isside)for(var o=n;o--;)this._layout_direction_side(i[o],h.right,o);else{o=n;for(var r=null;o--;)(r=i[o]).direction==h.left?this._layout_direction_side(r,h.left,o):this._layout_direction_side(r,h.right,o)}}_layout_direction_side(e,t,i){var n=null;"layout"in e._data?n=e._data.layout:(n={},e._data.layout=n);var o=e.children,r=o.length;n.direction=t,n.side_index=i;for(var a=r;a--;)this._layout_direction_side(o[a],t,a)}layout_offset(){var e=this.jm.mind.root,t=e._data.layout;t.offset_x=0,t.offset_y=0,t.outer_height=0;for(var i=e.children,n=i.length,o=[],r=[],a=null;n--;)(a=i[n])._data.layout.direction==h.right?r.unshift(a):o.unshift(a);t.left_nodes=o,t.right_nodes=r,t.outer_height_left=this._layout_offset_subnodes(o),t.outer_height_right=this._layout_offset_subnodes(r),this.bounds.e=e._data.view.width/2,this.bounds.w=0-this.bounds.e,this.bounds.n=0,this.bounds.s=Math.max(t.outer_height_left,t.outer_height_right)}_layout_offset_subnodes(e){for(var t=0,i=e.length,n=i,o=null,r=0,a=null,l=0,p=null;n--;)a=(o=e[n])._data.layout,p==null&&(p=o.parent._data),r=this._layout_offset_subnodes(o.children),o.expanded||(r=0,this.set_visible(o.children,!1)),r=Math.max(o._data.view.height,r),o.children.length>1&&(r+=this.opts.cousin_space),a.outer_height=r,a.offset_y=l-r/2,a.offset_x=this.opts.hspace*a.direction+p.view.width*(p.layout.direction+a.direction)/2,o.parent.isroot||(a.offset_x+=this.opts.pspace*a.direction),l=l-r-this.opts.vspace,t+=r;i>1&&(t+=this.opts.vspace*(i-1)),n=i;for(var f=t/2;n--;)(o=e[n])._data.layout.offset_y+=f;return t}_layout_offset_subnodes_height(e){for(var t=0,i=e.length,n=i,o=null,r=0,a=null,l=0,p=null;n--;)a=(o=e[n])._data.layout,p==null&&(p=o.parent._data),r=this._layout_offset_subnodes_height(o.children),o.expanded||(r=0),r=Math.max(o._data.view.height,r),o.children.length>1&&(r+=this.opts.cousin_space),a.outer_height=r,a.offset_y=l-r/2,l=l-r-this.opts.vspace,t+=r;i>1&&(t+=this.opts.vspace*(i-1)),n=i;for(var f=t/2;n--;)(o=e[n])._data.layout.offset_y+=f;return t}get_node_offset(e){var t=e._data.layout,i=null;if("_offset_"in t&&this.cache_valid?i=t._offset_:(i={x:-1,y:-1},t._offset_=i),i.x==-1||i.y==-1){var n=t.offset_x,o=t.offset_y;if(!e.isroot){var r=this.get_node_offset(e.parent);n+=r.x,o+=r.y}i.x=n,i.y=o}return i}get_node_point(e){var t=e._data.view,i=this.get_node_offset(e),n={};return n.x=i.x+t.width*(e._data.layout.direction-1)/2,n.y=i.y-t.height/2,n}get_node_point_in(e){return this.get_node_offset(e)}get_node_point_out(e){var t=e._data.layout,i=null;if("_pout_"in t&&this.cache_valid?i=t._pout_:(i={x:-1,y:-1},t._pout_=i),i.x==-1||i.y==-1)if(e.isroot)i.x=0,i.y=0;else{var n=e._data.view,o=this.get_node_offset(e);i.x=o.x+(n.width+this.opts.pspace)*e._data.layout.direction,i.y=o.y}return i}get_expander_point(e){var t=this.get_node_point_out(e),i={};return e._data.layout.direction==h.right?i.x=t.x-this.opts.pspace:i.x=t.x,i.y=t.y-Math.ceil(this.opts.pspace/2),i}get_min_size(){var e=this.jm.mind.nodes,t=null,i=null;for(var n in e)t=e[n],(i=this.get_node_point_out(t)).x>this.bounds.e&&(this.bounds.e=i.x),i.x0){var o=this.jm.mind.root;this.part_layout(o),this.set_visible(o.children,!0)}}collapse_all(){var e,t=this.jm.mind.nodes,i=0;for(var n in t)(e=t[n]).expanded&&!e.isroot&&(e.expanded=!1,i++);if(i>0){var o=this.jm.mind.root;this.part_layout(o),this.set_visible(o.children,!0)}}expand_to_depth(e,t,i){if(!(e<1))for(var n=t||this.jm.mind.root.children,o=i||1,r=n.length,a=null;r--;)a=n[r],o{i[0].isIntersecting&&(n.unobserve(this.e_panel),this.resize())}).observe(this.e_panel)}else d.error("the options.view.container was not be found in dom")}add_event(e,t,i,n){let o=n?this.e_panel:this.e_nodes;_.on(o,t,function(r){var a=r||event;i.call(e,a)})}get_binded_nodeid(e){if(e==null)return null;var t=e.tagName.toLowerCase();return t=="jmnode"||t=="jmexpander"?e.getAttribute("nodeid"):t=="jmnodes"||t=="body"||t=="html"?null:this.get_binded_nodeid(e.parentElement)}is_node(e){if(e==null)return!1;var t=e.tagName.toLowerCase();return t=="jmnode"||t!="jmnodes"&&t!="body"&&t!="html"&&this.is_node(e.parentElement)}is_expander(e){return e.tagName.toLowerCase()=="jmexpander"}reset(){d.debug("view.reset"),this.selected_node=null,this.clear_lines(),this.clear_nodes(),this.reset_theme()}reset_theme(){var e=this.jm.options.theme;this.e_nodes.className=e?"theme-"+e:""}reset_custom_style(){var e=this.jm.mind.nodes;for(var t in e)this.reset_node_custom_style(e[t])}load(){d.debug("view.load"),this.setup_canvas_draggable(this.opts.draggable),this.init_nodes(),this._initialized=!0}expand_size(){var e=this.layout.get_min_size(),t=e.w+2*this.opts.hmargin,i=e.h+2*this.opts.vmargin,n=this.e_panel.clientWidth,o=this.e_panel.clientHeight;n{for(var n in e)this.init_nodes_size(e[n])})}add_node(e){this.create_node_element(e,this.e_nodes),this.run_in_c11y_mode_if_needed(()=>{this.init_nodes_size(e)})}run_in_c11y_mode_if_needed(e){this.container.offsetParent?e():(d.warn("init nodes in compatibility mode. because the container or its parent has style {display:none}. "),this.e_panel.style.position="absolute",this.e_panel.style.top="-100000",_.d.body.appendChild(this.e_panel),e(),this.container.appendChild(this.e_panel),this.e_panel.style.position=null,this.e_panel.style.top=null)}create_node_element(e,t){var i=null;"view"in e._data?i=e._data.view:(i={},e._data.view=i);var n=_.c("jmnode");if(e.isroot)n.className="root";else{var o=_.c("jmexpander");_.t(o,"-"),o.setAttribute("nodeid",e.id),o.style.visibility="hidden",t.appendChild(o),i.expander=o}e.topic&&this.render_node(n,e),n.setAttribute("nodeid",e.id),n.style.visibility="hidden",this._reset_node_custom_style(n,e.data),t.appendChild(n),i.element=n}remove_node(e){this.selected_node!=null&&this.selected_node.id==e.id&&(this.selected_node=null),this.editing_node!=null&&this.editing_node.id==e.id&&(e._data.view.element.removeChild(this.e_editor),this.editing_node=null);for(var t=e.children,i=t.length;i--;)this.remove_node(t[i]);if(e._data.view){var n=e._data.view.element,o=e._data.view.expander;this.e_nodes.removeChild(n),this.e_nodes.removeChild(o),e._data.view.element=null,e._data.view.expander=null}}update_node(e){var t=e._data.view,i=t.element;if(e.topic&&this.render_node(i,e),this.layout.is_visible(e))t.width=i.clientWidth,t.height=i.clientHeight;else{let n=i.getAttribute("style");i.style="visibility: visible; left:0; top:0;",t.width=i.clientWidth,t.height=i.clientHeight,i.style=n}}select_node(e){if(this.selected_node){var t=this.selected_node._data.view.element;t.className=t.className.replace(/\s*selected\b/i,""),this.restore_selected_node_custom_style(this.selected_node)}e&&(this.selected_node=e,e._data.view.element.className+=" selected",this.clear_selected_node_custom_style(e))}select_clear(){this.select_node(null)}get_editing_node(){return this.editing_node}is_editing(){return!!this.editing_node}edit_node_begin(e){if(e.topic){this.editing_node!=null&&this.edit_node_end(),this.editing_node=e;var t=e._data.view.element,i=e.topic,n=getComputedStyle(t);this.e_editor.value=i,this.e_editor.style.width=t.clientWidth-parseInt(n.getPropertyValue("padding-left"))-parseInt(n.getPropertyValue("padding-right"))+"px",t.innerHTML="",t.appendChild(this.e_editor),t.style.zIndex=5,this.e_editor.focus(),this.e_editor.select()}else d.warn("don't edit image nodes")}edit_node_end(){if(this.editing_node!=null){var e=this.editing_node;this.editing_node=null;var t=e._data.view.element,i=this.e_editor.value;t.style.zIndex="auto",t.removeChild(this.e_editor),z.text.is_empty(i)||e.topic===i?this.render_node(t,e):this.jm.update_node(e.id,i)}this.e_panel.focus()}get_view_offset(){var e=this.layout.bounds;return{x:(this.size.w-e.e-e.w)/2,y:this.size.h/2}}resize(){this.graph.set_size(1,1),this.e_nodes.style.width="1px",this.e_nodes.style.height="1px",this.expand_size(),this._show()}_show(){this.graph.set_size(this.size.w,this.size.h),this.e_nodes.style.width=this.size.w+"px",this.e_nodes.style.height=this.size.h+"px",this.show_nodes(),this.show_lines(),this.jm.invoke_event_handle(v.resize,{data:[]})}zoom_in(e){return this.set_zoom(this.zoom_current+this.opts.zoom.step,e)}zoom_out(e){return this.set_zoom(this.zoom_current-this.opts.zoom.step,e)}set_zoom(e,t){if(ethis.opts.zoom.max)return!1;let i=this.e_panel.getBoundingClientRect();if(e<1&&e99?"...":e.children.length:t==="char"?e.expanded?"-":"+":void 0}_default_node_render(e,t){this.opts.support_html?_.h(e,t.topic):_.t(e,t.topic)}_custom_node_render(e,t){this.opts.custom_node_render(this.jm,e,t)||this._default_node_render(e,t)}reset_node_custom_style(e){this._reset_node_custom_style(e._data.view.element,e.data)}_reset_node_custom_style(e,t){if("background-color"in t&&(e.style.backgroundColor=t["background-color"]),"foreground-color"in t&&(e.style.color=t["foreground-color"]),"width"in t&&(e.style.width=t.width+"px"),"height"in t&&(e.style.height=t.height+"px"),"font-size"in t&&(e.style.fontSize=t["font-size"]+"px"),"font-weight"in t&&(e.style.fontWeight=t["font-weight"]),"font-style"in t&&(e.style.fontStyle=t["font-style"]),"background-image"in t){var i=t["background-image"];if(i.startsWith("data")&&t.width&&t.height){var n=new Image;n.onload=function(){var o=_.c("canvas");if(o.width=e.clientWidth,o.height=e.clientHeight,o.getContext){o.getContext("2d").drawImage(this,2,2,e.clientWidth,e.clientHeight);var r=o.toDataURL();e.style.backgroundImage="url("+r+")"}},n.src=i}else e.style.backgroundImage="url("+i+")";e.style.backgroundSize="99%","background-rotation"in t&&(e.style.transform="rotate("+t["background-rotation"]+"deg)")}}restore_selected_node_custom_style(e){var t=e._data.view.element,i=e.data;"background-color"in i&&(t.style.backgroundColor=i["background-color"]),"foreground-color"in i&&(t.style.color=i["foreground-color"])}clear_selected_node_custom_style(e){var t=e._data.view.element;t.style.backgroundColor="",t.style.color=""}clear_lines(){this.graph.clear()}show_lines(){this.clear_lines();var e=this.jm.mind.nodes,t=null,i=null,n=null,o=null,r=this.get_view_offset();for(var a in e)(t=e[a]).isroot||this.layout.is_visible(t)&&(i=this.layout.get_node_point_in(t),n=this.layout.get_node_point_out(t.parent),o=t.data["leading-line-color"],this.graph.draw_line(n,i,r,o))}setup_canvas_draggable(e){if(this.opts.draggable=e,!this._initialized){let t,i,n=!1;this.opts.hide_scrollbars_when_draggable&&(this.e_panel.style="overflow: hidden"),_.on(this.container,"mousedown",o=>{this.opts.draggable&&(n=!0,t=o.clientX,i=o.clientY)}),_.on(this.container,"mouseup",()=>{n=!1}),_.on(this.container,"mousemove",o=>{this.opts.draggable&&n&&(this.e_panel.scrollBy(t-o.clientX,i-o.clientY),t=o.clientX,i=o.clientY)})}}center_node(e){if(!this.layout.is_visible(e))return d.warn("can not scroll to the node, because it is invisible"),!1;let t=e._data.view,i=this.e_panel.getBoundingClientRect(),n=t.abs_x+t.width/2,o=t.abs_y+t.height/2;return this.e_panel.scrollTo(n*this.zoom_current-i.width/2,o*this.zoom_current-i.height/2),!0}zoomIn(e){return d.warn("please use zoom_in instead"),this.zoom_in(e)}zoomOut(e){return d.warn("please use zoom_out instead"),this.zoom_out(e)}setZoom(e,t){return d.warn("please use set_zoom instead"),this.set_zoom(e,t)}}class K{constructor(e,t){this.jm=e,this.opts=t,this.mapping=t.mapping,this.handles=t.handles,this._newid=null,this._mapping={}}init(){for(var e in _.on(this.jm.view.e_panel,"keydown",this.handler.bind(this)),this.handles.addchild=this.handle_addchild,this.handles.addbrother=this.handle_addbrother,this.handles.editnode=this.handle_editnode,this.handles.delnode=this.handle_delnode,this.handles.toggle=this.handle_toggle,this.handles.up=this.handle_up,this.handles.down=this.handle_down,this.handles.left=this.handle_left,this.handles.right=this.handle_right,this.mapping)if(this.mapping[e]&&e in this.handles){let t=this.mapping[e];Array.isArray(t)||(t=[t]);for(let i of t)this._mapping[i]=this.handles[e]}typeof this.opts.id_generator=="function"?this._newid=this.opts.id_generator:this._newid=z.uuid.newid}enable_shortcut(){this.opts.enable=!0}disable_shortcut(){this.opts.enable=!1}handler(e){if(e.which==9&&e.preventDefault(),!this.jm.view.is_editing()){var t=e||event;if(!this.opts.enable)return!0;var i=t.keyCode+(t.metaKey<<13)+(t.ctrlKey<<12)+(t.altKey<<11)+(t.shiftKey<<10);i in this._mapping&&this._mapping[i].call(this,this.jm,e)}}handle_addchild(e,t){var i=e.get_selected_node();if(i){var n=this._newid();e.add_node(i,n,"New Node")&&(e.select_node(n),e.begin_edit(n))}}handle_addbrother(e,t){var i=e.get_selected_node();if(i&&!i.isroot){var n=this._newid();e.insert_node_after(i,n,"New Node")&&(e.select_node(n),e.begin_edit(n))}}handle_editnode(e,t){var i=e.get_selected_node();i&&e.begin_edit(i)}handle_delnode(e,t){var i=e.get_selected_node();i&&!i.isroot&&(e.select_node(i.parent),e.remove_node(i))}handle_toggle(e,t){var i=t||event,n=e.get_selected_node();n&&(e.toggle_node(n.id),i.stopPropagation(),i.preventDefault())}handle_up(e,t){var i=t||event,n=e.get_selected_node();if(n){var o=e.find_node_before(n);if(!o){var r=e.find_node_before(n.parent);r&&r.children.length>0&&(o=r.children[r.children.length-1])}o&&e.select_node(o),i.stopPropagation(),i.preventDefault()}}handle_down(e,t){var i=t||event,n=e.get_selected_node();if(n){var o=e.find_node_after(n);if(!o){var r=e.find_node_after(n.parent);r&&r.children.length>0&&(o=r.children[0])}o&&e.select_node(o),i.stopPropagation(),i.preventDefault()}}handle_left(e,t){this._handle_direction(e,t,h.left)}handle_right(e,t){this._handle_direction(e,t,h.right)}_handle_direction(e,t,i){var n=t||event,o=e.get_selected_node(),r=null;if(o){if(o.isroot){for(var a=o.children,l=[],p=0;p0&&(r=l[Math.floor((f-1)/2)])}else r=o.parent;r&&e.select_node(r),n.stopPropagation(),n.preventDefault()}}}const T={plugins:[]};function U(s){if(!(s instanceof A))throw new Error("can not register plugin, it is not an instance of Plugin");if(T.plugins.map(e=>e.name).includes(s.name))throw new Error("can not register plugin "+s.name+": plugin name already exist");T.plugins.push(s)}function V(s,e){_.w.setTimeout(function(){(function(t,i){T.plugins.forEach(n=>n.fn_init(t,i[n.name]))})(s,e)},0)}class A{constructor(e,t){if(!e)throw new Error("plugin must has a name");if(!t||typeof t!="function")throw new Error("plugin must has an init function");this.name=e,this.fn_init=t}}const m=class m{constructor(e){m.current=this,this.options=function(t){var i={};if(z.json.merge(i,W),z.json.merge(i,t),!i.container)throw new Error("the options.container should not be null or empty.");return i}(e),d.level(x[this.options.log_level]),this.version=g,this.initialized=!1,this.mind=null,this.event_handles=[],this.init()}init(){if(!this.initialized){this.initialized=!0;var e={mode:this.options.mode,hspace:this.options.layout.hspace,vspace:this.options.layout.vspace,pspace:this.options.layout.pspace,cousin_space:this.options.layout.cousin_space},t={container:this.options.container,support_html:this.options.support_html,engine:this.options.view.engine,hmargin:this.options.view.hmargin,vmargin:this.options.view.vmargin,line_width:this.options.view.line_width,line_color:this.options.view.line_color,line_style:this.options.view.line_style,draggable:this.options.view.draggable,hide_scrollbars_when_draggable:this.options.view.hide_scrollbars_when_draggable,node_overflow:this.options.view.node_overflow,zoom:this.options.view.zoom,custom_node_render:this.options.view.custom_node_render,expander_style:this.options.view.expander_style};this.data=new H(this),this.layout=new X(this,e),this.view=new F(this,t),this.shortcut=new K(this,this.options.shortcut),this.data.init(),this.layout.init(),this.view.init(),this.shortcut.init(),this._event_bind(),V(this,this.options.plugin)}}get_editable(){return this.options.editable}enable_edit(){this.options.editable=!0}disable_edit(){this.options.editable=!1}get_view_draggable(){return this.options.view.draggable}enable_view_draggable(){this.options.view.draggable=!0,this.view.setup_canvas_draggable(!0)}disable_view_draggable(){this.options.view.draggable=!1,this.view.setup_canvas_draggable(!1)}enable_event_handle(e){this.options.default_event_handle["enable_"+e+"_handle"]=!0}disable_event_handle(e){this.options.default_event_handle["enable_"+e+"_handle"]=!1}set_theme(e){var t=this.options.theme;this.options.theme=e||null,t!=this.options.theme&&(this.view.reset_theme(),this.view.reset_custom_style())}_event_bind(){this.view.add_event(this,"mousedown",this.mousedown_handle),this.view.add_event(this,"click",this.click_handle),this.view.add_event(this,"dblclick",this.dblclick_handle),this.view.add_event(this,"mousewheel",this.mousewheel_handle,!0)}mousedown_handle(e){if(this.options.default_event_handle.enable_mousedown_handle){var t=e.target||event.srcElement,i=this.view.get_binded_nodeid(t);i?this.view.is_node(t)&&this.select_node(i):this.select_clear()}}click_handle(e){if(this.options.default_event_handle.enable_click_handle){var t=e.target||event.srcElement;if(this.view.is_expander(t)){var i=this.view.get_binded_nodeid(t);i&&this.toggle_node(i)}}}dblclick_handle(e){if(this.options.default_event_handle.enable_dblclick_handle&&this.get_editable()){var t=e.target||event.srcElement;if(this.view.is_node(t)){var i=this.view.get_binded_nodeid(t);i&&this.begin_edit(i)}}}mousewheel_handle(e){if(this.options.default_event_handle.enable_mousewheel_handle&&e.ctrlKey){var t=e||event;t.preventDefault(),t.deltaY<0?this.view.zoom_in(t):this.view.zoom_out(t)}}begin_edit(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.begin_edit(t):(d.error("the node[id="+e+"] can not be found."),!1)}this.get_editable()?this.view.edit_node_begin(e):d.error("fail, this mind map is not editable.")}end_edit(){this.view.edit_node_end()}toggle_node(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.toggle_node(t):void d.error("the node[id="+e+"] can not be found.")}e.isroot||(this.view.save_location(e),this.layout.toggle_node(e),this.view.relayout(),this.view.restore_location(e))}expand_node(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.expand_node(t):void d.error("the node[id="+e+"] can not be found.")}e.isroot||(this.view.save_location(e),this.layout.expand_node(e),this.view.relayout(),this.view.restore_location(e))}collapse_node(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.collapse_node(t):void d.error("the node[id="+e+"] can not be found.")}e.isroot||(this.view.save_location(e),this.layout.collapse_node(e),this.view.relayout(),this.view.restore_location(e))}expand_all(){this.layout.expand_all(),this.view.relayout()}collapse_all(){this.layout.collapse_all(),this.view.relayout()}expand_to_depth(e){this.layout.expand_to_depth(e),this.view.relayout()}_reset(){this.view.reset(),this.layout.reset(),this.data.reset()}_show(e){var t=e||u.node_array.example;this.mind=this.data.load(t),this.mind?(d.debug("data.load ok"),this.view.load(),d.debug("view.load ok"),this.layout.layout(),d.debug("layout.layout ok"),this.view.show(!0),d.debug("view.show ok"),this.invoke_event_handle(v.show,{data:[e]})):d.error("data.load error")}show(e){this._reset(),this._show(e)}get_meta(){return{name:this.mind.name,author:this.mind.author,version:this.mind.version}}get_data(e){var t=e||"node_tree";return this.data.get_data(t)}get_root(){return this.mind.root}get_node(e){return c.is_node(e)?e:this.mind.get_node(e)}add_node(e,t,i,n,o){if(this.get_editable()){var r=this.get_node(e),a=h.of(o);a===void 0&&(a=this.layout.calculate_next_child_direction(r));var l=this.mind.add_node(r,t,i,n,a);return l&&(this.view.add_node(l),this.layout.layout(),this.view.show(!1),this.view.reset_node_custom_style(l),this.expand_node(r),this.invoke_event_handle(v.edit,{evt:"add_node",data:[r.id,t,i,n,a],node:t})),l}return d.error("fail, this mind map is not editable"),null}insert_node_before(e,t,i,n,o){if(this.get_editable()){var r=this.get_node(e),a=h.of(o);a===void 0&&(a=this.layout.calculate_next_child_direction(r.parent));var l=this.mind.insert_node_before(r,t,i,n,a);return l&&(this.view.add_node(l),this.layout.layout(),this.view.show(!1),this.invoke_event_handle(v.edit,{evt:"insert_node_before",data:[r.id,t,i,n,a],node:t})),l}return d.error("fail, this mind map is not editable"),null}insert_node_after(e,t,i,n,o){if(this.get_editable()){var r=this.get_node(e),a=h.of(o);a===void 0&&(a=this.layout.calculate_next_child_direction(r.parent));var l=this.mind.insert_node_after(r,t,i,n,a);return l&&(this.view.add_node(l),this.layout.layout(),this.view.show(!1),this.invoke_event_handle(v.edit,{evt:"insert_node_after",data:[r.id,t,i,n,a],node:t})),l}return d.error("fail, this mind map is not editable"),null}remove_node(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.remove_node(t):(d.error("the node[id="+e+"] can not be found."),!1)}if(this.get_editable()){if(e.isroot)return d.error("fail, can not remove root node"),!1;var i=e.id,n=e.parent.id,o=this.get_node(n);return this.view.save_location(o),this.view.remove_node(e),this.mind.remove_node(e),this.layout.layout(),this.view.show(!1),this.view.restore_location(o),this.invoke_event_handle(v.edit,{evt:"remove_node",data:[i],node:n}),!0}return d.error("fail, this mind map is not editable"),!1}update_node(e,t){if(this.get_editable())if(z.text.is_empty(t))d.warn("fail, topic can not be empty");else{var i=this.get_node(e);if(i){if(i.topic===t)return d.info("nothing changed"),void this.view.update_node(i);i.topic=t,this.view.update_node(i),this.layout.layout(),this.view.show(!1),this.invoke_event_handle(v.edit,{evt:"update_node",data:[e,t],node:e})}}else d.error("fail, this mind map is not editable")}move_node(e,t,i,n){if(this.get_editable()){var o=this.get_node(e),r=this.mind.move_node(o,t,i,n);r&&(this.view.update_node(r),this.layout.layout(),this.view.show(!1),this.invoke_event_handle(v.edit,{evt:"move_node",data:[e,t,i,n],node:e}))}else d.error("fail, this mind map is not editable")}select_node(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.select_node(t):void d.error("the node[id="+e+"] can not be found.")}this.layout.is_visible(e)&&(this.mind.selected=e,this.view.select_node(e),this.invoke_event_handle(v.select,{evt:"select_node",data:[],node:e.id}))}get_selected_node(){return this.mind?this.mind.selected:null}select_clear(){this.mind&&(this.mind.selected=null,this.view.select_clear())}is_node_visible(e){return this.layout.is_visible(e)}scroll_node_to_center(e){if(c.is_node(e))this.view.center_node(e);else{var t=this.get_node(e);t?this.scroll_node_to_center(t):d.error("the node[id="+e+"] can not be found.")}}find_node_before(e){if(!c.is_node(e)){var t=this.get_node(e);return t?this.find_node_before(t):void d.error("the node[id="+e+"] can not be found.")}if(e.isroot)return null;var i=null;if(e.parent.isroot)for(var n=e.parent.children,o=null,r=null,a=0;a __vite__mapDeps.viteFileDeps[i]) +} +import{d as z,o as b,c as L,r as P,a as rt,t as _e,n as ke,b as Z,w as D,e as q,T as Yn,_ as Y,u as _o,i as ko,f as wo,g as pn,h as ge,j as Vt,k as ee,l as ze,m as A,p as $,q as Le,s as Pe,v as wt,x as Un,y as $t,z as hn,A as Qn,B as Ji,C as Ki,D as $o,E as St,F as we,G as je,H as Yi,I as vn,J,K as jt,L as Qi,M as gn,N as cn,O as mn,P as So,Q as Zn,R as To,S as zn,U as xo,V as Zi,W as Co,X as Lo,Y as yn,Z as er,$ as tr,a0 as Po,a1 as No,a2 as Eo,a3 as Ao,a4 as Do}from"./framework.DWhUQBuX.js";const jo=z({__name:"VPBadge",props:{text:{},type:{default:"tip"}},setup(c){return(a,u)=>(b(),L("span",{class:ke(["VPBadge",a.type])},[P(a.$slots,"default",{},()=>[rt(_e(a.text),1)])],2))}}),Vo={key:0,class:"VPBackdrop"},Mo=z({__name:"VPBackdrop",props:{show:{type:Boolean}},setup(c){return(a,u)=>(b(),Z(Yn,{name:"fade"},{default:D(()=>[a.show?(b(),L("div",Vo)):q("",!0)]),_:1}))}}),Io=Y(Mo,[["__scopeId","data-v-c79a1216"]]),le=_o;function Ho(c,a){let u,d=!1;return()=>{u&&clearTimeout(u),d?u=setTimeout(c,a):(c(),(d=!0)&&setTimeout(()=>d=!1,a))}}function Gn(c){return/^\//.test(c)?c:`/${c}`}function ei(c){const{pathname:a,search:u,hash:d,protocol:p}=new URL(c,"http://a.com");if(ko(c)||c.startsWith("#")||!p.startsWith("http")||!wo(a))return c;const{site:m}=le(),S=a.endsWith("/")||a.endsWith(".html")?c:c.replace(/(?:(^\.+)\/)?.*$/,`$1${a.replace(/(\.md)?$/,m.value.cleanUrls?"":".html")}${u}${d}`);return pn(S)}const ti=ge(Vt?location.hash:"");Vt&&window.addEventListener("hashchange",()=>{ti.value=location.hash});function Jt({removeCurrent:c=!0,correspondingLink:a=!1}={}){const{site:u,localeIndex:d,page:p,theme:m}=le(),S=ee(()=>{var N,R;return{label:(N=u.value.locales[d.value])==null?void 0:N.label,link:((R=u.value.locales[d.value])==null?void 0:R.link)||(d.value==="root"?"/":`/${d.value}/`)}});return{localeLinks:ee(()=>Object.entries(u.value.locales).flatMap(([N,R])=>c&&S.value.label===R.label?[]:{text:R.label,link:Oo(R.link||(N==="root"?"/":`/${N}/`),m.value.i18nRouting!==!1&&a,p.value.relativePath.slice(S.value.link.length-1),!u.value.cleanUrls)+ti.value})),currentLang:S}}function Oo(c,a,u,d){return a?c.replace(/\/$/,"")+Gn(u.replace(/(^|\/)index\.md$/,"$1").replace(/\.md$/,d?".html":"")):c}const qo=c=>(Le("data-v-f87ff6e4"),c=c(),Pe(),c),Fo={class:"NotFound"},Bo={class:"code"},Ro={class:"title"},Wo=qo(()=>A("div",{class:"divider"},null,-1)),Uo={class:"quote"},zo={class:"action"},Go=["href","aria-label"],Xo=z({__name:"NotFound",setup(c){const{site:a,theme:u}=le(),{localeLinks:d}=Jt({removeCurrent:!1}),p=ge("/");return ze(()=>{var S;const m=window.location.pathname.replace(a.value.base,"").replace(/(^.*?\/).*$/,"/$1");d.value.length&&(p.value=((S=d.value.find(({link:E})=>E.startsWith(m)))==null?void 0:S.link)||d.value[0].link)}),(m,S)=>{var E,N,R,G,W;return b(),L("div",Fo,[A("p",Bo,_e(((E=$(u).notFound)==null?void 0:E.code)??"404"),1),A("h1",Ro,_e(((N=$(u).notFound)==null?void 0:N.title)??"PAGE NOT FOUND"),1),Wo,A("blockquote",Uo,_e(((R=$(u).notFound)==null?void 0:R.quote)??"But if you don't change your direction, and if you keep looking, you may end up where you are heading."),1),A("div",zo,[A("a",{class:"link",href:$(pn)(p.value),"aria-label":((G=$(u).notFound)==null?void 0:G.linkLabel)??"go to home"},_e(((W=$(u).notFound)==null?void 0:W.linkText)??"Take me home"),9,Go)])])}}}),Jo=Y(Xo,[["__scopeId","data-v-f87ff6e4"]]);function nr(c,a){if(Array.isArray(c))return fn(c);if(c==null)return[];a=Gn(a);const u=Object.keys(c).sort((p,m)=>m.split("/").length-p.split("/").length).find(p=>a.startsWith(Gn(p))),d=u?c[u]:[];return Array.isArray(d)?fn(d):fn(d.items,d.base)}function Ko(c){const a=[];let u=0;for(const d in c){const p=c[d];if(p.items){u=a.push(p);continue}a[u]||a.push({items:[]}),a[u].items.push(p)}return a}function Yo(c){const a=[];function u(d){for(const p of d)p.text&&p.link&&a.push({text:p.text,link:p.link,docFooterText:p.docFooterText}),p.items&&u(p.items)}return u(c),a}function Xn(c,a){return Array.isArray(a)?a.some(u=>Xn(c,u)):wt(c,a.link)?!0:a.items?Xn(c,a.items):!1}function fn(c,a){return[...c].map(u=>{const d={...u},p=d.base||a;return p&&d.link&&(d.link=p+d.link),d.items&&(d.items=fn(d.items,p)),d})}function ut(){const{frontmatter:c,page:a,theme:u}=le(),d=Un("(min-width: 960px)"),p=ge(!1),m=ee(()=>{const O=u.value.sidebar,re=a.value.relativePath;return O?nr(O,re):[]}),S=ge(m.value);$t(m,(O,re)=>{JSON.stringify(O)!==JSON.stringify(re)&&(S.value=m.value)});const E=ee(()=>c.value.sidebar!==!1&&S.value.length>0&&c.value.layout!=="home"),N=ee(()=>R?c.value.aside==null?u.value.aside==="left":c.value.aside==="left":!1),R=ee(()=>c.value.layout==="home"?!1:c.value.aside!=null?!!c.value.aside:u.value.aside!==!1),G=ee(()=>E.value&&d.value),W=ee(()=>E.value?Ko(S.value):[]);function ie(){p.value=!0}function ae(){p.value=!1}function H(){p.value?ae():ie()}return{isOpen:p,sidebar:S,sidebarGroups:W,hasSidebar:E,hasAside:R,leftAside:N,isSidebarEnabled:G,open:ie,close:ae,toggle:H}}function Qo(c,a){let u;hn(()=>{u=c.value?document.activeElement:void 0}),ze(()=>{window.addEventListener("keyup",d)}),Qn(()=>{window.removeEventListener("keyup",d)});function d(p){p.key==="Escape"&&c.value&&(a(),u==null||u.focus())}}function Zo(c){const{page:a}=le(),u=ge(!1),d=ee(()=>c.value.collapsed!=null),p=ee(()=>!!c.value.link),m=ge(!1),S=()=>{m.value=wt(a.value.relativePath,c.value.link)};$t([a,c,ti],S),ze(S);const E=ee(()=>m.value?!0:c.value.items?Xn(a.value.relativePath,c.value.items):!1),N=ee(()=>!!(c.value.items&&c.value.items.length));hn(()=>{u.value=!!(d.value&&c.value.collapsed)}),Ji(()=>{(m.value||E.value)&&(u.value=!1)});function R(){d.value&&(u.value=!u.value)}return{collapsed:u,collapsible:d,isLink:p,isActiveLink:m,hasActiveLink:E,hasChildren:N,toggle:R}}function es(){const{hasSidebar:c}=ut(),a=Un("(min-width: 960px)"),u=Un("(min-width: 1280px)");return{isAsideEnabled:ee(()=>!u.value&&!a.value?!1:c.value?u.value:a.value)}}const Jn=[];function ir(c){return typeof c.outline=="object"&&!Array.isArray(c.outline)&&c.outline.label||c.outlineTitle||"On this page"}function ni(c){const a=[...document.querySelectorAll(".VPDoc :where(h1,h2,h3,h4,h5,h6)")].filter(u=>u.id&&u.hasChildNodes()).map(u=>{const d=Number(u.tagName[1]);return{element:u,title:ts(u),link:"#"+u.id,level:d}});return ns(a,c)}function ts(c){let a="";for(const u of c.childNodes)if(u.nodeType===1){if(u.classList.contains("VPBadge")||u.classList.contains("header-anchor")||u.classList.contains("ignore-header"))continue;a+=u.textContent}else u.nodeType===3&&(a+=u.textContent);return a.trim()}function ns(c,a){if(a===!1)return[];const u=(typeof a=="object"&&!Array.isArray(a)?a.level:a)||2,[d,p]=typeof u=="number"?[u,u]:u==="deep"?[2,6]:u;c=c.filter(S=>S.level>=d&&S.level<=p),Jn.length=0;for(const{element:S,link:E}of c)Jn.push({element:S,link:E});const m=[];e:for(let S=0;S=0;N--){const R=c[N];if(R.level{requestAnimationFrame(m),window.addEventListener("scroll",d)}),Ki(()=>{S(location.hash)}),Qn(()=>{window.removeEventListener("scroll",d)});function m(){if(!u.value)return;const E=window.scrollY,N=window.innerHeight,R=document.body.offsetHeight,G=Math.abs(E+N-R)<1,W=Jn.map(({element:ae,link:H})=>({link:H,top:rs(ae)})).filter(({top:ae})=>!Number.isNaN(ae)).sort((ae,H)=>ae.top-H.top);if(!W.length){S(null);return}if(E<1){S(null);return}if(G){S(W[W.length-1].link);return}let ie=null;for(const{link:ae,top:H}of W){if(H>E+$o()+4)break;ie=ae}S(ie)}function S(E){p&&p.classList.remove("active"),E==null?p=null:p=c.value.querySelector(`a[href="${decodeURIComponent(E)}"]`);const N=p;N?(N.classList.add("active"),a.value.style.top=N.offsetTop+39+"px",a.value.style.opacity="1"):(a.value.style.top="33px",a.value.style.opacity="0")}}function rs(c){let a=0;for(;c!==document.body;){if(c===null)return NaN;a+=c.offsetTop,c=c.offsetParent}return a}const os=["href","title"],ss=z({__name:"VPDocOutlineItem",props:{headers:{},root:{type:Boolean}},setup(c){function a({target:u}){const d=u.href.split("#")[1],p=document.getElementById(decodeURIComponent(d));p==null||p.focus({preventScroll:!0})}return(u,d)=>{const p=St("VPDocOutlineItem",!0);return b(),L("ul",{class:ke(["VPDocOutlineItem",u.root?"root":"nested"])},[(b(!0),L(we,null,je(u.headers,({children:m,link:S,title:E})=>(b(),L("li",null,[A("a",{class:"outline-link",href:S,onClick:a,title:E},_e(E),9,os),m!=null&&m.length?(b(),Z(p,{key:0,headers:m},null,8,["headers"])):q("",!0)]))),256))],2)}}}),rr=Y(ss,[["__scopeId","data-v-b933a997"]]),as=c=>(Le("data-v-935f8a84"),c=c(),Pe(),c),ls={class:"content"},us={class:"outline-title",role:"heading","aria-level":"2"},cs={"aria-labelledby":"doc-outline-aria-label"},fs=as(()=>A("span",{class:"visually-hidden",id:"doc-outline-aria-label"}," Table of Contents for current page ",-1)),ds=z({__name:"VPDocAsideOutline",setup(c){const{frontmatter:a,theme:u}=le(),d=Yi([]);vn(()=>{d.value=ni(a.value.outline??u.value.outline)});const p=ge(),m=ge();return is(p,m),(S,E)=>(b(),L("div",{class:ke(["VPDocAsideOutline",{"has-outline":d.value.length>0}]),ref_key:"container",ref:p,role:"navigation"},[A("div",ls,[A("div",{class:"outline-marker",ref_key:"marker",ref:m},null,512),A("div",us,_e($(ir)($(u))),1),A("nav",cs,[fs,J(rr,{headers:d.value,root:!0},null,8,["headers"])])])],2))}}),ps=Y(ds,[["__scopeId","data-v-935f8a84"]]),hs={class:"VPDocAsideCarbonAds"},vs=z({__name:"VPDocAsideCarbonAds",props:{carbonAds:{}},setup(c){const a=()=>null;return(u,d)=>(b(),L("div",hs,[J($(a),{"carbon-ads":u.carbonAds},null,8,["carbon-ads"])]))}}),gs=c=>(Le("data-v-3f215769"),c=c(),Pe(),c),ms={class:"VPDocAside"},ys=gs(()=>A("div",{class:"spacer"},null,-1)),bs=z({__name:"VPDocAside",setup(c){const{theme:a}=le();return(u,d)=>(b(),L("div",ms,[P(u.$slots,"aside-top",{},void 0,!0),P(u.$slots,"aside-outline-before",{},void 0,!0),J(ps),P(u.$slots,"aside-outline-after",{},void 0,!0),ys,P(u.$slots,"aside-ads-before",{},void 0,!0),$(a).carbonAds?(b(),Z(vs,{key:0,"carbon-ads":$(a).carbonAds},null,8,["carbon-ads"])):q("",!0),P(u.$slots,"aside-ads-after",{},void 0,!0),P(u.$slots,"aside-bottom",{},void 0,!0)]))}}),_s=Y(bs,[["__scopeId","data-v-3f215769"]]);function ks(){const{theme:c,page:a}=le();return ee(()=>{const{text:u="Edit this page",pattern:d=""}=c.value.editLink||{};let p;return typeof d=="function"?p=d(a.value):p=d.replace(/:path/g,a.value.filePath),{url:p,text:u}})}function ws(){const{page:c,theme:a,frontmatter:u}=le();return ee(()=>{var R,G,W,ie,ae,H,O,re;const d=nr(a.value.sidebar,c.value.relativePath),p=Yo(d),m=$s(p,X=>X.link.replace(/[?#].*$/,"")),S=m.findIndex(X=>wt(c.value.relativePath,X.link)),E=((R=a.value.docFooter)==null?void 0:R.prev)===!1&&!u.value.prev||u.value.prev===!1,N=((G=a.value.docFooter)==null?void 0:G.next)===!1&&!u.value.next||u.value.next===!1;return{prev:E?void 0:{text:(typeof u.value.prev=="string"?u.value.prev:typeof u.value.prev=="object"?u.value.prev.text:void 0)??((W=m[S-1])==null?void 0:W.docFooterText)??((ie=m[S-1])==null?void 0:ie.text),link:(typeof u.value.prev=="object"?u.value.prev.link:void 0)??((ae=m[S-1])==null?void 0:ae.link)},next:N?void 0:{text:(typeof u.value.next=="string"?u.value.next:typeof u.value.next=="object"?u.value.next.text:void 0)??((H=m[S+1])==null?void 0:H.docFooterText)??((O=m[S+1])==null?void 0:O.text),link:(typeof u.value.next=="object"?u.value.next.link:void 0)??((re=m[S+1])==null?void 0:re.link)}}})}function $s(c,a){const u=new Set;return c.filter(d=>{const p=a(d);return u.has(p)?!1:u.add(p)})}const it=z({__name:"VPLink",props:{tag:{},href:{},noIcon:{type:Boolean},target:{},rel:{}},setup(c){const a=c,u=ee(()=>a.tag??(a.href?"a":"span")),d=ee(()=>a.href&&Qi.test(a.href));return(p,m)=>(b(),Z(jt(u.value),{class:ke(["VPLink",{link:p.href,"vp-external-link-icon":d.value,"no-icon":p.noIcon}]),href:p.href?$(ei)(p.href):void 0,target:p.target??(d.value?"_blank":void 0),rel:p.rel??(d.value?"noreferrer":void 0)},{default:D(()=>[P(p.$slots,"default")]),_:3},8,["class","href","target","rel"]))}}),Ss={class:"VPLastUpdated"},Ts=["datetime"],xs=z({__name:"VPDocFooterLastUpdated",setup(c){const{theme:a,page:u,frontmatter:d,lang:p}=le(),m=ee(()=>new Date(d.value.lastUpdated??u.value.lastUpdated)),S=ee(()=>m.value.toISOString()),E=ge("");return ze(()=>{hn(()=>{var N,R,G;E.value=new Intl.DateTimeFormat((R=(N=a.value.lastUpdated)==null?void 0:N.formatOptions)!=null&&R.forceLocale?p.value:void 0,((G=a.value.lastUpdated)==null?void 0:G.formatOptions)??{dateStyle:"short",timeStyle:"short"}).format(m.value)})}),(N,R)=>{var G;return b(),L("p",Ss,[rt(_e(((G=$(a).lastUpdated)==null?void 0:G.text)||$(a).lastUpdatedText||"Last updated")+": ",1),A("time",{datetime:S.value},_e(E.value),9,Ts)])}}}),Cs=Y(xs,[["__scopeId","data-v-7e05ebdb"]]),Ls=c=>(Le("data-v-09de1c0f"),c=c(),Pe(),c),Ps={key:0,class:"VPDocFooter"},Ns={key:0,class:"edit-info"},Es={key:0,class:"edit-link"},As=Ls(()=>A("span",{class:"vpi-square-pen edit-link-icon"},null,-1)),Ds={key:1,class:"last-updated"},js={key:1,class:"prev-next"},Vs={class:"pager"},Ms=["innerHTML"],Is=["innerHTML"],Hs={class:"pager"},Os=["innerHTML"],qs=["innerHTML"],Fs=z({__name:"VPDocFooter",setup(c){const{theme:a,page:u,frontmatter:d}=le(),p=ks(),m=ws(),S=ee(()=>a.value.editLink&&d.value.editLink!==!1),E=ee(()=>u.value.lastUpdated&&d.value.lastUpdated!==!1),N=ee(()=>S.value||E.value||m.value.prev||m.value.next);return(R,G)=>{var W,ie,ae,H;return N.value?(b(),L("footer",Ps,[P(R.$slots,"doc-footer-before",{},void 0,!0),S.value||E.value?(b(),L("div",Ns,[S.value?(b(),L("div",Es,[J(it,{class:"edit-link-button",href:$(p).url,"no-icon":!0},{default:D(()=>[As,rt(" "+_e($(p).text),1)]),_:1},8,["href"])])):q("",!0),E.value?(b(),L("div",Ds,[J(Cs)])):q("",!0)])):q("",!0),(W=$(m).prev)!=null&&W.link||(ie=$(m).next)!=null&&ie.link?(b(),L("nav",js,[A("div",Vs,[(ae=$(m).prev)!=null&&ae.link?(b(),Z(it,{key:0,class:"pager-link prev",href:$(m).prev.link},{default:D(()=>{var O;return[A("span",{class:"desc",innerHTML:((O=$(a).docFooter)==null?void 0:O.prev)||"Previous page"},null,8,Ms),A("span",{class:"title",innerHTML:$(m).prev.text},null,8,Is)]}),_:1},8,["href"])):q("",!0)]),A("div",Hs,[(H=$(m).next)!=null&&H.link?(b(),Z(it,{key:0,class:"pager-link next",href:$(m).next.link},{default:D(()=>{var O;return[A("span",{class:"desc",innerHTML:((O=$(a).docFooter)==null?void 0:O.next)||"Next page"},null,8,Os),A("span",{class:"title",innerHTML:$(m).next.text},null,8,qs)]}),_:1},8,["href"])):q("",!0)])])):q("",!0)])):q("",!0)}}}),Bs=Y(Fs,[["__scopeId","data-v-09de1c0f"]]),Rs=c=>(Le("data-v-39a288b8"),c=c(),Pe(),c),Ws={class:"container"},Us=Rs(()=>A("div",{class:"aside-curtain"},null,-1)),zs={class:"aside-container"},Gs={class:"aside-content"},Xs={class:"content"},Js={class:"content-container"},Ks={class:"main"},Ys=z({__name:"VPDoc",setup(c){const{theme:a}=le(),u=gn(),{hasSidebar:d,hasAside:p,leftAside:m}=ut(),S=ee(()=>u.path.replace(/[./]+/g,"_").replace(/_html$/,""));return(E,N)=>{const R=St("Content");return b(),L("div",{class:ke(["VPDoc",{"has-sidebar":$(d),"has-aside":$(p)}])},[P(E.$slots,"doc-top",{},void 0,!0),A("div",Ws,[$(p)?(b(),L("div",{key:0,class:ke(["aside",{"left-aside":$(m)}])},[Us,A("div",zs,[A("div",Gs,[J(_s,null,{"aside-top":D(()=>[P(E.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":D(()=>[P(E.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":D(()=>[P(E.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":D(()=>[P(E.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":D(()=>[P(E.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":D(()=>[P(E.$slots,"aside-ads-after",{},void 0,!0)]),_:3})])])],2)):q("",!0),A("div",Xs,[A("div",Js,[P(E.$slots,"doc-before",{},void 0,!0),A("main",Ks,[J(R,{class:ke(["vp-doc",[S.value,$(a).externalLinkIcon&&"external-link-icon-enabled"]])},null,8,["class"])]),J(Bs,null,{"doc-footer-before":D(()=>[P(E.$slots,"doc-footer-before",{},void 0,!0)]),_:3}),P(E.$slots,"doc-after",{},void 0,!0)])])]),P(E.$slots,"doc-bottom",{},void 0,!0)],2)}}}),Qs=Y(Ys,[["__scopeId","data-v-39a288b8"]]),Zs=z({__name:"VPButton",props:{tag:{},size:{default:"medium"},theme:{default:"brand"},text:{},href:{},target:{},rel:{}},setup(c){const a=c,u=ee(()=>a.href&&Qi.test(a.href)),d=ee(()=>a.tag||a.href?"a":"button");return(p,m)=>(b(),Z(jt(d.value),{class:ke(["VPButton",[p.size,p.theme]]),href:p.href?$(ei)(p.href):void 0,target:a.target??(u.value?"_blank":void 0),rel:a.rel??(u.value?"noreferrer":void 0)},{default:D(()=>[rt(_e(p.text),1)]),_:1},8,["class","href","target","rel"]))}}),ea=Y(Zs,[["__scopeId","data-v-cad61b99"]]),ta=["src","alt"],na=z({inheritAttrs:!1,__name:"VPImage",props:{image:{},alt:{}},setup(c){return(a,u)=>{const d=St("VPImage",!0);return a.image?(b(),L(we,{key:0},[typeof a.image=="string"||"src"in a.image?(b(),L("img",cn({key:0,class:"VPImage"},typeof a.image=="string"?a.$attrs:{...a.image,...a.$attrs},{src:$(pn)(typeof a.image=="string"?a.image:a.image.src),alt:a.alt??(typeof a.image=="string"?"":a.image.alt||"")}),null,16,ta)):(b(),L(we,{key:1},[J(d,cn({class:"dark",image:a.image.dark,alt:a.image.alt},a.$attrs),null,16,["image","alt"]),J(d,cn({class:"light",image:a.image.light,alt:a.image.alt},a.$attrs),null,16,["image","alt"])],64))],64)):q("",!0)}}}),dn=Y(na,[["__scopeId","data-v-8426fc1a"]]),ia=c=>(Le("data-v-303bb580"),c=c(),Pe(),c),ra={class:"container"},oa={class:"main"},sa={key:0,class:"name"},aa=["innerHTML"],la=["innerHTML"],ua=["innerHTML"],ca={key:0,class:"actions"},fa={key:0,class:"image"},da={class:"image-container"},pa=ia(()=>A("div",{class:"image-bg"},null,-1)),ha=z({__name:"VPHero",props:{name:{},text:{},tagline:{},image:{},actions:{}},setup(c){const a=mn("hero-image-slot-exists");return(u,d)=>(b(),L("div",{class:ke(["VPHero",{"has-image":u.image||$(a)}])},[A("div",ra,[A("div",oa,[P(u.$slots,"home-hero-info-before",{},void 0,!0),P(u.$slots,"home-hero-info",{},()=>[u.name?(b(),L("h1",sa,[A("span",{innerHTML:u.name,class:"clip"},null,8,aa)])):q("",!0),u.text?(b(),L("p",{key:1,innerHTML:u.text,class:"text"},null,8,la)):q("",!0),u.tagline?(b(),L("p",{key:2,innerHTML:u.tagline,class:"tagline"},null,8,ua)):q("",!0)],!0),P(u.$slots,"home-hero-info-after",{},void 0,!0),u.actions?(b(),L("div",ca,[(b(!0),L(we,null,je(u.actions,p=>(b(),L("div",{key:p.link,class:"action"},[J(ea,{tag:"a",size:"medium",theme:p.theme,text:p.text,href:p.link,target:p.target,rel:p.rel},null,8,["theme","text","href","target","rel"])]))),128))])):q("",!0),P(u.$slots,"home-hero-actions-after",{},void 0,!0)]),u.image||$(a)?(b(),L("div",fa,[A("div",da,[pa,P(u.$slots,"home-hero-image",{},()=>[u.image?(b(),Z(dn,{key:0,class:"image-src",image:u.image},null,8,["image"])):q("",!0)],!0)])])):q("",!0)])],2))}}),va=Y(ha,[["__scopeId","data-v-303bb580"]]),ga=z({__name:"VPHomeHero",setup(c){const{frontmatter:a}=le();return(u,d)=>$(a).hero?(b(),Z(va,{key:0,class:"VPHomeHero",name:$(a).hero.name,text:$(a).hero.text,tagline:$(a).hero.tagline,image:$(a).hero.image,actions:$(a).hero.actions},{"home-hero-info-before":D(()=>[P(u.$slots,"home-hero-info-before")]),"home-hero-info":D(()=>[P(u.$slots,"home-hero-info")]),"home-hero-info-after":D(()=>[P(u.$slots,"home-hero-info-after")]),"home-hero-actions-after":D(()=>[P(u.$slots,"home-hero-actions-after")]),"home-hero-image":D(()=>[P(u.$slots,"home-hero-image")]),_:3},8,["name","text","tagline","image","actions"])):q("",!0)}}),ma=c=>(Le("data-v-a3976bdc"),c=c(),Pe(),c),ya={class:"box"},ba={key:0,class:"icon"},_a=["innerHTML"],ka=["innerHTML"],wa=["innerHTML"],$a={key:4,class:"link-text"},Sa={class:"link-text-value"},Ta=ma(()=>A("span",{class:"vpi-arrow-right link-text-icon"},null,-1)),xa=z({__name:"VPFeature",props:{icon:{},title:{},details:{},link:{},linkText:{},rel:{},target:{}},setup(c){return(a,u)=>(b(),Z(it,{class:"VPFeature",href:a.link,rel:a.rel,target:a.target,"no-icon":!0,tag:a.link?"a":"div"},{default:D(()=>[A("article",ya,[typeof a.icon=="object"&&a.icon.wrap?(b(),L("div",ba,[J(dn,{image:a.icon,alt:a.icon.alt,height:a.icon.height||48,width:a.icon.width||48},null,8,["image","alt","height","width"])])):typeof a.icon=="object"?(b(),Z(dn,{key:1,image:a.icon,alt:a.icon.alt,height:a.icon.height||48,width:a.icon.width||48},null,8,["image","alt","height","width"])):a.icon?(b(),L("div",{key:2,class:"icon",innerHTML:a.icon},null,8,_a)):q("",!0),A("h2",{class:"title",innerHTML:a.title},null,8,ka),a.details?(b(),L("p",{key:3,class:"details",innerHTML:a.details},null,8,wa)):q("",!0),a.linkText?(b(),L("div",$a,[A("p",Sa,[rt(_e(a.linkText)+" ",1),Ta])])):q("",!0)])]),_:1},8,["href","rel","target","tag"]))}}),Ca=Y(xa,[["__scopeId","data-v-a3976bdc"]]),La={key:0,class:"VPFeatures"},Pa={class:"container"},Na={class:"items"},Ea=z({__name:"VPFeatures",props:{features:{}},setup(c){const a=c,u=ee(()=>{const d=a.features.length;if(d){if(d===2)return"grid-2";if(d===3)return"grid-3";if(d%3===0)return"grid-6";if(d>3)return"grid-4"}else return});return(d,p)=>d.features?(b(),L("div",La,[A("div",Pa,[A("div",Na,[(b(!0),L(we,null,je(d.features,m=>(b(),L("div",{key:m.title,class:ke(["item",[u.value]])},[J(Ca,{icon:m.icon,title:m.title,details:m.details,link:m.link,"link-text":m.linkText,rel:m.rel,target:m.target},null,8,["icon","title","details","link","link-text","rel","target"])],2))),128))])])])):q("",!0)}}),Aa=Y(Ea,[["__scopeId","data-v-a6181336"]]),Da=z({__name:"VPHomeFeatures",setup(c){const{frontmatter:a}=le();return(u,d)=>$(a).features?(b(),Z(Aa,{key:0,class:"VPHomeFeatures",features:$(a).features},null,8,["features"])):q("",!0)}}),ja=z({__name:"VPHomeContent",setup(c){const{width:a}=So({includeScrollbar:!1});return(u,d)=>(b(),L("div",{class:"vp-doc container",style:Zn($(a)?{"--vp-offset":`calc(50% - ${$(a)/2}px)`}:{})},[P(u.$slots,"default",{},void 0,!0)],4))}}),Va=Y(ja,[["__scopeId","data-v-82d4af08"]]),Ma={class:"VPHome"},Ia=z({__name:"VPHome",setup(c){const{frontmatter:a}=le();return(u,d)=>{const p=St("Content");return b(),L("div",Ma,[P(u.$slots,"home-hero-before",{},void 0,!0),J(ga,null,{"home-hero-info-before":D(()=>[P(u.$slots,"home-hero-info-before",{},void 0,!0)]),"home-hero-info":D(()=>[P(u.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-info-after":D(()=>[P(u.$slots,"home-hero-info-after",{},void 0,!0)]),"home-hero-actions-after":D(()=>[P(u.$slots,"home-hero-actions-after",{},void 0,!0)]),"home-hero-image":D(()=>[P(u.$slots,"home-hero-image",{},void 0,!0)]),_:3}),P(u.$slots,"home-hero-after",{},void 0,!0),P(u.$slots,"home-features-before",{},void 0,!0),J(Da),P(u.$slots,"home-features-after",{},void 0,!0),$(a).markdownStyles!==!1?(b(),Z(Va,{key:0},{default:D(()=>[J(p)]),_:1})):(b(),Z(p,{key:1}))])}}}),Ha=Y(Ia,[["__scopeId","data-v-686f80a6"]]),Oa={},qa={class:"VPPage"};function Fa(c,a){const u=St("Content");return b(),L("div",qa,[P(c.$slots,"page-top"),J(u),P(c.$slots,"page-bottom")])}const Ba=Y(Oa,[["render",Fa]]),Ra="vitepress-plugin-demo-block__wrapper",Wa="vitepress-plugin-demo-block__display",Ua="vitepress-plugin-demo-block__code",za="vitepress-plugin-demo-block__footer",Ga="vitepress-plugin-demo-block__horizontal",Xa="vitepress-plugin-demo-block__h_code",Ja="vitepress-plugin-demo-block__app",zi="vitepress-plugin-demo-block__show-link",Ka="vitepress-plugin-demo-block__expand",Ya="vitepress-plugin-demo-block__codepen",Qa="vitepress-plugin-demo-block__jsfiddle",or="vitepress-plugin-demo-block__button",Za={jsLib:[],cssLib:[],jsfiddle:!0,codepen:!0,codepenLayout:"left",codepenJsProcessor:"babel",codepenEditors:"101",horizontal:!1,vue:"https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js",react:"https://cdn.jsdelivr.net/npm/react/umd/react.production.min.js",reactDOM:"https://cdn.jsdelivr.net/npm/react-dom/umd/react-dom.production.min.js"},Rn="$VUEPRESS_DEMO_BLOCK",Gi={},sr=c=>`
+${c} +
`,el=c=>` + Vue.createApp({ + ${c.replace(/export\s+default\s*?\{\n*/,"").replace(/\n*\}\s*$/,"").trim()} + }).mount('#app') + `,tl=c=>Array.prototype.slice.call(c),qe=c=>window[Rn]&&window[Rn][c]!==void 0?window[Rn][c]:Za[c],Kt=(c,a,u)=>{const d=document.createElement(c);return a&&Object.keys(a).forEach(p=>{if(p.indexOf("data"))d[p]=a[p];else{const m=p.replace("data","");d.dataset[m]=a[p]}}),u&&u.forEach(({tag:p,attrs:m,children:S})=>{d.appendChild(Kt(p,m,S))}),d},Xt=(c,a,u)=>{const d=tl(c.querySelectorAll(`.${a}`));return d.length===1&&!u?d[0]:d},nl=(c,a)=>{const u=c.split(/export\s+default/),d=`(function() {${u[0]} ; return ${u[1]}})()`,p=window.Babel?window.Babel.transform(d,{presets:["es2015"]}).code:d,m=[eval][0](p);return m.template=a,m},il=c=>window.Babel?window.Babel.transform(c,{presets:["es2015"]}).code:c,rl=(c,a)=>{const u=c.match(/ +`;function cl({css:c,htmlTpl:a,jsTpl:u,jsLib:d,cssLib:p}){const m=JSON.stringify({css:c,html:a,js:u,js_external:d.concat(qe("jsLib")).join(";"),css_external:p.concat(qe("cssLib")).join(";"),layout:qe("codepenLayout"),js_pre_processor:qe("codepenJsProcessor"),editors:qe("codepenEditors")});return Kt("form",{className:Ya,target:"_blank",action:"https://codepen.io/pen/define",method:"post"},[{tag:"input",attrs:{type:"hidden",name:"data",value:m}},{tag:"button",attrs:{type:"submit",innerHTML:ul,className:or,datatip:"Codepen"}}])}const fl=` + +`;function dl({css:c,htmlTpl:a,jsTpl:u,jsLib:d,cssLib:p}){const m=d.concat(p).concat(qe("cssLib")).concat(qe("jsLib")).join(",");return Kt("form",{className:Qa,target:"_blank",action:"https://jsfiddle.net/api/post/library/pure/",method:"post"},[{tag:"input",attrs:{type:"hidden",name:"css",value:c}},{tag:"input",attrs:{type:"hidden",name:"html",value:a}},{tag:"input",attrs:{type:"hidden",name:"js",value:u}},{tag:"input",attrs:{type:"hidden",name:"panel_js",value:3}},{tag:"input",attrs:{type:"hidden",name:"wrap",value:1}},{tag:"input",attrs:{type:"hidden",name:"resources",value:m}},{tag:"button",attrs:{type:"submit",className:or,innerHTML:fl,datatip:"JSFiddle"}}])}function Kn(){const c=Xt(document,Ra,!0);if(!c.length){setTimeout(a=>{Kn()},300);return}c.forEach(a=>{if(a.dataset.created==="true")return;a.style.display="block";const u=Xt(a,Ua),d=Xt(a,Wa),p=Xt(a,za),m=Xt(d,Ja),S=decodeURIComponent(a.dataset.code);let E=decodeURIComponent(a.dataset.config),N=decodeURIComponent(a.dataset.type);E=E?JSON.parse(E):{};const R=u.querySelector("div").clientHeight,G=N==="react"?al(S,E):N==="vanilla"?ol(S,E):rl(S,E),W=pl();if(p.appendChild(W),W.addEventListener("click",hl.bind(null,W,R,u,p)),qe("jsfiddle")&&p.appendChild(dl(G)),qe("codepen")&&p.appendChild(cl(G)),E.horizontal!==void 0?E.horizontal:qe("horizontal")){a.classList.add(Ga);const ae=u.firstChild.cloneNode(!0);ae.classList.add(Xa),d.appendChild(ae)}if(G.css&&ll(G.css),N==="react")ReactDOM.render(React.createElement(G.js),m);else if(N==="vue"){const ae=Vue.extend(G.script),H=new ae().$mount();m.appendChild(H.$el)}else N==="vanilla"&&(m.innerHTML=G.html,new Function(`return (function(){${G.script}})()`)());a.dataset.created="true"})}function pl(){return Kt("button",{className:`${Ka}`})}function hl(c,a,u,d){const p=c.dataset.isExpand!=="1";u.style.height=p?`${a}px`:0,p?d.classList.add(zi):d.classList.remove(zi),c.dataset.isExpand=p?"1":"0"}const vl=z({__name:"VPContent",setup(c){const{page:a,frontmatter:u}=le(),{hasSidebar:d}=ut();return ze(()=>{Kn()}),Ki(()=>{Kn()}),(p,m)=>(b(),L("div",{class:ke(["VPContent",{"has-sidebar":$(d),"is-home":$(u).layout==="home"}]),id:"VPContent"},[$(a).isNotFound?P(p.$slots,"not-found",{key:0},()=>[J(Jo)],!0):$(u).layout==="page"?(b(),Z(Ba,{key:1},{"page-top":D(()=>[P(p.$slots,"page-top",{},void 0,!0)]),"page-bottom":D(()=>[P(p.$slots,"page-bottom",{},void 0,!0)]),_:3})):$(u).layout==="home"?(b(),Z(Ha,{key:2},{"home-hero-before":D(()=>[P(p.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info-before":D(()=>[P(p.$slots,"home-hero-info-before",{},void 0,!0)]),"home-hero-info":D(()=>[P(p.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-info-after":D(()=>[P(p.$slots,"home-hero-info-after",{},void 0,!0)]),"home-hero-actions-after":D(()=>[P(p.$slots,"home-hero-actions-after",{},void 0,!0)]),"home-hero-image":D(()=>[P(p.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":D(()=>[P(p.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":D(()=>[P(p.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":D(()=>[P(p.$slots,"home-features-after",{},void 0,!0)]),_:3})):$(u).layout&&$(u).layout!=="doc"?(b(),Z(jt($(u).layout),{key:3})):(b(),Z(Qs,{key:4},{"doc-top":D(()=>[P(p.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":D(()=>[P(p.$slots,"doc-bottom",{},void 0,!0)]),"doc-footer-before":D(()=>[P(p.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":D(()=>[P(p.$slots,"doc-before",{},void 0,!0)]),"doc-after":D(()=>[P(p.$slots,"doc-after",{},void 0,!0)]),"aside-top":D(()=>[P(p.$slots,"aside-top",{},void 0,!0)]),"aside-outline-before":D(()=>[P(p.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":D(()=>[P(p.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":D(()=>[P(p.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":D(()=>[P(p.$slots,"aside-ads-after",{},void 0,!0)]),"aside-bottom":D(()=>[P(p.$slots,"aside-bottom",{},void 0,!0)]),_:3}))],2))}}),gl=Y(vl,[["__scopeId","data-v-0b815400"]]),ml={class:"container"},yl=["innerHTML"],bl=["innerHTML"],_l=z({__name:"VPFooter",setup(c){const{theme:a,frontmatter:u}=le(),{hasSidebar:d}=ut();return(p,m)=>$(a).footer&&$(u).footer!==!1?(b(),L("footer",{key:0,class:ke(["VPFooter",{"has-sidebar":$(d)}])},[A("div",ml,[$(a).footer.message?(b(),L("p",{key:0,class:"message",innerHTML:$(a).footer.message},null,8,yl)):q("",!0),$(a).footer.copyright?(b(),L("p",{key:1,class:"copyright",innerHTML:$(a).footer.copyright},null,8,bl)):q("",!0)])],2)):q("",!0)}}),kl=Y(_l,[["__scopeId","data-v-e315a0ad"]]);function wl(){const{theme:c,frontmatter:a}=le(),u=Yi([]),d=ee(()=>u.value.length>0);return vn(()=>{u.value=ni(a.value.outline??c.value.outline)}),{headers:u,hasLocalNav:d}}const $l=c=>(Le("data-v-d2ecc192"),c=c(),Pe(),c),Sl=$l(()=>A("span",{class:"vpi-chevron-right icon"},null,-1)),Tl={class:"header"},xl={class:"outline"},Cl=z({__name:"VPLocalNavOutlineDropdown",props:{headers:{},navHeight:{}},setup(c){const a=c,{theme:u}=le(),d=ge(!1),p=ge(0),m=ge(),S=ge();To(m,()=>{d.value=!1}),zn("Escape",()=>{d.value=!1}),vn(()=>{d.value=!1});function E(){d.value=!d.value,p.value=window.innerHeight+Math.min(window.scrollY-a.navHeight,0)}function N(G){G.target.classList.contains("outline-link")&&(S.value&&(S.value.style.transition="none"),xo(()=>{d.value=!1}))}function R(){d.value=!1,window.scrollTo({top:0,left:0,behavior:"smooth"})}return(G,W)=>(b(),L("div",{class:"VPLocalNavOutlineDropdown",style:Zn({"--vp-vh":p.value+"px"}),ref_key:"main",ref:m},[G.headers.length>0?(b(),L("button",{key:0,onClick:E,class:ke({open:d.value})},[rt(_e($(ir)($(u)))+" ",1),Sl],2)):(b(),L("button",{key:1,onClick:R},_e($(u).returnToTopLabel||"Return to top"),1)),J(Yn,{name:"flyout"},{default:D(()=>[d.value?(b(),L("div",{key:0,ref_key:"items",ref:S,class:"items",onClick:N},[A("div",Tl,[A("a",{class:"top-link",href:"#",onClick:R},_e($(u).returnToTopLabel||"Return to top"),1)]),A("div",xl,[J(rr,{headers:G.headers},null,8,["headers"])])],512)):q("",!0)]),_:1})],4))}}),Ll=Y(Cl,[["__scopeId","data-v-d2ecc192"]]),Pl=c=>(Le("data-v-a6f0e41e"),c=c(),Pe(),c),Nl={class:"container"},El=["aria-expanded"],Al=Pl(()=>A("span",{class:"vpi-align-left menu-icon"},null,-1)),Dl={class:"menu-text"},jl=z({__name:"VPLocalNav",props:{open:{type:Boolean}},emits:["open-menu"],setup(c){const{theme:a,frontmatter:u}=le(),{hasSidebar:d}=ut(),{headers:p}=wl(),{y:m}=Zi(),S=ge(0);ze(()=>{S.value=parseInt(getComputedStyle(document.documentElement).getPropertyValue("--vp-nav-height"))}),vn(()=>{p.value=ni(u.value.outline??a.value.outline)});const E=ee(()=>p.value.length===0),N=ee(()=>E.value&&!d.value),R=ee(()=>({VPLocalNav:!0,"has-sidebar":d.value,empty:E.value,fixed:N.value}));return(G,W)=>$(u).layout!=="home"&&(!N.value||$(m)>=S.value)?(b(),L("div",{key:0,class:ke(R.value)},[A("div",Nl,[$(d)?(b(),L("button",{key:0,class:"menu","aria-expanded":G.open,"aria-controls":"VPSidebarNav",onClick:W[0]||(W[0]=ie=>G.$emit("open-menu"))},[Al,A("span",Dl,_e($(a).sidebarMenuLabel||"Menu"),1)],8,El)):q("",!0),J(Ll,{headers:$(p),navHeight:S.value},null,8,["headers","navHeight"])])],2)):q("",!0)}}),Vl=Y(jl,[["__scopeId","data-v-a6f0e41e"]]);function Ml(){const c=ge(!1);function a(){c.value=!0,window.addEventListener("resize",p)}function u(){c.value=!1,window.removeEventListener("resize",p)}function d(){c.value?u():a()}function p(){window.outerWidth>=768&&u()}const m=gn();return $t(()=>m.path,u),{isScreenOpen:c,openScreen:a,closeScreen:u,toggleScreen:d}}const Il={},Hl={class:"VPSwitch",type:"button",role:"switch"},Ol={class:"check"},ql={key:0,class:"icon"};function Fl(c,a){return b(),L("button",Hl,[A("span",Ol,[c.$slots.default?(b(),L("span",ql,[P(c.$slots,"default",{},void 0,!0)])):q("",!0)])])}const Bl=Y(Il,[["render",Fl],["__scopeId","data-v-1d5665e3"]]),ar=c=>(Le("data-v-d1f28634"),c=c(),Pe(),c),Rl=ar(()=>A("span",{class:"vpi-sun sun"},null,-1)),Wl=ar(()=>A("span",{class:"vpi-moon moon"},null,-1)),Ul=z({__name:"VPSwitchAppearance",setup(c){const{isDark:a,theme:u}=le(),d=mn("toggle-appearance",()=>{a.value=!a.value}),p=ee(()=>a.value?u.value.lightModeSwitchTitle||"Switch to light theme":u.value.darkModeSwitchTitle||"Switch to dark theme");return(m,S)=>(b(),Z(Bl,{title:p.value,class:"VPSwitchAppearance","aria-checked":$(a),onClick:$(d)},{default:D(()=>[Rl,Wl]),_:1},8,["title","aria-checked","onClick"]))}}),ii=Y(Ul,[["__scopeId","data-v-d1f28634"]]),zl={key:0,class:"VPNavBarAppearance"},Gl=z({__name:"VPNavBarAppearance",setup(c){const{site:a}=le();return(u,d)=>$(a).appearance&&$(a).appearance!=="force-dark"?(b(),L("div",zl,[J(ii)])):q("",!0)}}),Xl=Y(Gl,[["__scopeId","data-v-e6aabb21"]]),ri=ge();let lr=!1,Wn=0;function Jl(c){const a=ge(!1);if(Vt){!lr&&Kl(),Wn++;const u=$t(ri,d=>{var p,m,S;d===c.el.value||(p=c.el.value)!=null&&p.contains(d)?(a.value=!0,(m=c.onFocus)==null||m.call(c)):(a.value=!1,(S=c.onBlur)==null||S.call(c))});Qn(()=>{u(),Wn--,Wn||Yl()})}return Co(a)}function Kl(){document.addEventListener("focusin",ur),lr=!0,ri.value=document.activeElement}function Yl(){document.removeEventListener("focusin",ur)}function ur(){ri.value=document.activeElement}const Ql={class:"VPMenuLink"},Zl=z({__name:"VPMenuLink",props:{item:{}},setup(c){const{page:a}=le();return(u,d)=>(b(),L("div",Ql,[J(it,{class:ke({active:$(wt)($(a).relativePath,u.item.activeMatch||u.item.link,!!u.item.activeMatch)}),href:u.item.link,target:u.item.target,rel:u.item.rel},{default:D(()=>[rt(_e(u.item.text),1)]),_:1},8,["class","href","target","rel"])]))}}),bn=Y(Zl,[["__scopeId","data-v-43f1e123"]]),eu={class:"VPMenuGroup"},tu={key:0,class:"title"},nu=z({__name:"VPMenuGroup",props:{text:{},items:{}},setup(c){return(a,u)=>(b(),L("div",eu,[a.text?(b(),L("p",tu,_e(a.text),1)):q("",!0),(b(!0),L(we,null,je(a.items,d=>(b(),L(we,null,["link"in d?(b(),Z(bn,{key:0,item:d},null,8,["item"])):q("",!0)],64))),256))]))}}),iu=Y(nu,[["__scopeId","data-v-69e747b5"]]),ru={class:"VPMenu"},ou={key:0,class:"items"},su=z({__name:"VPMenu",props:{items:{}},setup(c){return(a,u)=>(b(),L("div",ru,[a.items?(b(),L("div",ou,[(b(!0),L(we,null,je(a.items,d=>(b(),L(we,{key:d.text},["link"in d?(b(),Z(bn,{key:0,item:d},null,8,["item"])):(b(),Z(iu,{key:1,text:d.text,items:d.items},null,8,["text","items"]))],64))),128))])):q("",!0),P(a.$slots,"default",{},void 0,!0)]))}}),au=Y(su,[["__scopeId","data-v-e7ea1737"]]),lu=c=>(Le("data-v-b6c34ac9"),c=c(),Pe(),c),uu=["aria-expanded","aria-label"],cu={key:0,class:"text"},fu=["innerHTML"],du=lu(()=>A("span",{class:"vpi-chevron-down text-icon"},null,-1)),pu={key:1,class:"vpi-more-horizontal icon"},hu={class:"menu"},vu=z({__name:"VPFlyout",props:{icon:{},button:{},label:{},items:{}},setup(c){const a=ge(!1),u=ge();Jl({el:u,onBlur:d});function d(){a.value=!1}return(p,m)=>(b(),L("div",{class:"VPFlyout",ref_key:"el",ref:u,onMouseenter:m[1]||(m[1]=S=>a.value=!0),onMouseleave:m[2]||(m[2]=S=>a.value=!1)},[A("button",{type:"button",class:"button","aria-haspopup":"true","aria-expanded":a.value,"aria-label":p.label,onClick:m[0]||(m[0]=S=>a.value=!a.value)},[p.button||p.icon?(b(),L("span",cu,[p.icon?(b(),L("span",{key:0,class:ke([p.icon,"option-icon"])},null,2)):q("",!0),p.button?(b(),L("span",{key:1,innerHTML:p.button},null,8,fu)):q("",!0),du])):(b(),L("span",pu))],8,uu),A("div",hu,[J(au,{items:p.items},{default:D(()=>[P(p.$slots,"default",{},void 0,!0)]),_:3},8,["items"])])],544))}}),oi=Y(vu,[["__scopeId","data-v-b6c34ac9"]]),gu=["href","aria-label","innerHTML"],mu=z({__name:"VPSocialLink",props:{icon:{},link:{},ariaLabel:{}},setup(c){const a=c,u=ee(()=>typeof a.icon=="object"?a.icon.svg:``);return(d,p)=>(b(),L("a",{class:"VPSocialLink no-icon",href:d.link,"aria-label":d.ariaLabel??(typeof d.icon=="string"?d.icon:""),target:"_blank",rel:"noopener",innerHTML:u.value},null,8,gu))}}),yu=Y(mu,[["__scopeId","data-v-eee4e7cb"]]),bu={class:"VPSocialLinks"},_u=z({__name:"VPSocialLinks",props:{links:{}},setup(c){return(a,u)=>(b(),L("div",bu,[(b(!0),L(we,null,je(a.links,({link:d,icon:p,ariaLabel:m})=>(b(),Z(yu,{key:d,icon:p,link:d,ariaLabel:m},null,8,["icon","link","ariaLabel"]))),128))]))}}),si=Y(_u,[["__scopeId","data-v-7bc22406"]]),ku={key:0,class:"group translations"},wu={class:"trans-title"},$u={key:1,class:"group"},Su={class:"item appearance"},Tu={class:"label"},xu={class:"appearance-action"},Cu={key:2,class:"group"},Lu={class:"item social-links"},Pu=z({__name:"VPNavBarExtra",setup(c){const{site:a,theme:u}=le(),{localeLinks:d,currentLang:p}=Jt({correspondingLink:!0}),m=ee(()=>d.value.length&&p.value.label||a.value.appearance||u.value.socialLinks);return(S,E)=>m.value?(b(),Z(oi,{key:0,class:"VPNavBarExtra",label:"extra navigation"},{default:D(()=>[$(d).length&&$(p).label?(b(),L("div",ku,[A("p",wu,_e($(p).label),1),(b(!0),L(we,null,je($(d),N=>(b(),Z(bn,{key:N.link,item:N},null,8,["item"]))),128))])):q("",!0),$(a).appearance&&$(a).appearance!=="force-dark"?(b(),L("div",$u,[A("div",Su,[A("p",Tu,_e($(u).darkModeSwitchLabel||"Appearance"),1),A("div",xu,[J(ii)])])])):q("",!0),$(u).socialLinks?(b(),L("div",Cu,[A("div",Lu,[J(si,{class:"social-links-list",links:$(u).socialLinks},null,8,["links"])])])):q("",!0)]),_:1})):q("",!0)}}),Nu=Y(Pu,[["__scopeId","data-v-d0bd9dde"]]),Eu=c=>(Le("data-v-e5dd9c1c"),c=c(),Pe(),c),Au=["aria-expanded"],Du=Eu(()=>A("span",{class:"container"},[A("span",{class:"top"}),A("span",{class:"middle"}),A("span",{class:"bottom"})],-1)),ju=[Du],Vu=z({__name:"VPNavBarHamburger",props:{active:{type:Boolean}},emits:["click"],setup(c){return(a,u)=>(b(),L("button",{type:"button",class:ke(["VPNavBarHamburger",{active:a.active}]),"aria-label":"mobile navigation","aria-expanded":a.active,"aria-controls":"VPNavScreen",onClick:u[0]||(u[0]=d=>a.$emit("click"))},ju,10,Au))}}),Mu=Y(Vu,[["__scopeId","data-v-e5dd9c1c"]]),Iu=["innerHTML"],Hu=z({__name:"VPNavBarMenuLink",props:{item:{}},setup(c){const{page:a}=le();return(u,d)=>(b(),Z(it,{class:ke({VPNavBarMenuLink:!0,active:$(wt)($(a).relativePath,u.item.activeMatch||u.item.link,!!u.item.activeMatch)}),href:u.item.link,noIcon:u.item.noIcon,target:u.item.target,rel:u.item.rel,tabindex:"0"},{default:D(()=>[A("span",{innerHTML:u.item.text},null,8,Iu)]),_:1},8,["class","href","noIcon","target","rel"]))}}),Ou=Y(Hu,[["__scopeId","data-v-9c663999"]]),qu=z({__name:"VPNavBarMenuGroup",props:{item:{}},setup(c){const a=c,{page:u}=le(),d=m=>"link"in m?wt(u.value.relativePath,m.link,!!a.item.activeMatch):m.items.some(d),p=ee(()=>d(a.item));return(m,S)=>(b(),Z(oi,{class:ke({VPNavBarMenuGroup:!0,active:$(wt)($(u).relativePath,m.item.activeMatch,!!m.item.activeMatch)||p.value}),button:m.item.text,items:m.item.items},null,8,["class","button","items"]))}}),Fu=c=>(Le("data-v-7f418b0f"),c=c(),Pe(),c),Bu={key:0,"aria-labelledby":"main-nav-aria-label",class:"VPNavBarMenu"},Ru=Fu(()=>A("span",{id:"main-nav-aria-label",class:"visually-hidden"},"Main Navigation",-1)),Wu=z({__name:"VPNavBarMenu",setup(c){const{theme:a}=le();return(u,d)=>$(a).nav?(b(),L("nav",Bu,[Ru,(b(!0),L(we,null,je($(a).nav,p=>(b(),L(we,{key:p.text},["link"in p?(b(),Z(Ou,{key:0,item:p},null,8,["item"])):(b(),Z(qu,{key:1,item:p},null,8,["item"]))],64))),128))])):q("",!0)}}),Uu=Y(Wu,[["__scopeId","data-v-7f418b0f"]]);function zu(c){const{localeIndex:a,theme:u}=le();function d(p){var H,O,re;const m=p.split("."),S=(H=u.value.search)==null?void 0:H.options,E=S&&typeof S=="object",N=E&&((re=(O=S.locales)==null?void 0:O[a.value])==null?void 0:re.translations)||null,R=E&&S.translations||null;let G=N,W=R,ie=c;const ae=m.pop();for(const X of m){let F=null;const se=ie==null?void 0:ie[X];se&&(F=ie=se);const me=W==null?void 0:W[X];me&&(F=W=me);const xe=G==null?void 0:G[X];xe&&(F=G=xe),se||(ie=F),me||(W=F),xe||(G=F)}return(G==null?void 0:G[ae])??(W==null?void 0:W[ae])??(ie==null?void 0:ie[ae])??""}return d}const Gu=["aria-label"],Xu={class:"DocSearch-Button-Container"},Ju=A("span",{class:"vp-icon DocSearch-Search-Icon"},null,-1),Ku={class:"DocSearch-Button-Placeholder"},Yu=A("span",{class:"DocSearch-Button-Keys"},[A("kbd",{class:"DocSearch-Button-Key"}),A("kbd",{class:"DocSearch-Button-Key"},"K")],-1),Xi=z({__name:"VPNavBarSearchButton",setup(c){const u=zu({button:{buttonText:"Search",buttonAriaLabel:"Search"}});return(d,p)=>(b(),L("button",{type:"button",class:"DocSearch DocSearch-Button","aria-label":$(u)("button.buttonAriaLabel")},[A("span",Xu,[Ju,A("span",Ku,_e($(u)("button.buttonText")),1)]),Yu],8,Gu))}}),Qu={class:"VPNavBarSearch"},Zu={id:"local-search"},ec={key:1,id:"docsearch"},tc=z({__name:"VPNavBarSearch",setup(c){const a=Lo(()=>yn(()=>import("./VPLocalSearchBox.B-xkvMVn.js"),__vite__mapDeps([0,1]))),u=()=>null,{theme:d}=le(),p=ge(!1),m=ge(!1);ze(()=>{});function S(){p.value||(p.value=!0,setTimeout(E,16))}function E(){const W=new Event("keydown");W.key="k",W.metaKey=!0,window.dispatchEvent(W),setTimeout(()=>{document.querySelector(".DocSearch-Modal")||E()},16)}function N(W){const ie=W.target,ae=ie.tagName;return ie.isContentEditable||ae==="INPUT"||ae==="SELECT"||ae==="TEXTAREA"}const R=ge(!1);zn("k",W=>{(W.ctrlKey||W.metaKey)&&(W.preventDefault(),R.value=!0)}),zn("/",W=>{N(W)||(W.preventDefault(),R.value=!0)});const G="local";return(W,ie)=>{var ae;return b(),L("div",Qu,[$(G)==="local"?(b(),L(we,{key:0},[R.value?(b(),Z($(a),{key:0,onClose:ie[0]||(ie[0]=H=>R.value=!1)})):q("",!0),A("div",Zu,[J(Xi,{onClick:ie[1]||(ie[1]=H=>R.value=!0)})])],64)):$(G)==="algolia"?(b(),L(we,{key:1},[p.value?(b(),Z($(u),{key:0,algolia:((ae=$(d).search)==null?void 0:ae.options)??$(d).algolia,onVnodeBeforeMount:ie[2]||(ie[2]=H=>m.value=!0)},null,8,["algolia"])):q("",!0),m.value?q("",!0):(b(),L("div",ec,[J(Xi,{onClick:S})]))],64)):q("",!0)])}}}),nc=z({__name:"VPNavBarSocialLinks",setup(c){const{theme:a}=le();return(u,d)=>$(a).socialLinks?(b(),Z(si,{key:0,class:"VPNavBarSocialLinks",links:$(a).socialLinks},null,8,["links"])):q("",!0)}}),ic=Y(nc,[["__scopeId","data-v-0394ad82"]]),rc=["href","rel","target"],oc={key:1},sc={key:2},ac=z({__name:"VPNavBarTitle",setup(c){const{site:a,theme:u}=le(),{hasSidebar:d}=ut(),{currentLang:p}=Jt(),m=ee(()=>{var N;return typeof u.value.logoLink=="string"?u.value.logoLink:(N=u.value.logoLink)==null?void 0:N.link}),S=ee(()=>{var N;return typeof u.value.logoLink=="string"||(N=u.value.logoLink)==null?void 0:N.rel}),E=ee(()=>{var N;return typeof u.value.logoLink=="string"||(N=u.value.logoLink)==null?void 0:N.target});return(N,R)=>(b(),L("div",{class:ke(["VPNavBarTitle",{"has-sidebar":$(d)}])},[A("a",{class:"title",href:m.value??$(ei)($(p).link),rel:S.value,target:E.value},[P(N.$slots,"nav-bar-title-before",{},void 0,!0),$(u).logo?(b(),Z(dn,{key:0,class:"logo",image:$(u).logo},null,8,["image"])):q("",!0),$(u).siteTitle?(b(),L("span",oc,_e($(u).siteTitle),1)):$(u).siteTitle===void 0?(b(),L("span",sc,_e($(a).title),1)):q("",!0),P(N.$slots,"nav-bar-title-after",{},void 0,!0)],8,rc)],2))}}),lc=Y(ac,[["__scopeId","data-v-ab179fa1"]]),uc={class:"items"},cc={class:"title"},fc=z({__name:"VPNavBarTranslations",setup(c){const{theme:a}=le(),{localeLinks:u,currentLang:d}=Jt({correspondingLink:!0});return(p,m)=>$(u).length&&$(d).label?(b(),Z(oi,{key:0,class:"VPNavBarTranslations",icon:"vpi-languages",label:$(a).langMenuLabel||"Change language"},{default:D(()=>[A("div",uc,[A("p",cc,_e($(d).label),1),(b(!0),L(we,null,je($(u),S=>(b(),Z(bn,{key:S.link,item:S},null,8,["item"]))),128))])]),_:1},8,["label"])):q("",!0)}}),dc=Y(fc,[["__scopeId","data-v-88af2de4"]]),pc=c=>(Le("data-v-ccf7ddec"),c=c(),Pe(),c),hc={class:"wrapper"},vc={class:"container"},gc={class:"title"},mc={class:"content"},yc={class:"content-body"},bc=pc(()=>A("div",{class:"divider"},[A("div",{class:"divider-line"})],-1)),_c=z({__name:"VPNavBar",props:{isScreenOpen:{type:Boolean}},emits:["toggle-screen"],setup(c){const{y:a}=Zi(),{hasSidebar:u}=ut(),{frontmatter:d}=le(),p=ge({});return Ji(()=>{p.value={"has-sidebar":u.value,home:d.value.layout==="home",top:a.value===0}}),(m,S)=>(b(),L("div",{class:ke(["VPNavBar",p.value])},[A("div",hc,[A("div",vc,[A("div",gc,[J(lc,null,{"nav-bar-title-before":D(()=>[P(m.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":D(()=>[P(m.$slots,"nav-bar-title-after",{},void 0,!0)]),_:3})]),A("div",mc,[A("div",yc,[P(m.$slots,"nav-bar-content-before",{},void 0,!0),J(tc,{class:"search"}),J(Uu,{class:"menu"}),J(dc,{class:"translations"}),J(Xl,{class:"appearance"}),J(ic,{class:"social-links"}),J(Nu,{class:"extra"}),P(m.$slots,"nav-bar-content-after",{},void 0,!0),J(Mu,{class:"hamburger",active:m.isScreenOpen,onClick:S[0]||(S[0]=E=>m.$emit("toggle-screen"))},null,8,["active"])])])])]),bc],2))}}),kc=Y(_c,[["__scopeId","data-v-ccf7ddec"]]),wc={key:0,class:"VPNavScreenAppearance"},$c={class:"text"},Sc=z({__name:"VPNavScreenAppearance",setup(c){const{site:a,theme:u}=le();return(d,p)=>$(a).appearance&&$(a).appearance!=="force-dark"?(b(),L("div",wc,[A("p",$c,_e($(u).darkModeSwitchLabel||"Appearance"),1),J(ii)])):q("",!0)}}),Tc=Y(Sc,[["__scopeId","data-v-2d7af913"]]),xc=z({__name:"VPNavScreenMenuLink",props:{item:{}},setup(c){const a=mn("close-screen");return(u,d)=>(b(),Z(it,{class:"VPNavScreenMenuLink",href:u.item.link,target:u.item.target,rel:u.item.rel,onClick:$(a),innerHTML:u.item.text},null,8,["href","target","rel","onClick","innerHTML"]))}}),Cc=Y(xc,[["__scopeId","data-v-7f31e1f6"]]),Lc=z({__name:"VPNavScreenMenuGroupLink",props:{item:{}},setup(c){const a=mn("close-screen");return(u,d)=>(b(),Z(it,{class:"VPNavScreenMenuGroupLink",href:u.item.link,target:u.item.target,rel:u.item.rel,onClick:$(a)},{default:D(()=>[rt(_e(u.item.text),1)]),_:1},8,["href","target","rel","onClick"]))}}),cr=Y(Lc,[["__scopeId","data-v-19976ae1"]]),Pc={class:"VPNavScreenMenuGroupSection"},Nc={key:0,class:"title"},Ec=z({__name:"VPNavScreenMenuGroupSection",props:{text:{},items:{}},setup(c){return(a,u)=>(b(),L("div",Pc,[a.text?(b(),L("p",Nc,_e(a.text),1)):q("",!0),(b(!0),L(we,null,je(a.items,d=>(b(),Z(cr,{key:d.text,item:d},null,8,["item"]))),128))]))}}),Ac=Y(Ec,[["__scopeId","data-v-8133b170"]]),Dc=c=>(Le("data-v-ff6087d4"),c=c(),Pe(),c),jc=["aria-controls","aria-expanded"],Vc=["innerHTML"],Mc=Dc(()=>A("span",{class:"vpi-plus button-icon"},null,-1)),Ic=["id"],Hc={key:1,class:"group"},Oc=z({__name:"VPNavScreenMenuGroup",props:{text:{},items:{}},setup(c){const a=c,u=ge(!1),d=ee(()=>`NavScreenGroup-${a.text.replace(" ","-").toLowerCase()}`);function p(){u.value=!u.value}return(m,S)=>(b(),L("div",{class:ke(["VPNavScreenMenuGroup",{open:u.value}])},[A("button",{class:"button","aria-controls":d.value,"aria-expanded":u.value,onClick:p},[A("span",{class:"button-text",innerHTML:m.text},null,8,Vc),Mc],8,jc),A("div",{id:d.value,class:"items"},[(b(!0),L(we,null,je(m.items,E=>(b(),L(we,{key:E.text},["link"in E?(b(),L("div",{key:E.text,class:"item"},[J(cr,{item:E},null,8,["item"])])):(b(),L("div",Hc,[J(Ac,{text:E.text,items:E.items},null,8,["text","items"])]))],64))),128))],8,Ic)],2))}}),qc=Y(Oc,[["__scopeId","data-v-ff6087d4"]]),Fc={key:0,class:"VPNavScreenMenu"},Bc=z({__name:"VPNavScreenMenu",setup(c){const{theme:a}=le();return(u,d)=>$(a).nav?(b(),L("nav",Fc,[(b(!0),L(we,null,je($(a).nav,p=>(b(),L(we,{key:p.text},["link"in p?(b(),Z(Cc,{key:0,item:p},null,8,["item"])):(b(),Z(qc,{key:1,text:p.text||"",items:p.items},null,8,["text","items"]))],64))),128))])):q("",!0)}}),Rc=z({__name:"VPNavScreenSocialLinks",setup(c){const{theme:a}=le();return(u,d)=>$(a).socialLinks?(b(),Z(si,{key:0,class:"VPNavScreenSocialLinks",links:$(a).socialLinks},null,8,["links"])):q("",!0)}}),fr=c=>(Le("data-v-858fe1a4"),c=c(),Pe(),c),Wc=fr(()=>A("span",{class:"vpi-languages icon lang"},null,-1)),Uc=fr(()=>A("span",{class:"vpi-chevron-down icon chevron"},null,-1)),zc={class:"list"},Gc=z({__name:"VPNavScreenTranslations",setup(c){const{localeLinks:a,currentLang:u}=Jt({correspondingLink:!0}),d=ge(!1);function p(){d.value=!d.value}return(m,S)=>$(a).length&&$(u).label?(b(),L("div",{key:0,class:ke(["VPNavScreenTranslations",{open:d.value}])},[A("button",{class:"title",onClick:p},[Wc,rt(" "+_e($(u).label)+" ",1),Uc]),A("ul",zc,[(b(!0),L(we,null,je($(a),E=>(b(),L("li",{key:E.link,class:"item"},[J(it,{class:"link",href:E.link},{default:D(()=>[rt(_e(E.text),1)]),_:2},1032,["href"])]))),128))])],2)):q("",!0)}}),Xc=Y(Gc,[["__scopeId","data-v-858fe1a4"]]),Jc={class:"container"},Kc=z({__name:"VPNavScreen",props:{open:{type:Boolean}},setup(c){const a=ge(null),u=er(Vt?document.body:null);return(d,p)=>(b(),Z(Yn,{name:"fade",onEnter:p[0]||(p[0]=m=>u.value=!0),onAfterLeave:p[1]||(p[1]=m=>u.value=!1)},{default:D(()=>[d.open?(b(),L("div",{key:0,class:"VPNavScreen",ref_key:"screen",ref:a,id:"VPNavScreen"},[A("div",Jc,[P(d.$slots,"nav-screen-content-before",{},void 0,!0),J(Bc,{class:"menu"}),J(Xc,{class:"translations"}),J(Tc,{class:"appearance"}),J(Rc,{class:"social-links"}),P(d.$slots,"nav-screen-content-after",{},void 0,!0)])],512)):q("",!0)]),_:3}))}}),Yc=Y(Kc,[["__scopeId","data-v-cc5739dd"]]),Qc={key:0,class:"VPNav"},Zc=z({__name:"VPNav",setup(c){const{isScreenOpen:a,closeScreen:u,toggleScreen:d}=Ml(),{frontmatter:p}=le(),m=ee(()=>p.value.navbar!==!1);return tr("close-screen",u),hn(()=>{Vt&&document.documentElement.classList.toggle("hide-nav",!m.value)}),(S,E)=>m.value?(b(),L("header",Qc,[J(kc,{"is-screen-open":$(a),onToggleScreen:$(d)},{"nav-bar-title-before":D(()=>[P(S.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":D(()=>[P(S.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":D(()=>[P(S.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":D(()=>[P(S.$slots,"nav-bar-content-after",{},void 0,!0)]),_:3},8,["is-screen-open","onToggleScreen"]),J(Yc,{open:$(a)},{"nav-screen-content-before":D(()=>[P(S.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":D(()=>[P(S.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3},8,["open"])])):q("",!0)}}),ef=Y(Zc,[["__scopeId","data-v-ae24b3ad"]]),dr=c=>(Le("data-v-b8d55f3b"),c=c(),Pe(),c),tf=["role","tabindex"],nf=dr(()=>A("div",{class:"indicator"},null,-1)),rf=dr(()=>A("span",{class:"vpi-chevron-right caret-icon"},null,-1)),of=[rf],sf={key:1,class:"items"},af=z({__name:"VPSidebarItem",props:{item:{},depth:{}},setup(c){const a=c,{collapsed:u,collapsible:d,isLink:p,isActiveLink:m,hasActiveLink:S,hasChildren:E,toggle:N}=Zo(ee(()=>a.item)),R=ee(()=>E.value?"section":"div"),G=ee(()=>p.value?"a":"div"),W=ee(()=>E.value?a.depth+2===7?"p":`h${a.depth+2}`:"p"),ie=ee(()=>p.value?void 0:"button"),ae=ee(()=>[[`level-${a.depth}`],{collapsible:d.value},{collapsed:u.value},{"is-link":p.value},{"is-active":m.value},{"has-active":S.value}]);function H(re){"key"in re&&re.key!=="Enter"||!a.item.link&&N()}function O(){a.item.link&&N()}return(re,X)=>{const F=St("VPSidebarItem",!0);return b(),Z(jt(R.value),{class:ke(["VPSidebarItem",ae.value])},{default:D(()=>[re.item.text?(b(),L("div",cn({key:0,class:"item",role:ie.value},Po(re.item.items?{click:H,keydown:H}:{},!0),{tabindex:re.item.items&&0}),[nf,re.item.link?(b(),Z(it,{key:0,tag:G.value,class:"link",href:re.item.link,rel:re.item.rel,target:re.item.target},{default:D(()=>[(b(),Z(jt(W.value),{class:"text",innerHTML:re.item.text},null,8,["innerHTML"]))]),_:1},8,["tag","href","rel","target"])):(b(),Z(jt(W.value),{key:1,class:"text",innerHTML:re.item.text},null,8,["innerHTML"])),re.item.collapsed!=null&&re.item.items&&re.item.items.length?(b(),L("div",{key:2,class:"caret",role:"button","aria-label":"toggle section",onClick:O,onKeydown:No(O,["enter"]),tabindex:"0"},of,32)):q("",!0)],16,tf)):q("",!0),re.item.items&&re.item.items.length?(b(),L("div",sf,[re.depth<5?(b(!0),L(we,{key:0},je(re.item.items,se=>(b(),Z(F,{key:se.text,item:se,depth:re.depth+1},null,8,["item","depth"]))),128)):q("",!0)])):q("",!0)]),_:1},8,["class"])}}}),lf=Y(af,[["__scopeId","data-v-b8d55f3b"]]),pr=c=>(Le("data-v-575e6a36"),c=c(),Pe(),c),uf=pr(()=>A("div",{class:"curtain"},null,-1)),cf={class:"nav",id:"VPSidebarNav","aria-labelledby":"sidebar-aria-label",tabindex:"-1"},ff=pr(()=>A("span",{class:"visually-hidden",id:"sidebar-aria-label"}," Sidebar Navigation ",-1)),df=z({__name:"VPSidebar",props:{open:{type:Boolean}},setup(c){const{sidebarGroups:a,hasSidebar:u}=ut(),d=c,p=ge(null),m=er(Vt?document.body:null);return $t([d,p],()=>{var S;d.open?(m.value=!0,(S=p.value)==null||S.focus()):m.value=!1},{immediate:!0,flush:"post"}),(S,E)=>$(u)?(b(),L("aside",{key:0,class:ke(["VPSidebar",{open:S.open}]),ref_key:"navEl",ref:p,onClick:E[0]||(E[0]=Eo(()=>{},["stop"]))},[uf,A("nav",cf,[ff,P(S.$slots,"sidebar-nav-before",{},void 0,!0),(b(!0),L(we,null,je($(a),N=>(b(),L("div",{key:N.text,class:"group"},[J(lf,{item:N,depth:0},null,8,["item"])]))),128)),P(S.$slots,"sidebar-nav-after",{},void 0,!0)])],2)):q("",!0)}}),pf=Y(df,[["__scopeId","data-v-575e6a36"]]),hf=z({__name:"VPSkipLink",setup(c){const a=gn(),u=ge();$t(()=>a.path,()=>u.value.focus());function d({target:p}){const m=document.getElementById(decodeURIComponent(p.hash).slice(1));if(m){const S=()=>{m.removeAttribute("tabindex"),m.removeEventListener("blur",S)};m.setAttribute("tabindex","-1"),m.addEventListener("blur",S),m.focus(),window.scrollTo(0,0)}}return(p,m)=>(b(),L(we,null,[A("span",{ref_key:"backToTop",ref:u,tabindex:"-1"},null,512),A("a",{href:"#VPContent",class:"VPSkipLink visually-hidden",onClick:d}," Skip to content ")],64))}}),vf=Y(hf,[["__scopeId","data-v-0f60ec36"]]),gf=z({__name:"Layout",setup(c){const{isOpen:a,open:u,close:d}=ut(),p=gn();$t(()=>p.path,d),Qo(a,d);const{frontmatter:m}=le(),S=Ao(),E=ee(()=>!!S["home-hero-image"]);return tr("hero-image-slot-exists",E),(N,R)=>{const G=St("Content");return $(m).layout!==!1?(b(),L("div",{key:0,class:ke(["Layout",$(m).pageClass])},[P(N.$slots,"layout-top",{},void 0,!0),J(vf),J(Io,{class:"backdrop",show:$(a),onClick:$(d)},null,8,["show","onClick"]),J(ef,null,{"nav-bar-title-before":D(()=>[P(N.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":D(()=>[P(N.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":D(()=>[P(N.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":D(()=>[P(N.$slots,"nav-bar-content-after",{},void 0,!0)]),"nav-screen-content-before":D(()=>[P(N.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":D(()=>[P(N.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3}),J(Vl,{open:$(a),onOpenMenu:$(u)},null,8,["open","onOpenMenu"]),J(pf,{open:$(a)},{"sidebar-nav-before":D(()=>[P(N.$slots,"sidebar-nav-before",{},void 0,!0)]),"sidebar-nav-after":D(()=>[P(N.$slots,"sidebar-nav-after",{},void 0,!0)]),_:3},8,["open"]),J(gl,null,{"page-top":D(()=>[P(N.$slots,"page-top",{},void 0,!0)]),"page-bottom":D(()=>[P(N.$slots,"page-bottom",{},void 0,!0)]),"not-found":D(()=>[P(N.$slots,"not-found",{},void 0,!0)]),"home-hero-before":D(()=>[P(N.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info-before":D(()=>[P(N.$slots,"home-hero-info-before",{},void 0,!0)]),"home-hero-info":D(()=>[P(N.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-info-after":D(()=>[P(N.$slots,"home-hero-info-after",{},void 0,!0)]),"home-hero-actions-after":D(()=>[P(N.$slots,"home-hero-actions-after",{},void 0,!0)]),"home-hero-image":D(()=>[P(N.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":D(()=>[P(N.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":D(()=>[P(N.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":D(()=>[P(N.$slots,"home-features-after",{},void 0,!0)]),"doc-footer-before":D(()=>[P(N.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":D(()=>[P(N.$slots,"doc-before",{},void 0,!0)]),"doc-after":D(()=>[P(N.$slots,"doc-after",{},void 0,!0)]),"doc-top":D(()=>[P(N.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":D(()=>[P(N.$slots,"doc-bottom",{},void 0,!0)]),"aside-top":D(()=>[P(N.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":D(()=>[P(N.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":D(()=>[P(N.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":D(()=>[P(N.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":D(()=>[P(N.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":D(()=>[P(N.$slots,"aside-ads-after",{},void 0,!0)]),_:3}),J(kl),P(N.$slots,"layout-bottom",{},void 0,!0)],2)):(b(),Z(G,{key:1}))}}}),mf=Y(gf,[["__scopeId","data-v-5d98c3a5"]]),yf={Layout:mf,enhanceApp:({app:c})=>{c.component("Badge",jo)}},bf=c=>{if(window.dataLayer&&window.gtag)return;const a=document.createElement("script");a.src=`https://www.googletagmanager.com/gtag/js?id=${c}`,a.async=!0,document.head.appendChild(a),window.dataLayer=window.dataLayer||[],window.gtag=function(){dataLayer.push(arguments)},gtag("js",new Date),gtag("config",c)},_f=({id:c})=>{c&&typeof window<"u"&&bf(c)},ai={x:0,y:0,"line-width":2,"line-length":50,"text-margin":10,"font-size":14,"font-color":"#8DA1AC","line-color":"#8DA1AC","element-color":"black",fill:"white","yes-text":"yes","no-text":"no","arrow-end":"block",scale:1},kf=Object.assign({},ai,{symbols:{start:{class:"start-element","font-color":"white",fill:"#595959","line-width":"0px"},end:{class:"end-element","font-color":"white",fill:"#595959","line-width":"0px"},operation:{class:"operation-element","font-color":"white",fill:"#1890ff","line-width":"0px"},inputoutput:{class:"inputoutput-element","font-color":"white",fill:"#1890ff","line-width":"0px"},subroutine:{class:"subroutine-element","font-color":"white",fill:"#FF485E","element-color":"#fff","line-color":"red"},condition:{class:"condition-element","font-color":"white",fill:"#FF485E","line-width":"0px"},parallel:{class:"parallel-element","font-color":"white",fill:"#1890ff","line-width":"0px"}}}),wf=Object.assign({},ai,{symbols:{start:{class:"start-element","font-color":"white",fill:"#2F495F","line-width":"0px",rx:"10px",ry:"10px"},end:{class:"end-element","font-color":"white",fill:"#2F495F","line-width":"0px"},operation:{class:"operation-element","font-color":"white",fill:"#00BC7D"},inputoutput:{class:"inputoutput-element","font-color":"white",fill:"#EB4D5D","line-width":"0px"},subroutine:{class:"subroutine-element","font-color":"white",fill:"#937AC4","element-color":"#fff","line-color":"red"},condition:{class:"condition-element","font-color":"white",fill:"#FFB500","line-width":"0px"},parallel:{class:"parallel-element","font-color":"white",fill:"#2F495F","line-width":"0px"}}}),$f=Object.assign({},ai,{"line-width":1,symbols:{start:{class:"start-element",fill:"#ccc","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},end:{class:"end-element",fill:"#ccc","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},operation:{class:"operation-element","font-color":"white",fill:"#f1f1f1","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},inputoutput:{class:"inputoutput-element","font-color":"white",fill:"#f1f1f1","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},subroutine:{class:"subroutine-element","font-color":"white",fill:"#f1f1f1","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},condition:{class:"condition-element","font-color":"white",fill:"#f1f1f1","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"},parallel:{class:"parallel-element","font-color":"white",fill:"#f1f1f1","line-width":"1px","line-color":"#5c6ac4","font-color":"#000"}}}),Sf={ant:kf,vue:wf,pia:$f},Tf={key:0,xmlns:"http://www.w3.org/2000/svg",x:"0px",y:"0px",viewBox:"0 0 30 30",style:{"enable-background":"new 0 0 50 50"},class:"vitepress-flowchart-loading-icon"},xf=Do('',3),Cf=[xf],Lf={__name:"FlowChart",props:{id:{type:String,required:!0},code:{type:String,required:!0},preset:{type:String,default:"vue"}},setup(c){const a=c,u=ge(!1),d=ge(null);return ze(()=>{const p=Sf[a.preset];if(!p){console.warn(`[vitepress-plugin-flowchart] Unknown preset: ${a.preset}`);return}const m=a.code;d.value.setAttribute("id",a.id);const S=()=>new Promise(E=>setTimeout(E,500));Promise.all([yn(()=>import("./index.1SygLY1h.js").then(E=>E.i),[]),S()]).then(([E])=>{const{parse:N}=E.default;N(m).drawSVG(a.id,p),u.value=!1})}),(p,m)=>(b(),L("div",{class:ke([{loading:u.value,[c.preset]:c.preset},"vitepress-flowchart"]),ref_key:"flowchartEl",ref:d},[u.value?(b(),L("svg",Tf,Cf)):q("",!0)],2))}},Pf=["id"],Nf={__name:"Mindmap",props:{mindData:{type:Object}},setup(c){const a=c;return ze(async()=>{const{default:u}=await yn(()=>import("./jsmind.BLO5yOlf.js").then(p=>p.j),[]);new u(a.mindData.options).show(a.mindData.mind)}),(u,d)=>(b(),L("div",{id:c.mindData.options.container,class:"mindmap"},null,8,Pf))}};var hr=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function vr(c){return c&&c.__esModule&&Object.prototype.hasOwnProperty.call(c,"default")?c.default:c}var gr={exports:{}};/** + * PDFObject v2.3.0 + * https://github.com/pipwerks/PDFObject + * @license + * Copyright (c) 2008-2024 Philip Hutchison + * MIT-style license: http://pipwerks.mit-license.org/ + * UMD module pattern from https://github.com/umdjs/umd/blob/master/templates/returnExports.js + */(function(c){(function(a,u){c.exports?c.exports=u():a.PDFObject=u()})(hr,function(){if(typeof window>"u"||window.navigator===void 0||window.navigator.userAgent===void 0)return!1;let a="2.3.0",u=window,d=u.navigator,p=d.userAgent,m=!1,S=function(){let F=u.chrome!==void 0,se=u.safari!==void 0||d.vendor!==void 0&&/Apple/.test(d.vendor)&&/Safari/.test(p),me=u.Mozilla!==void 0||/irefox/.test(p);return F||se||me},E=function(F){var se=null;try{se=new ActiveXObject(F)}catch{se=null}return!!se},N=function(){return"ActiveXObject"in u&&(E("AcroPDF.PDF")||E("PDF.PdfCtrl"))},G=function(){if(d.platform!==void 0&&d.platform==="MacIntel"&&d.maxTouchPoints!==void 0&&d.maxTouchPoints>1||/Mobi|Tablet|Android|iPad|iPhone/.test(p))return!1;let me=typeof d.pdfViewerEnabled=="boolean";return me&&!d.pdfViewerEnabled?!1:me&&d.pdfViewerEnabled||S()||N()}(),W=function(F){let se="",me,xe=[],he="";if((F.comment||F.viewrect||F.highlight)&&(F.page||(F.page=1,ie("The comment, viewrect, and highlight parameters require a page parameter, but none was specified. Defaulting to page 1."))),F.page&&(xe.push("page="+encodeURIComponent(F.page)),delete F.page),F.fdf&&(he=F.fdf,delete F.fdf),F){for(me in F)F.hasOwnProperty(me)&&xe.push(encodeURIComponent(me)+"="+encodeURIComponent(F[me]));he&&xe.push("fdf="+encodeURIComponent(he)),se=xe.join("&"),se&&(se="#"+se)}return se},ie=function(F){return m||console.log("[PDFObject]",F),!1},ae=function(F){for(;F.firstChild;)F.removeChild(F.firstChild)},H=function(F){let se=document.body;return typeof F=="string"?se=document.querySelector(F):u.jQuery!==void 0&&F instanceof jQuery&&F.length?se=F.get(0):F.nodeType!==void 0&&F.nodeType===1&&(se=F),se},O=function(F,se,me,xe){if(window.Blob&&window.URL&&window.URL.createObjectURL){var he=new XMLHttpRequest;he.open("GET",F,!0),he.responseType="blob",he.onload=function(){if(he.status===200){var r=he.response,Ve=document.createElement("a");Ve.innerText="Download PDF",Ve.href=URL.createObjectURL(r),Ve.setAttribute("download",se),me.innerHTML=xe.replace(/\[pdflink\]/g,Ve.outerHTML)}},he.send()}},re=function(F,se,me,xe,he,r,Ve,ye,vt,Fe,ct){ae(se);let fe=me;if(F==="pdfjs"){let Be=ct.indexOf("?")!==-1?"&":"?";fe=ct+Be+"file="+encodeURIComponent(me)+xe}else fe+=xe;let Ce=document.createElement("iframe");if(Ce.className="pdfobject",Ce.type="application/pdf",Ce.title=ye,Ce.src=fe,Ce.allow="fullscreen",Ce.frameborder="0",Ve&&(Ce.id=Ve),!vt){let Be="border: none;";se!==document.body?Be+="width: "+he+"; height: "+r+";":Be+="position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%;",Ce.style.cssText=Be}let gt=["className","type","title","src","style","id","allow","frameborder"];return Fe&&Fe.key&>.indexOf(Fe.key)===-1&&Ce.setAttribute(Fe.key,typeof Fe.value<"u"?Fe.value:""),se.classList.add("pdfobject-container"),se.appendChild(Ce),se.getElementsByTagName("iframe")[0]},X=function(F,se,me){let xe=se||!1,he=me||{};m=typeof he.suppressConsole=="boolean"?he.suppressConsole:!1;let r=typeof he.id=="string"?he.id:"",Ve=he.page||!1,ye=he.pdfOpenParams||{},vt=typeof he.fallbackLink=="string"||typeof he.fallbackLink=="boolean"?he.fallbackLink:!0,Fe=he.width||"100%",ct=he.height||"100%",fe=he.title||"Embedded PDF",Ce=typeof he.forcePDFJS=="boolean"?he.forcePDFJS:!1,gt=typeof he.omitInlineStyles=="boolean"?he.omitInlineStyles:!1,Be=he.PDFJS_URL||!1,Ne=H(xe),ft="",Je=he.customAttribute||{},Mt="

This browser does not support inline PDFs. Please download the PDF to view it: [pdflink]

";if(typeof F!="string")return ie("URL is not valid");if(!Ne)return ie("Target element cannot be determined");if(Ve&&(ye.page=Ve),ft=W(ye),Ce&&Be)return re("pdfjs",Ne,F,ft,Fe,ct,r,fe,gt,Je,Be);if(G)return re("iframe",Ne,F,ft,Fe,ct,r,fe,gt,Je);if(Be)return re("pdfjs",Ne,F,ft,Fe,ct,r,fe,gt,Je,Be);if(vt)if(typeof vt=="string")Ne.innerHTML=vt.replace(/\[url\]/g,F);else if(F.indexOf("data:application/pdf;base64")!==-1)O(F,"file.pdf",Ne,Mt);else{let Yt="Download PDF";Ne.innerHTML=Mt.replace(/\[pdflink\]/g,Yt)}return ie("This browser does not support embedded PDFs")};return{embed:function(F,se,me){return X(F,se,me)},pdfobjectversion:function(){return a}(),supportsPDFs:function(){return G}()}})})(gr);var Ef=gr.exports;const Af=vr(Ef),Df={__name:"PDF",props:{src:{type:String}},setup(c){const a=c,u=ge(null);return ze(()=>{Af.embed(a.src,u.value)}),(d,p)=>(b(),L("div",{ref_key:"pdf",ref:u},null,512))}},jf=["id"],Vf={__name:"Tree",props:{id:{type:String},height:{type:String},data:{type:Array}},setup(c){const a=ge(null),u=c;return ze(async()=>{const p=(await yn(()=>import("./index.604VR5yi.js").then(S=>S.i),[])).create({htmlId:u.id,idKey:"id",hasFlatData:!0,relationnalField:"father",nodeWidth:90,nodeHeight:50,mainAxisNodeSpacing:1,isHorizontal:!1,hasPan:!1,hasZoom:!1,renderNode:function(S){return`
+
+ + ${S.data.text_1} + +
+
`},linkWidth:S=>5,linkShape:"curve",linkColor:S=>"#B0BEC5"});p.refresh(u.data),new ResizeObserver(S=>{for(const E of S)p.refresh(u.data)}).observe(a.value)}),(d,p)=>(b(),L("div",{id:c.id,class:"tree",style:Zn({height:c.height}),ref_key:"elTree",ref:a},null,12,jf))}},Mf={class:"image-figure"},If=["src","alt","title"],Hf=["href"],Of=["src","alt","title"],qf=["href"],Ff={__name:"ImageFigure",props:{src:{type:String,required:!0},alt:{type:String,required:!0},title:{type:String,required:!0},link:{type:String}},setup(c){const a=c,u=ee(()=>pn(a.src));return(d,p)=>(b(),L("figure",Mf,[c.link?(b(),L(we,{key:1},[A("a",{href:c.link,target:"_blank"},[A("img",{src:u.value,alt:c.alt,title:c.title},null,8,Of)],8,Hf),A("a",{href:c.link,target:"_blank"},[A("figcaption",null,[P(d.$slots,"default")])],8,qf)],64)):(b(),L(we,{key:0},[A("img",{src:u.value,alt:c.alt,title:c.title},null,8,If),A("figcaption",null,[P(d.$slots,"default")])],64))]))}};var mr={exports:{}};/*! + * jQuery JavaScript Library v3.7.1 + * https://jquery.com/ + * + * Copyright OpenJS Foundation and other contributors + * Released under the MIT license + * https://jquery.org/license + * + * Date: 2023-08-28T13:37Z + */(function(c){(function(a,u){c.exports=a.document?u(a,!0):function(d){if(!d.document)throw new Error("jQuery requires a window with a document");return u(d)}})(typeof window<"u"?window:hr,function(a,u){var d=[],p=Object.getPrototypeOf,m=d.slice,S=d.flat?function(e){return d.flat.call(e)}:function(e){return d.concat.apply([],e)},E=d.push,N=d.indexOf,R={},G=R.toString,W=R.hasOwnProperty,ie=W.toString,ae=ie.call(Object),H={},O=function(t){return typeof t=="function"&&typeof t.nodeType!="number"&&typeof t.item!="function"},re=function(t){return t!=null&&t===t.window},X=a.document,F={type:!0,src:!0,nonce:!0,noModule:!0};function se(e,t,n){n=n||X;var i,o,s=n.createElement("script");if(s.text=e,t)for(i in F)o=t[i]||t.getAttribute&&t.getAttribute(i),o&&s.setAttribute(i,o);n.head.appendChild(s).parentNode.removeChild(s)}function me(e){return e==null?e+"":typeof e=="object"||typeof e=="function"?R[G.call(e)]||"object":typeof e}var xe="3.7.1",he=/HTML$/i,r=function(e,t){return new r.fn.init(e,t)};r.fn=r.prototype={jquery:xe,constructor:r,length:0,toArray:function(){return m.call(this)},get:function(e){return e==null?m.call(this):e<0?this[e+this.length]:this[e]},pushStack:function(e){var t=r.merge(this.constructor(),e);return t.prevObject=this,t},each:function(e){return r.each(this,e)},map:function(e){return this.pushStack(r.map(this,function(t,n){return e.call(t,n,t)}))},slice:function(){return this.pushStack(m.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},even:function(){return this.pushStack(r.grep(this,function(e,t){return(t+1)%2}))},odd:function(){return this.pushStack(r.grep(this,function(e,t){return t%2}))},eq:function(e){var t=this.length,n=+e+(e<0?t:0);return this.pushStack(n>=0&&n0&&t-1 in e}function ye(e,t){return e.nodeName&&e.nodeName.toLowerCase()===t.toLowerCase()}var vt=d.pop,Fe=d.sort,ct=d.splice,fe="[\\x20\\t\\r\\n\\f]",Ce=new RegExp("^"+fe+"+|((?:^|[^\\\\])(?:\\\\.)*)"+fe+"+$","g");r.contains=function(e,t){var n=t&&t.parentNode;return e===n||!!(n&&n.nodeType===1&&(e.contains?e.contains(n):e.compareDocumentPosition&&e.compareDocumentPosition(n)&16))};var gt=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g;function Be(e,t){return t?e==="\0"?"�":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e}r.escapeSelector=function(e){return(e+"").replace(gt,Be)};var Ne=X,ft=E;(function(){var e,t,n,i,o,s=ft,l,v,h,y,T,C=r.expando,k=0,j=0,te=sn(),pe=sn(),oe=sn(),Ee=sn(),Te=function(f,g){return f===g&&(o=!0),0},Qe="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",Ze="(?:\\\\[\\da-fA-F]{1,6}"+fe+"?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+",de="\\["+fe+"*("+Ze+")(?:"+fe+"*([*^$|!~]?=)"+fe+`*(?:'((?:\\\\.|[^\\\\'])*)'|"((?:\\\\.|[^\\\\"])*)"|(`+Ze+"))|)"+fe+"*\\]",_t=":("+Ze+`)(?:\\((('((?:\\\\.|[^\\\\'])*)'|"((?:\\\\.|[^\\\\"])*)")|((?:\\\\.|[^\\\\()[\\]]|`+de+")*)|.*)\\)|)",ve=new RegExp(fe+"+","g"),Se=new RegExp("^"+fe+"*,"+fe+"*"),Ut=new RegExp("^"+fe+"*([>+~]|"+fe+")"+fe+"*"),Mn=new RegExp(fe+"|>"),et=new RegExp(_t),zt=new RegExp("^"+Ze+"$"),tt={ID:new RegExp("^#("+Ze+")"),CLASS:new RegExp("^\\.("+Ze+")"),TAG:new RegExp("^("+Ze+"|[*])"),ATTR:new RegExp("^"+de),PSEUDO:new RegExp("^"+_t),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+fe+"*(even|odd|(([+-]|)(\\d*)n|)"+fe+"*(?:([+-]|)"+fe+"*(\\d+)|))"+fe+"*\\)|)","i"),bool:new RegExp("^(?:"+Qe+")$","i"),needsContext:new RegExp("^"+fe+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+fe+"*((?:-\\d)?\\d*)"+fe+"*\\)|)(?=[^-]|$)","i")},dt=/^(?:input|select|textarea|button)$/i,pt=/^h\d$/i,We=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,In=/[+~]/,at=new RegExp("\\\\[\\da-fA-F]{1,6}"+fe+"?|\\\\([^\\r\\n\\f])","g"),lt=function(f,g){var _="0x"+f.slice(1)-65536;return g||(_<0?String.fromCharCode(_+65536):String.fromCharCode(_>>10|55296,_&1023|56320))},po=function(){ht()},ho=ln(function(f){return f.disabled===!0&&ye(f,"fieldset")},{dir:"parentNode",next:"legend"});function vo(){try{return l.activeElement}catch{}}try{s.apply(d=m.call(Ne.childNodes),Ne.childNodes),d[Ne.childNodes.length].nodeType}catch{s={apply:function(g,_){ft.apply(g,m.call(_))},call:function(g){ft.apply(g,m.call(arguments,1))}}}function be(f,g,_,w){var x,V,M,B,I,ue,Q,ne=g&&g.ownerDocument,ce=g?g.nodeType:9;if(_=_||[],typeof f!="string"||!f||ce!==1&&ce!==9&&ce!==11)return _;if(!w&&(ht(g),g=g||l,h)){if(ce!==11&&(I=We.exec(f)))if(x=I[1]){if(ce===9)if(M=g.getElementById(x)){if(M.id===x)return s.call(_,M),_}else return _;else if(ne&&(M=ne.getElementById(x))&&be.contains(g,M)&&M.id===x)return s.call(_,M),_}else{if(I[2])return s.apply(_,g.getElementsByTagName(f)),_;if((x=I[3])&&g.getElementsByClassName)return s.apply(_,g.getElementsByClassName(x)),_}if(!Ee[f+" "]&&(!y||!y.test(f))){if(Q=f,ne=g,ce===1&&(Mn.test(f)||Ut.test(f))){for(ne=In.test(f)&&Hn(g.parentNode)||g,(ne!=g||!H.scope)&&((B=g.getAttribute("id"))?B=r.escapeSelector(B):g.setAttribute("id",B=C)),ue=Gt(f),V=ue.length;V--;)ue[V]=(B?"#"+B:":scope")+" "+an(ue[V]);Q=ue.join(",")}try{return s.apply(_,ne.querySelectorAll(Q)),_}catch{Ee(f,!0)}finally{B===C&&g.removeAttribute("id")}}}return Ui(f.replace(Ce,"$1"),g,_,w)}function sn(){var f=[];function g(_,w){return f.push(_+" ")>t.cacheLength&&delete g[f.shift()],g[_+" "]=w}return g}function Xe(f){return f[C]=!0,f}function At(f){var g=l.createElement("fieldset");try{return!!f(g)}catch{return!1}finally{g.parentNode&&g.parentNode.removeChild(g),g=null}}function go(f){return function(g){return ye(g,"input")&&g.type===f}}function mo(f){return function(g){return(ye(g,"input")||ye(g,"button"))&&g.type===f}}function Ri(f){return function(g){return"form"in g?g.parentNode&&g.disabled===!1?"label"in g?"label"in g.parentNode?g.parentNode.disabled===f:g.disabled===f:g.isDisabled===f||g.isDisabled!==!f&&ho(g)===f:g.disabled===f:"label"in g?g.disabled===f:!1}}function kt(f){return Xe(function(g){return g=+g,Xe(function(_,w){for(var x,V=f([],_.length,g),M=V.length;M--;)_[x=V[M]]&&(_[x]=!(w[x]=_[x]))})})}function Hn(f){return f&&typeof f.getElementsByTagName<"u"&&f}function ht(f){var g,_=f?f.ownerDocument||f:Ne;return _==l||_.nodeType!==9||!_.documentElement||(l=_,v=l.documentElement,h=!r.isXMLDoc(l),T=v.matches||v.webkitMatchesSelector||v.msMatchesSelector,v.msMatchesSelector&&Ne!=l&&(g=l.defaultView)&&g.top!==g&&g.addEventListener("unload",po),H.getById=At(function(w){return v.appendChild(w).id=r.expando,!l.getElementsByName||!l.getElementsByName(r.expando).length}),H.disconnectedMatch=At(function(w){return T.call(w,"*")}),H.scope=At(function(){return l.querySelectorAll(":scope")}),H.cssHas=At(function(){try{return l.querySelector(":has(*,:jqfake)"),!1}catch{return!0}}),H.getById?(t.filter.ID=function(w){var x=w.replace(at,lt);return function(V){return V.getAttribute("id")===x}},t.find.ID=function(w,x){if(typeof x.getElementById<"u"&&h){var V=x.getElementById(w);return V?[V]:[]}}):(t.filter.ID=function(w){var x=w.replace(at,lt);return function(V){var M=typeof V.getAttributeNode<"u"&&V.getAttributeNode("id");return M&&M.value===x}},t.find.ID=function(w,x){if(typeof x.getElementById<"u"&&h){var V,M,B,I=x.getElementById(w);if(I){if(V=I.getAttributeNode("id"),V&&V.value===w)return[I];for(B=x.getElementsByName(w),M=0;I=B[M++];)if(V=I.getAttributeNode("id"),V&&V.value===w)return[I]}return[]}}),t.find.TAG=function(w,x){return typeof x.getElementsByTagName<"u"?x.getElementsByTagName(w):x.querySelectorAll(w)},t.find.CLASS=function(w,x){if(typeof x.getElementsByClassName<"u"&&h)return x.getElementsByClassName(w)},y=[],At(function(w){var x;v.appendChild(w).innerHTML="",w.querySelectorAll("[selected]").length||y.push("\\["+fe+"*(?:value|"+Qe+")"),w.querySelectorAll("[id~="+C+"-]").length||y.push("~="),w.querySelectorAll("a#"+C+"+*").length||y.push(".#.+[+~]"),w.querySelectorAll(":checked").length||y.push(":checked"),x=l.createElement("input"),x.setAttribute("type","hidden"),w.appendChild(x).setAttribute("name","D"),v.appendChild(w).disabled=!0,w.querySelectorAll(":disabled").length!==2&&y.push(":enabled",":disabled"),x=l.createElement("input"),x.setAttribute("name",""),w.appendChild(x),w.querySelectorAll("[name='']").length||y.push("\\["+fe+"*name"+fe+"*="+fe+`*(?:''|"")`)}),H.cssHas||y.push(":has"),y=y.length&&new RegExp(y.join("|")),Te=function(w,x){if(w===x)return o=!0,0;var V=!w.compareDocumentPosition-!x.compareDocumentPosition;return V||(V=(w.ownerDocument||w)==(x.ownerDocument||x)?w.compareDocumentPosition(x):1,V&1||!H.sortDetached&&x.compareDocumentPosition(w)===V?w===l||w.ownerDocument==Ne&&be.contains(Ne,w)?-1:x===l||x.ownerDocument==Ne&&be.contains(Ne,x)?1:i?N.call(i,w)-N.call(i,x):0:V&4?-1:1)}),l}be.matches=function(f,g){return be(f,null,null,g)},be.matchesSelector=function(f,g){if(ht(f),h&&!Ee[g+" "]&&(!y||!y.test(g)))try{var _=T.call(f,g);if(_||H.disconnectedMatch||f.document&&f.document.nodeType!==11)return _}catch{Ee(g,!0)}return be(g,l,null,[f]).length>0},be.contains=function(f,g){return(f.ownerDocument||f)!=l&&ht(f),r.contains(f,g)},be.attr=function(f,g){(f.ownerDocument||f)!=l&&ht(f);var _=t.attrHandle[g.toLowerCase()],w=_&&W.call(t.attrHandle,g.toLowerCase())?_(f,g,!h):void 0;return w!==void 0?w:f.getAttribute(g)},be.error=function(f){throw new Error("Syntax error, unrecognized expression: "+f)},r.uniqueSort=function(f){var g,_=[],w=0,x=0;if(o=!H.sortStable,i=!H.sortStable&&m.call(f,0),Fe.call(f,Te),o){for(;g=f[x++];)g===f[x]&&(w=_.push(x));for(;w--;)ct.call(f,_[w],1)}return i=null,f},r.fn.uniqueSort=function(){return this.pushStack(r.uniqueSort(m.apply(this)))},t=r.expr={cacheLength:50,createPseudo:Xe,match:tt,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(f){return f[1]=f[1].replace(at,lt),f[3]=(f[3]||f[4]||f[5]||"").replace(at,lt),f[2]==="~="&&(f[3]=" "+f[3]+" "),f.slice(0,4)},CHILD:function(f){return f[1]=f[1].toLowerCase(),f[1].slice(0,3)==="nth"?(f[3]||be.error(f[0]),f[4]=+(f[4]?f[5]+(f[6]||1):2*(f[3]==="even"||f[3]==="odd")),f[5]=+(f[7]+f[8]||f[3]==="odd")):f[3]&&be.error(f[0]),f},PSEUDO:function(f){var g,_=!f[6]&&f[2];return tt.CHILD.test(f[0])?null:(f[3]?f[2]=f[4]||f[5]||"":_&&et.test(_)&&(g=Gt(_,!0))&&(g=_.indexOf(")",_.length-g)-_.length)&&(f[0]=f[0].slice(0,g),f[2]=_.slice(0,g)),f.slice(0,3))}},filter:{TAG:function(f){var g=f.replace(at,lt).toLowerCase();return f==="*"?function(){return!0}:function(_){return ye(_,g)}},CLASS:function(f){var g=te[f+" "];return g||(g=new RegExp("(^|"+fe+")"+f+"("+fe+"|$)"))&&te(f,function(_){return g.test(typeof _.className=="string"&&_.className||typeof _.getAttribute<"u"&&_.getAttribute("class")||"")})},ATTR:function(f,g,_){return function(w){var x=be.attr(w,f);return x==null?g==="!=":g?(x+="",g==="="?x===_:g==="!="?x!==_:g==="^="?_&&x.indexOf(_)===0:g==="*="?_&&x.indexOf(_)>-1:g==="$="?_&&x.slice(-_.length)===_:g==="~="?(" "+x.replace(ve," ")+" ").indexOf(_)>-1:g==="|="?x===_||x.slice(0,_.length+1)===_+"-":!1):!0}},CHILD:function(f,g,_,w,x){var V=f.slice(0,3)!=="nth",M=f.slice(-4)!=="last",B=g==="of-type";return w===1&&x===0?function(I){return!!I.parentNode}:function(I,ue,Q){var ne,ce,K,$e,Oe,Ae=V!==M?"nextSibling":"previousSibling",Ue=I.parentNode,nt=B&&I.nodeName.toLowerCase(),Dt=!Q&&!B,De=!1;if(Ue){if(V){for(;Ae;){for(K=I;K=K[Ae];)if(B?ye(K,nt):K.nodeType===1)return!1;Oe=Ae=f==="only"&&!Oe&&"nextSibling"}return!0}if(Oe=[M?Ue.firstChild:Ue.lastChild],M&&Dt){for(ce=Ue[C]||(Ue[C]={}),ne=ce[f]||[],$e=ne[0]===k&&ne[1],De=$e&&ne[2],K=$e&&Ue.childNodes[$e];K=++$e&&K&&K[Ae]||(De=$e=0)||Oe.pop();)if(K.nodeType===1&&++De&&K===I){ce[f]=[k,$e,De];break}}else if(Dt&&(ce=I[C]||(I[C]={}),ne=ce[f]||[],$e=ne[0]===k&&ne[1],De=$e),De===!1)for(;(K=++$e&&K&&K[Ae]||(De=$e=0)||Oe.pop())&&!((B?ye(K,nt):K.nodeType===1)&&++De&&(Dt&&(ce=K[C]||(K[C]={}),ce[f]=[k,De]),K===I)););return De-=x,De===w||De%w===0&&De/w>=0}}},PSEUDO:function(f,g){var _,w=t.pseudos[f]||t.setFilters[f.toLowerCase()]||be.error("unsupported pseudo: "+f);return w[C]?w(g):w.length>1?(_=[f,f,"",g],t.setFilters.hasOwnProperty(f.toLowerCase())?Xe(function(x,V){for(var M,B=w(x,g),I=B.length;I--;)M=N.call(x,B[I]),x[M]=!(V[M]=B[I])}):function(x){return w(x,0,_)}):w}},pseudos:{not:Xe(function(f){var g=[],_=[],w=Bn(f.replace(Ce,"$1"));return w[C]?Xe(function(x,V,M,B){for(var I,ue=w(x,null,B,[]),Q=x.length;Q--;)(I=ue[Q])&&(x[Q]=!(V[Q]=I))}):function(x,V,M){return g[0]=x,w(g,null,M,_),g[0]=null,!_.pop()}}),has:Xe(function(f){return function(g){return be(f,g).length>0}}),contains:Xe(function(f){return f=f.replace(at,lt),function(g){return(g.textContent||r.text(g)).indexOf(f)>-1}}),lang:Xe(function(f){return zt.test(f||"")||be.error("unsupported lang: "+f),f=f.replace(at,lt).toLowerCase(),function(g){var _;do if(_=h?g.lang:g.getAttribute("xml:lang")||g.getAttribute("lang"))return _=_.toLowerCase(),_===f||_.indexOf(f+"-")===0;while((g=g.parentNode)&&g.nodeType===1);return!1}}),target:function(f){var g=a.location&&a.location.hash;return g&&g.slice(1)===f.id},root:function(f){return f===v},focus:function(f){return f===vo()&&l.hasFocus()&&!!(f.type||f.href||~f.tabIndex)},enabled:Ri(!1),disabled:Ri(!0),checked:function(f){return ye(f,"input")&&!!f.checked||ye(f,"option")&&!!f.selected},selected:function(f){return f.parentNode&&f.parentNode.selectedIndex,f.selected===!0},empty:function(f){for(f=f.firstChild;f;f=f.nextSibling)if(f.nodeType<6)return!1;return!0},parent:function(f){return!t.pseudos.empty(f)},header:function(f){return pt.test(f.nodeName)},input:function(f){return dt.test(f.nodeName)},button:function(f){return ye(f,"input")&&f.type==="button"||ye(f,"button")},text:function(f){var g;return ye(f,"input")&&f.type==="text"&&((g=f.getAttribute("type"))==null||g.toLowerCase()==="text")},first:kt(function(){return[0]}),last:kt(function(f,g){return[g-1]}),eq:kt(function(f,g,_){return[_<0?_+g:_]}),even:kt(function(f,g){for(var _=0;_g?w=g:w=_;--w>=0;)f.push(w);return f}),gt:kt(function(f,g,_){for(var w=_<0?_+g:_;++w1?function(g,_,w){for(var x=f.length;x--;)if(!f[x](g,_,w))return!1;return!0}:f[0]}function yo(f,g,_){for(var w=0,x=g.length;w-1&&(M[Q]=!(B[Q]=ce))}}else K=un(K===B?K.splice(Ae,K.length):K),x?x(null,B,K,ue):s.apply(B,K)})}function Fn(f){for(var g,_,w,x=f.length,V=t.relative[f[0].type],M=V||t.relative[" "],B=V?1:0,I=ln(function(ne){return ne===g},M,!0),ue=ln(function(ne){return N.call(g,ne)>-1},M,!0),Q=[function(ne,ce,K){var $e=!V&&(K||ce!=n)||((g=ce).nodeType?I(ne,ce,K):ue(ne,ce,K));return g=null,$e}];B1&&On(Q),B>1&&an(f.slice(0,B-1).concat({value:f[B-2].type===" "?"*":""})).replace(Ce,"$1"),_,B0,w=f.length>0,x=function(V,M,B,I,ue){var Q,ne,ce,K=0,$e="0",Oe=V&&[],Ae=[],Ue=n,nt=V||w&&t.find.TAG("*",ue),Dt=k+=Ue==null?1:Math.random()||.1,De=nt.length;for(ue&&(n=M==l||M||ue);$e!==De&&(Q=nt[$e])!=null;$e++){if(w&&Q){for(ne=0,!M&&Q.ownerDocument!=l&&(ht(Q),B=!h);ce=f[ne++];)if(ce(Q,M||l,B)){s.call(I,Q);break}ue&&(k=Dt)}_&&((Q=!ce&&Q)&&K--,V&&Oe.push(Q))}if(K+=$e,_&&$e!==K){for(ne=0;ce=g[ne++];)ce(Oe,Ae,M,B);if(V){if(K>0)for(;$e--;)Oe[$e]||Ae[$e]||(Ae[$e]=vt.call(I));Ae=un(Ae)}s.apply(I,Ae),ue&&!V&&Ae.length>0&&K+g.length>1&&r.uniqueSort(I)}return ue&&(k=Dt,n=Ue),Oe};return _?Xe(x):x}function Bn(f,g){var _,w=[],x=[],V=oe[f+" "];if(!V){for(g||(g=Gt(f)),_=g.length;_--;)V=Fn(g[_]),V[C]?w.push(V):x.push(V);V=oe(f,bo(x,w)),V.selector=f}return V}function Ui(f,g,_,w){var x,V,M,B,I,ue=typeof f=="function"&&f,Q=!w&&Gt(f=ue.selector||f);if(_=_||[],Q.length===1){if(V=Q[0]=Q[0].slice(0),V.length>2&&(M=V[0]).type==="ID"&&g.nodeType===9&&h&&t.relative[V[1].type]){if(g=(t.find.ID(M.matches[0].replace(at,lt),g)||[])[0],g)ue&&(g=g.parentNode);else return _;f=f.slice(V.shift().value.length)}for(x=tt.needsContext.test(f)?0:V.length;x--&&(M=V[x],!t.relative[B=M.type]);)if((I=t.find[B])&&(w=I(M.matches[0].replace(at,lt),In.test(V[0].type)&&Hn(g.parentNode)||g))){if(V.splice(x,1),f=w.length&&an(V),!f)return s.apply(_,w),_;break}}return(ue||Bn(f,Q))(w,g,!h,_,!g||In.test(f)&&Hn(g.parentNode)||g),_}H.sortStable=C.split("").sort(Te).join("")===C,ht(),H.sortDetached=At(function(f){return f.compareDocumentPosition(l.createElement("fieldset"))&1}),r.find=be,r.expr[":"]=r.expr.pseudos,r.unique=r.uniqueSort,be.compile=Bn,be.select=Ui,be.setDocument=ht,be.tokenize=Gt,be.escape=r.escapeSelector,be.getText=r.text,be.isXML=r.isXMLDoc,be.selectors=r.expr,be.support=r.support,be.uniqueSort=r.uniqueSort})();var Je=function(e,t,n){for(var i=[],o=n!==void 0;(e=e[t])&&e.nodeType!==9;)if(e.nodeType===1){if(o&&r(e).is(n))break;i.push(e)}return i},Mt=function(e,t){for(var n=[];e;e=e.nextSibling)e.nodeType===1&&e!==t&&n.push(e);return n},Yt=r.expr.match.needsContext,li=/^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function _n(e,t,n){return O(t)?r.grep(e,function(i,o){return!!t.call(i,o,i)!==n}):t.nodeType?r.grep(e,function(i){return i===t!==n}):typeof t!="string"?r.grep(e,function(i){return N.call(t,i)>-1!==n}):r.filter(t,e,n)}r.filter=function(e,t,n){var i=t[0];return n&&(e=":not("+e+")"),t.length===1&&i.nodeType===1?r.find.matchesSelector(i,e)?[i]:[]:r.find.matches(e,r.grep(t,function(o){return o.nodeType===1}))},r.fn.extend({find:function(e){var t,n,i=this.length,o=this;if(typeof e!="string")return this.pushStack(r(e).filter(function(){for(t=0;t1?r.uniqueSort(n):n},filter:function(e){return this.pushStack(_n(this,e||[],!1))},not:function(e){return this.pushStack(_n(this,e||[],!0))},is:function(e){return!!_n(this,typeof e=="string"&&Yt.test(e)?r(e):e||[],!1).length}});var ui,yr=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/,br=r.fn.init=function(e,t,n){var i,o;if(!e)return this;if(n=n||ui,typeof e=="string")if(e[0]==="<"&&e[e.length-1]===">"&&e.length>=3?i=[null,e,null]:i=yr.exec(e),i&&(i[1]||!t))if(i[1]){if(t=t instanceof r?t[0]:t,r.merge(this,r.parseHTML(i[1],t&&t.nodeType?t.ownerDocument||t:X,!0)),li.test(i[1])&&r.isPlainObject(t))for(i in t)O(this[i])?this[i](t[i]):this.attr(i,t[i]);return this}else return o=X.getElementById(i[2]),o&&(this[0]=o,this.length=1),this;else return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);else{if(e.nodeType)return this[0]=e,this.length=1,this;if(O(e))return n.ready!==void 0?n.ready(e):e(r)}return r.makeArray(e,this)};br.prototype=r.fn,ui=r(X);var _r=/^(?:parents|prev(?:Until|All))/,kr={children:!0,contents:!0,next:!0,prev:!0};r.fn.extend({has:function(e){var t=r(e,this),n=t.length;return this.filter(function(){for(var i=0;i-1:n.nodeType===1&&r.find.matchesSelector(n,e))){s.push(n);break}}return this.pushStack(s.length>1?r.uniqueSort(s):s)},index:function(e){return e?typeof e=="string"?N.call(r(e),this[0]):N.call(this,e.jquery?e[0]:e):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){return this.pushStack(r.uniqueSort(r.merge(this.get(),r(e,t))))},addBack:function(e){return this.add(e==null?this.prevObject:this.prevObject.filter(e))}});function ci(e,t){for(;(e=e[t])&&e.nodeType!==1;);return e}r.each({parent:function(e){var t=e.parentNode;return t&&t.nodeType!==11?t:null},parents:function(e){return Je(e,"parentNode")},parentsUntil:function(e,t,n){return Je(e,"parentNode",n)},next:function(e){return ci(e,"nextSibling")},prev:function(e){return ci(e,"previousSibling")},nextAll:function(e){return Je(e,"nextSibling")},prevAll:function(e){return Je(e,"previousSibling")},nextUntil:function(e,t,n){return Je(e,"nextSibling",n)},prevUntil:function(e,t,n){return Je(e,"previousSibling",n)},siblings:function(e){return Mt((e.parentNode||{}).firstChild,e)},children:function(e){return Mt(e.firstChild)},contents:function(e){return e.contentDocument!=null&&p(e.contentDocument)?e.contentDocument:(ye(e,"template")&&(e=e.content||e),r.merge([],e.childNodes))}},function(e,t){r.fn[e]=function(n,i){var o=r.map(this,t,n);return e.slice(-5)!=="Until"&&(i=n),i&&typeof i=="string"&&(o=r.filter(i,o)),this.length>1&&(kr[e]||r.uniqueSort(o),_r.test(e)&&o.reverse()),this.pushStack(o)}});var Ke=/[^\x20\t\r\n\f]+/g;function wr(e){var t={};return r.each(e.match(Ke)||[],function(n,i){t[i]=!0}),t}r.Callbacks=function(e){e=typeof e=="string"?wr(e):r.extend({},e);var t,n,i,o,s=[],l=[],v=-1,h=function(){for(o=o||e.once,i=t=!0;l.length;v=-1)for(n=l.shift();++v-1;)s.splice(k,1),k<=v&&v--}),this},has:function(T){return T?r.inArray(T,s)>-1:s.length>0},empty:function(){return s&&(s=[]),this},disable:function(){return o=l=[],s=n="",this},disabled:function(){return!s},lock:function(){return o=l=[],!n&&!t&&(s=n=""),this},locked:function(){return!!o},fireWith:function(T,C){return o||(C=C||[],C=[T,C.slice?C.slice():C],l.push(C),t||h()),this},fire:function(){return y.fireWith(this,arguments),this},fired:function(){return!!i}};return y};function Tt(e){return e}function Qt(e){throw e}function fi(e,t,n,i){var o;try{e&&O(o=e.promise)?o.call(e).done(t).fail(n):e&&O(o=e.then)?o.call(e,t,n):t.apply(void 0,[e].slice(i))}catch(s){n.apply(void 0,[s])}}r.extend({Deferred:function(e){var t=[["notify","progress",r.Callbacks("memory"),r.Callbacks("memory"),2],["resolve","done",r.Callbacks("once memory"),r.Callbacks("once memory"),0,"resolved"],["reject","fail",r.Callbacks("once memory"),r.Callbacks("once memory"),1,"rejected"]],n="pending",i={state:function(){return n},always:function(){return o.done(arguments).fail(arguments),this},catch:function(s){return i.then(null,s)},pipe:function(){var s=arguments;return r.Deferred(function(l){r.each(t,function(v,h){var y=O(s[h[4]])&&s[h[4]];o[h[1]](function(){var T=y&&y.apply(this,arguments);T&&O(T.promise)?T.promise().progress(l.notify).done(l.resolve).fail(l.reject):l[h[0]+"With"](this,y?[T]:arguments)})}),s=null}).promise()},then:function(s,l,v){var h=0;function y(T,C,k,j){return function(){var te=this,pe=arguments,oe=function(){var Te,Qe;if(!(T=h&&(k!==Qt&&(te=void 0,pe=[Te]),C.rejectWith(te,pe))}};T?Ee():(r.Deferred.getErrorHook?Ee.error=r.Deferred.getErrorHook():r.Deferred.getStackHook&&(Ee.error=r.Deferred.getStackHook()),a.setTimeout(Ee))}}return r.Deferred(function(T){t[0][3].add(y(0,T,O(v)?v:Tt,T.notifyWith)),t[1][3].add(y(0,T,O(s)?s:Tt)),t[2][3].add(y(0,T,O(l)?l:Qt))}).promise()},promise:function(s){return s!=null?r.extend(s,i):i}},o={};return r.each(t,function(s,l){var v=l[2],h=l[5];i[l[1]]=v.add,h&&v.add(function(){n=h},t[3-s][2].disable,t[3-s][3].disable,t[0][2].lock,t[0][3].lock),v.add(l[3].fire),o[l[0]]=function(){return o[l[0]+"With"](this===o?void 0:this,arguments),this},o[l[0]+"With"]=v.fireWith}),i.promise(o),e&&e.call(o,o),o},when:function(e){var t=arguments.length,n=t,i=Array(n),o=m.call(arguments),s=r.Deferred(),l=function(v){return function(h){i[v]=this,o[v]=arguments.length>1?m.call(arguments):h,--t||s.resolveWith(i,o)}};if(t<=1&&(fi(e,s.done(l(n)).resolve,s.reject,!t),s.state()==="pending"||O(o[n]&&o[n].then)))return s.then();for(;n--;)fi(o[n],l(n),s.reject);return s.promise()}});var $r=/^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;r.Deferred.exceptionHook=function(e,t){a.console&&a.console.warn&&e&&$r.test(e.name)&&a.console.warn("jQuery.Deferred exception: "+e.message,e.stack,t)},r.readyException=function(e){a.setTimeout(function(){throw e})};var kn=r.Deferred();r.fn.ready=function(e){return kn.then(e).catch(function(t){r.readyException(t)}),this},r.extend({isReady:!1,readyWait:1,ready:function(e){(e===!0?--r.readyWait:r.isReady)||(r.isReady=!0,!(e!==!0&&--r.readyWait>0)&&kn.resolveWith(X,[r]))}}),r.ready.then=kn.then;function Zt(){X.removeEventListener("DOMContentLoaded",Zt),a.removeEventListener("load",Zt),r.ready()}X.readyState==="complete"||X.readyState!=="loading"&&!X.documentElement.doScroll?a.setTimeout(r.ready):(X.addEventListener("DOMContentLoaded",Zt),a.addEventListener("load",Zt));var ot=function(e,t,n,i,o,s,l){var v=0,h=e.length,y=n==null;if(me(n)==="object"){o=!0;for(v in n)ot(e,t,v,n[v],!0,s,l)}else if(i!==void 0&&(o=!0,O(i)||(l=!0),y&&(l?(t.call(e,i),t=null):(y=t,t=function(T,C,k){return y.call(r(T),k)})),t))for(;v1,null,!0)},removeData:function(e){return this.each(function(){Me.remove(this,e)})}}),r.extend({queue:function(e,t,n){var i;if(e)return t=(t||"fx")+"queue",i=U.get(e,t),n&&(!i||Array.isArray(n)?i=U.access(e,t,r.makeArray(n)):i.push(n)),i||[]},dequeue:function(e,t){t=t||"fx";var n=r.queue(e,t),i=n.length,o=n.shift(),s=r._queueHooks(e,t),l=function(){r.dequeue(e,t)};o==="inprogress"&&(o=n.shift(),i--),o&&(t==="fx"&&n.unshift("inprogress"),delete s.stop,o.call(e,l,s)),!i&&s&&s.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return U.get(e,n)||U.access(e,n,{empty:r.Callbacks("once memory").add(function(){U.remove(e,[t+"queue",n])})})}}),r.fn.extend({queue:function(e,t){var n=2;return typeof e!="string"&&(t=e,e="fx",n--),arguments.length\x20\t\r\n\f]*)/i,mi=/^$|^module$|\/(?:java|ecma)script/i;(function(){var e=X.createDocumentFragment(),t=e.appendChild(X.createElement("div")),n=X.createElement("input");n.setAttribute("type","radio"),n.setAttribute("checked","checked"),n.setAttribute("name","t"),t.appendChild(n),H.checkClone=t.cloneNode(!0).cloneNode(!0).lastChild.checked,t.innerHTML="",H.noCloneChecked=!!t.cloneNode(!0).lastChild.defaultValue,t.innerHTML="",H.option=!!t.lastChild})();var Re={thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};Re.tbody=Re.tfoot=Re.colgroup=Re.caption=Re.thead,Re.th=Re.td,H.option||(Re.optgroup=Re.option=[1,""]);function Ie(e,t){var n;return typeof e.getElementsByTagName<"u"?n=e.getElementsByTagName(t||"*"):typeof e.querySelectorAll<"u"?n=e.querySelectorAll(t||"*"):n=[],t===void 0||t&&ye(e,t)?r.merge([e],n):n}function wn(e,t){for(var n=0,i=e.length;n-1){o&&o.push(s);continue}if(y=xt(s),l=Ie(C.appendChild(s),"script"),y&&wn(l),n)for(T=0;s=l[T++];)mi.test(s.type||"")&&n.push(s)}return C}var bi=/^([^.]*)(?:\.(.+)|)/;function Lt(){return!0}function Pt(){return!1}function $n(e,t,n,i,o,s){var l,v;if(typeof t=="object"){typeof n!="string"&&(i=i||n,n=void 0);for(v in t)$n(e,v,n,i,t[v],s);return e}if(i==null&&o==null?(o=n,i=n=void 0):o==null&&(typeof n=="string"?(o=i,i=void 0):(o=i,i=n,n=void 0)),o===!1)o=Pt;else if(!o)return e;return s===1&&(l=o,o=function(h){return r().off(h),l.apply(this,arguments)},o.guid=l.guid||(l.guid=r.guid++)),e.each(function(){r.event.add(this,t,o,i,n)})}r.event={global:{},add:function(e,t,n,i,o){var s,l,v,h,y,T,C,k,j,te,pe,oe=U.get(e);if(It(e))for(n.handler&&(s=n,n=s.handler,o=s.selector),o&&r.find.matchesSelector(mt,o),n.guid||(n.guid=r.guid++),(h=oe.events)||(h=oe.events=Object.create(null)),(l=oe.handle)||(l=oe.handle=function(Ee){return typeof r<"u"&&r.event.triggered!==Ee.type?r.event.dispatch.apply(e,arguments):void 0}),t=(t||"").match(Ke)||[""],y=t.length;y--;)v=bi.exec(t[y])||[],j=pe=v[1],te=(v[2]||"").split(".").sort(),j&&(C=r.event.special[j]||{},j=(o?C.delegateType:C.bindType)||j,C=r.event.special[j]||{},T=r.extend({type:j,origType:pe,data:i,handler:n,guid:n.guid,selector:o,needsContext:o&&r.expr.match.needsContext.test(o),namespace:te.join(".")},s),(k=h[j])||(k=h[j]=[],k.delegateCount=0,(!C.setup||C.setup.call(e,i,te,l)===!1)&&e.addEventListener&&e.addEventListener(j,l)),C.add&&(C.add.call(e,T),T.handler.guid||(T.handler.guid=n.guid)),o?k.splice(k.delegateCount++,0,T):k.push(T),r.event.global[j]=!0)},remove:function(e,t,n,i,o){var s,l,v,h,y,T,C,k,j,te,pe,oe=U.hasData(e)&&U.get(e);if(!(!oe||!(h=oe.events))){for(t=(t||"").match(Ke)||[""],y=t.length;y--;){if(v=bi.exec(t[y])||[],j=pe=v[1],te=(v[2]||"").split(".").sort(),!j){for(j in h)r.event.remove(e,j+t[y],n,i,!0);continue}for(C=r.event.special[j]||{},j=(i?C.delegateType:C.bindType)||j,k=h[j]||[],v=v[2]&&new RegExp("(^|\\.)"+te.join("\\.(?:.*\\.|)")+"(\\.|$)"),l=s=k.length;s--;)T=k[s],(o||pe===T.origType)&&(!n||n.guid===T.guid)&&(!v||v.test(T.namespace))&&(!i||i===T.selector||i==="**"&&T.selector)&&(k.splice(s,1),T.selector&&k.delegateCount--,C.remove&&C.remove.call(e,T));l&&!k.length&&((!C.teardown||C.teardown.call(e,te,oe.handle)===!1)&&r.removeEvent(e,j,oe.handle),delete h[j])}r.isEmptyObject(h)&&U.remove(e,"handle events")}},dispatch:function(e){var t,n,i,o,s,l,v=new Array(arguments.length),h=r.event.fix(e),y=(U.get(this,"events")||Object.create(null))[h.type]||[],T=r.event.special[h.type]||{};for(v[0]=h,t=1;t=1)){for(;y!==this;y=y.parentNode||this)if(y.nodeType===1&&!(e.type==="click"&&y.disabled===!0)){for(s=[],l={},n=0;n-1:r.find(o,this,null,[y]).length),l[o]&&s.push(i);s.length&&v.push({elem:y,handlers:s})}}return y=this,h\s*$/g;function _i(e,t){return ye(e,"table")&&ye(t.nodeType!==11?t:t.firstChild,"tr")&&r(e).children("tbody")[0]||e}function Mr(e){return e.type=(e.getAttribute("type")!==null)+"/"+e.type,e}function Ir(e){return(e.type||"").slice(0,5)==="true/"?e.type=e.type.slice(5):e.removeAttribute("type"),e}function ki(e,t){var n,i,o,s,l,v,h;if(t.nodeType===1){if(U.hasData(e)&&(s=U.get(e),h=s.events,h)){U.remove(t,"handle events");for(o in h)for(n=0,i=h[o].length;n1&&typeof j=="string"&&!H.checkClone&&jr.test(j))return e.each(function(pe){var oe=e.eq(pe);te&&(t[0]=j.call(this,pe,oe.html())),Nt(oe,t,n,i)});if(C&&(o=yi(t,e[0].ownerDocument,!1,e,i),s=o.firstChild,o.childNodes.length===1&&(o=s),s||i)){for(l=r.map(Ie(o,"script"),Mr),v=l.length;T0&&wn(l,!h&&Ie(e,"script")),v},cleanData:function(e){for(var t,n,i,o=r.event.special,s=0;(n=e[s])!==void 0;s++)if(It(n)){if(t=n[U.expando]){if(t.events)for(i in t.events)o[i]?r.event.remove(n,i):r.removeEvent(n,i,t.handle);n[U.expando]=void 0}n[Me.expando]&&(n[Me.expando]=void 0)}}}),r.fn.extend({detach:function(e){return wi(this,e,!0)},remove:function(e){return wi(this,e)},text:function(e){return ot(this,function(t){return t===void 0?r.text(this):this.empty().each(function(){(this.nodeType===1||this.nodeType===11||this.nodeType===9)&&(this.textContent=t)})},null,e,arguments.length)},append:function(){return Nt(this,arguments,function(e){if(this.nodeType===1||this.nodeType===11||this.nodeType===9){var t=_i(this,e);t.appendChild(e)}})},prepend:function(){return Nt(this,arguments,function(e){if(this.nodeType===1||this.nodeType===11||this.nodeType===9){var t=_i(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return Nt(this,arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return Nt(this,arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},empty:function(){for(var e,t=0;(e=this[t])!=null;t++)e.nodeType===1&&(r.cleanData(Ie(e,!1)),e.textContent="");return this},clone:function(e,t){return e=e??!1,t=t??e,this.map(function(){return r.clone(this,e,t)})},html:function(e){return ot(this,function(t){var n=this[0]||{},i=0,o=this.length;if(t===void 0&&n.nodeType===1)return n.innerHTML;if(typeof t=="string"&&!Dr.test(t)&&!Re[(gi.exec(t)||["",""])[1].toLowerCase()]){t=r.htmlPrefilter(t);try{for(;i=0&&(h+=Math.max(0,Math.ceil(e["offset"+t[0].toUpperCase()+t.slice(1)]-s-h-v-.5))||0),h+y}function Ni(e,t,n){var i=nn(e),o=!H.boxSizingReliable()||n,s=o&&r.css(e,"boxSizing",!1,i)==="border-box",l=s,v=Ft(e,t,i),h="offset"+t[0].toUpperCase()+t.slice(1);if(Sn.test(v)){if(!n)return v;v="auto"}return(!H.boxSizingReliable()&&s||!H.reliableTrDimensions()&&ye(e,"tr")||v==="auto"||!parseFloat(v)&&r.css(e,"display",!1,i)==="inline")&&e.getClientRects().length&&(s=r.css(e,"boxSizing",!1,i)==="border-box",l=h in e,l&&(v=e[h])),v=parseFloat(v)||0,v+Cn(e,t,n||(s?"border":"content"),l,i,v)+"px"}r.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=Ft(e,"opacity");return n===""?"1":n}}}},cssNumber:{animationIterationCount:!0,aspectRatio:!0,borderImageSlice:!0,columnCount:!0,flexGrow:!0,flexShrink:!0,fontWeight:!0,gridArea:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnStart:!0,gridRow:!0,gridRowEnd:!0,gridRowStart:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,scale:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeMiterlimit:!0,strokeOpacity:!0},cssProps:{},style:function(e,t,n,i){if(!(!e||e.nodeType===3||e.nodeType===8||!e.style)){var o,s,l,v=Ye(t),h=Tn.test(t),y=e.style;if(h||(t=xn(v)),l=r.cssHooks[t]||r.cssHooks[v],n!==void 0){if(s=typeof n,s==="string"&&(o=Ot.exec(n))&&o[1]&&(n=hi(e,t,o),s="number"),n==null||n!==n)return;s==="number"&&!h&&(n+=o&&o[3]||(r.cssNumber[v]?"":"px")),!H.clearCloneStyle&&n===""&&t.indexOf("background")===0&&(y[t]="inherit"),(!l||!("set"in l)||(n=l.set(e,n,i))!==void 0)&&(h?y.setProperty(t,n):y[t]=n)}else return l&&"get"in l&&(o=l.get(e,!1,i))!==void 0?o:y[t]}},css:function(e,t,n,i){var o,s,l,v=Ye(t),h=Tn.test(t);return h||(t=xn(v)),l=r.cssHooks[t]||r.cssHooks[v],l&&"get"in l&&(o=l.get(e,!0,n)),o===void 0&&(o=Ft(e,t,i)),o==="normal"&&t in Li&&(o=Li[t]),n===""||n?(s=parseFloat(o),n===!0||isFinite(s)?s||0:o):o}}),r.each(["height","width"],function(e,t){r.cssHooks[t]={get:function(n,i,o){if(i)return Fr.test(r.css(n,"display"))&&(!n.getClientRects().length||!n.getBoundingClientRect().width)?$i(n,Br,function(){return Ni(n,t,o)}):Ni(n,t,o)},set:function(n,i,o){var s,l=nn(n),v=!H.scrollboxSize()&&l.position==="absolute",h=v||o,y=h&&r.css(n,"boxSizing",!1,l)==="border-box",T=o?Cn(n,t,o,y,l):0;return y&&v&&(T-=Math.ceil(n["offset"+t[0].toUpperCase()+t.slice(1)]-parseFloat(l[t])-Cn(n,t,"border",!1,l)-.5)),T&&(s=Ot.exec(i))&&(s[3]||"px")!=="px"&&(n.style[t]=i,i=r.css(n,t)),Pi(n,i,T)}}}),r.cssHooks.marginLeft=Si(H.reliableMarginLeft,function(e,t){if(t)return(parseFloat(Ft(e,"marginLeft"))||e.getBoundingClientRect().left-$i(e,{marginLeft:0},function(){return e.getBoundingClientRect().left}))+"px"}),r.each({margin:"",padding:"",border:"Width"},function(e,t){r.cssHooks[e+t]={expand:function(n){for(var i=0,o={},s=typeof n=="string"?n.split(" "):[n];i<4;i++)o[e+st[i]+t]=s[i]||s[i-2]||s[0];return o}},e!=="margin"&&(r.cssHooks[e+t].set=Pi)}),r.fn.extend({css:function(e,t){return ot(this,function(n,i,o){var s,l,v={},h=0;if(Array.isArray(i)){for(s=nn(n),l=i.length;h1)}});function He(e,t,n,i,o){return new He.prototype.init(e,t,n,i,o)}r.Tween=He,He.prototype={constructor:He,init:function(e,t,n,i,o,s){this.elem=e,this.prop=n,this.easing=o||r.easing._default,this.options=t,this.start=this.now=this.cur(),this.end=i,this.unit=s||(r.cssNumber[n]?"":"px")},cur:function(){var e=He.propHooks[this.prop];return e&&e.get?e.get(this):He.propHooks._default.get(this)},run:function(e){var t,n=He.propHooks[this.prop];return this.options.duration?this.pos=t=r.easing[this.easing](e,this.options.duration*e,0,1,this.options.duration):this.pos=t=e,this.now=(this.end-this.start)*t+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),n&&n.set?n.set(this):He.propHooks._default.set(this),this}},He.prototype.init.prototype=He.prototype,He.propHooks={_default:{get:function(e){var t;return e.elem.nodeType!==1||e.elem[e.prop]!=null&&e.elem.style[e.prop]==null?e.elem[e.prop]:(t=r.css(e.elem,e.prop,""),!t||t==="auto"?0:t)},set:function(e){r.fx.step[e.prop]?r.fx.step[e.prop](e):e.elem.nodeType===1&&(r.cssHooks[e.prop]||e.elem.style[xn(e.prop)]!=null)?r.style(e.elem,e.prop,e.now+e.unit):e.elem[e.prop]=e.now}}},He.propHooks.scrollTop=He.propHooks.scrollLeft={set:function(e){e.elem.nodeType&&e.elem.parentNode&&(e.elem[e.prop]=e.now)}},r.easing={linear:function(e){return e},swing:function(e){return .5-Math.cos(e*Math.PI)/2},_default:"swing"},r.fx=He.prototype.init,r.fx.step={};var Et,rn,Rr=/^(?:toggle|show|hide)$/,Wr=/queueHooks$/;function Ln(){rn&&(X.hidden===!1&&a.requestAnimationFrame?a.requestAnimationFrame(Ln):a.setTimeout(Ln,r.fx.interval),r.fx.tick())}function Ei(){return a.setTimeout(function(){Et=void 0}),Et=Date.now()}function on(e,t){var n,i=0,o={height:e};for(t=t?1:0;i<4;i+=2-t)n=st[i],o["margin"+n]=o["padding"+n]=e;return t&&(o.opacity=o.width=e),o}function Ai(e,t,n){for(var i,o=(Ge.tweeners[t]||[]).concat(Ge.tweeners["*"]),s=0,l=o.length;s1)},removeAttr:function(e){return this.each(function(){r.removeAttr(this,e)})}}),r.extend({attr:function(e,t,n){var i,o,s=e.nodeType;if(!(s===3||s===8||s===2)){if(typeof e.getAttribute>"u")return r.prop(e,t,n);if((s!==1||!r.isXMLDoc(e))&&(o=r.attrHooks[t.toLowerCase()]||(r.expr.match.bool.test(t)?Di:void 0)),n!==void 0){if(n===null){r.removeAttr(e,t);return}return o&&"set"in o&&(i=o.set(e,n,t))!==void 0?i:(e.setAttribute(t,n+""),n)}return o&&"get"in o&&(i=o.get(e,t))!==null?i:(i=r.find.attr(e,t),i??void 0)}},attrHooks:{type:{set:function(e,t){if(!H.radioValue&&t==="radio"&&ye(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}},removeAttr:function(e,t){var n,i=0,o=t&&t.match(Ke);if(o&&e.nodeType===1)for(;n=o[i++];)e.removeAttribute(n)}}),Di={set:function(e,t,n){return t===!1?r.removeAttr(e,n):e.setAttribute(n,n),n}},r.each(r.expr.match.bool.source.match(/\w+/g),function(e,t){var n=Bt[t]||r.find.attr;Bt[t]=function(i,o,s){var l,v,h=o.toLowerCase();return s||(v=Bt[h],Bt[h]=l,l=n(i,o,s)!=null?h:null,Bt[h]=v),l}});var Gr=/^(?:input|select|textarea|button)$/i,Xr=/^(?:a|area)$/i;r.fn.extend({prop:function(e,t){return ot(this,r.prop,e,t,arguments.length>1)},removeProp:function(e){return this.each(function(){delete this[r.propFix[e]||e]})}}),r.extend({prop:function(e,t,n){var i,o,s=e.nodeType;if(!(s===3||s===8||s===2))return(s!==1||!r.isXMLDoc(e))&&(t=r.propFix[t]||t,o=r.propHooks[t]),n!==void 0?o&&"set"in o&&(i=o.set(e,n,t))!==void 0?i:e[t]=n:o&&"get"in o&&(i=o.get(e,t))!==null?i:e[t]},propHooks:{tabIndex:{get:function(e){var t=r.find.attr(e,"tabindex");return t?parseInt(t,10):Gr.test(e.nodeName)||Xr.test(e.nodeName)&&e.href?0:-1}}},propFix:{for:"htmlFor",class:"className"}}),H.optSelected||(r.propHooks.selected={get:function(e){var t=e.parentNode;return t&&t.parentNode&&t.parentNode.selectedIndex,null},set:function(e){var t=e.parentNode;t&&(t.selectedIndex,t.parentNode&&t.parentNode.selectedIndex)}}),r.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){r.propFix[this.toLowerCase()]=this});function yt(e){var t=e.match(Ke)||[];return t.join(" ")}function bt(e){return e.getAttribute&&e.getAttribute("class")||""}function Pn(e){return Array.isArray(e)?e:typeof e=="string"?e.match(Ke)||[]:[]}r.fn.extend({addClass:function(e){var t,n,i,o,s,l;return O(e)?this.each(function(v){r(this).addClass(e.call(this,v,bt(this)))}):(t=Pn(e),t.length?this.each(function(){if(i=bt(this),n=this.nodeType===1&&" "+yt(i)+" ",n){for(s=0;s-1;)n=n.replace(" "+o+" "," ");l=yt(n),i!==l&&this.setAttribute("class",l)}}):this):this.attr("class","")},toggleClass:function(e,t){var n,i,o,s,l=typeof e,v=l==="string"||Array.isArray(e);return O(e)?this.each(function(h){r(this).toggleClass(e.call(this,h,bt(this),t),t)}):typeof t=="boolean"&&v?t?this.addClass(e):this.removeClass(e):(n=Pn(e),this.each(function(){if(v)for(s=r(this),o=0;o-1)return!0;return!1}});var Jr=/\r/g;r.fn.extend({val:function(e){var t,n,i,o=this[0];return arguments.length?(i=O(e),this.each(function(s){var l;this.nodeType===1&&(i?l=e.call(this,s,r(this).val()):l=e,l==null?l="":typeof l=="number"?l+="":Array.isArray(l)&&(l=r.map(l,function(v){return v==null?"":v+""})),t=r.valHooks[this.type]||r.valHooks[this.nodeName.toLowerCase()],(!t||!("set"in t)||t.set(this,l,"value")===void 0)&&(this.value=l))})):o?(t=r.valHooks[o.type]||r.valHooks[o.nodeName.toLowerCase()],t&&"get"in t&&(n=t.get(o,"value"))!==void 0?n:(n=o.value,typeof n=="string"?n.replace(Jr,""):n??"")):void 0}}),r.extend({valHooks:{option:{get:function(e){var t=r.find.attr(e,"value");return t??yt(r.text(e))}},select:{get:function(e){var t,n,i,o=e.options,s=e.selectedIndex,l=e.type==="select-one",v=l?null:[],h=l?s+1:o.length;for(s<0?i=h:i=l?s:0;i-1)&&(n=!0);return n||(e.selectedIndex=-1),s}}}}),r.each(["radio","checkbox"],function(){r.valHooks[this]={set:function(e,t){if(Array.isArray(t))return e.checked=r.inArray(r(e).val(),t)>-1}},H.checkOn||(r.valHooks[this].get=function(e){return e.getAttribute("value")===null?"on":e.value})});var Rt=a.location,ji={guid:Date.now()},Nn=/\?/;r.parseXML=function(e){var t,n;if(!e||typeof e!="string")return null;try{t=new a.DOMParser().parseFromString(e,"text/xml")}catch{}return n=t&&t.getElementsByTagName("parsererror")[0],(!t||n)&&r.error("Invalid XML: "+(n?r.map(n.childNodes,function(i){return i.textContent}).join(` +`):e)),t};var Vi=/^(?:focusinfocus|focusoutblur)$/,Mi=function(e){e.stopPropagation()};r.extend(r.event,{trigger:function(e,t,n,i){var o,s,l,v,h,y,T,C,k=[n||X],j=W.call(e,"type")?e.type:e,te=W.call(e,"namespace")?e.namespace.split("."):[];if(s=C=l=n=n||X,!(n.nodeType===3||n.nodeType===8)&&!Vi.test(j+r.event.triggered)&&(j.indexOf(".")>-1&&(te=j.split("."),j=te.shift(),te.sort()),h=j.indexOf(":")<0&&"on"+j,e=e[r.expando]?e:new r.Event(j,typeof e=="object"&&e),e.isTrigger=i?2:3,e.namespace=te.join("."),e.rnamespace=e.namespace?new RegExp("(^|\\.)"+te.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,e.result=void 0,e.target||(e.target=n),t=t==null?[e]:r.makeArray(t,[e]),T=r.event.special[j]||{},!(!i&&T.trigger&&T.trigger.apply(n,t)===!1))){if(!i&&!T.noBubble&&!re(n)){for(v=T.delegateType||j,Vi.test(v+j)||(s=s.parentNode);s;s=s.parentNode)k.push(s),l=s;l===(n.ownerDocument||X)&&k.push(l.defaultView||l.parentWindow||a)}for(o=0;(s=k[o++])&&!e.isPropagationStopped();)C=s,e.type=o>1?v:T.bindType||j,y=(U.get(s,"events")||Object.create(null))[e.type]&&U.get(s,"handle"),y&&y.apply(s,t),y=h&&s[h],y&&y.apply&&It(s)&&(e.result=y.apply(s,t),e.result===!1&&e.preventDefault());return e.type=j,!i&&!e.isDefaultPrevented()&&(!T._default||T._default.apply(k.pop(),t)===!1)&&It(n)&&h&&O(n[j])&&!re(n)&&(l=n[h],l&&(n[h]=null),r.event.triggered=j,e.isPropagationStopped()&&C.addEventListener(j,Mi),n[j](),e.isPropagationStopped()&&C.removeEventListener(j,Mi),r.event.triggered=void 0,l&&(n[h]=l)),e.result}},simulate:function(e,t,n){var i=r.extend(new r.Event,n,{type:e,isSimulated:!0});r.event.trigger(i,null,t)}}),r.fn.extend({trigger:function(e,t){return this.each(function(){r.event.trigger(e,t,this)})},triggerHandler:function(e,t){var n=this[0];if(n)return r.event.trigger(e,t,n,!0)}});var Kr=/\[\]$/,Ii=/\r?\n/g,Yr=/^(?:submit|button|image|reset|file)$/i,Qr=/^(?:input|select|textarea|keygen)/i;function En(e,t,n,i){var o;if(Array.isArray(t))r.each(t,function(s,l){n||Kr.test(e)?i(e,l):En(e+"["+(typeof l=="object"&&l!=null?s:"")+"]",l,n,i)});else if(!n&&me(t)==="object")for(o in t)En(e+"["+o+"]",t[o],n,i);else i(e,t)}r.param=function(e,t){var n,i=[],o=function(s,l){var v=O(l)?l():l;i[i.length]=encodeURIComponent(s)+"="+encodeURIComponent(v??"")};if(e==null)return"";if(Array.isArray(e)||e.jquery&&!r.isPlainObject(e))r.each(e,function(){o(this.name,this.value)});else for(n in e)En(n,e[n],t,o);return i.join("&")},r.fn.extend({serialize:function(){return r.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var e=r.prop(this,"elements");return e?r.makeArray(e):this}).filter(function(){var e=this.type;return this.name&&!r(this).is(":disabled")&&Qr.test(this.nodeName)&&!Yr.test(e)&&(this.checked||!qt.test(e))}).map(function(e,t){var n=r(this).val();return n==null?null:Array.isArray(n)?r.map(n,function(i){return{name:t.name,value:i.replace(Ii,`\r +`)}}):{name:t.name,value:n.replace(Ii,`\r +`)}}).get()}});var Zr=/%20/g,eo=/#.*$/,to=/([?&])_=[^&]*/,no=/^(.*?):[ \t]*([^\r\n]*)$/mg,io=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,ro=/^(?:GET|HEAD)$/,oo=/^\/\//,Hi={},An={},Oi="*/".concat("*"),Dn=X.createElement("a");Dn.href=Rt.href;function qi(e){return function(t,n){typeof t!="string"&&(n=t,t="*");var i,o=0,s=t.toLowerCase().match(Ke)||[];if(O(n))for(;i=s[o++];)i[0]==="+"?(i=i.slice(1)||"*",(e[i]=e[i]||[]).unshift(n)):(e[i]=e[i]||[]).push(n)}}function Fi(e,t,n,i){var o={},s=e===An;function l(v){var h;return o[v]=!0,r.each(e[v]||[],function(y,T){var C=T(t,n,i);if(typeof C=="string"&&!s&&!o[C])return t.dataTypes.unshift(C),l(C),!1;if(s)return!(h=C)}),h}return l(t.dataTypes[0])||!o["*"]&&l("*")}function jn(e,t){var n,i,o=r.ajaxSettings.flatOptions||{};for(n in t)t[n]!==void 0&&((o[n]?e:i||(i={}))[n]=t[n]);return i&&r.extend(!0,e,i),e}function so(e,t,n){for(var i,o,s,l,v=e.contents,h=e.dataTypes;h[0]==="*";)h.shift(),i===void 0&&(i=e.mimeType||t.getResponseHeader("Content-Type"));if(i){for(o in v)if(v[o]&&v[o].test(i)){h.unshift(o);break}}if(h[0]in n)s=h[0];else{for(o in n){if(!h[0]||e.converters[o+" "+h[0]]){s=o;break}l||(l=o)}s=s||l}if(s)return s!==h[0]&&h.unshift(s),n[s]}function ao(e,t,n,i){var o,s,l,v,h,y={},T=e.dataTypes.slice();if(T[1])for(l in e.converters)y[l.toLowerCase()]=e.converters[l];for(s=T.shift();s;)if(e.responseFields[s]&&(n[e.responseFields[s]]=t),!h&&i&&e.dataFilter&&(t=e.dataFilter(t,e.dataType)),h=s,s=T.shift(),s){if(s==="*")s=h;else if(h!=="*"&&h!==s){if(l=y[h+" "+s]||y["* "+s],!l){for(o in y)if(v=o.split(" "),v[1]===s&&(l=y[h+" "+v[0]]||y["* "+v[0]],l)){l===!0?l=y[o]:y[o]!==!0&&(s=v[0],T.unshift(v[1]));break}}if(l!==!0)if(l&&e.throws)t=l(t);else try{t=l(t)}catch(C){return{state:"parsererror",error:l?C:"No conversion from "+h+" to "+s}}}}return{state:"success",data:t}}r.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:Rt.href,type:"GET",isLocal:io.test(Rt.protocol),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":Oi,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/\bxml\b/,html:/\bhtml/,json:/\bjson\b/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":JSON.parse,"text xml":r.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(e,t){return t?jn(jn(e,r.ajaxSettings),t):jn(r.ajaxSettings,e)},ajaxPrefilter:qi(Hi),ajaxTransport:qi(An),ajax:function(e,t){typeof e=="object"&&(t=e,e=void 0),t=t||{};var n,i,o,s,l,v,h,y,T,C,k=r.ajaxSetup({},t),j=k.context||k,te=k.context&&(j.nodeType||j.jquery)?r(j):r.event,pe=r.Deferred(),oe=r.Callbacks("once memory"),Ee=k.statusCode||{},Te={},Qe={},Ze="canceled",de={readyState:0,getResponseHeader:function(ve){var Se;if(h){if(!s)for(s={};Se=no.exec(o);)s[Se[1].toLowerCase()+" "]=(s[Se[1].toLowerCase()+" "]||[]).concat(Se[2]);Se=s[ve.toLowerCase()+" "]}return Se==null?null:Se.join(", ")},getAllResponseHeaders:function(){return h?o:null},setRequestHeader:function(ve,Se){return h==null&&(ve=Qe[ve.toLowerCase()]=Qe[ve.toLowerCase()]||ve,Te[ve]=Se),this},overrideMimeType:function(ve){return h==null&&(k.mimeType=ve),this},statusCode:function(ve){var Se;if(ve)if(h)de.always(ve[de.status]);else for(Se in ve)Ee[Se]=[Ee[Se],ve[Se]];return this},abort:function(ve){var Se=ve||Ze;return n&&n.abort(Se),_t(0,Se),this}};if(pe.promise(de),k.url=((e||k.url||Rt.href)+"").replace(oo,Rt.protocol+"//"),k.type=t.method||t.type||k.method||k.type,k.dataTypes=(k.dataType||"*").toLowerCase().match(Ke)||[""],k.crossDomain==null){v=X.createElement("a");try{v.href=k.url,v.href=v.href,k.crossDomain=Dn.protocol+"//"+Dn.host!=v.protocol+"//"+v.host}catch{k.crossDomain=!0}}if(k.data&&k.processData&&typeof k.data!="string"&&(k.data=r.param(k.data,k.traditional)),Fi(Hi,k,t,de),h)return de;y=r.event&&k.global,y&&r.active++===0&&r.event.trigger("ajaxStart"),k.type=k.type.toUpperCase(),k.hasContent=!ro.test(k.type),i=k.url.replace(eo,""),k.hasContent?k.data&&k.processData&&(k.contentType||"").indexOf("application/x-www-form-urlencoded")===0&&(k.data=k.data.replace(Zr,"+")):(C=k.url.slice(i.length),k.data&&(k.processData||typeof k.data=="string")&&(i+=(Nn.test(i)?"&":"?")+k.data,delete k.data),k.cache===!1&&(i=i.replace(to,"$1"),C=(Nn.test(i)?"&":"?")+"_="+ji.guid+++C),k.url=i+C),k.ifModified&&(r.lastModified[i]&&de.setRequestHeader("If-Modified-Since",r.lastModified[i]),r.etag[i]&&de.setRequestHeader("If-None-Match",r.etag[i])),(k.data&&k.hasContent&&k.contentType!==!1||t.contentType)&&de.setRequestHeader("Content-Type",k.contentType),de.setRequestHeader("Accept",k.dataTypes[0]&&k.accepts[k.dataTypes[0]]?k.accepts[k.dataTypes[0]]+(k.dataTypes[0]!=="*"?", "+Oi+"; q=0.01":""):k.accepts["*"]);for(T in k.headers)de.setRequestHeader(T,k.headers[T]);if(k.beforeSend&&(k.beforeSend.call(j,de,k)===!1||h))return de.abort();if(Ze="abort",oe.add(k.complete),de.done(k.success),de.fail(k.error),n=Fi(An,k,t,de),!n)_t(-1,"No Transport");else{if(de.readyState=1,y&&te.trigger("ajaxSend",[de,k]),h)return de;k.async&&k.timeout>0&&(l=a.setTimeout(function(){de.abort("timeout")},k.timeout));try{h=!1,n.send(Te,_t)}catch(ve){if(h)throw ve;_t(-1,ve)}}function _t(ve,Se,Ut,Mn){var et,zt,tt,dt,pt,We=Se;h||(h=!0,l&&a.clearTimeout(l),n=void 0,o=Mn||"",de.readyState=ve>0?4:0,et=ve>=200&&ve<300||ve===304,Ut&&(dt=so(k,de,Ut)),!et&&r.inArray("script",k.dataTypes)>-1&&r.inArray("json",k.dataTypes)<0&&(k.converters["text script"]=function(){}),dt=ao(k,dt,de,et),et?(k.ifModified&&(pt=de.getResponseHeader("Last-Modified"),pt&&(r.lastModified[i]=pt),pt=de.getResponseHeader("etag"),pt&&(r.etag[i]=pt)),ve===204||k.type==="HEAD"?We="nocontent":ve===304?We="notmodified":(We=dt.state,zt=dt.data,tt=dt.error,et=!tt)):(tt=We,(ve||!We)&&(We="error",ve<0&&(ve=0))),de.status=ve,de.statusText=(Se||We)+"",et?pe.resolveWith(j,[zt,We,de]):pe.rejectWith(j,[de,We,tt]),de.statusCode(Ee),Ee=void 0,y&&te.trigger(et?"ajaxSuccess":"ajaxError",[de,k,et?zt:tt]),oe.fireWith(j,[de,We]),y&&(te.trigger("ajaxComplete",[de,k]),--r.active||r.event.trigger("ajaxStop")))}return de},getJSON:function(e,t,n){return r.get(e,t,n,"json")},getScript:function(e,t){return r.get(e,void 0,t,"script")}}),r.each(["get","post"],function(e,t){r[t]=function(n,i,o,s){return O(i)&&(s=s||o,o=i,i=void 0),r.ajax(r.extend({url:n,type:t,dataType:s,data:i,success:o},r.isPlainObject(n)&&n))}}),r.ajaxPrefilter(function(e){var t;for(t in e.headers)t.toLowerCase()==="content-type"&&(e.contentType=e.headers[t]||"")}),r._evalUrl=function(e,t,n){return r.ajax({url:e,type:"GET",dataType:"script",cache:!0,async:!1,global:!1,converters:{"text script":function(){}},dataFilter:function(i){r.globalEval(i,t,n)}})},r.fn.extend({wrapAll:function(e){var t;return this[0]&&(O(e)&&(e=e.call(this[0])),t=r(e,this[0].ownerDocument).eq(0).clone(!0),this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){for(var n=this;n.firstElementChild;)n=n.firstElementChild;return n}).append(this)),this},wrapInner:function(e){return O(e)?this.each(function(t){r(this).wrapInner(e.call(this,t))}):this.each(function(){var t=r(this),n=t.contents();n.length?n.wrapAll(e):t.append(e)})},wrap:function(e){var t=O(e);return this.each(function(n){r(this).wrapAll(t?e.call(this,n):e)})},unwrap:function(e){return this.parent(e).not("body").each(function(){r(this).replaceWith(this.childNodes)}),this}}),r.expr.pseudos.hidden=function(e){return!r.expr.pseudos.visible(e)},r.expr.pseudos.visible=function(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)},r.ajaxSettings.xhr=function(){try{return new a.XMLHttpRequest}catch{}};var lo={0:200,1223:204},Wt=r.ajaxSettings.xhr();H.cors=!!Wt&&"withCredentials"in Wt,H.ajax=Wt=!!Wt,r.ajaxTransport(function(e){var t,n;if(H.cors||Wt&&!e.crossDomain)return{send:function(i,o){var s,l=e.xhr();if(l.open(e.type,e.url,e.async,e.username,e.password),e.xhrFields)for(s in e.xhrFields)l[s]=e.xhrFields[s];e.mimeType&&l.overrideMimeType&&l.overrideMimeType(e.mimeType),!e.crossDomain&&!i["X-Requested-With"]&&(i["X-Requested-With"]="XMLHttpRequest");for(s in i)l.setRequestHeader(s,i[s]);t=function(v){return function(){t&&(t=n=l.onload=l.onerror=l.onabort=l.ontimeout=l.onreadystatechange=null,v==="abort"?l.abort():v==="error"?typeof l.status!="number"?o(0,"error"):o(l.status,l.statusText):o(lo[l.status]||l.status,l.statusText,(l.responseType||"text")!=="text"||typeof l.responseText!="string"?{binary:l.response}:{text:l.responseText},l.getAllResponseHeaders()))}},l.onload=t(),n=l.onerror=l.ontimeout=t("error"),l.onabort!==void 0?l.onabort=n:l.onreadystatechange=function(){l.readyState===4&&a.setTimeout(function(){t&&n()})},t=t("abort");try{l.send(e.hasContent&&e.data||null)}catch(v){if(t)throw v}},abort:function(){t&&t()}}}),r.ajaxPrefilter(function(e){e.crossDomain&&(e.contents.script=!1)}),r.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/\b(?:java|ecma)script\b/},converters:{"text script":function(e){return r.globalEval(e),e}}}),r.ajaxPrefilter("script",function(e){e.cache===void 0&&(e.cache=!1),e.crossDomain&&(e.type="GET")}),r.ajaxTransport("script",function(e){if(e.crossDomain||e.scriptAttrs){var t,n;return{send:function(i,o){t=r(" + + + + + + + + + +
前端班課程講義

主題

陣列與物件 ​

陣列是多種相似資料的集合
物件是一個東西的多種不同屬性的集合

陣列 ​

可以想像陣列是一台火車，每節車廂就是一筆資料，火車長度沒有限制

  • 每一節車廂的號碼就是 索引，又稱 index
  • 每一節車廂的乘客就是 值，又稱 value

TIP

通常在命名陣列時，會用複數名詞，如 students、teachers、items 等

js
// 用陣列前
+const bendon1 = "雞排飯";
+const bendon2 = "排骨飯";
+const bendon3 = "魚排飯";
+
+// 用陣列後
+const bendons = ["雞排飯", "排骨飯", "魚排飯"];

如果把上面的陣列想像成一台火車

  • 火車的名字叫做 bendons，有 3 節車廂
  • 第 0 節車廂的名字叫做 雞排飯;
  • 第 1 節車廂的名字叫做 排骨飯;
  • 第 2 節車廂的名字叫做 魚排飯;
  • 0、1、2 是這個陣列的 索引，又稱 index
  • 雞排飯、排骨飯、魚排飯 是這個陣列的 值，又稱 value

注意

在程式裡，陣列的索引是從 0 開始

在存取陣列資料時

  • [] 可以使用索引取得資料，如果索引不存在會回傳 undefined
  • .length 可以得到陣列的長度
js
const alphabets = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']
+
+// .length 取長度
+console.log(`有 ${alphabets.length} 個字母<br>`)
+
+// [索引] 取指定資料
+console.log(alphabets[0])     // a
+console.log(alphabets[1])     // b
+console.log(alphabets[1000])  // undefined
+
+// 以變數值當索引取資料
+const index = 2
+console.log(alphabets[index]) // c
+
+// 使用迴圈取得所有資料
+for (let i = 0; i < alphabets.length; i++) {
+  document.write(alphabets[i])
+}

物件 ​

物件保存了一個東西的不同種資料

  • 每個資料名稱叫做 key
  • 資料的值叫做 value
js
const person = { 
+  name: "王小明",
+  age: 25,
+  number: 24
+}

如果把上面的物件想像成一個人

  • 這個人的 name 為 王小明
  • 這個人的 age 為 25
  • 這個人的 number 為 24

注意

物件無法直接使用 .length 取得長度，也不能用 [第幾個] 取得資料
但是可以用 ["索引名"] 取得某索引的資料

js
const person = { 
+    name: "王小明", 
+    age: 25, 
+    number: 24 
+}
+// 用 .key 取值
+console.log(person.name)
+// 用 ["key"] 取值
+console.log(person['name'])
+// 用變數當 key 取值
+const key = 'name'
+console.log(person[key])

解構賦值 ​

解構賦值可以把陣列或物件中的資料解開擷取成為獨立變數
相當於建立一個新變數，並設定為陣列或物件中的某個值
在解構時可以使用其餘運算子 ... 取得剩餘的資料

注意

其餘元素 ... 必須放在最後一個
[a, ...others, c] 是不正確的語法

陣列解構範例

js
const array = [1, 2, 3, 4]
+
+// 原始寫法
+const one = array[0]
+const two = array[1]
+const others = [array[2], array[3]]
+console.log(one)      // 1
+console.log(two)      // 2
+console.log(others)   // [3, 4]
+
+// 解構賦值
+// 依照順序取值
+const [one, two, ...apple] = array
+console.log(one)      // 1
+console.log(two)      // 2
+console.log(apple)    // [3, 4]

物件解構範例

js
const obj = { a: 1, b: 2, c: 3, d: 4 }
+
+// 原始寫法
+const a = obj.a
+const bbb = obj.b
+const others = { c: obj.c, d: obj.d }
+console.log(a)        // 1
+console.log(bbb)      // 2
+console.log(others)   // { c: 3, d: 4 }
+
+// 解構賦值
+// 依照 key 名稱取值，可用 : 重新命名
+const { a, b: bbb, ...others } = obj
+console.log(a)        // 1
+console.log(bbb)      // 2
+console.log(banana)   // { c: 3, d: 4 }

巢狀 ​

物件和 Array 可以依資料情況組合，儲存更複雜的資料

由物件組成的陣列範例

js
const people = [
+    { 
+        name: "小明",
+        age: 25,
+        number: 24
+    },
+    { 
+        name: "小美", 
+        age: 24, 
+        number: 25
+    }
+]

物件內值為陣列範例

js
const restaurant = {
+    name: "好好吃便當店",
+    tel: "02-21345678",
+    foods: ["雞排飯", "排骨飯", "魚排飯"]
+}
二維陣列概念
二維陣列概念，如 X 班 Y 號同學的成績
三維陣列概念
三維陣列概念，如 X 年 Y 班 Z 號同學的成績

TIP

目前網路上給開發者使用的公開資料大多是物件和陣列的結合
所以熟悉物件和陣列的組合，對於串接 API 會有很大的幫助

可選串連 ​

當要存取的陣列索引或物件屬性可能不存在時，使用 ?. 可以避免出現錯誤

物件範例

js
const user = {
+  name: 'AAA',
+  info: {
+    email: 'aaa@gmail.com'
+  }
+}
+console.log(user.name)                // AAA
+console.log(user.info.email)          // aaa@gmail.com
+console.log(user.info.address)        // undefined
+
+// Uncaught TypeError: Cannot read properties of undefined (reading 'city')
+console.log(user.info.address.city)
+
+console.log(user.info.address?.city)            // undefined
+console.log(user.info.address?.city?.postcode)  // undefined

陣列範例

js
const restaurant = {
+  name: '好好吃便當店',
+  tel: '02-21345678',
+  menu: []
+}
+
+// Uncaught TypeError: Cannot read properties of undefined (reading 'price')
+console.log(restaurant.menu[0].price)
+
+// undefined
+console.log(restaurant.menu?.[0]?.price)

可選串連搭配短路求值範例，當資料不存在時使用預設值

js
const products = [
+  { name: 'iPhone 15', price: 48900 },
+  { 
+    name: 'Nothing Phone(2)',
+    price: 21900,
+    producer: {
+      name: 'Nothing',
+      url: 'https://tw.nothing.tech/'
+    }
+  },
+  { 
+    name: 'Nothing Phone(1)',
+    price: 14900,
+    producer: {
+      name: 'Nothing',
+      url: 'https://tw.nothing.tech/'
+    }
+  }
+]
+
+for (let i = 0; i < products.length; i++) {
+  document.write(`
+    <p>
+      ${products[i].name}，價格為 ${products[i].price}
+      製造商為
+      <a href="${products[i].producer?.url || '#'}">${products[i].producer?.name || '不明'}</a>
+    </p>
+  `)
+}

迴圈 ​

可以透過迴圈去取出陣列或物件裡的所有資料

  • for 適合固定次數的迴圈，陣列有固定長度，所以可以對陣列使用
  • for of 針對陣列的值進行迴圈
  • for in 針對物件的 key 或是陣列的 index 進行迴圈

for 迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(let i = 0; i < bendons.length; i++) {
+  console.log(i, bendons[i])
+}

for of 迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(const bendon of bendons) {
+  console.log(bendon);
+}

for in 陣列迴圈範例

js
const bendons = ["雞排飯", "排骨飯", "魚排飯"];
+for(const i in bendons) {
+  console.log(i, bendons[i]);
+}

for in 物件迴圈範例

js
const person = { 
+  name: "王小明", 
+  age: 25, 
+  number: 24 
+}
+for(const key in person) {
+  console.log(person[key]);
+}

傳值與傳址 ​

傳值 (Pass by value)

  • 其餘文字、數字、布林等資料型態傳遞方式
  • 複製一份資料，改變其中一個不會影響另一個
js
let test1 = 1
+let test2 = test1
+test2 = 100
+console.log(test1)    // 1
+console.log(test2)    // 100

傳址 (Pass by reference)

  • 物件和陣列的資料傳遞方式
  • 指向同一個記憶體位置，改變其中一個會影響另一個

陣列傳址範例

js
const a = [1, 2, 3]
+const b = a
+b[0] = 100
+console.log(a)        // [100, 2, 3]
+console.log(b)        // [100, 2, 3]
+console.log(a === b)  // true

物件傳址範例

js
const obj1 = { 
+  a: 1,
+  b: 2,
+  c: 3
+}
+const obj2 = obj1
+obj1.a = 100
+console.log(obj1)     // {a: 100, b: 2, c: 3}
+console.log(obj2)     // {a: 100, b: 2, c: 3}

注意

在編寫時，以資料的型態決定是傳值還是傳址

陣列範例
指向的是陣列內的索引為 0 的值，而不是整個陣列
索引為 0 的值資料型態不是陣列也不是物件，所以是傳值

js
const a = [4, 5, 6]
+let b = a[0]
+b = 100
+console.log(a)        // [4, 5, 6]
+console.log(b)        // 100

物件範例
指向的是物件內的值，而不是整個物件
物件內的值是一般資料型態，所以是傳值

js
const obj1 = {
+  a: 1,
+  b: 2,
+  c: 3
+}
+const obj2 = {
+  a: obj1.a,
+  b: obj1.b,
+  c: obj1.c
+}
+obj2.a = 100
+console.log(obj1)     // {a: 1, b: 2, c: 3}
+console.log(obj2)     // {a: 100, b: 2, c: 3}

綜合練習 ​

練習

宣告一個數字陣列

js
const numbers = [33, 75, 69, 41, 50, 19]
  • 印出陣列 第 x 個數字為 y
  • 求 41 是第幾個數字
  • 有幾個奇數和幾個偶數
  • 最大數字和最小數字

練習

某國家發生通貨膨脹
饅頭第一天 1 元，第二天 2 元，第三天 3 元，以此類推
小明他從第一天起，連續買了 10 天的饅頭
每天買的饅頭數依序為 1, 8, 3, 4, 5, 6, 7, 2, 9, 10
求小明買饅頭花費的總金額

題目修改自 高中生程式解題系統

練習

假設某一公司有五種產品 A、B、C、D、E
其單價分別為 12、16、10、14、15 元
而該公司共有三位銷售員，他們在某個月份的銷售量如下所示

產品 A產品 B產品 C產品 D產品 E
銷售員 13332564533
銷售員 27733684523
銷售員 34355436765

請將上表的內容設定成二維陣列，並依序完成下列各題

  • 每一個銷售員的銷售總金額
  • 每一項產品的銷售總金額
js
const data = [
+  [33, 32, 56, 45, 33],
+  [77, 33, 68, 45, 23],
+  [43, 55, 43, 67, 65]
+]

作業

練習二維陣列
下表為某地星期一到星期四的時段一、時段二與時段三的氣溫

星期一星期二星期三星期四
時段一18.217.315.013.4
時段二23.825.120.617.8
時段三20.621.518.415.7

請將上表的內容設定成二維陣列，並依序完成下列各題

  • 將陣列內容印出成表格
  • 每日的平均溫度
  • 時段一、時段二、時段三的平均氣溫
  • 溫度最高的日子與時段
  • 溫度最低的日子與時段
js
const data = [
+  [18.2, 17.3, 15.0, 13.4],
+  [23.8, 25.1, 20.6, 17.8],
+  [20.6, 21.5, 18.4, 15.7]
+]
+ + + + \ No newline at end of file diff --git a/basic/class.html b/basic/class.html new file mode 100644 index 00000000..700e6acc --- /dev/null +++ b/basic/class.html @@ -0,0 +1,62 @@ + + + + + + 物件導向 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

物件導向 ​

物件裡面的值除了可以是一般的文字、數字外，它的值也可以是 function
如果物件裡面包含 function 的話，就會是 物件導向 的程式設計

物件中的 function ​

  • 物件裡面可以用 function 作為值
  • 以 this 來代表這個物件，可以用來取得物件裡的其他屬性
js
const person = {
+  firstName: '小明',
+  lastName: '王',
+  // 物件內 function 定義方式
+  fullName: function () {
+    return this.firstName + this.lastName
+  },
+  // 物件內 function 定義方式簡寫
+  sayHi () {
+    return '你好，我是' + this.fullName()
+  },
+  // 物件內箭頭函式定義方式
+  // this 會指向 window 而不是物件
+  sayHi2: () => {
+    return '你好，我是' + this.fullName()
+  }
+}

上面的程式碼可以畫成像這樣的心智圖

TIP

可選串連也可以避免呼叫物件內不存在的 function 時的錯誤

js
person.sayGoodBye?.()

注意

this 在不同地方有不同意思，使用時需要特別注意
以下為瀏覽器常見的使用情況

  • 在物件的 function 裡，this 代表這個物件
  • 在一般 function 裡，this 代表 window
  • 在箭頭函式裡，this 代表 window

類別 ​

類別是物件導向的基本概念，宣告一個模板後，用它來建立物件
使用 class 來宣告類別，並用 new 來建立物件

js
// 宣告類別
+class Person {
+  // constructor 是物件建立時會執行的 function
+  constructor(firstName, lastName) {
+    this.firstName = firstName
+    this.lastName = lastName
+  }
+  fullName () {
+    return this.firstName + this.lastName
+  }
+  sayHi () {
+    return '你好，我是' + this.fullName()
+  }
+}
+
+// 建立物件
+const Ming = new Person("小明", "王");
+const Mei = new Person("小美", "王");
+
+// 使用建立的物件
+document.write(Ming.sayHi())
+document.write(Mei.sayHi())
+ + + + \ No newline at end of file diff --git a/basic/condition.html b/basic/condition.html new file mode 100644 index 00000000..b1f75a55 --- /dev/null +++ b/basic/condition.html @@ -0,0 +1,219 @@ + + + + + + 邏輯判斷式 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

邏輯判斷式 ​

邏輯判斷式是程式運作不可或缺的部分，它可以讓程式根據不同的情況去執行不同的程式碼

認識語法 ​

當中文句型為

如果 ( 條件 ) { 條件成立時的動作 } 否則 { 條件不成立時的動作 }

如果 ( 外面下雨 ) { 在家裡待著電影 } 否則 { 出門和爬山 }

翻譯成程式就是

js
if (條件) {
+  條件成立時的程式碼
+} else {
+  條件不成立時的程式碼
+}
js
if (外面下雨) {
+  在家裡待著電影
+} else {
+  出門
+  去爬山
+}
  • if 代表如果，後面接判斷式，如果成立，就會裡面的執行程式碼
  • else 代表否則，當 if 不成立時，就會裡面的執行程式碼

TIP

當判斷式後的 {} 內只有一行程式碼時，可以省略 {}

js
if (條件) 執行程式碼
+else  執行程式碼

上面的範例可以寫成

js
if (外面下雨) 在家裡待著電影
+else {
+  出門
+  去爬山
+}

else 和中文 否則 一樣是非必要的

如果 ( 可以決定交作業時間 ) { 我希望永遠不必交 }

js
if (可以決定交作業時間) {
+  我希望永遠不必交
+}

比較運算子 ​

比較運算子是用來比較兩個值的大小
運算的結果會是布林值 true 或 false

注意

請注意符號的擺放位置，例如 a >= b 不能寫成 a => b
=> 代表 function 的箭頭函式，不是比較運算子

符號說明
a == ba 等於 b
a === ba 等於 b （資料型態也要相同）
a != ba 不等於 b
a <> ba 不等於 b
a !== ba 不等於 b （資料型態也不相等）
a > ba 大於 b （數值判斷）
a ＜ ba 小於 b （數值判斷）
a >= ba 大於 b 或是 a 等於 b
a <= ba 小於等於 b 或是 a 等於 b

數字大小比較範例

js
const a = 10, b = 20
+if (a > b) {
+  console.log('a 大於 b')
+} else {
+  console.log('a 不大於 b')
+}

資料型態比較範例

js
const a = 100, b = '100'
+if (a == b) {
+  console.log('a == b')
+} else {
+  console.log('a != b')
+}
+if (a === b) {
+  console.log('a === b')
+} else {
+  console.log('a !== b')
+}

若判斷的是布林值，可以直接用 if(變數) 來判斷

js
const ok = false
+// if (ok) --> if (ok === true)
+if (ok) {
+  console.log('ok')
+}
+// if (!ok) --> if (ok === false)
+if (!ok) {
+  console.log('not ok')
+}

邏輯運算子 ​

邏輯運算子是用來組合多個比較運算子的結果
運算的結果會是布林值 true 或 false

符號說明舉例
a && ba 與 b ，必須符合兩者如果颱風天沒颳風也沒下雨，我就去看電影
a || ba 或 b，符合其中一個A: 晚餐吃什麼？ B: 便當或麵都可以
!a否定、相反A: 你假日想做什麼事？ B: 除了練習程式外，其他都可以

&& 範例

js
const rain = false, wind = true
+if (!rain && !wind) console.log('看電影')
+else                console.log('在家發呆')

|| 範例

js
const dinner = '便當'
+if (dinner === '炸雞' || dinner === '可樂') {
+  console.log('好耶')
+} else {
+  console.log('不好耶')
+}

相反式範例

js
!(a==b)
+!(a>b)
+!(a>=b)
+!(a<b)

三元運算子 ​

如果是 2 選 1 的判斷式，可以運用三元運算子，節省程式碼文字

三元運算子
三元運算子

語法規則為

條件 ? 成立時執行的程式 : 否定時執行的程式

js
const like = confirm('你喜歡 JavaScript 嗎')
+
+// 使用三元運算子前
+if (message) {
+  console.log('喜歡')
+} else {
+  console.log('不喜歡')
+}
+
+// 使用三元運算子後，將結果放在變數
+const message = like ? '喜歡' : '不喜歡'
+console.log(message)
+
+// 使用三元運算子後，直接印出結果
+console.log(like ? '喜歡' : '不喜歡')

多條件式 ​

當條件有多筆需要判斷時，你可以用 () 組合判斷式

js
const coding = confirm('你會寫 code 嗎')
+const game = confirm('你有玩原神嗎')
+const player = confirm('你是可莉玩家嗎')
+if ((game && player) || coding) {
+  console.log('酷欸')
+} else {
+  console.log('加油')
+}

判斷式條件的延伸 ​

前面的判斷式，都是 2 選 1
但很多時候，遇到 3 選 1 、4 選 1 或更多的時候，就需要用到 else if

程式寫法範例

if( 條件一 ) { 符合時執行程式碼 }
else if ( 條件二 ) { 符合時執行程式碼 }
else if ( 條件三 ) { 符合時執行程式碼 }
else { 以上都不符合時執行程式碼 }

成績標準範例

if ( 成績 >= 95 ) { 你的成績是 S 級 }
else if ( 成績 >= 90 ) { 你的成績是 A 級 }
else if ( 成績 >= 80 ) { 你的成績是 B 級 }
else { 你的成績是 C 級 }

年齡分級判斷範例，編寫的時候要注意判斷順序

js
const age = prompt('請輸入年齡')
+
+// 錯誤的判斷寫法，永遠都是普遍級
+if (age >= 0) {
+  document.write('普遍級')
+} else if (age >= 6) {
+  document.write('保護級')
+} else if (age >= 12) {
+  document.write('輔12級')
+} else if (age >= 15) {
+  document.write('輔15級')
+} else if (age >= 18) {
+  document.write('限制級')
+}
+
+// 正確寫法
+if (age >= 18) {
+    document.write('限制級')
+} else if (age >= 15) {
+    document.write('輔15級')
+} else if (age >= 12) {
+    document.write('輔12級')
+} else if (age >= 6) {
+    document.write('保護級')
+} else if (age >= 0) {
+    document.write('普遍級')
+}

練習

使用 prompt() 製作一個選擇題

switch case ​

switch 是另一種判斷式，可以用來判斷多個條件
執行時會將 () 內的變數值，和 case 後面的值做比較

  • 從符合的 case 開始往下執行，直到遇到 break 為止，順序會影響執行
  • 如果沒有符合的 case，就會執行 default 的程式碼

語言判斷，使用 if 寫法

js
if (lang === 'zh-tw') {
+  document.write('台灣中文')
+} else if (lang === 'ja-jp') {
+  document.write('日本日文')
+} else if (lang === 'en-us' || lang === 'en') {
+  document.write('英文')
+} else {
+  document.write('窩不知道')
+}

語言判斷，使用三元運算子寫法

js
const message = 
+  lang === 'zh-tw' ? '台灣中文' : 
+  lang === 'ja-jp' ? '日本日文' :
+  (lang === 'en-us' || lang === 'en') ? '英文' : '窩不知道'
+document.write(message)

語言判斷，使用 switch 寫法

js
switch (lang) {
+  case 'zh-tw':
+    document.write('台灣中文')
+    break
+  case 'jp':
+    document.write('日本')
+  case 'ja-jp':
+    document.write('日本日文')
+    break
+  case 'en-us':
+  case 'en':
+    document.write('英文')
+    break
+  default:
+    document.write('窩不知道')
+    break
+}

年齡分級判斷範例

js
const age = 18
+// 不能寫 switch (age)，只能寫 switch (true)
+// 當寫 switch(age) 時
+// age === (age >= 18)
+// 18 === (18 >= 18)
+// 18 === true
+// false
+switch (true) {
+  case (age >= 18):
+    document.write('限制級')
+    break
+  case (age >= 15):
+    document.write('輔15級')
+    break
+  case (age >= 12):
+    document.write('輔12級')
+    break
+  case (age >= 16):
+    document.write('保護級')
+    break
+  case (age >= 0):
+    document.write('普遍級')
+    break
+}

巢狀判斷式 ​

判斷式裡面還可以再使用判斷式，做更詳細的判斷

js
const weather = 'rain'
+const umbrella = false
+
+if (weather === 'rain') {
+  if (umbrella) {
+    document.write('下雨，有傘，沒事')
+  } else {
+    document.write('下雨，沒傘，有事')
+  }
+} else {
+  document.write('沒下雨，沒差')
+}

短路求值 ​

邏輯運算子也可以用在賦值

  • || 取第一個 Boolean() 判斷為 true 的值
  • && 取第一個 Boolean() 判斷為 false 的值
  • ?? 取第一個不是 null 也不是 undefined 的值

以下為 Boolean() 判斷為 false 的狀況

  • false
  • 0
  • ""
  • null
  • undefined
  • NaN

|| 使用範例

js
const x = null || 0 || undefined || 123 || 'abc' || 'dfgd' || false
+console.log(x)

&& 使用範例

js
const y = 'abc' && 123 && 456 && false && 'def' && undefined
+console.log(y)

?? 使用範例

js
const z = undefined ?? null ?? false ?? 'abc' ?? 123 ?? 456 ?? false ?? 'def'
+console.log(z)

實際應用範例

js
// 使用短路求值前，需要判斷變數是否有值
+let name = prompt('請輸入名字')
+if (name === '' || name === null) {
+  name = '路人'
+}
+
+// 使用短路求值後
+const name = prompt('請輸入名字') || '路人'
+console.log(name)

綜合練習 ​

使用判斷式製作問答題

js
let score = 0
+
+const ans1 = confirm('鳳梨是食物嗎')
+if (ans1) {
+    score += 10
+    alert('答對了')
+} else {
+    alert('答錯了')
+}
+
+const ans2 = confirm('披薩是食物嗎')
+if (ans2) {
+    score += 10
+    alert('答對了')
+} else {
+    alert('答錯了')
+}
+
+const ans3 = confirm('鳳梨披薩是食物嗎')
+if (ans3) {
+    score = 0
+    document.write('你輸了')
+} else {
+    score += 10
+    document.write(`恭喜過關，你得了 ${score} 分`)
+}

練習

製作一個星座判斷器，進入網頁時出現三個輸入視窗，分別是姓名、出生月份和出生日期
輸入完成後跳出訊息，格式為 OOO 你好，你的星座是 OOO 座

作業

自己設計 5 道題目問答題或選擇題，遊戲結束後會顯示得分

+ + + + \ No newline at end of file diff --git a/basic/data-array.html b/basic/data-array.html new file mode 100644 index 00000000..7e8b08ac --- /dev/null +++ b/basic/data-array.html @@ -0,0 +1,160 @@ + + + + + + 資料處理 - 陣列 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

資料處理 - 陣列 ​

一些常用的陣列處理函式

基本處理 ​

  • .forEach(function) 迴圈陣列，每個東西都執行提供的 function，有三個參數可以使用
    • value 現在在執行 function 的東西值
    • index 現在在執行 function 的東西索引
    • array 陣列本身
  • .join(連接文字) 將陣列用連接文字串成文字
  • .push(資料1, 資料2...) 把資料放進陣列後面
  • .unshift(資料1, 資料2...) 把資料放進陣列前面
  • .pop() 移除最後一個並回傳
  • .shift() 移除第一個並回傳
  • .splice(開始位置, 刪除數量, 插入資料1, 插入資料2...) 插入、刪除、取代陣列中的元素
  • .slice(開始位置, 結束位置) 切割陣列，產生新陣列，不會修改原始陣列
  • .concat(陣列) 連接陣列，不會修改原始陣列
  • .reverse() 顛倒陣列

注意

當參數為 function 時，需要注意變數型態

js
const func = (value) => {
+  console.log(value)
+}
+
+// 正確，func 是 function
+array.forEach(func)
+// 錯誤，func() 是 function 的回傳值
+// 會立即執行 func()，並將回傳值放入 setTimeout
+// 但 func() 沒有回傳值，所以會放入 undefined
+array.forEach(func())

.forEach() 範例

js
const numbers = [1, 2, 3, 4, 5]
+
+// .forEach() 使用匿名函式
+numbers.forEach((value, index, array) => {
+  console.log(value, index, array)
+})
+
+// .forEach() 使用已定義的函式
+const each = (value, index, array) => {
+  console.log(value, index, array)
+}
+numbers.forEach(each)

.join() 範例

js
const numbers = [1, 2, 3, 4, 5]
+console.log(numbers.join('-'))  // 1-2-3-4-5

增加、刪除範例

js
const fruits = ['蘋果', '香蕉', '西瓜']
+
+fruits.push('橘子')
+// ['蘋果', '香蕉', '西瓜', '橘子']
+console.log(fruits)
+
+fruits.push('葡萄', '藍莓')
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓']
+console.log(fruits)
+
+const fruits2 = ['草莓', '芭樂', '柳丁']
+fruits.push(...fruits2)
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '柳丁']
+console.log(fruits)
+
+fruits.unshift('榴槤')
+// ['榴槤', '蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '柳丁']
+console.log(fruits)
+
+const lastFruit = fruits.pop()
+console.log(lastFruit)  // 柳丁
+// ['榴槤', '蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(fruits)     
+
+const firstFruit = fruits.shift()
+console.log(firstFruit) // 榴槤
+// ['蘋果', '香蕉', '西瓜', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(fruits)
+
+const otherFruits = ['櫻桃', '火龍果']
+fruits.splice(1, 2, ...otherFruits)
+// ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(otherFruits)
+
+const newFruits = phones.slice(1, 5)
+// newFruits = ['櫻桃', '火龍果', '橘子', '葡萄']
+// fruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(newFruits, fruits)
+
+const concatFruits = fruits.concat(['荔枝', '龍眼'])
+// concatFruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂', '荔枝', '龍眼']
+// fruits = ['蘋果', '櫻桃', '火龍果', '橘子', '葡萄', '藍莓', '草莓', '芭樂']
+console.log(concatFruits, fruits)
+
+fruits.reverse()
+// ['芭樂', '草莓', '藍莓', '葡萄', '橘子', '火龍果', '櫻桃', '蘋果']
+console.log(fruits)

尋找與取代 ​

  • .includes(搜尋內容)
    • 尋找陣列是否有東西符合搜尋內容，回傳 boolean
  • .indexOf(搜尋內容, 從第幾個開始往後)
    • 尋找陣列是否有東西符合搜尋內容，回傳第一個符合的索引，-1 代表找不到 (從前面開始往後找)
    • 第二個參數是選填，預設是 0
  • .lastIndexOf(搜尋內容, 從第幾個開始往前)
    • 尋找陣列是否有東西符合搜尋內容，回傳最後一個符合的索引，-1 代表找不到 (從後面開始往前找)
    • 第二個參數是選填，預設是 array.length - 1
  • .some(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 判斷陣列有沒有東西執行 function 後 return true，回傳 boolean
  • .every(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 判斷陣列所有東西執行 function 後 return true，回傳 boolean
  • .find(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 回傳第一個執行 function 結果為 true 的值
  • .findLast(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 回傳最後一個執行 function 結果為 true 的值
  • .findIndex(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 回傳第一個執行 function 結果為 true 的索引
  • .findLastIndex(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 回傳最後一個執行 function 結果為 true 的索引
  • .filter(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 將所有執行結果為 true 的值產生為新陣列

注意

js
const arr = [{ a: 1 }]
+console.log(arr.includes({ a: 1 }))           // false
+const obj = { b: 2 }
+const arr2 = [obj]
+console.log(arr2.includes(obj))               // true
js
const numbers = [100, 200, 300, 400, 500]
+console.log(numbers.includes(200))            // true
+console.log(numbers.indexOf(100, 2))          // -1
+console.log(numbers.lastIndexOf(100, 2))      // 0
+
+const some = numbers.some((value) => {
+  return value > 300
+})
+console.log(some)                             // true
+
+const every = numbers.every((value) => {
+  return value > 300
+})
+console.log('every', every)                   // false
+
+const find = numbers.find((value) => {
+  return value > 300
+})
+console.log('find', find)                     // 400
+
+const findLast = numbers.findLast((value) => {
+  return value > 300
+})
+console.log('findLast', findLast)             // 500
+
+const findIndex = numbers.findIndex((value) => {
+  return value > 300
+})
+console.log('findIndex', findIndex)           // 3
+
+const findLastIndex = numbers.findLastIndex((value) => {
+  return value > 300
+})
+console.log('findLastIndex', findLastIndex)   // 4
+
+const filter = numbers.filter((value) => {
+  return value > 300
+})
+console.log(filter)                           // [400, 500]

其他 ​

  • .map(function)
    • 迴圈陣列，每個東西都執行提供的 function
    • 將每個東西執行 function 的 return 值變成新的陣列
  • .reduce(function, 初始值)
    • 迴圈陣列，每個東西都執行提供的 function
    • 將每個東西執行 function 的 return 值累加
    • 初始值可不設，預設是陣列第一個值
  • .sort(function)
    • 兩兩比較，a 代表後面的值，b 代表前面的值
    • return 0 順序不變
    • return < 0 a 在前
    • return > 0 b 在前
    • return a - b 正序
    • return b - a 倒序
    • 搭配 a.localeCompare(b) 依照字元編碼排序文字
  • 其他陣列處理套件
js
const numbers1 = [100, 200, 300]
+const numbers1Double = numbers1.map(value => {
+  return value * 2
+})
+console.log(numbers1Double)  // [200, 400, 600]
+
+const numbers2 = [100, 200, 300, 400, 500]
+const numbers2Total = numbers2.reduce((total, value) => {
+  console.log(total, value)
+  return total + value
+})
+console.log(numbers2Total)  //  1500
+
+const numbers3 = [100, 1561, 154613, 1231, 564635, 15641310]
+numbers3.sort((a, b) => {
+  console.log(a, b)
+  return a - b
+})
+console.log(numbers3)       // [100, 1231, 1561, 154613, 564635, 15641310]
+
+const cn = ['零', '一', '二', '三', '四', '五']
+cn.sort((a, b) => a.localeCompare(b))
+console.log(cn)             // ['一', '三', '二', '五', '四', '零']
+
+const en = ['aaa', 'bbb', 'zzz', 'ccc', 'fff', 'ddd']
+en.sort((a, b) => a.localeCompare(b))
+console.log(en)             // ['aaa', 'bbb', 'ccc', 'ddd', 'fff', 'zzz']

綜合練習 ​

練習

將 prompt() 輸入的文字移除前後空白後倒過來後顯示在網頁上

挑戰

將 prompt() 輸入的英文文字大寫轉小寫，小寫轉大寫後顯示在網頁上

+ + + + \ No newline at end of file diff --git a/basic/data-number.html b/basic/data-number.html new file mode 100644 index 00000000..fa1b2301 --- /dev/null +++ b/basic/data-number.html @@ -0,0 +1,52 @@ + + + + + + 資料處理 - 數字 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

資料處理 - 數字 ​

數字處理相關語法

語法 ​

數字處理使用 Math 語法，提供了許多數學運算功能

  • Math.round(數字) 四捨五入到整數
  • Math.ceil(數字) 無條件進位
  • Math.floor(數字) 無條件捨去
  • Math.pow(數字, 次方) 次方
  • Math.sqrt(數字) 平方根
  • Math.sign(數字) 正負數判斷，負數為 -1，0 為 0，正數為 1
  • Math.abs(數字) 絕對值
  • Math.min(數字1, 數字2, 數字3...) 取最小值
  • Math.max(數字1, 數字2, 數字3...) 取最大值
  • Math.random() 從 0 到 1 隨機取小數，包含 0，不包含1
js
Math.round(4.7)   // 5
+
+Math.ceil(4.4)    // 5
+
+Math.floor(4.8)   // 4
+
+Math.pow(8, 2)    // 64
+
+Math.sqrt(64)     // 8
+
+Math.sign(-100)   // -1
+
+Math.abs(-5)      // 5
+
+Math.min(0, 150, 30, 20, -8, -200)  // -200
+
+Math.max(0, 150, 30, 20, -8, -200)  // 150
+
+Math.random()     // 0.123456789

TIP

取陣列的最大值與最小值可以利用 ... 展開運算子

js
const arr = [0, 150, 30, 20, -8, -200]
+Math.min(...arr)  // -200
+Math.max(...arr)  // 150

綜合練習 ​

練習

從 0 到 100 隨機取一個整數

練習

製作隨機數字 function，提供最小整數和最大整數，回傳一個區間內的隨機整數

js
const rand = (min, max) => {
+  // 程式碼...
+}

作業

用上面練習完成的 function 製作威力彩號碼產生器
將隨機出的數字用 document.write() 顯示在網頁上
威力彩規則

  • A 區 1~38 取 6 個數字
  • B 區 1~8 取 1 個數字

練習

請寫一個 function，判斷傳入的數字是不是質數
並使用該 function 列出 1 ~ 100 間的所有質數
質數特性

  • 不能被大於 2 且小於自身平方根的數整除
  • 只能被 1 和自身整除，不能被 2 到 (num-1) 整除

挑戰

文文記性不太好，常常會忘東忘西。他也常忘記提款卡密碼，每次忘記密碼都得帶著身份證、存摺、印章親自到銀行去重設密碼，還得繳交 50 元的手續費，很是麻煩。後來他決定把密碼寫在提款卡上免得忘記，但是這樣一來，萬一提款卡掉了，存款就會被盜領。因此他決定以一個只有他看得懂的方式把密碼寫下來。

他的密碼有 6 位數，所以他寫下了 7 個大寫字母，相鄰的每兩個字母間的「距離」就依序代表密碼中的一位數。所謂「距離」指的是從較「小」的字母要數幾個字母才能數到較「大」字母。字母的大小則是依其順序而定，越後面的字母越「大」。

假設文文所寫的 7 個字母是 POKEMON，那麼密碼的第一位數就是字母 P 和 O 的「距離」，由於 P 就是 O 的下一個字母，因此，從 O 開始只要往下數一個字母就是 P 了，所以密碼的第一位數就是 1。密碼的第二位數則是字母 O 和 K 的「距離」，從 K 開始，往下數 4 個字母 (L, M, N, O) 就到了 O，所以第二位數是 4，以此類推。因此，POKEMON 所代表的密碼便是 146821。

噓！你千萬別把這個密秘告訴別人哦，要不然文文的存款就不保了。

文文可以透過 prompt 輸入文字 輸入文字後就將解密後的密碼回傳

js
const decrypt = (text) => {
+  // ... 在此寫你的程式碼
+}
+
+const input = prompt('輸入文字')
+console.log(decrypt(input))

測試資料

輸入輸出
POKEMON146821
TYPHOON598701

題目修改自 高中生程式解題系統

+ + + + \ No newline at end of file diff --git a/basic/data-string.html b/basic/data-string.html new file mode 100644 index 00000000..40b10f8d --- /dev/null +++ b/basic/data-string.html @@ -0,0 +1,130 @@ + + + + + + 資料處理 - 文字 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

資料處理 - 文字 ​

各種處理文字的語法

基本處理 ​

  • .trim() 移除前後空白
  • .toUpperCase() 轉大寫
  • .toLowerCase() 轉小寫

TIP

JavaScript 可以串連多個語法

js
const text = '  123 Abc Def GHI Jkl   '
+const result = text.trim().toUpperCase().toLowerCase()
+console.log(result)        // '123 abc def ghi jkl'
js
let text = '  123 Abc Def GHI Jkl   '
+console.log(text)           // '  123 Abc Def GHI Jkl   '
+
+text = text.trim()
+console.log(text)           // '123 Abc Def GHI Jkl'
+
+text = text.toUpperCase()
+console.log(text)           // '123 ABC DEF GHI JKL'
+
+text = text.toLowerCase()
+console.log(text)           // '123 abc def ghi jkl'

尋找與取代 ​

  • .includes(尋找文字, 從第幾個字開始)
    • 檢查是否有包含尋找文字，回傳 boolean
    • 第二個參數是選填，預設是 0
  • .indexOf(尋找文字, 從第幾個字開始往後)
    • 尋找陣列是否有東西符合尋找文字，回傳第一個符合的索引，-1 代表找不到
    • 第二個參數是選填，預設是 0
  • .lastIndexOf(尋找文字, 從第幾個字開始往前)
    • 尋找陣列是否有東西符合尋找文字，回傳最後一個符合的索引，-1 代表找不到
    • 第二個參數是選填，預設是 string.length - 1
  • .match(正則表達式Regex)
    • 符合的結果用陣列回傳
    • 沒找到回傳 null
  • .matchAll(正則表達式Regex)
    • 符合的結果用 RegExpStringIterator 回傳
    • 只能用迴圈取資料
  • .replace(搜尋文字或 Regex, 取代文字)
    • 搜尋文字只會取代找到的第一個
    • 正則表達式有設定 g 會取代全部找到的
    • 正則表達式的取代文字可以使用 $1, $2... 或 $<群組名稱> 代表找到的東西

正則表達式語法參考:

注意

  • includes() 只能放文字，不能放正則表達式，如果要用正則表達式的話要用
  • match()、matchAll() 只能放正則表達式，不能放文字
  • replace() 取代文字只會取代找到的第一個，如果要全部取代的話可以用迴圈或正則表達式
js
const curry = '外賣 咖哩拌飯 咖哩烏冬'
+
+const includesCurry1 = text2.includes('咖哩')
+console.log(includesCurry)    // true
+const includesCurry2 = text2.includes('咖哩', 3)
+console.log(includesCurry2)   // false
+
+const indexCurry = text2.indexOf('咖哩')
+console.log(indexCurry)       // 3
+
+const lastIndexCurry = text2.lastIndexOf('咖哩')
+console.log(lastIndexCurry)   // 9
+
+const matchCurry = text2.match(/咖哩/g)
+console.log(matchCurry)       // [ '咖哩', '咖哩' ]
+
+const matchAllCurry = text2.matchAll(/咖哩/g)
+console.log(matchAllCurry)    // RegExpStringIterator
+for (const match of matchAllCurry) {
+  // [ 
+  //   '咖哩',
+  //   index: 3,
+  //   input: '外賣 咖哩拌飯 咖哩烏冬',
+  //   groups: undefined
+  // ]
+  console.log(match)
+}
+
+const replaceCurry1 = text2.replace('咖哩', '三色豆')
+console.log(replaceCurry1)      // '外賣 三色豆拌飯 咖哩烏冬'
+
+const replaceCurry2 = text2.replace(/咖哩/g, '三色豆')
+console.log(replaceCurry2)      // '外賣 三色豆拌飯 三色豆烏冬'
+
+const email = 'aaaa@gmail.com'
+const emailMatch = email.match(/^[0-9a-z]+@[0-9a-z]+\.[0-9a-z]+$/g)
+console.log(emailMatch)         // ['aaaa@gmail.com']
+
+const emailRegexGroup = /^([0-9a-z]+)@([0-9a-z]+)\.([0-9a-z]+)$/g
+const emailMatchAllGroup = email.matchAll(emailRegexGroup)
+for (const match of emailMatchAllGroup) {
+  // 0: "aaaa@gmail.com"
+  // 1: "aaaa"
+  // 2: "gmail"
+  // 3: "com"
+  // groups: undefined
+  // index: 0
+  console.log(match)
+}
+
+const emailReplaceGroup = email.replace(emailRegexGroup, '帳號是 $1，網域是 $2.$3')
+console.log(emailReplaceGroup)  // '帳號是 aaaa，網域是 gmail.com'
+
+const emailRegexGroup2 = /^(?<account>[0-9a-z]+)@(?<domain>[0-9a-z]+)\.(?<tld>[0-9a-z]+)$/g
+const emailMatchAllGroup2 = email.matchAll(emailRegexGroup2)
+for (const match of emailMatchAllGroup2) {
+  // 0: "aaaa@gmail.com"
+  // 1: "aaaa"
+  // 2: "gmail"
+  // 3: "com"
+  // groups: {
+  //   account: "aaa",
+  //   domain: "gmail",
+  //   tld: "com"
+  // }
+  // index: 0
+  console.log(match)
+}
+
+const emailReplaceGroup2 = email.replace(emailRegexGroup2, '帳號是 $<account>，網域是 $<domain>.$<tld>')
+console.log(emailReplaceGroup2)   // '帳號是 aaaa，網域是 gmail.com'

切割 ​

  • .substr(開始位置, 長度)
    • 從開始位置取指定長度的文字
    • 位置可以放負數，代表倒數，-1 是倒數第一個字
    • 長度不寫會直接取到結尾
  • .substring(開始位置, 結束位置)
    • 從開始位置取到結束位置，不包含結束位置
    • 結束位置不寫會直接取到結尾
  • .slice(開始位置, 結束位置)
    • 從開始位置取到結束位置，不包含結束位置
    • 結束位置不寫會直接取到結尾
    • 位置可以放負數
js
const text3 = 'abcdefg'
+
+console.log(text3.substr(3, 1))     // d
+
+console.log(text3.substr(3))        // defg
+
+// text3.substr(-3, 2)
+// text3.length = 7
+// -3 => 7 - 3 => 4
+// text3.substr(4, 2)
+console.log(text3.substr(-3, 2))    // ef
+
+console.log(text3.substring(2, 6))  // cdef
+
+console.log(text3.slice(2, 6))      // cdef
+
+// text3.slice(-4, -2)
+// text3.length = 7
+// -4 => 7 - 4 => 3
+// -2 => 7 - 2 => 5
+// text3.slice(3, 5)
+console.log(text3.slice(-4, -2))    // de

資料型態轉換 ​

綜合練習 ​

練習

將兩個 prompt() 輸入的數字相加顯示在網頁上，如果輸入的不是數字，跳出錯誤訊息

挑戰

製作凱薩密碼 (Caesar Cipher) 加密工具
使用者先輸入英文明文，再輸入數字密鑰
請編寫一個 function 處理資料
將明文和密鑰傳入，回傳處理完後的密文
最後在網頁上顯示出來

範例:

密鑰: 3
+明文: meet me after the toga party
+密文: PHHW PH DIWHU WKH WRJD SDUWB

提示:

  • 字串.charCodeAt(索引) 可取得指定文字的字元數字編號
  • String.fromCharCode(數字) 可將字元編號轉回文字
  • 英文大寫 A-Z 的是連續的，小寫 A-Z 也是，但是英文大小寫編號間有其他字
  • 需考慮密鑰超過 26 的情況
+ + + + \ No newline at end of file diff --git a/basic/function.html b/basic/function.html new file mode 100644 index 00000000..73d2855d --- /dev/null +++ b/basic/function.html @@ -0,0 +1,194 @@ + + + + + + function | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

function ​

function 可以將一段程式碼包裝起來，可以重複使用，也方便維護，寫成物件更可以將程式碼分類。

語法 ​

function 由下列幾個部分組成

  • 名稱 跟變數宣告一樣，給這個 function 一個名稱，建議以程式碼的功能命名
  • () 放傳入 function 的值
  • {} 則是要執行的程式碼
  • 執行 function 時只要使用 名稱 和 () 就能執行
  • 宣告時可以使用 function declartaion 或 function expression 兩種方式

TIP

使用 function expression 宣告時通常會使用 const 以避免 function 被覆寫

js
// 使用 function declartaion 宣告 function
+function GoodMorning () {
+  document.write('早上好，現在我有冰淇淋')
+}
+
+// 使用 function expression 宣告 function
+const GoodMorning = function () {
+  document.write('早上好，現在我有冰淇淋')
+}
+
+// 執行 function
+GoodMorning()

傳入資料 ​

將資料傳入 function 可以讓 function 有更多的彈性

  • 傳入的資料叫做 參數，放在 () 內
  • 參數是 function 內的變數，只能在 function 內使用
  • 參數可以有多個，用 , 隔開
  • 能以 arguments 得到所有傳入參數的陣列

注意

function 處理資料時盡量不要使用外部的變數，只針對傳入的資料做處理
這種不會影響到外部的資料的 function 叫做 Pure Function

js
function GoodMorning (time, item) {
+  console.log(arguments)
+  document.write(`${time}好，現在我有${item}`)
+}
+GoodMorning('早上', '冰淇淋')
+GoodMorning('中午', '桂格超大便當')
+GoodMorning('晚上')

參數可以設定預設值，當參數沒有收到傳入值時，就會使用預設值

js
function GoodMorning (time = '早上', item = '冰淇淋') {
+  document.write(`${time}好，現在我有${item}`)
+}
+GoodMorning('早上', '冰淇淋')
+GoodMorning('中午', '桂格超大便當')
+GoodMorning('晚上')
+GoodMorning(undefined, '炸雞排')

return ​

return 可以將程式處理完畢的結果傳出，讓 function 更有彈性

注意

  • 一個 function 只能有一個 return
  • return 下面的程式碼不會執行
js
function GoodMorning (time = '早上', item = '冰淇淋') {
+  return `${time}好，現在我有${item}`
+  // return 下面的程式碼不會執行
+  console.log(123)
+}
+
+const text = GoodMorning('早上', '冰淇淋')
+console.log(text)
+
+document.write(GoodMorning('中午', '桂格超大便當'))
+alert(GoodMorning('晚上', '雞排珍奶'))

箭頭函式 ​

箭頭函式可以將 function 的宣告寫得比較簡短

js
const GoodMorning = (time = '早上', item = '冰淇淋') => {
+  return `${time}好，現在我有${item}`
+}

TIP

  • 箭頭函式只有一個參數時，可以省略 ()
  • 箭頭函式只有一行時，可以省略 {} 和 return
  • 只有一行簡寫時，如果要回傳物件，要用 () 包起來

簡寫範例

js
// 簡寫前
+const squre = (number) => {
+  return number * number
+}
+
+// 簡寫後
+const squre = number => number * number

物件回傳簡寫範例

js
// 簡寫前
+const getUserData = () => {
+  return { name: 'John', age: 18 }
+}
+
+// 簡寫後
+const getUserData = () => ({ name: 'John', age: 18 })

注意

箭頭函式無法使用 arguments 取得所有傳入的參數

js
const GoodMorning = (time = '早上', item = '冰淇淋') => {
+  // Uncaught ReferenceError: arguments is not defined
+  console.log(arguments)
+}

jsDoc ​

使用 jsDoc 格式編寫的 function 註解會有編輯器提示

js
/**
+ * 早安
+ */
+const GoodMorning = () => {}
+
+/**
+ * 早安
+ * @param time 時間
+ * @param item 物品
+ */
+const GoodMorning = (time, item) => {}
+
+/**
+ * 早安
+ * @param time {string} 時間
+ * @param item {string} 物品
+ */
+const GoodMorning = (time, item) => {}
+
+/**
+ * 早安
+ * @param [time=早上] {string} 時間
+ * @param [item=冰淇淋] {string} 物品
+ */
+const GoodMorning = (time = '早上', item = '冰淇淋') => {}
+
+/**
+ * 早安
+ * @param [time=早上] {string} 時間
+ * @param [item=冰淇淋] {string} 物品
+ * @returns {string} 組合完成的訊息
+ */
+const GoodMorning = (time = '早上', item = '冰淇淋') => {}

綜合練習 ​

練習

編寫一個 function，可以判斷傳入的數字是不是偶數，是的話回傳 true，不是則回傳 false

練習

小明喜歡數數
某天媽媽請他從 n 開始數，下一個數字是 n+1，再下一個數字是 n+2，以此類推
媽媽想知道，小明數了多少個數字後，數過的數字總和會超過 m

請寫一個程式，使用者可以用 prompt 輸入 n 和 m
請將兩個數字傳入 function 計算後將結果回傳

js
const calculate = (n, m) => {
+  // ... 在此寫你的程式碼
+}
+
+const number1 = parseInt(prompt('n'))
+const number2 = parseInt(prompt('m'))
+console.log(calculate(number1, number2))

測試資料

nm輸出
153
5102
100100010

題目修改自 高中生程式解題系統

練習

製作易經數字卦占卜程式
使用者輸入三個數字後，將數字以陣列方式傳進 function
並將處理後的上卦名、下卦名、變爻用陣列回傳

數字卦占卜方式：

  • 輸入三個三位數數字
  • 將前兩個數字各除以 8，最後一個除以 6
  • 如果整除，則餘數即為除數 8 或 6
  • 各數字算完的餘數照八卦的順序選取卦
  • 八卦順序為乾一、兌二、離三、震四、巽五、坎六、艮七、坤八
  • 乾為天、兌為澤、離為火、震為雷、巽為風、坎為水、艮為山、坤為地

範例：

  • 取三個數字 435 692 734
  • 下卦為 435 除以 8 的餘數，為 3，離卦
  • 上卦為 692 除以 8 的餘數，為 4，震卦
  • 變爻為 734 除以 6 的餘數，為 2，第二爻
  • 卜問出來的卦即是離下震上的雷火豐卦，可參考易學網解卦

範例程式碼

js
const gua = (array) => {
+  // ... 在此寫你的程式碼
+}
+
+const number1 = parseInt(prompt('第一個數字'))
+const number2 = parseInt(prompt('第二個數字'))
+const number3 = parseInt(prompt('第三個數字'))
+const numbers = [number1, number2, number3]
+const result = gua(numbers)
+console.log(result[0]) // 輸出 離
+console.log(result[1]) // 輸出 震
+console.log(result[2]) // 輸出 2

練習

請寫一個 function 判斷輸入的文字是不是正著讀和反著讀都一樣的迴文
for、for of 和 for in 可以迴圈文字

js
const isPalindrome = (text) => {
+  // ... 在此寫你的程式碼
+}
+const result = isPalindrome(prompt('輸入文字'))
+console.log(result)

測試資料

文字輸出
abbatrue
abcdfalse
abcbatrue

練習

請寫一個 function 判斷輸入的文字括號是否閉合

js
const isClose = (text) => {
+  // ... 在此寫你的程式碼
+}
+const result = isClose(prompt('輸入文字'))
+console.log(result)

測試資料

文字輸出
(()false
()true
(())true
(()))false
)()()false

遞迴 ​

使用遞迴函式是在函式中呼叫函式自己來重複執行動作

累加範例，求 1 + 2 + 3 + ... + n 的總和

js
// n = 5
+// sum(5) = 5 + sum(5 - 1) = 5 + sum(4) = 5 + 4 + 3 + 2 + 1 = 15
+// sum(4) = 4 + sum(4 - 1) = 4 + sum(3) = 4 + 3 + 2 + 1
+// sum(3) = 3 + sum(3 - 1) = 3 + sum(2) = 3 + 2 + 1
+// sum(2) = 2 + sum(2 - 1) = 2 + sum(1) = 2 + 1
+// sum(1) = 1
+const sum = n => {
+  if (n === 1) {
+    return 1
+  } else {
+    return n + sum(n - 1)
+  }
+  // return n === 1 ? 1 : n + sum(n - 1)
+}
+console.log(sum(5))

計算費氏數列的第 n 個數字
0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233

js
const fibonacci = (n) => {
+  if (n < 2) {
+    return n
+  } else {
+    return fibonacci(n - 1) + fibonacci(n - 2)
+  }
+}
+// n   = 0 1 2 3 4 5 6
+// 數字 = 0 1 1 2 3 5 8
+// fib(3) = fib(3 - 1) + fib(3 - 2) = fib(2) + fib(1) = 1 + 1 = 2
+// fib(2) = fib(2 - 1) + fib(2 - 2) = fib(1) + fib(0) = 1 + 0 = 1
+// fib(1) = 1
+// fib(0) = 0
+console.log(fibonacci(3))

以輾轉相除法求最大公因數

js
const gcd = (a, b) => {
+  if (a % b === 0) {
+    return b
+  } else {
+    return gcd(b, a % b)
+  }
+}
+// gcd(2002, 847) => a % b = 2002 % 847 = 308 => 308 != 0 => gcd(847, 308)
+// gcd(847, 308) => a % b = 847 % 308 = 231 => 231 != 0 => gcd(308, 231)
+// gcd(308, 231) => a % b = 308 % 231 = 77 => 77 != 0 => gcd(231, 77)
+// gcd(231, 77) => a % b = 231 % 77 = 0 => 77
+console.log(gcd(2002, 847))

var 區域 ​

var 其實是以 function 為區域的區域變數

js
var a = 1
+a = 100
+var a = 2
+console.log(a)          // 2
+
+var b = 1
+function func () {
+  var b = 2
+  console.log('in', b)  // 2
+}
+func()
+console.log('out', b)   // 1

提升 ​

var 和 function 有提升的特性，宣告的變數會被提升到最上面，可以先使用再宣告變數

直接使用一個未宣告也未賦值的變數會出現錯誤

js
// Uncaught ReferenceError: text is not defined
+console.log(text)

在宣告 let 和 const 變數前使用變數會出現錯誤

js
// Uncaught ReferenceError: Cannot access 'text' before initialization
+console.log(text)
+const text = 'abc'

var 宣告的變數會被提升到最上面，但是不會賦值，所以會是 undefined

js
console.log(text)   // undefined
+var text = 'abc'

function declartaion 會被提升

js
hi('AAA')
+function hi (name) {
+  console.log('hi, ' + name)
+}

使用 var 的 function expression 會被提升，但是不會賦值，所以會是 undefined

js
// function expression
+console.log(hi)  // undefined
+// Uncaught TypeError: hi2 is not a function
+// hi('BBB')
+var hi = function (name) {
+  console.log('hi, ' + name)
+}
+ + + + \ No newline at end of file diff --git a/basic/intro.html b/basic/intro.html new file mode 100644 index 00000000..78fef295 --- /dev/null +++ b/basic/intro.html @@ -0,0 +1,78 @@ + + + + + + 認識 JavaScript | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

認識 JavaScript ​

JavaScript 是網頁開發者必學的三種語言之一，也是最流行的腳本語言

前端功能 ​

  • 能夠改變 HTML 內容
  • 能夠改變 HTML 屬性
  • 能夠改變 CSS 樣式
  • 能夠偵測使用者對網頁的操作 (滑鼠點擊、鍵盤按鍵等)

改變 HTML 內容範例

改變 HTML 屬性範例

改變 CSS 樣式範例

偵測使用者操作範例

後端功能 ​

  • 能以 Node.js 開發網頁後端
  • 能使用和前端一樣的語言進行開發
  • Node.js 以 Google 的 V8 引擎打造，非常快速
  • 有相當多的套件可以使用，擴充性高

其他功能 ​

缺點 ​

  • 在網頁前端以明碼顯示，安全性不高
  • 規範標準不一，有 CommonJS 和 ECMAScript 等
  • JavaScript 程式結尾可以不加 ;，程式在執行時會自動補上，但是會發生補錯位置的情況
  • + 號不只可以做數學運算，還可以連接文字
  • 以 Node.js 開發的專案套件佔了空間一大半
  • 語法更新頻繁，需要透過 Babel 等工具將新語法轉換成舊瀏覽器支援的語法
  • 弱型別語言，所以才會有 TypeScript 出現

前端的使用方式 ​

網頁上的 JavaScript 程式碼必須要搭配 <script> 標籤使用

  • 可以將程式碼放在標籤裡面
  • 或是將程式碼放在單獨的 .js 檔案裡，用 src 屬性引入
  • <script> 標籤通常位在 <head> 或 <body> 結尾標籤前面
  • 可以使用屬性調整載入時機
    • 預設遇到 <script> 時停止載入網頁，下載執行完後才繼續
    • defer：繼續處理網頁，在背景下載，等網頁解析完後才依擺放順序執行
    • async：繼續處理網頁，在背景下載下載完後立刻執行，用於獨立且不依賴網站運作的程式，例如廣告

注意

載入時機錯誤可能會導致程式無效
例如在使用抓取網站元素的程式碼時，如果程式在網頁內容解析前執行，會找不到元素而出錯
所以通常會將程式碼放在 <body> 結尾標籤前面，確保網頁內容已經解析完畢

html
<html>
+   <head> </head>
+   <body>
+     <!-- 你的 HTML 網頁內容 -->
+     <h1>標題</h1>
+     <p>文字文字文字</p>
+     <!-- 你的 JavaScript 應該放在這裡 -->
+     <script>
+       // alert() 可以跳出一個警告訊息視窗，括號裡面放的是訊息文字
+       alert("Hello World!");
+     </script>
+   </body>
+</html>
+ + + + \ No newline at end of file diff --git a/basic/loop.html b/basic/loop.html new file mode 100644 index 00000000..deafe49a --- /dev/null +++ b/basic/loop.html @@ -0,0 +1,95 @@ + + + + + + 迴圈 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

迴圈 ​

迴圈則可以讓程式重複的執行一樣的動作，達到指定條件才會結束
常用的迴圈有 for 、 while 和 do while 三種
我們需要依照程式的情況來選擇使用不同的迴圈

for ​

for 迴圈通常會用在有固定執行次數的迴圈

迴圈的程式寫法如下面範例

js
for(let i = start; i < max; i = i + 1) {
+	// code
+}
+
+// i=i+1 可以簡寫成 i++
+for(let i = start; i < max; i++) {
+	// code
+}

() 內宣告了迴圈執行的三種動作，以 ; 分隔

  • 宣告變數：宣告了一個變數 i，意思是索引 index
  • 執行條件: 迴圈執行的條件
  • 離開動作：{} 內的程式碼處理完後，會執行這個動作
js
for(let i = 0; i < 10; i++) {
+  document.write(i)
+}

TIP

當回圈內的 {} 只有一行程式碼時，可以省略 {}

js
for(let i = 0; i < 10; i++) document.write(i)

練習

試試看自己寫一個迴圈，輸出這四個數字: 1, 4, 7, 10

挑戰

在網頁上產生一排 52 個顏色漸變的 ★，第一個星的顏色為 rgb(0,0,255)，最後一個 ★ 色碼為 rgb(255,0,0)，綠色值都是0

巢狀 for ​

如果 for 迴圈裡面又有一個 for 迴圈，可以處理更複雜的二維資料

練習

製作一個九九乘法表

  • 一行一行的算式
  • 製作成表格

while ​

這種迴圈結構較簡單，只有一個執行條件
先判斷是否符合條件，符合的話才執行程式碼，執行後後再判斷要不要執行下一次
用於不確定執行次數的迴圈

while 迴圈範例
while 迴圈範例

下面這個範例，使用者輸入 end 才會結束

js
let input = ''
+let count = 0
+while (input !== '123') {
+  input = prompt('123')
+  count++
+}
+document.write(`輸入了${count}次`)

do while ​

do while 迴圈其實就只是把 while 迴圈倒過來寫
先執行程式碼後才判斷要不要執行下一次

js
let input = ''
+let count = 0
+do {
+  input = prompt('123')
+  count++
+} while (input !== '123')

比較 ​

  • for 適合固定次數的迴圈
  • while 適合不確定次數的迴圈
  • do while 適合不確定次數，且至少執行一次的迴圈
while 與 do while 差異
while 與 do while 差異

break 與 continue ​

  • break 打斷迴圈的執行
  • continue 略過一次執行
js
// 當 i 等於 5 時，跳過這次迴圈
+for(let i = 0; i < 10; i++) {
+  if(i === 5) {
+    continue;
+  }
+  document.write(i);
+}
js
for (let i = 1; i < 10; i++) {
+  if (i === 5) break
+  document.write(i + '<br>')
+}

注意

多層迴圈時，break 與 continue 只會影響出現語法的那層迴圈
需要對迴圈命名，才能控制到指定的迴圈

js
for (let i = 1; i <= 5; i++) {
+  for (let j = 1; j <= 5; j++) {
+    // 多層迴圈時 continue 只會影響出現語法的那層迴圈
+    // continue 會直接跳到 j++ 後進下一次 j 迴圈
+    if (i === 2) continue
+    document.write(`${i}x${j}=${i*j}<br>`)
+  }
+}
+
+// 將外層迴圈命名為 loop1
+// 將內層迴圈命名為 loop2
+loop1: for (let i = 1; i <= 5; i++) {
+  loop2: for (let j = 1; j <= 5; j++) {
+    // 指定對 loop1 迴圈 continue
+    // continue 會直接跳到 i++ 後進下一次 i 迴圈
+    if (i === 2) continue loop1
+    console.log(`${i}, ${j}`)
+  }
+}

綜合練習 ​

練習

試試看自己寫一個猜數字遊戲，並加入太大、太小等提示訊息

練習

一球從 100 公尺高度自由落下，每次落地後反跳回原高度的一半再落下，請問

  • 第 10 次落地時，共經過多少公尺？
  • 第 10 次反彈多高？

練習

印星星塔，結構如下圖
使用者能用 prompt() 輸入星星塔層數

★
+★★
+★★★
+★★★★
+★★★★★

練習

印星星塔，結構如下圖
使用者能用 prompt() 輸入星星塔層數

☆☆☆☆★☆☆☆☆
+☆☆☆★★★☆☆☆
+☆☆★★★★★☆☆
+☆★★★★★★★☆
+★★★★★★★★★

練習

有四個數字，分別為 1、2、3、4
請使用這四個數字組成數字不重複的三位數

1 2 3
+1 2 4
+1 3 2
+1 3 4
+1 4 2
+1 4 3
+...

練習

使用者能用 prompt() 輸入層數
印出下面格式的數字圖案

1
+2 4
+3 6 9
+4 8 12 16
+5 10 15 20 25
+6 12 18 24 30 36
+7 14 21 28 35 42 49
+8 16 24 32 40 48 56 64
+9 18 27 36 45 54 63 72 81

作業

使用者可以輸入西元年、月、日，三個 prompt()
顯示使用者輸入的是該年的第幾天

  • 以 3/5 為例，將前兩個月的天數加起來，再加上 5 天即可
  • 需考慮閏年 +1
  • 某些月份的天數是 30，某些月份的天數是 31
  • parseInt(變數或是數字的文字) 可以把文字轉數字

挑戰

使用者能用 prompt() 輸入一個數字
印出到該數字的費氏數列

js
// 如果輸入 22
+0 1 1 2 3 5 8 13 21
+ + + + \ No newline at end of file diff --git a/basic/operator.html b/basic/operator.html new file mode 100644 index 00000000..f2b37607 --- /dev/null +++ b/basic/operator.html @@ -0,0 +1,45 @@ + + + + + + 運算子 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

運算子 ​

運算子用來做加減乘除等運算 需要特別注意 + 除了做數學運算外，還可以做文字連接

數學運算子 ​

這個表列出了常見的數學運算子
跟數學的四則運算一樣，先乘除後加減，先做的用 () 包起來

符號說明範例
+加號25 + 5 = 30
-減號25 - 5 = 20
*乘號10 * 20 = 200
/除號20 / 2 = 10
%餘數56 % 3 = 2

+ 和 - 還可以減寫成 ++ 和 --，代表加一和減一，稱為 遞增 和 遞減
不過會根據變數和運算子的位置而有不同的結果

符號範例結果
a++let a = 0, b = 10; a = b++;a = 10; b = 11
++alet a = 0, b = 10; a = ++b;a = 11; b = 11
a--let a = 0, b = 10; a = b--;a = 10; b = 9
--alet a = 0, b = 10; a = --b;a = 9; b = 9

a = b++ 代表先執行 a = b，才執行 b = b + 1
a = ++b 代表先執行 b = b + 1，才執行 a=b
b-- 和 --b 也是一樣的運作方式

js
let x = 100
+
+// 這行將數字加 10 後，沒有做任何事
+x + 10
+
+// 這行將數字加 10 後，將結果存回 x
+x = x + 10
+
+console.log(x)  // 110

指派運算子 ​

這個表列出了常見的指派運算子，用來簡化 = 的寫法

符號範例原寫法
+=x += 2x = x + 2
-=x -= 2x = x - 2
*=x *= 2x = x * 2
/=x /= 2x = x / 2
%=x %= 2x = x % 2
js
let x = 100
+x %= 7
+console.log("100 除以 7 的餘數是 " + x)   // 2

文字連接 ​

在 JavaScript 裡的 + 還有文字連接的功能

+ 號運算子
+ 號運算子

TIP

` 引號裡面的文字不只可以換行，還可以搭配 ${} 插入變數
就可以避免一堆 + 和單雙引號造成閱讀困難

js
const firstName = "小明"
+const lastName = "王"
+
+// 使用 + 將文字連接起來
+const fullName = firstName + lastName
+
+// 使用 + 連接文字及變數
+const hello1 = "你好，我的名字是" + fullName + "請多指教"
+
+// 使用模板語法在文字中插入變數
+const Hello2 = `你好，我的名字是${fullName}請多指教`
+ + + + \ No newline at end of file diff --git a/basic/timer.html b/basic/timer.html new file mode 100644 index 00000000..61ca06de --- /dev/null +++ b/basic/timer.html @@ -0,0 +1,54 @@ + + + + + + 計時器 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

計時器 ​

計時器可在一段時間後執行 function

一般計時器 ​

setTimeout 延遲一段時間後執行一次 function 內的程式碼

  • 語法為 setTimeout(function, 延遲)
  • 延遲單位為毫秒，1000 代表 1 秒
  • 使用 clearTimeout() 取消

注意

在使用已定義好的 function 時，需要注意變數型態

js
const msg = () => {
+  alert('經過 5 秒囉')
+}
+
+// 正確，msg 是 function
+setTimeout(msg, 5000)
+
+// 錯誤，msg() 是 function 的回傳值
+// 會立即執行 msg()，並將回傳值放入 setTimeout
+// 但 msg() 沒有回傳值，所以會放入 undefined
+setTimeout(msg(), 5000)

使用已定義好的 function

js
const msg = () => {
+  alert('經過 5 秒囉')
+}
+setTimeout(msg, 5000)

使用匿名函式

js
setTimeout(()=> {
+  alert('經過 5 秒囉')
+}, 5000)

清除計時器範例

js
const delay = setTimeout(() => {
+  alert('經過 5 秒囉')
+}, 5000)
+clearTimeout(delay)

Tip

在寫秒數時要特別注意，一些特別的數字可以用 const 定義
讓讀程式碼的人更容易了解你在寫什麼

js
// 86400000 代表什麼？
+setTimeout(() => {}, 86400000)
+
+// 86400000 是一天的毫秒數
+const MILLISECONDS_IN_A_DAY = 86400000
+setTimeout(() => {}, MILLISECONDS_IN_A_DAY)

重複計時器 ​

setInterval() 可以每隔一段時間執行指定的程式碼
基本語法和 setTimeout() 一樣，使用 clearInterval() 清除

js
const timer = setInterval(() => {
+  console.log('Hi')
+}, 1000)
+
+setTimeout(() => {
+  clearInterval(timer)
+}, 5000)

綜合練習 ​

練習

使用者輸入毫秒數，經過該時間後在網頁上顯示 時間到

練習

製作計時器，從 10 開始倒數到 0，每秒在網頁上印出一個數字

+ + + + \ No newline at end of file diff --git a/basic/variable.html b/basic/variable.html new file mode 100644 index 00000000..ff655f18 --- /dev/null +++ b/basic/variable.html @@ -0,0 +1,89 @@ + + + + + + 變數 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

變數 ​

程式就像數學的代數一樣，需要給每個資料一個名字
不管是哪一種程式語言，都會需要用 變數 給資料一個名字

變數觀念 ​

在一元一次方程式或一元二次方程式等代數中，會使用字母儲存數值
而在程式裡，我們會給資料一個名字，這些代數被稱為 變數

數學代數範例

若 x＝2，則 5 × x＝ ?

轉換為程式後

js
const x = 5
+const result = x * 5
+console.log(result)

變數命名 ​

基本變數命名規則

  • 必須以字母開頭
  • 也能以 $ 和 _ 等特殊符號開頭，（不推薦，除非有特殊用途）
  • 名稱對大小寫敏感（y 和 Y 是不同的變數）
  • 可以用英文以外的文字 （不推薦，可能會有文字編碼問題，且有些程式語言不支援這種做法）
  • 建議使用有意義的文字當作名稱
  • 建議使用 駝峰式大小寫 當命名規則
  • 程式語言保留字無法當作變數名稱

變數命名規範參考:

變數保留字，圖片取自 SoloLearn

變數宣告 ​

在 JavaScript 裡，有三種變數宣告方式
變數宣告後，用 = 賦值或修改值

  • var 是全域變數，如果重複宣告的話舊的會被蓋掉
  • let 是區塊變數，僅作用在 {} 包起來的區塊，同一個 {} 內重複宣告會錯誤
  • const 是常數，規則和 let 一樣，宣告後就不能再修改值

注意

不宣告變數會變成全域變數，在瀏覽器會被綁在 window 上，不推薦這樣使用

js
a = 1
+console.log(a)          // 1
+console.log(window.a)   // 1

var 變數宣告範例

js
var a = 1
+console.log(a)          // 1
+// 需要改值時不需要重複宣告，用 = 修改
+a = 2
+console.log(a)          // 2
+var a = 3
+console.log(a)          // 3

let 變數宣告範例

js
// let 區域變數
+// 區域內不能重複宣告，{} 為一區
+let b = 1
+console.log(b)          // 1
+// 重複宣告會出現錯誤
+// Uncaught SyntaxError: Identifier 'a' has already been declared
+// let b = 2
+b = 2
+console.log(b)          // 2

const 常數宣告範例

js
// const 區域常數
+// 區域內不能重複宣告，{} 為一區
+// 宣告後不能修改
+const c = 1
+console.log(c)
+// 修改會出現錯誤
+// Uncaught TypeError: Assignment to constant variable.
+// c = 2

let 與 const 以 {} 為一個區域
在存取變數時，會先找目前區域的變數，找不到再往上找全域變數

js
let a = 1
+{
+  let a = 2
+  console.log(a)        // 2
+}
+console.log(a)          // 1
+
+let b = 1
+{
+  b = 2
+  console.log(b)        // 2
+}
+console.log(b)          // 2

資料型態 ​

在程式語言裡的值都有資料型態，最基本的型態有下面幾種

  • number 或 int 代表整數數字
  • float 代表小數，或稱作浮點
  • string 或 char 代表文字字串，需要使用單引號 ' 、雙引號 " 或 ` 將文字包起來
  • boolean 或簡稱 bool，代表布林值，true 和 false
  • null 空值
  • undefined 未定義
  • NaN 代表非數字 Not a Number
  • array 陣列
  • object 物件

注意

' 和 " 內的文字不能換行，只有 ` 可以

js
// 文字需用引號包起來
+const str1 = "文字"
+const str2 = '文字'
+const str3 = `文字`
+// ` 內的文字可以換行
+const str4 = `aa
+aa`
+
+// 數字
+const int = 123
+const float = 123.456
+
+// 布林值
+const bool = true
+
+// 使用 typeof 查看變數的資料型態
+console.log(typeof int)
資料型態分別
資料型態分別
+ + + + \ No newline at end of file diff --git a/database/api-advanced.html b/database/api-advanced.html new file mode 100644 index 00000000..89dd16e8 --- /dev/null +++ b/database/api-advanced.html @@ -0,0 +1,172 @@ + + + + + + 進階 API | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

進階 API ​

檔案上傳、登入驗證

登入 ​

使用 JSON Web Token (JWT) 製作登入功能

JWT 介紹 ​

近年瀏覽器對第三方 Cookie 驗證規定日趨嚴格，所以符合 RESTful 架構的 JWT 漸漸興起
JWT 是一組 Base64 字串，透過 . 分成三個部分

bash
# header，JWT 的加密演算法
+eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
+# payload，JWT 包含的資料與簽發時間、到期時間
+eyJfaWQiOiI2MDI3ZTE4NjEzODk2ZjIxYzhlYjU2NzYiLCJpYXQiOjE2MTMyMzAxODcsImV4cCI6MTYxMzgzNDk4N30
+# signature/encryption data，用於驗證資料
+rTnKU0l0w-P3xshZ43ZpWfzTSUuEXQoUQ7O3BYSYOsQ

注意

千萬不要將隱私資料存在 JWT，例如使用者的密碼，因為 JWT 的 payload 可以還原原始資料
由於 JWT 簽發後就無法撤銷，所以必須將簽發出去的 JWT 存入資料庫

安裝套件 ​

npm install jsonwebtoken
+npm install passport
+npm install passport-jwt
+npm install passport-local

設定 passport.js ​

建立一個 passport.js，使用驗證策略編寫自己的驗證方式

js
import passport from 'passport'
+import passportJWT from 'passport-jwt'
+import bcrypt from 'bcrypt'
+import { Strategy as LocalStrategy } from 'passport-local'
+import users from './models/users'
+
+const JWTStrategy = passportJWT.Strategy
+const ExtractJwt = passportJWT.ExtractJwt
+
+// 新增一個名為 jwt 的驗證方式，使用 JWT 策略
+passport.use('jwt', new JWTStrategy({
+  // 從 headers 提取 Bearer Token
+  jwtFromRequest: ExtractJwt.fromAuthHeaderAsBearerToken(),
+  // JWT 驗證 secret
+  secretOrKey: process.env.JWT_SECRET
+}, (jwtPayload, done) => {
+  // jwtPayload 為 jwt 解碼後的資料
+  // done 標記驗證完成，done(錯誤, user的資料, authenticate的info)
+  users.findOne({ _id: jwtPayload._id }, (err, user) => {
+    if (err) {
+      return done(err, false)
+    }
+    if (user) {
+      return done(null, user)
+    } else {
+      return done(null, false)
+    }
+  })
+}))
+
+// LocalStrategy 也可以自訂欄位名稱
+// new LocalStrategy({
+//   usernameField: 帳號資料欄位名稱,
+//   passwordField: 密碼資料欄位名稱,
+// }, (username, password, done) => {})
+passport.use('login', new LocalStrategy(async (username, password, done) => {
+  const user = await users.findOne({ username })
+  if (!user) {
+    return done(null, false, { message: 'User not found' })
+  }
+  if (!bcrypt.compareSync(password, user.password)) {
+    return done(null, false, { message: 'Wrong password' })
+  }
+  return done(null, user, { message: 'Logged in successfully' })
+}))

在 index.js 初始化 passport.js

js
import passport from 'passport'
+import './passport.js'
+
+app.use(passport.initialize())

就能在路由使用驗證方式

js
import passport from 'passport'
+router.post('/login', passport.authenticate('login', { session: false }), login)

編寫 middleware ​

express 的 middleware 可以當作處理資料的層層關卡

由於 passport 自訂驗證錯誤訊息需要寫成 callback
為避免程式碼混亂所以編寫 middleware/auth.js 統一呼叫

js
import passport from 'passport'
+
+export default (strategy) => {
+  return (req, res, next) => {
+    // 這裡的 user 和 info 是從 done 傳入的資料
+    passport.authenticate(strategy, { session: false }, (err, user, info) => {
+      if (err || !user) {
+        return res.status(401).send({ success: false, message: info.message })
+      }
+      req.user = user
+      next()
+    })(req, res, next)
+  }
+}

最後改寫路由引用

js
// 引用 middleware
+import auth from '../middleware/auth.js'
+
+// 請求先進去登入驗證的 middleware 再繼續處理資料
+router.post('/login', auth('login'), login)

登入 ​

編寫使用者的 controller

js
export const login = async (req, res) => {
+  if (!req.headers['content-type'] || !req.headers['content-type'].includes('application/json')) {
+    res.status(400).send({ success: false, message: '資料格式不符' })
+    return
+  }
+
+  const token = jwt.sign({ _id: req.user._id.toString() }, process.env.JWT_SECRET, { expiresIn: '7 days' })
+  req.user.tokens.push(token)
+  await req.user.save()
+  res.status(200).send({ success: true, message: '', token })
+}

登出 ​

js
export const logout = async (req, res) => {
+  try {
+    // 將這次請求的 JWT 從使用者資料移除
+    req.user.tokens = req.user.tokens.filter(token => token !== req.token)
+    await req.user.save()
+    res.status(200).send({ success: true, message: '' })
+  } catch (error) {
+    res.status(500).send({ success: false, message: '伺服器錯誤' })
+  }
+}

檔案上傳 ​

將檔案上傳至免費空間 Cloudinary

安裝套件 ​

js
npm install multer
+npm install cloudinary
+npm install multer-storage-cloudinary

編寫 middleware ​

將上傳檔案寫成 middleware
和登入一樣在需要上傳檔案的路由引用，就能接收檔案

js
import multer from 'multer'
+import path from 'path'
+import 'dotenv/config'
+import { v2 as cloudinary} from 'cloudinary'
+import { CloudinaryStorage } from 'multer-storage-cloudinary'
+
+// cloudinary 設定
+cloudinary.config({
+  cloud_name: process.env.CLOUDINARY_NAME,
+  api_key: process.env.CLOUDINARY_KEY,
+  api_secret: process.env.CLOUDINARY_SECRET
+})
+
+// multer 套件設定
+const upload = multer({
+  // 指定上傳的檔案儲存到 cloudinary
+  storage: new CloudinaryStorage({
+    cloudinary
+  }),
+  // 過濾檔案類型
+  fileFilter (req, file, callback) {
+    if (!file.mimetype.includes('image')) {
+      callback(new multer.MulterError('LIMIT_FORMAT'), false)
+    } else {
+      callback(null, true)
+    }
+  },
+  // 限制檔案大小為 1MB
+  limits: {
+    fileSize: 1024 * 1024
+  }
+})
+
+export default async (req, res, next) => {
+  upload.single('image')(req, res, async error => {
+    if (error instanceof multer.MulterError) {
+      // 如果是 multer 的上傳錯誤
+      let message = ''
+      if (error.code === 'LIMIT_FILE_SIZE') {
+        message = '檔案太大'
+      } else if (error.code === 'LIMIT_FORMAT') {
+        message = '格式不符'
+      } else {
+        message = '上傳錯誤'
+      }
+      res.status(400).send({ success: false, message })
+    } else if (error) {
+      // 其他錯誤
+      res.status(500).send({ success: false, message: '伺服器錯誤' })
+    } else {
+      next()
+    }
+  })
+}

購物網 ​

以 Vue、Node.js 與 MongoDB 實作一個線上購物網站

  • 能註冊帳號、登入、登出
  • 有購物車功能
  • 有管理後台能上下架商品
+ + + + \ No newline at end of file diff --git a/database/api-basic.html b/database/api-basic.html new file mode 100644 index 00000000..1d1fb768 --- /dev/null +++ b/database/api-basic.html @@ -0,0 +1,522 @@ + + + + + + 資料庫 API | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

資料庫 API ​

製作能增改刪查資料庫的網頁 API，並熟悉 export 和 import

MVC 架構圖 ​

使用 MVC 架構編寫 API，將程式的結構更加直覺化，也將修改與功能擴充簡化，提高可用性

Model-View-Controller 是一種設計模式，作法是將程式分割成以下三個元件

  • Model 模型，有存取資料庫的權利
  • View 視圖，資料顯示
  • Controller 控制器，控制程式流程，對事件做出回應，包括使用者行為和資料改變

前置作業 ​

安裝套件 ​

js
// MongoDB 操作套件
+npm install mongoose
+// 驗證
+npm install validator
+// 網頁伺服器
+npm install express
+// express 允許跨域請求
+npm install cors
+// 讀取環境設定檔
+npm install dotenv
+// 加密套件
+npm install bcrypt

檔案結構 ​

依照 MVC 的功能區分資料夾，資料夾內再依資料區分檔案

.
+├── controllers
+│   └── users.js
+├── models
+│   └── users.js
+├── routes
+│   └── users.js
+├── package.json
+├── index.js (執行主體)
+└── db.js (資料庫連接)

編寫 API ​

主體 ​

建立 index.js 內容為 API 主體

js
import express from 'express'
+// 跨域套件
+import cors from 'cors'
+// users 資料的路由
+import userRoutes from './routes/users.js'
+// 資料庫連線檔
+import './db.js'
+
+const app = express()
+
+// 解析傳入的資料
+app.use(express.json())
+
+// 設定跨域套件
+app.use(cors({
+  // origin 為請求來源網域, callback 為是否允許的回應
+  origin (origin, callback) {
+    // 允許任何來源網域的請求
+    callback(null, true)
+    // 若要拒絕請求則是
+    // callback(new Error('cors error'), false)
+  },
+  // 允許跨域認證
+  credentials: true
+}))
+
+// 將路由分類，所有進到 /users 路徑的請求使用 users 的路由
+app.use('/users', userRoutes)
+
+// 在 3000 port 啟用
+app.listen(3000, () => {
+  console.log('網頁伺服器已啟動')
+  console.log('http://localhost:3000')
+})

設定資料庫 ​

建立 db.js，內容為資料庫設定

js
// 引用 mongoose
+import mongoose from 'mongoose'
+// 引用 dotenv
+import 'dotenv/config'
+
+const Schema = mongoose.Schema
+
+// 連接資料庫
+mongoose.connect(process.env.dbUrl, { useNewUrlParser: true, useUnifiedTopology: true })
+
+// 引用插件
+mongoose.plugin(idPlugin)

Model ​

models 資料夾內各種資料一個 js 檔，內容為資料表綱要
使用 Mongoose 時必須要建立資料庫綱要 Schema
Mongoose 的資料庫綱要除了能保持資料格式一致，也可以做資料驗證

js
const Schema = mongoose.Schema
+
+const cartSchema = new Schema({
+  p_id: {
+    // Aggregation 聚合
+    // 使用 products 資料表的 _id 為欄位值
+    // 查詢時可以一起帶出對應的商品資料
+    type: mongoose.ObjectId,
+    ref: 'products'
+  },
+  quantity: {
+    type: Number
+  }
+})
+
+// 編寫資料表綱要
+const userSchema = new Schema(
+  {
+    // 欄位名稱
+    name: { 
+      // 資料類型是文字
+      type: String,
+      // 最小長度，自訂錯誤訊息 
+      minlength: [4, '使用者名稱最小 4 個字'],
+      // 最大長度，自訂錯誤訊息
+      maxlength: [12, '使用者名稱最大 12 個字'],
+      // 必填欄位，自訂錯誤訊息
+      required: [true, '使用者名稱必填'],
+      // 避免重複
+      unique: true
+    },
+    password: { 
+      type: String, 
+      required: [true, '密碼必填'],
+    },
+    age: {
+      type: Number,
+      // 最小值，自訂錯誤訊息
+      min: [18, '必須大於 18 歲'],
+      // 最大值，自訂錯誤訊息
+      max: [99, '請輸入有效年齡'],
+      required: [true, '年齡必填'],
+    },
+    email: {
+      type: String,
+      required: [true, '信箱必填'],
+      unique: '信箱已使用',
+      // 自訂驗證規則
+      validate: {
+        // 驗證 function
+        validator (value) {
+          return validator.isEmail(value)
+        },
+        // 錯誤訊息
+        message: '信箱格式錯誤'
+      }
+    },
+    cart: {
+      // Composition 組合
+      // 訂單為陣列，每筆資料使用 orderSchema 定義的結構
+      type: [cartSchema]
+    }
+  }, 
+  {
+    // 不要紀錄資料修改次數
+    versionKey: false
+  }
+)
+
+// 資建立 Model
+// mongoose.model('資料表名稱', Schema)
+// 資料表名稱必須為複數，結尾加 s
+const users = mongoose.model('users', usersSchema)
+
+// 匯出 Model
+export default users

Route ​

routes 資料夾內各種資料一個 js 檔，內容為路由設定

js
import express from 'express'
+// 從 controller 引用 function
+import { createUser, getUsers, updateUser, deleteUser } from '../controllers/users.js'
+
+// 建立 router
+const router = express.Router()
+
+// 這裡最後的路徑會是 /users，進來這裡的 POST 請求會執行 createUser
+router.post('/', createUser)
+
+// 這裡最後的路徑會是 /users，進來這裡的 GET 請求會執行 getUsers
+router.get('/', getUsers)
+
+// 這裡最後的路徑會是 /users/:id，進來這裡的 PATCH 請求會執行 updateUser
+router.patch('/:id', updateUser)
+
+// 這裡最後的路徑會是 /users/:id，進來這裡的 DELETE 請求會執行 deleteUser
+router.delete('/:id', deleteUser)
+
+// 訂單相關
+router.post('/:id/orders', createUserOrder)
+router.get('/:id/orders', getUserOrder)
+router.patch('/:id/orders/:oid/:pid', updateUserOrder)
+router.delete('/:id/orders', deleteUserOrder)
+
+// 匯出路由設定
+export default router

Controller ​

controller 資料夾內各種資料一個 js 檔，內容為處理資料的 function

js
// 引用使用者資料庫
+import users from '../models/users.js'
+
+// 匯出各 function
+export const createUser = () => {}
+export const createUserOrder = () = {}
+export const getUsers = () => {}
+export const getUserOrder = () => {}
+export const updateUser = () => {}
+export const updateUserOrder = () => {}
+export const deleteUser = () => {}
+export const deleteUserOrder = () => {}

新增 ​

新增使用者資料

js
// req 代表進來的請求
+// res 代表回傳的請求
+export const createUser = async (req, res) => {
+  // 拒絕不是 json 的資料格式
+  if (!req.headers['content-type'].includes('application/json')) {
+    // 回傳錯誤狀態碼
+    res.status(400)
+    res.send({ success: false, message: '格式不符' })
+    return
+  }
+
+  // 新增資料
+  try {
+    const result = await users.create(
+      {
+        name: req.body.name,
+        // 使用 bcrypt 加密，加鹽 10 次
+        password: bcrypt.hashSync(req.body.password, 10),
+        age: req.body.age,
+        email: req.body.email
+      }
+    )
+    res.status(200)
+    res.send({
+      success: true,
+      message: '',
+      id: result.id,
+      name: result.name,
+      age: result.age,
+      email: result.email
+    })
+  } catch (error) {
+    // 資料格式錯誤
+    if (error.name === 'ValidationError') {
+      // 錯誤的訊息的 key 值為欄位名稱，不固定
+      // 所以用 Object.keys(err.errors)[0] 取得第一個 key 值
+      const key = Object.keys(error.errors)[0]
+      const message = error.errors[key].message
+      res.status(400)
+      res.send({ success: false, message })
+    } else if (error.name === 'MongoError' && error.code === 11000) {
+      res.status(400).send({ success: false, message: '帳號已使用' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+      console.log(error)
+    }
+  }
+}

新增訂單

js
export const createUserOrder = async (req, res) => {
+  // 拒絕不是 json 的資料格式
+  if (!req.headers['content-type'].includes('application/json')) {
+    // 回傳錯誤狀態碼
+    res.status(400)
+    res.send({ success: false, message: '格式不符' })
+    return
+  }
+
+  // 新增資料
+  try {
+    const result = await users.findByIdAndUpdate(req.params.id,
+      {
+        // 新增到使用者的訂單陣列
+        $push: {
+          orders: {
+            date: new Date(),
+            paid: false,
+            products: req.body.products
+          }
+        }
+      }, {new: true}
+    )
+    res.status(200)
+    res.send({ success: true, message: '' })
+  } catch (error) {
+    // 資料格式錯誤
+    if (error.name === 'ValidationError') {
+      const key = Object.keys(error.errors)[0]
+      const message = error.errors[key].message
+      res.status(400)
+      res.send({ success: false, message })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+      console.log(error)
+    }
+  }
+}

查詢 ​

查詢所有使用者

js
export const getUsers = async (req, res) => {
+  try {
+    const result = await users.find({}, '-password')
+    res.status(200)
+    res.send({ success: true, message: '', users: result })
+  } catch (error) {
+    console.log(error.message)
+    res.status(500)
+    res.send({ success: false, message: '伺服器發生錯誤' })
+  }
+}

以 ID 查詢單個使用者

js
export const getUser = async (req, res) => {
+  try {
+    // 使用 id 尋找資料，只取 account，去掉 id
+    const result = await users.findById(req.params.id)
+    res.status(200)
+    res.send({
+      success: true,
+      message: '',
+      id: result.id,
+      name: result.name,
+      age: result.age,
+      email: result.email
+    })
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+    console.log(error)
+  }
+}

聚合查詢使用者訂單，一起帶出商品資料

js
export const getUserOrder = async (req, res) => {
+  try {
+    // 使用 id 尋找資料，只取 account，去掉 id
+    const result = await users.findById(req.params.id, 'orders').populate('orders.products.p_id')
+    res.status(200)
+    res.send({
+      success: true,
+      message: '',
+      id: result.id,
+      name: result.name,
+      age: result.age,
+      email: result.email
+    })
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+    console.log(error)
+  }
+}

修改 ​

修改使用者資料

js
export const updateUser = async (req, res) => {
+  // 拒絕不是 json 的資料格式
+  if (!req.headers['content-type'].includes('application/json')) {
+    // 回傳錯誤狀態碼
+    res.status(400)
+    res.send({ success: false, message: '格式不符' })
+    return
+  }
+
+  try {
+    // findByIdAndUpdate 預設回來的 result 是更新前的資料
+    // 加上 new true 後可以回來新的資料
+    const result = await users.findByIdAndUpdate(req.params.id, req.body, { new: true })
+    delete result.password
+    res.status(200)
+    res.send({
+      success: true,
+      message: '',
+      id: result.id,
+      name: result.name,
+      account: result.account,
+      email: result.email
+    })
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+  }
+}

修改訂單內商品數量

js
export const updateUserOrder = async (req, res) => { // 拒絕不是 json 的資料格式
+  if (!req.headers['content-type'].includes('application/json')) {
+    // 回傳錯誤狀態碼
+    res.status(400)
+    res.send({ success: false, message: '格式不符' })
+    return
+  }
+
+  try {
+    // findByIdAndUpdate 預設回來的 result 是更新前的資料
+    // 加上 new true 後可以回來新的資料
+    const result = await users.findOneAndUpdate(
+      {'orders._id': req.params.oid, 'orders.products.p_id': req.params.pid},
+      {
+        $set: {
+          'orders.0.products.0.quantity': req.body.quantity
+        }
+      },
+      {new: true}
+    )
+    delete result.password
+    res.status(200)
+    res.send({ success: true, message: '' })
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+  }
+}

刪除 ​

刪除使用者

js
export const deleteUser = async (req, res) => {
+  try {
+    await users.findByIdAndDelete(req.params.id)
+    if (result === null) {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(200)
+      res.send({ success: true, message: '' })
+    }
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+  }
+}

以訂單 ID 刪除訂單

js
export const deleteUserOrder = async (req, res) => {
+  try {
+    await users.findOneAndUpdate(
+      // 以訂單 ID 查詢使用者資料
+      {'orders._id': req.params.id},
+      {
+        // 刪除一個陣列元素
+        $pull: {
+          // 陣列欄位名稱
+          orders: {
+            // 刪除條件
+            _id:  req.params.id
+          }
+        }
+      },
+      {new: true}
+    )
+    if (result === null) {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(200)
+      res.send({ success: true, message: '' })
+    }
+  } catch (error) {
+    // 若 ID 格式不是 mongodb 格式
+    if (error.name === 'CastError') {
+      res.status(404)
+      res.send({ success: false, message: '找不到資料' })
+    } else {
+      res.status(500)
+      res.send({ success: false, message: '伺服器發生錯誤' })
+    }
+  }
+}

作業

規劃並建立一個商品庫存 RESTful API

  • 資料欄位

    • name 商品名稱
    • price 商品價格
    • description 商品說明
    • count 商品庫存量

  • 新增

    • 請求方式為 POST
    • 路徑為 /products
    • 只接受 application/json 格式
      js
      {
+  "name": "",
+  "price": 0,
+  "description": "",
+  "count": 0
+}
    • 回傳相應狀態碼、是否成功、失敗訊息及商品資料，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+  "result": {
+    "id": "",
+    "name": "",
+    "price": 0,
+    "description": "",
+    "count": 0
+  }
+}

  • 修改

    • 請求方式為 PATCH
    • 能以 ID 修改庫存量、名稱、說明及價格
    • 路徑為 /products/id，以 param 判斷要修改的項目
    • 只接受 application/json 格式，JSON 的欄位是要修改的欄位，值是要修改的資料
      js
      {
+  "name": ""
+}
    • 回傳相應狀態碼、是否成功、失敗訊息，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+}

  • 刪除

    • 請求方式為 DELETE
    • 路徑為 /products/id
    • 只接受 application/json 格式，id 是商品 ID
    • 回傳相應狀態碼、是否成功、失敗訊息，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+}

  • 查詢單個商品

    • 請求方式為 GET
    • 路徑為 /products/id
    • 回傳相應狀態碼、是否成功、失敗訊息，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+  "result": {
+    "id": ""
+    "name": "",
+    "price": 0,
+    "description": "",
+    "count": 0
+  }
+}

  • 查詢所有商品

    • 請求方式為 GET
    • 路徑為 /products
    • 回傳相應狀態碼、是否成功、失敗訊息，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+  "results": [
+    {
+      "name": "",
+      "price": 0,
+      "description": "",
+      "count": 0
+    }
+    // 其他商品...
+  ]
+}

  • 搜尋商品

    • 請求方式為 GET
    • 路徑為 /products
    • 以 query 來查詢商品，提供 price_gte (價格大於等於) 和 price_lte (價格小於等於) 兩種
    • 回傳相應狀態碼、是否成功、失敗訊息，資料格式為 JSON
      js
      {
+  "success": true,
+  "message": "",
+  "results": [
+    {
+      "name": "",
+      "price": 0,
+      "description": "",
+      "count": 0
+    }
+    // 其他商品...
+  ]
+}
+ + + + \ No newline at end of file diff --git a/database/mongo.html b/database/mongo.html new file mode 100644 index 00000000..7f20c27c --- /dev/null +++ b/database/mongo.html @@ -0,0 +1,109 @@ + + + + + + MongoDB 的安裝與操作 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

MongoDB 的安裝與操作 ​

MongoDB 的安裝以及增改刪查語法

安裝 ​

安裝版 ​

  • 下載 .msi
  • 選 Complete，Install MongoD as a Service，Run service as a Network Service user
  • 設定檔會在 安裝目錄/bin/mongo.cfg
  • 設定環境變數 path，新增值 C:\Program Files\MongoDB\Server\4.2\bin
  • MongoDB 會開機啟動，打開 cmd 輸入 mongo 就能進入終端機下資料庫指令

免安裝 ​

  • 安裝 Visual C++ 2015/2017/2019
  • 下載 .zip 解壓縮
  • 在根目錄建立 data 資料夾
  • 在根目錄建立 logs 資料夾，裡面開一個空的 log.txt
  • 在根目錄建立 mongod.config 設定檔
    ini
    dbpath=data
+logpath=logs\log.txt
  • 建立 data 和 log 資料夾
  • 建立 MongoDB 啟動檔 start.bat，寫入
    txt
    .\bin\mongod --config .\mongod.config
  • 使用時須先執行啟動檔後， cd 到 bin 資料夾內，下 mongo 指令進入終端機下資料庫指令

工具 ​

使用語法 ​

新增 ​

js
// 單筆新增
+> db.collection.insertOne({"name": "aaa"})
+{
+  "acknowledged" : true,
+  "insertedId": ObjectId("123456")
+}
+// 多筆新增
+> db.collection.insertMany([{"name": "aaa"}, {"name": "bbb"}])
+{
+  "acknowledged" : true,
+  "insertedIds" : [
+    ObjectId("123456"),
+    ObjectId("123457")
+  ]
+}
+// 也是多筆新增，但是僅回傳比數
+// ordered: 當發生錯誤時是否停止執行
+> db.collection.insert([{"name": "aaa"}, {"name": "bbb"}], {ordered: false})
+BulkWriteResult({
+  "writeConcernErrors" : [ ],
+  "nInserted" : 0,
+  "nUpserted" : 0,
+  "nMatched" : 0,
+  "nModified" : 0,
+  "nRemoved" : 0,
+  "upserted" : [ ]
+})

索引 ​

建立索引，可以避免資料庫欄位出現重複資料

js
// 建立索引
+> db.col.createIndex({"account":1}, {unique: true})
+
+// 顯示索引
+> db.admin.getIndexes()
+[
+  {
+    "v" : 2,
+    "key" : {
+      "_id" : 1
+    },
+    "name" : "_id_",
+    "ns" : "test.admin"
+  },
+  {
+    "v" : 2,
+    "unique" : true,
+    "key" : {
+      "account" : 1
+    },
+    "name" : "account_1",
+    "ns" : "test.admin"
+  }
+]
+
+// 刪除索引
+> db.admin.dropIndex("account_1")
+{ "nIndexesWas" : 2, "ok" : 1 }

查詢 ​

  • show dbs 顯示所有資料庫
  • use db 進入某資料庫
  • db.collection.find().limit().skip().pretty().sort() 查詢
    • collection 為資料表名稱
    • .find(query, projection)，query 為查詢 projection 顯示欄位
      js
      // db.products.find( query, projection )
+// 找出 _id 為 123 的資料，但只顯示 _id, name, price 三個欄位
+> db.products.find( { _id: "ac3" } , { name:1,price:1} )
    • .limit() 為資料比數，可不加
    • .skip() 為略過幾筆資料，可不加
    • .pretty() 為是否格式化輸出，可不加
    • .sort( { price : 1 } ) 為資料排序
  • 查詢動作
    • $gte - 大於等於 .find( { price: {$gte:200 } } )
    • $gt - 大於 .find( { price: {$gt:200 } } )
    • $lte - 小於等於 .find( { price: {$lte:200 } } )
    • $lt - 小於 .find( { price: {$lt:200 } } )
    • $in - 包含 .find( { type: {$in:["food"]} } )
    • $nin - 不包含 .find( { type: {$nin:["food"]} } )
    • $and - 和 .find( { $and: [ { price: { $lt: 200 } }, { name: "ABCD"} ] } )
    • $or - 或 .find( { $or: [ { price: { $lt: 200 } }, { name: "ABCD"} ] } )
    • $not - 否 .find( { price: { $not: { $gt: 200 } } } )

更新 ​

js
// db.collection.update(query, update, {upsert, multi})
+> db.collection.update({'title':'MongoDB ABCD'},{$set:{'title':'MongoDB'}}, {multi: true})
  • query - 查詢條件
  • update - 更新資料，$set 修改指定值，$inc 為加減值，$mul 為乘值
  • upsert - 如果找不到資料就新增
  • multi - 預設只找一筆資料，設定 true 取代多筆資料

刪除 ​

js
// 刪除一筆
+> db.col.deleteOne({'name':'ABC'})
+// 刪除多筆
+> db.col.deleteMany({'name':'ABC'})

聚合框架 (Aggregation Framework) ​

MongoDB 的聚合框架能更進階的處理查詢請求

js
> db.collection.aggregate([])

可使用 MongoDB Compass 的聚合工具輔助編寫語法

pipeline ​

  • $project - 選擇回傳欄位，若只要回傳姓名和 id 為 { "$project" : { "id" : 1, "name" : 1 }}
  • $match - 查詢條件，一般 .find() 裡面寫的語法
  • $unwind - 拆分，能把陣列裡的資料拆成單獨的一個個資料，若要拆分訂單陣列欄位為 {"$unwind" : "$orders"}
  • $sort - 排序，若要寫依照年齡排序 { "$sort" : { "age" : 1 }}
  • $limit - 限制回傳資料數，若要限制會傳 10 筆為 { "$limit" : 10 }
  • $skip - 略過幾筆資料，若要略過前 10 筆資料為 { "$skip" : 10 }
  • $group - 分組
  • $lookup - 關聯兩個 models，如以下就是將目前資料表的 author 和 users 資料表的 _id 關聯，並取名為 author 欄位
    js
    {
+  '$lookup': {
+    'from': 'users',
+    'localField': 'author',
+    'foreignField': '_id',
+    'as': 'author'
+  }
+}

操作符 ​

  • $size - 計算數量
  • $filter - 過濾資料，可以搭配 $eq
  • $add - 接受多個值相加
  • $subtract - 接受兩個值相減，第二個剪減第一個，如 $subtract : [ "$price", "$count"]
  • $multiply - 接受兩個值相乘，如 $multiply : [ "$price", "$count"]
  • $divide - 接受兩個值相除，取結果
  • $mod - 接受兩個值相除，取餘數
  • $filter - 過濾資料，{ $filter: { input: 陣列, cond: 判斷條件 } }

操作符能混搭使用，如以下語法回傳 products 陣列裡 sell 欄位值為 1 的商品總數

js
> db.collection.aggregate([
+  {
+    $project: {
+      'sellproducts': {
+        '$size': {
+          '$filter': {
+            'input': '$products',
+            'cond': {
+              '$eq': [
+                '$$this.sell', 1
+              ]
+            }
+          }
+        }
+      }
+    }
+  }
+])

資料管理 ​

資料匯出 ​

js
> mongoexport -d DatabaseName -c CollectionName -o fileName.json

資料匯入 ​

js
> mongoimport -d DatabaseName -c CollectionName fileName.json

資料庫規劃 ​

+ + + + \ No newline at end of file diff --git a/edit.png b/edit.png new file mode 100644 index 00000000..d07d9bf0 Binary files /dev/null and b/edit.png differ diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 00000000..45599813 Binary files /dev/null and b/favicon.ico differ diff --git a/hashmap.json b/hashmap.json new file mode 100644 index 00000000..d85c3b75 --- /dev/null +++ b/hashmap.json @@ -0,0 +1 @@ +{"advanced_ajax.md":"CFZo-rz0","basic_class.md":"G_iOFQXA","advanced_advanced.md":"CH5MV-jo","basic_data-string.md":"8cpA1SNA","basic_operator.md":"jbTUCSlW","basic_variable.md":"B2Hzm79v","others_pug.md":"C5dP7dZv","basic_function.md":"BuLdGG0n","basic_timer.md":"DTrbeSUS","jquery_animation.md":"x2nJIBfa","node_intro.md":"CSKCdgfy","others_nuxt.md":"FV9qyVYR","others_vuepress.md":"BvCYNNXi","vue_packages.md":"DX5Gvw7u","vue_basic.md":"CLCU3XFB","vue_router-pinia-pwa.md":"DqpdfFtm","vue_vite-sfc.md":"4nfAPjYu","interaction_dom.md":"B075fkF-","basic_data-number.md":"CqG8J3Z_","basic_intro.md":"BvLRp6WR","database_api-advanced.md":"BDYHfGPO","basic_data-array.md":"BwHwx0Os","interaction_observer.md":"DmY0x0bM","jquery_cards.md":"3-aWlHwo","jquery_zombie.md":"Cv3g9Py7","index.md":"BRhsXgIh","basic_array-object.md":"bl7hbNEI","database_mongo.md":"DSDhtKRd","others_git.md":"D9qRkPHo","basic_condition.md":"B_N2xuXU","database_api-basic.md":"BqfvTeA4","interaction_bom.md":"B4oAq4x4","jquery_dom.md":"CfSBKCFF","node_line.md":"D9TOETTG","basic_loop.md":"tHwRw1NA","intro_before-start.md":"ZzGUpo3H","interaction_events.md":"CplXGJZR","interaction_clock.md":"DeNojlSA"} diff --git a/hero.png b/hero.png new file mode 100644 index 00000000..8603912e Binary files /dev/null and b/hero.png differ diff --git a/images/ch0/cc.png b/images/ch0/cc.png new file mode 100644 index 00000000..9dacb34f Binary files /dev/null and b/images/ch0/cc.png differ diff --git a/images/ch0/discord-bad.png b/images/ch0/discord-bad.png new file mode 100644 index 00000000..f6588af6 Binary files /dev/null and b/images/ch0/discord-bad.png differ diff --git a/images/ch0/discord-code.png b/images/ch0/discord-code.png new file mode 100644 index 00000000..1d020001 Binary files /dev/null and b/images/ch0/discord-code.png differ diff --git a/images/ch0/discord-good.png b/images/ch0/discord-good.png new file mode 100644 index 00000000..16589b04 Binary files /dev/null and b/images/ch0/discord-good.png differ diff --git a/images/ch0/flappy.jpg b/images/ch0/flappy.jpg new file mode 100644 index 00000000..8171010c Binary files /dev/null and b/images/ch0/flappy.jpg differ diff --git a/images/ch0/googlegame.gif b/images/ch0/googlegame.gif new file mode 100644 index 00000000..426339e3 Binary files /dev/null and b/images/ch0/googlegame.gif differ diff --git a/images/ch0/learn.png b/images/ch0/learn.png new file mode 100644 index 00000000..7594370d Binary files /dev/null and b/images/ch0/learn.png differ diff --git a/images/ch0/rabbids.jpg b/images/ch0/rabbids.jpg new file mode 100644 index 00000000..5715e5ee Binary files /dev/null and b/images/ch0/rabbids.jpg differ diff --git a/images/ch1/light_off.gif b/images/ch1/light_off.gif new file mode 100644 index 00000000..65cacdda Binary files /dev/null and b/images/ch1/light_off.gif differ diff --git a/images/ch1/light_on.gif b/images/ch1/light_on.gif new file mode 100644 index 00000000..72ecfc4a Binary files /dev/null and b/images/ch1/light_on.gif differ diff --git a/images/ch1/meme_js.jpeg b/images/ch1/meme_js.jpeg new file mode 100644 index 00000000..7586ae51 Binary files /dev/null and b/images/ch1/meme_js.jpeg differ diff --git a/images/ch1/meme_node1.png b/images/ch1/meme_node1.png new file mode 100644 index 00000000..50a391ae Binary files /dev/null and b/images/ch1/meme_node1.png differ diff --git a/images/ch1/meme_node2.png b/images/ch1/meme_node2.png new file mode 100644 index 00000000..baa41181 Binary files /dev/null and b/images/ch1/meme_node2.png differ diff --git a/images/ch10/bom-dom.png b/images/ch10/bom-dom.png new file mode 100644 index 00000000..ea215345 Binary files /dev/null and b/images/ch10/bom-dom.png differ diff --git a/images/ch10/dom.png b/images/ch10/dom.png new file mode 100644 index 00000000..c7d92dc4 Binary files /dev/null and b/images/ch10/dom.png differ diff --git a/images/ch12/bubble.png b/images/ch12/bubble.png new file mode 100644 index 00000000..5b4de655 Binary files /dev/null and b/images/ch12/bubble.png differ diff --git a/images/ch12/cat.jpg b/images/ch12/cat.jpg new file mode 100644 index 00000000..55c64386 Binary files /dev/null and b/images/ch12/cat.jpg differ diff --git a/images/ch12/hw.png b/images/ch12/hw.png new file mode 100644 index 00000000..727cfa22 Binary files /dev/null and b/images/ch12/hw.png differ diff --git a/images/ch14/domnjquery.jpg b/images/ch14/domnjquery.jpg new file mode 100644 index 00000000..b3f05ba5 Binary files /dev/null and b/images/ch14/domnjquery.jpg differ diff --git a/images/ch15/0104.jpg b/images/ch15/0104.jpg new file mode 100644 index 00000000..332526fa Binary files /dev/null and b/images/ch15/0104.jpg differ diff --git a/images/ch15/0551.jpg b/images/ch15/0551.jpg new file mode 100644 index 00000000..b3320bef Binary files /dev/null and b/images/ch15/0551.jpg differ diff --git a/images/ch15/0552.jpg b/images/ch15/0552.jpg new file mode 100644 index 00000000..3adce36c Binary files /dev/null and b/images/ch15/0552.jpg differ diff --git a/images/ch15/0553.jpg b/images/ch15/0553.jpg new file mode 100644 index 00000000..9ca6c091 Binary files /dev/null and b/images/ch15/0553.jpg differ diff --git a/images/ch15/0554.jpg b/images/ch15/0554.jpg new file mode 100644 index 00000000..0db5c61a Binary files /dev/null and b/images/ch15/0554.jpg differ diff --git a/images/ch15/0555.jpg b/images/ch15/0555.jpg new file mode 100644 index 00000000..844c9bc4 Binary files /dev/null and b/images/ch15/0555.jpg differ diff --git a/images/ch16/blood.png b/images/ch16/blood.png new file mode 100644 index 00000000..3b145603 Binary files /dev/null and b/images/ch16/blood.png differ diff --git a/images/ch16/cursor.png b/images/ch16/cursor.png new file mode 100644 index 00000000..e2aff8f6 Binary files /dev/null and b/images/ch16/cursor.png differ diff --git a/images/ch16/kodai_sacabambaspis.png b/images/ch16/kodai_sacabambaspis.png new file mode 100644 index 00000000..c3b5e36f Binary files /dev/null and b/images/ch16/kodai_sacabambaspis.png differ diff --git a/images/ch17/1S.jpg b/images/ch17/1S.jpg new file mode 100644 index 00000000..ff4ff48c Binary files /dev/null and b/images/ch17/1S.jpg differ diff --git a/images/ch17/2S.jpg b/images/ch17/2S.jpg new file mode 100644 index 00000000..9652423d Binary files /dev/null and b/images/ch17/2S.jpg differ diff --git a/images/ch17/3S.jpg b/images/ch17/3S.jpg new file mode 100644 index 00000000..bce70b05 Binary files /dev/null and b/images/ch17/3S.jpg differ diff --git a/images/ch17/4S.jpg b/images/ch17/4S.jpg new file mode 100644 index 00000000..9c4c817b Binary files /dev/null and b/images/ch17/4S.jpg differ diff --git a/images/ch17/5S.jpg b/images/ch17/5S.jpg new file mode 100644 index 00000000..87897a23 Binary files /dev/null and b/images/ch17/5S.jpg differ diff --git a/images/ch17/6S.jpg b/images/ch17/6S.jpg new file mode 100644 index 00000000..33ac347e Binary files /dev/null and b/images/ch17/6S.jpg differ diff --git a/images/ch17/7S.jpg b/images/ch17/7S.jpg new file mode 100644 index 00000000..957bbf7f Binary files /dev/null and b/images/ch17/7S.jpg differ diff --git a/images/ch17/8S.jpg b/images/ch17/8S.jpg new file mode 100644 index 00000000..28ade622 Binary files /dev/null and b/images/ch17/8S.jpg differ diff --git a/images/ch17/Red_back.jpg b/images/ch17/Red_back.jpg new file mode 100644 index 00000000..119eb85f Binary files /dev/null and b/images/ch17/Red_back.jpg differ diff --git a/images/ch18/request.gif b/images/ch18/request.gif new file mode 100644 index 00000000..aa73db51 Binary files /dev/null and b/images/ch18/request.gif differ diff --git a/images/ch19/callbackhell.jpg b/images/ch19/callbackhell.jpg new file mode 100644 index 00000000..2fc0fd47 Binary files /dev/null and b/images/ch19/callbackhell.jpg differ diff --git a/images/ch19/sync.jpg b/images/ch19/sync.jpg new file mode 100644 index 00000000..1e8dec4a Binary files /dev/null and b/images/ch19/sync.jpg differ diff --git a/images/ch2/datatype.jpg b/images/ch2/datatype.jpg new file mode 100644 index 00000000..3300c85b Binary files /dev/null and b/images/ch2/datatype.jpg differ diff --git a/images/ch2/reserved.png b/images/ch2/reserved.png new file mode 100644 index 00000000..fd49007a Binary files /dev/null and b/images/ch2/reserved.png differ diff --git a/images/ch21/webhook.png b/images/ch21/webhook.png new file mode 100644 index 00000000..c24996c9 Binary files /dev/null and b/images/ch21/webhook.png differ diff --git a/images/ch22/card.png b/images/ch22/card.png new file mode 100644 index 00000000..f7143628 Binary files /dev/null and b/images/ch22/card.png differ diff --git a/images/ch22/components.png b/images/ch22/components.png new file mode 100644 index 00000000..eb70aa81 Binary files /dev/null and b/images/ch22/components.png differ diff --git a/images/ch22/mvvm.png b/images/ch22/mvvm.png new file mode 100644 index 00000000..3cb58ac8 Binary files /dev/null and b/images/ch22/mvvm.png differ diff --git a/images/ch22/todo.png b/images/ch22/todo.png new file mode 100644 index 00000000..0141b819 Binary files /dev/null and b/images/ch22/todo.png differ diff --git a/images/ch23/jumbotron.png b/images/ch23/jumbotron.png new file mode 100644 index 00000000..afca61a7 Binary files /dev/null and b/images/ch23/jumbotron.png differ diff --git a/images/ch25/tomato1.png b/images/ch25/tomato1.png new file mode 100644 index 00000000..bd2f8607 Binary files /dev/null and b/images/ch25/tomato1.png differ diff --git a/images/ch25/tomato2.png b/images/ch25/tomato2.png new file mode 100644 index 00000000..6a8c4aeb Binary files /dev/null and b/images/ch25/tomato2.png differ diff --git a/images/ch27/MVC Express.png b/images/ch27/MVC Express.png new file mode 100644 index 00000000..87e3e719 Binary files /dev/null and b/images/ch27/MVC Express.png differ diff --git a/images/ch27/meme.jpg b/images/ch27/meme.jpg new file mode 100644 index 00000000..c6409bb2 Binary files /dev/null and b/images/ch27/meme.jpg differ diff --git a/images/ch3/meme.png b/images/ch3/meme.png new file mode 100644 index 00000000..def5c4d0 Binary files /dev/null and b/images/ch3/meme.png differ diff --git a/images/ch30/git.png b/images/ch30/git.png new file mode 100644 index 00000000..d2f2ba50 Binary files /dev/null and b/images/ch30/git.png differ diff --git a/images/ch30/gitafter.png b/images/ch30/gitafter.png new file mode 100644 index 00000000..cbbb636a Binary files /dev/null and b/images/ch30/gitafter.png differ diff --git a/images/ch30/gitbefore.jpg b/images/ch30/gitbefore.jpg new file mode 100644 index 00000000..d1324050 Binary files /dev/null and b/images/ch30/gitbefore.jpg differ diff --git a/images/ch30/github.png b/images/ch30/github.png new file mode 100644 index 00000000..280b577e Binary files /dev/null and b/images/ch30/github.png differ diff --git a/images/ch30/gitkraken.png b/images/ch30/gitkraken.png new file mode 100644 index 00000000..4e5c68f6 Binary files /dev/null and b/images/ch30/gitkraken.png differ diff --git a/images/ch4/meme.jpg b/images/ch4/meme.jpg new file mode 100644 index 00000000..f0464dec Binary files /dev/null and b/images/ch4/meme.jpg differ diff --git "a/images/ch4/\344\277\235\350\255\267\347\264\232.jpg" "b/images/ch4/\344\277\235\350\255\267\347\264\232.jpg" new file mode 100644 index 00000000..f88ef1ad Binary files /dev/null and "b/images/ch4/\344\277\235\350\255\267\347\264\232.jpg" differ diff --git "a/images/ch4/\346\231\256\351\201\215\347\264\232.jpg" "b/images/ch4/\346\231\256\351\201\215\347\264\232.jpg" new file mode 100644 index 00000000..33837382 Binary files /dev/null and "b/images/ch4/\346\231\256\351\201\215\347\264\232.jpg" differ diff --git "a/images/ch4/\350\274\22412\347\264\232.jpg" "b/images/ch4/\350\274\22412\347\264\232.jpg" new file mode 100644 index 00000000..34511cd4 Binary files /dev/null and "b/images/ch4/\350\274\22412\347\264\232.jpg" differ diff --git "a/images/ch4/\350\274\22415\347\264\232.jpg" "b/images/ch4/\350\274\22415\347\264\232.jpg" new file mode 100644 index 00000000..a8da6c6c Binary files /dev/null and "b/images/ch4/\350\274\22415\347\264\232.jpg" differ diff --git "a/images/ch4/\351\231\220\345\210\266\347\264\232.jpg" "b/images/ch4/\351\231\220\345\210\266\347\264\232.jpg" new file mode 100644 index 00000000..9f71f394 Binary files /dev/null and "b/images/ch4/\351\231\220\345\210\266\347\264\232.jpg" differ diff --git a/images/ch5/java-star-pattern.png b/images/ch5/java-star-pattern.png new file mode 100644 index 00000000..30425ed3 Binary files /dev/null and b/images/ch5/java-star-pattern.png differ diff --git a/images/ch5/while.jpg b/images/ch5/while.jpg new file mode 100644 index 00000000..4c1e1384 Binary files /dev/null and b/images/ch5/while.jpg differ diff --git a/images/ch5/while_alive.png b/images/ch5/while_alive.png new file mode 100644 index 00000000..1d520d48 Binary files /dev/null and b/images/ch5/while_alive.png differ diff --git a/images/ch6/2array.jpg b/images/ch6/2array.jpg new file mode 100644 index 00000000..25c22291 Binary files /dev/null and b/images/ch6/2array.jpg differ diff --git a/images/ch6/3array.jpg b/images/ch6/3array.jpg new file mode 100644 index 00000000..659b215d Binary files /dev/null and b/images/ch6/3array.jpg differ diff --git a/images/ch8/array.gif b/images/ch8/array.gif new file mode 100644 index 00000000..885c120e Binary files /dev/null and b/images/ch8/array.gif differ diff --git a/images/ch8/array.png b/images/ch8/array.png new file mode 100644 index 00000000..56c0bb3b Binary files /dev/null and b/images/ch8/array.png differ diff --git a/index.html b/index.html new file mode 100644 index 00000000..9d8c917c --- /dev/null +++ b/index.html @@ -0,0 +1,25 @@ + + + + + + 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

泰山職訓

前端班課程講義

進入 JavaScript 的世界

開始
報名課程
泰山職訓

網頁前端

包含基礎 JavaScript 語法、JQuery 函式庫 以及 Vue.js 框架

後端伺服器

Node.js 是能夠在伺服器端運行 JavaScript 的跨平台執行環境。

資料庫

MongoDB 是文件導向的資料庫系統，為目前最靈活易用的 NoSQL 之一。

+ + + + \ No newline at end of file diff --git a/interaction/bom.html b/interaction/bom.html new file mode 100644 index 00000000..bd82e4ed --- /dev/null +++ b/interaction/bom.html @@ -0,0 +1,102 @@ + + + + + + BOM | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

BOM ​

BOM 指的是 Browser Object Model，中文稱 瀏覽器物件模型

介紹 ​

BOM 是瀏覽器功能的核心，也就是 window
所有預設的全域變數、函式、物件，都屬於 window 物件

BOM 結構圖
BOM 結構圖

window ​

window 物件讓你可以存取和操作瀏覽器的視窗
像是開啟頁面、關閉頁面、視窗大小等等

  • window.open(網址, 目標, 彈出設定) 開新網址
  • window.close() 關閉視窗
  • window.outerWidth 視窗外部寬度，包含工具列
  • window.outerHeight 視窗外部高度，包含工具列
  • window.innerWidth 視窗內部寬度，不含工具列
  • window.innerHeight 視窗內部高度，不含工具列
js
// 在新分頁開啟網址
+window.open("https://google.com")
+// 在彈出視窗開啟網址
+window.open("https://google.com", "_blank", "width=500,height=500")
+
+// 關閉視窗
+window.close();
+
+// 視窗大小，包含工具列等
+window.outerWidth
+window.outerHeight
+
+// 視窗大小，不含工具列等
+window.innerWidth
+window.innerHeight

location ​

location 是瀏覽器頁面網址
可以透過操控這個物件來完成跳轉頁面，或獲取資訊

  • location.href 目前網址
  • location.reload 重新載入頁面
  • location.hostname 取得網域名稱
  • location.pathname 取得網址路徑
js
// 目前網址
+console.log(`目前網址是 ${location.href}`);
+
+// 跳頁
+location.href = "https://google.com";
+
+// 重新載入頁面
+location.reload();
+
+// 取得網域名稱
+location.hostname;
+
+// 取得網址路徑
+location.pathname;

history ​

history 是使用者的瀏覽紀錄

  • history.back() 上一頁
  • history.forward() 下一頁
  • history.go(數字) 移動到目前頁面的相對歷史紀錄
js
// 上一頁
+history.back();
+
+// 下一頁
+history.forward();
+
+// 移動到目前頁面的相對歷史紀錄
+// 正數代表往後幾頁，負數代表往前幾頁
+history.go(-1);

navigator 為使用者的狀態與身分
包含了瀏覽器名稱、版本以及其他使用者資訊
現代瀏覽器可以做到的事情非常多，可參考 browser-2020 說明

screen ​

screen 可以獲取使用者的螢幕資訊，像是寬度和高度等

  • screen.width 螢幕寬度
  • screen.height 螢幕高度
  • screen.availWidth 可用寬度
  • screen.availHeight 可用高度
  • screen.orientation 螢幕方向

popup 顯示瀏覽器內建的對話框

  • alert 顯示訊息框
  • confirm 顯示確認框
  • prompt 顯示輸入框
+ + + + \ No newline at end of file diff --git a/interaction/clock.html b/interaction/clock.html new file mode 100644 index 00000000..0fa92942 --- /dev/null +++ b/interaction/clock.html @@ -0,0 +1,185 @@ + + + + + + 時鐘 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

時鐘 ​

透過簡易圓形時鐘熟悉 DOM 的操作

Date ​

Date 是內建的物件，可以對時間做簡單的處理
內建的物件功能有限，如果想要更方便的做時間處理的話，建議使用套件

常見的日期處理套件

函式說明
getFullYear()西元日期
getMonth()月份，從 0 開始
getDate()日
getDay()星期，從星期天 0 開始
getHours()小時，0 到 23
getMinutes()分鐘，0 到 59
getSeconds()秒鐘，0 到 59
getMilliseeonds()毫秒， 0 到 999
getTime()從 1970/1/1 00:00:00 到現在的毫秒數
toDateString()轉換成日期字串
toTimeString()轉換成時間字串
toLocalDateString()依語言格式化日期
toLocalTimeString()依語言格式化時間
toLocaleString(語言)依語言格式化輸出

注意

大多數語言的時間戳記都是以秒為單位，但是 JavaScript 是毫秒

js
// () 內可以指定時間，不放的話就是現在
+const dateStr = new Date("2024/04/02 12:00:00")
+const dateNum = new Date(2024, 4, 2, 12, 0, 0)
+const now = new Date()
+
+// 可以用表內的函式取得時間後輸出
+const string1 = now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds()
+console.log("現在時間是 " + string1)
+
+// 也可以將時間依語言格式化輸出
+const string2 = now.toLocaleString("zh-tw")
+console.log("現在時間是 " + string2)

時鐘 ​

透過簡易圓形時鐘熟悉 DOM 的操作和計時器

作業

美化你的時鐘，或加入更多的功能

+ + + + \ No newline at end of file diff --git a/interaction/dom.html b/interaction/dom.html new file mode 100644 index 00000000..c68b6d6d --- /dev/null +++ b/interaction/dom.html @@ -0,0 +1,173 @@ + + + + + + DOM | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

DOM ​

DOM 全名叫 Document Object Model，中文稱 文件物件模型

介紹 ​

DOM 為 BOM 的 document，也就是指整個網頁的 HTML 部分

DOM 結構圖
DOM 結構圖

取得元素 ​

  • document 代表整個網頁
  • document.documentElement 代表整個網頁的根元素，也就是 <html>
  • document.head 代表 <head>
  • document.body 代表 <body>
  • .getElementById(id) 透過 id 抓取一個元素
  • .getElementsByTagName(標籤名) 透過標籤名稱抓取所有元素
  • .getElementsByClassName(class名) 透過 class 抓取所有元素
  • .querySelector(選擇器) 透過 CSS 選擇器抓取第一個元素
  • .querySelectorAll(選擇器) 透過 CSS 選擇器抓取所有元素

TIP

建議取得元素時使用 const 宣告，變數名稱設定跟元素名稱一樣，避免自己混淆

js
const title = document.getElementById("title")

TIP

這些語法可以串聯使用，就可以取得更深層的元素

js
document.getElementById('main').getElementsByClassName('test')

注意

迴圈取得的元素時，無法使用 陣列.forEach
因為取得的資料型態是 HTMLCollection，不是單純的陣列
但還是可以使用 for、for of、for in 迴圈處理

js
// 取得 id 為 header 的元素
+document.getElementByID("header")
+
+// 取得所有 h1 標籤，結果會是陣列
+document.getElementsByTagName("h1")
+
+// 取得所有 class 為 text-center 的所有元素，結果會是陣列
+document.getElementsByClassName("text-center")
+
+// 取得所有 class 為 text-center 和 text-white 的元素
+document.getElementsByClassName('text-center text-white')
+
+// 使用 CSS 選擇器，取第一個符合的
+document.querySelector(".card")
+
+// 使用 CSS 選擇器，取所有符合的，結果會是陣列
+document.querySelectorAll(".product")

也可以使用這些方法取得相對位置的元素

  • .parentElement 取得上一層元素
  • .children 取得下一層所有元素
  • .firstElementChild 取得下一層第一個元素
  • .lastElementChild 取得下一層最後一個元素
  • .nextElementSibling 取得同一層的下一個元素
  • .previousElementSibling 取得同一層的上一個元素

Tip

這些語法都只能相對距離為 1 的元素
例如想要取得同一層的下兩個元素，需要串聯語法，或使用迴圈

串連語法範例

js
const el document.getElementById('id').nextElementSibling.nextElementSibling

迴圈範例

js
let el = document.getElementById('id')
+for (let i = 1; i <= 2; i++) {
+  el = el.nextElementSibling
+}
js
// parentElement 可以抓取上一層元素
+document.getElementById("myLI").parentElement;
+
+// children 可以抓取下一層所有元素
+document.getElementById("myUL").children;
+
+// firstChild 可以抓取下一層第一個元素
+document.getElementById("myUL").firstElementChild;
+
+// lastChild 可以抓取下一層最後一個元素
+document.getElementById("myUL").lastElementChild;
+
+// nextElementSibling 可以抓取同一層的下一個元素
+document.getElementById("item1").nextElementSibling 
+
+// previousElementSibling 可以抓取同一層的上一個元素
+document.getElementById("item2").previousElementSibling

修改元素 ​

  • .innerText 元素內的文字
  • .innerHTML 元素內的 HTML
  • .style 元素的行內樣式
  • .屬性名 元素屬性
  • .setAttribute(屬性名, 值) 修改元素屬性
  • .getAttribute(屬性名) 取得元素屬性
  • .className 取得元素的 class
  • .classList 操作元素的 class
    • .add("class") 新增 class
    • .remove("class") 移除 class
    • .replace("old", "new") 取代 class
    • .toggle("class") 開關
    • .contains("class") 是否有該

TIP

.style 只能取得行內樣式
如果要取得最終樣式，需使用 getComputedStyle(元素, 偽元素).樣式名 取得最終樣式
需要注意這個方式取得的資訊是唯讀的，無法修改

取得樣式範例

js
const title = document.getElementById('title')
+const titleColor = getComputedStyle(title).color

取得偽元素樣式範例

js
const link = document.getElementById('link')
+const linkAfterColor = getComputedStyle(link, '::after').color

注意

修改獲取得元素屬性時，使用 .屬性名 比用 setAttribute 和 getAttribute 的處理速度快

js
// 取得元素內的文字
+console.log(element.innerText)
+// 修改元素內的文字
+element.innerText = "123"
+// 取得元素內的 HTML
+console.log(element.innerText)
+// 修改元素內的 HTML
+element.innerHTML = "<h1>123</h1>"; 
+
+// 取得元素 CSS
+console.log(element.style.backgroundColor)
+// 修改元素 CSS
+element.style['background-color'] = "red";
+
+// 取得元素屬性
+const href = element.getAttribute("href")
+console.log(href)
+console.log(element.href)
+// 修改元素屬性
+element.setAttribute("href", "https://kento520.tw")
+element.href = "https://kento520.tw"
+
+// 直接取得元素 class
+console.log(element.className)
+// 直接修改元素 class
+element.className = 'text-red text-center'
+
+// 使用 classList 新增 class
+element.classList.add("text-italic")
+element.classList.add("bg-black text-white")
+// 使用 classList 移除 class
+element.classList.remove("text-italic");
+element.classList.remove("bg-black text-white");
+// 使用 classList 取代 class
+element.classList.replace("text-red", "text-blue");
+// 使用 classList 切換 class
+element.classList.toggle("red");

元素移動 ​

  • document.createElement(標籤名) 新增一個元素，需另外使用語法 DOM
  • .appendChild(元素) 在內部最後面插入一個元素
  • .replaceChild(新元素, 舊元素) 在內部替換元素
  • .insertBefore(新元素, 參考元素) 在內部最前面插入一個元素，並指定插入位置，用於新增或移動元素
    • 參考元素為 null 時，等同於 appendChild
  • .insertAdjacentHTML(位置, HTML) 在元素內指定位置插入 HTML
    • beforebegin 元素前標籤之前
    • afterbegin 元素前標籤之後
    • beforeend 元素後標籤之前
    • afterend 元素後標籤之後
  • .remove() 移除元素
  • .removeChild(子元素) 移除元素內的子元素，回傳被刪除的元素
js
const p = document.createElement("p")
+element.appendChild(p)
+
+const div = document.createElement("div")
+element.replaceChild(div, p)

.insertBefore() 搬移範例

insertAdjacentHTML 範例

節點 ​

Node 節點物件是 DOM 內所有東西的通用名稱，包含文字、註解以及元素等等
上面所有的 Element 元素物件都是 Node 的一種，代表元素
操作的時候要注意 Node 包含了所有東西，Element 只包含元素

節點類型

名稱數值
ELEMENT_NODE1
ATTRIBUTE_NODE2
TEXT_NODE3
CDATA_SECTION_NODE4
PROCESSING_INSTRUCTION_NODE7
COMMENT_NODE8
DOCUMENT_NODE9
DOCUMENT_TYPE_NODE10
DOCUMENT_FRAGMENT_NODE11

注意

程式碼排版的縮排空格也算是 Node.TEXT_NODE

Node 相關語法

  • .nodeType 取得節點類型
  • .nodeName 取得節點名稱
  • .nodeValue 取得節點值
  • .childNodes 取得所有子節點
  • .firstChild 取得第一個子節點
  • .lastChild 取得最後一個子節點
  • .nextSibling 取得下一個同一層節點
  • .previousSibling 取得上一個同一層節點
  • .parentNode 取得上一層節點
  • document.createTextNode(文字) 新增一個文字節點
html
<div id="example-div"><!-- 註解--><p id="example-p">123456<p></div>
js
// 取得 div 內第一個節點的類型，為註解
+const div = document.getElementById("example-div")
+console.log(div.firstChild.nodeType)                        // 8
+console.log(div.firstChild.nodeType === Node.COMMENT_NODE)  // true
+
+// 取得 p 內第一個節點的類型，為文字
+const p = document.getElementById("example-p")
+console.log(p.nodeType === Node.ELEMENT_NODE)               // true
+console.log(p.firstChild.nodeType === Node.TEXT_NODE)       // true

綜合練習 ​

練習

製作倒數計時器

  • 使用者用 prompt() 輸入秒數數字
  • 在網頁只能有一行字顯示 剩餘 X 秒，秒數不能變負數，顏色為藍色
  • 時間到時文字變成紅色的 時間到
+ + + + \ No newline at end of file diff --git a/interaction/events.html b/interaction/events.html new file mode 100644 index 00000000..abf89ed5 --- /dev/null +++ b/interaction/events.html @@ -0,0 +1,113 @@ + + + + + + 事件 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

事件 ​

偵測網頁上發生的事件，像是載入狀態、使用者點滑鼠、按鍵盤等等

概念 ​

我們可以透過偵測事件，做到下面這些事

  • 頁面載入時觸發事件
  • 頁面關閉時觸發事件
  • 使用者點按鈕執行動作
  • 驗證使用者輸入內容
  • 阻止事件的發生

以下是常用的事件

事件說明
click滑鼠點擊
keydown鍵盤按鍵按下去時
keyup鍵盤按鍵放開時
mouseover滑鼠移到 HTML 元素上
mouseout滑鼠移開 HTML 元素
focus滑鼠點到輸入欄位
blur滑鼠點輸入欄位外
change元素改變時
input表單欄位輸入時
submit表單送出時
copy複製時

行內事件 ​

HTML 元素的事件可以像 CSS 的行內樣式一樣，寫在標籤內
只要加上事件名，就能在雙引號內寫上要執行的 JavaScript 程式碼
事件裡的 this 在這裡會代表發生事件的元素

html
<input type="button" value="點我" onclick="alert('你點了按鈕，好棒')">
+<input type="button" value="點我看時間" onclick="this.value = new Date().toLocaleString('zh-tw')">
+<input type="button" value="點我看時間" onclick="time(this)">
+<script>
+const time = (el) => {
+    el.value = new Date().toLocaleString('zh-tw');
+}
+</script>

事件綁定 ​

如果一次要為 100 個元素綁定事件，且每個都寫在標籤裡，不只會影響閱讀，還會讓維護變得更麻煩
所以我們可以使用 JavaScript 的 DOM 一次完成

html
<input type="button" value="按鈕" class="btns">
+<input type="button" value="按鈕" class="btns">
+<input type="button" value="按鈕" class="btns">
+<input type="button" value="按鈕" class="btns">
+<input type="button" value="按鈕" class="btns">
+<script>
+const btns = document.getElementsByClassName("btns");
+for(const btn of btns){
+  btn.onclick = () => {
+    alert("你點了按鈕，你好棒");
+  }
+}
+</script>

也能在 BOM 綁定事件

js
window.onload = () => {
+  alert("網頁載入完成")
+}

事件監聽 ​

事件監聽相比事件綁定更為彈性，可以為同一個元素綁定多個事件

  • .addEventListener(function) 增加事件監聽器至元素
  • .removeEventListener(function) 從元素移除事件監聽器
js
const onBtnClick1 = () => {
+  alert('click1')
+}
+const onBtnClick2 = () => {
+  alert('click2')
+}
+btn.addEventListener('click', onBtnClick1)
+btn.addEventListener('click', onBtnClick2)
+
+btn.removeEventListener('click', onBtnClick1)
+btn.removeEventListener('click', onBtnClick2)

Event 物件 ​

event 包含了事件的資訊

  • 鍵盤類事件可以取得按下的按鍵 JavaScript Key Code Event Tool
  • 滑鼠類事件可以取得滑鼠座標
    • clientX、clientY 滑鼠在瀏覽器視窗的座標
    • pageX、pageY 滑鼠在整個網頁的座標
    • screenX、screenY 滑鼠在螢幕的座標
    • offsetX、offsetY 滑鼠在元素內的座標

預設動作 ​

某些網頁元素有預設動作，可以使用 event.preventDefault() 阻止

  • 點 a 連結會跳頁
  • 在 form 中按 submit 會送出表單至 action 屬性指定的網址

事件冒泡 ​

事件冒泡指的是事件逐層往上傳遞，直到根元素的過程

事件運作方式
事件運作方式

網頁載入狀態 ​

document.readyState 代表目前網頁載入狀態
搭配 document.onreadystatechange 可以偵測網頁讀取進度
進度分為三種

  • loading 讀取中
  • interactive 解析完檔案，圖片等資源下載中
  • complete 完成

注意

只能偵測狀態，無法偵測圖片等資源的載入進度
所以需要透過其他方式製作載入進度的功能

js
document.onreadystatechange = () => {
+  console.log(document.readyState)
+}

應用範例 ​

  • 尋找貓咪遊戲
  • 網頁捲動背景視差效果
  • 網頁載入進度條

綜合練習 ​

練習

製作猜拳遊戲，網頁有三個按鈕，分別是剪刀、石頭和布
按鈕點下去後電腦隨機出拳，將電腦出拳和勝負結果用 alert() 顯示
最後在按鈕下方用 ul 和 li 清單列出勝負紀錄

作業

製作有隨機功能的顏色選擇器

挑戰

延伸作業內容，製作兩色漸層顏色選擇器

+ + + + \ No newline at end of file diff --git a/interaction/observer.html b/interaction/observer.html new file mode 100644 index 00000000..f0f4cdcf --- /dev/null +++ b/interaction/observer.html @@ -0,0 +1,270 @@ + + + + + + Observer | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Observer ​

Observer 監視器，可以觀察 DOM 元素的變化，當元素變化時執行指定的 function

Mutation Observer ​

當觀察的 DOM 元素變動時會執行指定的 function
不會立即執行，會先儲存變動記錄，等到所有變動都完成後再執行

  • 使用 new MutationObserver(function) 建立
    • function 內的 mutations 參數是一個陣列，裡面包含所有變動的紀錄
    • 變動的記錄包含的資訊
      • type 變動類型
      • target 變動的元素
      • addedNodes 被新增的節點
      • removedNodes 被移除的節點
      • attributeName 變動的屬性
      • oldValue 變動前的值
  • .observe(元素, 設定) 使用設定觀察指定的元素
    • childList 是否觀察下一層元素的增減
    • subtree 是否觀察所有內層元素
    • attributes 是否觀察屬性變動
    • characterData 是否觀察內容變動
    • attributeOldValue 是否紀錄舊屬性
    • characterDataOldValue 是否紀錄舊內容
    • attributeFilter 指定觀察的屬性名稱，沒設定就是全部
  • .takeRecords() 取得並移除已經發生但尚未處理記錄
  • .disconnect() 停止觀察

Resize Observer ​

當觀察的 DOM 元素縮放時會觸發

  • 使用 new ResizeObserver(function) 建立
    • function 的 mutations 參數陣列，裡面包含所有變動的紀錄
      • target 變動的元素
      • contentRect 元素的寬高與座標
      • borderBoxSize.blockSize 元素的高度
      • borderBoxSize.inlineSize 元素的寬度
      • contentBoxSize.blockSize 元素的高度
      • contentBoxSize.inlineSize 元素的寬度
  • .observe(元素, 設定) 使用設定觀察指定的元素
    • 設定以 box 調整觀察元素的寬高計算方式
      • content-box 元素的寬高不包含邊框
      • border-box 元素的寬高包含邊框
  • .disconnect() 停止觀察
  • .unobserve(元素) 停止觀察某元素

Intersection Observer ​

當元素相交時會觸發

  • 使用 new IntersectionObserver(function, 設定) 建立
    • function 參數
      • entries 是一個陣列，裡面包含所有相交的元素
      • owner 是 IntersectionObserver 的設定
    • 設定參數
      • root 以哪個元素為依據，預設為 null，表示以瀏覽器的可視窗口作為依據
      • rootMargin 計算相交時的偏移量
      • threshold 設定觸發的比例門檻，若設定為 0.5，則元素 50% 出現和離開就會觸發，也可以設定為陣列
  • .observe(元素) 觀察元素
  • .disconnect() 停止觀察
  • .unobserve(元素) 停止觀察某元素

應用範例 ​

圖片 Lazy load

無限滾動 Infinite scroll

+ + + + \ No newline at end of file diff --git a/intro/before-start.html b/intro/before-start.html new file mode 100644 index 00000000..090df498 --- /dev/null +++ b/intro/before-start.html @@ -0,0 +1,25 @@ + + + + + + 在開始之前 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

在開始之前 ​

在正式開始之前，我們先來了解一下這門課程的內容和學習方法

課程介紹 ​

學習方法 ​

程式語言和以往學校的國英數不一樣，需要大量的實作練習，不是死背就能學會的

程式學習三大原則

  • 不要死背，學習程式不像以往學校考試，作弊是可以的，隨時能查閱網路上的資料，現在也有許多 AI 輔助程式開發
  • 輸入後立刻輸出，學到的東西要立刻實作加深印象，不要只看不做
  • 只學習必要的部分，例如做一個簡單的時鐘，不需要從課本的第一頁看到最後一頁

程式學習五步驟

  • 思考想要開發的項目
  • 搜尋相關技術資料，或是詢問相關工程師、參加相關社群等
  • 使用低技術門檻的教材學習，例如 Udemy、MDN、W3Schools 等
  • 進行實作
  • 完成後再次嘗試開發新的項目

Markdown ​

Markdown 是一種輕量級標記式語言
目前有很多網站使用這個語法撰寫說明文件或文章，例如這個網站就是使用 Markdown 製作
在寫程式相關的筆記時，使用 Markdwon 比 Word 還要方便快速

相關連結:

如何問問題 ​

老師們不會通靈，也不可能 24 小時待命回答你的問題
老師們也不是電腦，不要問程式這樣寫行不行，實際跑跑看就知道行不行了
老師們也不是 Google 搜尋引擎，請自己先上網尋找答案

離開職訓進到公司後，也不可能會有前輩隨時回答你的問題
所以請同學們先培養自己先試著解決問題的良好習慣

所以在你提問前，你應該

  • 先看過錯誤訊息
  • 先搜尋過錯誤訊息是什麼意思
  • 先搜尋過錯誤的解決方法
  • 先自己檢查過沒有錯字
  • 先看過說明文件
  • 先自己檢查該設定的有沒有設，該開啟的有沒有開啟

問問題前，也請注意

  • 描述越詳細越好
  • 附上你的程式碼以及錯誤訊息
  • 如果你找到的方法不能用，把你找的方法也一起傳過來
  • 如果你覺得打字描述太慢，你可以直接進語音頻道開螢幕分享，或是 Live Share

當你要附上你的程式碼時，可以的話千萬不要傳白底黑字的純文字
程式碼和一般的文章不同，白底黑字非常難閱讀
有非常多地方提供程式碼分享服務，例如

Discord 文字訊息支援粗體、斜體、刪除線、程式碼標記等 Markdown 語法
當你在 Discord 傳程式碼時請使用程式碼標記，方便同學與老師閱讀

錯誤示範
正確示範

延伸閱讀

程式設計小遊戲 ​

Google 小遊戲
Google 小遊戲
Code.org 一小時玩程式
Code.org 一小時玩程式
Code Combat
Code Combat
RABBIDS CODING
RABBIDS CODING
+ + + + \ No newline at end of file diff --git a/jquery/animation.html b/jquery/animation.html new file mode 100644 index 00000000..ecb47fc4 --- /dev/null +++ b/jquery/animation.html @@ -0,0 +1,184 @@ + + + + + + jQuery - 動畫 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

jQuery - 動畫 ​

使用 jQuery 編寫動畫效果

語法 ​

jQuery 所有的動畫都是基於 .animate()語法
原理是在指定的時間內將 CSS 的值改為指定的數值

  • .animate(CSS, slow/fast/毫秒, 'linear', 完成時的 function ) 動畫
    • CSS 要改變的 CSS 屬性，可以用 += 和 -= 去做相對的動畫，必填
    • slow/fast/毫秒 動畫時間，預設為 400
    • linear 動畫效果，預設為 swing
    • 完成時的 function 動畫完成後要執行的 function
  • .stop(是否停止之後的動畫, 是否跳到動畫結束) 停止動畫
  • .fadeOut(slow/fast/毫秒, 'linear', 完成時的 function) 淡出
  • .fadeIn(slow/fast/毫秒, 'linear', 完成時的 function) 淡入
  • .fadeTo(slow/fast/毫秒, 透明度, 'linear', 完成時的 function) 淡出或淡入至指定透明度
  • .fadeToggle(slow/fast/毫秒, 'linear', 完成時的 function) 切換淡入或淡出
  • .slideDown(slow/fast/毫秒, 'linear', 完成時的 function) 滑入，遞增 height 至原本高度
  • .slideUp(slow/fast/毫秒, 'linear', 完成時的 function) 滑出，遞減 height 至 0
  • .slideToggle(slow/fast/毫秒, 'linear', 完成時的 function) 切換滑入或滑出

注意

  • .fadeOut() 的淡出效果在透明度變為 0 後會加上 display: none
  • .animate() 僅能修改值為數字的 CSS，若需修改顏色，需使用 jQuery UI

TIP

jQuery 動畫預設只有 swing 和 linear 兩種效果
若要使用其他效果，需引入 jQuery UI

應用範例 ​

圖片輪播範例

卡片範例

+ + + + \ No newline at end of file diff --git a/jquery/cards.html b/jquery/cards.html new file mode 100644 index 00000000..59176665 --- /dev/null +++ b/jquery/cards.html @@ -0,0 +1,128 @@ + + + + + + 翻牌記憶小遊戲 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

翻牌記憶小遊戲 ​

製作翻牌記憶小遊戲，練習 jQuery 以及 CSS 3D

範例 ​

作業

美化你的遊戲，或加入更多的功能

+ + + + \ No newline at end of file diff --git a/jquery/dom.html b/jquery/dom.html new file mode 100644 index 00000000..7b840a5f --- /dev/null +++ b/jquery/dom.html @@ -0,0 +1,137 @@ + + + + + + jQuery - DOM | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

jQuery - DOM ​

抓取 ​

使用 $(選擇器) 抓取元素

  • .length 取到的元素數量
  • .eq(索引) 指定取到的第幾個元素
  • .index() 取得元素是同一層的第幾個
  • .each(function) 迴圈每個元素
    • index 迴圈到的索引
    • element 迴圈到的元素，也可以用 this 代表
  • .filter(選擇器) 篩選符合條件的元素
  • .not(選擇器) 篩選不符合條件的元素
  • .find(選擇器) 在所有下層找符合指定選擇器的元素
  • .children(選擇器) 在下一層找符合指定選擇器的元素，不填就是所有
  • .prev(選擇器) 同一層前一個，可以用選擇器過濾，不填就是所有
  • .prevAll(選擇器) 同一層前面所有，可以用選擇器過濾，不填就是所有
  • .prevUntil(選擇器) 同一層前面直到選擇器間的東西，不含頭尾
  • .next(選擇器) 同一層後一個，可以用選擇器過濾，不填就是所有
  • .nextAll(選擇器) 同一層後面所有，可以用選擇器過濾，不填就是所有
  • .nextUntil(選擇器) 同一層後面直到選擇器間的東西，不含頭尾
  • .siblings() 同一層的其他東西
  • .parent() 上一層，可以用選擇器過濾
  • .parents() 所有上層，可以用選擇器過濾
  • .parentsUntil(選擇器) 往上層找直到選擇器間的東西
  • .closest(選擇器) 上層第一個符合選擇器的元素

注意

指定第幾個元素一定要使用 .eq()，不要直接用 [索引]
使用 [索引] 會變成原生 JS 的 DOM 元素

js
console.log($('div')[0].innerText)
+console.log($('div').eq(0).text())

注意

jquery 函式內的 function 盡量不要使用箭頭函式
因為可以使用 $(this) 代表迴圈到的元素或發生事件的元素

js
// 第三個 h1
+$("h1").eq(2)
+
+// 第一個 .class
+$(".class").eq(0)
+
+// #id
+$("#id")
+
+// .index() 取得元素是同一層的第幾個
+$('.card').index()
+
+// .each() 迴圈每個元素
+$('div').each(function(index, element){
+  console.log(index, element, $(this))
+})
+
+// .filter() 篩選符合條件的元素
+$('div').filter('.card')
+
+// .not() 篩選不符合條件的元素
+$('a').not('.nav')
+
+// .find() 在裡面找符合指定選擇器的元素
+$("#target").find("div").eq(2)
+
+// .children() 在下一層找符合指定選擇器的元素
+$("#target").children(".card")
+
+// .prev() 同一層前一個
+$('#target').prev()
+// .prevAll() 同一層前面所有
+$('#target').prevAll()
+// .prevUntil() 同一層前面直到選擇器間的東西
+$('#target').prevUntil('#target2')
+
+// .next() 同一層後一個
+$('#target').next()
+// .nextAll() 同一層後面所有
+$('#target').nextAll()
+// .nextUntil() 同一層後面直到選擇器間的東西
+$('#target').nextUntil('#target2')
+
+// .siblings() 同一層的其他東西
+$('#target').siblings()
+
+// .parent() 上一層
+$("#target").parent()
+// .parents() 所有上層
+$("#target").parents()
+// .parentsUntil() 往上層找直到選擇器間的東西
+$("#target").parentsUntil("#target2")
+// .closest() 選擇器篩選出來最近的一個
+$("#target").closest("div")

修改 ​

  • .text() 文字
  • .html() HTML
  • .val() 輸入欄位的值
  • .attr() 標籤屬性
  • .css() 行內樣式
  • .addClass() 新增 class
  • .removeClass() 移除 class
  • .hasClass() 是否有 class
  • .prepend() 裡面的第一個東西前插入 html
  • .append() 裡面的最後一個東西後插入 html
  • .insertBefore(元素或HTML) 把東西放到指定的前面，填現有的元素是移動，HTML 是新增
  • .insertAfter(元素或HTML) 把東西放到指定的後面，填現有的元素是移動，HTML 是新增
  • .remove() 刪除元素

TIP

jQuery 可以一次對選擇到的元素做修改，不需要使用迴圈

js
$('li').each(function() {
+  $(this).addClass('text-red');
+});
+
+$('li').addClass('text-red');
js
// .text() 取得文字
+console.log( $('h1').eq(0).text() )
+// .text() 修改文字
+$('h1').eq(1).text('Hi');
+
+// .html() 取得 HTML
+console.log( $('h1').eq(2).html() )
+// .html() 修改 HTML
+$('h1').eq(2).html('<a href='https://google.com'>Google</a>');
+
+// .val() 取得輸入欄位的值
+console.log( $('#input-password').val() )
+// .val() 修改輸入欄位的值
+$('#input-password').val('Hello')
+
+// .attr() 取得標籤屬性
+console.log( $('#img').attr('src') )
+// .attr() 修改標籤屬性
+$('#img').attr('src', 'picsum.jpg')
+
+// .css() 取得行內樣式
+console.log( $('h1').css('color') )
+// .css() 修改行內樣式
+$('h1').css('color', 'red')
+// .css() 修改多個行內樣式
+$('h1').css({ 'color': 'red', 'font-size': '50px' })
+
+// .addClass() 新增 class
+$('h1').eq(0).addClass('blue big');
+// .removeClass() 移除 class
+$('h1').eq(0).removeClass('blue');
+// .hasClass() 是否有 class
+$('h1').eq(0).hasClass('blue big');
+
+// .prepend() 裡面的第一個東西前插入 html
+$("#target").prepend("<p>前面新的</p>")
+// .append() 裡面的最後一個東西後插入 html
+$("#target").append("<p>後面新的</p>")
+// .insertBefore() 把東西放到指定的前面
+$('<p>前面</p>').insertBefore('#target')
+// .insertAfter() 把東西放到指定的後面
+$('<p>後面</p>').insertAfter('#target')
+
+// .remove() 刪除元素
+$('#target').remove()

事件 ​

  • 部分常用事件已經有對應的函式
    • .click()
    • .submit()
    • .load()
    • .mouseenter()
    • .mouseleave()
    • .mousemove()
  • 其他事件需使用 .on() 綁定
js
// 使用事件的函式
+// .事件名稱(function(){})
+// 有 function 是事件處理，沒有則是觸發事件 
+// 只有部分常用事件有這種寫法
+$('#mybtn').click(function(){});
+
+// 使用 .on()
+// .on(事件名稱, function(){})
+$('#mybtn').on('click', function(){
+  alert('你好棒');
+})

綜合練習 ​

練習

點按鈕換圖片

  • 原本圖片是科技高中校長
  • 點按鈕後換成書曼
  • 再點一下換成校長

練習

製作待辦清單

  • 一個文字輸入欄位，一個新增按鈕和一個清單
  • 在欄位輸入文字後，點按鈕會將輸入欄位的字新增到清單
  • 每一項都有刪除按鈕，點擊時可以刪除那個按鈕的項目

練習

製作丙級第二題健康天地標籤面板，點按鈕時切換顯示內容
可能會用到函式:

  • .show() 顯示div
  • .hide() 隱藏div

兩種做法:

  1. 點按鈕換文字
  2. 四個div，點按鈕換顯示的div
+ + + + \ No newline at end of file diff --git a/jquery/zombie.html b/jquery/zombie.html new file mode 100644 index 00000000..691b4e9b --- /dev/null +++ b/jquery/zombie.html @@ -0,0 +1,121 @@ + + + + + + 打殭屍小遊戲 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

打殭屍小遊戲 ​

製作打殭屍小遊戲，練習 jQuery 的 DOM 操作和動畫

範例 ​

作業

美化你的遊戲，或加入更多的功能

+ + + + \ No newline at end of file diff --git a/node/intro.html b/node/intro.html new file mode 100644 index 00000000..0e990d19 --- /dev/null +++ b/node/intro.html @@ -0,0 +1,116 @@ + + + + + + 認識 Node.js | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

認識 Node.js ​

認識 Node.js 的結構

結構 ​

package.json ​

package.json 和 package-lock.json 記錄了這個 Node.js 專案的資訊

json
{
+  // 專案使用 ECMAScript 語法
+  "type": "module",
+  // 專案名稱
+  "name": "test",
+  // 版本
+  "version": "1.0.0",
+  // 說明
+  "description": "",
+  // 切入點，編寫套件給別人引用時才需要
+  "main": "index.js",
+  // npm 指令
+  "scripts": {
+    "start": "node index.js"
+  },
+  // 作者
+  "author": "",
+  // 版權
+  "license": "ISC",
+  // 使用套件
+  "dependencies": {
+  },
+  // 開發環境使用套件
+  "devDependencies": {
+  }
+}

在專案的資料夾使用 npm init 初始化專案時會自動產生

node_modules ​

node_modules 資料夾存放這個專案用到的所有套件
使用指令 npm install 會自動讀取 package.json 安裝所有套件

模組化 ​

注意

JavaScript 語法標準分為 CommonJS 和 ECMAScript
CommonJS 是 Node.js 使用的語法標準，在匯出匯入使用的語法是 require / module.exports
ECMAScript 是瀏覽器使用的語法標準，在匯出匯入使用的語法是 import / export
若要在 Node.js 專案使用 ECMAScript，必須要另外做設定，或是安裝套件 瀏覽器在模組化開發也有一些限制，不是隨便就能用 import / export

模組化開發的概念，就像是組電腦一樣

js
import I牌CPU
+import 主機板
+import N牌顯示卡
+import 記憶體
+import 硬碟
+import 電源供應器
+
+PC.build(I牌CPU, 主機板, N牌顯示卡, 記憶體, 硬碟, 電源供應器)

模組化好處就是方便抽換，如果想換別家的東西，只需要把想換的地方改掉就好，其他地方不用動

js
import A牌CPU
+import 主機板
+import A牌顯示卡
+import 記憶體
+import 硬碟
+import 電源供應器
+
+PC.build(A牌CPU, 主機板, A牌顯示卡, 記憶體, 硬碟, 電源供應器)

注意

  • 一個檔案裡面只能有一個預設匯出
  • 具名匯出時必須使用宣告變數的寫法
  • 匯入時寫相對路徑 ./、../ 等代表匯入檔案，直接寫名字則是匯入套件
  • 匯入的變數是 const，不能修改值

預設匯出/匯入 ​

export.js

js
const num1 = 1
+const num2 = 2
+const add = (num1, num2) => {
+  return num1 + num2
+}
+
+export default {
+  num1, num2, add
+}

import.js

js
import numbers from './export.js'
+console.log(numbers.num1) // 1
+console.log(numbers.num2) // 2
+const addnum = numbers.add(1, 2)
+console.log(addnum) // 3

具名匯出/匯入 ​

export.js

js
const number1 = 10
+const number2 = 20
+export const a = "a"
+export const b = "b"
+export const c = number1 + number2

import.js

js
// 具名個別匯入
+// import {} from 
+// {} 放要引用的變數
+// 如果怕變數名稱跟檔案內的重複，可以使用 as 重命名
+import { a as aa, b } from './export.js'
+console.log(aa) // a
+console.log(b)  // b
+
+// 具名一次匯入
+// import * from
+// 也可以使用 as 重命名
+import * as apple from './export.js'
+console.log(apple.a)  // a
+console.log(apple.b)  // b
+
+// 也可以同時引用具名和預設
+// import 預設, 具名 from 檔案
+import apple, {a} from './export.js'
+console.log(apple.num1) // 1
+console.log(a)          // a

簡易網頁伺服器 ​

js
// 引用 node.js 的內建 http 套件
+import http from 'http'
+// 建立網頁伺服器
+const server = http.createServer((req, res) => {
+  // 回應狀態碼 200
+  res.writeHead(200)
+  // 寫入回應內容
+  res.write('hello')
+  // 回應結束
+  res.end()
+})
+// 在 8080 埠啟動伺服器
+server.listen(8080, () => {
+  console.log('http://localhost:8080')
+})

輸入指令執行

js
// 使用 node 指令
+node index.js
+// 或使用在 package.json 定義的指令
+npm run start
+ + + + \ No newline at end of file diff --git a/node/line.html b/node/line.html new file mode 100644 index 00000000..8640bfa6 --- /dev/null +++ b/node/line.html @@ -0,0 +1,62 @@ + + + + + + Ch.21 開放資料 LINE 機器人 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Ch.21 開放資料 LINE 機器人 ​

使用 Node.js 製作一個查詢開放資料的 LINE 機器人

架構 ​

前置作業 ​

LINE ​

  • 到 LINE Developers 註冊開發帳號
  • 建立 Provider，CHANNEL 選擇 Messaging API
  • 填寫機器人帳號資訊
  • 關閉自動回覆訊息

ngrok ​

由於 LINE 只接收 HTTPS 資料
所以我們需要使用 ngrok 幫我們做中介

  • 使用 npm install -g ngrok 下載
  • 使用 ngrok http -region jp 3000 使用日本節點並監聽 3000 port
  • 編輯 LINE 機器人的 webhook 網址

製作機器人 ​

安裝套件 ​

  • 安裝 Node.js 套件
    js
    // 存檔時自動重新啟動，安裝為開發環境套件
+npm install -D nodemon
+// 讀取環境設定檔
+npm install dotenv
+// line 機器人套件
+npm install linebot
+// 使用 axios
+npm install axios
  • 安裝 VSCode 套件 ESLint 並新增下面的設定，驗證程式碼並保持風格一致
    json
    "editor.codeActionsOnSave": {
+  "source.fixAll.eslint": true
+},

nodemon ​

使用 nodemon 套件能在檔案存檔時自動重啟 Node.js
只需要在 package.json 將啟動的 node 改成 nodemon 就好

json
"scripts": {
+  // 開發用指令，自動重新啟動
+  "dev": "nodemon index.js",
+  // 正式環境用指令，雲端服務不需要自動重新啟動
+  "start": "node index.js"
+},

dotenv ​

使用 dotenv 套件能讓 Node.js 讀取環境設定檔 .env
將 LINE 機器人的 ID 等資訊寫入環境設定檔，避免上傳 Github 時洩漏資訊

  • 建立 .env 檔並輸入環境設定
    CHANNEL_ID=""
+CHANNEL_SECRET=""
+CHANNEL_ACCESS_TOKEN=""
  • 在 Node.js 內引用套件
    js
    import 'dotenv/config'
  • 以 process.env.變數名稱 使用環境變數

linebot ​

使用 linebot 套件能製作 LINE 機器人
詳細的訊息事件可以參考 LINE 文件

js
// 引用套件
+import linebot from 'linebot'
+
+// 設定機器人
+const bot = linebot({
+  channelId: process.env.CHANNEL_ID,
+  channelSecret: process.env.CHANNEL_SECRET,
+  channelAccessToken: process.env.CHANNEL_ACCESS_TOKEN
+})
+
+// 當收到訊息時，event 包含了訊息的類型、文字等
+bot.on('message', event => {
+  // event.message.text 為使用者傳送的文字
+  let text = event.message.text
+  // event.reply 為回覆訊息
+  event.reply(event.message.text)
+});
+
+// 設定機器人監聽 port
+bot.listen('/', process.env.PORT || 3000);

fs ​

如果你是用 flex 訊息，卻不知道哪裡錯
用 fs 套件將 flex 訊息印成檔案 debug
這個套件是內建的，不需要另外安裝

js
import fs from 'fs'
+
+fs.writeFileSync('./flex.json', JSON.stringify(flex, null, 2))

部署 ​

  • 註冊 Render 帳號，建立新的 Web Service
  • 建立時打開 Advanced，或建立後在 Environment 的 Environment Variable 輸入機器人 TOKEN 等環境變數，不須輸入 PORT

期中作業

製作一個查詢公開資料的 LINE 機器人，並部署到 Render
參考範例: isthereanydeal 遊戲查價機器人

+ + + + \ No newline at end of file diff --git a/others/git.html b/others/git.html new file mode 100644 index 00000000..883bc261 --- /dev/null +++ b/others/git.html @@ -0,0 +1,25 @@ + + + + + + Git | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Git ​

學習版本控管觀念、GitHub 及 GitKraken 工具

介紹 ​

Git 是一種分散式版本的版本控制系統，有免費、體積小、分散式的優點

  • 只有保存檔案的差異，而不是整個檔案，所以儲存的體積比較小
  • Git 版本控管就像時光機，能隨時將目錄切換到某個版本時的狀態
  • 分散式系統不必隨時和伺服器溝通，所以就算沒有網路也能使用

使用 Git 之前的檔案可能會是這樣子

使用 Git 之後，能清楚看到什麼時候修改了什麼檔案

注意

Git 無法檢視 PSD、AI 等非文字檔案修改了哪些東西

專有名詞 ​

  • Repository: 儲存庫
  • Stage: 暫存檔案，等待提交
  • Commit: 提交，保存修改紀錄
  • Init: 初始，用在建立Repo，Repo建立後必須要有第一次commit (First commit 或 Init commit)
  • Clone: 複製，從遠端複製一份到電腦
  • Pull: 拉，把資料從遠端下載到電腦
  • Push: 推，把資料從電腦上傳到遠端
  • Branch: 分支
  • Merge: 合併分支
  • Checkout: 切換分支
  • Local: 本機
  • Remote: 遠端伺服器

GitHub ​

GitHub 是一個提供 Git 服務的平台，有許多的開源專案 除了 GitHub 外，還有其他提供 Git 服務的平台，如 GitLab 與 Bitbucket
比較特別的是 GitLab，因為它連整個平台都開源，所以你可以架設一個自己的 GitLab

注意

並不是所有儲存在 Git 服務平台的資料都安全，還是要養成定期備份的習慣
搶修反而錯刪！GitLab損失300GB正式環境資料，5千專案遭波及

專有名詞 ​

  • Pull Request: 分支合併請求
  • Issue: 議題，回報問題、提出建議與討論
  • Watch: 關注，接收儲存庫的通知、在首頁顯示動態
  • Fork: 複製一分別人的Repo到自己的帳號

GitKraken ​

GitKraken 是一個基本使用免費的 Git GUI 軟體，但若要在不公開的儲存庫使用則需要付費

除了這個以外，還有其他的 GUI 軟體，如

注意

將指定作業上傳至 GitHub Classroom，學習 Git 與 GitHub 的操作

+ + + + \ No newline at end of file diff --git a/others/nuxt.html b/others/nuxt.html new file mode 100644 index 00000000..41ed9d24 --- /dev/null +++ b/others/nuxt.html @@ -0,0 +1,282 @@ + + + + + + Nuxt.js | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Nuxt.js ​

Nuxt 是伺服器渲染版的 Vue.js，改善了 SEO 等問題。

Nuxt ​

Nuxt 使用了伺服器渲染的方式呈現網頁，相比原本的 Vue.js

  • 先將網頁內容渲染好後才傳送給使用者，相比原生 Vue.js 在下載網頁檔案後還需要等待呼叫 API
  • 能與 express 整合，所以能把後端的 API 一併寫在同一個專案裡面
  • 能自訂各頁面的 meta，改善 SEO 問題

安裝 ​

  • 使用 npx nuxi init 網站名稱 建立網站
  • 移除 app.vue 的 <NuxtWelcome /> 元件
  • 使用 npm i -D pug 安裝 Pug
  • 使用 npm i -D sass 安裝 Sass
  • 使用 npm run dev 開啟開發伺服器

DANGER

Nuxt 預設使用 TypeScript，所以會有 tsconfig.json 及 nuxt.config.ts
若沒有要使用 TypeScript，刪除 tsconfig.json 並將 nuxt.config.ts 改為 nuxt.config.js

引用資源 ​

  • assets 資料夾的內容會經過 Vite 處理，打包時加上 hash
  • public 資料夾的內容不會經過 Vite 處理

DANGER

Nuxt 不會提供 assets 內圖片的網址如 /assets/my-file.png
如果需要網址，需使用 public 資料夾

使用 assets 內圖片

html
<template>
+  <img src="~/assets/your_image.png" alt="" width="100">
+</template>
css
body {
+  background: url(~/assets/your_image.png)
+}

使用 public 內圖片

html
<template>
+  <img src="/img/your_image.png" alt="" width="100">
+  <img :src="img" alt="" width="100">
+</template>
+<script setup>
+const img = ref('/img/your_image.png')
+</script>
css
body {
+  /* public/img/your_image.png */
+  background: url(/img/your_image.png)
+}

Layout ​

建立一個 layouts 資料夾，可以自己放設定的版面
使用 <NuxtLayout> 元件讓頁面套用版面
預設套用 layouts/default.vue，若無此檔案須自己建立

html
<template>
+  <div id="main">
+    <NuxtLayout>
+      頁面內容
+    </NuxtLayout>
+  </div>
+</template>

也能套用自訂 layout
建立 layouts/版面名稱.vue 後將名稱傳入 NuxtLayout

html
<template>
+  <!-- 指定 -->
+  <NuxtLayout name="custom">
+    <NuxtPage />
+  </NuxtLayout>
+  <!-- 動態 -->
+  <NuxtLayout :name="layout">
+    <NuxtPage />
+  </NuxtLayout>
+</template>
+
+<script setup>
+const layout = ref('custom')
+</script>

或是在元件內各別定義

html
<script setup>
+definePageMeta({
+  // 這裡也能設定 layout
+  // 設定 layout: false 能停用外層定義的 layout
+  layout: 'custom',
+  title: 'My home page'
+})
+
+const route = useRoute()
+
+console.log(route.meta.title) // My home page
+</script>

路由 ​

Nuxt 會自動讀取 pages 資料夾的檔案，自動產生路由設定
_ 開頭的檔名代表路由參數變數名稱 Nuxt 裡的 router-view 名為 NuxtPage
Nuxt 裡的 router-link 名為 NuxtLink

pages/
+--| user/
+-----| index.vue
+-----| [id].vue
+--| index.vue
js
routes: [
+  {
+    name: 'index',
+    path: '/',
+    component: 'pages/index.vue'
+  },
+  {
+    name: 'user',
+    path: '/user',
+    component: 'pages/user/index.vue'
+  },
+  {
+    name: 'user-id',
+    path: '/user/:id',
+    component: 'pages/user/[id].vue'
+  }
+]

Pinia ​

  • 使用 npm install @pinia/nuxt 安裝
  • nuxt.config.js 寫入設定
    js
    export default defineNuxtConfig({
+  // ... other options
+  modules: [
+    // ...
+    '@pinia/nuxt'
+  ]
+})
  • 使用方式和平常一樣

非同步資料 ​

非同步資料語法分下列幾種

  • useAsyncData 載入頁面前先取得資料
  • useLazyAsyncData 等頁面載入完後再取資料
  • useFetch 取得資料的方法，在載入頁面前執行
  • useLazyFetch 取得資料的方法，在載入頁面後執行，需處理沒有拿到資料的情況

useAsyncData

html
<template>
+  <pre>{{ data }}</pre>
+</template>
+<script setup>
+// useAsyncData(key, function, options)
+// key 指定不同的值讓 nuxt 正確的更新資料，沒提供的話會根據程式碼檔名和行數自動產生
+// function 產生資料的 function
+// $fetch 為 ohmyfetch 套件，內建在 nuxt 裡 https://github.com/unjs/ohmyfetch
+// options 設定 https://v3.nuxtjs.org/api/composables/use-async-data#params
+const { data, pending, error, refresh } = await useAsyncData('events', () => $fetch('https://kktix.com/events.json'))
+</script>

useLazyAsyncData

html
<template>
+  <p v-if='pending'>載入中</p>
+  <pre v-else>{{ data }}</pre>
+</template>
+<script setup>
+// useLazyAsyncData(key, function, options)
+// key 指定不同的值讓 nuxt 正確的更新資料，沒提供的話會根據程式碼檔名和行數自動產生
+// function 產生資料的 function
+// $fetch 為 ohmyfetch 套件，內建在 nuxt 裡 https://github.com/unjs/ohmyfetch
+// options 設定 https://v3.nuxtjs.org/api/composables/use-async-data#params
+// 注意 data 初始值是 null
+const { data, pending, error, refresh } = useLazyAsyncData('events', () => $fetch('https://kktix.com/events.json'))
+
+// 注意 data 初始值是 null，無法立即取得資料，但是可以 watch 偵測變更
+watch(data, (newData) => {
+  console.log('data 更新')
+})
+</script>

useFetch

html
<template>
+  <pre>{{ data }}</pre>
+</template>
+<script setup>
+// useFetch 是 useAsyncData 簡化版
+// 包裝了 useAsyncData 和 $fetch 並根據網址自動產生 key
+const { data, pending, error, refresh } = await useFetch('https://kktix.com/events.json')
+</script>

useLazyFetch

html
<template>
+  <p v-if='pending'>載入中</p>
+  <pre v-else>{{ data }}</pre>
+</template>
+<script setup>
+// useFetch 是 useLazyAsyncData 簡化版
+// 包裝了 useLazyAsyncData 和 $fetch 並根據網址自動產生 key
+const { data, pending, error, refresh } = useLazyFetch('https://kktix.com/events.json')
+
+// 注意 data 初始值是 null，無法立即取得資料，但是可以 watch 偵測變更
+watch(data, (newData) => {
+  console.log('data 更新')
+})
+</script>

呼叫 refresh 重新取得資料

html
<template>
+  <input type="button" @click="showPrev" value="prev" />
+  <pre>{{ data }}</pre>
+  <input type="button" @click="showNext" value="next" />
+</template>
+<script setup>
+const id = ref(1);
+
+const { data, refresh } = await useFetch(
+  // 使用 function 動態產生資料網址
+  () => `https://jsonplaceholder.typicode.com/todos/${id.value}`
+);
+
+const showNext = () => {
+  id.value++
+  refresh()
+}
+
+const showPrev = () => {
+  id.value++
+  refresh()
+}
+</script>

或是使用 refreshNuxtData 重新取得資料

html
<template>
+  <input type="button" @click="refresh" value="更新" />
+  <p v-if='pending'>載入中</p>
+  <pre v-else>{{ data }}</pre>
+</template>
+<script setup>
+const id = ref(1)
+const { pending, data } = useLazyAsyncData('count', () => $fetch(`https://jsonplaceholder.typicode.com/todos/${id.value}`))
+
+const refresh = () => {
+  id.value++
+  // refreshNuxtData(key)
+  // 更新指定 key 的 useAsyncData 和 useLazyAsyncData 資料
+  refreshNuxtData('count')
+
+  // 若不提供 key 則是更新 useAsyncData、useLazyAsyncData、useFetch 和 useLazyAsyncData 的資料
+  // refreshNuxtData()
+}
+</script>

Plugin ​

Nuxt 沒有 main.js，所以安裝 Vue 相關套件時需要在 plugins 資料夾建立一個 js 檔

  • 檔案結尾是 .server.js 代表只在 server 執行
  • 檔案結尾是 .client.js 代表只在瀏覽器執行
  • 檔案結尾沒有 server 和 client 代表兩邊都執行

例如使用 vue-gtag 時，建立 plugins/vue-gtag.client.js

js
import VueGtag from 'vue-gtag-next'
+
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.use(VueGtag, {
+    property: {
+      id: 'GA_MEASUREMENT_ID'
+    }
+  })
+})

注意

部分 Vue 套件僅支援瀏覽器端執行，因為 server 端沒有 DOM 相關的變數

CSS ​

Nuxt 沒有 main.js，所以引用自己寫的 css 或外部 css 時，必須在 nuxt.config.js 引用
可以忽略副檔名，nuxt 會自動尋找檔案

js
// nuxt.config.js
+export default {
+  // 在 assets/ 裡找檔名為 main 的 CSS、Stylus 或其他預處理器的檔案
+  css: ['~/assets/main'],
+}

Meta ​

每個元件都可以使用 useHead 設定各自的 meta，或引用外部資源。

html
<script setup>
+const description = ref('site description')
+const image = ref('site image')
+useHead({
+  // 網站標題
+  title: 'About Us',
+  // 標題模板
+  // title 是本頁的 title
+  // 若沒設定則是使用 nuxt.config 的值
+  titleTemplate: (title) => {
+    console.log(title)
+    return title ? `${title} - Site Title` : 'Site Title';
+  },
+  // Meta
+  meta: [
+    { charset: 'utf-8' },
+    { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+    {
+      property: 'og:title',
+      content: route.meta.title
+    },
+    {
+      property: 'og:description',
+      content: description.value
+    },
+    {
+      property: 'og:image',
+      content: image.value
+    }
+  ],
+  // 外部 JS
+  script: [
+    {
+      src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'
+    },
+    {
+      src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js',
+      // 放在 body
+      body: true
+    }
+  ],
+  // 外部 CSS
+  link: [
+    {
+      rel: 'stylesheet',
+      href: 'https://fonts.googleapis.com/css?family=Roboto&display=swap'
+    },
+    {
+      rel: 'stylesheet',
+      href: 'https://fonts.googleapis.com/css?family=Roboto&display=swap',
+      // 放在 body
+      body: true
+    }
+  ]
+})
+</script>

或是使用 Nuxt 內建元件設定

html
<template>
+  <Title>{{ title }}</Title>
+  <Meta name="description" :content="title" />
+</template>
+<script setup>
+const title = ref('aaa')
+</script>

或在 nuxt.config 設定

js
export default defineNuxtConfig({
+  app: {
+    head: {
+      title: 'Shop',
+      // 設定的 titleTemplate 只能放文字，%s 代表 title
+      titleTemplate: '%s - Shop'
+      meta: [
+        // <meta name="viewport" content="width=device-width, initial-scale=1">
+        { name: 'viewport', content: 'width=device-width, initial-scale=1' }
+      ],
+      script: [
+        // <script src="https://myawesome-lib.js"></script>
+        { src: 'https://awesome-lib.js' }
+      ],
+      link: [
+        // <link rel="stylesheet" href="https://myawesome-lib.css">
+        { rel: 'stylesheet', href: 'https://awesome-lib.css' }
+      ],
+      style: [
+        // <style type="text/css">:root { color: red }</style>
+        { children: ':root { color: red }', type: 'text/css' }
+      ],
+      noscript: [
+        // <noscript>Javascript is required</noscript>
+        { children: 'Javascript is required' }
+      ]
+    }
+  }
+})

打包 ​

  • 必須先執行 npm run build 指令打包檔案
  • 執行 node .output/server/index.mjs 開啟伺服器
+ + + + \ No newline at end of file diff --git a/others/pug.html b/others/pug.html new file mode 100644 index 00000000..d089ef3e --- /dev/null +++ b/others/pug.html @@ -0,0 +1,58 @@ + + + + + + Pug | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Pug ​

Pug 是 HTML 的預處理器
以縮排簡寫 HTML，減少程式碼數量

安裝 ​

  • 使用 npm install -g pug-cli 全域安裝
  • 建立 .pug 檔案
  • 使用 pug 路徑 指令就能編譯出 HTML，路徑可以是檔案或資料夾
    • 加上 -w 會自動偵測變更重新產生 HTML
    • 加上 -P 會自動格式化輸出的 HTML
    • 加上 -o 路徑 可以指定輸出位置

基本語法 ​

Pug 使用縮排代表標籤層級，所以編寫時必須注意排版

pug
//- 這是多行註解，使用時須注意縮排
+  這是多行註解，使用時須注意縮排
+  這是多行註解，使用時須注意縮排
+// 這是編譯後會顯示出來的註解，使用時須注意縮排
+  這是編譯後會顯示出來的註解，使用時須注意縮排
+  這是編譯後會顯示出來的註解，使用時須注意縮排
+//- 標籤只剩名字，class 和 id 直接用 . 和 # 加在標籤後
+//- 空一格放內文
+h1#title.text-white aaa
+//- 若是有 class 或 id 的 div 則可不必加標籤名稱
+.myclass#id
+  //- 以縮排代表層級
+  p hello
+  //- 屬性包在標籤後的 () 內
+  a.text-danger(href="https://google.com") Google
+  //- 屬性太多時可以換行，但要注意縮排
+  input(
+    type="text"
+    name="account"
+  )
+  //- div 內的純文字以 | 代表同一層
+  | abc123
html
<!-- 這是編譯後會顯示出來的註解，使用時須注意縮排
+這是編譯後會顯示出來的註解，使用時須注意縮排
+這是編譯後會顯示出來的註解，使用時須注意縮排
+-->
+<h1 class="text-white" id="title">aaa</h1>
+<div class="myclass" id="id">
+  <p>hello</p><a class="text-danger" href="https://google.com">Google</a>
+  <input type="text" name="account"/>
+  abc123
+</div>

Vite ​

在 Vite 使用則是要多安裝 pug

npm install -D pug

就能在 <template> 中使用 Pug

html
<template lang="pug">
+div
+  p Hello World
+</template>
+ + + + \ No newline at end of file diff --git a/others/vuepress.html b/others/vuepress.html new file mode 100644 index 00000000..af116b7d --- /dev/null +++ b/others/vuepress.html @@ -0,0 +1,100 @@ + + + + + + VuePress 網站 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

VuePress 網站 ​

使用 VuePress ，將 Markdown 筆記做成網站

安裝 ​

使用 npm crreate vuepress 網站名稱 建立網站，依序選擇設定

  • Select the boilerplate type 網站類型，docs 或是 blog
  • What's the name of your project? 網站名稱
  • What's the description of your project? 網站說明
  • What's your email? 信箱
  • What's your name? 作者名
  • What's the repo of your project. GitHub Repo

檔案結構 ​

主要檔案結構

.
+├── docs
+│   ├── .vuepress (VuePress 相關檔案)
+│   │   ├── components (自訂元件)
+│   │   ├── theme (主題檔案)
+│   │   │   └── ...
+│   │   ├── public (靜態資源)
+│   │   ├── styles (樣式)
+│   │   │   ├── index.styl (自動引入樣式)
+│   │   │   └── palette.styl (主題顏色樣式)
+│   │   ├── config.js (網站設定)
+│   │   └── enhanceApp.js (自訂網站 JS)
+│   │ 
+│   └── README.md (首頁)
+│
+├── package.json
+├── .gitignore
+└── README.md

網站設定 ​

注意

設定可能會因主題而異

docs/.vuepress/config.js 設定 VuePress 網站

js
module.exports = {
+  // 網站標題
+  title: 'Vuepress Docs Boilerplate',
+  // 網站說明
+  description: description,
+  // HEAD 設定
+  head: [
+    // [ 標籤名, { 屬性: 值, ... }]
+    ['meta', { name: 'theme-color', content: '#3eaf7c' }],
+    ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }],
+    ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }]
+  ],
+  // 主題設定，可能因網站主題而異
+  themeConfig: {
+    // 導覽列
+    nav: [
+      {
+        text: 'Guide',
+        link: '/guide/',
+      },
+      {
+        text: 'Config',
+        link: '/config/'
+      },
+      {
+        text: 'VuePress',
+        link: 'https://v1.vuepress.vuejs.org'
+      }
+    ],
+    // 側邊欄
+    sidebar: [
+      // 群組
+      {
+        // 標題
+        title: 'Group 1',
+        // docs 內的資料夾
+        path: '/foo/',
+        // 可否摺疊
+        collapsable: false,
+        // 內頁檔名，/ 代表 README.md
+        children: [
+          '/'
+        ]
+      },
+      
+    ]
+  },
+  // 插件，可以在 npm 使用 vuepress-plugin 尋找
+  plugins: [
+    '@vuepress/plugin-back-to-top',
+    '@vuepress/plugin-medium-zoom',
+  ]
+}

文章設定 ​

注意

設定可能會因主題而異

在每個文章最前面可以設定文章的標籤、分類等等
首頁可能會有其他設定

markdown
---
+date: 2020-07-06
+tag: 
+  - vue
+  - vuepress
+author: Kento
+---
+ + + + \ No newline at end of file diff --git a/vue/basic.html b/vue/basic.html new file mode 100644 index 00000000..73178362 --- /dev/null +++ b/vue/basic.html @@ -0,0 +1,463 @@ + + + + + + Ch.22 基礎 Vue.js | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Ch.22 基礎 Vue.js ​

認識 Vue 與基礎 Vue.js 語法

介紹影片 ​

工具 ​

架構 ​

Vue 的開發概念是把網頁轉換成一個一個的元件，拼湊出網頁
與 jQuery 最大的不同是使用 MVVM 的概念開發網頁，在開發 Vue 網頁時不需要寫 ViewModel

  • View 視圖
  • ViewModel 資料繫結器，用於連結視圖和資料
  • Model 資料

在網頁上引用 Vue.js 使用時架構如下

html
<div id="app">
+  <!-- HTML 部分 -->
+</div>
js
Vue.createApp({
+  setup () {
+  },
+  data () {
+    return {}
+  },
+  methods: {}
+}).mount('#app')

HTML 語法 ​

  • 模板語法和標籤的 v-text 可以將資料以文字方式輸出
    html
     <!-- {{ }} 裡面放 data 的名稱可以顯示文字 -->
+{{ name }} 的座號是 {{ number }}
+<span v-text="name"></span>
  • v-html 屬性可以將資料以 HTML 輸出
    html
    <!-- v-html 放 html 文字的 data 可以顯示 HTML -->
+<span v-html="html"></span>
  • 標籤內判斷式，符合條件才出現
    html
    <!-- 符合條件才出現在 DOM -->
+<p v-if="number == 1">number 為 1</p>
+<p v-else-if="number == 2">number 為 2</p>
+<p v-else>number 為 其他數字</p>
+
+<!-- 符合條件才顯示，不符合時是 display:none -->
+<p v-show="number == 1">number 為 1</p>
  • 標籤內迴圈
    html
    <ul>
+  <!-- v-for="(值, 索引) in 陣列" -->
+  <li v-for="(fruit, index) in fruits">
+    {{ fruit }}
+  </li>
+</ul>
  • 綁定屬性，使用 v-bind:屬性 或是 :屬性
    html
    <!-- <img v-bind:src="image" height="100px"> -->
+<img :src="image" height="100px">
+
+<!-- 綁定 style，裡面要放 json，key 是樣式名，value 是 data -->
+<img :src="image" :style="{border: '10px solid red'}" height="100px">
+<img :src="image" :style="{border: redBorder}" height="100px">
+<img :src="image" :style="myborder" height="100px">
+
+<!-- 綁定 class，裡面要放 json，key 是 class 名，value 是 true 或 false -->
+<p :class="{big: true, red: false}">123</p>
+
+<!-- v-model 綁定輸入欄位的 value -->
+<input type="text" v-model="modeltext">
+<!-- checkbox 和 radio 以 v-model 分組， v-model 是使用者選的值，value 是欄位的值-->
+<input type="checkbox" v-model="checkValue" :value="1">
+<input type="checkbox" v-model="checkValue" :value="2">
+<input type="radio" v-model="radioValue" :value="1">
+<input type="radio" v-model="radioValue" :value="2">
  • 事件，使用 v-on:事件 或是 @事件
    事件有 .prevent .stop 修飾符可以用
    鍵盤事件則有按鍵修飾符，如 @keydown.enter 和 @keydown.13
    html
    <!--
+  如果沒有要傳資料，可以只寫 function 名
+  如果 v-on 呼叫 function 時只寫名字，仍會收到一個 event 物件
+-->
+<input type="button" value="新增" @click="add">
+<input type="button" v-model="modeltext" @keydown.enter="add">
+<!--
+  如果可以帶資料進去時需要 event 事件的話
+  需要使用 $event 變數
+-->
+<input type="button"  keydown.enter="print('hi', $event)">

JS 語法 ​

JS 語法分為 Options API 與 Composition API
Composition API 是 Vue 3 的新語法，將所有元件的邏輯全部放到 setup() 裡面
若要在 Vue 2 使用需要安裝 @vue/composition-api

生命週期 ​

比較需要注意的生命週期有：

  • created Vue 元件被建立，無法存取 DOM
  • mounted Vue 元件被建立，可以存取 DOM
  • unmounted Vue 元件被銷毀時，如果有 setTimeout、setInterval 時需要在這時 clearTimeout、clearInterval，否則元件被銷毀仍然會執行

lifecycle

Options API ​

js
Vue.createApp({
+  // 元件的資料，JS 內呼叫要加 this
+  data () {
+    return {
+      firstName: '小明',
+      lastName: '王',
+      obj: {
+        name:1,
+        age:2,
+        job: {
+          j1: {
+            salary: 3
+          }
+        }
+      }
+    }
+  },
+  // computed 是 function 處理後產生的 data，值會在相依變數修改時動態更新
+  computed: {
+    fullName () {
+      return this.lastName + this.firstName
+    }
+  },
+  // 元件會使用到的 function，JS 內呼叫要加 this
+  methods: {
+    sayHello () {
+      console.log('你好，我是' + fullName.value)
+    },
+    emitEvent () {
+      this.$emit('customEvent', 'someValue')
+    },
+    print (text, event) {
+      console.log(text, event)
+    }
+  },
+  // 偵測
+  watch: {
+    // 文字、數字、布林的資料型態
+    firstName (newValue, oldValue) {
+      console.log(newValue, oldValue)
+    },
+    // 物件型態
+    obj (newValue, oldValue) {
+      console.log('obj 變更', newValue, oldValue)
+    },
+    // 深層監聽物件
+    obj: {
+      handler (newValue, oldValue) {
+        console.log('obj 變更', newValue, oldValue)
+      },
+      deep: true
+    },
+    // 監聽指定物件屬性
+    'obj.name' (newValue, oldValue) {
+      console.log('obj name 變更', newValue, oldValue)
+    }
+  },
+  // 生命週期
+  mounted () {
+    console.log('mounted')
+  }
+}).mount('#app')

Composition API ​

js
// 用解構方式提取需要的東西
+const { ref, reactive, computed, onMounted, watch } = Vue
+
+Vue.createApp({
+  // setup 可以代入兩個東西
+  // props 代表傳入元件的 props
+  // context 就是元件本身
+  setup(props, context) {
+    // 只有 HTML 有使用到的變數才需要 ref 與 reactive 綁定
+    // ref() 可接受所有種類的資料型態，但是不會偵測陣列和物件內部的變化
+    // 需要取值時寫成 變數名.value
+    const firstName = ref('小明')
+    const lastName = ref('王')
+    // reactive() 只能接受陣列和物件，會偵測陣列和物件內部變化
+    // 使用時不需要 .value
+    const obj = reactive({
+      name:1,
+      age:2,
+      job: {
+        j1: {
+          salary: 3
+        }
+      }
+    })
+
+    // computed
+    const fullName = computed(() => {
+      return lastName.value + firstName.value
+    })
+
+    // methods 直接寫一般的 function 就好
+    const sayHello = () => {
+      console.log('你好，我是' + fullName.value)
+    }
+
+    // 觸發事件的 $emit 寫法不一樣
+    const emitEvent = () => {
+      context.emit('customEvent', 'someValue')
+    }
+
+    // 偵測 ref 變更
+    watch(firstName, (newValue, oldValue) => {
+      console.log(newValue, oldValue)
+    })
+
+    // 偵測 reactive 全部屬性變更，無法取得 oldValue
+    watch(obj, (newValue, oldValue) => {
+      console.log('obj 變更', newValue, oldValue)
+    })
+    // 偵測 reactive 內一個屬性的變更，可以取得 oldValue
+    watch(() => obj.name, (newValue, oldValue) => {
+      console.log('obj.name 變更', newValue, oldValue)
+    })
+    // 偵測 reactive 內多個屬性的變更，可以取得 oldValue
+    watch([() => obj.name, () => obj.age], (newValue, oldValue) => {
+      console.log('obj.name 和 obj.age 變更', newValue, oldValue)
+    })
+    // 偵測 reactive 內屬性的變更，若屬性是 Object 的話需要 deep: true
+    watch(() => obj.job, (newValue, oldValue) => {
+      console.log('obj.job 變更', newValue, oldValue)
+    }, { deep: true })
+
+    // 生命週期相關的直接寫，不用回傳
+    onMounted(() => {
+      console.log('mounted')
+    })
+
+    // 只有 HTML 有使用到的 function 與變數才需要傳出去
+    return {
+      firstName,
+      lastName,
+      fullName,
+      sayHello,
+      emitEvent
+    }
+  }
+}).mount('#app')

存取 HTML 元素 ​

注意

若要存取的元素上有使用 v-if 判斷，且要在出現時存取
需等下次 Vue 渲染完 DOM，否則可能會抓取不到

js
const { nextTick } = Vue
+await nextTick()

$ref 可以綁定元素，類似 document.getElementById()
需要在 mounted 後使用

html
<h1 ref="mytext">文字文字</h1>
js
// Options API
+this.$refs.mytext
+
+// Composition API
+setup () {
+  const mytext = ref(null)
+  console.log(mytext.innerText)
+  return {
+    mytext
+  }
+}

練習

製作一個購物清單

  • 兩個字以上才能新增
  • 新增欄位邊框小於兩個字時是紅色，成功是藍色，空白是黑色
  • 已完成打勾
  • 可以保存資料到 localStorage
  • 個別刪除、全部刪除
  • 全部標記已完成、全部未完成
  • 請使用 Composition API

作業

製作進階待辦清單，必須要有下列功能：

  • 新增功能，兩個字以上才能新增
  • 小於兩個字時輸入欄位邊框是紅色，成功時是藍色，空白時是黑色
  • 每個項目有 checkbox 可以打勾標記已完成或未完成，完成的項目文字必須要有刪除線
  • 可以個別刪除清單項目
  • 可以將清單資料保存到 localStorage
  • 可以點兩下清單項目開啟編輯欄位
  • 在編輯欄位按 ENTER 可以儲存編輯
  • 在編輯欄位可以按 ESC 鍵可以取消編輯
  • 可以點按鈕過濾顯示全部項目、已完成項目、未完成項目
  • 可以顯示目前過濾的方式及過濾後的項目總數
  • 可以點按鈕一次刪除全部項目、已完成項目、未完成項目
  • 可以點按鈕將所有項目標記為已完成
  • 可以點按鈕將所有項目標記為未完成
  • 請使用 Composition API

提示：

  • 點兩下的事件為 @dblclick
  • 按 ESC 鍵的，事件為 @keydown.esc
  • 過濾可以使用 computed 搭配 .filter()

元件 ​

Vue 的開發概念是把網頁轉換成一個一個的元件，拼湊出網頁

建立與使用 ​

html
<!-- 宣告元件的 HTML 部分 -->
+<script type="text/x-template" id="counter">
+  <button @click="count++">你點擊了 {{ count }} 次</button>
+</script>

Vue 2

js
// Vue 2
+Vue.component('counter', {
+  // 元件模板
+  template: '#counter',
+  // 元件資料
+  data() {
+    return {
+      count: 0
+    }
+  }
+  // ...其他
+})
+
+new Vue({
+  //...略
+})

Vue 3

js
const app = Vue.createApp({
+  // ...略
+})
+app.component('counter', {
+  // 元件模板
+  template: '#counter',
+  // 元件資料
+  data() {
+    return {
+      count: 0
+    }
+  }
+  // ...其他
+})
+app.mount('#app')

傳入資料 ​

可以使用 props 將資料傳入子元件

html
<component v-for="post in posts" :posts="post"></blog-post>
js
// Options API
+props: {
+  // 傳入的資料名及類型
+  text: {
+    type: String,
+    validator(value) {
+      return ['success', 'warning', 'danger'].includes(value)
+    },
+    default () {
+      return ''
+    }
+  }
+}
+
+// Composition API
+props: {
+  text: {
+    type: String,
+    required: true,
+    validator(value) {
+      return ['success', 'warning', 'danger'].includes(value)
+    },
+    default () {
+      return ''
+    }
+  }
+},
+setup (props) {
+  // 整個 props 轉成 refs 並解構
+  const { text } = toRefs(props)
+  // 或是單獨轉成 ref 使用
+  const text = toRef(props, 'text')
+
+  console.log(text.value)
+}

傳出資料 ​

子元件傳出則需要使用 $emit

html
<!-- 外層 -->
+<component @btnClick="handleBtnClick"></component>
+<!-- 子元件內 -->
+<input type="button" @click="onBtnClick" value="點我">

元件觸發

js
// Options API
+const app = Vue.createApp({
+  methods: {
+    // 外部處理，會收到傳出的值
+    handleBtnClick (value) {
+      console.log(value) // 'abcd'
+    }
+  }
+}).component('component', {
+  methods: {
+    // 子元件觸發自訂義事件，名稱為 btnClick，將 'abcd' 帶出去
+    onBtnClick () {
+      this.$emit('btnClick', 'abcd')
+    }
+  }
+}).mount('#app')
+
+// Composition API
+const app = Vue.createApp({
+  setup() {
+    // 外部處理，會收到傳出的值
+    const handleBtnClick = (value) => {
+      console.log(value) // 'abcd'
+    }
+    return {
+      handleBtnClick
+    }
+  }
+}).component('component', {
+  setup(props, { emit }) {
+    // 子元件觸發自訂義事件，名稱為 btnClick，將 'abcd' 帶出去
+    const onBtnClick = () => {
+      emit('btnClick', 'abcd')
+    }
+    return {
+      onBtnClick
+    }
+  }
+}).mount('#app')

內外同步 ​

在 prop 前使用 v-model

html
<my-component v-model="data"></my-component>
js
// Options API
+props: {
+  data: String
+},
+computed:{
+  syncData:{
+    get(){
+      return this.data
+    },
+    set(value){
+      this.$emit('update:data',value)
+    }
+  }
+}
+
+// Composition API
+setup (props, { emit }) {
+  const syncData = computed({
+    get () {
+      return props.data
+    },
+    set (value) {
+      emit('update:data', value)
+    }
+  })
+}

子元件互傳資料 ​

子元件互傳可以建立一個 eventBus 幫忙，節省傳到外面再傳進去的程式碼
官方建議使用 mitt 或 tiny-emitter 等套件

以 mitt 為例

js
const emitter = mitt()
+
+// Options API
+app.component('component1', {
+  // ...
+  methods: {
+    count () {
+      // 觸發事件
+      emitter.emit('sayhi', 'hi')
+    }
+  }
+})
+app.component('component2', {
+  // ...
+  mounted () {
+    emitter.on('sayhi', e => {
+      console.log(e)
+    })
+  }
+})
+
+// Composition API
+app.component('component1', {
+  setup () {
+    const count = () => {
+      emitter.emit('sayhi', 'hi')
+    }
+    return {
+      count
+    }
+  }
+})
+app.component('component2', {
+  setup () {
+    onMounted(() => {
+      emitter.on('sayhi', e => {
+        console.log(e)
+      })
+    })
+  }
+})

provide/inject ​

上層使用 provide

js
// Options API
+{
+  data () {
+    string: 'abcd'
+  },
+  provide () {
+    return {
+      // 變數名: 值
+      string: this.string
+    }
+  }
+}
+
+// Composition API
+const { provide, ref } = Vue
+
+setup () {
+  const string = ref('abcd')
+  provide('string', string.value)
+}

子元件就能使用 inject 取得資料

js
// Options API
+{
+  // 陣列放變數名
+  inject: ['string'],
+  // 若需要預設值，或重新命名變數
+  inject: {
+    stringInjected: {
+      from: 'string',
+      default: 'abcd'
+    }
+  }
+  created () {
+    console.log(`data `+ this.stringInjected)
+  }
+}
+
+// Composition API
+const { inject, ref, onCreated } = Vue
+
+setup () {
+  const message = inject('message')
+  onCreated(() => {
+    console.log(message)
+  })
+}

插槽 ​

插槽可以在元件內預留一部分的 HTML 給呼叫元件的地方使用

在元件內用 slot 標籤，讓該部分的 HTML 由呼叫元件的地方自訂
slot 標籤內的東西會在沒有使用插槽時顯示 ，也可以不放東西

html
<button>
+  <slot>送出</slot>
+</button>

使用元件時將內容放進元件標籤內即可

html
<mytemplate>按鈕</mytemplate>

使用多個 slot 時必須要給插槽名字

html
<button>
+  <h1>
+    <slot name="title">標題</slot>
+  </h1>
+  <p>
+    <slot name="description">內文</slot>
+  </p>
+</button>

使用元件時將內容放進 template 標籤內即可

html
<mytemplate>
+  <template v-slot:title>
+    ABCDEFG
+  </template>
+  <!-- v-slot: 可以縮寫為 # -->
+  <template #description>
+    1234567
+  </template>
+</mytemplate>

若要在插槽內使用元件內的資料，必須將資料綁定到 slot 標籤

html
<button>
+  <h1>
+    <slot name="title" :data="someData" :data2="someData2"></slot>
+  </h1>
+</button>

使用時將資料解構出來

html
<component>>
+  <template #title="{data, data2}">
+    ABCDEFG
+  </template>
+</component>

練習

製作一個卡片收集頁

  • 卡片需用子元件製作，包含圖片、文字及按讚、收回讚按鈕
  • 需要有 5 張以上排列
  • 外層可以統計總共按了幾個讚
  • 請使用 Composition API
+ + + + \ No newline at end of file diff --git a/vue/packages.html b/vue/packages.html new file mode 100644 index 00000000..843c34e9 --- /dev/null +++ b/vue/packages.html @@ -0,0 +1,40 @@ + + + + + + Vite 的套件使用 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Vite 的套件使用 ​

使用 Vue 版 Font Awesome 以及 UI 工具

套件 ​

UI 套件 ​

部分套件不是使用 Vite，而是 Vue Cli 或是自己的工具

Font Awesome ​

vue-fontawesome 能以元件方式引用 svg icon

  • 安裝核心套件
    npm install @fortawesome/fontawesome-svg-core 
+npm install @fortawesome/vue-fontawesome@prerelease
  • 依需求安裝各類 icon
    npm install @fortawesome/free-solid-svg-icons
+npm install @fortawesome/free-regular-svg-icons
+npm install @fortawesome/free-brands-svg-icons
  • 在 main.js 引用套件和要使用的 icon，個別 icon 引用節省資源
    js
    // 必要引用
+import { library } from '@fortawesome/fontawesome-svg-core'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+
+// 根據 icon 的種類引用
+import { faCoffee } from '@fortawesome/free-solid-svg-icons'
+import { faGooglePlus } from '@fortawesome/free-brands-svg-icons'
+library.add(faCoffee, faGooglePlus);
+
+// 註冊元件
+createApp()
+  .component('font-awesome-icon', FontAwesomeIcon)
+  .mount()
  • 在需要使用 icon 的地方引用元件
    html
    <font-awesome-icon :icon="['fas', 'coffee']" />
+ + + + \ No newline at end of file diff --git a/vue/router-pinia-pwa.html b/vue/router-pinia-pwa.html new file mode 100644 index 00000000..97624378 --- /dev/null +++ b/vue/router-pinia-pwa.html @@ -0,0 +1,189 @@ + + + + + + Vue 的路由、狀態與 PWA | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Vue 的路由、狀態與 PWA ​

熟悉 Router 以及 Vuex，以及 PWA 設定

Router ​

Router 可以在使用者訪問指定路徑時載入指定的網頁元件，是開發 SPA 網站的套件

  • 輸入 npm i vue-router 安裝，或是 npm init vue@latest 時選擇
  • 設定路由，src/router/index.js 為路由設定檔
    js
    import { createRouter, createWebHashHistory } from 'vue-router'
+import Home from '@/pages/Home.vue'
+
+const router = createRouter({
+  history: createWebHashHistory(),
+  routes: [
+    {
+      // 路徑為根目錄，使用 home 元件
+      path: '/',
+      name: 'home',
+      component: Home
+    },
+    {
+      // 路徑為 /about，進入網址時才載入 about 元件
+      // 打包時另存為 about.xxx.js，需要時才讀取
+      path: '/about',
+      name: 'about',
+      component: () => import('@/pages/About.vue')
+    }
+  ]
+})
+
+export default router
  • 在 main.js 引用
    js
    import router from './router'
+createApp()
+  .use(router)
+  .mount()
  • 在 HTML 部分使用元件
    html
    <!-- 路由連結 -->
+<router-link to="/">Home</router-link>
+<!-- 顯示路由元件 -->
+<router-view></router-view>
  • 路由變數
    js
    // Option API 使用 $route 和 $router
+// $router 可以操作路由，$route 為路由資訊，只能讀取
+// 指定網址
+this.$router.push('home')
+this.$router.push({ path: 'home' })
+// 指定路由名稱
+this.$router.push({ name: 'user'})
+// 路由 query，register?plan=private
+this.$router.push({ path: 'register', query: { plan: 'private' }})
+// 取得路由資訊
+console.log(this.$route)
+
+// Composition API 使用 useRouter 和 useRoute
+import { useRouter, useRoute } from 'vue-router'
+const router = useRouter()
+const route = useRoute()
+// 指定網址
+router.push('home')
+router.push({ path: 'home' })
+// 指定路由名稱
+router.push({ name: 'user'})
+// 路由 query，register?plan=private
+router.push({ path: 'register', query: { plan: 'private' }})
+// 取得路由資訊
+console.log(route)

Pinia ​

Pinia 可以儲存網頁的狀態，讓元件間的資料共享更方便

  • 輸入 npm i pinia 安裝，或是 npm init vue@latest 時選擇
  • 在 main.js 引用
    js
    import { createPinia } from 'pinia'
+createApp()
+  .use(createPinia())
+  .mount()
  • 建立一個資料名稱為 ID 的檔案，若名稱為 user，則建立 src/store/user.js
    js
    import { defineStore } from 'pinia'
+// 定義一個 ID 為 user 的 store
+export const useUserStore = defineStore('user', {
+  // 初始狀態，使用箭頭函式
+  state: () => {
+    return {
+      name: '',
+      email: '',
+      age: 0
+    }
+  },
+  // 修改狀態用的 function
+  actions: {
+    setAge (value) {
+      this.age = value
+    }
+  },
+  // 可以先將資料處理好用傳出
+  getters: {
+    // 單純處理
+    isAdult () {
+      return this.age >= 18
+    }
+    // 從外部傳入資料處裡
+    isOlderThan () {
+      return age => {
+        return this.age >= age
+      }
+    }
+  }
+})
  • 在元件內使用
    html
    <script setup>
+import { storeToRefs } from 'pinia'
+// 引用 user store，可以直接對 user
+import { useUserStore } from './store/user'
+const user = useUserStore()
+// 存取 store、getter 值
+console.log(user.name, user.email, user.isOlderThan(100))
+// 或是解構配 storeToRefs 幫助，否則資料修改時不會動態更新
+const { name, email, age, isAdult, isOlderThan } = storeToRefs(user)
+// 使用 $patch 修改 store 資料
+user.$patch(state => {
+  state.age++
+})
+// 呼叫 action
+user.setAge(100)
+// 或是解構 action 後呼叫
+const { setAge } = user
+setAge(100)
+// 直接改也可以
+user.name = 100
+name = 100
+</script>
  • 元件外使用
    js
    import { useUserStore } from './store/user'
+
+router.beforeEach((to) => {
+  const user = useUserStore()
+  if (to.meta.login && !user.isLoggedIn) return '/login'
+})

PWA ​

注意

PWA 有使用限制:

  • 網址必須要有 https
  • 必須要有 manifest.json 檔案，會在 build 時根據設定自動產生
  • 必須要有 Service Worker，會在 build 時根據設定自動產生基本的底
  • 使用 npm i -D vite-plugin-pwa 安裝
  • 使用 Real Favicon Generator 或 Vue PWA asset generator 產生各種大小的 icon，放入 public
    vue-asset-generate -a 512px圖片路徑 -o ./public/img/icons
  • 在 vite.config.js 加入 PWA 設定
    js
    import { VitePWA } from 'vite-plugin-pwa'
+export default defineConfig({
+  plugins: [
+    VitePWA({
+      // https://web.dev/add-manifest/
+      manifest: {
+        // APP 名稱
+        name: 'Name of your app',
+        short_name: 'Short name of your app',
+        // APP 說明
+        description: 'Description of your app',
+        // APP 主題顏色
+        theme_color: '#ffffff',
+         // APP 顯示範圍
+        scope: './',
+        // APP 開始畫面網址
+        start_url: './',
+        // 顯示模式
+        // browser: 瀏覽器
+        // fullscreen: 全螢幕，隱藏所有瀏覽器 UI
+        // standalone: 隱藏標準瀏覽器 UI ，如 URL 欄
+        // minimal-ui: 有最小導覽列 UI
+        display: 'standalone',
+        // icon 路徑，./ 代表 public
+        icons: [
+          {
+            src: 'android-chrome-192x192.png',
+            sizes: '192x192',
+            type: 'image/png'
+          },
+          {
+            src: 'android-chrome-512x512.png',
+            sizes: '512x512',
+            type: 'image/png'
+          }
+        ]
+      }
+    })
+  ]
+})
  • 在 index.html 中加入 PWA 設定
    html
    <head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Your app title</title>
+  <meta name="description" content="Your app description">
+  <link rel="icon" href="/favicon.svg" type="image/svg+xml">
+  <link rel="alternate icon" href="/favicon.ico" type="image/png" sizes="16x16">
+  <link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
+  <link rel="mask-icon" href="/favicon.svg" color="#FFFFFF">
+  <meta name="theme-color" content="#ffffff">
+</head>
  • 在 main.js 註冊 service worker
    js
    import { registerSW } from 'virtual:pwa-register'
+registerSW({
+  onNeedRefresh () {},
+  onOfflineReady () {}
+})()

作業

製作一個番茄鐘，功能包括：

  • 使用者能新增、編輯、刪除待辦事項
  • 能保存已完成、未完成的事項
  • 使用者能選擇響鈴鈴聲
  • 能保存選擇的鈴聲
  • 每工作 25 分鐘，休息 5 分鐘
  • 倒數時間到響鈴
  • 倒數完後能自動開始倒數下一個休息時間或事項
  • 能開始、暫停與跳過倒數
  • 設定 GitHub Actions 自動打包部署
  • 使用 vite-plugin-pwa 設定 PWA
  • 設定社群分享資訊 (og meta 與 twitter meta)
+ + + + \ No newline at end of file diff --git a/vue/vite-sfc.html b/vue/vite-sfc.html new file mode 100644 index 00000000..d29624cd --- /dev/null +++ b/vue/vite-sfc.html @@ -0,0 +1,141 @@ + + + + + + Vite 與單元件檔案 | 前端班課程講義 + + + + + + + + + + + + + + +
前端班課程講義

主題

Vite 與單元件檔案 ​

使用 Node.js 的 Vue 開發工具 Vite

Vite ​

安裝 ​

Vite 是 Node.js 的 Vue 開發工具 方法一：

  • 使用 npm create vite 或 npm create vite 網站名稱 -- --template vue 建立使用 Vite 打包工具的網站，依需求選擇套件及設定
    • Project Name 專案名稱
    • Select a framework 選擇想要使用的框架
    • Select a variant 選擇是否使用 TypeScript 方法二:
  • 使用 npm init vue@latest 建立使用 Vite 的 Vue 網站
    • Project name 專案名稱
    • Add TypeScript 選擇是否使用 TypeScript
    • Add JSX Support 選擇是否使用 JSX
    • Add Vue Router for Single Page Application development 選擇是否使用 Vue Router
    • Add Pinia for state management 選擇是否使用 Pinia 管理狀態
    • Add Vitest for Unit testing 選擇是否使用單元測試
    • Add Cypress for both Unit and End-to-End testing 選擇是否使用 E2E 單元測試
    • Add ESLint for code quality 選擇是否使用 ESLint
    • Add Prettier for code formating 選擇是否使用 Prettier

目錄結構 ​

  • public 靜態資源，編譯網站時不會編譯
  • index.html 網站主體
  • src/assets 動態資源，編譯網站時會一起編譯，輸出的檔案會有流水號檔名
  • src/components 子元件資料夾
  • main.js 網站啟動時的切入點

預處理器 ​

  • 安裝 Pug 使用 npm i -D pug 後使用 <template lang="pug">
  • 安裝 Stylus 使用 npm i -D stylus 後使用 <style lang="stylus"> 或是在 main.js 加入 import './檔案路徑'
  • 安裝 SASS/SCSS 使用 npm i -D sass 後使用 <style lang="scss"> <style lang="sass"> 或是在 main.js 加入 import './檔案路徑'

Eslint ​

若使用方法一安裝，需手動安裝 ESLint

npm i -D eslint eslint-plugin-vue

在根目錄建立 .eslintrc.js 檔案

js
module.exports = {
+  root: true,
+  extends: [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+  ]
+}

若使用 Standard 語法規範，需手動安裝 @vue/eslint-config-standard

npm i -D @vue/eslint-config-standard

並手動新增至 .eslintrc.js

js
module.exports = {
+  root: true,
+  extends: [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/standard'
+  ]
+}

若使用 <script setup>，需要安裝 eslint-plugin-vue

npm i -D eslint-plugin-vue
js
module.exports = {
+  root: true,
+  extends: [
+    'plugin:vue/vue3-essential',
+    'plugin:vue/vue3-recommended',
+    'eslint:recommended',
+    '@vue/standard'
+  ]
+}

若使用 <script setup> 和 Pug，需要再安裝 eslint-plugin-vue-pug

npm i -D eslint-plugin-vue-pug
js
module.exports = {
+  root: true,
+  extends: [
+    'plugin:vue/vue3-essential',
+    'plugin:vue/vue3-recommended',
+    'plugin:vue-pug/vue3-recommended',
+    'eslint:recommended',
+    '@vue/standard'
+  ],
+  parserOptions: {
+    ecmaVersion: 'latest'
+  }
+}

路徑設定 ​

建議在 vite.config.js 設定 @/ 開頭的路徑指向 src 資料夾
這樣在引用資源時比較好管理路徑

js
import path from "path";
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {'@/': `${path.resolve(__dirname, 'src')}/`}
+  }
+})

單檔案元件 ​

Vite 開發工具可以使用單檔案元件，也就是 .vue 檔
.vue 檔內包含三個部分

  • <template> 為元件的 HTML，裡面只能有一個 HTML 元素
  • <style> 為元件的 CSS，加上 scoped 屬性的話裡面的 CSS 只會套用到這個元件
  • <script> 為元件的 Vue 程式碼，data、methods、setup 等等都放這裡，加上 setup 使用 Composition API 更方便

使用元件 ​

  • 在要引用的大元件的 <script> 引用
    js
    import Navbar from '../components/Navbar.vue'
  • 在 components 內宣告使用，若使用 <script setup> 則不需要
    json
    components: {
+  Navbar
+}
  • 直接使用元件名的標籤 <Navbar /> 就能引用了

引用資源 ​

圖片、音效等資源有 src/assets/ 和 public 可以放

  • src/assets 裡面的東西打包時會為檔名加上 hash，避免瀏覽器快取
  • public 裡面的東西打包時僅是將檔案複製貼上，檔名相同

注意

資源盡量放在 src/assets/ 裡面，除非遇到下列情況

  • 你需要在打包後指定特定檔案的名字
  • 你有上千個圖片，需要動態引用路徑
  • 有些套件可能不相容，需要有獨立的 <script> 標籤引用

使用 src/assets 裡面的資源時使用相對路徑
打包時會自動將 src 的檔名轉換為加了 hash 的檔名

html
<!-- v-bind:src 必須搭配 new URL(路徑), import.meta.url).href 寫相對檔案的路徑 -->
+<img v-for='(image, idx) in images' :key='idx' :src="image">
+<script setup>
+const images = reactive([
+  new URL('./assets/image1.png', import.meta.url).href,
+  new URL('./assets/image2.png', import.meta.url).href
+])
+const play = () => {
+  const audio = new Audio()
+  audio.src = new URL('./assets/meow.mp3', import.meta.url).href
+  audio.play()
+}
+</script>
+<script>
+export default {
+  data () {
+    return {
+      images: [
+        new URL('./assets/logo.png?raw', import.meta.url).href,
+        new URL('./assets/edit.png', import.meta.url).href
+      ]
+    }
+  },
+  methods: {
+    play () {
+      const audio = new Audio()
+      audio.src = new URL('./assets/meow.mp3', import.meta.url).href
+      audio.play()
+    }
+  }
+}
+</script>
+<!-- 一般的 src 使用相對路徑 -->
+<img src="./img.jpg">
css
body {
+  background-image: url('./assets/image.jpg');
+}

使用 public 裡面的資源

html
<!-- / 開頭代表 public 資料夾 -->
+<img :src="'/img.jpg'">
+<img src="/img.jpg'">
css
body {
+  /* / 開頭代表 public 資料夾 */
+  background-image: url('/image.jpg');
+}
js
mounted () {
+  const audio = new Audio()
+  audio.src = './sound.mp3'
+  audio.play()
+}

部署 ​

編譯 ​

開發完後使用 npm run build 可以輸出靜態網頁

注意

如果沒有設定 base 的話預設路徑是根目錄
所以需要在 vite.config.js，寫入設定

js
export default defineConfig({
+  plugins: [vue()],
+  base: './'
+})

GitHub Actions ​

使用 GitHub Actions 自動編譯部署到 gh-pages 分支

  • 在 master 分支的根目錄建立 .github/workflows/deploy.yml，編寫設定
    yml
    # Action 名稱
+name: Deploy
+# 觸發時機，當推送到分支 master 時
+on:
+  push:
+    branches: [ master ]
+# 執行的工作
+jobs:
+  # 工作名稱
+  deploy:
+    # 執行工作的虛擬機作業系統
+    runs-on: ubuntu-latest
+    # 工作步驟
+    steps:
+      # 步驟一：複製程式碼
+      - name: checkout
+        # 使用的 actions/checkout 複製程式碼
+        uses: actions/checkout@v3
+      # 步驟二：編譯
+      - name: Install and Build
+        run: |
+          npm install
+          npm run build
+      # 步驟三：部署
+      - name: Deploy
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          branch: gh-pages
+          folder: dist

作業

熟悉 Vite 環境及預處理器，製作網頁丙級第一題

  • 網站整體為 App.vue
  • 標題區、跑馬燈區、選單區、內容區、日期區和版權區需要製作成元件
  • 內容區做校長的話頁就好
+ + + + \ No newline at end of file