布萊恩的創業小窩的部落格

JavaScript的數學運算子在昨天你都學好了嗎?,今天的賦值運算子照樣能充實你的JavaScript知識!
賦值運算子
JavaScript 中的賦值運算子，賦值運算符是「=」。第一次接觸程式碼的人可能會以為它是「等於」，其實不是。它實際上意味著把右邊表達式的值賦給左邊的運算數。


JavaScript賦值運算子
敘述
範例




＝
x = y
x = y


+＝
x += y
x = x + y


-＝
x -＝ y
x = x - y


*＝
x *＝ y
x = x * y


/＝
x /= y
x = x / y


%＝
x %= y
x = x % y


你可以在JavaScript 中的同一行中，使用多種運算子，如在下面例子所示：
<
See the Pen 賦值運算子｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
而今天的JavaScript教學也提供給你個例子，你也可以運用多種變數，請看以下例子：
See the Pen Addition-2｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.

今天學的-Javascript的數學運算子,直接用表格一字排開,讓你覺得超簡單!
數學運算子
JavaScript 中的數學運算子，作用是對數字（文字的形式或是變數的形式）進行函式運算。


運算子
敘述
範例




+
加號
1 + 1 = 2


-
減號
2 - 1 = 1


*
乘號
2 * 3 = 6


/
除號
10 / 2 = 5


--
減去
var a = 10; a--; Now a =9


%
餘數
20 % 3 = 2


++
遞增
var a = 10; a++; Now a =10


--
遞減
var a = 10; a--; Now a =9


在今天的JavaScript教學提供的例子中（請看以下），加號運算子是用來決定兩個數的和：
See the Pen Addition｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
你也可以運用多種變數，例子如下：
See the Pen Addition-2｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
承第一個例子，試想一下，如果我們把「var x = 20 + 30」使用字串表示，變成「var x = "20 + 30"」的話，答案就不會是 20 + 30 的和，而是以字串形式呈現如下：
See the Pen Addition-string｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
減、乘、除運算子
四則運算中，除了上述介紹的加號運算子外，JavaScript 的減、乘、除運算子範例如下：
See the Pen 減、成、除運算子｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
遞增與遞減運算子
JavaScript 的遞增運算子「++」把數值加一，至於運算元的前後，意義各異：要是置於運算元的前方，則回傳被遞增的值；要是至於運算元的後方，則回傳原值，然後才遞增運算子。這樣解釋看似模糊，請見範例如下：
把遞增運算子放在運算元「y」前方的例子：
See the Pen 遞增運算子++var｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
把遞增運算子放在運算元「y」後方的例子：
See the Pen 遞增運算子var++｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
同理，遞減運算子「--」則是把數值減一，於運算元的前方，則回傳被遞減的值；要是至於運算元的後方，則回傳原值，然後才遞減運算子，範例如下：
把遞減運算子放在運算元「y」前方的例子：
See the Pen 遞減運算子--var｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
把遞減運算子放在運算元「y」後方的例子：
See the Pen 遞減運算子var--｜Math Operator｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.

JavaScript變數能支援幾個資料類型,你知道是哪幾種嗎?今天一點一滴讓你建立概念!
資料類型
「資料類型（Data Types）」是關於一個可以運行程式中的值的種類。JavaScript 變數可支援各種資料類型，例如數字（類型）、陣列（類型）、字串（類型）等。
不同於其他的程式語言，JavaScript 不會特別因「不同的數值類型（如整數、數值長短、浮點等）」而賦予不同的定義。
JavaScript 的數值，可以帶小數點的，或是整數的形式呈現。
See the Pen Data Type-1 by Tedutw (@Tedutw) on CodePen.
 
浮點數
沒錯，JavaScript教學一定會提醒你：JavaScript的數字也可以有小數點的喔！
請見下例所示：
See the Pen Float｜Data Value｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.
 
字串（Strings）
JavaScript「字串（Strings）」被用以承裝、處理文字。
一個字串可以是引號中的任何文字。這對引號可以使用單引號或是雙引號，如下範例：
var name = 'Márquez';
var text = "His name is Marc Márquez";
你可以在引號中，再加入引號。如單引號中加入雙引號、雙引號中放置單引號。只要兩種引號不要一樣就好。
var text = "His name is 'Marc Márquez'";
var text = 'and his opponent's name is "Valentino Rossi"';
承上例，除了使用不同樣式的引號外，我們還可以使用反斜杠（\），如下所示：
var text = "His name is \"Marc Márquez\"";
var text = 'and his opponent's name is \'Valentino Rossi\';
 
布林值（Booleans）
在 JavaScript「布林值（Booleans）」中，我們可以擁有一到兩個值：不是 true 就是 false。
Booleans 適用於當你需要一個資料類型，而該資料類型又只有兩個值（如「是或不是」、「對或錯」）的場合時。範例如下：
See the Pen Booleans｜Data Value｜JavaScript Tutorial by Tedutw (@Tedutw) on CodePen.

JavaScrip的變數也是相當重要的!想知道如何命名變數?往下看就能學會啦!
 
變數
「變數（Variables）」可說是用來承裝資料數值的容器。在同一程式中，變數的值是可以改變的。
在 JavaScript 中，以「var」來宣告變數。寫法如下所示：
var x = 777;
在上述例子中，數值 777 被指定給變數 x。
JavaScript 對於字體的大小寫是敏感的，大小寫被視為不同的變數，例如變數「Name」與「name」，將被視為不同的變數。
等號
在 JavaScript 中，等號 (=) 被稱作「分配」運算子，而不是「等於」運算子。
例如，「x = y」就是「把數值 y 分配給 x」，而不是「y 等於 x」。
使用變數
現在，我們將一個值「777」分配給一個變數「x」，並將其輸出。程式碼與結果如下：
See the Pen var.js by Tedutw (@Tedutw) on CodePen.
為變數命名
JavaScript 的變數名稱，對於字體的大小寫是敏感的，大小寫被視為不同的變數。如下例，我們將 x 由小寫改為大寫，程式碼與結果如下：
var x = 100;
document.write(X);
See the Pen Naming Variables by Tedutw (@Tedutw) on CodePen.
因為大小寫不同的緣故，所以 x 與 X 被判定為不同的變數。因此上面的程式碼並沒有產出任何的結果。
JavaScript教學在這提供給你變數命名的原則：
- 命名的第一個字，必須是英文字母、底線（_）或是貨幣符號（$）。後續的字可以是英文字母、數字（注意：數字不能作為第一個字）、底線或是貨幣符號（$）
- 變數名稱不能包含一個算數或是邏輯運算子，像是加（+）減（-）乘（*）除（/）的的記號都不能用。注意：連接線（-）會被視為減號，因此命名中也不能含連接線。）
- 變數名稱不能包含特殊符號，例如「my#num」、「num%」等。
- 任何的 JavaScript 名稱都不能含有空白字元。
- 以下圖片為「JavaScript 保留字」一覽表，表中的任何字都不能用於命名變數。
 
 

 

 
對於前端工程師你多少有點了解了吧?但你知道他和後端工程師.全端工程師的差別嗎?今天就能釐清這些長超像的名詞啦!
 
