Mengapakah JavaScript menggunakan pengaturcaraan berfungsi?

Sebab: 1. Sintaks js dipinjam daripada bahasa pengaturcaraan berfungsi seperti Skim. 2. Setakat penyemak imbas, dengan pembangunan pelbagai rangka kerja satu halaman, keupayaan pemprosesan pelanggan terus bertambah baik, dan semakin banyak logik perniagaan diletakkan pada klien, menyebabkan semakin banyak keadaan akan dikekalkan oleh pelanggan ;Masalah yang berlaku ialah jika anda tidak berhati-hati, anda akan menggunakan sejumlah besar fungsi yang bergantung pada pembolehubah luaran. menjadikan status sukar untuk dijejaki, kebolehbacaan kod yang lemah, dan sukar untuk dikekalkan, dan pengaturcaraan berfungsi mempunyai penyelesaian yang baik.

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.

1.

Pengaturcaraan fungsional (FP), yang dirujuk sebagai FP, bukanlah perpustakaan atau rangka kerja, berbanding pengaturcaraan prosedur (Procedural programming), tetapi paradigma pengaturcaraan. FP mengelakkan atau meminimumkan kesan sampingan panggilan fungsi pada keadaan dan sistem luaran dengan mengisytiharkan pemprosesan data abstrak fungsi tulen.

Kesan sampingan yang dipanggil secara amnya termasuk menukar keadaan sistem di luar fungsi, membuang pengecualian, memproses operasi pengguna, mengubah suai parameter input, operasi pertanyaan pangkalan data, operasi DOM, dsb., yang mungkin menyebabkan ralat sistem.

2. Mengapa menggunakan idea pengaturcaraan berfungsi dalam JavaScript

2.1 Dari perspektif ciri bahasa

Sintaks JavaScript telah dipinjam daripada Skim bahasa pengaturcaraan berfungsi. Dengan kemajuan piawaian bahasa, kefungsian bahasa itu sendiri sentiasa diperkayakan Penutupan, fungsi anak panah, fungsi tertib tinggi, lelaran tatasusunan dan fungsi lain memudahkan untuk melaksanakan FP dalam JavaScript 🎜>

2.1.1. Ungkapan Lambda

Ungkapan lambda sebenarnya adalah fungsi tanpa nama yang menggunakan anak panah untuk mewakili dengan jelas hubungan pemetaan antara input dan output JavaScript menggunakan fungsi anak panah untuk melaksanakannya.

const multiply = x => x * x
multiply(6) // 36

2.1.2 Fungsi tertib tinggi

Fungsi tertib tinggi boleh menerima satu atau lebih fungsi sebagai parameter input dan mengeluarkan fungsi.

Tulis dua contoh mudah

const add = x => y => x + y
const add10 = add(10)
add10(5) // 15
const compose = (...fns) => x =>  fns.reduce((acc, fn) => fn(acc), x)
const a = x => x + 1
const b = x => x + 2
const composedFn = compose(a, b)
composedFn(1) // 1 + 1 + 2 = 4

2.1.3 peta penapis untukSetiap lelaran mengurangkan

Peta penapis untukEach reduce di bawah Array.prototype adalah semua fungsi tertib tinggi, kerana Parameter input ialah fungsi.

const flatten = (arr = []) => arr.reduce(
  (acc, val)=> accconcat(Array.isArray(val) ? flatten(val) : val),
  []
)
let arr = [1,[ 4, 5 ], 2, 3];
flatten(arr)  // [1, 4, 5, 2, 3]

2.2 Dari perspektif keperluan sebenar

Setakat penyemak imbas, dengan pembangunan pelbagai rangka kerja satu halaman, kuasa pemprosesan pelanggan terus meningkat Dengan penambahbaikan, semakin banyak logik perniagaan diletakkan pada penghujungnya, menyebabkan semakin banyak negeri perlu dikekalkan oleh pelanggan. Masalah yang timbul ialah jika kita tidak berhati-hati, kita akan menggunakan sejumlah besar fungsi yang bergantung kepada pembolehubah luaran Fungsi ini terus meningkat dengan logik perniagaan, mengakibatkan peningkatan mendadak dalam cabang logik, menjadikan status sukar untuk dilakukan. trek, kebolehbacaan kod yang lemah, dan sukar untuk dikekalkan, dan FP hanya mempunyai penyelesaian yang baik.

