JavaScript

JavaScript是一门编程语言，浏览器内置了JavaScript语言的解释器，所以在浏览器上按照JavaScript语言的规则编写相应的代码，浏览器可以解释并作出相应的处理。

1·JavaScript代码存在形式

<!--方式一-->
<script type"text/javascript" src="js文件"></script>


<!--方式二 -->
<script type"text/javascript">
        js代码内容...
</script>

2·JavaScript代码存在位置

·HTML的head中

·HTML的body代码块底部（强烈推荐）

由于html代码是从上到下执行，如果Head中的js代码耗时严重，就会导致用户长时间无法看到页面，如果放置在body代码块底部，那么及时js代码耗时严重，也不会影响用户看到页面的效果，只是js实现特效慢而已。

如:
<script src="https://www.xxxx.com"></script>
<script>
    alert("123");
</script>


//alert(弹窗)

3·变量

·全局变量

·局部变量

JavaScript中变量的声明是一个非常容易出错的点，局部变量必须以个var开头，如果未使用var，则默人表示声明的是全局变量·

var name ="xxxx"     //局部变量
age = 18             //全局变量

注：单行注释  //   多行注释    /* */

4·基本数据类型

javascript 中的数据类型分为原始类型和对象类型：

·原始类型

　　·数字

　　·字符串

　　·布尔值

·对象类型

　　·数组

　　·"字典"

　　·...

特憋的，数字,布尔值,null,undefined,字符串是不可变的.

null和undefined

//null, undefined
null,是JavaScript语言的关键字，它表示以个特殊的值，常用来描述"空值".
undefined是一个特殊值,表示变量未定义.

1·数字（Number）

JavaScript中不区分整数值和浮点数值，java中所有数字均使用浮点数值表示·

转换:

　　·parseIne（变量名） 将某个值转换成数字，不成功则返现NaN

　　·parseFloat（变量名）将某个值转换成浮点数，不成功则返现NaN

特殊值:

　　·NaN:非数字,可使用isNaN(num)来判断·

　　·Infinity:无穷大,可使用isFinite(num)来判断·

更多数值计算:

常量

Math.E
常量e，自然对数的底数·

Math.LN10
10的自然对数·

Math.LN2
2的自然对数·

Math.LOG10E
以10为底的e的对数·

Math.LOG2E
以2为底的e的对数·

Math.PI
常量figs/U03C0.gif·

Math.SQRT1_2
2的平方根除以1·

Math.SQRT2
2的平方根·

##静态函数

Math.abs()
计算绝对值·

Math.acos()
计算反余弦值·

Math.asin( )
计算反正弦值。

Math.atan( )
计算反正切值。

Math.atan2( )
计算从X轴到一个点的角度。

Math.ceil( )
对一个数上舍入。

Math.cos( )
计算余弦值。

Math.exp( )
计算e的指数。

Math.floor( )
对一个数下舍人。

Math.log( )
计算自然对数。

Math.max( )
返回两个数中较大的一个。

Math.min( )
返回两个数中较小的一个。

Math.pow( )
计算xy。

Math.random( )
计算一个随机数。

Math.round( )
舍入为最接近的整数。

Math.sin( )
计算正弦值。

Math.sqrt( )
计算平方根。

Math.tan( )
计算正切值。

2·字符串（String）

字符串是由字符组成的数组,但在JavaScript中字符串是不可变的:可以访问字符串任意位置的文本,但是JavaScript并未提供修改已知字符串内容的方法·

常见功能：

a = "huanyingguanglin"
"huanyingguanglin"
a.length    (查看长度)
16


a = " wyc "
" wyc "
a.trim()       (去除字符串的两边空格)
"wyc"
a.trimleft()      (去除字符串的左边空格)
a.trimright      (去除字符串的右边空格)



a = "nihao"
"nihao"
a.charAt(2)     (返回字符串中的参数的字符)！参数可以定义，看字符串的长度定义
"h"

