react特性-聲明式編程

網絡上有很多關於聲明式編程和命令式編程的對比和說明,但是大多都是大同小異,總的來說就是一句話"告訴電腦我要做什么,但是讓電腦自己決定怎么做."

1.命令式編程.

   這種編程模式比較常見,也是我們比較好理解的方式.它把完成某個需求的每一步都充分展示出來了,一步一步地指揮計算機做事情.

var array = [1,2,3,4,5]

var newArray = []

for(var i = 0; i < array.length; i++) {

  var newNumber = array[i] -1
  newArray.push(newNumber)

}
console.log(newArray) //=> [0,1,2,3,4]

特點:在執行完之前,計算機並不知道我要做什么,為什么這么做.它只是一步一步地執行了.

2.聲明式編程.

  區別於命令式編程,它的特點就是我告訴計算機做什么,但是沒有告訴你怎么做.

var array = [1,2,3,4,5]

var newArray = array.map(function(n) {

  return n -1
})
console.log(array) //=> [0,1,2,3,4]

 我只告訴計算機,你執行這個map函數就好了,至於我要干嘛我不告訴你,具體怎么做也不告訴你.

3.思路對比.

如果還是不清楚,那我再拿個案例來分析.

命令式編程---------------
var array = [1,2,3,4,5]

var total = 0

for(var i = 0; i < array.length; i++) { total *= numbers[i] }
console.log(total) //=> 120

聲明式編程-----------------------

var array = [1,2,3,4,5] var total = array.reduce(function(sum, n) { return sum * n }); console.log(total) //=> 120

說明:相比於命令式編程,聲明式編程最大的特點是沒有"if"、"for"這類的控制語句,而是直接給一個函數,並且聲明一個變量接收函數執行結果,讓計算機把數據當作參數放進去執行一遍就行了.

 

4.統一性

到目前為止,很多人說這兩個編程范式是對立的.我覺得這並不准確,並不是說聲明式編程的思想是盡可能少的代碼實現,那命令式就盡可能多.這並不嚴謹,那如何理解他們的關系呢?

仔細看上面代碼對比,你發現差別就是在紅色字體處.假如:

先聲明一個函數:
function reduce(array,total){

for(var i = 0; i < array.length; i++) { total *= numbers[i] }

return total
}

命令式編程---------------
var array = [1,2,3,4,5]
var total = 0

var total = reduce(array,total);
console.log(total) //=> 120

如果不看函數的聲明,是不是很像聲明式編程?如果把reduce函數給array的原型,從代碼形式上就更像了.當然,我們這里不討論array.reduce()的具體功能.只是從代碼特點上來說:聲明式編程就是函數編程思想的一種.其實就是凸顯了函數式編程的聲明性.

 

結論:聲明式編程就是拿來主義,拿已經封裝好的純函數來實現目的.但是實際上執行的步數不見得會比命令式的代碼少,有時候甚至會更多.但是,由於這些純函數有極強的穩定性,所以程序員根本不用考慮內部的具體實現過程.極大地減少了身心負擔.