JavaScript 小知识点集锦

  JAVASCRIPT       2015-03-10

一、对变量值是否为 undefined 的判断

(1)若关心的是变量是否声明而不是其值的话,最好使用 in ;如果使用 typeof,对于只声明而未初始化的变量其值为 "undefine";

  1. // global scope
  2. var test; // value: "undefined"
  3. "test" in window; // true
  4. "tempTest" in window; // false
  5. "undefine" === typeof test; // true

(2)若关心的是变量是否声明或者其值是否为 "undefined" (一种情况是未初始化),使用 typeof;直接与 "undefined" 比较是有问题的,因为 "undefined" 可以被重写,而在 ECMA5 中已修复,不可重写;

  1. "undefined" === typeof test; // true
  2. window.undefined = "omg";
  3. "omg" === undefined; // true

(3)注意:if 条件中的变量要先定义,否则会报 ReferenceError;


二、ECMA5 中的 bind()

(1)作用:给调用函数中的 this 传递对象;考虑下面一种情况:

  1. this.x = 9;
  2. var module = {
  3. x: 81,
  4. getX: function() {
  5. return this.x;
  6. }
  7. };
  8. module.getX(); // 81
  9. var getX = module.getX;
  10. getX(); // 9, "this" refers to the global object
  11. // Create a new function with "this" bound to module
  12. var boundGetX = getX.bind(module);
  13. boundGetX(); // 81

(2)自定义实现 bind()

  1. if (!Function.prototype.bind) {
  2. Function.prototype.bind = function (oThis) {
  3. if (typeof this !== "function") {
  4. // closest thing possible to the ECMAScript 5 internal IsCallable function
  5. throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
  6. }
  7. var aArgs = Array.prototype.slice.call(arguments, 1),
  8. fToBind = this,
  9. fNOP = function () {},
  10. fBound = function () {
  11. return fToBind.apply(this instanceof fNOP && oThis
  12. ? this
  13. : oThis || window,
  14. aArgs.concat(Array.prototype.slice.call(arguments)));
  15. };
  16. fNOP.prototype = this.prototype;
  17. fBound.prototype = new fNOP();
  18. return fBound;
  19. };
  20. }

(3)参考:MDN bind()


三、call() 和 apply()

  1. <input type="text" id="myText" value="input text">
  2. function Obj(){
  3. this.value = "对象!";
  4. }
  5. var value = "global 变量";
  6. function Fun1() {
  7. alert(this.value);
  8. }
  9. window.Fun1(); //global 变量
  10. Fun1.call(window); //global 变量
  11. Fun1.call(document.getElementById("myText")); //input text
  12. Fun1.call(new Obj()); //对象

通过上述代码,可以看出使用 call() 主要替换了函数中的 this 值;call() 可以传多个参数,从第二个开始作为参数传递给函数;代码如下:

  1. var first_object = {
  2. num: 42
  3. };
  4. var second_object = {
  5. num: 24
  6. };
  7. function multiply(mult) {
  8. return this.num * mult;
  9. }
  10. multiply.call(first_object, 5); // returns 42 * 5
  11. multiply.call(second_object, 5); // returns 24 * 5

对于apply():

本文最后更新于2015-03-10 19:24:50