業界對於網站開發工程師的需求，一直沒有停止過，也吸引很多非本科系出身的同學想轉職到網站開發工程師。
但是常常聽到網站開發工程師還有分成「前端工程師」、「後端工程師」，還有綜合上述的「全站（full-stack）工程師」。
今天就來解惑：這三種聽起來超像的職位到底差在哪？我又該選哪種學習比較好上手？由於真的太多人有類似的問題，因此本篇文章會幫助你先了解網站開發的分工定義、技能需求，如此一來，才能幫助你找到適合自己的目標、讓你更有效率學習，更快達成轉職網站開發工程師的願望！
前端工程師
網站的「前端」是與用戶直接交互的部分，包括你在瀏覽網頁時接觸的所有視覺內容--從字體到顏色，以及下拉菜單和側邊欄。這些視覺內容，都是由瀏覽器解析、處理、渲染相關HTML、CSS、Javascript 文件後呈現而來。
技能與工具
前端開發，就是要創造上面提到的網站面向用戶的部分背後的代碼，並通過建立框架，構建沉浸性的用戶體驗。為了實現這個目標，開發需要熟練運用下列語言、框架、工具庫——三大語言：HTML，CSS，和Javascript。
此外，掌握jQuery 和LESS 等工具庫也很重要，它們能幫助開發者以更高效的方式編碼；很多前端開發崗也要求Ajax 方法的使用經驗，它可以幫助你使用Javascript 在後台從服務器拉取數據，協助實現頁面的動態加載。
打個比方，前端工程師的工作專注於「房屋」裝修，而蓋房子的工作由後端開發者負責。通過一些專門的工具，前端開發者與設計師/用戶體驗分析師密切合作，幫助構建原型或是線框圖，參與產品開發到發布的全過程。
一些前端工程師甚至能準確定位影響用戶體驗的特定問題，並給出建議或是代碼解決方案，對產品設計帶來積極影響。在專業能力外，與其它團隊協作，以理解特定目標、需求、機遇，以及高效的執行力也非常重要。
這聽起來工作內容很多，但也回報豐厚。「我是一名技術人員，也是一名設計者，在數字平台上使用標記語言和代碼修改視覺元素並與之互動是很自然而有趣的體驗，」有八年前端開發經驗的Mikey Ilagan 說「這讓我能夠直接影響到用戶體驗，操縱應用和網站裡用戶所見並直接與之交互的元素，這非常棒！」
總之，前端開發者要為後端開發者搭建的「房屋」進行內部設計和裝修工作。裝潢風格由房屋所有者指定。Apptix 的產品市場負責人Greg Matranga 表示：「前端開發者有時更容易為他們的工作感到振奮，因為他們有更廣闊的空間發揮自己的創造力。」
 
後端工程師
是什麼給網站前端提供支持？數據存放在哪裡？這就涉及後端內容了。網站後端包括服務器、應用還有數據庫。後端開發者構建並維護這些組件，為網站提供多方面支持。
由上圖可以看出，UDN 的讀者來源，大部分來自 Search （搜尋引擎）輸入特定關鍵字後，進到 UDN 的網頁；而東森新聞雲的讀者最多都是從 Facebook 等 Social 社群網站的連結進來。
技能與工具
為了讓服務器、應用、數據庫能夠彼此交互，後端工程師需要具有如下技能：
用於應用構建的服務器端語言：PHP, Ruby, Python, Java, .Net 等；
數據相關工具：My SQL , Oracle, SQL Server等；
PHP框架：Zend, Symfony, CakePHP等；
版本控制工具：SVN, CVS , Git 等；
還要熟練使用Linux 作為開發和部署環境。
後端開發者使用這些工具編寫乾淨、可移植、具有良好文檔支持的代碼來創建或更新 Web 應用。但在寫代碼之前，他們需要與客戶溝通，了解其實際需求並轉化為技術目標，制定最有效且精簡的方案來進行實現。
「我熱愛後端開發因為我喜歡操縱數據」，資深後端開發者就職於 Wildbit 的 JP Toto 說。「現在共有和私有 API 已變成移動設備、網站以及其它互聯繫統交換數據的必備通道。創建對大家有用的API 是我工作裡非常鼓舞人心的部分」。
 
