JavaScript教學11.break與continue

 對Javascript有興趣嗎?免費入門教學在這裡!本篇是11.break與continue

Break

前端工程師 都知道 JavaScript 當中的break 敘述， 是用來「跳出」迴圈用的，繼續執行迴圈之後的 JavaScript 程式。

See the Pen JavaScript11-break by Tedutw (@Tedutw) on CodePen.

只要當 i 的值等於 7 時，即將會從該迴圈跳出。

Continue

Continue 敘述，僅在迴圈內中斷程式的執行，在中斷後又重新執行迴圈，而不會跳出迴圈。

See the Pen JavaScript12-continue by Tedutw (@Tedutw) on CodePen.

參考連結:

JavaScript教學8.條件判斷式

JavaScript教學7.條件式

JavaScript教學9.for迴圈

JavaScript教學10.while.do while迴圈

有了它人人都可精準選角拍電影?交給人工智慧準沒錯?

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略



從無到有 挑戰14小時取得Google證照

JavaScript教學10.while.do while迴圈

 對Javascript有興趣嗎?免費入門教學在這裡!本篇是10. while.do while迴圈

while 迴圈

只要條件成立，前端工程師在使用語言程式JavaScript 的「while 迴圈」就會重複執行一段程式碼。
while 迴圈的JavaScript 語法如下

See the Pen JavaScript10-while-loop-1 by Tedutw (@Tedutw) on CodePen.

以下為 while 迴圈的範例：變數 i 的初始值等於 0、條件為「當 i 的值小於或等於 7 」時，就執行「顯示變數 i 的值，並且把 i 的值再加 1」。然後重複執行迴圈。

See the Pen JavaScript10-while-loop-2 by Tedutw (@Tedutw) on CodePen.

只要 i 小於或等於 7，迴圈將繼續執行程式。每次迴圈運行時，數值都會增加 1，於是輸出了 1 到 7 的值。
當條件一直成立時，迴圈則會繼續執行程式，直到條件不成立為止。在下條件時要小心，若條件一直成立的話，迴圈就會一直執行下去，沒有停止。

do...while 迴圈

do...while 迴圈是 while 迴圈的變體。在檢查條件是否成立之前，此迴圈會先執行一次程式碼，然後只要條件為真，迴圈將會重複循環。
do...while 迴圈的 JavaScript 語法如下

See the Pen JavaScript10-do-while-loop-3 by Tedutw (@Tedutw) on CodePen.

註：分號必須寫於 do...while 迴圈的最末端。
do...while 迴圈的範例如下：變數 i 的初始值等於 0、執行「顯示變數 i 的值，並且把 i 的值再加 1」、條件為「當 i 的值小於或等於 7 」。

See the Pen JavaScript10-do-while-loop-5 by Tedutw (@Tedutw) on CodePen.

參考連結:

JavaScript教學8.條件判斷式

JavaScript教學9.for迴圈

JavaScript教學11.break與continue

有了它人人都可精準選角拍電影?交給人工智慧準沒錯?

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略



從無到有 挑戰14小時取得Google證照

JavaScript教學9.for迴圈

 對Javascript有興趣嗎?免費入門教學在這裡!本篇是9. for迴圈

迴圈

前端工程師 在程式語言JavaScript 的「迴圈（Loops）」可以多次執行一組程式。當有多個值，當需要重複執行同程式時，用「迴圈（Loops）」非常方便。
JavaScript 有三種迴圈：for、while、 do while 。最常用的 for 迴圈的 JavaScript 語法如下：

See the Pen JavaScript9-for-loop-1 by Tedutw (@Tedutw) on CodePen.

上例是典型的 for 迴圈（for loop）格式，包含三個條件敘述 （statement）：
在迴圈開始之前執行「條件敘述 1」；
「條件敘述 2」定義了迴圈運行的條件;
每次迴圈跑完之後，執行「條件敘述 3」。

For 迴圈

以下的 for 迴圈範例中，顯示出 7 個等於或小於 7 的整數：

See the Pen JavaScript9-for-loop-2 by Tedutw (@Tedutw) on CodePen.

以上示例中，迴圈開始前，條件敘述 1 設置了一個變數（變數 i = 1）；
條件敘述 2 定義了迴圈運行的條件（i 必須小於或等於 7）。
每次執行迴圈中的程式代碼後，條件敘述 3 都會增加一個值（i ++）。
條件敘述 1 是選擇性的：如果在迴圈開始前就已經定義了值，則可以將其省略。如下例 (因為在 for 迴圈之前便已經定義了「var i = 1」，因此 for 迴圈就省略了條件敘述 1 )：

See the Pen JavaScript9-for-loop-3 by Tedutw (@Tedutw) on CodePen.

如果條件敘述 2 結果為真（true），則迴圈將重頭開始執行；反之，迴圈將結束。與條件敘述 1 一樣，條件敘述 2 也是選擇性的(可以省略)。
如果省略條件敘述 2 ，則必須在迴圈內加一個 break。否則迴圈將不會結束。
條件敘述 3 用於更改初始變數。可以使用任何方式來修改變數，包括減去（i--）或增加（i = i + 15）等等。
條件敘述 3 也是選擇性的(可以省略)，如果在迴圈內增加值，則可以將其省略。

See the Pen JavaScript9-for-loop-4 by Tedutw (@Tedutw) on CodePen.

參考連結:

JavaScript教學6.邏輯運算子

JavaScript教學8.條件判斷式

JavaScript教學10.while.do while迴圈

有了它人人都可精準選角拍電影?交給人工智慧準沒錯?

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略


從無到有 挑戰14小時取得Google證照

JavaScript教學8.條件判斷式

 對Javascript有興趣嗎?免費入門教學在這裡!本篇是8.條件判斷式

switch 條件式

在程式語言 JavaScript 中，如果你有多個條件需要測試的話，替每個條件逐字編寫 if...else 語句可能不是那麼有效率。此時， 前端工程師 們可以使用 switch 敘述式，就可以依據不同的條件而執行所指定的程式。 switch 用法如下面代碼所示：

See the Pen JavaScript8-switch-1 by Tedutw (@Tedutw) on CodePen.

switch 敘述式只運算一次，看看敘述是否符合各個情況(case)所指定的條件。當有條件成立時，則會執行該情況(case)所對應的程式。如以下例子：變數「day」若為 1 時則輸出「Mon」、為 2 時，則輸出「Tue」、為 3 則輸出「Wed」、為 4 則輸出「Thu」、為 5 則輸出「TGIF」，都不符合就輸出「Weekend day」。

See the Pen JavaScript8-switch-2 by Tedutw (@Tedutw) on CodePen.

註1：以上例子也可以使用 if...else 條件式 來寫，但不如 switch 來的精簡。
註2：每一個 case 中的「break」語句，作用是讓 JavaScript 跳出該 switch 程式區塊，以阻止更多的程式碼執行、或是繼續在該區塊內繼續測試的動作。通常一種情況（case）的條件陳述中，會放一個「break」。

switch 條件式中的「default」

當所有條件都不成立時，「default」關鍵字指定 JavaScript 要執行的動作。如下例，若變數「member」的值都不符合所有情況（case）的條件陳述時，JavaScript 就跑到「default」，顯示「不是Stratovarius的現任團員」。以下的變數（var）「member」的值為 「Tokki」，看看是否符合每個情況（case）的條件陳述。

See the Pen JavaScript8-switch-3 by Tedutw (@Tedutw) on CodePen.

參考連結:

JavaScript教學6.邏輯運算子

JavaScript教學9.for迴圈

JavaScript教學10.while.do while迴圈

有了它人人都可精準選角拍電影?交給人工智慧準沒錯?

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略


從無到有 挑戰14小時取得Google證照

JavaScript教學7.條件式

 對Javascript有興趣嗎?免費入門教學在這裡!本篇是7條件式

if 條件式

前端工程師 在使用 JavaScript 編寫程式碼時， 若如果希望程式能依據不同的狀態，而進行不同的操作時，就需要使用條件陳述式（conditional statements）。
我們可以使用if 條件式敘述：當一個指定的條件成立（為真）時會執行的程式碼，簡單來說就是「當...條件成立時，則會執行...程式」。
if 條件式的 JavaScript 語法如下