a = "wyc"
"wyc"
b = "nihao"
"nihao"
a.concat(b)             (字符串的拼接）
"wycnihao"

a = "wycnihao"
"wycnihao"
a.indexOf("ni",2)     (寻找子序列位置）
3

a = "wycnihao"
"wycnihao"
a.lastIndexOf("yc",2)      (子序列位置 )
1

a = "wycnihao"
"wycnihao"
a.substring("yc",4)      (根据索引获取子序列)
"wycn"

a = "wycnihao"
"wycnihao"
a.slice(1,6)          (切片，从字符串的1位置到6位置)
"ycnih"

a = "wycnihao"
"wycnihao"
a.toLowerCase()       (将字符串变小写)
"wycnihao"
a.toUpperCase()      （将字符串变大写）
"WYCNIHAO"

a = "wycnihao"
"wycnihao"
a.split("cn")       (字符串的分割)
["wy", "ihao"]

a = "wycwyc9wycwyc"
"wycwyc9wycwyc"
a.split(/(d+)/)          (字符串的分割,支持正则分割)
["wycwyc", "9", "wycwyc"]

a = "wycwycwyc"
"wycwycwyc"
a.match(/w/)         (全局匹配)
["w"]
a.match(/w/g)       (匹配的元素后边加个g，表示把字符串里边所有的w全部匹配出来)
["w", "w", "w"]

a = "wycwycwyc"

"wycwycwyc"
a.search(/y/)        (匹配出元素的位置)
1

a = "wyc7wycwyc9"
"wyc7wycwyc9"
a.replace(/(d+)/g,"X")      （将匹配到的数字全部替换为"X"）
"wycXwycwycX"
a.replace(/(d+)/g,"$&"+"L")   (将匹配到的数字后边的元素替换为“L”)    
"wyc7Lwycwyc9L"

a.replace(/(d+)/g,"&")         (将所有匹配到的数字替换成艾特符号“&”)
"wyc&wycwyc&"

a = "wyc7wycwyc9"
"wyc7wycwyc9"
a.replace(/(d+)w+(d+)/g,"$2$1")      (将匹配到数字的7,9交换一下位置)
"wyc97"

a = "wyc7wycwyc9"
"wyc7wycwyc9"
a.replace(/d+/,"$`")       (用于匹配左侧文本)
"wycwycwycwyc9"

a = "wyc7wycwyc9"
"wyc7wycwyc9"
a.replace(/(d+)w+(d+)/g,"$$")        (直接量"$"符号)
"wyc$"

3·布尔值　

布尔类型仅包含真假，与python不同的是，python第一个字母是大写，（"True","False"）,则JavaScript里是小写("true","false")

· ==   （比较值相等）

· !=     （不等于）

· ===    (比较值和类型相等）

· !===    （不等于）

·  ||      （或）

·  &&       （且）

4·数组

JavaScript中的数组类似于python中的列表[]

常见功能：

obj.length      //数组的大小

obj.push(ele)       //尾部追加元素

obj.pop         //尾部获取元素

obj.shift()     //头部移除元素

obj.splice(start,deleteCount,value,......)       //插入·删除或替换数组的元素

                      obj.splice(n,0,val)    //指定位置插入元素
                      obj.splice(n,1,val)    //指定位置替换元素
                      obj.splice(n,1)         //指定位置删除元素

obj.slice()      //切片

obj.reverse()      //反转

onj.join(sep)         //将数组元素链接起来以构建一个字符串

obj.concat(val,...)        //连接数组

obj.sort()         //对数组元素进行排序

//查看数组元素的长度
a = [11,22,33,44,55]
[11, 22, 33, 44, 55]
a.length
5


// 给数组尾部添加元素
a.push(66)
6
a
[11, 22, 33, 44, 55, 66]


//删除数组元素
[11, 22, 33, 44, 55, 66]
ret = a.pop()
66
ret
66
a
[11, 22, 33, 44, 55]



//在数组头部添加元素
[11, 22, 33, 44, 55]
a.unshift(77)
6
a
[77, 11, 22, 33, 44, 55]


//在数组头部移除元素
[77, 11, 22, 33, 44, 55]
a.shift()
77
a
[11, 22, 33, 44, 55]



//splice即删除既添加
a
[11, 22, 33, 44, 55]
a.splice(1,0,"wyc")        （表示在1的位置，0表示不删除，"wyc"表示在1的               
                                            位置添加进去）
[]
a
[11, "wyc", 22, 33, 44, 55]



//splice能添加多个元素
[11, "wyc", 22, 33, 44, 55]
a.splice(1,0,"wyc","nihao")     （splice，可以在数组一次里边添加多个元素       ）
[]
a
[11, "wyc", "nihao", "wyc", 22, 33, 44, 55]      


//splice删除
[11, "wyc", "nihao", "wyc", 22, 33, 44, 55]
a.splice(1,2)      (表示从数组的第一个位置删除两个元素)
["wyc", "nihao"]
a
[11, "wyc", 22, 33, 44, 55]


//splice替换
[11, "nihao", "wyc", 22, 33, 44, 55]
a.splice(1,1,"hi")     (表示在元素1的位置删除1在添加一个新的元素)
["nihao"]
a
[11, "hi", "wyc", 22, 33, 44, 55]

//切片
a
[11, "hi", "wyc", 22, 33, 44, 55]
a.slice(1,2)
["hi"]

 

//反转

[11, "hi", "wyc", 22, 33, 44, 55]
a.reverse()          (将数组元素反转过来)
[55, 44, 33, 22, "wyc", "hi", 11]

 

 

//将数组元素拼接起来(join)

[55, 44, 33, 22, "wyc", "hi", 11]
a.join("_")             //将数组元素用下滑线拼接起来
"55_44_33_22_wyc_hi_11"

 

//sort排序

[55, 44, 33, 22, "wyc", "hi", 11]
a.sort()     //将数组进行排序
[11, 22, 33, 44, 55, "hi", "wyc"]

四·其他　　

1丶序列化

·JSON.stringify(obj)      序列化

·JSON.parse(str)           反序列化

a = 3
3
JSON.stringify(a)        （将a序列化成字符串）
"3"
JSON.parse(a)          （将a在反序列化成整数）
3

2丶转义

·decodeURI()     URI中为转义的字符

·decodeURIComponent()       URI组件中的未转义字符

·encodeURI()            URI中的转义字符

·encodeURIComponent()         转义URI组件中的字符

·escape()             对字符串的转义

·unescape()          给转义字符串解码

·URIError               由URI的编码和解码方法抛出

3丶eval

JavaScript中的eval是python中eval和exec的合集,既可以编译代码也可以获取返回值·

·eval()

·EvalError 执行字符串中的JavaScript代码

4丶正则表达式

JavaScript中支持正则表达式，其主要提供了两个功能:

　　·test(string) 　　用于检测正则是否匹配

 　  ·exec(string)　　用于获取正则匹配的内容

注:定义正则表达式时,"g","i","m"分别表示去全局匹配,忽略大小写,多行匹配·

5丶时间处理

JavaScript中提供了时间相关的操作,时间操作中分为两种时间:

·时间统一时间

·本地时间(东8区)

更多操作参见：http://www.shouce.ren/api/javascript/main.html

五丶语句和异常

1丶条件语句

javascript中支持两个条件语句分别是：if和switch

    if(条件){
    
    }else if(条件){

    }else{
    }

　　

switch(name){
      case"1":
          age = 123;
          break;
      case"2":
          age = 456;
          break
      default:
          age = 777;        
}

2丶循环语句　　

javascript中支持三种循环语句,分别是：

var names = ["wyc","nihao"];
for(var i=0;i>names.lengith;i++){
     console.log(i);
     console.log(name[i]);
}

var name = ["wyc","nihao"]
for (var index in name ){
    console.log(index);
    console.log(name[index]);
}

while(条件){
     //break;
     //continue;  
}

3丶异常处理

try{
     //这段代码从上到下运行，其中任何一个语句抛出异常该代码块就结束运行·
}
catch(e){
    //如果try代码中抛出异常,catch代码块中的代码就会被执行.
    //e是一个局部变量,用来指向Error对象或者其他抛出的对象
}
finally{
   //无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行·
}

注:主动跑出异常throw Error("xxxxx")

六丶函数

1·基本函数

javascript中函数基本可分为一下三类:

//普通函数
function function(arg){        //创建函数
    return true;  
}

//匿名函数
var func = function(arg){
    return "tony";
}

//自动执行函数
(function(arg){
    console.log(arg);
})("123")

注意:对于javascript中函数参数，十几参数的个数可能小于形参的个数，函数内的特殊值arguments中封装了所有的实际参数·

2·作用域

javascript中每个函数都有自己的的作用域，当出现函数嵌套时，就出现了作用域链，当内层函数使用变量时，会根据作用域链从内到外一层层的循环，如果不存在则异常·

！切记:所有的作用域在创建函数且未执行的时候就已经存在了·

function f2(){
    var arg = 111;
    function f3(){
        conlose.log(arg);
    }
    return f3();
}

ret = f2();        //执行函数
ret();

function f2(){
    var arg = [11,22];
    function f3(){
        console.log(arg);
    }
    arg = [44,55];
    return f3;
}
ret = f2();
ret();

注:声明提前,在javascript引擎"预编译"时进行·

更多:

3丶闭包

[闭包],是指拥有多个变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分·

闭包是个函数,而他[记住了周围发生了什么]·表现为由[一个函数]体中定义了[另一个函数],由于作用域链只能从内向外找，默认外部无法获取函数内部变量.闭包、在外部获取函数内部的变量.

function f1(){
    var arg = [11,22];
    function f2(){
         return arg;
    }
    return f2;
}

ret = f2();
ret();

 面向对象·

function Foo (name,age){
    this.Name = name;
    this.Age = age;
    this.Func = function(arg){
           return this.name + arg;
    }
}

var obj = new Foo("Wyc",19);
var ret = obj.Func("nihao");
console.log(ret);

对于上述代码需要注意:

　　· Foo充当的构造方法         在python构造方法代指的是（__init__）

　　· thif 代指对象

　　· 创建对象是需要使用 new

上述代码中每个对象中均保存了一个相同的Func函数,从而浪费内存.使用原型和可以解决该问题.

function Foo(name,age){
    this.Name = name;
    this.Age = age;
}
Foo.prototype = {
    GetInfo:function(){
        return this.Name + this.Age
    },
    Func : function(arg){
         return this.Name + arg;
    }
}