【前端学习之路】JavaScript语法——变量和语句语法（二）

本文链接：https://blog.youkuaiyun.com/qq_41427568/article/details/103208020

本文上接【前端学习之路】JavaScript语法（一），主要讲解JavaScript中词法规则、数据类型、变量类型、变量特性、保留字和数组等，也就是ECMAScript的内容。

词法规则

标识符是指变量名称和函数名称。对于标识符的命名规则如下：

以字母、下划线_、美元符$开头，后面可以是字母、下划线、美元符$ 、数字(0~9)；
不能使用JavaScript的关键字(keyword)和保留字(reserved word)，这点需要着重注意；
标识符区分大小写

数据类型

基本数据类型

string (字符串类型)
number(数值类型)
boolean(布尔类型，使true或false表示)

特殊数据类型

undefined：没有定义
null：空值(没有赋值)

复杂（引用）数据类型

Object(对象)
Array(也可以看成是对象)
function(也可以看成是对象)

变量类型

字符串（String）

用双引号("")号或单引号(’’)括起来的字符或数值，所以在JavaScript里，字符也是字符串。
例如：var a=‘A’;//字符串
javascript中有一个很重要的特性，那就是自动类型转换：数值、布尔值等其他数据类型可以转换成字符串，javascript的脚本引擎将根据程序上下文自动完成这样的转换。
例如：
var a=100;
var input=“a=”+a;
转化规则：

undefined会转化成“undefined”
null会转化成“null”
布尔值会转化成“true”或者“false”
数字会转化成对应的字符串，NaN表示非数字的值
字符串不会进行转化
对象会转化成对象默认的字符串
例子：

<script language="javascript" type="text/javascript" >
      var a;
      var b=null;
      var c=true;
      var d=123;
      document.write("<h1>"+a+"</h1>");
      document.write("<h1>"+b+"</h1>");
      document.write("<h1>"+c+"</h1>");
      document.write("<h1>"+d+"</h1>");
 </script>

JavaScript中的转义字符
在这里插入图片描述
可以从表中看到，JavaScript的转义字符和C语言的类似。
自动装箱
在需要时，JavaScript集哦自动地把基本数据类型String转化成内置对象String，所以调用String的方法和属性的既可以是String对象，也可以是基本数据类型String。
例：var num=“hello world!”.length;
使用String类声明String对象：
创建String对象语法：new String(s)
例：var str=new String(“hello world”);
String对象属性：

length：字符串包含的字符个数

String对象方法函数：

indexOf(subStr, fromIndex)：从前向后从指定位置fromIndex开始检索字符串subStr，返回字符串subStr在原字符串中，检索到的第一个subStr字符串的第一个字符的索引index，参数fromIndex可以省略
lastIndexOf(subStr, fromindex)：从后向前从指定位置fromIndex开始检索字符串subStr，返回字符串subStr在原字符串中，检索到的第一个subStr字符串的第一个字符的索引index，参数fromIndex可以省略
charAt(index)：返回在指定位置index的字符。
replace(regExp/subStr, replacement)：找到与正则表达式regExp或者字符串substr匹配的子串，替换成replacement
substring(start, stop)：提取字符串中介于两个指定下标start和top之间的字符，stop是可选的参数
split(separator, howmany)：根据分割符separator返回一个字符串对象数组，howmany是可选参数，指定字符串对象数组最大长度
search(regExp/subStr)：用于检索字符串中指定的子字符串subStr，或检索与正则表达式regExp相匹配的子字符串
toUpperCase() ：用于把字符串转换为大写
toLowerCase()：用于把字符串转换为小写
例子：

<html>
<body>
    <script language="javascript" type="text/javascript" >
     var str=new String("hello world world");

     document.write("<h1>"+str.substring(0,5)+"</h1>");
     document.write("<h1>"+str.lastIndexOf("world")+"</h1>");
     document.write("<h1>"+str.indexOf("world")+"</h1>");
     document.write("<h1>"+str.replace("world","lvjia")+"</h1>");
    </script>
  </body>
</html>

结果：
在这里插入图片描述

数字（number）

数字类型包含两种数值，整形和浮点型。
**自动装箱：**数字也有自动装箱，在必要时，JavaScript 会自动地把原始数值转化成对应的内置对象Number 对象，调用 Number 方法的既可以是 Number 对象，也可以是基本数据类型中的数字。
**自动类型转换：**数字和String一样，也有自动类型转换：

