您的位置:首页 > Web前端 > JavaScript

JavaScript基础(2)——JavaScript的数据类型

2017-12-10 19:20 330 查看

一、JavaScript中的变量

    注:JavaScript是一种弱类型的脚本语言!!!(我对“弱类型”的理解:给变量赋值时,值的类型就是变量的类型即根据赋值决定变量数据类型)

    在编程语言中,一般固定值(常量)称为字面量。

    在编程语言中,变量用于存储数据值。变量可以通过变量名访问。在指令式语言中,变量通常是可变的。字面量是一个恒定的值。JavaScript 使用关键字var 来定义变量, 使用等号来为变量赋值。

(1) 变量声明:

    使用var声明,如:var c = 3;(变量c的类型就是整数类型)      var flag = true;(变量flag的类型就是布尔类型)

(2)命名规则:

    ❤ 开头只能是:①字母    ②下划线"_"    ③美元符"$"   之一

    ❤后续的字符可以是字母、数字、下划线或美元符(数字是不允许作为首字符出现的,以便 JavaScript 可以轻易区分开关键字和数字)。

    ❤长度:<=255个字符

    ❤不允许用空格

    ❤不能用脚本语言中保留字及保留符号作为变量名

    ❤区分大小写

(3)变量的作用范围:

    ❤全局变量:

         ▶方法外部声明。

         ▶方法内部声明,不加var关键字(方法要先执行一遍,变量才有效)。

    ❤局部变量:

         ▶方法内部使用var声明的变量(方法内部有效)。

二、JavaScript中的数据类型

(1)基本数据类型

       
4000
Number:数字即整数、小数(最高精度为17位小数)

                               NaN(not a number)

                               Infinity(正无穷)

                               -Infinity(负无穷)

        ❤ Booleanfalse、true

        ❤ String:" " ' '

        ❤ Undifined:其值只有一个:undifined(表示变量声明了而未被赋值)

        ❤ null:空值(typeof null表示一个空对象的引用,返回Object)

     可以使用
typeof
操作符来判断数据类型

     例:a = parseInt("a12b");      typeof a 为Nan

             b =parseInt("12ab");       typeof b为Number,b=12

     注:

       ①基本类型值是指简单的数据段,5种基本类型是按值访问的,因为可以操作保存在变量中的实际值, 示例:

  var a = 10;

  var b = a;  //b获取的是a值得一份拷贝,虽然,两个变量的值相等,但是两个变量保存了两个不同的基本数据类型值。

  b = 20;

  console.log(a);  // a=10,a的值不会随b的改变而改变

       ②基本类型的值在内存中占据固定大小的空间,被保存在栈内存中。从一个变量向另一个变量复制基本类型的值,会创建这个值的一个副本。

          上例的内存演示:

             


       ③不能给基本类型的值添加属性

(2)引用类型(保存在堆内存中的对象)

      Object类型:包括对象、数组、Function、RegExp、Date

      举例:var obj = { }          var arr = [1,2,3,4,5]          var dates = new Date( );

在数组操作中,最值得注意的是下标的使用,容易出错,数组有四种方式:

