暴打javascript语法之变量详解

变量讨论

全局与局部

当我们在讨论一个变量的时候，最重要的就是对这个变量进行声明，声明它到底是全局，还是局部，那么我们这么讨论其实也就是对变量的作用域进行讨论，这里给出这两者的作用和区别：

全局变量(global variable)，该变量可以在脚本任何位置被引用，包括有关函数的内部引用，它的作用域是整个脚本

局部变量(global variable)，该变量只存在对它作出声明的函数内部，它的作用域仅限于某个特定函数

这样在某一个函数，我们可以既使用全局变量，也可以使用局部变量，这个时候可能会引起一些问题，比如说想使用局部变量，但是不小心用了全局变量的名字，这个时候javascript也会认为是在引用全局变量

解决方法：
如果在某个函数中使用了"var",那么这个变量将被视为一个局部变量🍔，并且它只存在于这个函数的上下文中，反之，如果说没有使用"var"的话，那么这个变量就会被视为一个全局变量，举个小栗子：

如果说我想要num的值变成2：

function add(num){
    total = num+num;
    return total;
}
var total = 4;
var num = add(1);
alert(total);

那么这段代码不用说，肯定会不可避免的引起全局变量total的值发生变化，变成2，但是我的本意是利用add()函数计算的结果给num，但是将total的值也改变了，正确的代码：

function add(num){
  var total = num+num;
  return total;
}
//现在全局变量就安全了🍟

基本类型与引用类型

变量除了上述的区别，还有一个更重要的区别就是该变量的类型问题，大致上分为两类：基本类型值和引用类型值🍳基本类型的值大家都懂，现在主要讨论一下引用类型值

🌮引用类型的值是保存在内存中的，这里有一点要注意，在JavaScript中，是不允许直接访问内存中的东西的，也就是不能直接操作对象的内存空间，所以在操作对象的时候，实际上访问的是操作对象的引用而不是实际的对象，往下看再继续了解引用类型吧

动态属性

在定义引用类型的值的时候，我们可以为其添加属性和方法，也可以为其改变和删除其属性和方法：

var person = new Object();
person.name="X monster";
alert(person.name);//"X monster"

如果说对象不被摧毁或者这个属性不被删除，那么这个属性将会一直存在(保存在变量person中)，当然了，基本类型是不能做到这一点的

关于复制问题

🍙基本类型的复制：如果说从一个变量向另一个变量复制基本类型的值，则会在变量对象上创建一个新值，然后将该值复制到为新变量分配的位置上

var num_1 = 1;
var num_2 = num_1;

内存分析：此时，num_1保存的值为5，num_2的值当然也是5，但是num_2的5和num_1的5是完全独立的,可以想象是num_1的一个副本，此后这两者互不影响🍜

🍘但是当从一个变量向另一个变量复制引用类型的值时，虽然说同样也会将存储在变量当中的变量对象的值复制一份到新变量分配的空间中，但是但是🤔这个复制过来的值实际上是一个指针，这个指针指向存储在堆中的一个对象，也就是说，两个变量实际上将引用同一个对象，所以这个时候，改变其中一个变量，就会影响到另一个变量,下面一张图是想将obj1复制到obj2的过程：

好了，吹了那么久的水就是为了引入"传递参数"问题，因为函数的参数和这个的性质非常相似，都是函数外部的值复制给函数内部的参数，就像从一个变量复制到另一个变量一样🧈这里我要提醒一点：那就是访问变量有按值和按引用两种方式，但是参数只能按值传递🍧那么现在也分为两种传递类型：传递的是基本类型或者是引用类型

传递的是基本类型

此时被传递的值会被复制到一个局部变量当中(就是命名参数，也就是我们常见的arguments对象中的一个元素)

传递的是引用类型

如果传递的是引用类型，那么会把这个值在内存中的地址复制给一个局部变量，所以说这个局部变量的变化也会反映在函数的外部

小栗子

function add(num){
   num+=10;
   return num;
}
var count=20;
var result=add(count);
alert(count);//20
alert(result);//30

分析：

可以看到我们定义了一个函数add，然后有两个全局变量，而函数的参数实际上是函数的局部变量，所以说在调用这个函数的时候，变量count作为参数被传递给该函数，这个变量的值是20，20会被复制给函数参数num，在函数的内部，参数num的值被加上10，但是并不会影响到函数外部的count，这就有一中基本类型复制的过程啦🌯，参数num和变量count互不影响、互不认识，只是有相同的值而已，那么现在换一个情况：如果说对用对象的话，情况就会改变

function Name(obj){
    obj.name="X monster";
}
var person = new Object();
Name(person);
alert(person.name);//"X monster"

分析：

结合上述引用类型复制过程的来理解这部分代码，首先以上代码创建了一个对象，并且保存在变量person中，然后这个对象被传递到Name()函数中被复制给了obj，在函数的内部，obj和person其实是引用同一个对象，即使这个对象是按照值传递，但是obj也会按值引用来访问同一个对象当然了，在函数外部person也会有name这一个属性了，那么再来：

function Name(obj){
  obj.name = "X monster";
  obj = new Object();
  obj.name = "Jon";
}
var person = new Object();
Name(person);
alert(person.name);//"X monster"

这段代码在函数内部多了两行，也就是定义了一个新对象，这里值得好好领悟，不做更多的解释🥞

这里我补一个"对象"知识点~~🍦

对象

之前的博客里讲过一个类型就是object类型，它是非常重要的一个类型，对象就是自我包含的数据集合，那么包含在对象里的数据可以通过：属性和方法 进行访问，在JavaScript中，都用“点”语法来访问，JavaScript中对象可以分为三种类型🍿
🍖属性是隶属于某个特定对象的变量
🍗方法是某个特定对象才能调用的函数

创建的方法：new方法
var num = new Number;

内建对象

内建对象非常常见，比如说数组就是JavaScript的内建对象，包括JavaScript本身提供的像Math对象啊，Date对象啊这些🌭

宿主对象

在JavaScript脚本中还有其他的一些已经预先定义好的对象，这个不是由JavaScript语言本身决定而是由它的运行环境提供，具体来说呢就是在应用到web上，环境就是各种不同的web浏览器，由浏览器提供的预定对象被称为"宿主对象"🧂

宿主对象主要包括：Form、Image、Element

有关这一块后续再聊🥓

好喽，今天就聊到这里啦，有任何问题欢迎评论和私信，我们下期再见🍭🍭🍭