Popular Posts
Enable SSL connection for Jsoup import org.jsoup.Connection; import org.jsoup.Jsoup; import javax.net.ssl.*; import java.io.IOException; import java.security.KeyManagement... Word break tag : <wbr/> (HTML5) The  HTML  <wbr>  tag  is  used  defines  a  potential  line  break  point  if  needed.  This  stands  for  Word  BReak. This  is  u... Build an OpenVPN server on android device Preparation An android device, in this case, Sony xperia Z is used Root permission required Linux Deploy for deploy i...
Stats
Javascript lambda: No binding of this
<form>
    <p>
        <button id="f1">Invoke with function</button>
    </p>
    <p>
        <button id="f2">Invoke with lambda</button
    </p>
    <div id="output"></div>
</form>
<script>
    'use strict';
    (function () {
        let f1 = document.querySelector('#f1'),
            f2 = document.querySelector('#f2'),
            output = document.querySelector('#output');

        function appendResult(message) {
            let log = document.createElement('pre');
            log.appendChild(document.createTextNode(message));
            output.appendChild(log);
        }

        // define with function, reference 'this' to button element
        f1.onclick = function () {
            appendResult('Button [Invoke with function] clicked!');
            appendResult('This is: ' + JSON.stringify(this) + ' [' + this.constructor.name + ']');
            console.log(this);
            return false;
        };

        // define with lambda, reference 'this' to {name: 'Bruce'} object
        f2.onclick = () => {
            appendResult('Button [Invoke with lambda] clicked!');
            appendResult('This is: ' + JSON.stringify(this) + ' [' + this.constructor.name + ']');
            console.log(this);
            return false;
        };

    }).call({name: 'Bruce'})
</script>
Result:

Reference: No binding of this
Memo: Debounce Task

To prevent multi-execution from caller in short time, use debounce for single execution.

var debounce = function (func, threshold, execAsap) {
    var timeout;
    return function debounced () {
        var obj = this, args = arguments;
        function delayed () {
            if (!execAsap)
            func.apply(obj, args);
            timeout = null;
        };
        if (timeout)
            clearTimeout(timeout);
        else if (execAsap)
            func.apply(obj, args);
        timeout = setTimeout(delayed, threshold || 100);
    };
}