初识JavaScript

因为之前看过《JavaScript DOM编程艺术》，所以这一片我打算快速过一遍。

---

JavaScript的基本元素是语句。一条语句代表着一条命令，通常以分号结尾。

document.writeln("向HTML文档写入该句子");

函数

//通常函数
function myFuna() {
    document.writeln("This is a statement.");
};

myFuna();

//带有参数的函数
function myFunb(name,weather) {
    document.writeln("Hello " + name + ".");
    document.writeln("It is " + weather + "today");
}

myFunb("Adam","sunny");

//有返回结果的函数
function myFunc(name) {
    return ("Hello " + name + ".");
};

document.writeln(myFunc("Adam"));

变量和类型

定义在函数中的变量称为局部变量，只能在函数中使用。

直接在script元素中定义的变量称为全局变量，可以在任何地方使用，包括其他脚本中。

JavaScript的三种基本类型

• 字符串类型（string）可以用夹在一对双引号或单引号之间的一串字符表示

  var firstString = "This is a string";
  var secondString = 'And so is this'; 

   

• 数值类型（number）整数和浮点数（也称实数）都用number类型表示

  //数值类型不需要说清楚使用的事哪种数值，JS会自行处理
  var daysInWeek = 7;
  var pi = 3.14;
  var hexValue = oxFFFF;

   

• 布尔类型（boolean）布尔类型有两个值，true和false

  var firstBool = true;
  var secondBool = false;

---

 

JavaScript中的对象

//创建一个对象并将其赋给变量myData
var myData = new Object();
//给myData添加name和weather属性，并赋给属性值
myData.name = "Adam";
myData.weather = "sunny";

//使用对象字面量的方法可以直接创建对象
var myData = {
    name: "Adam",
    weather: "sunny"
};

//对象不仅仅可以添加属性，还可以添加函数。
//属于一个对象的函数称之为方法
var myData = {
    name: "Adam",
    weather: "sunny",
    printMessages: function() {
        document.writeln("Hello" + this.name + ".");
        document.writeln("Today is" + this.weather + ".");
    }

}

myData.printMessages();

---

 

使用对象

//读取和修改对象的属性值
var myData = {
    name: "Adam",
    weather: "sunny",
};

//修改对象属性值
myData.name = "Joe";
myData["weather"] = "raining";

//枚举对象的属性
//for...in循环代码块中的语句会对myData对象的每一个属性执行一次
//每一次迭代过程中，所要处理的属性名会被赋给prop变量
for (var prop in myData) {
    document.writeln("Name: " + prop + "Value: " + myData[prop]);
}

//增删属性和方法

//增加一个属性
myData.dayOfWeek = "Monday";

//增加一个方法
myData.sayHello = function() {
    document.writeln("Hello");
};

//删除对象的属性
delete myData.name;
delete myData["weather"];
delete myData.sayHello;

//可以使用 in 判断对象是否具有某个属性
var hasName = "name" in myData; //返回true
var hasDate = "date" in myData; //返回false

---

 

JavaScript运算符

常用的JavaScript运算符

运算符	说明
++，--	前置或后置，表自增和自减
+，-，*，/，%	加，减，乘，除，求余
<，<=，>，>=	小于，小于等于，大于，大于等于
==，!=	相等和不相等
===，!==	等同和不等同
&&，||	逻辑与和逻辑或
=	赋值
+	字符串连接
statement? true:false	三元运算符

相等运算符会将操作数转换为同一类型以判断是否相等，而等同运算符则会判断类型和值是否都相等。 

JavaScript对象的比较是引用的比较。每当新建一个对象，都会生成一个新的地址来存储。对象的比较本质上是存储地址的比较。

 

---

类型转换

//将数值转换为字符串，myData1的值为55
var myData1 = (5).toString() + String(5);
/*
    toString()    以十进制形式表示数值
    
    toString(2)    以二进制，八进制，十六进制形式表示数值
    toString(8)
    toString(16)

    toFixed(n)    以小数点后有n位数字的形式表示实数
    toExponential(n)    以指数表示法表示数值。尾数的小数点前后分别有1位数字n位数字
    toPrecision(n)    用n位有效数字表示数值。在必要情况下使用指数表示法

**/

//将字符串转换为数值
var firstVal = "5";
var secondVal = "5";

var myData2 = Number(firstVal) + Number(secondVal);

/*
    Number(<str>)    通过分析指定字符串，生成一个整数或实数值
    parseInt(<str>)    通过分析指定字符串，生成一个整数值
    parseFloat(<str>)    通过分析指定字符串，生成一个整数或实数值
**/

---

  数组

//创建数组
var myArray = new Array();
myArray[0] = 100;
myArray[1] = "Adam";
myArray[2] = true;

//使用数组字面量创建数组
var myArray = [100,"Array",true];


//读取和修改数组内容
//JavaScript的数组索引值从0开始

//读取指定索引位置的数组元素值
documnet.writeln("Index 0: " + myArray[0]);
//修改数组内容
myArray[0] = "Thesday";

//枚举数组内容
for(var i = 0; i < myArray.length; i++) {
    document.writeln("Index" + i + ": " + myArray[i]);
}

常用的数组方法

方法	说明	返回
concat(<otherArray>)	将数组和参数所指数组的内容合并为一个新数组	数组
join(<separator>)	将所有数组元素连接为一个字符串。各元素内容用参数指定的字符分割	字符串
pop()	把数组当做栈来使用，删除并返回数组的最后一个元素	对象
push(<item>)	把数组当做栈来使用，将指定的数据添加到数组中	void
reverse()	就地反转数组元素的次序	数组
shift()	类似pop，但操作的是数组的第一个元素	对象
slice(<start>,<end>)	返回一个子数组	数组
sort()	就地对数组元素排序	数组
unshift(<item>)	类似push，但新元素被插到数组的开头位置	void

 

---

处理错误

//将可能会引发错误的代码存放在try语句中
//如果没有发生错误，语句会正常运行，catch内语句会被忽略
//如果发生错误，catch内语句立即停止运行，错误会由一个Error对象描述并传递给catch子句
//如果有不管有没有错误都要执行的语句，可以把它放在finally中
try {
    var myArray;
    for (var i = 0; i < myArray.length; i++) {
        document.writeln("Index " + i + ": " + myArray[i]);
    }
} catch (e) {
    document.writeln("Error: " + e);
} finally {
    document.writeln("Statements here are always executed");
}

Error对象

属性	说明	返回
message	对错误条件的说明	字符串
name	错误的名称，默认为Error	字符串
number	该错误的错误代码（如果有的话）	数值

---

undefined和null值

未赋值的变量或读取对象没有的属性时得到的就是undefined值

已经赋值，但该值不是一个有效的object、string、number、或boolean值（也就是说所定义的是一个无值[no value]）就是null。

当使用相等运算符时，undefined与null相等。因为相等运算符只比较值，而不比较类型。

当使用等同运算符时，两者不相等。等同运算符值和类型都会比较。

---