var arr1 = new Array('a', 'b', 'c');    //这是一个预定义的数组,在创建时初始化
var arr2 = ['a', 'b',' 'c' ];       //同样是在创建时初始化,但是这种创建更为边界直观
var arr3 = new Array( );   var arr4 = [ ];     //这两种是创建空的数组


对象的创建,一般推荐使用

var perple = {name : 'Tom', age : 21 , eat : function(){  }    }


也可先创建对象再追加属性和方法

var people = new Ojbect();
people.name = 'Tom';
people.age = 21;
people.eat = function(){  }


内存分析:

     不同于其他语言,不能直接访问堆内存空间中的位置和操作堆内存空间,只能操作对象在栈内存中的引用地址,所以,引用类型数据在栈内存只是保存其堆内存的引用地址,通过这个引用地址才能快速找到堆内存中的对象。示例:

        var obj1 = new Object();

  var obj2 = obj1;

  obj2.name = "我有名字了";

  console.log(obj1.name); // 我有名字了

  说明这两个引用数据类型指向了同一个堆内存对象。obj1赋值给obj2,实际上这个堆内存对象在栈内存的引用地址复制了一份给了obj2,

  但是实际上他们共同指向了同一个堆内存对象。实际上改变的是堆内存对象。

  下面我们来演示这个引用数据类型赋值过程:



三、基本数据类型与引用类型区别

  a. 声明变量时不同的内存分配: 

  1)原始值:存储在栈(stack)中的简单数据段,也就是说,它们的值直接存储在变量访问的位置

    这是因为这些原始类型占据的空间是固定的,所以可将他们存储在较小的内存区域 – 栈中。这样存储便于迅速查寻变量的值。

  2)引用值:存储在堆(heap)中的对象,也就是说,存储在变量处的值是一个指针(point),指向存储对象的内存地址。

     这是因为:引用值的大小会改变,所以不能把它放在栈中,否则会降低变量查寻的速度。相反,放在变量的栈空间中的值是该对象存储在堆中的地址。

     地址的大小是固定的,所以把它存储在栈中对变量性能无任何负面影响。

  b. 不同的内存分配机制也带来了不同的访问机制

  1)原始值::可以直接访问到的。
        2)引用值:在javascript中是不允许直接访问保存在堆内存中的对象的,所以在访问一个对象时,
    首先得到的是这个对象在堆内存中的地址,然后再按照这个地址去获得这个对象中的值,这就是传说中的按引用访问
  

  
  c. 复制变量时的不同
  
  1)原始值:在将一个保存着原始值的变量复制给另一个变量时,会将原始值的副本赋值给新变量,此后这两个变量是完全独立的,他们只是拥有相同的value而已。
  2)引用值:在将一个保存着对象内存地址的变量复制给另一个变量时,会把这个内存地址赋值给新变量,
    也就是说这两个变量都指向了堆内存中的同一个对象,他们中任何一个作出的改变都会反映在另一个身上。
    (这里要理解的一点就是,复制对象时并不会在堆内存中新生成一个一模一样的对象,只是多了一个保存指向这个对象指针的变量罢了)。
 

  d. 参数传递的不同([b]把实参复制给形参的过程)[/b]
  首先我们应该明确一点:ECMAScript中所有函数的参数都是按值来传递的。
  但是为什么涉及到原始类型与引用类型的值时仍然有区别呢?还不就是因为内存分配时的差别。  
  1)原始值:只是把变量里的值传递给参数,之后参数和这个变量互不影响。
  2)引用值:对象变量它里面的值是这个对象在堆内存中的内存地址,这一点你要时刻铭记在心!
   因此它传递的值也就是这个内存地址,这也就是为什么函数内部对这个参数的修改会体现在外部的原因了,因为它们都指向同一个对象。

四、对象的属性和方法

    JavaScript 中,几乎所有事物都是对象:字符串、数字、数组、日期,等等。对象是拥有属性和方法的数据。

1.使用字符来定义和创建JavaScript对象属性

可以说“JavaScript对象是变量的容器”! 但一般我们认为“JavaScript对象是键值对的容器”。 键值对在Javascript对象通常称为对象属性

实例:

var person = {firstName:"Judy", lastName:"Smith", age:24};
或者跨越多行:
var person = {
firstName:"Judy",
lastName:"Smith",
age:24
};

2.访问JavaScript对象属性

两种方式的实例:

person.firstName;
person["lastName"];


3.对象的方法创建和调用

    对象的方法定义了一个函数,并作为对象的属性存储。

    可以使用以下语法创建对象方法:方法名:function() { 方法体 }

    可以使用以下语法访问对象方法:对象名.方法名();

创建对象实例:

var person = {
name:"Joe",
sex:"male",
speak:function() {
if(sex == "male") {
alert("I am a boy");
}else if(sex == "female") {
alert("I am a girl");
}
}
}
person.speak();

构造函数构造对象实例:
function Person(name,sex)  {
this.name = name;
this.sex = sex;
this.speak = function() {
if(sex == "male") {
alert("I am a girl");
}else if(sex == "female") {
alert("I am a boy");
}; //注意这里必须有且是分号
}
}
var person = new Person("Joe","male");
person.speak();


JavaScript == 与 === 区别

1、对于 string、number 等基础类型,== 和 === 是有区别的

a)不同类型间比较,== 之比较 "转化成同一类型后的值" 看 "值" 是否相等,=== 如果类型不同,其结果就是不等。
b)同类型比较,直接进行 "值" 比较,两者结果一样。
2、对于 Array,Object 等高级类型,== 和 === 是没有区别的

进行 "指针地址" 比较

3、基础类型与高级类型,== 和 === 是有区别的

a)对于 ==,将高级转化为基础类型,进行 "值" 比较
b)因为类型不同,=== 结果为 false
4、!= 为 == 的非运算,!== 为 === 的非运算

  补充一下:

    JavaScript的运算符、控制语句和Java的大致相同:

     与Java的比较运算符”==“不同的是:js数据自动转换机制

例如:下列三个都进行数据转换,但

           true==1(✔)只比较值;

           true===1(✘)先比较值,再比较数据类型;(‘===’是绝对相等,即数据类型与值都必须相等。)

           true=="1"(✔)只比较值;

不要创建 String 对象。它会拖慢执行速度,并可能产生其他副作用,如:

         var x = "John";             

         var y = new String("John");

         (x === y) // 结果为 false,因为 x 是字符串,y 是对象
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: