JS复习:基本语法

JavaScript注释

  • 单行注释//
  • 多行注释/**/

ECMAScript中的一切(变量、函数名和操作符)都区分大小写


标识符

什么是标识符

变量、函数、属性的名字、或者函数的参数

标识符的命名规则

  • 由字母、数字、下划线_或美元符号$组成
  • 不能以数字开头
  • 不能使用关键字、保留字等作为标识符

变量

ECMAScript的变量是松散类型,每个变量仅仅是一个用于保存值得占位符而已

松散类型: 可以用来保存任何类型的数据

变量声明

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//先声明,再赋值

var myName;
myName = "logan";

//声明同时赋值

var myName = "logan";

//一次声明多个变量

var myName = "logan",
myAge = 24,
address;

省略var声明的变量是全局变量


JavaScript的数据类型

typeof

  • 功能: 监测变量类型
  • 语法: typeof 变量或者typeof(变量)
  • 返回值: string/number/boolean/object/undefined/function

undefined

undefined类型只有一个值,即特殊的undefined

null

  • null值表示一个空对象指针
  • 如果定义的变量准备在将来用于保存对象,那么最好将变量初始化为null

undefined值是派生自null值的,所以undefined == null的返回结果是true

number

表示整数和浮点数

NaN

即非数值(Not a Number),是一个特殊的数值

  • 任何涉及NaN的操作,都会返回NaN
  • NaN与任何值都不相等,包括NaN本身

isNaN()

  • 语法: isNaN(n) 参数可以是任何类型
  • 功能: 检测参数n是否是“非数值”
  • 返回值: boolean

isNaN()对接收的参数,先尝试转换为数值,再检测是否为非数值

1
2
isNaN("258");   //false
isNaN("a" + 10); //true

数值转换

有三个函数可以把非数值转换为数值

Number()

参数可以是任何类型,强制转换为数值

1
2
3
4
5
Number("16");           //16
typeof(Number("16")); //number

Number("16px"); //NaN
typeof(Number("16px")); //number

parseInt()

用于把字符串转换为整数数值

parseInt()会忽略字符串前的空格

parseInt()会忽略前导的零

parseInt()转换空字符串返回NaN

parseInt()函数提供第二个参数,即转换时使用的基数(即多少进制2-36)

1
2
3
4
5
6
parseInt("28px");       //28
parseInt("28.5px"); //28
parseInt(" 28px"); //28
parseInt("a28px"); //NaN
parseInt(""); //NaN
parseInt("1f",16); //返回 31 (16+15)

parseFloat()

用于把字符串转换为整数或者浮点数数值

parseFloat()第一个小数点有效,直至遇到一个无效的浮点数字符为止
parseFloat()会忽略字符串前的空格

parseFloat()会忽略前导的零

parseFloat()转换空字符串返回NaN

1
2
3
4
5
6
parseFloat("28px");       //28
parseFloat("28.5px"); //28.5
parseFloat("28.5.2px"); //28.5
parseFloat(" 28px"); //28
parseFloat("a28px"); //NaN
parseFloat(""); //NaN

string

string类型用于表示由零个或者多个16位Unicode字符组成的字符序列,即字符串,字符串可以由双引号""或者单引号''表示

字符串转换

toString()

x.toString() 无法转换nullundefined

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
//数组
var array = ["CodePlayer", true, 12, -5];
array.toString(); // CodePlayer,true,12,-5
// 日期
var date = new Date();
date.toString(); // Wed Sep 13 2017 22:07:48 GMT+0800 (中国标准时间)
// 数字
var num = 15.26540;
num.toString(); // 15.2654
// 布尔
var bool = true;
bool.toString(); // true
// Object
var obj = {name: "张三", age: 18};
obj.toString(); // [object Object]
// HTML DOM 节点
var eles = document.getElementsByTagName("body");
eles.toString(); // [object NodeList]
eles[0].toString(); // [object HTMLBodyElement]

String()

String()能够将任何类型的值转换为字符串,在不知道要转换的值是不是nullundefined的情况下,可以使用String()

1
2
3
4
5
6
7
8
9
10
11
12
// 数字
var a=123;
String(a); //123
//布尔值
var b=true;
String(b); //true
//undefined
var c;
String(c); //undefined
//null
var d=null;
String(d); //null

boolean

用于表示真假的类型,true表示真,false表示假

布尔型转换

