Форум

skrudjmakdak · #1 (**permalink**) 27.08.2014, 09:31

возьмем вот такой код:

<html>
	<body>
		<div>my text</div>
		<script type="text/javascript">

function clk(e, flag)
	{
	console.log(this);
	console.log(e);
	flag = !flag;
	console.log(flag);
	}

var div = document.querySelector('div');
div.onclick = clk.bind(div, false);
		</script>
	</body>
</html>

кликнув по div'у я заметил 2 минуса:
1. не нашел объект event который какбэ должен быть;
2. значение флага к большому сожалению не сохраняется((

и есть старое доброе обычное замыкание:

<html>
	<body>
		<div>my text</div>
		<script type="text/javascript">
var div = document.querySelector('div');
div.onclick = function (flag)
	{
	return function (e)
		{
		console.log(this);
		console.log(e);
		flag = !flag;
		console.log(flag);
		};
	}(false);
		</script>
	</body>
</html>

которое отрабатывает на ура.

я на сегодняшний день пришел к выводу, что bind не всегда хорош.. если меня не переубедят в обратном

п.с. тестил в хроме

Octane · #2 (**permalink**) 27.08.2014, 11:46

Сообщение от skrudjmakdak

function clk(e, flag)

Сообщение от skrudjmakdak

div.onclick = clk.bind(div, false);

у тебя в "e" придет false, а в "flag" - объект события

skrudjmakdak · #3 (**permalink**) 27.08.2014, 11:52

Сообщение от Octane

у тебя в "e" придет false, а в "flag" - объект события

у меня и в первом и во втором случае - false

Octane · #4 (**permalink**) 27.08.2014, 12:12

var obj = {};
obj = !obj;
alert(obj);

skrudjmakdak · #5 (**permalink**) 27.08.2014, 12:52

Octane, я не об этом. поклацай в 1 и 2 примере несколько раз. и увидишь разницу. в первом будет постоянно идти true, т.к. flag не сохраняется. а во втором будет сохраняться

Aetae · #6 (**permalink**) 27.08.2014, 12:58

В простых случаях обычно не заморачиваюсь и делаю так:

<script>
document.onclick = function click(e){
        console.log(this);
        console.log(e);
        click.flag = !click.flag;
        console.log(click.flag);
};
</script>

А bind предназначен совсем для иного.)

skrudjmakdak · #7 (**permalink**) 27.08.2014, 13:05

Aetae, как вариант))

skrudjmakdak · #8 (**permalink**) 27.08.2014, 20:14

кстати, меня сбили с толку ))
бывают случаи когда нужны дефолтные значения:

div1.onclick = fun.bind(div1, 'black', 43);
div2.onclick = fun.bind(div2, 'red', 27);
...

Octane · #9 (**permalink**) 27.08.2014, 22:51

bind ненужОн

function fun(event) {
    event.currentTarget; //-> div1 или div2
    this.color;
    this.count;
}

div1.addEventListener('click', {
    color: 'black',
    count: 43,
    handleEvent: fun
});

div2.addEventListener('click', {
    color: 'red',
    count: 27,
    handleEvent: fun
});

Sweet · #10 (**permalink**) 27.08.2014, 23:28

skrudjmakdak, так аргументы ж - наоборот. Сначала забинденные, потом те, которые при вызове передаются:

<html>
    <body>
        <div>my text</div>
        <script type="text/javascript">
 
function clk(flag, e)
    {
    console.log(this);
    console.log(e);
    flag = !flag;
    console.log(flag);
    }
 
var div = document.querySelector('div');
div.onclick = clk.bind(div, false);
        </script>
    </body>
</html>

Но, конечно, значение переменной при таком использовании менять нельзя.

Форум

Справочник

Discord чат

Курсы javascript