首頁 web前端 js教程 使JavaScript進行斷舍離的函數分享

使JavaScript進行斷舍離的函數分享

Feb 09, 2018 pm 01:37 PM
javascript js 分享

本文主要跟大家介紹了用函數式程式設計對JavaScript進行斷舍離,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟著小編過來看看吧,希望能幫助大家。

關於DHTML

DHTML是Dynamic HTML的簡稱,就是動態的html(標準通用標記語言下的一個應用),是相對傳統的靜態的html而言的一種製作網頁的概念。所謂動態HTML(Dynamic HTML,簡稱DHTML),其實並不是新的語言,它只是HTML、CSS和客戶端腳本的一種集成,即一個頁面中包括html+css+javascript(或其它客戶端腳本),其中css和客戶端腳本是直接在頁面上寫而不是連結上相關文件。

在那個時候,JavaScript的演化很慢,主要應用在表單驗證。因此,不像今天這麼火爆,並沒有引起太多的關注。可以說只是一個錦上添花的附加物,你需要確保在瀏覽器停用JavaScript之後,你的應用程式仍然可以正常使用。再往後,框架一個接著一個出現:jQuery,Knockout, Angular, React, Vue, 等等。

同樣,JavaScript也在加速演化。我們才使用ES6不久,現在人們幾乎已經跳過ES7,開始討論ES8了。

並且,我們有很多替代品,像是TypeScript,CoffeScript,ClojureScript, ELM,等等。

我們已經被太多的框架和語言所淹沒,很難去追蹤和掌握所有的語言和框架。

錯誤路線

當JavaScript逐漸成熟,物件導向程式設計(OOP)的概念也滲透進來,而且我曾經很喜歡。

我開始嘗試所有不同的方法來建立類,我最終也可以正確的使用繼承。我對自己說:JavaScript開始真的像一個語言了!

但是,直到多年以後我發現OOP是JavaScript引進的最糟糕的一個設計!

我嘗試將我對C#的理解帶入JavaScript中去。一開始充滿期待,但後來發現真的太複雜,太燒腦了。

這主要是因為JavaScript的原型繼承和C#不一樣,我已經習慣每天寫類似console.log(this)這樣飄逸的程式碼。但是現在呢?如果我一不小心沒按照規則來,那將會帶給我惡夢。私有方法和私有值必須要在名字前面加上底線,甚至必須用閉包來保證私有。

因此,不僅OOP導致了許多問題,同時也因為新增OOP帶來了許多新的問題。

函數式程式設計

一開始我並不理解。我可以閱讀並理解這些用函數式編寫的程式碼,但我不知道為什麼!最終,我強迫我自己去學習它。

函數式語言給了我一個全新的視角,讓我從一個完全不同的方式去看待程式設計。

一開始會覺得不自然,需要時間適應。所有的定義都是基於函數,值不可更改,無狀態。我用函數式的思維去解決問題。因為不熟悉,我花了更長的時間學習。漸漸地,我熟練了使用函數式的方法去程式設計。並且,我也知道所有程式碼這樣寫的內在意義。

我的程式碼更簡潔了,而且很容易重複使用。漸漸的,我以前使用的那些語言特性從程式碼中消失了,我的程式碼看起來像是用另一個語言寫。我還在用JavaScript嗎?

1. 不再使用var

我用const取代了var。透過函數式的設計,我的函數都是純(pure)的。不會再去對一個變數進行值的變更操作,同樣也是為了確保不會對其操作。

我會檢查程式碼確保每一個var,甚至let,所有聲明都使用const。

2. 沒有for迴圈

在學習程式語言的時候,我們一開始就會學到for迴圈。但自從學習了函數式編程,我將for迴圈都改成了使用filter, map和reduce來實現。對於那些需要一些額外計算的需求,我會使用遞迴或則第三方函式庫例如lazy.js。

如今我的程式碼裡面完全沒有for循環了,如果你看到了,告訴我我會把它消除。

3. if也可以被簡化

我開始停止在if裡面寫大大塊的程式碼。我將裡面的邏輯抽取出來單獨放在一個函數中。這樣,我們就可以將if用三元算子(a?b:c)來簡化。

如今我的程式碼裡面幾乎沒有if語句。為了方便其他開發者理解我的程式碼,我很少使用它。

4. 和switch說拜拜

同樣,我也不喜歡用switch,而是找一個函數式的寫法。

我也很喜歡用Ramda的cond算子來取代swtich。

5. 不在擔心this

對的,你沒有聽錯!我們也可以完全消除this。

函数式的JavaScript可以让你完全抛弃使用烦人的this
现在只有数据和函数,甚至数据不过是函数的一种特殊表达形式,你再也不需要this了。我开始将对象理解为函数式语言中状态(state)和函数。我甚至不需要把状态或则函数和对象绑定到一起,就像OOP中那样。

面向对象的设计不是必须的

现在往回看,我发现面型对象编程带来的复杂度真的是不必要的。我可以使用函数式语言实现同样的功能,完成相同的任务。而且,代码更加轻简,因为不在需要将这些复杂的对象传来传去。只有数据和函数,而且因为函数没有和对象绑定,更加容易复用。我不在需要担心传统的原型继承带来的所有的问题,JavaScript设计的并不好。

JavaScript缺乏私有、公有、内部或则被保护这类访问控制器也不再是一个问题。访问控制器是用来解决由于引入面向对象编程而设计的。在函数式的JavaScript中,这些问题不复存在。

总结

我的代码现在看上去完全不同。它包含了很多纯函数,我将它们做成不同的ES6模块。这些函数可以被使用来构建更加复杂的函数。很大一部分函数都是很简单的一行lambda表达式。

现在我看待软件的思维也变了:输入是一个数据流,然后程序作用到该数据流上对数据进行各种操作,然后返回新的数据。

函数式设计对程序语言的影响以及无处不在,C#中的LINQ就是一个最佳的例子。同样Java 8也引入了函数式语言的特性。

相关推荐:

详细介绍XML行为(behavior)-新的DHTML?

以上是使JavaScript進行斷舍離的函數分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

夸克網盤怎麼分享到百度網盤? 夸克網盤怎麼分享到百度網盤? Mar 14, 2024 pm 04:40 PM

  夸克網盤和百度網盤都是很便利的儲存工具,不少的用戶都在詢問這兩款軟體互通嗎?夸克網盤怎麼分享到百度網盤?下面就讓本站來為用戶們來仔細的介紹一下夸克網盤的文件怎麼保存到百度網盤方法吧。夸克網盤的文件怎麼保存到百度網盤方法1、想要知道怎麼把夸克網盤的文件轉到百度網盤,首先在夸克網盤上下載需要保存的文件,然後打開百度網盤客戶端後,選擇壓縮檔案要儲存的資料夾,雙擊開啟該資料夾。  2、開啟該資料夾後,點選視窗左上角區域的「上傳」。  3、在電腦中找到需要上傳的壓縮文件,點選選

網路易雲音樂怎麼分享到微信朋友圈_網易雲音樂分享到微信朋友圈教程 網路易雲音樂怎麼分享到微信朋友圈_網易雲音樂分享到微信朋友圈教程 Mar 25, 2024 am 11:41 AM

1.首先我們進入到網易雲音樂中,然後在軟體首頁介面中,點選進入到歌曲的播放介面中。 2.然後在歌曲播放介面中,找到右上方的分享功能按鈕,如下圖紅框所示位置,點擊選擇分享的管道;在分享管道中,點擊底部的「分享至」選項,然後選擇第一個“微信朋友圈”,即可將內容分享至微信朋友圈。

建議:優秀JS開源人臉偵測辨識項目 建議:優秀JS開源人臉偵測辨識項目 Apr 03, 2024 am 11:55 AM

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

百度網盤怎麼分享文件給好友 百度網盤怎麼分享文件給好友 Mar 25, 2024 pm 06:52 PM

近期,百度網盤安卓客戶端迎來了全新的8.0.0版本,這個版本不僅帶來了許多變化,還增添了許多實用功能。其中,最引人注目的便是資料夾共享功能的增強。現在,使用者可以輕鬆邀請好友加入,共同分享工作與生活中的重要文件,實現更便利的協作與分享。那麼究竟該如何分享給好友自己需要分享的文件呢,下文中本站小編就會為大家帶來詳細內容介紹,希望能幫助大家! 1)開啟百度雲APP,先點選在首頁選擇相關的資料夾,再點選介面右上角的【...】圖示;(如下圖)2)接著點選「共用成員」一欄中的【+ 】,最後在勾選所

芒果tv會員帳號分享2023 芒果tv會員帳號分享2023 Feb 07, 2024 pm 02:27 PM

芒果TV擁有各種類型的電影、電視劇、綜藝等資源,用戶可以在其中自由的選擇觀看。芒果tv會員不僅能夠看到全部的VIP劇而且還能夠設定最高清的畫質,幫助用戶爽快看劇,下面小編就給大家帶來一些芒果tv免費的會員帳號供用戶們使用,趕緊來看一看吧。芒果tv最新會員帳號免費分享2023:注意:都是收集的最新會員帳號,可以直接登入使用,不要隨意的修改密碼。帳號:13842025699密碼:qds373帳號:15804882888密碼:evr6982帳號:13330925667密碼:jgqae帳號:1703

解決Discuz微信分享無法顯示的問題 解決Discuz微信分享無法顯示的問題 Mar 09, 2024 pm 03:39 PM

標題:解決Discuz微信分享無法顯示的問題,需要具體程式碼範例隨著行動網路的發展,微信成為了人們日常生活中不可或缺的一部分。在網站開發中,為了提升使用者體驗和擴大網站的曝光度,許多網站會整合微信分享功能,讓使用者能夠輕鬆分享網站的內容到朋友圈或微信群組。然而,有時在使用Discuz等開源論壇系統時,會遇到微信分享無法顯示的問題,這給使用者體驗帶來了一定的困

PHP與JS開發技巧:掌握繪製股票蠟燭圖的方法 PHP與JS開發技巧:掌握繪製股票蠟燭圖的方法 Dec 18, 2023 pm 03:39 PM

隨著網路金融的快速發展,股票投資已經成為了越來越多人的選擇。而在股票交易中,蠟燭圖是常用的技術分析方法,它能夠顯示股票價格的變動趨勢,幫助投資人做出更精準的決策。本文將透過介紹PHP和JS的開發技巧,帶領讀者了解如何繪製股票蠟燭圖,並提供具體的程式碼範例。一、了解股票蠟燭圖在介紹如何繪製股票蠟燭圖之前,我們首先需要先了解什麼是蠟燭圖。蠟燭圖是由日本人

簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

See all articles