成为VIP
一、JavaScript的介绍
JavaScript 是一种运行在客户端的脚本语言，作为web标准的行为层，最初出现时只是为了实现网页端和用户之间的交互。
在正式学习JavaScript之前，我们首先需要对JavaScript的产生和发展历史有一定的了解。
1. JavaScript发展历史
起源阶段：
三足鼎立阶段：
标准化阶段：
1997年，ECMA（欧洲计算机制造商协会）邀请了Netscape、Sun、微软、Borland等公司的一些程序员组成了TC39，最终锤炼出来了ECMA-262，该标准定义了一门全新的脚本语言，名为ECMAScript。
2. JavaScript的组成
二、 JavaScript的使用方式
JavaScript的三种使用方式：和CSS的使用方式类似，JavaScript也可以使用:
三种方式。
1. 行内JavaScript
给标签添加事件属性，在事件的处理函数里，直接写JavaScript代码。
我是一个p
2. 内部JavaScript
在HTML的head标签里添加script,再在script标签里些JavaScript代码。
console.log("hello world");
3. 外部JavaScript
单出编写一个JavaScript文件，在HTML文档的head标签里使用script标签，设置script标签的src属性，引入这个外部的JavaScript文件。
test.JavaScript
console.log("hello world");test.html
注意:给script标签设置了src属性以后，如果再在script标签里编写JavaScript代码，script标签里的JavaScript代码不会被执行。
三、JavaScript基本语句1. JavaScript里的注释
JavaScript里的注释也分为当行注释和多行注释两种:
// 我是一个单行注释/*我是一个多行注释*/
2. JavaScript常见的输入输出语句
alert:警告框
alert("hello world");prompt:文本输入框
prompt("请输入您的银行卡密码:")confirm:确认弹窗
confirm("您确定要退出吗？")document.write:往页面里写入内容
document.write("你好世界");console.log:在控制台里输出内容
console.log("hello world");四、变量1. 变量
和其他常见的编程语言一样，JavaScript里也可以定义变量。
不同于Java语言，JavaScript里在定义变量时，推荐使用 var 来对变量进行声明。
// 使用 var 声明一个变量 name,并同时给 name 变量赋值
var name ="zhangsan";// 使用 var 声明一个变量，但是声明的时候不赋值，声明以后单独赋值
var age;
age = 18;// 不使用var关键字，直接对一个变量赋值(不推荐)
height = 178;// 使用一个var关键字，同时声明多个变量并赋值
var a = 12,b = 23;2. 变量的命名规则与规范
规则：
var x = 3 - 'hello';
console.log(x); // NaN
console.log(typeof(x)); // number关键字:在JavaScript里有特殊含义的单词。
保留字:可能在当前版本的JavaScript中还不是关键字，在以后的发展中，可能会变成关键字的单词
规范:
关键字
关键字：是指 JS本身已经使用了的字，不能再用它们充当变量名、方法名。
包括：break、case、catch、continue、default、delete、do、else、finally、for、function、if、in、instanceof、new、return、switch、this、throw、try、typeof、var、void、while、with 等。
保留字
保留字：实际上就是预留的“关键字”，意思是现在虽然还不是关键字，但是未来可能会成为关键字，同样不能使用它们当变量名或方法名。
包括：boolean、byte、char、class、const、debugger、double、enum、export、extends、fimal、float、goto、implements、import、int、interface、long、mative、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile 等。
注意：如果将保留字用作变量名或函数名，那么除非将来的浏览器实现了该保留字，否则很可能收不到任何错误消息。当浏览器将其实现后，该单词将被看做关键字，如此将出现关键字错误。
五、数据类型
Javascript中的数据类型可以分为简单数据类型和复杂数据类型。简单数据类型一共有以下五个:
1. number类型
不同于Java语言，JavaScript里无论是整数还是浮点数js判断字符串是否包含某个字符，都是number类型。
var a = 12; //十进制的数字a
var b = 017; //八进制的数字17,转换成为十进制是15
var c = 0x1A; // 十六进制的数字1A,转换成为十进制是26
var d = 12.34; // 浮点数在JavaScript里也是number类型在number类型里有一个特殊值NaN(Not a Number),他用来表示执行的结果不是一个数字。
var x = 3 - 'hello';
console.log(x); // NaN
console.log(typeof(x)); // number2. string类型
JavaScript里的字符串类型使用单引号或者双引号包裹，引号内部显示任意文字。
var x = 'hello world';
var y = "hello world";
console.log(x.length) //字符串的length属性可以获取到字符串的长度// 可以使用转义字符 对字符串里的内容进行转义
var a = "tom said \"I'm tom\""
var b = "hello \nworld"3. boolean类型
布尔类型只有两个值，true表示成立正确，false错误不成立。
注意：这里的ture和false全部都是小写
console.log(1 > 2); // false
console.log(2 > 1); // true4. undefined和null类型
undefined类型里就只有一个值undefined;null类型里也只有一个值null,这两个类型的数据都表示的是非正常值。
当一个对象为空时，我们可以使用null来表示，例如DOM查找元素失败的话，结果就是null.
我是一个p标签
var x = document.getElementById('two');console.log(x); // null
undefined常见的出现情况:
var a;
console.log(a); // undefined// 定义了一个函数，这个函数没有返回值
function test(){console.log('haha');
}
x = test();
console.log(x); //执行函数并打印结果，是undefined5. typeof函数的使用
使用typeof函数可以查看一个变量对应的数据类型。
typeof(12); //number
typeof("hello"); //string
typeof(true); //boolean
typeof(undefined); //undefined
typeof(null); // object六、运算符
JavaScript里同样支持各种运算符，但是运算的规则和Java里稍微会有些差异。
1. 算数运算符
console.log(12 + 2); // 14
console.log(12 - 2); // 10
console.log(12 * 3); // 36
console.log(12 / 2); // 6
console.log(12 % 5); // 2不仅数字之间可以使用算数运算，数字和字符串，甚至字符串和字符串之间也支持部分算数运算。
console.log(12 + '34'); // '1234' 数字和字符串做加法运算，会把数字转换成为字符串进行拼接// 数字和字符串之间做除了加法以外的其他算数运算，会先尝试把字符串转换成为数字进行算数运算
// 如果字符串不能转换成为数字，结果会是NaN
console.log(12 - '2'); // 10
console.log(12 - 'ab'); // NaN
console.log(12 * '2'); //24
console.log(12 * 'ab'); //NaN
console.log(12 / '2'); //6
console.log(12 / 'ab'); //NaN2. 赋值运算符
// 等号在编程里被称为赋值运算符，是将等号右边的值赋值给等号左边
// 等号的左边一定不能是常量或者表达式
var a = 2;
a+=3; // 5
a-=3; // 2
a*=4; //8
a/=2; //4
a%=2; //03. 一元运算符
我们常见的运算符一般都是二元运算符，即两个数字参与运算，例如1+2.除了这种运算符以外，还有一种运算符，它只需要一个数字就可以运算，我们称它为一元运算符，最常见的是自增自减运算符。
自增/自减运算符分为 先自增/自减 和 后自增/自减 两种运算符。
var a = 1;
console.log(a++); //1
console.log(a); // 2var b = 1;
console.log(++b); //2
console.log(b); //24. 逻辑运算符
5. 比较运算符
var a = 5;
var b = 6;
console.log(a > b);//大于
console.log(a < b);//小于
console.log(a >= b);//大于等于
console.log(a <= b);//小于等于console.log(a == b); //相等，只比较值，不比较类型
console.log(a === b); //全等，比较类型和值
console.log(a != b); // 不等， 只判断值，不判断类型
console.log(a !== b); // 不全等 判断值，且判断类型字符串的比较：
// 数字和字符串做比较运算，会尝试将字符串转换成为数字
// 如果字符串不能被转换成为数字，做除了 != 和 !== 以外的比较运算外，结果都是false
console.log(5 > '3'); //true
console.log(5 > 'hello'); //false
console.log(5 < 'hello'); //false
console.log(5 != 'hello'); //true
console.log(5 !== 'hello'); //true// 如果是两个字符串做比较运算符，会按照字符串的编码顺序进行比较
console.log('23' > '120'); //true七、数据类型转换
不同的数据类型进行运算的规则不同，为了满足不同的需求，在开发中经常需要让数据在不同的类型之间进行转化。
1. 转换成为数字
（1）Number()
console.log(Number('55'));
Number()可以把任意值转换成数值类型，但是如果字符串中有不是数字的字符，返回NaN（2）parseInt和parseFloat
- parseInt() 把整数或者小数都转化为整数;
- parseFloat() 把整数转化整数,把小数转化为小数
var num1 = parseInt("12"); // 12
var num1 = parseInt("12.3"); //12
var num1 = parseFloat("12"); //12
var num1 = parseFloat("12.3");//12.3var width = '100px';
parseInt(width) => 100（3）正负号(常用)
var str = '500';
console.log(+str); // 取正
console.log(-str); // 取负
console.log(str - 0); +0呢???拼接2. 判断是否是数字
在JavaScript中，NaN用来表示一个非数字的特殊值，当发现无法进行运算时，JavaScript不会报错，而是会返回一个NaN
NaN的注意事项：
typeof(NaN); //numberconsole.log(NaN == NaN); // falseisNaN(123); // false
isNaN('123'); //false
isNaN('hello'); //true3. 转换成为字符串
（1）String()
var num = 5;
num = String(num);
console.log(num);（2）toString()
var num = 5;
console.log(num.toString());// 把数值5变成字符串5
//除了null和undefined,其他类型都有toString()方法（3）拼串，(最常用)
var num = 5;
num = num + "";
console.log(num);4. 转换成布尔类型
所有的值都可以转换成布尔类型，其中0,””,undefined，null，false,NaN这几个值会转换成false，其他值都会转换成true
（1）Boolean()
console.log(Boolean(1));
console.log(Boolean(0));（2）!!
var a = "abc";
console.log(!!a);八、流程控制语句
JavaScript里的流程控制语句也包含条件判断语句和循环语句两种：
1. 条件判断语句
JavaScript里的条件判断语句主要包含if语句，if…else语句，if…else if…else if…else语句和switch…case语句。
var age = parseInt(prompt('请输入您的年龄:'))
if(age > 18) {alert("欢迎来到我的网站");
}var age = parseInt(prompt('请输入您的年龄:'))
if(age > 18) {alert("欢迎来到我的网站");
}else{alert("未成年禁止访问");
}var score = parseInt(prompt('请输入你的成绩:'))if (score = 0) {alert('你个垃圾!')
} else if (60 <= score && score < 80) {alert('一般般')
} else if (80 <= score && score <= 100) {alert('真棒！')
} else {alert('输入的数字不合法')
}var operation = prompt('请输入你的操作序号:')
switch(operation){case '1':console.log('添加用户');break;case '2':console.log('查询用户');break;case '3':console.log('删除用户');break;case '4':console.log('修改用户')break;case '5':console.console.log('退出');break;default:console.log('输入的不合法');break;
}var num1 = parseFloat(prompt('请输入一个数字:'))
var num2 = parseFloat(prompt('请再输入一个数字:'))
var max = num1 > num2 ? num1:num2;
console.log(max);注意事项:
JavaScript里判断区间不允许类似于12这样的书写方式js判断字符串是否包含某个字符，如果想要实现这种功能，请使用逻辑与运算符 && 连接。例如12 < a < 20应该写成12 < a && a < 20.
2. 循环语句
JavaScript里循环语句包括while循环,do…while循环和for循环。
var i = 0;
while(i < 10){console.log(i);i++;
}do{console.log('你好'); //先执行一次do里的代码，然后再判断条件
}while(1 > 2);for(i = 0;i <10;i++) {console.log(i);
}nums = [1,2,3,4,5]
for(var i in nums){console.log(i);
}九、数组和对象
和Java类似，在JavaScript里也有可以存储多个数据的结构。用来存储单个数据的结构在JavaScript里称为数组，和Java里的数组有点儿相像，但同时又有区别。
1. 数组
var nums = [1,2,3,4,5] // 定义一个数组
nums.push(6); // 在数组的最后添加元素
nums.unshift(100); // 在数组的开头添加元素
console.log(nums); // [100, 1, 2, 3, 4, 5, 6]
nums.pop();
console.log(nums); // [100, 1, 2, 3, 4, 5]
console.log(nums.length); //6
console.log(nums[0]); // 100var nums = [6,5,3,1,8,7,2,4];
nums.sort();2. 对象
Java里用来保存无序键值对的数据结构是Map，对应到JavaScript里就是JavaScript的对象。在JavaScript里，对象就是一组无序的键值对组成的集合。对象可以用来存放一组无序的键值对，键对应的值可以是属性，也可以是一个行为(函数)。
var p = {'name':'zhangsan', //对应的value可以是字符串或者数字等'age':18,'addr':'shanghai','sleep':function(){ //value也可以是一个函数console.log(this.name+'正在睡觉');},
}
p.sleep();//zhangsan正在睡觉。 可以直接调用一个对象的函数console.log(p.age); //18 可以使用点语法获取一个对象的属性
console.log(p['name']); //zhangsan 还可以使用中括号语法来获取一个对象的属性。var x = 'addr';
console.log(p.x); // undefined 对象没有x属性，这里的x不会被当做一个变量，会被当做一个属性名
console.log(p[x]); //shanghai限时特惠：本站每日持续更新海量设计资源，一年会员只需29.9元，全站资源免费下载
站长微信：ziyuanshu688
htebazile