全端工程師
全端工程師，最初是 6 年多以前由 Facebook 帶動的概念。全棧的核心，是指這批開發者能夠承擔包括前端、後端在內的所有功能開發任務，他們擁有一個技能全家桶。
「能夠同時承擔服務器端和客戶端工作會為你帶來更多機會，」 Grovo 的全端工程師 Federico Ulfo 說「當然這也就意味著更多的挑戰。以廚藝作類比，掌握烹飪和烘焙都需要時間與經驗積累，同時掌握兩者要花費更多精力。照著菜譜做誰都可以，我此處所說的是做出真正美味東西的能力。」
技能與工具
全端工程師也通常在服務器端進行編程工作，但他們熟練前端語言，能夠操縱網站面向用戶的部分。基本上可以形容他們是百事通。
全端工程師需要對 Web 架構的每一個層次都有足夠的了解：搭建和配置Linux 服務器，編寫服務器端API，利用客戶端Javascript 代碼驅動應用，將設計層面的東西轉化到實際的CSS 代碼。掌握並使用大量工具的同時，全端工程師需要敏捷地分配服務器端和客戶端任務，提供解決方案並對比不同方案的優劣。
 
相關閱讀推薦：

CSS必學!前端工程師與Div.Span標籤的應用(上)


前端工程師之路不停歇~Media Query的流動圖片
想當前端工程師不知道怎麼開始?入門知識現在告訴你!

Python課程已經強大到可以瞬間判讀病因?醫生北北要哭了!


用上大數據!美妝產業用科技行銷術接軌新客群


暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？


 
 
 

終於來到Python控制結構的最終章了,學了這麼多紙上功夫,今天來實作吧!
 
本Python教學文是 Python 項目實做：一個簡單的計算器。本實作應用了前面的Python教學文章，其中包含Python的基本函數與概念，有while 迴圈、if 條件判斷式、elif 寫法、type conversion類型轉換。
每個部分說明了 Python 程式的不同部分。
第一部分是計算機的起始畫面，讓用戶一直不斷輸入，直到用戶輸入「exit」為止，因此使用了while 迴圈。
while True:
print("選項:")
print("輸入 '+' 讓兩個數值互加")
print("輸入 '-' 讓兩個數值互減")
print("輸入 '*' 讓兩個數值互乘")
print("輸入 '/' 讓兩個數值互除")
print("輸入 'exit' 來結束程式")
user_input = input(": ")
if user_input == "exit":
break
elif user_input == "+":
...
elif user_input == "-":
...
elif user_input == "*":
...
elif user_input == "/":
...
else:
print("不知道你在輸入什麼")
上述程式還沒寫完呢！只完成了起始畫面與結構。接下來我們針對每個小部分來寫 Python 程式碼：
加法的部分：
elif user_input == "+":
num1 = float(input("請輸入數字:"))
num2 = float(input("請輸入另一個數字:"))
現在，當用戶輸入「+」後，程式就會提示輸入兩個數字。以上我們使用 float()函數，來將用戶輸入的數字強制轉變成浮點數。但是若用戶輸入的不是數字，程式就會 GG。
接下來，我們寫的程式碼，是用來執行用戶輸入的兩個數字，完成加總並且將結果輸出。Python 程式碼如以下所示：
elif user_input == "+":
num1 = float(input("請輸入數字:"))
num2 = float(input("請輸入另一個數字:"))
result = str(num1 + num2)
print("答案是 " + result)
以此類推，減法的部分為：
elif user_input == "-":
num1 = float(input("請輸入數字:"))
num2 = float(input("請輸入另一個數字:"))
result = str(num1 - num2)
print("答案是 " + result)
以此類推，乘法的部分為：
elif user_input == "*":
num1 = float(input("請輸入數字:"))
num2 = float(input("請輸入另一個數字:"))
result = str(num1 * num2)
print("答案是 " + result)
以此類推，除法的部分為：
elif user_input == "/":
num1 = float(input("請輸入數字:"))
num2 = float(input("請輸入另一個數字:"))
result = str(num1 / num2)
print("答案是 " + result)
現在我們已將Python教學的任程式完成啦！一起看看看執行結果如何：

