继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

JavaScript tips and tricks - 3

linux零基础学习视频
关注TA
已关注
手记 276
粉丝 29
获赞 122

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"
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP