Wie schreibe ich sauberen JS-Code? 5 Schreibtipps zum Teilen

Wie schreibe ich sauberen JS-Code? In diesem Artikel teile ich Ihnen 5 Tipps zum Schreiben von sauberem JavaScript mit. Ich hoffe, dass es Ihnen hilfreich sein wird!

Reduzieren Sie den Leseaufwand, regen Sie kreatives Denken an und erlernen Sie ganz einfach JavaScript-Kenntnisse als folgenden Code:

const isOldEnough = (person) => {
  return person.getAge() >= 100;
}

Wer weiß, worauf sich diese 100 konkret bezieht? Normalerweise müssen wir den Funktionskontext kombinieren, um zu spekulieren und zu beurteilen, welchen Wert diese 100 konkret darstellen könnte. Wenn es mehrere solcher Zahlen gibt, führt das leicht zu größerer Verwirrung.

, um dieses Problem klar zu lösen:

const AGE_REQUIREMENT = 100;
const isOldEnough = (person) => {
  return person.getAge() >= AGE_REQUIREMENT;
}

Jetzt können wir durch die Deklaration des Namens der Konstante sofort verstehen, dass 100 „Altersanforderung“ bedeutet. Beim Ändern können Sie es schnell finden, an einer Stelle ändern und an mehreren Stellen wirksam werden.

Die Übergabe boolescher Werte an Funktionen als Parameter ist eine gängige Schreibweise, die leicht zu Codeverwirrung führen kann.

const validateCreature = (creature, isHuman) => {
  if (isHuman) {
    // ...
  } else {
    // ...
  }
}

Der als Parameter an die Funktion übergebene boolesche Wert kann keine klare Bedeutung ausdrücken. Er kann dem Leser nur sagen, dass diese Funktion ein Urteil fällen und zwei oder mehr Situationen erzeugen wird. Wir befürworten jedoch das Single-Responsibility-Prinzip von Funktionen, also:

const validatePerson = (person) => {
  // ...
}
const validateCreature = (creature) => {
  // ...
}

Wir schreiben Code oft wie folgt:

if (
  person.getAge() > 30 &&
  person.getName() === "simon" &&
  person.getOrigin() === "sweden"
) {
  // ...
}

Es ist nicht unmöglich, aber nach langer Zeit werden Sie plötzlich nicht mehr verstehen, wozu diese Urteile dienen. Daher wird empfohlen, diese Bedingungen mit Variablen oder Funktionen zu kapseln.

const isSimon =
  person.getAge() > 30 &&
  person.getName() === "simon" &&
  person.getOrigin() === "sweden";
if (isSimon) {
  // ...
}

oder

const isSimon = (person) => {
  return (
    person.getAge() > 30 &&
    person.getName() === "simon" &&
    person.getOrigin() === "sweden"
  );
};
if (isSimon(person)) {
  // ...
}

Oh, es stellt sich heraus, dass diese Bedingungen dazu dienen, festzustellen, ob diese Person Simon ist ~Diese Art von Code ist Code im deklarativen Stil, der besser lesbar ist.

Beim bedingten Urteil führt die Verwendung eines negativen Urteils zu einer zusätzlichen Belastung des Denkens.

Im folgenden Code ist die Bedingung beispielsweise eine doppelte Verneinung, was die Lesbarkeit etwas erschwert.

const isCreatureNotHuman = (creature) => {
  // ...
}

if (!isCreatureNotHuman(creature)) {
  // ...
}

Nach dem Login kopieren

Schreiben Sie sauberes JavaScript: Vermeiden Sie negative Beurteilungsbedingungen.

!isCreatureNotHuman(creature)Schreiben Sie es in die folgenden Schreibregeln um, um das Lesen zu erleichtern. Befolgen Sie diesen jedoch an vielen Stellen in einer großen Menge an Codelogik Grundsätze werden auf jeden Fall hilfreich sein.

Wenn ich Code lese, kann ich es oft nicht mehr ertragen, wenn ich eine „schreckliche“ Schrift sehe, und die Böschung von tausend Meilen wird in einer Ameise zusammenbrechen Nest.

const isCreatureHuman = (creature) => {
  // ...
}
if (isCreatureHuman(creature)) {
  // ...
}

Dieser Punkt wurde von mir immer betont:

Zum Beispiel der folgende Code:

if(x===a){
   res=A
}else if(x===b){
   res=B
}else if(x===c){
   res=C
}else if(x===d){
    //...
}

Nach dem Login kopieren

Umgeschrieben in Kartenschreiben:

let mapRes={
    a:A,
    b:B,
    c:C,
    //...
}
res=mapRes[x]

Ein Beispiel ist der folgende Code:

const isMammal = (creature) => {
  if (creature === "human") {
    return true;
  } else if (creature === "dog") {
    return true;
  } else if (creature === "cat") {
    return true;
  }
  // ...
return false;
}

In ein Array umgeschrieben:

const isMammal = (creature) => {
  const mammals = ["human", "dog", "cat", /* ... */];
  return mammals.includes(creature);
}

Also, wenn es viele if... gibt sonst... im Code, mehr Denken Sie darüber nach und prüfen Sie, ob Sie einige Änderungen vornehmen können, damit der Code „sauberer“ aussieht.

Zusammenfassung: Die oben genannten Tipps scheinen in Beispielen nicht erwähnenswert zu sein, aber in tatsächlichen Projekten, wenn die Geschäftslogik komplex und die Menge an Code groß wird, werden diese Tipps definitiv einen positiven Effekt haben, sogar über alle Vorstellungskraft hinaus .

Javascript-Lern-Tutorial

Das obige ist der detaillierte Inhalt vonWie schreibe ich sauberen JS-Code? 5 Schreibtipps zum Teilen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!