Я вернусь к основам, чтобы лучше понять JavaScript. У меня есть веб-сайт для тестирования. Вот мой код
<html>
<head>
test
</head>
<script type="text/javascript">
function saySomething(message)
{
alert(message);
}
saySomething('Hello world!');
function addLoadListener(fn){
window.addEventListener('load', fn, false);
alert("the previous alert came from onload");
}
addLoadListener(saySomething);
</script>
<body>
<div>blah blah blah</div>
</body>
</html>
Итак, есть эта функция, saySomething
которая оповещает Hello World!
, Я добавляю его в addLoadListener
поэтому его можно вызвать во время загрузки страницы. И отлично работает до этой части. Но после этого снова вызывается, когда код запускается и вызывается [object Event]
вместо Hello World!
, Зачем? Что мне не хватает?
благодаря
Может быть, вам не хватает вашего аргумента
<html>
<head>
test
</head>
<script type="text/javascript">
function saySomething(message)
{
alert(message);
}
saySomething('Hello world!');
function addLoadListener(fn){
window.addEventListener('load', fn, false);
alert("the previous alert came from onload");
}
addLoadListener(saySomething('Hello world!'));
</script>
<body>
<div>blah blah blah</div>
</body>
</html>
saySomething
теперь запускается немедленно, а не в событии load
.
onload
не работает. Имеет смысл. Благодарю. Способ понять основы. Что со мной не так?
Проблема в том, что после того, как вы присоедините функцию saySomething
в качестве прослушивателя событий к событию загрузки окна, он позже вызывается с разными аргументами при срабатывании события. На самом деле аргумент является объектом события, поэтому вы видите предупреждение [object Event]
.
Хотя я не знаю реальной цели вашего кода, если вы хотите предупредить "Hello World!"
string, и вам не нужны аргументы события, связанные с запущенным событием, вы можете привязать первый аргумент функции saySomething к "Hello World!"
:
var boundHandler = saySomething.bind(window, "Hello World!");
addLoadListener(boundHandler);
Edit: Function.prototype.bind создает новую функцию, в которой this
и все аргументы новой функции могут быть привязаны к определенным значениям. Важно отметить, что bind создает новую функцию, а исходная сохраняется. Вы можете создать столько связанных версий оригинала, сколько захотите.
Если вы вызываете boundHandler("something else")
или boundHandler()
, "Hello World!"
все равно будет предупрежден вместо нового текста. Вот почему работает код обработки событий.
Если вы создаете связанную функцию следующим образом:
function alertThis() { alert(this); }
var boundFn = alertThis.bind("my new this");
alertThis() // "[object Window]" is alerted
boundFn() // "my new this" is alerted
Здесь больше информации о Function.prototype.bind: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind.
saySomething.bind(window, "Hello World!");
, Спасибо
<script type="text/javascript">
function saySomething(message)
{
alert(message);
}
saySomething('Hello world!');
function addLoadListener(fn){
window.addEventListener('load', fn, false);
alert("the previous alert came from onload");
}
addLoadListener( function() { saySomething('Hello world!') });
</script>
Когда происходит событие "load", он вызывает вашу функцию следующим образом: "saySomething (event)" - первый аргумент - это объект события. Не строка.
Поэтому вы должны что-то изменить в своем коде. Например:
function saySomething(message)
{
var msg = typeof message != 'string' ? 'Hello world!' : message; //setting default message
alert(msg);
}
Это связано с тем, что вы добавляете эту функцию в качестве прослушивателя событий. Первым аргументом функции прослушивателя событий является объект события. Вот почему вы получаете [object Event]
.
Вы можете связать свое сообщение с объектом контекста. Это один из способов решения вашей проблемы:
function saySomething(message) {
alert(message);
}
function saySomethingListener(message) {
saySomething(this.message);
}
saySomething('Hello world!');
function addLoadListener(fn) {
window.addEventListener('load', fn.bind({message: 'Hello world!'}), false);
alert("the previous alert came from onload");
}
addLoadListener(saySomethingListener);
Hello World!
после загрузки страницы. Также было бы хорошо, если бы вы предоставили объяснение, почему это происходит. Спасибо