Heim > Web-Frontend > js-Tutorial > Hauptteil

Gedanken nach dem Lesen von „JavaScript Functional Programming'_Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 15:46:36
Original
1088 Leute haben es durchsucht

In diesem Artikel werden einige Dinge aufgezeichnet, die ich beim Erlernen funktionaler Ausdrücke verstanden habe, um mein Gedächtnis zu vertiefen und sie für eine spätere Überprüfung zu ordnen und aufzuzeichnen.

Ich habe mich entschieden, als ich kürzlich das Buch „JavaScript Functional Programming“ im Vorverkauf sah. Der Hauptzweck besteht darin, dass ich immer noch nicht verstehe, was funktionale Programmierung ist. Während meines eigenen Lernprozesses habe ich die Leute um mich herum immer über prozessorientierte Programmierung und objektorientierte Programmierung sprechen hören, aber es gibt nur sehr wenige funktionale Programmierungen. Um nicht ins Hintertreffen mit anderen Studierenden zu geraten, wollte ich mein beim Lesen gewonnenes Wissen durch Notizen teilen und festhalten.

js und funktionale Programmierung

Das Buch verwendet einen einfachen Satz, um zu beantworten, was funktionale Programmierung ist:

Funktionale Programmierung verwendet Funktionen, um Werte in abstrakte Einheiten umzuwandeln, die dann zum Aufbau von Softwaresystemen verwendet werden.
Ich denke, es muss Studenten geben, die diesen Satz lesen und immer noch nicht viel darüber wissen, was funktionale Programmierung ist und warum wir funktionale Programmierung verwenden sollten. Viele der folgenden Beispiele verwenden Unterstrich.

Funktionen als abstrakte Einheiten verwenden

Abstrakte Methoden beziehen sich auf Funktionen, die Details verbergen. Nehmen Sie ein Beispiel aus dem Buch, eine Funktion, die den Ausgabealterwert erkennt (hauptsächlich Berichte über Fehler und Warnungen):

function parseAge(age) {
  if (!_.isString(age))
    throw new Error("Expecting a string");
  var a;
  console.log("Attempting to parse an age");

  a = parseInt(age, 10);
  if (_.isNaN(a)) {
    console.log(["Could not parse age: "].join());
    a = 0;
  }

  return a;
}

Nach dem Login kopieren

Die obige Funktion bestimmt, ob wir ein Alter eingegeben haben, und es muss in Form einer Zeichenfolge vorliegen. Der nächste Schritt besteht darin, diese Funktion auszuführen:

parseAge("42"); //=> 42
parseAge(42); //=> Error:Expecting a string
parseAge("hhhh"); //=> 0
Nach dem Login kopieren

Die obige parseAge-Funktion funktioniert einwandfrei und ohne Probleme. Wenn wir die Art und Weise ändern möchten, wie Ausgabefehlerinformationen und Warnungen dargestellt werden, müssen wir die entsprechenden Codezeilen sowie den Ausgabemodus an anderer Stelle ändern. Die im Buch angegebene Methode wird durch die Abstraktion in verschiedene Funktionen erreicht:

function fail(thing) {
  throw new Error(thing);
}

function warn(thing) {
  console.log(["WARNING:", thing].join(''));
}

function note(thing) {
  console.log(["NOTE:", thing].join(''));
}

Nach dem Login kopieren

Verwenden Sie dann die obige Funktion, um die parseAge-Funktion zu rekonstruieren.

funciton parseAge(age) {
  if (!_.isString(age))
    fail("Expecting a string");
  var a;

  note("Attempting to parse an age");
  a = parseInt(age, 10);

  if (_.isNaN(a)) {
    warn(["Could not parse age:", age].join(""));
    a = 0;
  }

  return a;
}

Nach dem Login kopieren

Fügen Sie den Code, der Fehler meldet, in verschiedene Funktionen ein, und das überarbeitete parseAge hat sich gegenüber dem vorherigen nicht wesentlich geändert. Der Unterschied besteht jedoch darin, dass die Idee der Meldung von Fehlern, Meldungen und Warnungen jetzt abstrahiert wurde. Auch die Meldung von Fehlern, Meldungen und Warnungen wurde komplett überarbeitet.

Da das Verhalten in einer einzelnen Funktion enthalten ist, kann die Funktion durch eine neue Funktion ersetzt werden, die ein ähnliches Verhalten bereitstellt, oder direkt durch ein völlig anderes Verhalten ersetzt werden.

Einkapselung und Verschleierung

Dieser Titel ist leicht zu verstehen, hier ist ein Beispiel. Wir verwenden oft iife, um globale Umweltverschmutzung zu vermeiden. Dies ist ein gutes Beispiel für Kapselung und Verschleierung. Durch die Verwendung von iif zum Ausblenden einiger von Ihnen geschriebener Variablen und Methoden besteht der Zweck nicht darin, die globale Umgebung zu verschmutzen. Dabei werden auch Abschlüsse verwendet, um Daten auszublenden.

Denn Abschluss ist auch eine Funktion. Und es hat jetzt viel damit zu tun, funktionale Programmierung zu lernen. Aber vergessen Sie nicht die objektorientierte Kapselung, die Sie zuvor gelernt haben. Schließlich kann man nicht sagen, wer von beiden besser ist. Aber es ist nicht schlecht, wenn man sie alle beherrscht. Wie das alte Sprichwort sagt: Schauen Sie auf die Nachfrage.

Verwenden Sie die Funktion als Verhaltenseinheit

Das Ausblenden von Daten und Verhalten (normalerweise unpraktisch für schnelle Änderungen) ist nur eine Art, über Funktionen als abstrakte Einheiten zu sprechen. Ein anderer Ansatz besteht darin, eine einfache Möglichkeit zum Speichern und Übertragen grundlegender Verhaltensweisen auf diskrete Offline-Einheiten bereitzustellen.