See the Pen JavaScript7-if-1 by Tedutw (@Tedutw) on CodePen.

只有當指定的條件成立時，程式碼才會執行。
下面為 if 條件式 的範例，聲明當「變數 Num1 小於 變數 Num2」的條件成立時，才會顯示「JavaScript其實不難啊！」。

See the Pen JavaScript7-if-3 by Tedutw (@Tedutw) on CodePen.

承上面的例子，當「變數 Num1 小於 變數 Num2」的條件不成立時，則程式會自動跳過要執行的代碼，不會顯示「JavaScript其實不難啊！」。如下所示：

See the Pen JavaScript7-if-4 by Tedutw (@Tedutw) on CodePen.

else 敘述

當條件不成立時，除了不讓程式執行之外，我們還可以選擇使用「else」語句來指定當不符合指定條件時，所要執行的動作。承上方例子，當不符合「變數 Num1 小於變數 Num2」 的狀況時，就顯示「前端工程師都必須學JavaScript」。

See the Pen JavaScript7-if-5 by Tedutw (@Tedutw) on CodePen.

else if 敘述

if 條件式 中，我們還可以加入「else if」敘述另一個條件。當所指定的條件不成立時，是否還符合另一個條件。如以下例子所示，當變數「age」大於 17 的條件成立時，則顯示「成人」；若不成立，則看看是否符合另一個條件（變數是否大於 11）。當另一個條件成立時，則顯示「青少年」；若兩個條件都不成立，就顯示「兒童」。

See the Pen JavaScript7-if-6 by Tedutw (@Tedutw) on CodePen.

參考連結:

JavaScript教學6.邏輯運算子

JavaScript教學8.條件判斷式

JavaScript教學9.for迴圈

有了它人人都可精準選角拍電影?交給人工智慧準沒錯?

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略


從無到有 挑戰14小時取得Google證照

宅男斜槓!學好Unity3D,電玩遊戲開發不是夢

今天上Unity3D的課,老師跟我們說了這則任天堂的新聞,分享給大家!

重現馬力歐經典遊戲！Unity3D 支援平台「任天堂 Switch」遊戲夯

日本知名遊戲公司任天堂，是所有熱愛電玩遊戲的玩家們一定聽過的夢想製造廠，從 2006 年推出的 Wii ，到 2014 年誕生的 PokemonGo。任天堂一再的在人們快要淡忘這家公司時，再次震驚世人，並改造人們的遊戲體驗。
而2017年，就在人們都以為手機遊戲才是遊戲世界的未來時，任天堂卻反其道而行的推出了 Switch，一個可以帶在身上的螢幕遊戲器。並在推出後一個月賣出了超過一千五百萬台，更帶動任天堂的營收成長整整一倍。這樣的遊戲產業傳奇的起頭，就必須談及1980年誕生的那位留著大鬍子、身穿鮮紅色吊帶褲的馬力歐叔叔。

▲ 任天堂的傳奇歷史

你知道大力水手卜派與超級馬力歐有血緣關係嗎？

沒有玩過任天堂 Switch 你也一定見過馬力歐叔叔圓 Q 的身影，他就這樣輕輕鬆鬆的攻下了 Switch 熱賣遊戲榜上的前三名，包括【馬力歐賽車】！馬力歐最早誕生在 1980 年任天堂出產的一款掌上型遊戲機 GAME&WATCH 系列名作【大力水手】之中。本來主角是要由大力水手卜派飾演，但是任天堂與漫畫商洽談角色版權失敗，於是任天堂乾脆將本來的卜派加上大鼻子與大紅吊帶褲，以及一頂永遠不脱下的帽子，但是你知道他為什麼要戴帽子嗎？
我的第一個直覺是：馬力歐一定是懶得洗頭髮！
雖然這個答案是錯的，但是真相也相去不遠了。原因是因為任天堂公司的遊戲設計師懶得畫馬力歐在跳躍時舞動的頭髮。所以就直接讓他戴帽子，從根本解決了這個遊戲設計師的煩惱。設計馬力歐原型的宮本茂還曾得意的說：這樣連他的眉毛、瀏海都不用畫了呢！
馬力歐叔叔就這麼誕生了，並且帶領任天堂縱橫遊戲世界近30年！

