Heim  >  Artikel  >  Web-Frontend  >  10 praktische Tipps in JavaScript (Teilen)

10 praktische Tipps in JavaScript (Teilen)

青灯夜游
青灯夜游nach vorne
2021-01-04 17:55:262423Durchsuche

10 praktische Tipps in JavaScript (Teilen)

Verwandte Empfehlungen: „Javascript-Video-Tutorial

Ich bin immer auf der Suche nach neuen Möglichkeiten, die Effizienz zu verbessern.

Und JavaScript steckt immer voller unerwarteter Überraschungen.

1. Argumentobjekt in Array konvertieren

Argumentobjekt ist ein Array-ähnliches Objekt, auf das innerhalb einer Funktion zugegriffen werden kann und die Werte der an die Funktion übergebenen Parameter enthält.

Aber das unterscheidet sich von anderen Arrays. Wir können auf den Wert zugreifen und die Länge abrufen, aber wir können keine anderen Array-Methoden darauf verwenden.

Glücklicherweise können wir dies in ein reguläres Array umwandeln:

var argArray = Array.prototype.slice.call(arguments);

2. Summiere alle Werte im Array

Mein erster Instinkt war, eine Schleife zu verwenden, aber das wäre zu viel Arbeit.

var numbers = [3, 5, 7, 2];
var sum = numbers.reduce((x, y) => x + y);
console.log(sum); // returns 17

3. Bedingter Kurzschluss

Wir haben den folgenden Code:

if (hungry) {
    goToFridge();
}

Durch die Verwendung von Variablen mit Funktionen können wir ihn kürzer machen:

hungry && goToFridge()

4. Verwenden Sie logisch oder für die Bedingung | |||

我过去常常在函数的开头声明自己的变量,以避免在出现任何意外错误时出现 undefined 的情况。

function doSomething(arg1){ 
    arg1 = arg1 || 32; // if it's not already set, arg1 will have 32 as a default value
}

5、逗号运算符

逗号运算符( ,

Ich habe meine Variablen am Anfang der Funktion deklariert, um undefinierte Situationen im Falle unerwarteter Fehler zu vermeiden.
let x = 1;

x = (x++, x);

console.log(x);
// expected output: 2

x = (2, 3);

console.log(x);
// expected output: 3
5. Komma-Operator

Der Komma-Operator (,) kann jeden seiner Operanden (von links nach rechts) auswerten und den Wert des letzten Operanden zurückgeben.
var array = [11, 12, 13, 14, 15];  
console.log(array.length); // 5  

array.length = 3;  
console.log(array.length); // 3  
console.log(array); // [11,12,13]

array.length = 0;  
console.log(array.length); // 0  
console.log(array); // []
6. Verwenden Sie die Länge, um die Array-Größe anzupassen. Wir können das Längenattribut verwenden, um die Array-Größe anzupassen oder das Array zu löschen.

let a = 1, b = 2
[a, b] = [b, a]
console.log(a) // -> 2
console.log(b) // -> 1
. 7. Verwenden Sie die Array-Destrukturierung, um Werte auszutauschen Destrukturierende Zuweisungssyntax ist ein JavaScript-Ausdruck, der Werte in einem Array oder Eigenschaften in einem Objekt in verschiedene Variablen entpacken kann.

var list = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(list.sort(function() {
    return Math.random() - 0.5
})); 
// [4, 8, 2, 9, 1, 3, 6, 5, 7]

8. Ordne die Elemente im Array zufällig an
const dynamic = 'color';
var item = {
    brand: 'Ford',
    [dynamic]: 'Blue'
}
console.log(item); 
// { brand: "Ford", color: "Blue" }

9. Attributnamen können dynamisch sein

Dynamische Eigenschaften werden vor der Deklaration des Objekts zugewiesen.
const my_array = [1, 2, 2, 3, 3, 4, 5, 5]
const unique_array = [...new Set(my_array)];
console.log(unique_array); // [1, 2, 3, 4, 5]
10. Eindeutige Werte filtern

Für alle ES6-Liebhaber können wir ein neues Array erstellen, das nur eindeutige Werte enthält, indem wir das Set-Objekt mit dem Spread-Operator (Spread) verwenden. rrreeeAbschließende Gedanken

Verantwortung ist weitaus wichtiger als Effizienz. Ihre Website muss in allen Browsern funktionieren.

Sie können

Endtest
oder andere ähnliche Tools verwenden, um sicherzugehen.

Was ist mit dir? Haben Sie JavaScript-Tipps oder -Tricks, die Sie teilen möchten?

Englische Originaladresse: https://dev.to/zandershirley/10-practical-javascript-tricks-2b7h

Autor: Zander Shirley

Weitere programmierbezogene Kenntnisse finden Sie unter:

Einführung in die Programmierung

! !

Das obige ist der detaillierte Inhalt von10 praktische Tipps in JavaScript (Teilen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:segmentfault.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen