Underscore.js es una biblioteca de JavaScript que proporciona muchas funciones útiles como el mapa, el filtro, la invocación, etc., incluso sin usar ningún objeto integrado.
La función _.once se usa en condiciones en las que queremos que una función en particular se ejecute solo una vez. Aunque ejecutamos o llamamos a esta función varias veces, tampoco tendrá ningún efecto. Los valores de la función original solo se devolverán cada vez que se llame.
Se usa principalmente para las funciones initialize() que se usan para asignar solo los valores iniciales a las variables.
Sintaxis:
_.once(function)
Parámetros:
Toma solo un argumento, es decir, la función que necesita ser llamada solo una vez.
Valor devuelto:
Devuelve el valor de la llamada original cada vez que se llama a la función de forma iterativa o repetida.
- Realizando la función de suma con la función _.once():
La función que se pasa a la función _.once() agrega 10 a la variable 10 que originalmente tiene un valor de 10. Luego, la función _.once() se asigna a la otra función ‘startFunc()’. Luego, la primera vez que se llama a ‘startFunc()’, el valor de ‘a’ se incrementa en 10 y se convierte en 20. Por lo tanto, el resultado de la primera llamada es 20. Luego, la próxima vez que se llame a ‘startFunc()’, el valor de ‘a’ nuevamente se supone que se incrementa en 10 pero esto no sucede. Esto se debe a que ‘startFunc()’ tiene una función ‘_.once()’ en su definición que evita que se ejecute más de una vez. Entonces, la salida de la segunda y tercera llamada será la misma que la primera, es decir, 20. En la primera línea, el valor de ‘a’ se imprime antes de llamar a ‘startFunc()’, por lo que la salida es 10.
Ejemplos :<html><head><scriptsrc=</script></head><body><scripttype="text/javascript">var a = 10;function add() {a += 10;}var startFunc = _.once(add);console.log(a);startFunc();console.log(a);startFunc();console.log(a);startFunc();console.log(a);</script></body></html>Producción:
- Realizando la operación de multiplicación con la función _.once():
La función que se pasa a la función _.once() multiplica por 10 la variable ‘a’ que tiene valor 10 originalmente. Luego, la función _.once() se asigna a otra función ‘startFunc()’. La primera vez que se llama a ‘startFunc()’, el valor de ‘a’ se multiplica por 10 y se convierte en 100. Por lo tanto, el resultado de la primera llamada es 100. Luego, la próxima vez que se llame a ‘startFunc()’, el valor de Se supone que ‘a’ se vuelve a multiplicar por 10, pero esto no sucede. Esto se debe a que ‘startFunc()’ tiene una función ‘_.once()’ en su definición que evita que se ejecute más de una vez. Entonces, la salida de la segunda y tercera llamada será la misma que la primera, es decir, 100. En la primera línea, el valor de ‘a’ se imprime antes de llamar a ‘startFunc()’, por lo que la salida es 10.<html><head><scriptsrc=</script></head><body><scripttype="text/javascript">var a = 10;function add() {a *= 10;}var startFunc = _.once(add);console.log(a);startFunc();console.log(a);startFunc();console.log(a);startFunc();console.log(a);</script></body></html>Producción:
- Pasar strings a la función _.once():
La función que se pasa a la función _.once() agrega la string original de la variable ‘a’ con la otra string. La función _.once() está asignada a otra función ‘startFunc()’. La primera vez que se llama a ‘startFunc()’, el valor de ‘a’ se agrega con la string ” appended” y, por lo tanto, se convierte en “xyz appended”. Entonces, el resultado de la primera llamada es «xyz adjunto». Luego, la próxima vez que se llame a ‘startFunc()’, se supone que el valor de ‘a’ se agregará nuevamente, pero esto no sucede. Esto se debe a que ‘startFunc()’ tiene una función ‘_.once()’ en su definición que evita que se ejecute más de una vez. Entonces, la salida de la segunda y tercera llamada será la misma que la primera, es decir, «xyz adjunto». En la primera línea, el valor de ‘a’ se imprime antes de llamar a ‘startFunc()’, por lo que la salida es «xyz».<html><head><scriptsrc=</script></head><body><scripttype="text/javascript">var a = 'xyz';function add() {a += " appended ";}var startFunc = _.once(add);console.log(a);startFunc();console.log(a);startFunc();console.log(a);startFunc();console.log(a);</script></body></html>Producción:
- Pasar tanto el número como la string a la función _.once():
aquí realizamos la función _.once() en una función que agrega la string a una variable ‘a’ cuyo valor original es «xyz» y también suma 10 a una variable ‘b’ cuyo valor original es 5. En la primera línea se mostrarán los valores originales de ambas variables ‘a’ y ‘b’. Después de eso, cuando llamamos por primera vez a ‘startFunc()’, la variable ‘a’ se agrega con la string ‘anexada’ y el valor de la variable ‘b’ se incrementa en 10. Entonces, ‘a’ se convierte en «xyz adjunto» y ‘b ‘ se convierte en 15. Ahora, cada vez que se usa ‘startFunc()’, los valores de ‘a’ y ‘b’ seguirán siendo los mismos que hemos usado en la función _.once() en la definición de ‘startFunc()’.<html><head><scriptsrc=</script></head><body><scripttype="text/javascript">var a = 'xyz',b = 5;function add() {a += " appended ";b += 10;}var startFunc = _.once(add);console.log(a, b);startFunc();console.log(a, b);startFunc();console.log(a, b);startFunc();console.log(a, b);</script></body></html>Producción:
NOTA:
Estos comandos no funcionarán en la consola de Google o en Firefox, ya que estos archivos adicionales deben agregarse y no se agregaron.
Por lo tanto, agregue los enlaces dados a su archivo HTML y luego ejecútelos.
Los enlaces son los siguientes:
<script type="text/javascript" src = "https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"> </script>