▲ 最新 Switch 馬力歐經典遊戲

遊戲設計魔法師的魔杖：Unity3D 開發

但是在這樣競爭激烈的遊戲產業中，任天堂的公司氛圍卻不像一般的科技公司，而更像藝術家村落，尊重每一位遊戲設計師的空間以及休憩。這樣的公司文化，也凸顯了遊戲開發的本質，並不像一般的技術開發，而更需要一顆充滿創造力的藝術心。
Unity 3D 遊戲設計除了必須具備遊戲場景設計的藝術思維，更需要了解玩家的遊戲心理，一步步帶領玩家進入遊戲的奇幻世界。所以 Unity遊戲開發不只是需要開發人員的程式能力，更需要洞悉電玩玩家的遊戲心理，以及遊戲畫面的設計，是需要結合多個領域的全新職業。
所以，你是個熱愛遊戲、卻沒辦法成為電競選手的玩家嗎？成為 Unity 3D 遊戲設計師是你擁抱遊戲職涯的另一種可能！隨著 Switch 席捲全球，現在的遊戲產業正迎來更大的巨浪。若你也想成就自己的遊戲帝國，現在或許是不錯的時機！

▲ 一人團隊！用 Unity 開發出任天堂 Switch 高質感遊戲:

▲ 以 Unity 開發出的十大優質遊戲

參考連結:

知名公司預測2020人工智慧趨勢(上)

知名公司預測2020人工智慧趨勢(下)

達內教育統整:菜鳥常犯的影片後製十大錯誤

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(三)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略

從無到有 挑戰14小時取得Google證照

知名公司預測2020人工智慧趨勢(下)

想比別人快知道2020人工智慧的重大突破嗎?趕快進來看啊(下)

本篇為此篇文章的下集

人類增強（Human argumentation）是什麼？我可以變鋼鐵人了嗎？

其實人類增強的概念一直都存在於我們的生活中，諸如眼鏡、助聽器等等，都是藉由穿戴式設備來增強人類的感知能力，但隨著科技進展，人類增強也將也意想不到的突破！
人類增強到底要怎麼將現代人改造成鋼鐵人呢？主要是透過以下四個領域：

• 感知擴增：例如聽力以及視力的增加，能輔助人們做出更好的判斷
  
• 生理功能的擴增：藉由外骨骼、假體的輔助，我們能做到平常不能做到的事，例如在工地舉起重物。
  
• 大腦擴增：藉由腦部手術，增加記憶力與思考能力
  
• 基因擴增：諸如細胞療法、基因療法皆是
  

▲ 八個令人震驚的人類增強技術

目前的人類增強技術主要運用在汽車產業、礦業等工業領域，透過穿戴式裝置(像是外骨骼裝置)，可以確保在工地工作人們的安全並提高工作效能。而在未來，人類增強也將運用在旅遊業、服務業等，並增強員工的產能。所以成為鋼鐵人的夢想，看來不遠了！但同時，人類擴增也引起了許多倫理方面的議題，例如基因編輯是否符合道德？這都是現代社會需要面臨的問題。

多重體驗（multi-experience）讓我們可以「聞到」電影的味道？

你能想像，有一天你訂了外送披薩，來敲門的卻是一台人工智慧披薩車嗎？這已在美國實現！達美樂披薩店現在不只可以使用 app 訂購餐點，他們也結合了人工智慧語音客服、披薩追蹤器來提供披薩外送服務！當然，AI多重體驗不只是要改變披薩界，更要徹底改變你體驗科技的方式。
多重體驗著重在結合擴增實境（argumented reality）和虛擬實境（virtual reality），讓我們與科技溝通的方式不僅止於螢幕、鍵盤與滑鼠，更結合許多穿戴式裝備、多管道人機介面以及感測技術，讓我們可以以更人性的方式與電腦溝通，也創造更多驚奇的感官體驗。所以，讓我們一起期待可以「聞到」電影中美食香味的那天吧！

