作用域与对象

183 阅读4分钟

arguments对象

      arguments是一个类数组的对象,有数组的特性,但它不是一个数组
  例1:
  function add(){
    return arguments [1] + arguments [2]  ==>相当于数组里第二个数和第三个数相加
    }
   add(1,2,8,9)
   console.log( add(1,2,8,9)) //10
   例2:
     function getMax() {
        var max = arguments[0];
        for(var i = 1; i < arguments.length; i++) {
            if(arguments[i] > max) {
                max = arguments[i]
            }
        }
        return max;
    }
    console.log(getMax(1, 2, 30, 4, 5))

函数

1-函数和函数之间可以进行相互调用

例1:   
function hs1(){
    alert (80)
}
function hs2(){
    alert(90)
     hs1()
}
// hs1()
hs2()
例2: 
function years(year){
    if(year % 4 ==0 && year % 100 != 0 || year % 400 == 0){
        return true
    }else{ 
        return false
    }
}
function years2(){
  var year = Number( prompt("输入今年的年份:"));
    if(years(year)){
       alert ("今年是闰年")
    }else{
        alert("今年不是闰年")
    }
}
years2()

2-函数声明方式

  1.函数声明式
    function fn() {}
  2.函数表达式
    var fn = function() {}
  3.
    var fn = new Function()

js作用域

1-作用域介绍

  整个script标签或者单独的js文件
    var a = 1;  //作用于整个script标签或者单独的js文件
    
    function fn() {
        var b = 1; // 局部作用域,b只能在fn中进行访问!!!
        console.log(b)
    }
    console.log(b) // 不能打印b值,b是一个局部作用域中的内容
    
    注意:js中只有全局作用域和函数作用域没有别的!!!!
    如:
    if(true) {
        // 如果num只能在{}中进行使用,那么js就是有块级作用域!!!
        // 但是num不仅仅可以再{}中使用,它是一个全局变量,因此js中没有块级作用域
        var num = 10; // num 是一个全局作用域还是什么!!!
    }
    console.log(num)

2-js中的作用域链

 遵循就近原则
 例1:
 function f1() {
        var num = 123;
        function f2() {
            var num = 0;
            console.log(num) //0
        }
        f2() 
    }
    f1() 
    例2:
    var a = 1;
    function fn1() {
        var a = 2;
        var b = 22;
        fn2();
        function fn2() {
            var a = 3;
            fn3();
            function fn3() {
                var a = 4;
                console.log(a) // 4
                console.log(b) // 22
            }
        }
    }
    fn1()

js作用域

1-作用域介绍

例1:
console.log(num); // undefined
    var num = 10;
     按照正常思路来说,console.log(num),此时num没有定义!!!
     是因为js引擎在处理代码时,是需要先进行预编译!!!
     先进行预编译在执行代码!!!
     
     把上方这个案例转换一下
     1.编译
     var num;
     2.执行 
     console.log(num)  num = 10;
例2:
     fun() // 222
     var fun = function() {
         console.log("222")
     }
     1 编译 
     var fun  
     2.执行阶段 
     fun()  fun = function()
     
      js引擎运行js代码的时候分为两个步骤: 预解析  代码执行
     1.预解析 js引擎会把js里面的var还有function函数提升到作用域的最前面。
     2.代码执行 从上到下顺序执行
     提升: 变量的提升和函数的提升!!!
     
例3:
   var num = 10;
     fun(); // undefined
      function fun() {
          var num;
          console.log(num)
          // 变量提升是提升到当前的作用域的最前面!!!
          num = 20;
       }
例4:
 var num = 10;
    function fn() {
        console.log(num) // undefined
        var num = 20;
        console.log(num) // 20
    }
    fn(); 
例5:
 var a = 18;
    f1();
    function f1() {
        var b = 9;
        console.log(a) // undefined
        console.log(b) // 9
        var a = "123"
    } 
例6:
 f1()
   // console.log(a) //js是单线程语言,一旦出错,下面的代码不再执行!!!
    console.log(b) // 9
    console.log(c) // 9
    function f1() {
        var a = b = c =9;
        // 相当于 c = 9; b = c; var a = b
        console.log(a) // 9
        console.log(b) // 9
        console.log(c) // 9
    }
    
  注意:着重强调,如果函数中没有使用var定义变量,外部也没有这个变量,则这个变量为全局变量
    function demo() {
        // 这个num就被定义成了全局变量
        num = 5;
    }
    demo();
    console.log(num)

对象

1-创建对象方式1

 //表达对象的属性和方法!!! key:value
    var zhangsan = {
        name: "zhangsan",
        sex: "man",
        age: 18,
        sayHell: function() {
            alert("大家好!!!")
        }
    }
    
   // 如果要访问属性和方法那么使用.
    console.log(zhangsan.name)
    console.log(zhangsan.sayHell)
    访问属性和方法时可以使用另外一种方式
    zhangsan['sayHell']()
    zhangsan['name']

2-创建对象方式2

    var obj = new Object();
    obj.name = "lisi";
    obj.sex = "man"
    obj.sayHi = function() {
        alert("大家好!!!")
    }
    
    console.log(obj.name)

3-创建对象方式3

 第一个:
  function createObj(name, sex) {
        var obj = {}
        obj.name = name;
        obj.sex = sex;
        obj.sayHello = function() {
            alert("sayHello")
        }
        return  obj
    }
    var obj1 = createObj("zhangsan", "man")
    var obj2 = createObj("lisi", "man")
 第二个:
    function Person(name, sex) {
        this.name = name;
        this.sex = sex;
        this.sayHello = function() {
            alert("大家好!!!")
        }
    }
    var p1 = new Person("zhangsan", "man")
    var p2 = new Person("lisi", "man")
   注意: 一般将不写第一个写第二个

4-对象的遍历

var obj = {
        name: "zhangsan",
        likes: ["运动", "跑步", "唱歌"],
        age: 20
    }
    
    注意: 对象不能使用for来遍历了,可以使用for in
    for(var key in obj) {
        // console.log(obj.key) 这样写是不行的
        // obj.key ==> obj里面有没有key属性
       console.log(key)
        console.log(obj[key])
    }