javas-基本语法/引用等
JavaScript介绍
JavaScript是运行在浏览器端的脚步语言，JavaScript主要解决的是前端与用户交互的问题，包括使用交互与数据交互。 JavaScript是浏览器解释执行的，前端脚本语言还有JScript（微软，IE独有），ActionScript( Adobe公司，需要插件)等。
-
1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEase.(客户端执行的语言)
-
Netscape(网景)接收Nombas的理念,(Brendan Eich)在其Netscape Navigator 2.0产品中开发出一套livescript的脚本语言.Sun和Netscape共同完成.后改名叫Javascript
-
微软随后模仿在其IE3.0的产品中搭载了一个JavaScript的克隆版叫Jscript.
-
为了统一三家,ECMA(欧洲计算机制造协会)定义了ECMA-262规范.国际标准化组织及国际电工委员会（ISO/IEC）也采纳 ECMAScript 作为标准（ISO/IEC-16262）。从此，Web 浏览器就开始努力（虽然有着不同的程度的成功和失败）将 ECMAScript 作为 JavaScript 实现的基础。EcmaScript是规范.
前端三大块
1、HTML：页面结构
2、CSS：页面表现：元素大小、颜色、位置、隐藏或显示、部分动画效果
3、JavaScript：页面行为：部分动画效果、页面与用户的交互、页面功能
Javascript组成
1、ECMAscript javascript的语法（变量、函数、循环语句等语法）
2、DOM 文档对象模型 操作html和css的方法
3、BOM 浏览器对象模型 操作浏览器的一些方法
JavaScript嵌入页面的方式
1、行间事件（主要用于事件）
<input type="button" name="" onclick="alert('ok！');">
2、页面script标签嵌入
<script type="text/javascript">
var a = '你好！';
alert(a);
</script>
3、外部引入
<script type="text/javascript" src="js/index.js"></script>
javascript语句与注释
1、一条javascript语句应该以“;”结尾
<script type="text/javascript">
var a = 123;
var b = 'str';
function fn(){
alert(a);
};
fn();
</script>
2、javascript注释
<script type="text/javascript">
// 单行注释
var a = 123;
/*
多行注释
1、...
2、...
*/
var b = 'str';
</script>
变量
JavaScript 是一种弱类型语言，javascript的变量类型由它的值来决定。 定义变量需要用关键字 'var'
注：python是动态强类型语言，js就是动态弱类型的语言，一般来看语言类型的强弱区分是根据语言是否会对类型做隐式转换(==);
var a = 123; var b = 'asd'; //同时定义多个变量可以用","隔开，公用一个‘var’关键字 var c = 45,d='qwe',f='68';
变量类型
5种基本数据类型：
number、string、boolean、undefined、null
1种复合类型：
object
Number
String -- 全部都是 unicode 格式
Boolean
true + 1 >> 2
false + 1 >> 1
Null
Undefined -- 函数只申明未赋值时以及函数没有return的时候才会出现
变量、函数、属性、函数参数命名规范
1、区分大小写
2、第一个字符必须是字母、下划线（_）或者美元符号（$）
3、其他字符可以是字母、下划线、美元符或数字1、区分大小写
4、声明变量时 可以不用var. 如果不用var 那么它(可能)是全局变量
1 Camel 标记法 2 首字母是小写的，接下来的字母都以大写字符开头。例如： 3 var myTestValue = 0, mySecondValue = "hi"; 4 Pascal 标记法 5 首字母是大写的，接下来的字母都以大写字符开头。例如： 6 Var MyTestValue = 0, MySecondValue = "hi"; 7 匈牙利类型标记法 8 在以 Pascal 标记法命名的变量前附加一个小写字母（或小写字母序列），说明该变量的类型。例如，i 表示整数，s 表示字符串，如下所示“ 9 Var iMyTestValue = 0, sMySecondValue = "hi";
数组及操作方法
数组就是一组数据的集合，javascript中，数组里面的数据可以是不同类型的。
定义数组的方法
1 //对象的实例创建 2 var aList = new Array(1,2,3); 3 4 //直接量创建 5 var aList2 = [1,2,3,'asd'];
操作数组中数据的方法
1、获取数组的长度：aList.length;
var aList = [1,2,3,4]; alert(aList.length); // 弹出4
2、用下标操作数组的某个数据：aList[0];
var aList = [1,2,3,4]; alert(aList[0]); // 弹出1
3、join() 将数组成员通过一个分隔符合并成字符串
var aList = [1,2,3,4];
alert(aList.join('-')); // 弹出 1-2-3-4
4、push() 和 pop() 从数组最后增加成员或删除成员
var aList = [1,2,3,4]; aList.push(5); alert(aList); //弹出1,2,3,4,5 aList.pop(); alert(aList); // 弹出1,2,3,4
5、unshift()和 shift() 从数组前面增加成员或删除成员
var aList = [1,2,3,4]; aList.unshift(5); alert(aList); //弹出5,1,2,3,4 aList.shift(); alert(aList); // 弹出1,2,3,4
6、reverse() 将数组反转
var aList = [1,2,3,4]; aList.reverse(); alert(aList); // 弹出4,3,2,1
7、indexOf() 返回数组中元素第一次出现的索引值
var aList = [1,2,3,4,1,3,4]; alert(aList.indexOf(1));
8、splice() 在数组中增加或删除成员
var aList = [1,2,3,4]; aList.splice(2,1,7,8,9); //从第2个元素开始，删除1个元素，然后在此位置增加'7,8,9'三个元素 alert(aList); //弹出 1,2,7,8,9,4
多维数组
多维数组指的是数组的成员也是数组的数组。
var aList = [[1,2,3],['a','b','c']]; alert(aList[0][1]); //弹出2;
字符串处理方法
1、字符串合并操作：“ + ”
2、parseInt() 将数字字符串转化为整数
3、parseFloat() 将数字字符串转化为小数
4、split() 把一个字符串分隔成字符串组成的数组
5、charAt() 获取字符串中的某一个字符
6、indexOf() 查找字符串是否含有某字符
7、substring() 截取字符串 用法： substring(start,end)（不包括end）
8、toUpperCase() 字符串转大写
9、toLowerCase() 字符串转小写
字符串反转
var str = 'asdfj12jlsdkf098';
var str2 = str.split('').reverse().join('');
alert(str2);
常量和标识符
常量 ：直接在程序中出现的数据值
标识符：
- 由不以数字开头的字母、数字、下划线(_)、美元符号($)组成
- 常用于表示函数、变量等的名称
- 例如：_abc,$abc,abc,abc123是标识符，而1abc不是
- JavaScript语言中代表特定含义的词称为保留字，不允许程序再定义为标识符
运算符
1、算术运算符： +(加)、 -(减)、 *(乘)、 /(除)、 %(求余)
2、赋值运算符：=、 +=、 -=、 *=、 /=、 %=
3、条件运算符：==、===、>、>=、<、<=、!=、&&(而且)、||(或者)、!(否)
条件语句
if else
1 var a = 6;
2 if(a==1)
3 {
4 alert('语文');
5 }
6 else if(a==2)
7 {
8 alert('数学');
9 }
10 else if(a==3)
11 {
12 alert('英语');
13 }
14 else if(a==4)
15 {
16 alert('美术');
17 }
18 else if(a==5)
19 {
20 alert('舞蹈');
21 }
22 else
23 {
24 alert('不补习');
25 }
switch
var a = 6;
switch (a){
case 1:
alert('语文');
break;
case 2:
alert('数学');
break;
case 3:
alert('英语');
break;
case 4:
alert('美术');
break;
case 5:
alert('舞蹈');
break;
default:
alert('不补习');
}
循环语句
程序中进行有规律的重复性操作，需要用到循环语句。
for循环
for(var i=0;i<len;i++)
{
......
}
while循环
var i=0;
while(i<8){
......
i++;
}
数组去重
var aList = [1,2,3,4,4,3,2,1,2,3,4,5,6,5,5,3,3,4,2,1];
var aList2 = [];
for(var i=0;i<aList.length;i++)
{
if(aList.indexOf(aList[i])==i)
{
aList2.push(aList[i]);
}
}
alert(aList2);
异常处理
1 try {
2 //这段代码从上往下运行，其中任何一个语句抛出异常该代码块就结束运行
3 }
4 catch (e) {
5 // 如果try代码块中抛出了异常，catch代码块中的代码就会被执行。
6 //e是一个局部变量，用来指向Error对象或者其他抛出的对象
7 }
8 finally {
9 //无论try中代码是否有异常抛出（甚至是try代码块中有return语句），finally代码块中始终会被执行。
10 }
注：主动抛出异常 throw Error('xxxx')
时间对象 Date与定时器的使用
创建Date对象
1 //方法1：不指定参数
2 var nowd1=new Date();
3 alert(nowd1.toLocaleString( ));
4 //方法2：参数为日期字符串
5 var nowd2=new Date("2004/3/20 11:12");
6 alert(nowd2.toLocaleString( ));
7 var nowd3=new Date("04/03/20 11:12");
8 alert(nowd3.toLocaleString( ));
9 //方法3：参数为毫秒数
10 var nowd3=new Date(5000);
11 alert(nowd3.toLocaleString( ));
12 alert(nowd3.toUTCString());
13
14 //方法4：参数为年月日小时分钟秒毫秒
15 var nowd4=new Date(2004,2,20,11,12,0,300);
16 alert(nowd4.toLocaleString( ));//毫秒并不直接显示
Date对象的方法—获取日期和时间
获取日期和时间 getDate() 获取日 getDay () 获取星期 getMonth () 获取月（0-11） getFullYear () 获取完整年份 getYear () 获取年 getHours () 获取小时 getMinutes () 获取分钟 getSeconds () 获取秒 getMilliseconds () 获取毫秒 getTime () 返回累计毫秒数(从1970/1/1午夜)
定时器在javascript中的作用
1、制作动画
2、异步操作
3、函数缓冲与节流
定时器类型及语法
1 /*
2 定时器：
3 setTimeout 只执行一次的定时器
4 clearTimeout 关闭只执行一次的定时器
5 setInterval 反复执行的定时器
6 clearInterval 关闭反复执行的定时器
7
8 */
9
10 var time1 = setTimeout(myalert,2000);
11 var time2 = setInterval(myalert,2000);
12 /*
13 clearTimeout(time1);
14 clearInterval(time2);
15 */
16 function myalert(){
17 alert('ok!');
18 }
1 <script type="text/javascript">
2 window.onload = function(){
3 var oDiv = document.getElementById('div1');
4 function timego(){
5 var now = new Date();
6 var year = now.getFullYear();
7 var month = now.getMonth()+1;
8 var date = now.getDate();
9 var week = now.getDay();
10 var hour = now.getHours();
11 var minute = now.getMinutes();
12 var second = now.getSeconds();
13 var str = '当前时间是：'+ year + '年'+month+'月'+date+'日 '+toweek(week)+' '+todou(hour)+':'+todou(minute)+':'+todou(second);
14 oDiv.innerHTML = str;
15 }
16 timego();
17 setInterval(timego,1000);
18 }
19
20 function toweek(n){
21 if(n==0)
22 {
23 return '星期日';
24 }
25 else if(n==1)
26 {
27 return '星期一';
28 }
29 else if(n==2)
30 {
31 return '星期二';
32 }
33 else if(n==3)
34 {
35 return '星期三';
36 }
37 else if(n==4)
38 {
39 return '星期四';
40 }
41 else if(n==5)
42 {
43 return '星期五';
44 }
45 else
46 {
47 return '星期六';
48 }
49 }
50
51
52 function todou(n){
53 if(n<10)
54 {
55 return '0'+n;
56 }
57 else
58 {
59 return n;
60 }
61 }
62 </script>
63 ......
64 <div id="div1"></div>
1 <script type="text/javascript">
2 window.onload = function(){
3 var oDiv = document.getElementById('div1');
4 function timeleft(){
5 var now = new Date();
6 var future = new Date(2016,8,12,24,0,0);
7 var lefts = parseInt((future-now)/1000);
8 var day = parseInt(lefts/86400);
9 var hour = parseInt(lefts%86400/3600);
10 var min = parseInt(lefts%86400%3600/60);
11 var sec = lefts%60;
12 str = '距离2016年9月12日晚24点还剩下'+day+'天'+hour+'时'+min+'分'+sec+'秒';
13 oDiv.innerHTML = str;
14 }
15 timeleft();
16 setInterval(timeleft,1000);
17 }
18
19 </script>
20 ......
21 <div id="div1"></div>
Function 对象(重点)函数
函数就是重复执行的代码片。
函数定义与执行
1 <script type="text/javascript">
2 // 函数定义
3 function aa(){
4 alert('hello!');
5 }
6 // 函数执行
7 aa();
8 </script>
变量与函数预解析
JavaScript解析过程分为两个阶段，先是编译阶段，然后执行阶段，在编译阶段会将function定义的函数提前，并且将var定义的变量声明提前，将它赋值为undefined。
1 <script type="text/javascript">
2 aa(); // 弹出 hello！
3 alert(bb); // 弹出 undefined
4 function aa(){
5 alert('hello!');
6 }
7 var bb = 123;
8 </script>
提取行间事件
在html行间调用的事件可以提取到javascript中调用，从而做到结构与行为分离。
1 <!--行间事件调用函数 -->
2 <script type="text/javascript">
3 function myalert(){
4 alert('ok!');
5 }
6 </script>
7 ......
8 <input type="button" name="" value="弹出" onclick="myalert()">
9
10 <!-- 提取行间事件 -->
11 <script type="text/javascript">
12
13 window.onload = function(){
14 var oBtn = document.getElementById('btn1');
15 oBtn.onclick = myalert;
16 function myalert(){
17 alert('ok!');
18 }
19 }
20 </script>
21 ......
22 <input type="button" name="" value="弹出" id="btn1">
匿名函数
定义的函数可以不给名称，这个叫做匿名函数，可以将匿名函数直接赋值给元素绑定的事件来完成匿名函数的调用。
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementById('btn1');
/*
oBtn.onclick = myalert;
function myalert(){
alert('ok!');
}
*/
// 直接将匿名函数赋值给绑定的事件
oBtn.onclick = function (){
alert('ok!');
}
}
</script>
函数传参
1 <script type="text/javascript">
2 function myalert(a){
3 alert(a);
4 }
5 myalert(12345);
6 </script>
函数'return'关键字
函数中'return'关键字的作用：
1、返回函数执行的结果
2、结束函数的运行
3、阻止默认行为
1 <script type="text/javascript">
2 function add(a,b){
3 var c = a + b;
4 return c;
5 alert('here!');
6 }
7
8 var d = add(3,4);
9 alert(d); //弹出7
10 </script>
来源：https://www.cnblogs.com/alwaysInMe/p/7301979.html