Estoy probando la nueva sintaxis de encadenamiento opcional de JavaScript y parece que tiene un problema con los métodos que no tienen valor de retorno. Por ejemplo:
Tengo un objeto de restaurante con método de orden en él:
const restaurant = { order(i, k) { console.log(`I was here with ${i} and ${k}`); // does not return value } };Ahora, si trato de verificar si el método de pedido existe dentro del objeto del restaurante como se muestra a continuación, devuelve 'undefiend':
const orderCheck = restaurant.order?.(0, 1); console.log(orderCheck ); // it returns undefinedAhora el problema es que, si uso el caso anterior con el operador coalescente nulo como se muestra a continuación, no funciona:
console.log(restaurant.order?.(0, 1) ?? 'Method does not exist'); Output: I was here with 0 and 1 Method does not existPROBLEMA: Ahora, el problema en la declaración anterior es que la sintaxis de encadenamiento opcional incluso encuentra el método de orden e imprime "Estuve aquí con 0 y 1", pero aún devuelve 'indefenso', lo que hace que Nullish Coalescing Operator continúe e incluso imprime 'Method does no existe' también como valor predeterminado?
Ahora, si permito que el método de pedido devuelva un valor, entonces funciona bien con el operador coalescente nulo y no continúa.
const restaurant = { order(i, k) { console.log(`I was here with ${i} and ${k}`); return '1'; } };Si vuelve a comprobar:
console.log(restaurant.order?.(0, 1) ?? 'Method does not exist'); Output: I was here with 0 and 1¿Es necesario que la sintaxis de encadenamiento opcional espere un valor de retorno distinto de los valores nulos de un método para comprobar su disponibilidad?
En el caso anterior, el método de orden existe, entonces ¿Cómo evitar que el Operador Coalescente Nulo no proceda con el 'Método no existe' predeterminado?
Lo estoy probando con navegadores modernos (Chrome y firfox) y también he habilitado las funciones experimentales de JavaScript en Chrome, pero aún funciona de la misma manera.
¿Alguna idea sería útil? Gracias
Esto no está relacionado con el encadenamiento opcional.
El
Nullish Operatordevuelve su operando del lado derecho cuando su operando del lado izquierdo es nulo o indefinido y, de lo contrario, devuelve su operando del lado izquierdo.
Por lo tanto, el encadenamiento opcional ya está funcionando ya que la función existe pero su valor de retorno no está undefined , por lo que el operador va a la parte correcta.
Nota:
undefined debido al optional chaining , por lo que también se tomaría el lado derecho del nullish operator let obj = {}; console.log("function doesn't exist", obj?.foo?.(), obj?.foo?.() ?? 'right'); obj = { foo: () => {} }; console.log("function exists but doesn't return", obj?.foo?.(), obj?.foo?.() ?? 'right'); obj = { foo: () => { return 'left'; } }; console.log("function exists and returns", obj?.foo?.(), obj?.foo?.() ?? 'right');Editar: para evitar que el operador coalescente nulo no proceda con el valor predeterminado 'El método no existe' Incluso el método existe
obj = { foo: () => {} }; console.log(obj?.foo && typeof obj.foo === 'function' ? obj.foo() : 'right');Con restaurant.order?.(0, 1) compruebas si el método existe y, si existe, lo llamas y devuelves el resultado de la llamada. En su caso, order(0, 1) devuelve indefinido, por lo tanto, restaurant.order?(0, 1) también devuelve indefinido.