javascript学习4、Function函数、伪数组arguments

一.Function函数基础

函数:就是将一些语句进行封装,然后通过调用的形式,执行这些语句。

1.函数的作用:

  • 将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。

  • 简化编程,让编程模块化。

console.log("hello world");
sayHello();     //调用函数
//定义函数:
function sayHello(){
  console.log("hello");
  console.log("hello world");
}

 

2.函数的定义

函数定义的语法:

function 函数名字(){
    函数体
    return 返回值
}

解释如下:

  • function:是一个关键字。中文是“函数”、“功能”。

  • 函数名字:命名规定和变量的命名规定一样。只能是字母、数字、下划线、美元符号,不能以数字开头。

  • 参数:后面有一对小括号,里面是放参数用的。

  • 大括号里面,是这个函数的语句。

3. 函数的调用

函数调用的语法:

函数名字();

4. 形参和实参

函数的参数包括形参和实参

注意:实际参数和形式参数的个数,要相同。

sum(3,4);
sum("3",4);
sum("Hello","World");

//函数:求和 function sum(a, b) { console.log(a + b); }

5. 函数的返回值

console.log(sum(3, 4));
    //函数:求和
    function sum(a, b) {
        return a + b;
}

 

二.函数类型

  JavaScript中函数基本上可以分为一下三类,普通函数,匿名函数,自执行函数,此外需要注意的是对于JavaScript中函数参数,实际参数的个数可能小于形式参数的个数,函数内的特殊值arguments中封装了所有实际参数。

// 普通函数
function func(arg){
    return true;
}
           
// 匿名函数
var func = function(arg){
    return "tony";
}
   
// 自执行函数
(function(arg){
    console.log(arg);
})('123')

注意:对于JavaScript中函数参数,实际参数的个数可能小于形式参数的个数,函数内的特殊值arguments中封装了所有实际参数。

 

三.函数作用域

JavaScript中每个函数都有自己的作用域,当出现函数嵌套时,就出现了作用域链。当内层函数使用变量时,会根据作用域链从内到外一层层的循环,如果不存在,则异常。

切记:所有的作用域在创建函数且未执行时候就已经存在。

(1)“JavaScript中无块级作用域”

function Main(){
    if(1==1){
        var name = 'seven';
    }
    console.log(name);
}
// 输出: seven

补充:标题之所以添加双引号是因为JavaScript6中新引入了 let 关键字,用于指定变量属于块级作用域。

(2)JavaScript采用函数作用域

在JavaScript中每个函数作为一个作用域,在外部无法访问内部作用域中的变量。

function Main(){
    var innerValue = 'seven';
}
  
Main();
  
console.log(innerValue);
  
// 报错:Uncaught ReferenceError: innerValue is not defined 

(3)JavaScript的作用域链

由于JavaScript中的每个函数作为一个作用域,如果出现函数嵌套函数,则就会出现作用域链。 

xo = 'tomcat';
   
function Func(){
    var xo = "seven";
    function inner(){
        var xo = 'alvin';
        console.log(xo);
    }
    inner();
}
Func();

如上述代码则出现三个作用域组成的作用域链,如果出现作用域链后,那么寻找变量时候就会出现顺序,对于上述实例:

当执行console.log(xo)时,其寻找顺序为根据作用域链从内到外的优先级寻找,如果内层没有就逐步向上找,直到没找到抛出异常。

(4)JavaScript的作用域链执行前已创建

JavaScript的作用域在被执行之前已经创建,日后再去执行时只需要按照作用域链去寻找即可。

示例一:

xo = 'tomcat';
  
function Func(){
    var xo = "seven";
    function inner(){
  
        console.log(xo);
    }
    return inner;
}
  
var ret = Func();
ret();
// 输出结果: seven

上述代码,在函数被调用之前作用域链已经存在:

  • 全局作用域 -> Func函数作用域 -> inner函数作用域

当执行【ret();】时,由于其代指的是inner函数,此函数的作用域链在执行之前已经被定义为:全局作用域 -> Func函数作用域 -> inner函数作用域,所以,在执行【ret();】时,会根据已经存在的作用域链去寻找变量。

示例二:

xo = 'tomcat';
  
function Func(){
    var xo = "mei";
    function inner(){
  
        console.log(xo);
    }
    xo = 'seven';
    return inner;
}
  
var ret = Func();
ret();
// 输出结果: seven

上述代码和示例一的目的相同,也是强调在函数被调用之前作用域链已经存在:

  • 全局作用域 -> Func函数作用域 -> inner函数作用域

不同的时,在执行【var ret = Func();】时,Func作用域中的xo变量的值已经由 “eric” 被重置为 “seven”,所以之后再执行【ret();】时,就只能找到“seven”。

示例三:

xo = 'tomcat';
 
function Bar(){
    console.log(xo);
}
  
function Func(){
    var xo = "seven";
      
    return Bar;
}
  
var ret = Func();
ret();
// 输出结果: tomcat

上述代码,在函数被执行之前已经创建了两条作用域链:

  • 全局作用域 -> Bar函数作用域
  • 全局作用域 -> Func函数作用域

当执行【ret();】时,ret代指的Bar函数,而Bar函数的作用域链已经存在:全局作用域 -> Bar函数作用域,所以,执行时会根据已经存在的作用域链去寻找。

(5)提前声明变量

在JavaScript中如果不创建变量,直接去使用,则报错:

console.log(xxoo);
// 报错:Uncaught ReferenceError: xxoo is not defined

JavaScript中如果创建值而不赋值,则该值为 undefined,如:

var xxoo;
console.log(xxoo);
// 输出:undefined

在函数内如果这么写:

function Foo(){
    console.log(xo);
    var xo = 'seven';
}
  
Foo();
// 输出:undefined

上述代码,不报错而是输出 undefined,其原因是:JavaScript的函数在被执行之前,会将其中的变量全部声明,而不赋值。所以,相当于上述实例中,函数在“预编译”时,已经执行了var xo;所以上述代码中输出的是undefined。

四.闭包

「闭包」,是指拥有多个变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。

闭包是个函数,而它「记住了周围发生了什么」。表现为由「一个函数」体中定义了「另个函数」

由于作用域链只能从内向外找,默认外部无法获取函数内部变量。闭包,在外部获取函数内部的变量。

function f2(){
    var arg= [11,22];
    function f3(){
        return arg;
    }
    return f3;
}
  
ret = f2();
ret();

 

五.伪数组arguments

arguments代表的是实参。有个讲究的地方是:arguments只在函数中使用

(1) 返回函数实参的个数:arguments.length

例子:

fn(2,4);
fn(2,4,6);
fn(2,4,6,8);

function fn(a,b,c) {
    console.log(arguments);
    console.log(fn.length);         //获取形参的个数
    console.log(arguments.length);  //获取实参的个数

    console.log("----------------");
}

结果:

(2) 之所以说arguments是伪数组,是因为:arguments可以修改元素,但不能改变数组的长短。举例:

fn(2,4);
fn(2,4,6);
fn(2,4,6,8);

function fn(a,b) {
    arguments[0] = 99;  //将实参的第一个数改为99
    arguments.push(8);  //此方法不通过,因为无法增加元素
}

清空数组的几种方式:

var array = [1,2,3,4,5,6];

array.splice(0);      //方式1:删除数组中所有项目
array.length = 0;     //方式1:length属性可以赋值,在其它语言中length是只读
array = [];           //方式3:推荐

 

posted @ 2019-06-04 16:47  Python自动化运维之路  阅读(287)  评论(0编辑  收藏  举报