JavaWeb——JavaScript_总结

JavaScript概述：

JavaScript是脚本语言不能单独使用，需要嵌入到其他语言中组合使用；

JavaScript由浏览器直接解析执行，不用编译（解析一行执行一行）；

作用：可以控制前端页面的逻辑操作；

特点：交互性；安全性；跨平台性；

JavaScript的组成：

ECMAScript      DOM      BOM

JavaScript与HTML的结合方式：

<script>标签放在任何地方都可以，但要注意和HTML的加载顺序；

<script type="text/javascript" src="demo.js"></script>

如果设置了src外部引用，标签里的代码跳过；

JavaScript语法及使用：

是大小写敏感的；

alert();

1.注释      //     /**/

2.变量

    var 关键字          var     变量名 = 变量值；

    变量值数据类型：原始数据类型，引用数据类型；

原始数据类型：

    string    

    boolean 

    number     数字类型     整数，小数，NaN都是数字类型

                         number("无法强转为数字");转化为NaN;

                        

    null       对象为空，空占位符，废除对象；

    undefined     变量定义未赋值时，系统自动赋值为undefined;

      typeof(变量);判断变量属于哪种原始数据类型；

                                null是原始数据类型，但typeof(null)  为object;

引用数据类型：

    Object     javascript当中，是所有对象的父对象；

                      是良好的数据的载体及传播媒介；

         FR:         var str = new Object("false");

                        alert(str);

     boolean      instanceof       判断 变量属于哪种类型

类型转换：

转换成字符串：

    1.伪对象.toString();

         var str = true;//伪对象

         var str = new Boolean(true);//对象

    2.+“”          (开发中常用)

字符串转数字（有返回值）：

    parseInt()     转成整数

    parseFloat()     转成小数

强制类型转换：

    返回值均为原始数据类型的值；

    String(变量);会把字面值进行转换，NaN,null,undefined会被转换伪Object;

    Boolean(变量）；如果值是有意义的那么true如果值趋向于无意义那么false;

              string number null underfined

                  object对象存在为true;

运算符：

    +      number转换符（强转）          var str = +"10";

    -       number转换符（强转）           var str = -"10"; //-10

    === 全等 比较值和类型，有一个不同就为false;

逻辑运算符：一般和if语句连用，会用boolean类型运算，否则自动强转；

条件运算符：var v = (表达式）？值1:值2；    

流程控制语句：

if语句先赋值再进行boolean运算；

switch会对值和值的类型进行全等比较；

for循环；

for...in 循环；在JS中遍历的都是数组的索引下标；接着遍历对象的属性；

对象：

String Array Regexp

Number对象：

    创建： var num= 10;  var num = new Number(10); var num = Number(10);  默认值为0；

    属性： NaN 创建一个NaN;

    方法：valueOf 返回原始数据类型的值；

    开发中不允许用两个对象进行对比，有歧义，用对象.valueOf()的原始值进行比较；

Boolean对象：   

String对象：

方法：

String中的方法对原先对象没有影响；

concat(str1,str2...) 连接字符串并返回连接后结果；

replace(regexp,replacement) 替换字符串；

split(separator) 根据分隔符分割字符串为数组；

substring(start,stop)

substr(start,length) 截取字符串；

Array对象：

属性不参与长度统计；

如果某位未定义值，默认复制undefined;

Array方法:

concat(arr1,arr2...);连接数组；

join(分隔符)     转化成字符串返回；

pop()     删除并返回数组的最后一个元素；

              如果为空则返回undefined;

shift()     删除并返回数组的第一个元素；

push(element1,element2...)  向数组末尾添加一个或者多个元素；

unshift (element1,element2...)   向数组开头...

reverse()反转

sort()      对数组元素进行排序；unicode码排序；

function s(a,b){return a-b};

Date对象：

var date = new Date();          获取当前系统日期；

var date = new Date(毫秒值);

方法：

toLocaleString(); 转换成本地系统日期格式

getDate();返回一月中的某一天

getDay();返回一周中的某一天

getMonth();获取月份 （0--11）

getFullYear();

getTime();获取毫秒值；

setTime();设置毫秒值；

parse(dateString) 解析字符串获取毫秒值

FR      Date.parse("2015/09/04 17:13:25");

Math方法：

Math.方法或Math.属性

random();

round();四舍五入

ceil();      floor();    

RegExp正则对象；

创建：

 var reg = /^表达式$/;直接量方式，开发中常用；

方法：

test();检查字符串中指定的值，返回boolean;

模拟表单验证：var msg=""; var reg=/^  \s* $/;

if(!reg.test(msg)){}else{};

z-index

 NaN !=NaN;    true

underfined == underfined;    true

underfined == null;    true

JavaScript高级

函数：

定义函数：

    方式1: 

                   function 函数名（参数1，参数2）{

                        函数体；     

                    }

    方式2:

                   定义一个变量，将函数赋值给一个变量；

                   var 变量名 = function(a,b){return a+b;}

    方式3:     在JS中函数也是对象；可以把函数整体当做参数来传递；

                   var sum = new Fnction("a","b","return a+b;") ;

作用域：变量和函数有效存在的区域；

JS中作用域：函数内函数外；

事件：在HＴＭＬ中有一些动作，可以通过程序进行响应；

    点击；鼠标；键盘；表单；页面；

    为标签绑定事件＜TagName 事件名=“函数的调用形式()”＞</TagName>

时间：

setTimeout("fm()",3000);//3秒之后执行fm()函数；

    clearTimeout();//取消时间句柄；

setInterval( "fm()",3000 );//每隔多长时间执行一次；

     clearInterval();

3个经典弹窗：

alert();

confirm("确定。。？");//确定取消，返回值boolean;

prompt("请输入");//输入信息，返回输入内容；

BOM:Browser object Model：浏览器对象模型；

BOM对象都是内置对象；

window对象：代表整个浏览器窗口，可以通过window对象访问其他BOM对象； 在JS中最外层变量和函数都属于Window对象；

screen屏幕：availWidth；availHeigth;

Location地址栏 ：href;

Navigator浏览器：获取浏览器信息；

History：forward()前进；back()后退；go(1)指定，前进后退几个；

var dm = document.getElementById("myID");//获取myID标签对象；

dm.innerHtml     dm.className //获取标签对象的各种属性

window.onload = function(){}//页面加载完成后执行一下代码；

Web前端：原则：内容样式分离；

DOM:文档对象模型；

节点：

dom树结构； style 属性