JS学习之函数的作用域

作用域
变量或者函数可访问的一个范围,以函数来划分,一个函数块就是一个作用域。
一 全局作用域
全局:整个文档
变量或者函数在函数外面声明,那它们就是全局变量或者全局函数,在这个页面的任何地方都可以访问的到。
声明全局作用域的方法:
1、把变量或者函数放在函数外面声明
2、变量不用var声明,直接给变量赋值;不管在函数外还是函数内声明
全局变量在任何地方都可以访问的到是因为全局变量是window的一个属性,window是一个全局对象,本身在页面中的任何位置都可以访问

 1     var a=10;
 2         console.log(a); //10  a 在函数外面声明是一个全局变量
 3
 4       function  test(){
 5            var b=12;  //在函数内声明,是局部变量
 6            c=20;   // 没有用var 声明就是全局变量
 7            console.log(a);
 8       }
 9       test(); // 10 因为a 是在函数外面声明的,是全局变量,所以函数内部也可以访问
10       console.log(c);  //可以访问的到,
11       console.log(b); // 报错 b is not defined 因为b是局部变量,只能在函数内部使用,在函数外面无法访问的到

注意:1:尽量避免使用全局变量,可能会变量覆盖
一直存在内存中,当页面一打开就一直存在着内存中,当页面关闭的时候才会消失
2:声明变量的时候一定加上var 因为不建议使用全局变量

二  局部作用域

局部:函数范围内
变量或者函数在函数内部声明的,作用仅存在于声明的函数中,在函数外面无法访问
函数里面可以声明函数,就是函数嵌套(局部函数),可以访问父函数里的内容

 1  function  test(){
 2             var a=10; //局部变量
 3             var b=20;
 4             //在函数内部声明,是局部函数
 5             function test1(){
 6                  console.log(a+b);
 7             }
 8             test1(); // 只能在函数内部调用
 9   }
10       test();  // 在函数外面声明,是一个全局函数
11       console.log(a); // 报错 a 是一个局部变量,只能在test函数内部使用,在test函数外无法访问
12       // 同样的道理也无法访问到b ,test1()

注意:局部变量和局部函数只能在声明他们的地方用,在其他地方无法访问,会直接报错

三 作用域链

变量与函数的查找规则
查找规则:如果一个函数需要用到一个变量,先会在自己的作用域里去找这个变量,如果自己有就直接使用自己的,如果自己没有就会一层一层往外找直到找到外面的变量,找到后就用外面的变量

 1       var a=10;
 2       function test(){
 3           console.log(a);
 4
 5       }
 6       test(); // 10  函数先会在自己的作用域里去找a,发现没有找到就会找他父级,在父级中找到了一个a,就用这个a
 7       function  test1(){
 8              var a=12;
 9        console.log(a);
10       }
11       test1(); // 12 在自己的作用域中找到了a,就会用这个a,停止查找(就近原则)

注意:作用域链会一层一层往外找,不会往里面找

原文地址:https://www.cnblogs.com/xubj/p/9869903.html

时间: 2024-08-29 06:11:34

JS学习之函数的作用域的相关文章

js学习笔记01-函数,作用域,闭包

${var} //变量的占位符, ${}里边 依旧是js,字符串拼接 var str1 = "Hello"; var str2 = "World"; console.log("say: "+str1+" "+str2+"!"); console.log(`say: ${str1} ${str2}!`); 函数function 像处理(字符串.数组或数字)一样来处理函数1)存储在变量中.2)从一个函数返回.3

JS学习之函数内部属性和方法

知识点:arguments和this对象.caller属性.apply()和call()方法     arguments对象:函数内部对象,传入函数中所有参数的集合,类数组对象 属性:callee 指针,指向拥有这个arguments对象的函数  作用:解耦 例子:迭代 function factorial(num) { if(num<=1){ return 1; }else{ return ( num*arguments.callee(num-1)); } } console.log(fact

js学习之函数的参数传递

我们都知道在 ECMAScript 中,数据类型分为原始类型(又称值类型/基本类型)和引用类型(又称对象类型):这里我将按照这两种类型分别对函数进行传参,看一下到底发生了什么. 参数的理解 首先,我们要对函数的参数有一个了解: 形参就是函数内部定义的局部变量: 实参向形参传递值的时候,就是一个赋值操作,把实参的值直接复制一份给形参. 原始类型参数传递 示例1 var a = 1; function f(b) { a = 3; } f(a); console.info(a); // 3 示例1中的

js学习总结----函数的三种角色

注意:Function.prototype是函数数据类型的值,但是相关操作和之前的一模一样->Empty/anonymous 函数本身也会有一些自己的属性:   length :形参的个数   name:"Fn" 函数名   prototype 类的原型,在原型上定义的方法都是当前Fn这个类实例的公有方法   __proto__ 把函数当做一个普通的对象,指向Function这个类的原型 函数在整个JS中是最复杂的也是最重要的知识: 1.一个函数存在了多面性: "普通函

js学习总结----函数

一.函数基本知识 1.function:函数->具备某个功能的一个方法.方法本身是没有什么意义的,只有执行这个方法实现了对应的功能才有自己的价值. 2.函数由两部分组成:创建一个函数.执行这个函数  function 方法名(){          //函数体:存放的某个功能实现的JS代码  }  方法名(); 创建一个函数可以执行多次,一般情况下,每次执行函数和上一次执行没有任何的关系 function sum(){ var total = null; total = 1 + 1; conso

node.js学习(2)函数

1 简答函数 2 匿名函数 3 回调函数 原文地址:https://www.cnblogs.com/xiao-xue-di/p/11332507.html

JS的箭头函数this作用域

name="小刚"; let student={ name:"小明", printLog:function(){ // 这里绑定了顶层作用域,可以使用变量与方法 console.log(this) }, printArrowLog:()=>{ // 这里不知道绑定的是哪个作用域,有知道的大咖请回答下 console.log(this) } } student.printLog(); /* { name: '小明', printLog: [Function: p

好程序员web前端学习路线分享web测试之Js中的函数

好程序员web前端学习路线分享web测试之Js中的函数,在JS中,一般使用函数其实就是为了封装某些操作,或者把编写的程序进行模块化的操作. 一.函数的声明方式 1.普通的函数声明 function box(num1, num2) { return num1+ num2; } 2.使用变量初始化函数 var box= function(num1, num2) { return num1 + num2; }; 3.使用Function构造函数 var box= new Function('num1'

Js学习第十天----函数

函数 什么是函数?函数是由事件驱动的或者当他被调用时执行的可重复使用代码块.估计没明白,个人认为函数就是能完成一个功能的代码块. 看个案例: <!DOCTYPE html> <html> <head> <script> function myFunction() { alert("Hello World!"); } </script> </head> <body> <button onclick=