Maison >interface Web >js tutoriel >Comment fonctionnent les crochets dans la syntaxe d'importation JavaScript pour importer à la fois les exportations par défaut et nommées ?

Comment fonctionnent les crochets dans la syntaxe d'importation JavaScript pour importer à la fois les exportations par défaut et nommées ?

Barbara Streisand
Barbara Streisandoriginal
2024-10-31 14:44:02228parcourir

How do brackets work in JavaScript import syntax to import both default and named exports?

Comprendre les crochets dans la syntaxe d'importation JavaScript

En JavaScript, la syntaxe d'importation utilisant les crochets offre un moyen flexible de gérer à la fois les exportations par défaut et nommées depuis un module. Examinons son utilisation et ses implications.

Exportations par défaut ou exportées nommées

Par convention, les modules exposent généralement une seule exportation par défaut ou une collection d'exportations nommées. Une exportation par défaut est affectée à une variable sans accolades, tandis que les exportations nommées nécessitent des accolades explicites pour entourer les symboles exportés.

Importation avec des crochets

Lors de l'utilisation de crochets dans une importation déclaration, vous combinez essentiellement les méthodes d'importation d'exportation par défaut et nommées. Par exemple, la syntaxe suivante :

import React, { Component, PropTypes } from 'react';

importe l'export par défaut React sous le même nom, tout en important également les exports nommés Component et PropTypes sous leurs noms d'origine.

Syntaxe simplifiée

Cette méthode combine les deux syntaxes courantes :

import React from 'react';
import { Component, PropTypes } from 'react';

où le la première ligne importe l'exportation par défaut et la deuxième ligne importe les exportations nommées.

Structures d'exportation de modules

En règle générale, les modules fournissent soit une exportation par défaut, soit un ensemble d'exportations nommées. . Cependant, il arrive parfois qu'un module fournisse les deux. Dans de tels cas, la syntaxe utilisant des crochets vous permet d'importer les deux types d'exportations simultanément.

Comparaison avec la documentation MDN

Les versions précédentes de la documentation MDN affirmaient à tort que l'importation avec brackets crée un objet qui reçoit les valeurs importées sous le nom spécifié. Ce n'est pas le cas. Les accolades importent explicitement les exportations nommées, y compris les exportations par défaut, le cas échéant.

Remarques importantes

  • Les exportations nommées ne sont pas accessibles via l'exportation par défaut.
  • L'opérateur * générique peut importer toutes les exportations nommées dans un seul objet, tandis que le mot-clé par défaut peut importer l'exportation par défaut séparément.

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!

Déclaration:
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