Java課程是為了今日．Python課程是為了將來

JavaScript t教學小教室開課啦!快來看看今天要說什麼吧?就是遞增,遞減運算子啦!

熱門程式語言榜冠軍常客JavaScript的過去!
JavaScript 與 Java 有關係嗎？JavaScript 的編年史
1992：ScripEase
開發嵌入式語言「Cmm」的Nombas 公司，後來改名為「ScripEase」。之後出現可以嵌入在網頁的 CEnvi 版本
1995：從 LiveScript 改名為 JavaScript
Netscape (網景公司) 和昇陽科技合作完成了 Netscape Navigator 2.0 的腳本語言
「LiveScript」。之後因為「趕流行」而改名為「JavaScript」：因為當時網景公司與昇陽科技組成的開發聯盟為了讓這門語言搭上當時正夯的 Java 程式語言這個「熱詞」，因此臨時將 LiveScript 改名為 JavaScript，但這也成為日後大眾對這門語言有諸多誤解（如誤以為這門語言與 Java 有關）的原因之一。
1996：制定統一 JavaScript 標準
微軟在 IE 3.0 內發布 「JScript」，是為 JavaScript 的複製版。此時有三種版本的 JavaScript，一為 Netscapt Navigator 3.0 中的 JavaScript「本尊」、IE 中的 JScript 與前述 Nombas CEnvi 中的 ScriptEase。同年 11 月，Netscape 決定將 JavaScript提交給歐洲電腦製造商協會（ECMA）制定統一的 JavaScript 標準。
1997：發布第一版 ECMA-262
ECMA 發布 262 號標准文件（ECMA-262）的第一版，規定了瀏覽器腳本語言的標準，並將這種語言稱為「ECMAScript」（因為當時只有 Netscape 才能合法的使用「JavaScript」這個名字）。
2009：Node.js 讓 JavaScript 朝後端發展
CommonJS 規範讓 JavaScript 朝伺服器端發展。Node.js 就是遵循 CommonJS 規範，可以直接使用 Sockets API 建立各種網路服務程式。
現狀
多虧了 Node.js，讓原本只能應用在前端（瀏覽器端）的 JavaScript 現在也可以可應用在後端（伺服器端）。
JavaScript 有哪些特色？

可用任何編輯器開發

腳本不需要編譯，直接由 JavaScript 引擎「解釋（註：編輯一行就執行一行）」執行

靈活的「弱型別語言」：變數可被賦予不同資料類型的值。
強型別的語言遇到函式引數型別和實際叫用型別不合的情況，經常會直接出錯或編譯失敗；而弱型別的語言常常靈活地進行隱式轉換因應。

基於原型(Prototype-Based)的物件導向語言

可跨平台使用：Linux、Windows、MacOS、Android 等

不只是網頁開發：JavaScript 的應用

前端（瀏覽器端）的網頁互動效果

APP 開發

圖像使用者介面 (GUI)

2D 繪圖、3D 建模（如 Three.js）

網頁上實現虛擬實境（VR）與擴增實境（AR)

創建網頁伺服器、操作資料庫等後端操作

JavaScript 的開發環境

任何瀏覽器（IE、Google Chrome、Firefox、Safari、Opera 等）都自帶 JavaScript

APP 開發

如何建置 JavaScript 的開發環境

1. 瀏覽器端：自帶 JavaScript 解釋器，不需另外建置開發環境。


2. 伺服器端：至 Node.js 下載 Node.js 後，使用終端機（iOS) 或是命令提示字元（Windows）輸入「node -v」查看電腦上 Node.js 的版本已確認是否安裝。

今天的 JavaScript：熱門程式語言榜冠軍常客
根據 RedMonk 發表 2020 年第 3 季的熱門語言程式排名，儘管第二名 Python 之後的語言排行仍有變動之外，JavaScript 始終蟬聯冠軍寶座。有興趣可參考下列文章：

推薦閱讀：

• RedMonk 2020 第三季程式語言排名：JavaScript 仍是冠軍、Python 首度把 Java 踢出前兩名外！

而 RedMonk 熱門程式語言排行榜是結合 GitHub 及 Stack Overflow 平台而綜合出的排名結果：GitHub 能反映程式語言實際被使用的狀況；而 Stack Overflow 則顯示程式語言的討論熱度。RedMonk 綜合以上兩者，歸納出排行，可作為未來程式語言趨勢的參考。
相關文章:

Python與R語言之戰鹿死誰手?盤點5個即將消失的程式語言!

Google 在 Search Console 中啟用新的檢索統計報告

Google 12 月更新演算法！SEO今年排名最大洗牌

用說的就能寫程式！人工智慧替手傷工程師開發語音程式工具

人工智慧也要懂得如何安全駕駛!

Python教學小祕方-控制結構4運算子優先順序

人工智慧的未來樣貌從電影中看端倪

前端工程師必學Javascript數學物件,快來吧!
Math物件的屬性