Selain itu, kini bahasa pengaturcaraan arus perdana pada asasnya telah memperkenalkan ciri pengaturcaraan berfungsi Malahan Java, yang terkenal dengan pendekatan berorientasikan objek, masih boleh mempraktikkan idea pengaturcaraan berfungsi dengan menggunakan ekspresi lambda aliran, dan Spring5 adalah. lagi Ia menggunakan Reaktif sebagai titik jualan utama Secara ringkasnya, FP sangat popular baru-baru ini.

Ekosistem pengaturcaraan berfungsi JS juga sentiasa diperkaya, dan rangka kerja seperti RxJS dan circleJS semakin digunakan dalam barisan pengeluaran bahagian hadapan.

3 Kelebihan menggunakan pengaturcaraan berfungsi

Menggunakan pengaturcaraan FP mempunyai kelebihan utama berikut:

• Asingkan data dan logik pemprosesan, kodnya lebih ringkas, modular dan boleh dibaca

• Mudah untuk diuji, persekitaran ujian mudah disimulasikan

• Kod logik sangat boleh digunakan semula

4 Konsep yang berkaitan dengan pengaturcaraan berfungsi

Pengaturcaraan berfungsi terutamanya bergantung. pada:

• Pengaturcaraan deklaratif

• Fungsi tulen

• Data tidak berubah

4.1 Pengaturcaraan Deklaratif

Pengaturcaraan deklaratif hanya menerangkan sifat sasaran, dengan itu mengabstraksikan logik formal, Beritahu komputer apa yang perlu dikira agaknya daripada cara mengiranya langkah demi langkah. Contohnya, biasa, SQL, FP, dll.

Pengaturcaraan Imperatif Beritahu komputer operasi pengiraan setiap langkah

Pemprosesan tatasusunan yang paling mudah dan sama, menggunakan gelung for adalah penting, menggunakan peta dan seumpamanya Operasi itu deklaratif. Menggunakan pengaturcaraan deklaratif memudahkan kod, menambah baik penggunaan semula dan memberi ruang untuk pemfaktoran semula.

4.2 Fungsi tulen

Ringkasan ringkas fungsi tulen mempunyai dua ciri:

• Keluaran fungsi hanyalah berkaitan dengan input, Output yang dihasilkan oleh input yang sama adalah konsisten dan tidak bergantung pada keadaan luaran

• Panggilan fungsi tidak akan mengubah keadaan atau pembolehubah di luar domain fungsi dan tidak akan mempunyai kesan sampingan pada sistem

看个简单的例子：

let counter = 0
const increment = () => ++counter
const increment = counter => ++counter

前一个函数每次调用都会修改外部变量的值，返回值也依赖于外部变量；后一个函数对于同一输入值每次返回的结果都相同，并且不会对外部状态造成影响。所以后一个是纯函数。

为什么要追求函数的纯度，这就涉及到一个称为引用透明性的概念。

4.2.1 引用透明性

纯函数的这种函数的返回值只依赖于其输入值的特性，被称为引用透明性（referential transparency)，纯函数都是可以进行缓存的。

const memorize(pureFn) {
  const _cache = {}
  return (...args) => {
    const key = JSON.stringify(args)
    return _cache[key] || (_cache[key] = purFu.apply(null, args))
  }
}

4.3 Immutable Data

「可变的全局状态是万恶之源」（其实从功能代码的角度看，局部和全局是相对而言的）,简而言之可变状态会让程序的运行变得不可预测，代码可读性差，难以维护。

在 JS 中，当函数入参是对象类型的数据时，我们拿到的其实是个引用，所以即使在函数内部我们也是可以修改对象内部的属性，这种情景依然会产生副作用。

所以这个时候就需要引入 Immutable 的概念。 Immutable 即 unchangeable， Immutable data在初始化创建后就不能被修改了，每次对于 Immutable data 的操作都会返回一个新的 Immutable data。 所以并不会对原来的状态形成改变（当然不是简单的深拷贝再修改）。

Immutable 比较流行的 JS 实现有 immutable-js 和 seamless-immutable; 对于 React 党来说， immutable-js 一点都不陌生， immutable-js 配合 Redux 就是一种很好的 FP 实践。

const map1 = Immutable.Map({a:1, b: {d:2}, c:3});
const map2 = map1.set('a', 50);
map1 === map2 // false
const mapb1 = map1.get('b')
const mapb2 = map2.get('b')
mapb1===mapb2 // true

【相关推荐：javascript视频教程、编程视频】

Atas ialah kandungan terperinci Mengapakah JavaScript menggunakan pengaturcaraan berfungsi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!