JS学习笔记（作用域,匿名函数,定时器,this指向,Math函数）

一，作用域

作用域我们分为三大作用域即：

• 全局作用域

• 局部作用域

• 块级作用域

      JS三种作用域:

      全局作用域(全局变量):在函数外面let的变量

      局部作用域(局部变量):在函数里面let的变量

      块级作用域(块级变量):在分支或循环大括号中let的变量

全局作用域
 

//【全局作用域】
    //在代码中任意地方都能访问到的对象拥有全局作用域。
    //(即在全局作用域中定义的变量可以在任何地方使用.)
    //全局作用域在页面打开时创建,在页面关闭时销毁。
    //【情况一:所有未定义直接赋值的变量自动声明为拥有全局作用域】
    function Fun1(){
        a = '未定义直接赋值的变量';
        var b ='内层变量'
    }
    Fun1();
    console.log(a);//未定义直接赋值的变量
    console.log(b);//b is not defined
    //注意:如果一个变量在声明的时候没有使用关键字。
    //例如:num=10,此时这个变量无论写在哪里都是全局变量。
    //但是这是非常不规范的，千万不要这么写，否则以后代码可能会出现bug。
    //【情况二:最外层函数和最外层函数外面定义的变量拥有全局作用域】
    var A ='最外层变量';//最外层变量
    function outFun(){//最外层函数
        var B="最外层函数的内层变量"
        function innnerFun(){//内层函数
            var C ='内层函数的内部变量'
        }
    }
    console.log(A);//最外层变量
    //console.log(B);//B is not defined
    outFun()
    innerfun() //innerfun is not defined
    // console.log(C);
    //C is not defined
    //【情况三:所有window对象的属性拥有全局变量】
    //在全局作用域中有一个全局对象window,他代表的浏览器的窗口,由浏览器创建。
    //一般情况下, window对象的内置属性都拥有全局作用域,例如window.name、window.location

局部作用域

    //如果一个变量是在函数内部声明的,它就在局部作用域下,这个变量只能在函数内部访问,不能再函数以外 
    去访问
    function fn() {
      var info = 'hello world'
      console.log(info)
    }
    fn() //打印hello world
    console.log(info)  //Uncaught ReferenceError: info is not defined

块级作用域

//ES6引入了let和const关键字,和var关键字不同,在大括号中使用let和const声明的变量存在于块级作用域中,在大括号之外不能访问这些变量
  {
      //块级作用域中的变量
      var msg = 'English'
      let info = 'hello world'
      const num = 10
      console.log(msg) //English
      console.log(info)//hello world
      console.log(num) //10
    }
      console.log(msg) //English
      console.log(info) //Uncaught ReferenceError: info is not defined
      console.log(num) //Uncaught ReferenceError: num is not defined

作用域链

var sex = '男'
    function person() {
      var name = '晚自习'
      function student() {
        var age = 20
        console.log(name)//晚自习
        console.log(sex)//男
      }
      student()
      console.log(age) //Uncaught ReferenceError: age is not defined
    }
    person()
//当在JavaScript中使用一个变量的时候,首先JavaScript引擎会尝试在当前作用域下去寻找该变量,如果找不到,再到它的上层作用域去找,以此类推直到找到该变量

二.匿名函数

简言称便是没有名字的函数

 //【匿名函数】
 //没有函数名的函数。
 
 //具名函数
 function fn(){
    console.log( '666');
 }
 //fn()
 //匿名函数
 let fn1 = function(){
    console.log( '111');
 }
 //fn1()
 //执行匿名函数:自执行语法
 //自执行语法:(匿名函数)()
 (function(){
   let fn2 = 10
   console.log('666');
 })()

三.定时器

JavaScript 中有两种定时器：

• setTimeout()：指定时间后执行一段代码（延迟执行）。

• setInterval()：每隔一段时间执行一段代码（间隔执行）。

      //【setTimeout和setInterval的区别】
      // timeout:（体育比赛中的)暂停;超时;
      // interval:间隔;间隙。
      //使用setTimeout()开启的定时器, “时间”一到代码就会执行。
      //即用来指定某个函数或某段代码在多少毫秒之后执行。
      //使用setInterval()开启的定时器,“时间间隔”一到代码就会执行一次。
      //即每隔一段时间执行一个函数。
      setInterval (function(){
        console.log(4);
      },1000)//每秒打印一个4
      setTimeout (function(){
          console.log(5);
      },1000)//过一秒只打印一个4
      //使用clearTimeout()和clearInterval()可以清除定时蕃。
      //setTimeout指定的代码,必须等到本次执行的所有同步代码都执行完,才会执行。
      //例
      console.log('我是第一');
      setTimeout (function () {
          console.log('我是第二');
      },1)
          console.log('我才是第二');
      setTimeout (function () {
          console.log('你们都偷跑');
      },5)

  上述为什么定时器会在直接输出的后面执行，是因为JavaScript 的单线程。因为 JavaScript 是单线程的，所以每次只能执行一段代码。JavaScript 中的任务执行有一个队列的概念，即任务会被排进队列按先入先出的顺序执行。

四.this指向

this的概念：

1. 在js中，this的意思为“这个;当前”，是一个指针型变量，它动态指向当前函数的运行环境。

2. 在不同的场景中调用同一个函数，this的指向也可能会发生变化，但是它永远指向其所在函数的真实调用者；如果没有调用者，就指向全局对象window。

普通函数：关于this，谁调用就指向谁，没有调用者，就指向全局对象window。

箭头函数：箭头函数的this指向于函数作用域所用的对象。

   //【什么是this指向】
    // this是一个使用在作用域内部(块级作用域、函数作用域、全局作用域)的关键字。
    // this关键字是函数运行时自动生成的一个内部对象,只能在函数内部使用,总指向调用它的对象。
    //（全局很少使用,大部分在函数内部使用。)
    //【this指向】
    //根据运行时的不同,this指向的对象有所区别。
    //在绝大多数情况下,函数的调用方式决定了this的值。
    //浏览器环境/全局环境下使用this: this指向window对象。
    console.log( this ); // window
    console.log( this === window ); //true
    //在函数中使用this:
    //不管函数怎么定义,不管函数在哪定义,只看函数的调用(箭头函数除外).

五.Math函数

JS中有许多的内置对象。其中，Math对象封装了许多常用的数学函数。

   //1.内置对象:属于object对象,由js作者提前写好的对象,里面存储了一些属性和方法,直接拿来使用即可。
        //说人话:相当于手机内置应用,如短信、电话。一买来就自带,直接使用。
        //2.Math:数学对象
        // Date:日期对象
        // Function:函数对象
        // RegExp:正则表达式
        // Array:数组对象
        // String: string对象
        // Boolean: boolean对象
        // Number: number对象
        // 1.圆周率
        console.log(Math.PI); //3.141592653589793
        //2.绝对值
        console.log(Math.abs( -2));//2
        //3.找最大值/最小值
        console.log(Math.max ( 10,20,30,40,50));
        //50console.log(Math.min(10,20, 30,40,50));//10
        //4.幂运算:Math.pow(×,y)求x的y次方
        console.log(Math.pow(2,3));//8
        // 5.随机数O-1随机小数
        console.log(Math.random()*100);