前端工程師 指出Math 是 JavaScript 的原生物件，可進行很多種數學的運算。這個物件不是以函式建構式來生成，一切的屬性與方法都必須在 Math 物件上呼叫。
Math 物件包含多種屬性，列舉如下表：
 

1. 屬性


2. 描述

1. Ｅ


2. 歐拉常數，是自然對數函數的底數，約為 2.718。

1. LN2


2. 2 的自然對數

1. LN10


2. 10 的自然對數

1. LOG2E


2. 以 2 為底的歐拉常數（Ｅ），其值約為 1.442。

1. LOG10E


2. 以 10 為底的歐拉常數（Ｅ），其值約為 0.434。

1. PI


2. 圓周率，其值約為 3.14159

1. SQRT2


2. 2 的平方根，其值約為 2.414

1. SQRT1_2


2. 1/2 的平方根，其值約為 0.707

 
以上 Math 物件的屬性，範例如下：
See the Pen The Math object by Tedutw (@Tedutw) on CodePen.
Math物件的方法
前端工程師 指出Math 物件除了有許多屬性外，也有許多方法，列表如下：
 

1. 方法


2. 描述

1. abs(x)


2. 不用懷疑，就是回傳x的絕對值

1. acos(x)


2. 回傳x的反餘弦(三角函數，數學符號是arccos)

1. asin(x)


2. 回傳x的反正弦(反三角函數，數學符號是arcsin)

1. atan(x)


2. 回傳x的反正切(反三角函數，數學符號是arctan)

1. ceil(x)


2. 回傳離x最近的整數：若x為浮點數則向上取整數；x為整數擇取x本身

1. cos(x)


2. 回傳x的餘弦(三角函數，數學符號是cos)

1. exp(x)


2. 回傳值為以x指數的E

1. floor(x)


2. 回傳離x最近的整數：若x為浮點數則向下取整數；x為整數擇取x本身

1. log(x)


2. 回傳x的自然對數

1. max(x,y,z...,n)


2. 回傳最大值

1. min(x,y,z...,n)


2. 回傳最小值

1. pow(x,y)


2. 回傳值為x的y次方

1. random()


2. 隨機回傳0與1之間的任一數

1. sin(x)


2. 回傳x的正弦(三角函數，數學符號是sin)

1. sqrt(x)


2. 回傳值為x的平方根

1. tan(x)


2. 回傳x的正切(三角函數，數學符號是tan)

 
以上 Math 物件的方法，範例如下（不包含三角函數）：
See the Pen The Math object-method by Tedutw (@Tedutw) on CodePen.
綜合練習
讓我們來撰寫一個 JavaScript 程式：省先彈出一個視窗，要求使用者輸入數字。使用者輸入數字後，即會出現警示視窗，顯示該數字的平方根。
var x = prompt("請輸入一個數字","");
var answer = Math.sqrt(x);
alert(x+" 的平方根是 "+ answer);
執行結果如下：
此時我們輸入「64」，則會有以下結果：
JavaScript 的數學物件就介紹到此。若能善用數學物件，則可減省時間。

HTML 不必自己寫函數。下一章我們將介紹另一個 JavaScript 的原生物件——日期物件。
相關文章:
達內教育評價:別再抱怨不景氣了!高中生靠SEM接案創業每月額外收入7萬
用Python寫出唐鳳「番茄鐘工作法」程式，讓AI幫你集中注意力!
痛失英才！台灣人工智慧學校執行長陳昇瑋辭世
人生是自己的, 達內教育評價要靠自己來體驗!
人工智慧讓視障朋友看見世界(上)
Python程式語言必修六個標準的數據類型
人工智慧崛起 好怕怕!歐盟頒AI 白皮書(上)
 