沒想到Python教學文竟然有了十篇!今天要教的你或許有聽過,但和之前的可不一樣喔!
看這一篇之前，建議先看這一篇Python教學：「Python控制結構5.while 迴圈」複習 while 迴圈。
Python 中，若我們要多次重複執行一個指令，我們可以使用迴圈（loops)。迴圈中的程式碼會用以下的方式執行指令：1、按照所指定的次數，重複執行；2、重複執行，直到特定的條件成立時結束；3、針對某一集合（例如：Python list串列之中的物件）中的所有項目，都各執行一次。
for 迴圈 vs. while 迴圈
先前我們曾經介紹過的 while 迴圈用法與 if 條件判斷式相似，只要給予的條件成立（即為「True(真)」），它就會執行。不同的是執行次數，if 只執行一次；while 迴圈則輪迴執行無限多次 (除非有設定讓迴圈結束的條件且條件成立)。
while 迴圈只要「沒有」另外設定「迴圈結束的條件(如：if 、break)」，迴圈就會無限的循環。這次我們要介紹的 for 迴圈則是在一行內就 自帶計數功能的迴圈，可以將重複循環控制在固定的數量內。
讓我們來看看Python教學，給的以下這個 while 迴圈的範例。起始值為「count=0」、調整值為「count = count + 1」、讓迴圈結束的條件為「<= 5」，如下所示：
count=0
while count <= 5:
print(count)
count = count + 1
上述範例結果為：
0
1
2
3
4
5
上個範例，若我們把第二行的「count <= 5」抽掉，換成一個「合乎常理」的條件（例如 count = 0），這個 loop 就會「0,1,2,3,4,5,6,7⋯⋯」永無止盡的重複「+1」的動作。同個範例，若使用 for 迴圈，則在第一行就可以搭配 range數列，定義「終止值」。如下例：
for count in range(0,6,1):
print(count)
上述例子結果為：
0
1
2
3
4
5
有沒有發現，原本使用 while loop 需要 4 行的 coding，使用 for loop 卻只要兩行！？
因為 while 迴圈把三大控制條件：初始值、讓迴圈結束的條件、更新值（又稱為調整值）分散在各行來敘述，for 迴圈則使用 range數列 ，將這三大控制條件放在同一行中展現。上述 range 的寫法為「range(起始值為0,迴圈在6之前就結束,調整值為+1)，一行立刻應用 Range數列來訂定起始值、結束條件與調整方法，是不是很精簡方便的？Python 的 range 函數的詳細用法請見這一篇。
下面還有另外一個例子，為 for 迴圈應用 Python List串列函數的，將串列表中的所有物件都執行一次的範例：
the_BIG4=["Megadeth","Metallica","Anthrax","Slayer"]
for bandname in the_BIG4:
print(bandname+" is a thrash metal band.")
上述例子結果為:
Megadeth is a thrash metal band.
Metallica is a thrash metal band.
Anthrax is a thrash metal band.
Slayer is a thrash metal band.
這種針對某一集合中的所有項目（例如：List串列之中的所有物件），都各執行一次例子，若用 while 迴圈來表示則需要：1、套用到 counter 「計數器」變數（計數器的數值是跟著索引跑的，所以設定起始值為「counter = 0」。串列的索引編號均是從零開始，詳細請看這篇)。；2、調整值為多加一次，故把計數器變數設為「counter = counter + 1」；3、讓迴圈結束的條件為當計數器把串列的東西全都執行結束時，因此把計數器的值設定為「最大的索引數」， 變成：
the_BIG4=["Megadeth","Metallica","Anthrax","Slayer"]
counter = 0
max_index = len(the_BIG4)-1
while counter <= max_index:
bandname = the_BIG4[counter]
print(bandname + " is a thrash metal band.")
counter = counter + 1
比起來，for 迴圈自帶計數的特性，真的簡化了 Python 程式碼的寫法。所以遇到有次數限制的迴圈時，不妨使用 for 迴圈吧！
 
 
 相關閱讀推薦：


關於Python控制結構的秘笈5:while迴圈

關於Python控制結構的秘笈,最終回:實作簡單的計算機

關於Python控制結構的秘笈1:布林值




