6 JavaScript函数&内置构造&函数提升&函数对象&箭头函数&函数参数&参数的值传递与对象传递

JavaScript函数:使用关键字function定义,也可以使用内置的JavaScript函数构造器定义

匿名函数:

函数表达式可以存储在变量中,并且该变量也可以作为函数使用。

实际上是匿名函数。

<body>

<p>函数存储在变量后,变量可作为函数使用:</p>
<p id="demo"></p>
<script>
var x = function(a,b){return a+b; };
document.getElementById("demo").innerHTML = x(1,2);
</script>

</body>

 

构造函数:

<body>

<p>JavaScrip 内置构造函数。</p>
<p id="demo"></p>
<script type="text/javascript" charset="utf-8">
    var multiply = new Function("a","b","return a*b");
    document.getElementById("demo").innerHTML = multiply(3,4);
</script>
</body>

另一种写法:

<body>

<p id="demo"></p>
<script type="text/javascript" charset="utf-8">
    var multiply = function(a, b) { return a*b };
    document.getElementById("demo").innerHTML = multiply(3,5);
</script>
</body>

 

函数的提升:

  • 提升是JavaScript默认将当前的作用于提升到前面去的行为,应用在变量的声明与函数的声明
  • JavaScript在执行代码之前会进行预编译,而预编译的作用就是将函数和变量的作用域提升至其对应作用域的最顶端
  • 因此,函数可以在声明之前调用

函数的自调用:

通过添加括号来说明他是一个函数表达式

<script>
(function () {
    document.getElementById("demo").innerHTML = "Hello! 我是自己调用的";
})();
</script>

函数对象:

  • 在JavaScript中使用typeof操作符判断函数类型将返回function,但是JavaScript函数描述为一个对象更加准确
  • JavaScript函数有属性和方法,arguments.length属性返回函数调用过程接收到的参数个数

 

箭头函数:默认绑定外层this的值,在箭头函数中this的值和外层的this是一样的

() => {}

 

函数参数:

  • JavaScript对函数参数的值没有进行任何检查
  • JavaScript函数参数与大多数其他语言的函数参数区别在于:它不关注参数个数与参数数据类型
  • 如果函数设置了过多的参数,参数将无法被引用,只能使用Arguments对象来调用
  • 没有设置时,参数默认为undefined
<body>

<p>设置参数的默认值。</p>
<p id="demo"></p>
<script>
function myfunction(x,y) {
    if(y == undefined){
        y = 0;
    }
    return x * y;
}
document.getElementById("demo").innerHTML = myfunction(4);
</script>

</body>

 

Arguments对象:

  • argument对象包含了函数调用的参数数组

通过Argumens对象找到参数中的最大值:

<script>
x = findMax(1,100,-200,101,1111,22112);

  function findMax(){
      var i,max = arguments[0];
      
      if(arguments.length < 2) return max;
      
      for( i = 0; i < arguments.length; i ++){
          if(arguments[i] > max)
          {
            max = arguments[i];
      
          }
    }
      
      return max;
      
  }
document.getElementById("demo").innerHTML = x;
</script>

 

参数的值传递:

在函数外定义的参数,如果在函数中修改参数的值,将不会修改参数的初始值(或者说定义值)。

因此,JavaScript函数传值只是将参数的值传入函数,函数会另外配置内存保存参数值,所以并不会改变原参数的值

var x = 1;
// 通过值传递参数
function myFunction(x) {
    x++; //修改参数x的值,将不会修改在函数外定义的变量 x
    console.log(x);
}
myFunction(x); // 2
console.log(x); // 1

 

参数的对象传递:

在JavaScript中可以引用对象的值,因此我们在函数内部修改对象的属性就会修改其初始的值。

var obj = {x:1};
// 通过对象传递参数
function myFunction(obj) {
    obj.x++; //修改参数对象obj.x的值,函数外定义的obj也将会被修改
    console.log(obj.x);
}
myFunction(obj); // 2
console.log(obj.x); // 2

 

总结:

  • 参数的值传递,不改变变量的初始值
  • 参数的对象传递,改变对象的初始值

 

posted @ 2019-09-24 16:47  IslandZzzz  阅读(445)  评论(0编辑  收藏  举报