js算法初窺06(算法模式03-函數式編程)

   在解釋什么是函數式編程之前,我們先要說下什么是命令式編程,它們都屬于編程范式的一種。命令式編程其實就是一塊一塊的代碼,其中包括了我們要執行的邏輯或者判斷或者一些運算。也就是按部就班的一步一步完成我們所需要的邏輯。而函數式編程則是類似于一個函數一個函數的調用。我們來看代碼,更清晰的理解一下函數式編程與命令式編程的區別。

//這是命令式
var printArray = function (array) {for (var i = 0; i < array.length; i++) {console.log(array[i])}
}
printArray([1,2,3,4,5]);
//函數式
var forEach = function (array,action) {for (var i = 0; i < array.length; i++) {action(array[i])}
}var logItem = function (item) {console.log(item)
}forEach([2,3,4,5,6],logItem)

  我們先來看看上面的代碼做了什么——“遍歷數組,然后打印數組的每一項”。在命令式編程中,我們一步一步的完成了這句話。先遍歷數組,然后打印每一項元素。那么我們再來看函數式編程,我們先聲明了兩個函數,一個是遍歷數組元素的forEach(這里的action參數其實就是一個回調函數),一個是打印每一項的logItem。我們把每一步驟的需要操作的邏輯都用函數來區分開,最后再調用函數來執行運算。

  在有了ES6之后,我們可以更加方便的用函數式編程范式來編寫我們的代碼,下面我們再來看一個例子。

//找出數組中元素最小的值
//代碼十分簡單,我們假設數組的第一個元素是最小的并賦值給minVal變量
//遍歷除第一項元素以外的所有數組內元素并與minVal比較,如果當前的minVal比array[i]還要大,那么就把minVal替換成array[i];
//最后返回結果
var findMinValInArray = function (array) {var minVal = array[0];for (var i = 1; i < array.length; i++) {if(minVal > array[i]) {minVal = array[i];}}return minVal;
}
console.log(findMinValInArray([7,8,9,5,31,2]));
//那么我們其實可以更簡單的實現上面的方法,比如Math.min以及解構操作符(...)
const _min = function (array) {return Math.min(...array);
}
console.log(_min([5,6,9,3,1]));
//我們還可以用ES6的箭頭函數,讓我們的代碼更好看一些。
const min = arr => Math.min(...arr);
console.log(min([2,3,9,4,8]))

  上面代碼中Math.min是一個方法,返回參數中的最小值,參數可以是無限個。那么還有ES6的箭頭函數以及擴展運算符(...)。這里不做詳細的解釋,附上連接地址,大家可以更為詳細的知道什么是箭頭函數以及擴展運算符。

  那么,接下來我們看看如何利用我們前面已經學過的數組方法來讓我們的代碼更加“函數式”。

//我們先看一個命令式編程的例子
var daysOfWeek = [{name:"Monday",value:1},{name:"Tuesday",value:2},{name:"Wednesday",value:7},
]
var daysOfWeekValues_ = [];
for (var i = 0; i < daysOfWeek.length; i++) {daysOfWeekValues_.push(daysOfWeek[i].value);
}//再來看看函數式編程的樣子
var daysOfWeekValues = daysOfWeek.map(function (day) {//這個day其實就是數組中的每一項,具體可以去我前面的文章查看map的參數return day.value;
})
console.log(daysOfWeekValues);//我們還可以使用filter來過濾一個數組的值。
//比如:
//命令式
var positiveNumbers_ = function (array) {var positive = [];for (var i = 0; i < array.length; i++) {if(array[i] >= 0) {positive.push(array[i]);}}return positive;
}
console.log(positiveNumbers_([-1,2,1,-2]));
//函數式
var positiveNumbers = function (array) {return array.filter(function (num) {return num >= 0;})
}console.log(positiveNumbers([1,2,-1,-2,-5]));//我們再來看看reduce函數
//命令式
var sumValues = function (array) {var total = array[0];for (var i = 1; i < array.length; i++) {total += array[i];}return total;
}
console.log(sumValues([1,2,3,4,5]));
//函數式
var sum_ = function (array) {return array.reduce(function (a,b) {return a + b;})
}console.log(sum_([1,2,3,4,5]))
//我們還可以用ES6的方法改進一下
var sum = arr => arr.reduce((a,b) => a + b);
console.log(sum([1,2,3,4,5]))

  上面我們看了一些函數式編程的例子,代碼都不復雜,很容易理解。所以就沒做詳細的注釋。那么我們下面再看最后一個有趣的例子。

//我們來用命令式編程實現一個二維數組合并為一維數組的方法
var mergeArrays_ = function (arrays) {var count = arrays.length,newArray = [],k = 0;for (var i = 0; i < count; i++) {for (var j = 0; j < arrays[i].length; j++) {newArray[k++] = arrays[i][j];}}return newArray;
}console.log(mergeArrays_([[1,2,3],[4,5],[6]]));//我們最后再看看函數式的寫法
var mergeArraysConcat = function (arrays) {return arrays.reduce(function (p,n) {return p.concat(n);})
};
console.log(mergeArraysConcat([[1,2,3],[4,5],[6],[7]]))//我們再來看看牛逼的方法
const mergeArrays = (...arrays) => [].concat(...arrays);
console.log(mergeArrays([1,2,3],[4,5],[6],[7],[8]));
//這一行代碼需要解釋下。我們來看看(...arrays)會變成什么
console.log(...[[1,2,3],[4,5],[6],[7],[8]])//一個一個單獨的數組
//然后我們再用一個空數組去合并參數中的每一個單獨的數組就可以了

  到這里我們函數式編程的簡單講解就結束了,上面的內容其實不過萬分之一,希望能讓大家對代碼的編寫打開了另一扇窗戶,其實函數式編程在我們的實際工作中也是極為有用的。希望大家可以認真對待和學習,最后,附上一個可以學習函數式編程的網址:http://reactivex.io/learnrx/。這是一個外國的練習網站,只要會簡單的英語看下來應該是沒有問題的。

  

  最后,由于本人水平有限,能力與大神仍相差甚遠,若有錯誤或不明之處,還望大家不吝賜教指正。非常感謝!

轉載于:https://www.cnblogs.com/zaking/p/9085235.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/250197.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/250197.shtml
英文地址,請注明出處:http://en.pswp.cn/news/250197.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

[mmdetection] - win10配置mmdetection(1.1和2.0) + 訓練網絡(faster-rcnn、mask-rcnn)

pytorch配置 - 參考 mmdetextion 配置(win10) mmdetection訓練faster-rcnn (win10) mmdetection訓練mask-rcnn (win10) mmdetection 2.0配置(win10) mmdetection 2.0訓練Faster-RCNN&#xff08;win10) mmdetection 2.0全家桶訓練&#xff08;終結版) labelme安裝教程 l…

13、Spring Boot 2.x 多數據源配置

1.13 Spring Boot 2.x 多數據源配置 完整源碼&#xff1a; Spring-Boot-Demos轉載于:https://www.cnblogs.com/Grand-Jon/p/9999779.html

[pytorch、學習] - 3.5 圖像分類數據集

參考 3.5. 圖像分類數據集 在介紹shftmax回歸的實現前我們先引入一個多類圖像分類數據集 本章開始使用pytorch實現啦~ 本節我們將使用torchvision包,它是服務于PyTorch深度學習框架的,主要用來構建計算機視覺模型。torchvision主要由以下幾部分構成: torchvision.datasets: …

python自動化第三周---文件讀寫

1.python文件對象提供了三個“讀”方法&#xff1a; read()、readline() 和 readlines()。每種方法可以接受一個變量以限制每次讀取的數據量。 read() 每次讀取整個文件&#xff0c;它通常用于將文件內容放到一個字符串變量中。如果文件大于可用內存&#xff0c;為了保險起見&a…

最詳細的java泛型詳解

來源&#xff1a;最詳細的java泛型詳解 對java的泛型特性的了解僅限于表面的淺淺一層&#xff0c;直到在學習設計模式時發現有不了解的用法&#xff0c;才想起詳細的記錄一下。 本文參考java 泛型詳解、Java中的泛型方法、 java泛型詳解 1. 概述 泛型在java中有很重要的地位&a…

[pytorch、學習] - 3.6 softmax回歸的從零開始實現