undefined会转化成NaN
null会转化成0
布尔值，如果是true，则转化成1，如果是false，则转化成0
数字不发生转换
字符串会转化成整数或者浮点数（取决于字符串的内容）
对象会转化成NaN
使用Number类实例化Number对象
创建Number对象语法：new Number(value)
例：var a=new Number(123);
Number对象主要属性
MAX_VALUE：可表示的最大的数（常量）
MIN_VALUE：可表示的最小的数（常量）
NaN：非法数字值（常量）
Number对象主要方法
toString()：把数字转换成字符串，可以指定格式

boolean类型

基本数据类型：boolean数据类型只有两种可能值。true和false . 布尔值不需要使用引号，所以"false"与false 所表示的值是完全不一样的
**自动装箱：**在必要时，JavaScript 会自动地把原始布尔值转化成 Boolean对象，调用 Boolean方法的既可以是 Boolean对象，也可以是原始基本数据类型中的布尔值
自动类型转换：

undefined转化成False
Null转化成False
布尔值不转化
数字，如果数字等于0或者NaN，则结果是False；负责为true
字符串，如果是空字符串，结果为false，否则为true
对象转换成true

使用Boolean类实例化Boolean对象
创建Boolean对象的语法：new Boolean(true/false)
例：var a =new Boolean(true);
主要对象方法：

toString()：把布尔值转换成字符串，并返回这个字符串

变量特性

变量的声明和赋值

声明：var a;
赋值：a=123;
JavaScript中的变量是动态类型：

自动类型转换
JavaScript变量的类型可以随着值变化
JavaScript变量不申明也可以直接使用

JavaScript对象变量是引用

需要注意的是，JavaScript对象变量是引用，我们可以用下面这个例子证明：

<script type="text/javascript">
  var obj1=new String("hello world");
  var obj2=new String("hello world");
  document.write("<h1>"+(obj1==obj2)+"</h1>");
  document.write("<h1>"+(obj1=="hello world")+"</h1>");
  document.write("<h1>"+(obj1.indexOf("hello world")>=0)+"</h1>");
</script>

结果：
在这里插入图片描述

JavaScript对象可以动态增加成员

例子：

<script type="text/javascript">
     var obj1=new Object();
     var obj2=obj1;
     obj1.msg="hello world";
     document.write("<h1>"+obj2.msg+"</h1>")
 </script>

变量的有效范围

局部变量：使用关键字var声明的变量，有效范围是向外最近的大括号内都有效
全局变量：不使用var申明的变量，整个程序都有效

使用原则：尽量使用局部变量

语句

JavaScript 代码：JavaScript 代码是 JavaScript 语句的序列，一般使用分号分隔

<script type="text/javascript">
document.write("<h1>This is a header</h1>");
document.write("<p>This is a paragraph</p>");
</script>

注释语句

JavaScript 注释：与Java相同

可以添加注释来对 JavaScript 进行解释，或者提高其可读性,单行的注释以 // 开始。
多行注释以 /* 开头，以 */ 结尾。

for in语句

for in语句：遍历数组下标（index）或者对象属性。
格式：

for(var property in expression){
	语句组
}

例子：

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<script type="text/javascript">
		var intArray=new Array(1,"hello",true);
		console.log(intArray);
		for(var index in intArray){
			document.writeln("<h1>"+intArray[index]+"</h1>");
		}
	</script>
</body>
</html>

数组

数组也是一种JavaScript对象

动态数组

长度可以自动动态变化
数组元素类型可以不一致

数组对象的创建

数组有以下四种创建的方法：
var a1=new Array();
var a2=new Array(length); //指定长度
var a3=new Array(e1,e2,…); //枚举数组元素
var a4=[e1,e2,…]; //枚举数组元素(常用)

数组长度

数组长度自动可变：length属性
有效数组下标：0到length-1

数组对象成员方法

toString()：数组转换成字符串，默认间隔符为”,”
valueOf()：数组转换成字符串，默认间隔符为”,”
join()：数组元素组合成字符串，加上默认间隔符为”,”
join(splitStr)：数组元素组合成字符串，加上指定分割符splitStr

创建二维数组

当数组中的每个元素都是一个一维数组的时候，这个数组就是一个二维数组。例子：

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<script type="text/javascript">
		var array=new Array(3);
		array[0]=new Array("cat",1);
		array[1]=new Array("dog",true);
		array[2]=new Array("butterfly",3);
		for(var i in array){
			for(var j in array[i]){
				document.write("<h1>array("+i+","+j+"):"+array[i][j]+"</h1>");
			}
		}
	</script>
</body>
</html>