知道了Javascript陣列的方法與屬性,快來學學吧!
陣列(Arrays)-length 屬性
前端工程師   都知道 JavaScript 陣列(Arrays）擁有一些實用的內置屬性和方法，像 length 屬性，是用以回傳一個陣列中元素的數量。寫法如下例所示：
See the Pen JavaScript-Array-length-property by Tedutw (@Tedutw) on CodePen.
以上說明左側的原始碼，第一行的「courses」陣列有三個元素：HTML、CSS、JS，因此回傳數值是「3」;第四行的「courses1」陣列擁有四個元素：HTML、CSS、JS、JQuery，所以回傳數值是「4」
合併陣列（Combining Arrays）-concat () 方法
JavaScript 的 concat () 方法被用來合併兩個或多個陣列。此方法不會改變原本的陣列，而是新增加另一個經過合併過的陣列後回傳。
See the Pen JavaScript-combining-Arrays by Tedutw (@Tedutw) on CodePen.
上述範例左側的原始碼，第一行為「c1」陣列回傳為「HTML,CSS」;第二行的「c2」陣列回傳為「JS,JQuery」;第三行就採用 concat () 方法來合併第一、第二行的 c1、c2 陣列，是為新陣列「c3」，其回傳值有四個元素「HTML,CSS,JS,JQuery」。
JavaScript 的陣列 (Arrays）教學在此告一個段落，請希望想當前端工程師的讀者務必將前一章「陣列的介紹」與本章再複習一次。下回的JavaScript教學系列，我們將陸續介紹 Math Object 數學物件與 Date Object 日期物件等 JavaScript 原生物件。
相關文章:

JavaScript入門教學#18｜創造JavaScript物件(Objects)

你是我的眼！Google AI 眼鏡助視障朋友「看見」世界


差點被拋棄的冠軍程式語言-Java入門教學（一）Java 身世之謎／寫出第一個Java程式

APCS 是什麼？所有 APCS 檢定的問題這篇都會回答你！


搞UI設計不可不知的心理小祕密!



JavaScript網頁前端技能不可少!

你不能不知JavaScript變數命名規範

知道了Javascript陣列(Array),快來學學吧!
陣列(Arrays)
JavaScript 的「陣列(Arrays)」可以把他比喻為「可以一次承裝多個值的變數」。一般的變數一次只能裝一個值，但陣列一次可以裝很多個變數。例如，現在有三個課程名稱「HTML」、「CSS」、「JS」，就要設立三個變數來承裝。原始碼如下所示：
var course1 ="HTML";
var course2 ="CSS";
var course3 ="JS";
若是使用「陣列(Arrays)」，原始碼就可以精簡成一行文，如下所示：
var courses = new Array("HTML", "CSS", "JS");
語法解析：上述的代碼是宣告名為「courses」的陣列。這個陣列包含三個值（或稱元素）。建立新陣列的寫法為「new Array(元素一,元素二,元素三)」
取出陣列的某一元素
陣列裡含這麼多元素，當我們要找出某個元素時，就需要把索引號碼寫在方括號內。要取出陣列中的第 X 個元素，語法為「陣列名稱[X-1]」(因為陣列元素的編號是從零開始，不是從一開始，所以第一個元素的索引號為「0」、第二個元素的索引編號為「1」，由此類推⋯⋯)
我們承接前一段「名稱為 courses 的陣列」的例子，假如今天我們要從 courses 陣列中取出「JS」，並且把「JS」改成「JQuery」，寫法如下：
var courses = new Array("HTML", "CSS", "JS");
var course = courses[2]; // 取出第三個元素「JS」
courses[2] = "JQuery"; //將第三個元素名稱改成「JQuery」
See the Pen JavaScript-Array1 by Tedutw (@Tedutw) on CodePen.
若當我們輸入的索引數字，已經超過了陣列元素數目減去「1」的數字時（例如上述例子的陣列中只有三個元素，但是你卻輸入了「3」或是比「3」還大的數字，則 JavaScript 會回傳「undefined」）。如以下所示：
var courses = new Array("HTML", "CSS", "JS");
document.write(courses[3])
See the Pen JavaScript-Array2 by Tedutw (@Tedutw) on CodePen.
使用其他方式來建立陣列 Array
除了上述方式，我們還可以藉由先輸入陣列元素個數、之後再告知哪個序號對應到哪個元素的方式來建立陣列。
例如，我們把上述的 courses 陣列使用此方法來寫，則 JavaScript 原始碼如下：
var courses = new Array(3);
courses[0] = "HTML";
courses[1] = "CSS";
courses[2] = "JS";
JavaScript 的陣列是動態的，因此我們在上述例子中的第一行「var courses = new Array(3);」，也可以不給元素的數目，即為「var courses = new Array();」。此時，後面的元素就可自由增加如下：
var courses = new Array();
courses[0] = "HTML";
courses[1] = "CSS";
courses[2] = "JS";
courses[3] = "JQuery"
實務上常用：陣列實字 (Array literal)
以上介紹了JavaScript陣列的寫法。為了提高前端工程師的執行速度，我們可以把以上的寫法簡化成陣列實字 (Array literal)寫法，如下所示：
var courses = ["HTML", "CSS", "JS"];
這樣子的寫法，等同於「var courses = new Array("HTML", "CSS", "JS");」，差別是陣列實字的寫法，少了關鍵字「new Array」，並且把元素左右側的括號改成方形括號。此種簡化的寫法最常被前端工程師所使用。
今天就介紹到這裡，在接下來「JavaScript入門教學#21」的文章中，我們將繼續介紹陣列的屬性、合併方法等。建議讀者們先消化一下陣列的寫法，再進入下一章學習陣列的活用，才會學得更輕而易舉。
相關文章:

JavaScript入門教學#18｜創造JavaScript物件(Objects)

你是我的眼！Google AI 眼鏡助視障朋友「看見」世界


差點被拋棄的冠軍程式語言-Java入門教學（一）Java 身世之謎／寫出第一個Java程式

APCS 是什麼？所有 APCS 檢定的問題這篇都會回答你！


搞UI設計不可不知的心理小祕密!



JavaScript網頁前端技能不可少!

你不能不知JavaScript變數命名規範

JavaScript變數命名規範開講
小編跟大家分享關於前端工程師不能不知道的JavaScript變數命名規範，前端工程師的朋友們和小編一起看一看吧，希望本篇文章能夠對大家有所幫助。