Eine kleine Kastanie im Buch, die die js-Syntax verwendet, um einen Wert in einem Array zu indizieren:

var arr = ['a', 'b', 'c'];
arr[1] //=> b
Nach dem Login kopieren

Obwohl das Indizieren eines Werts im obigen Array einfach ist, gibt es keine Möglichkeit, dieses Verhalten zu erreichen und ihn/sie nach Bedarf zu verwenden, ohne ihn/sie in eine Funktion einzufügen. Schreiben Sie eine einfache Funktion nth, um einen Wert im Array zu indizieren:

function nth(a, index) {
  return a[index];
}
Nach dem Login kopieren

Dann führen Sie Folgendes aus:

nth(arr, 1); //=> Der Vorgang ist erfolgreich, aber wenn ein leeres Objekt übergeben wird, wird ein Fehler gemeldet. Wenn wir daher eine Funktionsabstraktion um nth herum implementieren möchten, könnten wir die folgende Anweisung entwerfen: nth gibt eine gültige Funktion zurück, die in einem Datentyp gespeichert ist, der Indexzugriff ermöglicht. Der Schlüssel zu dieser Aussage ist das Konzept der Art der Indexdaten. Möglicherweise wird eine Funktion benötigt, um den Typ zu bestimmen:

function isIndexed(data) {
  return _.isArray(data) || _.isString(data);
}
Nach dem Login kopieren
Verbessern Sie dann die n-te Funktion weiter. Die Funktion isIndexed ist eine Abstraktion, die eine Abstraktion zur Bestimmung bereitstellt, ob es sich bei bestimmten Daten um eine Zeichenfolge oder ein Array handelt.

function nth(a, index) {
  if (!_.isNumber(index)) 
    fail("Expected a number as the index");
  if (!isIndexed(a))
    fail("Not supported on non-indexed type");
  if ((index < 0) || (index > a.length - 1))
    fail("Index value is out of bounds");

  return a[index];
}

Nach dem Login kopieren
Auf die gleiche Weise wie beim Erstellen einer n-ten Funktionsabstraktion durch Extrahieren von Objekten aus dem Index können Sie auf die gleiche Weise auch eine zweite Abstraktion erstellen:

function second(a) {
  return nth(a, 1);
}
Nach dem Login kopieren

函数second允许在一个不同但相关的情况下,正确的使用nth函数:

second(arr); //=> b
通过上面的栗子,就知道。我们可以把每一步都抽象成一个函数,把每一个参数都抽象出来。虽然这样写感觉定义了许多函数。不过这样更加容易理解每一项的功能和流程。

数据抽象

JavaScript 的对象原型模型是一个丰富且基础的数据方案。
因为js没有类的原因,就有了许多模拟类的方法,且在ES6上也出现了class关键字。尽管类有许多长处,但很多的时候js应用程序的数据需求币类中的简单的要多。

基于类的对象系统的一个有理的论据是实现用户界面的历史使用。
js中的对象和数组已经能够满足我们对数据的操作了,且Underscore也是重点也是如何处理数组和对象。

实施和使用的简易性是使用js的核心数据结构进行数据建模的目的。这并不是说面向对象或者基于类的方法就完全没有用。处理集合为中心的函数式方式更加适合处理与人有关的数据,而面向对象的方法最适合模拟人。

js函数式初试

在开始函数式编程前,需要先定义两个常用且有用的函数:

function existy(x) {
  return x != null
}

function truthy(x) {
  return (x !== false) && existy(x);
}

Nach dem Login kopieren

existy函数旨在定义事物之前的存在。js中就有两个值可以表示不存在:null和undefined。
truthy函数用来判断一个对象是否应该认为是true的同义词。

我们可以在很多地方使用到这两个函数,其实函数式理念来自于它们的使用。有些同学可能已经熟悉了许多js实现中的map forEach等方法。且Underscroe也提供了许多类似的方法,这也许就是选择Underscroe来辅助学习函数式编程的原因。

简单说下就是:

一个对”存在“的抽象函数的定义。
一个建立在存在函数之上的,对”真“的抽象函数定义。
通过其他函数来使用上面的两个函数,以实现更多的行为。

加速

大概了解了函数式编程之后。你可能会想这函数式编程不是很慢吗?比如前面获取数组索引,有必要定义一个函数来专门获取吗?直接用arr[index]绝对比那些函数来的快。

var arr = [1, 2, 3, 4, 5];

// 最快
for (var i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

// 较慢
_.each(arr, function (val, index) {
  console.log(index);
});

Nach dem Login kopieren

但是我们在写代码的时候可能不会考虑的那么深,也许使用函数的确比原生要慢一些。但是大多数情况下也不会去在乎那么点时间,且现在有强大的v8引擎,大部分情况下的他都能很高效的编译和执行我们的js代码。所以我们没有必要在还没有写出正确的代码前考虑运算速度。

如果是我来选择的话,可能会更加关注与代码的风格。那种写法写的舒服看的舒服就使用哪一种,当然也是要保证基本的运算速度下,以不至于慢的离谱。看的舒服的代码比跑的快的代码可能更加有成就感。

总结

看完了第一章也是可以小结一下js的函数式编程。下面引用书上的总结:

确定抽象,并为其构建函数。
利用已有的函数来构建更加复杂的抽象。
通过将现有的函数传给其他的函数来构建更加复杂的抽象。
单是构建抽象还是不够的,如果能够把强大的数据抽象结合来实现函数式编程效果会更加好。

后面的章节读后感会慢慢的分享给大家,敬请关注。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage