【JavaScript】【函数】蛛丝马迹

1. 函数属性

   • name。Firefox、Safari、Chrome、Opera支持这个非标准属性。通过函数声明定义的函数，其name是function后的标识符；通过函数表达式定义的函数，其name是空字符串。

       var a = function() {};
       var b = new Function();
       function c() {}
       console.log(a.name); //''
       console.log(b.name); //anonymous
       console.log(c.name); //c

   • prototype。函数原型。

   • length。返回定义函数的参数个数。

       var a = function(){};
       function b(i) {return i;}
       console.log(a.length); //0
       console.log(b.length); //1    

   • arguments。函数内部的类数组对象，包含传入函数中的所有参数。可以通过数组下标的方式访问传入函数里的每一个参数。arguments.length返回实际传入函数的参数个数。

       function add() {
           var _length = arguments.length;
           var _init = 0;
           for (var i=0; i<_length; i++) {
               _init += arguments[i];
           } 
           return _init;
       }
       add(1,2,3,4); //10

   • callee和caller。

       function outer() {
           function inner(){
               console.log(arguments.callee.name); //inner
               console.log(arguments.callee.caller.name); //outer
           }
           inner();
       }
       outer();

   • this函数内部属性。this指的是谁？了解更多。

2. 函数方法

   • apply()和call()

       function sum(num1, num2) {
           return num1 + num2;
       }
       function anotherSum(num1, num2) {
           return sum.apply(this, arguments);
       }
       function yetAnotherSum(num1, num2) {
           return sum.call(this, num1, num2);
       }
     
       console.log(sum(1,2)); //3
       console.log(anotherSum(1,2)); //3
       console.log(yetAnotherSum(1,2)); //3

   • bind()

       var window.color = 'red';
       var o = {color:'blue'};
       function sayColor() {
           return this.color;
       }
       console.log(sayColor()); //red
       var sayOColor = sayColor.bind(o);
       console.log(sayOColor()); //blue

3. 函数声明提升，使其在加载作用域数据之前（编译阶段）可用。

      //变量声明提升
      console.log(a); //undefined
      var a = 1;
      console.log(a); //1
      //这个过程相当于
      var a;
      console.log(a);
      a = 1;
      console.log(a);
   
      //函数声明会覆盖同名变量声明
      console.log(typeof x); //function
      function x() {}
      var x;

4. 若传入函数的参数如果是基本类型值，函数操作的是这个参数的副本；若参数是对象，该参数只是这个对象的引用，函数操作的是对象本身。

      var a = 1;
      var b = {value: 1};
      function add(x) {
          (typeof x === 'number') ? (x++) : (x.value++);
      };
      add(a);
      add(b);
      console.log(a);  //1
      console.log(b.value); //2

5. new这个过程有四个步骤

      // new Func();
      var obj = {}; //1.创建空对象
      obj.__proto__ = Func.prototype; //2.使obj的__prototype__指向构造函数的原型
      var ret = Func.call(obj); //3.以obj作为构造函数的上下文调用Func。在为实例构造属性之前，属性值为undefined。
      if (typeof ret == 'object') { //4.如果返回的是对象，就会覆盖构造的实例；否则会忽略返回的基本类型值。
          return ret;
      } else {
          return obj;
      }
   

转载请注明出处：https://segmentfault.com/a/1190000004579488

文章不定期更新完善，如果能对你有一点点启发，我将不胜荣幸。