Maison > interface Web > js tutoriel > 10 conseils pratiques en JavaScript (partager)

10 conseils pratiques en JavaScript (partager)

青灯夜游
Libérer: 2021-01-04 17:56:00
avant
2545 Les gens l'ont consulté

10 conseils pratiques en JavaScript (partager)

Recommandations associées : "Tutoriel vidéo javascript"

Je suis toujours à la recherche de nouvelles façons d'améliorer l'efficacité.

Et JavaScript est toujours plein de surprises inattendues.

1. Convertir l'objet arguments en un tableau

L'objet arguments est un objet de type tableau accessible à l'intérieur de la fonction, qui contient le valeurs transmises à la valeur de l'argument de la fonction.

Mais ceci est différent des autres tableaux, nous pouvons accéder à la valeur et obtenir la longueur, mais nous ne pouvons pas utiliser d'autres méthodes de tableau dessus.

Heureusement, nous pouvons convertir cela en un tableau régulier :

var argArray = Array.prototype.slice.call(arguments);
Copier après la connexion

2. Additionnez toutes les valeurs du tableau

Mon réflexe initial était d'utiliser une boucle, mais ce serait trop encombrant.

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

3. Court-circuit conditionnel

On a le code suivant :

if (hungry) {
    goToFridge();
}
Copier après la connexion

En utilisant des variables avec des fonctions, on Peut le rendre plus court :

hungry && goToFridge()
Copier après la connexion

4. Utilisez la logique ou ||

pour la condition que j'avais l'habitude de déclarer mes variables au début de la fonction pour éviter d'avoir à undefined apparaît en cas d'erreur inattendue.

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

5. Opérateur virgule

L'opérateur virgule (,) peut évaluer chacun de ses opérandes (de gauche à droite) et renvoie la valeur du dernier opérande.

let x = 1;

x = (x++, x);

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

x = (2, 3);

console.log(x);
// expected output: 3
Copier après la connexion

6. Utilisez la longueur pour ajuster la taille du tableau

Nous pouvons utiliser l'attribut length pour ajuster la taille du tableau ou effacer le tableau

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); // []
Copier après la connexion

7. Utiliser la déstructuration de tableau pour échanger des valeurs

La syntaxe d'affectation de déstructuration est une expression JavaScript qui peut décompresser les valeurs du tableau. ou les propriétés de l'objet en différentes variables.

let a = 1, b = 2
[a, b] = [b, a]
console.log(a) // -> 2
console.log(b) // -> 1
Copier après la connexion

8. Organiser au hasard les éléments du tableau

Chaque jour, j'organise au hasard

organise au hasard, organise au hasard

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]
Copier après la connexion

9. Les noms de propriétés peuvent être dynamiques

Vous pouvez attribuer des propriétés dynamiques avant de déclarer l'objet.

const dynamic = 'color';
var item = {
    brand: 'Ford',
    [dynamic]: 'Blue'
}
console.log(item); 
// { brand: "Ford", color: "Blue" }
Copier après la connexion

10. Filtrer les valeurs uniques

Pour tous les amateurs d'ES6, nous pouvons utiliser Set avec l'opérateur spread (spread) Object pour créer un nouveau tableau contenant uniquement des valeurs uniques.

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]
Copier après la connexion

Pensées finales

La responsabilité est bien plus importante que l'efficacité.

Votre site Web doit fonctionner dans tous les navigateurs.

Vous pouvez utiliser Endtest ou d'autres outils similaires pour vous en assurer.

Et vous ? Avez-vous des trucs ou astuces JavaScript à partager ?

Adresse originale en anglais : https://dev.to/zandershirley/10-practical-javascript-tricks-2b7h

Auteur : Zander Shirley

Pour plus de connaissances liées à la programmation, veuillez visiter : Introduction à la programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal