前端基本功—js 第1天
[if !supportLists]1.1[endif]课程介绍
前6天js的基础语法(变量，表达式，运算符，分支语句，数组，函数，对象)
后7天DOMAPI
后5天js高级
jQuery基本使用及小项目
[if !supportLists]1.2[endif]浏览的介绍
五大浏览器：谷歌火狐IE欧朋safari
国内的浏览器：360，百度，搜狗，猎豹，遨游
[if !supportLists]1.3[endif]浏览器的运行原理
1、User Interface用户界面，我们所看到的浏览器
2、Browser engine浏览器引擎，用来查询和操作渲染引擎
3、Rendering engine用来显示请求的内容，负责解析HTML、CSS
4、Networking网络，负责发送网络请求
5、JavaScript Interpreter(解析者) JavaScript解析器，负责执行JavaScript的代码
6、UI Backend UI后端，用来绘制类似组合框和弹出窗口
7、Data Persistence(持久化)数据持久化，数据存储cookie,HTML5中的sessionStorage
[if !supportLists]1.4[endif]Js的发展历史
1995的时候诞生的liveScript java javascript
微软Jscript在自己的系统 内部的浏览器里面，内置了jscript
1997 js的规范提出了ECMA
2003年之前js的地位很低
2004的时候ajax的出现让js的地位发生了翻天覆地的变化
2007年的时候iphone的出现，让js的市场地位又水涨船高
2010年的时候H5 canvas的实现也需要js
2011年的时候node.js伸向了服务器端
Js的书写位置
行内式写在html标签内
内嵌式写在页面的script标签间
外链式写在一个单独的js文件中，然后引入进来
使用内嵌的话推荐写在html标签的最后
Js的两个网站
http://www.webhek.com/
http://www.codecombat.cn/
Js的组成
ECMA(欧洲计算机制造商协会)规定了js的组成
ECMAScriptjs的基础语法
DOM文档对象模型
BOM浏览对象模型
Js的语言特性
JavaScript是世界上用的最多的脚本语言
脚本语言：不需要编译，只有运行时边解析边执行的语言
JavaScript是一种客户端的脚本语言
JavaScript是一种弱类型的动态语言(动态添加一些属性或是方法)
动态：可以随时动态的给对象添加属性和方法
可以随时的更改数组中的元素
直接量
直接量就是可以拿过来直接使用的数据值。
alert("这是一个弹出框的内容");
变量
变量就是帮助我们往计算机中存储数据用的。
变量的命名规则
命名规则：
变量名必须以字母或下划线“_”或$开头,不能以数字开头
变量可以包含数字(从A至Z的大小字母),下划线或是$
JavaScript严格区分大小写，computer和Computer是两个完全不同的变量
建议：
变量的名称要有意义
变量的命名遵守驼峰命名法，首字母小写,第二个单词的首字母大写
例如：userName
取名的时候，一定不能用系统中的保留字或是关键字
+的作用
varname =prompt("请输入你的姓名");// console.log(name);alert("你好"+name);// +连接字符串和变量
[if !supportLists]1.[endif]连接字符串和变量+两边只要有一边中是字符串，就是连接的作用
[if !supportLists]2.[endif]数学中的运算+两边都是数字的话，则是数学中的运算
转义符
\+一个字符,组成转译字符.一般用于表示特殊符号
常用的转译符:\n(换行) \b(退格) \\ \t(缩进) \”
typeof关键字用来检测变量的数据类型
//js中所有变量的声明都使用一个关键字var// js的特点，是弱类型的动态语言//所谓的弱类型，就是js对变量里面存储的数据类型要求不严格varname ="张三";varage =20;console.log(typeofname);console.log(typeofage);
Js中的数据类型
简单(基本)数据类型：string number boolean undefined null
内存中的栈空间中开辟内存空间
复杂数据类型：对象object Array function Date Regexp
是在内存中的堆空间中开辟内存空间。
变量的重新赋值
// var n1= 20; //变量的值传递// var n2 = n1; //是将自己内存空间中的数据值，复制一份存储到变量当中// console.log(n2);// var n3 = 50;// n3 = 80; //重新赋值为80，会将原来的数据给覆盖掉，内内存空间不变// console.log(n3);varstr ="文字1";str ="文字2";console.log(str);//因为字符串具有不可变性，一旦声明了之后，空间里面的值就不会变了
算术运算符
//就是小学的数学运算+ - * /%算术运算符vara =10;varb =20;varc = a+b;console.log(c);
二元运算符：+ - * / %
一元运算符：++ --
前加与后加的区别：
前加加的时候，是先将自身的值加1,然后拿着新值参与运算，而后加加是先用原值参与运算，而后将自身的值再加1.
优先级：一元运行符的优先级要高于二元运算符
复合赋值运算符
其实就是将算术运算符和赋值运算符(=)进行一个合写
+= -= *= /= %=
关系运算符
就是用来比较两者之间的一个关系
> < >= <= == != === !==
==:判断两者之间是否相等，只是判断的值
===： 是判断两者类型是否一样，再判断值是否相等
关系运算符的结果要用boolean类型来表示。
逻辑运算符
逻辑运算符：&& || !
&&的两边的表达式，如果有一边的表达式为假的话，则整个表达式的结果就是false.
表达式1表达式2表达式1&&表达式2
TrueTrueTrue
TrueFalseFalse
FalseTruefalse
FalseFalsefalse
||如果||的两边有一个是true的话，则整个表达式的结果就是true
表达式1表达式2表达式1||表达式2
TrueTrueTrue
TrueFalseTrue
FalseTrueTrue
FalseFalsefalse
!原来为true！就变为false ,原来 为false的话，则取!之后就变成了true.
表达式！表达式
TrueFalse
Falsetrue
[if !supportLists]1.20[endif]运算符的优先级
优先级从高到底
()优先级最高
一元算术运算符++ -- !
二元算数运算符先* / %后+ -
关系运算符> >= < <=
关系(相等)运算符== != === !==
逻辑运算符先&&后||
赋值运算符=
就是四部分：算术>关系>逻辑>赋值
数据类型转换
将其它的数据类型转换为number
隐式类型转换：+ - * / %
显式(强制)类型转换，使用函数。Number() parseInt() parseFloat()
NaN not a number不是一个数字，是属于number类型，表示数字的一种不正常状态，也就是说本来要转换为number类型的值，没有转换过来。
NaN是number类型not a number不是一个数字或者说是非数字 用来表示数值的一种不正常状态，是一个特殊的值
这个值用来表示一个本来要返回数值的操作数未返回值的情况(这样就不会报错了)
任何涉及NaN的操作都会返回NaN NaN与任何值都不相等，包括自己
isNaN()判断值是否(不是数值),接收值后会尝试将值转换为数值，不能转换为NaN.
强制类型转换之Number()
特点：
a.如果转换的内容可以转成数字，那么就直接返回这个内容对应的数字。
b.如果不可以转换那么返回NaN.
c.如果在内容中出现小数，那么小数会保留。
d.如果内容为空，那么转换成0;
强制数据类型转换之parseInt()的特点：
a.如果转换的内容可以转成数字，那么就直接返回这个内容对应的数字。
b.如果不可以转换那么返回NaN.
c.如果带有小数，那么会去掉小数，而不是四舍五入。
d.如果第一个字符是数字，则继续解析直至字符串解析完毕或者遇到一个非数字符号为止.
强制数据类型转换之parseInt()：
a.特点与parseInt()几乎一样，不同点就是parseFloat()可以转换小数部分
其它数据类型转string
隐式类型转换+””
显式(强制)类型转换.toString()
任何数据值都有toString()方法，但是有特殊的两个是没有toString()方法的，是undefined和null String()
其它数据类型转boolean类型
隐式类型转换!!
显式(强制)类型转换Boolean()
Js中的语言结构
顺序结构
分支结构有条件的执行if if-else
选择结构if else-if switch-case
循环结构while do-while for for-in
If的用法
If(判断条件){一般是boolean类型的值或是关系表达式或是逻辑表达式
要执行的代码;
}
执行过程：
首先代码运行到if处的小括号处，判断条件是否成立，如果条件成立，也就是返回true,则进入大括号里面，执行里面的代码，如果判断条件不成立，也就是返回false,则跳过大括号，执行后面的代码。
If只能判断执行一种情况，如果要判断两种情况，就得用if-else结构
If-esle的用法
if(判断条件){一般是boolean类型的值或是关系表达式或是逻辑表达式
要执行的代码;
}else {
要执行的代码
}
执行过程：
首先代码运行到if处的小括号处，判断条件是否成立，如果条件成立，也就是返回true,则进入大括号里面，执行里面的代码，如果判断条件不成立，也就是返回false,则执行else大括号里面的代码，执行完毕 跳出当前结构。
If else-if结构
if(判断条件){一般是boolean类型的值或是关系表达式或是逻辑表达式
要执行的代码;
}else if(判断条件){
要执行的代码;
}else if(判断条件){
要执行的代码;
}else if(判断条件){
要执行的代码;
}else {
要执行的代码;
}
执行过程：
首先代码运行到if处的小括号处，判断条件是否成立，如果条件成立，也就是返回true,则进入大括号里面，执行里面的代码，如果条件不成立，则依次的进行else if小括号里面，判断条件是否成立，如果成立，也就是返回true,则进入对应的else if里面的大括号，执行里面的代码，如果所有的条件都不成立，也就是返回false，则要看是否有else,如果有，则进入else里面，执行代码，如果没有，则跳出当前结构。
Switch-case结构
Switch(值){变量的值或是数据值
case值1：
要执行的代码;
break;
case值2：
要执行的代码;
break;
case值3：
要执行的代码;
break;
case值4：
要执行的代码;
break;
...
default:
要执行的代码;
break;
}
执行过程：
程序执行到swtich处的小括号，先计算里面的值，拿着计算后的定值，依次和case中的值进行匹配，如果匹配成功，则执行此case里面的代码，执行完毕之后，遇到break,则跳出当前结构，如果匹配都不成功，则要看当前结构当中有没有default,如果有的话，则进入到dafault处执行里面的代码，如果没有，则跳出当前结构，执行后面的代码。
If else-if与switch-case的区别
If else-if多用于区间的判断
switch-case多用于定值的判断
While循环
所谓的循环就是重复的做同一件事情。
while(循环条件){一般是boolean类型的值或是关系表达式或是逻辑表达式
循环体(需要重复执行的代码);
}
执行过程：
程序运行到while处的小括号处，先判断循环条件是否成立，如果成立，也就是返回true，则进行大括号执行里面的循环体，执行完毕之后，再次回到小括号处，判断循环条件是否成立，如果成立，继续执行里面的代码，如果不成立，则跳出当前循环结构。只要是循环，总有一行码可以改变循环条件，如果没有改变循环条件的代码，这样的循环叫做死循环。