por favor, ¿alguien tiene una idea de cómo funciona el primer código y el segundo no? vi el primer código en alguna parte y he estado tratando de entender la idea detrás de él. Gracias
const loadable = (importFunc, { fallback = null } = { fallback: null }) => { const LazyComponent = lazy(importFunc); return props => ( <Suspense fallback={fallback}> <LazyComponent {...props} /> </Suspense> ); };Cuando desestructura en la lista de argumentos con un objeto, un identificador después de dos puntos indica la nueva variable en la que colocar la propiedad.
Este:
const test2 = ({ fallback: foo }) => { // rest of functionmedio
const test2 = (parameter) => { let foo = parameter.fallback; // rest of function Pero no está utilizando foo , sino null , que el intérprete (y la especificación) reconoce casi con seguridad como un error accidental. No desea poner un valor en un identificador llamado null , por lo que le prohíbe hacerlo.
Ninguno de los códigos que proporcionó es una sintaxis válida por este motivo.
Si solo desea colocar la propiedad fallback del argumento en una variable, omita los dos puntos.
const test2 = ({ fallback }) => { console.log(fallback); } //calling test2({fallback: "hello"}); Si también desea proporcionar un valor predeterminado en caso de que la propiedad no esté definida, use = (no : ).
const test2 = ({ fallback = null }) => { console.log(fallback); } //calling test2({fallback: "hello"}); test2({}); Si también desea proporcionar un valor predeterminado para el argumento de objeto completo en caso de que no se pasen argumentos, use otro = después de que se enumere el argumento (muy similar a lo que está haciendo originalmente, pero, nuevamente, con = , no : )
const test2 = ({ fallback = null } = {}) => { console.log(fallback); } //calling test2({fallback: "hello"}); test2({}); test2();