2020-06-08

Vue進階模板-4

目錄

• Computed 與 Watch
• • Computed
• • 使用 Computed 來呈現時間格式
• • Watch
• 表單補充介紹
• • select 搭配 v-for
• • select 改為多選
• • checkbox
• • 修飾符

Read More

2020-06-01

Vue進階模板-3

目錄

• v-if 與其使用細節
• • v-if, v-else
• • template 標籤
• • v-else-if
• • KEY
• • v-if 與 v-show 的差異
• 提醒

Read More

2020-05-25

Vue進階模板-2

目錄

• v-for 與其使用細節
• • 陣列與物件的迴圈
• • Key
• • Filter
• • 不能運作的狀況
• • 純數字的迴圈
• • Template 的運用
• • v-for 與 v-if
• • v-for 與 元件

Read More

2020-05-18

Vue進階模板-1

目錄

• 基礎模板語法
• 動態切換 className 及 style 多種方法
• • 加上動態 ClassName
• • 將上面 ClassName 改為另一種 “物件” 寫法
• • 陣列寫法呈現此元件 ClassName
• • 綁定行內樣式
• • 自動加上 Prefix (每個版本結果不同)

Read More

2020-05-11

Vue基礎概述-3

目錄

• v-class 動態切換 className
• • 為 .box 動態加上 className “rotate”
• 計算屬性
• • 使用 computed 取代原有的表達式
• Vue 表單雙向綁定
• 元件化
• • 將以下元素轉為元件
• Vue.js Todo List

Read More

2020-05-04

Vue基礎概述-2

目錄

• v-bind 動態屬性指令
• • 透過指令 ( v-bind ) 的方式，將圖片加載於畫面之上。
• v-if 及 v-for
• • 使用 v-for 來呈現資料列表
• • 使用 v-if 擷取部分資訊
• 互動式行為 v-on
• • 使用 v-on 指令來製作互動行為
• • 反轉字串
• 修飾符 及 縮寫
• • 請將 button 改成 a 標籤，並加上 preventDefault()
• • 使用修飾符取代
• • 將 input 加上 Enter 事件
• • 將範例改成使用縮寫表示

Read More

2020-04-20

Vue基礎概述-1

目錄

• Vue 應用程式建立
• • 1. 建立一個應用程式使資料呈現於畫面上
• • 2. 建立兩個應用程式
• • 3. 試試看巢狀應用程式
• 雙向綁定的資料
• • 1. 使用雙花括號與資料串接
• • 2. 試試看使用 HTML 屬性綁定
• • 3. 試試看雙向綁定
• 補充說明

Read More

2020-04-13

前端面試問題集-4

目錄

• 描述 JavaScript 的 same-origin policy
• 實作 duplicate([1,2,3,4,5]);
• Ternary expression 意思是什麼？
• 什麼是 “use strict”; ? 使用他的優點和缺點是什麼？
• 建個數到 100 的迴圈，當數字是 3 的倍數時輸出 “fizz”，當數字是 5 的倍數時輸出 “buzz”，當數字同時是 3 與 5 的倍數時輸出 “fizzbuzz”。
• 為什麼保持網站的全域 ( global scope ) 原樣是一個好做法？
• 為什麼要用 load 事件？
• 什麼是 single page app，並怎麼讓它對 SEO 更友善。
• 你對 Promises 的經驗？
• Promises 之於 callbacks 的優劣？
• JavaScript 轉譯器（ transpiler ）的優缺點？
• 你用什麼工具或技巧來做 JavaScript debug?
• 你都用什麼對 object properties 與 array 進行迭代？
• 解釋 mutable 與 immutable objects 之間的不同。
• 解釋同步（ synchronous ）與非同步（ asynchronous ）函式之間的差異。
• Event loop 是什麼？
• call stack 與 task queue 之間的不同？
• 問題：實作 add(2, 5); add(2)(5);
• 問題：用 for 迴圈建立一個物件
• JavaScript 取出陣列重複 / 不重複值的方法
• 輸入 array，回傳只出現一次的數值

Read More

2020-04-06

前端面試問題集-3

目錄

• 描述 event delegation
• 描述 this 如何在 JavaScript 中運作
• 描述 prototypal inheritance 如何運作
• AMD vs. CommonJS
• null、undefined和 undeclared變數之間有什麼差異
• 什麼是 closure, 如何/為什麼使用？
• anonymous functions 典型的使用時機
• host objects 和 native objects 有何不同？
• .call 和 .apply有何不同？
• 描述 Function.prototype.bind ?
• 盡可能的詳述描述 AJAX。
• 描述 JSONP 如何運作
• 你有用過 JavaScript templating (樣板) ？
• 描述 hoisting
• 描述 event bubbling
• attribute 和 property 的不同？
• 為什麼擴展 JavaScript 內建的 objects 不是個好方法？
• document load event 和 document ready event 有什麼不同？
• == 和 === 有什麼不同？

Read More

2020-03-30

前端面試問題集-2

目錄

• CSS 的 class 和 ID 兩者有何差異
• 描述 Reset 和 Normalize 的差異性？你會選擇哪一種，為什麼選擇它？
• 描述 Floats 並解釋如何運作
• 描述 z-index 並且描述堆疊內容如何形成？
• 解釋 BFC 是什麼、如何運作的。
• 有什麼方法來隱藏網頁的內容？
• 請說明 relative、fixed、absolute 和 static 元件差異性？
• 寫高效的 CSS 時，有什麼要注意的？
• 請列出您記憶中 display 屬性的全部值。
• 請說明 inline 和 inline-block 的差異性？
• CSS 中代表層疊。樣式的優先級
• 為什麼會用 translate() 代替 absolute positioning

Read More