zoukankan      html  css  js  c++  java
  • JavaScript tips and tricks 3

    Is undefined a reserved word
    It seems like so, but actually it doesn’t.

    var undefined = 'Hello';   
    
    undefined; // 'Hello'

    This may surprise you, but it does work well. undefined is just a pre-defined variable.

    Note: Never assign a value to undefined, that may break your program.

    How to check a undefined value
    In two situations, a variable is identified as a variable that is not defined.
    1. A variable is declared, but not assigned.

    var name;   
    
    name === undefined; // true

    2. A variable is never declared.

    name2 === undefined; // error – name2 is not defined

    You can see in the second situation an error which has been thrown out.
    How to catch this error?
    We can use the following way which is vary common to check whether a variable is defined or not:

    typeof(name2) === ‘undefined’; // true

    how to preload images
    The concept of “preload images” is about loading images that are not exist in the document and displaying them later using javascript to response to user’s action. For example, you may want to change an image to another one when mouse hover.

    The basic preload syntax like this:

    var img = new Image();   
    
    img.src = ‘clock2.gif’;

    Then you can use it as follows:

    <img src="clock.gif" mce_src="clock.gif" alt=""   
    
    onmouseover="this.src='clock2.gif';"   
    
    onmouseout="this.src=clock.gif';" />

    Then, how to preload an array of images:

    var source = ['img1.gif','img2.gif'];   
    
    var img = new Image();   
    
    for(var i = 0; i < source.length; i++) {   
    
        img.src = source[i];   
    
    }

    This will only preload the last image. The rest of the images have no chance to preload before the loop come around again. The right way to do would be:

    var source = ['img1.gif','img2.gif'];   
    
    for(var i = 0; i < source.length; i++) {   
    
        var img = new Image();   
    
        img.src = source[i];   
    
    }

    JavaScript Closures
    A closure is a local variable for a function keeps alive after the function has returned.
    If you use the function keyword inside another function, you are creating a closure.
    A famous example:

    function add(i) {   
    
        return function() {   
    
            return ++i;   
    
        };   
    
    }   
    
    add(2).toString(); // "function () { return ++i; }"   
    
    add(2)(); // 3

    add(2) is a function, which can access the outer function’s local parameter i.
    It’s the power of closure.

    You can refer to this wonderful resource for details.

    Private variable
    JavaScript doesn’t have the mechanism of hidden variable from the outside world.
    Sometimes we use name conventions to identify whether a variable is a private member:

    var person = {   
    
        _name: '',   
    
        getName: function() {   
    
            return this._name || 'not defined';   
    
        }   
    
    };   
    
    person.getName(); // "not defined"

    The underline prefix name convention is used to identify a private member.
    But other people can invoke it regardless what name conventions have been applied.

    person._name; // ""

    Then, how to implement a real private member in javascript?
    The core technology to implement a private variable is anonymous function and closure.

    var person = {};   
    
    (function() {   
    
        var _name = '';   
    
        person.getName = function() {   
    
            return _name || 'not defined';   
    
        }   
    
    })();   
    
    person.getName(); // "not defined"   
    
    typeof(person._name); // "undefined"
  • 相关阅读:
    操作系统
    redis
    数据库原理与mysql
    计算机网络
    重写、重载、隐藏以及多态分析
    c++复习重点
    重装系统记录
    正则表达式匹配ip地址
    信号量和互斥锁的区别 互斥量与临界区的区别
    为Markdown文件生成目录
  • 原文地址:https://www.cnblogs.com/sanshi/p/1456784.html
Copyright © 2011-2022 走看看