JavaScript是前端工程师用的不能再熟悉的一种脚本语言，主要是用户创建动态网页、与后端交互等。下面是我学习时整理的JavaScript基础语法
js命名规范： 1.一定要有意义，尽量用英文单词 2.不要以数字开头，不能使系统的关键字,不能使用运算符 3.注意大小写 大小写： 变量名和函数名 第一个单词 小写以后每个单词 首字母大写 对象 ： 每个单词首字母都要大写 分号： 结构定义语句后不加分号 if for while 功能执行语句一定要加分号 赋值等 变量： 变量声明后是浏览器关闭后才释放的，在没关闭之前可以随时使用
数据类型： typeof(变量);
1.number (int float double) 注意：计算时还是按整形和浮点型分开使用 2.string (string char) 3.boolean 4.object(object array null) 使用时分别处理 5.undefined 没有声明变量 整数 var a=10; var a=045; var a=0Xff; 浮点数不能用等号进行判断 字符串'',""没有区别，所有的转义都可以使用，a.函数组成：
1.函数名 2.参数：根据需要使用参数 3.函数体（功能） 4.返回值（可选）b.回调函数（参数中用到了函数）:
例： function demo(a,b,fun){ return a+b+fun(a,b); } demo(1,2,test); function test(x,y){ return 100+x+y; } 也可以: demo(1,2,function(x,y){ return x*y; }); 再者： functioin table(start,end,check){ for(var i=start;i<end;i++){ if(check(i)){ document.write(i+'</br>'); } } } //1.从这个函数中(10,500)取出3的倍数 //2.从这个函数中(-200,200)取出负数 table(10,500,function(num){ if(num%3==0) return true; else return false; });c.系统函数 系统函数中的global和window对象可以供程序员使用 escape(charstring)//为字符串进行编码.所有空格、标点、重音符号以及其他非ASCII 字符否用%xx编码代替，其中xx等于表示该字符的十六进制数 unescape(charstring) 与其用法一致但是是解码操作 isNaN(data)判断data是否为不是数字类型（NaN） eval(codestring) 检查并执行代码
<script> a="23.45"; var str='var f="'+a+'";if(!isNaN(f)){ var i=parseInt(f);}else{var i=0;}'; eval(str); alert(1); </script>d.函数特性 d-1.js中函数外声明的变量即可看成全局变量 默认参数：
function test(a,b,c){ a = a ? a : 1; b = b ? b : 2; c = c ? c : 3; alert(a+"-----"+b+"-----"+c); } test();d-2.如果形参数大于实参数，那么函数内将把所有形参合成一个数组arguments
3.1 基本常识 a.基于对象的操作方式（面向对象封装、继承、多态） b.将相关的操作使用一个对象完成，看作是一个整体 javascript——–php 对象————-类 对象实例 —–对象 c.对象包括：
字符串对象 数学对象 数组d.对象中存的内容：
d.1、属性（变量） d.2、方法（函数）e.使用步骤： e.1.找到对象 e.2.实例化对象 e.3.操作对象
f.实例对象
f.1对象实例：用'.'进行操作 f.2对象实例.属性 （取值，赋值） f.3对象实例["属性名"] f.4对象实例.方法（）；如Date对象：
<script> var dt=new Date(); var str="今天是："; str += (dt.getYear()+1900)+"年"; str += (dt.getMonth()+1)+"月"; str += dt.getDate()+"日 "; str += dt.getHours()+":"; str += dt.getMinutes()+":"; str += dt.getSeconds()+" "; var arr=['星期日','星期一','星期二','星期三','星期四','星期五','星期六']; str += arr[dt.getDay()]; document.write(str); </script>3.2自定义对象 a.方法一：
<script> function Play(){ } var p = new Play(); //属性 p.width=300; p.height=200; p.num=4; p.autotime=3; //方法 p.autoPlay=function(){ alert("dsfdsfdsfdgf"); } p.test=function(){ } alert(p.width); p.autoPlay(); </script>b.方法二：
function Play(){ =》》》》》》var p = new Object(); } var p = new Play();c.方法三：
function Play(){ var p = new Object(); //属性 p.width=300; p.height=200; p.num=4; p.autotime=3; //方法 p.autoPlay=function(){ alert("dsfdsfdsfdgf"); alert(p.num);//this.num,静态方法中无this } p.test=function(){ } return p; } var p = new Play(); <script> function Play(){ var p = new Object(); //属性 p.width=300; p.height=200; p.num=4; p.autotime=3; //方法 p.autoPlay=function(){ alert("dsfdsfdsfdgf"); alert(this.num); } p.test=function(){ } return p; } var p = new Play(); alert(p.width); p.autoPlay(); </script>d.方法四：
//有this就得有对象 function Play(width,height,num){ this.width=width; this.height=height; this.num=num; this.autoPlay=function(){ alert("###########"); } this.test=function(){ } return p; } var p = new Play(3000,200,8); alert(p.width); p.autoPlay(); </script> 遍历属性名(接上)： var pro=""; for(pro in p){ alert(p[pro]); } with(对象st){ 所有方法如果不加对象都是st的方法 } with(document){ write("<table>"); }3.3内置对象 a.Function对象：
<script> var demo=new Function("x","y","return x+y"); demo=new Function("x","y","return x*y"); alert(demo(3,4)); </script>b.String对象：
var str = new String("abcdefg"); var str = "abcdefg";c.快速声明对象:
var p=new Object(); p.name="zhangsan"; p.age=10; p.sex="nan"; /* json {属性1:值1,属性2:值2,属性3:值3,属性4:值4} */ var p={name:"zhangsan",age:10,sex:"nan"}; alert(p.name); alert(p["age"]); match()一般用于验证操作 Number对象： alert(Number.MAX_VALUE);d.静态对象：不创建对象的情况下直接用对象名访问
e.Math对象： 不要实例化，直接调用 如100以内随机数：
var num=Math.random()*100; document.write(num+"<br>");数组的声明与应用 a、数组的作用:只要是批量的数据都需要使用数组声明 b、如何声明数组 4.1.快速声明数组的方法 var 数组名=[元素1,元素2,元素3,元素4]; 其中的元素可以为另一个数组. 4.2.使用array对象
function MyArray(){ this.length=arguments.length; for(var i=0;i<arguments.length;i++){ this[i] = arguments[i]; } this.sort=function(){} this.pop=function(){} this.push=function(){} } var arr = new Array("成员","成员","成员n"); var arr = new Array(10); var arr=[1,5,3,4,2,9,8,7]; arr.sort(function(a,b){//可用此方法对函数进行重写 if(a>b){ return -1; } else if(a == b){ return 0; } else{return 1}; }); document.write(arr); var arr=["aaa","aaaa","aa","b","aaaaaaaa"]; //arr.push("wwww","yyyy"); //arr.pop(); //arr.unshift("hello"); arr.shift(); alert(arr); alert(arr.length); reverse();数组反转 join(s);数组转为字符串，'s'为连接符c、遍历数组
d、数组的处理（内置处理方法）
作用：DOM(Document Object Model) 1.document 文档 HTML/XML文件 即标记语言 2.Object对象(HTML元素 转乘的对象(js对象)) 注意：如果使用js操作HTML文档，就需要先将HTML文档中的结构转成js对象 a.操作属性 b.操作内容 5.1.innerText//里面的东西全以文本形式显示 obj.innerText=”brother“， 该属性火狐浏览器不兼容，可用textContent代替，用法相同 使用时可自己写一个方法,用document.all判断是否支持所有方法，即自己写个转换 “` if(document.all){ alert(document.all); } ffie(a,”wwww”); alert(ffie(a)); function ffie(obj,value){ if(document.all){ if(typeof(value)==”undefined”){ return obj.innerText; } else obj.innerText=value; }else{ if(typeof(value)==”undefined”){ return obj.textContent; } else obj.textContent=value; } }
5.2.innerHTML//里面的内容以HTML形式显示 使用时尽量使用innerHTML 5.3.outerText 5.4.outerHTML //3,4都包含自己本身的标签 表单 表单元素取值需要用```value(<input>,<textarea>)``` **c.操作样式** 对象.style.属性="";同时属性需要格式化，即"-"去掉，后面的单词首字母大写 --- 但有些属性无法从内联式样式中获取，此时用另一个属性即可 ， 如width/offsetWidth --- 操作样式较多时，可添加className，className数量不限;将className清空即取消样式 var pro=""; for(pro in a){ document.write("a."+pro+"="+a["pro"]+"<br>"); } 可用此方法获取a标签中的所有属性 有了以上三点的操作之前先转成对象“` 转成对象的两种形式: 1.标记名(多个)、id(唯一)、name(多个) document中的三个方法 var objs=document.getElementsByTagName(“div”); var obj = document.getElementById(“one”); var obj = document.getElementsByName(“two”); 2.通过数组获取 document.body; document.title; window.frames;
document.all;//所有的标记 document.embeds;//所有动画 document.scripts;//所有js脚本 document.applets;//所有Java脚本 document.forms;//所有图像 document.images;//所有表单 document.anchors;//所有的锚点 document.styleSheets;//所有的样式 document.links;//所有链接d.事件处理： 一、事件源：任何一个HTML元素（节点），body，div，button，p,,a,h1………… 二、事件 ：你的操作
鼠标： click 单击 dblclick 双击 textcontentmenu(在body) 文本菜单 contextmenu //右键点击(06.html 2) mouseover 放上 mouseout 离开 mousedown 按下 mouseup 抬起 mousemove 移动 键盘： keypress 键盘事件 指数字字母键，其余键无效 keyup 键盘抬起 keydown 按下 此时所有的键都可以取到 文档： load 加载 load中的内容在加载时最后执行(06.html 4) unload 关闭 关闭或切换页面时触发 beforeunload 关闭之前 表单： focus 获得焦点事件 blur 失去焦点事件 submit 提交事件 change 改变事件 其他事件： scroll 滚动事件浏览器本身就有一些对象，不用创建即可使用 window : 当前浏览器窗体的
属性： status opener//在子窗体中代表父窗体 closed 方法： alert() confirm() setInterval() clearInterval();//循环执行 setTimeout("aaa()",3000) //只执行一次,在规定时间内执行某一操作 clearTimeout() open();//开启新窗体(11.html)(16) window子对象： document frames location history screen [window.]成员 document.write(); 本身window open可以弹出子窗体 frames//多个窗体 跳转位置函数: <meta http-equiv="refresh" content="3"><!--3秒钟刷新一次--> <meta http-equiv="refresh" content="3;url=http://www.brophp.com"><!--3秒钟加载一次页面--> header("Location:login.php");//前面不能有输出 window.navigate(url) location.href=url; location.replace('url') 记得： location='url'; location.reload(true);(14.html) history history.back() history.go(-2)(15.html) screen (16.html) 表单对象: document.getElementById() document.forms.username document.frm1.username 本身表单有的属性都可以作为对象的属性 action method enctype title 方法： submit() focus()//获取焦点 事件: onfocus();//获取焦点 onblur();//失去焦点 onchange();//内容改变事件 form 上的onsubmit();(17.html) select标签: selectedIndex代表选项框下标 options[selectedIndex]获取选项 位置：(images/weizhi.png) style.top style.left offsetWidth offsetHeight offsetTop //距离外面一层盒子的距离 offsetLeft scrollHeight scrollWidth scrollTop //滚动条滚动的高度，一般从0开始计数，计数为+时元素上升，反之下降。 没有滚动条使用js操作是的某一容器内的文本(如div)向上滚动，则需要对该div的上一层非 直接文本容器的scrollTop属性进行改动而不是文本的属性，(22.html) scrollLeft//用absolute布局可以是元素脱离文档流， //用fixed布局可以使页面中某一元素的位置不随滚动条的改变而改变，此时fixed的 布局相对于HTML标签
