目录:
- 第1章“JavaScript简介”
- 第2章“数组”
- 第3章“栈”
- 第4章“队列”
- 第5章“链表”
- 第6章“集合”
- 第7章“字典和散列表”
- 第8章“树”
- 第9章“图”
- 第10章“排序和搜索算法”
- 第11章“算法补充知识”
第1章 JavaScript简介
一.JavaScript 基础
1.在HTML中编写JavaScript的两种方式
第一种方式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
alert('Hello, World!');
</script>
</body>
</html>
第二种方式
创建一个JavaScript文件(比如01-HelloWorld.js),
在里面写入如下代码:
alert('Hello, World!');
然后,我们的HTML文件看起来如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<script src="01-HelloWorld.js">
</script>
</body>
</html>
这两个例子,无论执行哪个输出都是一样的。但第二个例子是最佳实践。
作为最佳实践,我们会在关闭body标签前引入
JavaScript代码。
这样浏览器就会在加载脚本之前解析和显示HTML,有利于提升
页面的性能
2.变量
变量保存的数据可以在需要时设置、更新或提取。赋给变量的值都有对应的类型。
JavaScript的类型有数字、字符串、布尔值、函数和对象。还undefined和null,以及数组、日期和正则表达式
var可以声明一个js变量。但是js不是强类型语言,后面在声明相同名称变量的话,会把之前的覆盖也就是更新;
var num=1;
var num=222;
console.log(num);//222
var n;
console.log(n);//undefined
undefined表示变量已被声明,但尚未赋值
3.输出JavaScript值的三种方式:
第一种是
alert('Mytext here'),将输出到浏览器的警示窗口;
第二种是
console.log('My texthere'),将把文本输出到调试工具的Console标签
第三种方式是直接输出到HTML页面里并被浏览器,
通过document.write('My text here')。
console.log("num: " + num)
写法相同
console.log("num: ", num)
4.变量作用域
本地变量和全局变量两种
var myVaribale = 'global';
myOtherVariable = 'global_name';
function myFunction() {
var myVaribale = 'local';
return myVaribale;
}
function myOtherFunction() {
myOtherVariable = 'local_name';
return myOtherVariable;
}
console.log(myVaribale); //global 全局变量
console.log(myFunction()); //local 局部变量
console.log(myOtherVariable); //global_name 全局变量
console.log(myOtherFunction()); //local_name{在myOtherFunction函数里,因为没有使用var关键字修饰,所以这里引用的是全局变量
console.log(myOtherVariable); //{local_name 因为在函数myOtherFunction里修改了myOtherVariable的值
过在JavaScript里应该尽量少用全局变量,这是对的。通常,代码质量可以用全局变量和函数的数量来考量(数量越多越糟)。因此,尽可能避免使用全局变量
5.操作符
在JavaScript里有:
- 算数操作符、
- 赋值操作符、
- 比较操作符、
- 逻辑操作符、
- 位操作符、
- 一元操作符
- 其他操作符
算数操作符
赋值操作符
比较操作符
逻辑操作符
位操作符
console.log('5 & 1:', (5 & 1));//5 & 1: 1二进制与运算
console.log('5 | 1:', (5 | 1));//5 | 1: 5二进制或运算
console.log('~ 5:', (~5));//~ 5: -6二进制非运算
console.log('5 ^ 1:', (5 ^ 1));//5 ^ 1: 4二进制异或运算
console.log('5 << 1:', (5 << 1));//5 << 1: 10左移
console.log('5 >> 1:', (5 >> 1));//5 >> 1: 2右移
console.log('~ 2:', (~2));
(~)非运算:先把数字转化为二进制(8位),取反(补码)
转化规则:第一位不动是符号位
把补码-1得到的8位除了第一位符号位不动;其他都取反,得到的就是反码
typeof操作符可以返回变量或表达式的类型
JavaScript还支持delete操作符,可以删除对象里的属性:
var myObj = {name: 'John', age: 21};
delete myObj.age;
console.log(myObj); // 输出对象{name: "John"}
6.真值和假值
7.相等操作符(==和===)
使用==时,不同类型的值也可以被看作相等
- 如果x和y是相同类型,JavaScript会比较它们的值或对象值。其他没有列在这个表格中的情况都会返回false。
- toNumber和toPrimitive方法是内部的,并根据以下表格对其进行估值。
console.log(undefined==null);//true
console.log(null==0);//false
===操作符:简单多了。
如果比较的两个值类型不同,比较的结果就是false
console.log('packt' === true); //false
console.log('packt' === 'packt'); //true
var person1 = {name:'John'};
var person2 = {name:'John'};
console.log(person1 === person2); //false,不同的对象
### 二.控制结构
1.条件语句
if...else条件语句
var num = 0;
if (num === 1) {
console.log("num is equal to 1");
} else {
console.log("num is not equal to 1, the value of num is " +num);
//num is not equal to 1, the value of num is 0
}
条件判断中使用三元运算
var num=1;
if((num === 1)?num--:num++){
console.log(num);//0
}
多脚本
var month = 5;
if (month === 1) {
console.log("January");
} else if (month === 2){
console.log("February");
} else if (month === 3){
console.log("March");
} else {
console.log("Month is not January, February or March");
}
switch
(要和不同的值进行比较的时候使用更好)
var month = 5;
switch(month) {
case 1:
console.log("January");
break;
case 2:
console.log("February");
break;
case 3:
console.log("March");
break;
default:
console.log("Month is not January, February or March");
}
对于switch语句来说,case和break关键字的用法很重要。
default关键字,在表达式不匹配前面任何一种情形的时候,就执行default中的代码(如果有对应的,就不会执行)
- 循环(在处理数组元素时会经常用到循环)
var i = 0;
while(i<10)
{
console.log(i);
i++;
}
- do…while循环和while循环很相似。区别是在while循环里,先进行条件判断再执行循环体中的代码,而在do…while循环里,是先执行循环体中的代码再判断循环条件。
do…while循环至少会让循环体中的代码执行一次
输出0-9同上的结果
var i = 0;
do {
console.log(i);
i++;
} while (i<10)
三.函数
- 写法:
第一种:没有用到参数或return语句
function sayHello() {
console.log('Hello!alice88');//Hello!alice88
}
//要执行这个函数,只需要这样调用一下:
sayHello();
第二种:传递参数给函数。参数是会被函数使用的变量
function output(text) {
console.log(text);
}
// 我们可以通过以下代码使用该函数:
output('Hello!alice88');//Hello!alice88
第三种:传递任意数量的参数
求和
function sum(num1, num2) {
return num1 + num2;
}
// 这个函数计算了给定两个数字之和,并返回结果。我们可以这样使用:
var result = sum(1,2);
output(result);//3
四.面向对象编程
- JavaScript里的对象就是普通名值对的集合。创建一个普通对象有两种方式。
第一种方式是:var obj = new Object();
第二种方式是:var obj = {};
也可以这样创建一个完整的对象:
obj = {
name: {
first: 'Gandalf',
last: 'the Grey'
},
address: 'Middle Earth'
};
- 在面向对象编程(OOP)中,对象是类的实例。一个类定义了对象的特征。我们会创建很多类来表示算法和数据结构。
例如 声明了一个类来表示书:
function Book(title, pages, isbn){
this.title = title;
this.pages = pages;
this.isbn = isbn;
}
用下面的代码实例化这个类:
var book = new Book('title', 'pag', 'isbn');
然后,我们可以访问和修改对象的属性:
console.log(book.title); //输出书名
book.title = 'new title'; //修改书名
console.log(book.title); //输出新的书名
类可以包含函数。可以声明和使用函数,如下所示:
Book.prototype.printTitle = function(){
console.log(this.title);
};
book.printTitle();
也可以直接在类的定义里声明函数:
function Book(title, pages, isbn){
this.title = title;
this.pages = pages;
this.isbn = isbn;
this.printIsbn = function(){
console.log(this.isbn);
}
}
book.printIsbn();
五.调试工具
Firefox和Chrome都支持调试。这里有一个了解谷歌开发者工具的好教程,地址是
推荐:谷歌开发者工具教程
这里推荐其他几个工具,可以提升编写JavaScript的效率。
Aptana:这是一个开源的免费IDE,支持JavaScript、CSS3和HTML5以及其他语言
(http://www.aptana.com)。
WebStorm:这是一个很强大的IDE,支持最新的Web技术和框架。它不是免费的,但你
可以下载一个30天试用版本体验一下(http://www.jetbrain.com/webstorm)。
Sublime Text:这是一个轻量级的文本编辑器,可以自定义插件。可以买它的许可证来支
持这个工具的开发,也可以免费使用(试用版不过期),http://www.sublimetext.com/。