▲ 虛擬實境可以改變我們的心智嗎？

建構我們的智慧生活空間：邊緣計算（Edge computing）

你一定有在電影中看過這畫面：超級富豪駕著法拉利，透過手機對家裡的設備下令：「幫我放一盆熱水澡，然後打開客廳冷氣！」這樣的科幻生活並不是只存在在電影裡,早就已經悄悄進入我們的現實中！
邊緣計算（Edge computing）主要被應用在「萬物上網」（Internet of Things），顧名思義，現在什麼東西都能上網了！冷氣可以連上網路，好在你還未到家時先行啟動; 浴缸也與你的手機連線，讓你能隨心所欲的透過手機調整熱水的溫度。這樣的智慧居家，就是透過每一個物件的相互串連而建構起的智慧空間。而邊緣計算，使得這些資訊的傳遞都非常接近資訊的源頭，使資料的流動及分佈在地化，以降低資料傳遞的延遲，也使他們能更貼近使用者的日常生活。 Gartner 預測，在2023年將會有超過於今20倍的智慧元件，被安置在這樣的邊緣網絡當中，所以好好期待電影中的科幻生活成真吧！

分佈式雲：資料庫的去中心化

想像以前的資料庫就像是國王城堡中的大金庫，裡面儲藏著全世界的金幣，也就是價值連城的資料數據。而現在不一樣了，不再有大型的中央金庫儲存保管這些資料，而是將這些資料分散到一戶戶平民家中的櫥櫃，由平民架構、傳輸、運作、管理、更新。分佈式雲允許資料中心可以在任何地方。這種方式解決了很多技術問題，例如延遲，還有一些資料管理的爭議。相對於私人雲，分佈式雲也提供了公共雲的許多優點。這樣的革新，開啟了雲計算的新紀元。

區塊鏈的應用：本來死板的區塊鏈，可以自由伸縮了？

區塊鏈可以被視為一個大帳本，一個區塊連著一個區塊，每個區塊都存著加密的交易紀錄。由於區塊鏈不可被竄改並且可以被所有人檢視，於是被企業視為十分安全的大帳簿。也由於區塊鏈的這些特性，他可以被用於追蹤交易資產的源頭（例如追蹤帶原疾病的食物源頭），這將有利於資產的維護。
為什麼區塊鏈是一本大帳本？若你還是有這樣的疑問，就來看看這篇文章吧！

▲ 六分鐘搞懂區塊鏈！

但是區塊鏈還是有他的缺點，例如區塊鏈的可擴充性以及可互動性都非常的差。然而 Gartner 指出，在2023年時，部分實驗性質或小範圍的區塊鏈將是完全可擴充的。現今的區塊鏈產業採取了一個較實際的作法，只實踐了目前區塊鏈的某些特點。藉由使帳簿、應用與使用者分流的方式，在一個分散式的網路複製帳簿，並產生一份明確的官方交易紀錄。每一個被授權的使用者都會看到相同的資訊，藉由單一可分享的區塊鏈，系統整合將會被簡化。
而在將來，這本「大帳簿」將會有更多其他的用途，像是前述的「萬物上網」將會在未來與區塊鏈整合。區塊鏈將可以與多元領域的技術銜接，並擴增能夠參與這種系統的物件範圍，包括整合可以交易各種資產的設備，例如交易錢與房地產。想像一下，有一天你的汽車將能使用自身感測系統所搜集的行車數據，與保險公司進行保險金的討價還價與交易！2020的科技世界真是令人期待呢！
點我看看更多 Gartner 對於區塊鏈的真知灼見！


參考連結:

知名公司預測2020人工智慧趨勢(上)

假人工智慧真詐騙!歐洲知名企業詐騙得逞9億!!(上)

假人工智慧真詐騙!歐洲知名企業詐騙得逞9億!!(下)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(一)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(二)

還不懂Python的你趕緊看過來,為你獻上基礎介紹(三)

2天考取Google Ads證照！新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證？五種 GoogleAds 廣告不藏私攻略

從無到有 挑戰14小時取得Google證照