javascript中变量的概念和各种数据的类型

变量的概念

变量即变化中的量。在javascript中，变量是松散类型的，可以用来保存任何数据类型。

在定义变量时，使用var操作符，后面跟变量名。

var message; //变量未初始化，此时变量保存值：undefined
var message = "hi"; //定义变量时直接初始化，此时变量值为：hi
var i = 0,sum; //可同时声明多个变量，用逗号隔开

变量作用域

局部变量：是在函数内部声明的变量，在函数内部任何地方都是有定义，在函数退出后，会被销毁；

全局变量：拥有全局作用域，在js代码中的任何地方都有定义。

全局变量作用域测试：

var global;
function test_global_variable(){
    global = "global variable!";
    return global;
}
test_global_variable();
alert(global); //弹出global variable!

局部变量作用域测试：

function test_local_variable(){
    alert(local); //弹出undefined。此时变量时存在的，但未被定义。
                  //这种特性被称为“声明提前”。
    var local = "local variable!"; //局部变量
    return local;
}
test_local_variable();
alert(local); //报错：ReferenceError: local is not defined

在函数中，局部变量的优先级高于全局变量，即假如有同名的局部变量和全局变量，那么局部变量会覆盖全局变量。

var variable = "global"; //定义了一个全局变量
function test_variable(){
    var variable="local"; //定义了一个同名的全局变量
    return variable;
}
alert(test_variable()); //弹出：local
alert(variable); //弹出：global

第一个alert是返回函数调用的返回值，即函数内部定义的变量variable，此时它替代了全局作用域中定义的variable的值，显示为“local”；

第二个alert是返回变量variable。由于调用结束后，其内部定义的变量将被销毁，所以第二个弹出语句是返回全局变量。全局变量并未被改变，所以显示为“global”。新建一个前端学习qun438905713，在群里大多数都是零基础学习者，大家相互帮助，相互解答，并且还准备很多学习资料，欢迎零基础的小伙伴来一起交流。

执行环境及作用域链

执行环境定义了变量或函数有权访问的其他数据，决定了它们各自的行为。某个执行环境中的所有代码执行完毕后，该环境被销毁，保存在其中的所有变量和函数也随之销毁（全局执行环境直到关闭页面时才会销毁）。全局执行环境是最外围的执行环境，在Web浏览器中，全局执行环境被认为是window对象。

每一段js代码（全局代码或函数）都有一个与之关联的作用域链。这个作用域链是一个对象列表，定义了这段代码“作用域中”的变量。

当js需要查找变量x的值时，它会从链中第一个对象开始查找，如果这个对象有名为x的属性，则会直接使用这个属性的值，如果没有，js会继续查找下一个对象，以此类推。如果整个作用域链上没有任何一个对象含有x，那么称这段代码的作用域链上不存在x，并抛出异常。

function test_chain(){
    var x = 1;
    function f(){
        var y = 3;
        var sum = 0;
        sum = y + x;
        return sum;
    }
    return f();
}
alert(test_chain()); //弹出4

针对这个例子，来讲讲刚才提到的作用域链。

首先，要引用变量x的地方是函数f，所以，js会先在函数f中寻找变量x，很显然，函数f中，并没有定义变量x，这时，js便会向上查找（这里是指包含函数f的函数test_chain）,在test_chain中有定义x的值，最终js变引用test_chain中定义的变量x的值1。取到x的值，再与y（3）相加，便得到sum的值：4。

通过这个例子可以很明白的看出，js就是这样一层层向外查找变量，直到最外层。

数据类型概念

javascript中的类型可以分为简单数据类型（基本数据类型）和复杂数据类型（引用类型）。与基本数据类型不同的是，引用类型的值是按引用访问的。

基本数据类型：undefined，null，boolean，number，string

引用类型：object

判断数据类型

typeof是专门用于判断数据类型的操作符，它返回一个字符串来表示操作数的数据类型。

typeof x;
typeof(x);

typeof操作后有如下返回值：

• "undefined"——该值未定义；
• "boolean"——该值是布尔值；
• "string"——该值是字符串；
• "number"——该值是数值；
• "object"——该值是对象或者null；
• "function"——该值是函数。

var message = 'hello',
number = 123,
isTrue = true;
alert(typeof message); //string
alert(typeof number); //number
alert(typeof isTrue); //boolean

基本数据类型和对象类型的区别

1. 基本类型是不可改变的，对象是可修改的。

这里的基本类型不可改变对数字和布尔值来说很好理解。对于字符串而言，每次改变，其实都是创建了一个新的字符串去替代原先的值。

var s = "hello!";
alert(s.toUpperCase()); //HELLO!
alert(s); //hello!

这里，对字符串s进行操作，并为改变字符串s,它的值仍是小写的hello。

再来看一个例子：

var lang = "java";
lang = lang + "script";
alert(lang); //javascript

从这个例子来看，好像是改变了变量lang，但其实不是这样的。

这个操作的实现过程是这样的：首先创建了一个能容纳10个字符的新字符串，然后在这个字符串中填充java和script，最后一步是销毁原来的字符串java和script。新创建的字符串替代了原先的字符串。新建一个前端学习qun438905713，在群里大多数都是零基础学习者，大家相互帮助，相互解答，并且还准备很多学习资料，欢迎零基础的小伙伴来一起交流。

而对象是修改的，可以看这个例子：

var o = {x:1}
alert(o.x); //此时x值未被修改，为1
o.x = 3;
alert(o.x); //x值被修改，为3
o.y = 2;
alert(o.y); //创建新的属性y，值为2

2. 基本类型的比较是比较值本身，只有在它们的值相等时，它们才相等；对象的比较是引用的比较，当且仅当它们是基于同一个对象时，他们才相等。

var o = {x:1},p = {x:1};
var q = o;
alert(o === p); //false
alert(o === q); //true
q.x = 2;
alert(q.x); //2
alert(o.x); //2
var x = 1,y = 1;
var z = x;
alert(x === y); //true
alert(x === z); //true
z = 2;
alert(z); //2
alert(x); //1

看这个例子：

对象o和对象p，他们拥有相同的属性x，并且x值相等，但他们却是不相同的。定义一个变量q，将o的引用赋给它，q和o却是等价的。因为q是对o的一个引用。它们指向的是同一个对象。所以，当q改变了x的值，对象o中x的值也会跟随着改变。

由此可见，将对象赋给一个变量只是赋值的引用值，对象本身并没有被复制一次。如果想要得到一个对象的副本，必须显示的复制对象中的每个属性。

再来看，变量x和变量y同时赋值1，所以他们是相等的。再定义一个变量z，将x值赋给它，所以它和x也是相等的。当改变了z的值，并不会改变x的值，它们是独立的个体。

3. 引用类型的值，可以动态的为其添加、改变或删除属性和方法，基本类型则不行

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

以上代码为新创建的对象添加了 name 属性，如果对象不被销毁或者这个属性不被删除，则这个属性将一直存在

但是，我们不能给基本类型的值添加属性，虽然不会导致任何错误，但在访问属性时，属性则不存在。以下例子则说明了这点：

var name = "Jack";
name.age = 27;
alert(name.age); // undefined