Boolean()

  • 除0之外的所有数字,转换为布尔型都为true
  • ""空字符串之外的所有字符串,转换为布尔型都为true
  • nullundefined转换为布尔型都为false
1
2
3
4
5
6
7
Boolean(0);            //false
Boolean(5); //true
Boolean(""); //false
Boolean("abc"); //true
Boolean(null); //false
Boolean(undefined); //false
Boolean(NaN); //false

表达式

将同类型的数据(如常量、变量、函数等),用运算符号按一定的规则连接起来的、有意义的式子称为表达式

操作符

算数操作符

  • +
  • -
  • *
  • /
  • % 取余
  • ++aa++ 递增

    ++a返回递增之后的a的值

    a++先返回a的原值,再返回递增之后的值

  • --aa-- 递减,与递增同理

    1
    2
    3
    4
    5
    6
    var x1 = 20,
    x2 = 30,
    x3 = --x1 + x2--;
    x1; //19
    x2; //29
    x3; //19+30 49

赋值操作符

  • =
  • +=
  • -=
  • *=
  • /=
  • %=
1
2
3
4
5
6
7
8
9
var a = 10;
a += 5; //15
a -= 1; //14
a *= 2; //24
a /= 4; //6
a %= 5; //1

var b = "hello ";
b += "world"; //hello world

比较操作符

  • >
  • <
  • >=
  • <=
  • ==
  • ===
  • !=
  • !==

== 只比较值是否相等

=== 比较值的同时比较数据类型是否相等

!= 只比较值是否不相等

=== 比较值的同时比较数据类型是否不相等

返回值: boolean型

1
2
3
4
5
6
7
8
var a = 15,
b = "15";
a == b; //true
a === b; //false
a != b; //false
a !== b; //true
null == undefined; //true
null === undefined; //false

三元操作符

语法

条件 ? 执行代码1 : 执行代码2

说明

可以代替简单的if语句

如果条件成立,执行代码1,否则执行代码2

逻辑操作符

  • &&

    只要有一个条件不成立,就返回false

    在有一个操作数不是布尔值的情况下,逻辑与&&操作就不一定返回布尔值,此时它遵循以下规则:

    1. 如果第一个操作数隐式类型转换后为true,则依次后推至false的操作数并返回
    2. 如果第一个操作数隐式类型转换后为false,则返回第一个操作数
    3. 如果操作数中有null,则返回null
    4. 如果操作数中有NaN,则返回NaN
    5. 如果操作数中有undefined,则返回undefined
    1
    2
    3
    4
    5
    6
    2 && 3 && "hello";                 //"hello"
    0 && 3 && "hello"; //0
    0 && null && NaN && undefined; //0
    3 && null && NaN && undefined; //null
    3 && NaN && null && undefined; //NaN
    3 && undefined && NaN && null; //undefined
  • ||

    只要有一个条件成立,就返回true

    在有一个操作数不是布尔值的情况下,逻辑或||操作就不一定返回布尔值,此时它遵循以下规则:

    1. 如果第一个操作数隐式类型转换后为true,则返回第一个操作数
    2. 如果第一个操作数隐式类型转换后为false,则依次后推至true的操作数并返回
    3. 如果操作数都是null,则返回null
    4. 如果操作数都是NaN,则返回NaN
    5. 如果操作数都是undefined,则返回undefined
    1
    2
    3
    4
    5
    2 || 3 || "hello";                 //2
    0 || 3 || "hello"; //3
    0 || null || NaN || undefined; //undefined
    0 || undefined || null || NaN; //NaN
    0 || undefined || NaN || null; //null
  • !

    无论操作数是什么类型,逻辑非!都会返回一个布尔值

    !!同时使用两个逻辑非操作符时

    1. 第一个逻辑非操作符会基于操作数返回一个布尔值
    2. 第二个逻辑非操作符则对该布尔值求反
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    !0   //true
    !1 //false
    !"" //true
    !"hello" //false
    !NaN //true
    !null //true
    !undefined //true

    !!"" //false
    !!"hello" //true
文章目录
  1. 1. JavaScript注释
  2. 2. 标识符
  3. 3. 变量
  4. 4. JavaScript的数据类型
    1. 4.1. undefined
    2. 4.2. null
    3. 4.3. number
    4. 4.4. string
    5. 4.5. boolean
  5. 5. 表达式
    1. 5.1. 操作符
|