前端工程師必知:JavaScript數學物件

​

想當前端工程師的你絕對不能錯過這篇JavaScript文章!

Math物件的屬性

想當 前端工程師 的你,除了有了基本的 HTML常識之外,首先要知道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 的數學物件就介紹到此。若能善用數學物件，則可減省時間。不必自己寫函數。下一章我們將介紹另一個 JavaScript 的原生物件——日期物件。



相關文章:

達內教育評價:別再抱怨不景氣了!高中生靠SEM接案創業每月額外收入7萬

用Python寫出唐鳳「番茄鐘工作法」程式，讓AI幫你集中注意力!

痛失英才！台灣人工智慧學校執行長陳昇瑋辭世

人生是自己的, 達內教育評價要靠自己來體驗!

JavaScript學堂20.陣列

JavaScript教學21.陣列的方法與屬性

不只有前端工程師,還有後端.全端,你知道其中差異嗎?

除了前端工程師,你知道還有後端.全端嗎?

除了前端工程師,你是否還有聽說過後端.全端?你知道其中差異嗎?

一、前端方向

網站的“前端”是與用戶直接交互的部分，包括你在瀏覽網頁時接觸的所有視覺內容--從字體到顏色，以及下拉菜單和側邊欄。這些視覺內容，都是由瀏覽器解析、處理、渲染相關 HTML 、CSS、 JavaScript 文件後呈現而來。

技能與工具

前端工程師 的前端開發，就是要創造上面提到的網站面向用戶的部分背後的代碼，並通過建立框架，構建沉浸性的用戶體驗。為了實現這個目標，開發需要熟練運用下列語言、框架、工具庫：

三大語言：HTML，CSS，和 Javascript；

此外，掌握 jQuery 和 LESS 等工具庫也很重要，它們能幫助工程師以更高效的方式編碼；

很多前端開發崗也要求 Ajax 方法的使用經驗，它可以幫助你使用 Javascript 在後台從服務器拉取數據，協助實現頁面的動態加載。

打個比方， 前端工程師 的工作專注於“房屋”裝修，而蓋房子的工作由後端工程師負責。

通過一些專門的工具，前端工程師與設計師/用戶體驗分析師密切合作，幫助構建原型或是線框圖，參與產品開發到發布的全過程。

一些前端工程師甚至能準確定位影響用戶體驗的特定問題，並給出建議或是代碼解決方案，對產品設計帶來積極影響。

在專業能力外，與其它團隊協作，以理解特定目標、需求、機遇，以及高效的執行力也非常重要。

這聽起來工作內容很多，但也回報豐厚。 “我是一名技術人員，也是一名設計者，在數字平台上使用標記語言和代碼修改視覺元素並與之互動是很自然而有趣的體驗，”有八年前端開發經驗的Mikey Ilagan 說“這讓我能夠直接影響到用戶體驗，操縱應用和網站裡用戶所見並直接與之交互的元素，這非常棒！”

總之，前端工程師要為後端工程師搭建的“房屋”進行內部設計和裝修工作。裝潢風格由房屋所有者指定。 Apptix 的產品市場負責人 Greg Matranga 表示：“前端工程師有時更容易為他們的工作感到振奮，因為他們有更廣闊的空間發揮自己的創造力。”

二、後端方向

是什麼給網站前端提供支持？數據存放在哪裡？這就涉及後端內容了。網站後端包括服務器、應用還有數據庫。後端工程師構建並維護這些組件，為網站提供多方面支持。

技能與工具

為了讓服務器、應用、數據庫能夠彼此交互，後端工程師需要具有如下技能：

用於應用構建的服務器端語言：PHP, Ruby, Python, Java, .Net 等；

數據相關工具：MySQL, Oracle, SQL Server 等；

PHP框架：Zend, Symfony, CakePHP等；

版本控制工具：SVN, CVS , Git 等；

還要熟練使用 Linux 作為開發和部署環境。

後端工程師使用這些工具編寫乾淨、可移植、具有良好文檔支持的代碼來創建或更新 網站 應用。但在寫代碼之前，他們需要與客戶溝通，了解其實際需求並轉化為技術目標，制定最有效且精簡的方案來進行實現。

“我熱愛後端開發因為我喜歡操縱數據”，資深後端工程師就職於 Wildbit 的 JP Toto 說。 “現在共有和私有 API 已變成移動設備、網站以及其它互聯繫統交換數據的必備通道。創建對大家有用的 API 是我工作裡非常鼓舞人心的部分”。

三、全端

有時前後端之間並沒有明確的界限，“前端工程師通常需要額外學習後端技巧，反之亦然，尤其在特定市場條件下”，Matranga 說：“工程師需要跨領域知識，有時甚至需要成為全才。”

全端工程師，最初是6年多以前由 Facebook 帶動的概念。全端的核心，是指這批工程師能夠承擔包括前端、後端在內的所有功能開發任務，他們擁有一個技能全家桶。

“能夠同時承擔服務器端和客戶端工作會為你帶來更多機會，” Grovo 的全端工程師Federico Ulfo 說“當然這也就意味著更多的挑戰。以廚藝作類比，掌握烹飪和烘焙都需要時間與經驗積累，同時掌握兩者要花費更多精力。照著菜譜做誰都可以，我此處所說的是做出真正美味東西的能力。”

技能與工具

全端工程師也通常在服務器端進行編程工作，但他們熟練前端語言，能夠操縱網站面向用戶的部分。基本上可以形容他們是百事通。

具體工具依項目和客戶需求而定，全端工程師需要對網站 架構的每一個層次都有足夠的了解：搭建和配置Linux 服務器，編寫服務器端API，利用客戶端Javascript 代碼驅動應用，將設計層面的東西轉化到實際的CSS 代碼。

掌握並使用大量工具的同時，全端工程師需要敏捷地分配服務器端和客戶端任務，提供解決方案並對比不同方案的優劣。

參考連結:

JavaScript入門教學#21｜陣列的方法與屬性

JavaScript入門教學#22｜數學物件

今年10月即將入手的新身分證，它的UI設計有啥亮點？

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

UI/UX設計師的設計心理學指引

關鍵字廣告課程讓高三生提早就業卡位,開始賺錢(上)

制霸SEO#1第一步網頁標題Page Title與H1