JavaScript基础(十五)

变量&返回值

js中的变量有两种: 局部变量全局变量

全局变量:

在函数外声明的变量,网页上的所有函数和脚本都能访问它。

局部变量:

在函数内部声明的变量(必须使用var),只能在函数内部访问它,我们都知道声明全局变量时,变量名是不能重复的,不然变量会被覆盖掉,而局部变量只在某一个区域内生效,所以可在不同的函数中使用名称相同的局部变量

生命周期:

  1.局部变量在函数运行以后被删除

  2.全局变量在页面关闭后被删除

返回值:

  通过return将值返回调用它的地方。

例:

 function fn(a,b){

    return a+b;

  }

  console.log(fn(1,2));

  var num=fn(1,2);

  console.log(num);

005979f01cd843f3a4c65649e6d95708.png

 上面两个调用结果都是一样的的,像第二个一样,你不要直接去使用它,把它赋值给变量,后面方便改动。

下面说个面试题,你调用这个函数有时候函数名后带括号,有时候不带,啥意思?

比如上面这个:

function fn(a,b){

    return a+b;

  }

  console.log(fn(1,2));

  console.log(fn);

看看结果就知道:

228b9577ba8b49499c21d88301bb9d60.png

 console.log(fn(1,2));

//函数名带括号,调用的是函数的返回值。

console.log(fn);

//不带括号,调用的是函数本身。

通俗来说,全局变量和局部变量的区别就是公共汽车和私家车,一个是谁都可以上,一个是只有你允许的才能上。

 var num =100;(全局变量)

  function fn(){

    var a=99;(局部变量)

    console.log(num);

    console.log(a);

  }

  fn();

  console.log(a);

6e5ad2f59f9943ae844bf1bc12555441.png

结果显而易见,局部变量在外面是无法调用的

为什么之前说必须使用var来声明局部变量呢,我们改一下看看:

var num =100;

  function fn(){

    a=99;

    console.log(num);

    console.log(a);

  }

  fn();

  console.log(a);

22eb42ffd1ee4a95b3070cadd6371a2b.png

您看怎么着!如果声明变量的时候,没有var,直接变量名=值,自动提升作用域,自动变成全局变量

那如果,全局变量和局变量声明的变量名一样,在局部变量那它会优先使用哪个变量的值?

 var num =100;

  function fn(){

    var num=99;

    console.log(num);

  }

  fn();

e5556065a00e4933bbf7ac53fc900935.png

内部会把外部的覆盖掉。

用let声明同名的变量会报错,后面讲ES6会详细的说。

既然说到它能提升作用域,这就说明你在函数内声明的变量(不用var),它也会直接把外面的全局变量覆盖掉:

 var num =100;

  function fn(){

    num=99;

    console.log(num);

  }

  fn();

  console.log(num);

e558b247ddbe4b0781b5e418cdb11e97.png

在函数内部声明的变量,只要var了就是个局部变量 ,不var就是个全局变量,变量的取值只能是向上取值。

最后做个练习

练习:增加学员,并展示学员信息。

<body>

   <button οnclick="add(prompt('请输入会员姓名'))">添加会员信息</button> 

   <button οnclick="show()">展示会员信息</button> 

</body>

<script>

  var member=[];

  function add(name){

    if(name==0){

      alert('用户名不能为空');

    }else{

      member.push(name);

      alert('添加成功');

    }

  }

  function show(){

    if(member.length==0){

      document.write('请检查用户名')

    }else{

      for(name of member){

        document.write(name+'<br>');

      }

    }

  }

</script>

8a525871a73f427abf9560385b1f55d0.png

 178304ebe6cb4674af97ce1f290ef8c4.png

 cd1eba83b0e64756ab9b5726b6fbbe74.png

再细说一下返回值吧:

function fn(){

    return '我是fn';

  }

  var str =fn();//调用fn(),得到返回值,同时可以赋值给str

  console.log(str);

b227a8783829491ca581eb88e2bd8b10.png

我们通过三目运算符return一个最大值,两个数比较太简单了,顺便复习一下三个数的三目运算怎么写:

 function big(a,b,c){

    return(a>b?a:b>c?a>b?a:b:c);

  }

  var biggest =big(11,22,33);

  console.log(biggest);

5b2e5f1b374d4882bb29976890d05817.png

很好理解只要把a>b?a:b看成一个数,就是ab之间的最大数,然后和c比较就行了。

我们目光不能太死,不然很多我们学的东西你都会觉得没用,不能只把abc当成数,可以把它们当成条件,满足哪个条件得到返回值后,页面发生对应变化,也可以跳转到别的地方。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值