Diferencia entre setTimeout con y sin comillas y paréntesis
Estoy aprendiendo JavaScript y recientemente aprendí sobre los eventos de sincronización de JavaScript. Cuando me enteré setTimeouten W3Schools , noté una figura extraña con la que no me había topado antes. Usan comillas dobles y luego llaman a la función.
Ejemplo:
setTimeout("alertMsg()", 3000);
Sé que las comillas simples y dobles en JavaScript significan una cadena.
También vi que puedo hacer lo mismo así:
setTimeout(alertMsg, 3000);
Con paréntesis se hace referencia, sin paréntesis se copia. Cuando uso las comillas y los paréntesis se vuelve una locura.
Me alegraría que alguien pudiera explicarme la diferencia entre estas tres formas de uso setTimeout:
Con paréntesis:
setTimeout("alertMsg()", 3000);
Sin las comillas y los paréntesis:
setTimeout(alertMsg, 3000);
Y el tercero sólo utiliza comillas:
setTimeout("alertMsg", 3000);
NB: una mejor fuente de setTimeoutreferencia sería MDN .
Usando setIntervalosetTimeout
Debe pasar una referencia a una función como primer argumento para setTimeouto setInterval. Esta referencia puede tener la forma de:
Una función anónima
setTimeout(function(){/* Look mah! No name! */},2000);Un nombre de una función existente.
function foo(){...} setTimeout(foo, 2000);Una variable que apunta a una función existente.
var foo = function(){...}; setTimeout(foo, 2000);Tenga en cuenta que configuro "variable en una función" por separado del "nombre de la función". No es evidente que las variables y los nombres de funciones ocupen el mismo espacio de nombres y puedan chocar entre sí.
Pasar argumentos
Para llamar a una función y pasar parámetros, puede llamar a la función dentro de la devolución de llamada asignada al temporizador:
setTimeout(function(){
foo(arg1, arg2, ...argN);
}, 1000);
Existe otro método para pasar argumentos al controlador, sin embargo, no es compatible con todos los navegadores .
setTimeout(foo, 2000, arg1, arg2, ...argN);
Contexto de devolución de llamada
De forma predeterminada, el contexto de la devolución de llamada (el valor thisdentro de la función llamada por el temporizador) cuando se ejecuta es el objeto global window. Si desea cambiarlo, utilice bind.
setTimeout(function(){
this === YOUR_CONTEXT; // true
}.bind(YOUR_CONTEXT), 2000);
Seguridad
Aunque es posible, no debes pasar una cadena a setTimeouto setInterval. Pasar una cadena crea setTimeout()o setInterval()utiliza una funcionalidad similar a eval()la que ejecuta cadenas como scripts , haciendo posible la ejecución de scripts arbitrarios y potencialmente dañinos.
Creo que la función setTimeout que escribes no se está ejecutando. Si usas jquery, puedes hacer que se ejecute correctamente haciendo esto:
function alertMsg() {
//your func
}
$(document).ready(function() {
setTimeout(alertMsg,3000);
// the function you called by setTimeout must not be a string.
});
Totalmente de acuerdo con José.
Aquí hay un violín para probar esto: http://jsfiddle.net/nicocube/63s2s/
En el contexto del violín, el argumento de cadena no funciona, en mi opinión, porque la función no está definida en el ámbito global.
¿Qué sucede en realidad si pasa una cadena como primer parámetro de una función?
establecerTiempo de espera(
'string',number)
El valor del primer parámetro se evaluó cuando llegó el momento de ejecutarlo (después numberde pasar milisegundos). Básicamente es igual a
establecerTiempo de espera(
eval('string'),number)
Esto es
una sintaxis alternativa que le permite incluir una cadena en lugar de una función, que se compila y ejecuta cuando expira el temporizador. Esta sintaxis no se recomienda por las mismas razones que hacen que el uso de eval() sea un riesgo para la seguridad.
Por lo tanto, las muestras a las que usted hace referencia no son buenas muestras y pueden darse en un contexto diferente o simplemente un simple error tipográfico.
Si invocas así setTimeout(something, number), el primer parámetro no es una cadena, sino un puntero a algo llamado something. Y nuevamente, si somethinges una cadena, será evaluada. Pero si es una función, entonces se ejecutará la función.
muestra jsbin