參考 3.6 softmax回歸的從零開始實現 import torch import torchvision import numpy as np import sys sys.path.append("..") import d2lzh_pytorch as d2l3.6.1. 獲取和讀取數據 batch_size 256 train_iter, test_iter d2l.load_data_fashion_mnist(batch_si…

Django基礎必備三件套: HttpResponse render redirect

1. HttpResponse : 它的作用是內部傳入一個字符串參數, 然后發給瀏覽器 def index(request):return HttpResponse(ok) 2. render : 可以接收三個參數, 一是request參數, 二是待渲染的 html 模板文件, 三是保存具體數據的字典參數 def index(request):return render(request, …

React 簡單實例 (React-router + webpack + Antd )

React Demo Github 地址 經過React Native 的洗禮之后&#xff0c;寫了這個 demo &#xff1b;React 是為了使前端的V層更具組件化&#xff0c;能更好的復用&#xff0c;同時可以讓你從操作dom中解脫出來&#xff0c;只需要操作數據就會改變相應的dom&#xff1b; 而React Nat…

[pytorch、學習] - 3.7 softmax回歸的簡潔實現

參考 3.7. softmax回歸的簡潔實現 使用pytorch實現softmax import torch from torch import nn from torch.nn import init import numpy as np import sys sys.path.append("..") import d2lzh_pytorch as d2l3.7.1. 獲取和讀取數據 batch_size 256 train_iter…

【模板】NTT

NTT模板 #include<bits/stdc.h> using namespace std; #define LL long long const int MAXL22; const int MAXN1<<MAXL; const int Mod998244353; int rev[MAXN],A[MAXN],B[MAXN],C[MAXN]; int fast_pow(int a,int b){int ans1;while(b){if(b&1)ans1ll*ans*a%…

centos 7 php7 yum源

rpm -Uvh https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpmrpm -Uvh https://mirror.webtatic.com/yum/el7/webtatic-release.rpm 轉載于:https://www.cnblogs.com/myJuly/p/10008252.html

[pytorch、學習] - 3.9 多重感知機的從零開始實現

參考 3.9 多重感知機的從零開始實現 import torch import numpy as np import sys sys.path.append("..") import d2lzh_pytorch as d2l3.9.1. 獲取和讀取數據 batch_size 256 train_iter, test_iter d2l.load_data_fashion_mnist(batch_size)3.9.2. 定義模型參…

C語言逗號運算符和逗號表達式基礎總結

逗號運算符的作用&#xff1a; 1&#xff0c;起分隔符的作用&#xff1a; 定義變量用于分隔變量&#xff1a;int a,b輸入或輸出時用于分隔輸出表列 printf("%d%d",a,b) 2,用于逗號表達式的順序運算符 語法&#xff1a;表達式1&#xff0c;表達式2&#xff0c;...,表達…

java基礎-泛型舉例詳解

泛型 泛型是JDK5.0增加的新特性&#xff0c;泛型的本質是參數化類型&#xff0c;即所操作的數據類型被指定為一個參數。這種類型參數可以在類、接口、和方法的創建中&#xff0c;分別被稱為泛型類、泛型接口、泛型方法。 一、認識泛型 在沒有泛型之前,通過對類型Object的引用來…

MySQL數據庫視圖(view),視圖定義、創建視圖、修改視圖

原文鏈接&#xff1a;https://blog.csdn.net/moxigandashu/article/details/63254901轉載于:https://www.cnblogs.com/chrdai/p/9131881.html

[pytorch、學習] - 3.10 多重感知機的簡潔實現

參考 3.10. 多重感知機的簡潔實現 import torch from torch import nn from torch.nn import init import numpy as np import sys sys.path.append("..") import d2lzh_pytorch as d2l3.10.1. 定義模型 num_inputs, num_outputs, num_hiddens 784, 10, 256 # 參…

【匯編語言】——第三章課后總結

第三章 的書本上主要有以下幾個內容&#xff1a; 1.內存中字的存儲 字單元&#xff1a;即存放一個字型數據&#xff08;16位&#xff09;的內存單元&#xff0c;由兩個地址連續的內存單元組成。 小端法&#xff1a;高地址內存單元中存放字型數據的高位字節&#xff0c;低地址內…

如何從 Android 手機免費恢復已刪除的通話記錄/歷史記錄?

有一個有合作意向的人給我打電話&#xff0c;但我沒有接聽。更糟糕的是&#xff0c;我錯誤地將其刪除&#xff0c;認為這是一個騷擾電話。那么有沒有辦法從 Android 手機恢復已刪除的通話記錄呢&#xff1f;” 塞繆爾問道。如何在 Android 上恢復已刪除的通話記錄&#xff1f;如…

springBoot 登錄攔截器

1、首選創建一個繼承HandlerInterceptor的攔截器 import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;import org.springframework.web.servlet.HandlerInterceptor; import org.springframework.web.servlet.ModelAndView; /*** 攔…

[pytorch、學習] - 3.11 模型選擇、欠擬合和過擬合

參考 3.11 模型選擇、欠擬合和過擬合 3.11.1 訓練誤差和泛化誤差 在解釋上述現象之前&#xff0c;我們需要區分訓練誤差&#xff08;training error&#xff09;和泛化誤差&#xff08;generalization error&#xff09;。通俗來講&#xff0c;前者指模型在訓練數據集上表現…