AI人工智慧日益進步,張忠謀:過半人力將被替代!!該如何自保?


觀察一下URL的蛛絲馬跡,你會發現SEO優化比你想像中的有趣!


暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~
中國IT教育領導品牌　達內教育集團第一家海外授權中心


 
 

前幾篇Python教學文都在探討它的List串列,今天要交新的-Range數列生成!
Python教學中提到的「range」函數，它可以用來生成數字序列，若無指定，數字序列由「0」開始。下例指定數字序列生成到 20 個，如下例所示：
 
numbers = list(range(20))
print(numbers)
上述範例結果為：
[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
Python 的「range」函數可以用來生成由零開始的數字序列，但是我們仍然可以指定起始值如下：
numbers = list(range(7, 14))
print(numbers)
print(range(20) == range(0, 20))
上述例子結果為:
[7, 8, 9, 10, 11, 12, 13]
True
在 Python 中我們除了可以輸入兩個參數，指定序列的起始值外，還可以指定第三個參數（必須為整數）以定義每個數字中間間隔為多少。如下：
numbers = list(range(7, 14, 2))
print(numbers)
上述例子結果：
[7, 9, 11, 13]

這篇的Python內容要繼續談的是List串列,今天要教你它的append,insert等等的函數該如何使用!
在 Python 的 List 串列【基本的List串列說明，請參考之前的Python教學：Python控制結構6.List串列】中，我們不僅可以隨意替換、索引 List 中的物件【請參考：Python控制結構7.List串列與其他運算子的應用】
 
我們可以使用「append」來增加串列中的物件。如下例所示：
GearList = ["BCD", "調節器", "蛙鞋"]
GearList.append("潛水面罩")
print(GearList)
上述範例結果為：
['BCD', '調節器', '蛙鞋', '潛水面罩']
我們可以使用「len」來計算 List 串列中有多少物件：
GearList = ["BCD", "調節器", "蛙鞋"]
print(len(GearList))
上述例子結果為「3」。
「len」可與「append」合用，Python 語法範例如下：
GearList = ["BCD", "調節器", "蛙鞋"]
GearList.append("潛水面罩")
print(len(GearList))
上述例子結果為「4」。
剛剛提到，在 Python 中我們可以使用「append」來增加串列中的物件。但是「append」都是把物件增加在串列的最後面。若希望物件增加到串列的中間，就用「insert」:
GearList = ["BCD", "調節器", "蛙鞋"]
index=1
GearList.insert(index,"潛水面罩")
print(GearList)
結果為：
['BCD', '潛水面罩', '調節器', '蛙鞋']
以上範例，我們在 List 串列那一行的後方，加入了「index=1」，指定索引號碼為「1」。所以，"潛水面罩"這物件就被安插在索引序號為「1」的位置。
Python 的 List 串列用法可說是多樣化。我們甚至可以使用「index」來查看指定物件的索引序號如下：
GearList = ["BCD", "調節器", "蛙鞋"]
index=2
GearList.insert(index,"潛水面罩")
print(GearList.index("BCD"))
print(GearList.index("蛙鞋"))
print(GearList.index("調節器"))
print(GearList.index("潛水面罩"))
結果為：
0
3
1
2
List串列尚可搭配 for 迴圈，讓 List串列中的所有物件都可以被 Python 程式執行！【請參考之後的Python教學：Python控制結構10.for迴圈】
 
相關閱讀推薦：


關於Python控制結構的秘笈7:List串列與其他運算子


關於Python控制結構的秘笈9:Range數列生成
關於Python控制結構的秘笈10:for迴圈



Python課程讓你跟AI漫畫不脫節!現在連電影都加入陣營!


這不是真的長尾關鍵字!我要那個正版會幫我優化行銷廣告的那個長尾關鍵字

暑假快到了！與其讓兒子盲目拚學測，我寧可讓他先選擇人生方向~


人人都能是工程師！台灣 IT 培訓中心推「找到工作再付學費」專案，要試試嗎？