目录
一、JavaScript简介
JavaScript是世界上最流行的语言之一，是一种运行在客户端的脚本语言(Script是脚本的意思)、
脚本语言∶不需要编译，运行过程中由js解释器(js引擎)逐行来进行解释并执行
现在也可以基于Node.js技术进行服务器端编程
浏览器执行JS简介
浏览器分成两部分︰渲染引擎和JS引擎
渲染引擎︰用来解析HTML与CSS，俗称内核，比如chrome浏览器的blink，老版本的webkit
J引擎︰也称为JS解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如chrome浏览
器的V8。
浏览器本身并不会执行JS代码，而是通过内置JavaScript引擎(解释器)来执行JS代码。JS引擎执行
代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以JavaScript语言归为
脚本语言，会逐行解释执行。
1、JavaScript特点
向HTML页面中添加交互行为
脚本语言，语法和Java类似
解释性语言，边执行边解释
2、JavaScript的组成
1、ECMAScript
ECMAScript是由ECMA国际（原欧洲计算机制造商协会)进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为JavaScript或JScript，但实际上后两者是ECMAScript语言的实现和扩展。
ECMAScript : ECMAScript规定了JS的编程语法和基础核心知识，是所有浏览器厂商共同遵守的一套JS语法工业标准。
2、DOM———文档对象模型
文档对象模型( Document Object Model，简称DOM)，是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过DOM提供的接口可以对页面上的各种元素进行操作(大小、位置、颜色等)。
3、BOM——浏览器对象模型
BOM(Browser Object Model，简称BOM)是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等。
JavaScript的执行原理
1、浏览器发送请求（包含JavaScript的请求页面）到服务器
2、浏览器解析HTML标签和JavaScript
3、服务器相应浏览器发送的请求（从服务器端下载含JavaScript的页面）
3、引用JavaScript的方式
1、行内样式
语法：
<input name="btn" type="button" value="弹出消息框"
onclick="javascript:alert('欢迎你');"/>
注意：
1、可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性），如:onclick·注意单双引号的使用:在HTML中我们推荐使用双引号,JS中我们推荐使用单引号
2、可读性差，在html中编写JS大量代码时，不方便阅读;
3、引号易错，引号多层嵌套匹配时，非常容易弄混;
4、特殊情况下使用
2、内嵌式：使用script标签
语法：
<script>
alert ( 'Helloworld~! ' );
</script>
可以将行JS代码写到<script>标签中；内嵌JS是学习时常用的方式
3、外部js文件
语法：
<script src=“js/export.js" type="text/javascript"></script>
1、利于HTML页面代码结构化，把大段JS代码独立到HTML页面之外，既美观，也方便文件级别的复用
2、引用外部JS文件的script标签中间不可以写代码
3、适合于S代码量比较大的情况
二、JavaScript核心语法
1、变量
先声明变量再赋值
var width;
width = 5;
同时声明和赋值变量
var catName= "皮皮";
var x, y, z = 10;
不声明直接赋值，不推荐使用
width = 5;
2、数据类型
| 数据类型 | 说明 |
|
undefined
| var width; 变量width没有初始值，将被赋予值undefined |
| null | 表示一个空值，与undefined值相等 |
| number | var iNum=23; //整数 var iNum=23.0; //浮点数 |
|
boolean
| true和false |
|
string
| 一组被引号（单引号或双引号）括起来的文本 var string1="This is a string"; |
3、typeof运算符
typeof运算符的作用：返回一个用来表示表达式的数据类型的字符串
typeof运算符的返回值如下
undefined：变量被声明后，但未被赋值
string：用单引号或双引号来声明的字符串
boolean：true或false
number：整数或浮点数
object：javascript中的对象、数组和null
4、String对象
String 对象用于处理文本（字符串）
语法：
var str1=“this is a String Object”; //声明方式1
var str2=new String(“熟悉的配方”); //声明方式2
String 对象的常用属性
| 属性值 | 说明 |
| constructor | 对创建i该对象的函数的引用 |
| length | 字符串的长度 |
| prototype | 允许您向对象添加属性和方法 |
String对象的常用方法
| 方法名 | 说明 |
| charAt(index) | 返回在指定位置的字符 |
| indexOf(str，index) | 查找某个指定的字符串在字符串中首次出现的位置 |
| substring(index1，index2) | 返回位于指定索引index1和index2之间的字符串，并且包括索引index1对应的字符，不包括索引index2对应的字符 |
| split(str) | 将字符串分割为字符串数组 |
5、数组
创建数组
语法：
var 数组名称 = new Array(size);
为数组元素赋值
语法：
var fruit= new Array("apple", "orange", " peach","banana");
数组的常用属性和方法
| 类别 | 名称 | 描述 |
| 属性 | length | 设置或返回数组中元素的数目 |
| 方法 | join( ) | 把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔 |
| sort() | 对数组排序 | |
| push() | 向数组末尾添加一个或更多 元素，并返回新的长度 |
6、运算符号
| 类型 | 运算符 |
| 算术运算符 | + - * / % ++ - - |
| 赋值运算符 | = += -= |
| 比较运算符 | > < >= <= == != === !== |
| 逻辑运算符 | && || ! |
7、逻辑控制语句
if条件语句
if（条件）{
js代码;
}else{
js代码;
}switch语句
switch（表达式）{
case 常量1：
js语句
brcak；
case 常量2：
js语句
brcak；
default：
js语句；
}for、while循环
for（初始化;条件;增量）{
js代码;
}
while（）{
js代码;
}for-in语句
var fruit = ["apple","orange","peach","banana"];
for(var i in fruit){
document.write(fruit[i] + "<br/>")
}8、跳转语句
break语法：
<script type="text/javascript">
var i=0;
for(i=0;i<=5;i++){
if(i==3){
break;
}
document.write("这个数字是："+i+"<br/>");
}
</script>
continue语法：
<script type="text/javascript">
var i=0;
for(i=0;i<=5;i++){
if(i==3){
continue;
}
document.write("这个数字是："+i+"<br/>");
}
</script>
9、注释
单行注释：以 // 开始
alert("恭喜你！注册会员成功"); //在页同上弹出注册会员成功的提示框
多行注释：/* 开始，以 */ 结束
/*
使用for循环运行“document.write("<h3>Hello World</h3>");”5次
使用document.write在页面上输出“Hello World”
*/
10、常用的输入/输出
alert()
alert("提示信息");
prompt()
prompt("提示信息", "输入框的默认信息");
prompt("请输入你喜欢的颜色","红色");
prompt("请输入你喜欢的颜色","");
语法约定
1、代码区分大小写
2、变量、对象和函数的名称
3、分号
11、函数
类似于Java中的方法，是完成特定任务的代码语句块
使用更简单：不用定义属于某个类，直接使用
函数分类：系统函数和自定义函数
常用系统函数
parseInt (“字符串”)：将字符串转换为整型数字
如: parseInt ("86")将字符串“86“转换为整型值86
parseFloat(“字符串”)：将字符串转换为浮点型数字
如: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45
isNaN()：用于检查其参数是否是非数字
自定义函数
语法：
function 函数名(参数1.参数2.....){
//JavaScript语句
[return 返回值](可有可无)
}
调用函数
语法：
事件名＝ "函数名( )" ;
12、事件
HTML 事件是发生在 HTML 元素上的事情。
当在 HTML 页面中使用 JavaScript 时， JavaScript 可以触发这些事件。
| 名称 | 说明 |
| onload | 一个页面或一幅图像完成加载 |
| onlick | 鼠标单击某个对象 |
| onmouseover | 鼠标指导移到某元素上 |
| onkeydown | 某个键盘按键被按下 |
| onchange | 域的内容被改变 |
225
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
