ECMAScript 变量、数据类型

1. JavaScript 概述

JavaScript是一种运行在客户端脚本语言(不需要编译,直接执行)。JavaScript的解释器被称为JavaScript引擎,为浏览器的一部分,是广泛用于客户端的脚本语言,它一般是在HTML网页上使用,用来给HTML网页增加动态功能。

JavaScript和HTML、CSS的区别

  • HTML:提供网页的结构,提供网页中的内容

  • CSS: 用来美化网页

  • JavaScript: 可以用来控制网页内容,给网页增加动态的效果

JavaScript 分三个部分

  1. ECMAScript

    JavaScript的核心,描述了语言的基本语法和数据类型,ECMAScript是一套标准,定义了一种语言的标准与语法规范。

  2. DOM---Document Object Model 文档对象模型

    一套操作页面元素的API,DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作。

  3. BOM---Browser Object Model 浏览器对象模型

    一套操作浏览器功能的API,通过BOM可以操作浏览器窗口,比如:弹出框、控制浏览器跳转、获取分辨率等。

2. 变量和注释

变量是计算机内存中存储数据的标识符,使用变量可以方便的获取或者修改内存中的数据。

2.1 变量的命名规范

  1. 规则:必须遵守的,不遵守会报错
    • 由字母、数字、下划线、$符号组成,不能以数字开头
    • 不能是关键字和保留字,例如:for、while。
    • 区分大小写
  2. 规范:建议遵守的,不遵守不会报错
    • 变量名必须有意义
    • 遵守驼峰命名法:首字母小写,后面单词的首字母需要大写。
      • 例如:userName、userPassword

2.2 注释

  • 单行注释

    1
    2
    // 这是一个变量
    var name = 'luffy';
  • 多行注释

    1
    2
    3
    4
    5
    /*
    var age = 18;
    var name = 'zs';
    console.log(name, age);
    */

2.2 变量的定义和操作

  • 使用关键字var定义变量
1
var age;
  • 变量的赋值
1
2
var age;
age = 18;
  • 同时定义多个变量
1
2
3
4
var age, name, sex;
age = 10;
name = 'zs';
sex = 'man';
  • 同时定义多个变量并赋值
1
var age = 10, name = 'zs';

在JS中,每行代码尾部的分号(;)是可以省略不写的。

3. 数据类型

在Javascript中一共有五种简单的数据类型,分别是:NumberStringBooleanUndefinedNull

3.1 Number类型

Number数字类型,可分为整形和浮点型(要定义浮点值,必须包括小数点和小数点后的一位数字,例如:3.5)两种。Number类型取值范围如下:

  • 最小值:Number.MIN_VALUE,这个值为: 5e-324
  • 最大值:Number.MAX_VALUE,这个值为: 1.7976931348623157e+308
  • 无穷大:Number.POSITIVE_INFINITY
  • 无穷小:Number.NEGATIVE_INFINITY

JS中提供了2个方法判断Number是否有效:

  • isFinite(number) : number如果是无穷的返回false,有穷则返回true
  • isNaN(val) : 判断val是否非数字,返回true则表示非数字

3.2 String类型

字符串类型的数据可以使用单引号,也可以使用双引号,例如:

1
2
"hello,world"
'hello,world'
  • 转义符 \

  • 字符串长度

    length 属性用来获取字符串的长度

    1
    2
    var str = '我是蒙奇D路飞';
    console.log(str.length);
  • 字符串拼接

    字符串拼接使用 + 连接

    1
    2
    3
    4
    5
    console.log(11 + 11);
    console.log('hello' + ' world');
    console.log('520' + '1314');
    console.log('11' + 11);
    console.log('male:' + true);
    • 两边只要有一个是字符串,那么 + 就是字符串拼接功能。

    • 两边如果都是数字,那么 + 就是算术功能。

3.3 Boolean类型

Boolean类型的数据使用truefalse来表示,并且区分大小写。

  • 计算机内部存储:true为1,false为0。

3.4 Undefined和Null

如果我们定义了一个没有赋值的变量,变量的默认值就是undefined,对变量初始化之后,它的值就会从undefined变为指定的值。

1
2
3
var temp;
console.log(typeof temp); // undefined
console.log(temp); // undefined

null表示一个空,比如当我们需要释放一个引用对象时,就需要用null来释放

1
2
var arr = new Array(5);  // 只要是new出来的对象都是引用值,所以arr是个引用对象
arr = null; // 释放一个引用对象

4. 类型转换

4.1 转换成字符串类型

  • toString()

    1
    2
    var num = 5;
    console.log(num.toString());
  • String()

    有些值没有toString(),这个时候可以使用String()。比如:undefined和null

  • 拼接字符串方式

    num + “”,当 + 两边一个操作符是字符串类型,一个操作符是其它类型的时候,会先把其它类型转换成字符串再进行字符串拼接,返回字符串。

4.2 转换成数值类型

  • Number()

    Number()可以把任意值转换成数值,如果要转换的字符串中有一个不是数值的字符,返回NaN。

  • parseInt():将字符串转换为整数

    1
    2
    3
    4
    // 返回12,如果第一个字符是数字会解析知道遇到非数字结束
    var num1 = parseInt("12.3abc");
    // 返回NaN,如果第一个字符不是数字或者符号就返回NaN
    var num2 = parseInt("abc123");
  • parseFloat():将字符串转换为浮点数

    parseFloat() 和parseInt() 非常相似,不同之处在与parseFloat()会解析第一个. 遇到第二个.或者非数字结束如果解析的内容里只有整数,解析成整数。

4.3 转换成布尔类型

ECMAScript 提供了Boolean(var)方法.把给定的值强制转换成 Boolean 型:

  • 当要转换的值是至少有一个字符的字符串、非 0 数字或对象时,Boolean() 函数将返回 true。

  • 如果该值是空字符串、数字 0、undefined 或 null,它将返回 false。

1
2
3
4
5
6
7
console.log(Boolean(""));             // false - 空字符串
console.log(Boolean("luffy")); // true - 非空字符串
console.log(Boolean(250)); // true - 非零数字
console.log(Boolean(null)); // false - null
console.log(Boolean(0)); // false - 零
var obj= new Object;
console.log(Boolean(obj)); // true - 对象