JS总结

一致、js是啊,是用来涉及啊的?

  js也不怕是javascript,它是一律栽基于对象与事件驱动的并保有相对安全性的客户端脚本语言。用于web客户端支付之脚本语言,常用来被html网页添加动态功能,如响应用户的各种操作。

  javascript(以下简称js)由基本语法ECMAScript、浏览器对象模型(BOM)
,、文档对象模型(DOM)三片段组成.

老二、引入JS的常用方式

  1、内部引入

    在<head>标签中引入

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    //head中引入js
    <script></script>
</head>    

    在<body>标签中引入

<body>
    //body中引入js
    <script></script>
</body>

  2、外部引入

    引入外部JS文件,就是拿js代码存放于一个晚缀名为.js的文书中,然后采用script标签来引用。此外,引用外部JS文件的script标签可以放在head标签内,也堪置身body标签中。一般只有引用一些插件的当儿才见面将JS引入在head内,大多数是描摹在body内最为下面,因为在加载页面时css和html是优先加载的,而JS文件要最终才加载。

<body>
     //在body的最末尾引入外部的JS.
        <script src="js/index.js" type="text/javascript"></script>
</body>

其三、JS中之数据类型

    基本数据类:String、boolean、Number、undefined、null
    引用数据类型:Object、Array、Date、RegExp、Function

季、变量命名规范

    (1)、变量名分别轻重缓急写,允许包含字母、数字、美元符号($)和下划线,但第一单字符不容许是数字,不同意包含空格和另标点符号,不能够是中文.

    (2)、变量命名长度应该尽可能的亏,并抓住要点,尽量以变量名遭体现出值的路

    (3)、尽量避免使用无意思之命名

    (4)、禁止采取JavaScript关键词、保留字全名

    (5)、变量称命名方式常见也驼峰命名法

五、JS中之类型转换

    强制类型转换:

    Boolean(value):把给定的价转换成Boolean型。它的规则:

    以下值会被转换为false:false、”"、0、NaN、null、undefined,其余任何值都会被转换为true。

 

    String(value):把给定的价转换成为字符串。它的平整:

    (1)如果有toString()方法,则调用该方法(不传递radix参数)并返回结果
    (2)如果是null,返回”null”
    (3)如果是undefined,返回”undefined”

    

    Number(value):把给定的价值转换成为数字(可以是整数或浮点数)。它的条条框框:

    (1)如果是布尔值,true和false分别被转换为1和0
    (2)如果是数字值,返回本身。
    (3)如果是null,返回0.
    (4)如果是undefined,返回NaN。
    (5)如果是字符串,遵循以下规则:
      1、如果字符串中只包含数字,则将其转换为十进制(忽略前导0)
      2、如果字符串中包含有效的浮点格式,将其转换为浮点数值(忽略前导0)
      3、如果是空字符串,将其转换为0
      4、如果字符串中包含非以上格式,则将其转换为NaN
    (6)如果是对象,则调用对象的valueOf()方法,然后依据前面的规则转换返回的值。如果转换的结果是NaN,则调用对象的toString()方法,再次依照前面的规则转换返回的字符串值

 

    转换函数:

    ParseInt(string,radix):将字符串转换为整数档的数值。它的条条框框:

    (1)忽略字符串前面的空格,直至找到第一个非空字符
    (2)如果第一个字符不是数字符号或者负号,返回NaN
    (3)如果第一个字符是数字,则继续解析直至字符串解析完毕或者遇到一个非数字符号为止
    (4)如果上步解析的结果以0开头,则将其当作八进制来解析;如果以x开头,则将其当作十六进制来解析
    (5)如果指定radix参数,则以radix为基数进行解析

 

    parseFloat(string):将字符串转换为浮点数类型的数值。它的平整:

它的规则与parseInt基本相同,但也有点区别:字符串中第一个小数点符号是有效的,另外parseFloat会忽略所有前导0,如果字符串包含一个可解析为整数的数,则返回整数值而不是浮点数值

 

六、JS运算符

    1、算数运算符,算术运算符用于履行变量和/或值期间的算术运算。

运算符 描述 例子 结果
+ x=y+2 x=7
x=y-2 x=3
* x=y*2 x=10
/ x=y/2 x=2.5
% 求余数 (取膜,保留整数) x=y%2 x=1
++ 累加(自加) x=++y x=6
递减(自减) x=–y x=4

    

    2、赋值运算符,赋值运算符用于让 JavaScript 变量赋值。

运算符 例子 等价于 结果
= x=y   x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0

    

    3、比较运算符,比较运算符在逻辑语句子被动用,以测定变量或值是否等。

            给定 x=5,下面的表解释了于运算符:

运算符 描述 例子
== 等于 x==8 为 false
=== 全等(值和类型) x===5 为 true;x==="5" 为 false
!= 不等于 x!=8 为 true
> 大于 x>8 为 false
< 小于 x<8 为 true
>= 大于或等于 x>=8 为 false
<= 小于或等于 x<=8 为 true

    

    4、逻辑运算符,逻辑运算符用于测定变量或值期间的逻辑。

            给定 x=6 以及 y=3,下表解释了逻辑运算符:

运算符 描述 例子
&& and (x < 10 && y > 1) 为 true
|| or (x==5 || y==5) 为 false
! not !(x==y) 为 true

    

    5、三看看运算符

          格式:表达式?“值1”:“值2”,左边为老三望运算符的表达式,?后底首先单价值为true,:后的价值吗false.

          例子:var  num  = 10;

             num>100?”num的价值未超100″:”num的值超过100″;

七、JS中的流程控制

    1、条件语句,通常以形容代码时,您总是用呢不同之主宰来施行不同之动作。您可以以代码中利用规范语句来形成该任务。在
JavaScript 中,我们可利用以下原则语句:

      (1)、if 语句
:只有当指定条件为 true 时,该语句才见面实行代码。

        语法:

 if (条件){
    只有当条件为 true 时执行的代码
  }

        例如:

var a = 5;     //if else 判断大小  
var b = 3;   
if(a>b){       //只有当指定条件为 true 时,使用该语句来执行代码
   alert("a的值大");
}

        注意:请以小写的 if。使用大写字母(IF)会变卦
JavaScript 错误!

 

      (2)、if  else语句 :在基准也 true 时实施代码,在规则也 false
时实行另外代码。

        语法:

if (条件)
  {
  当条件为 true 时执行的代码
  }
else
  {
  当条件不为 true 时执行的代码
  }

        例如:

var a = 3;     //if else 判断大小  
var b = 5;   
if(a>b){       //只有当指定条件为 true 时,使用该语句来执行代码
  alert("a的值大");
}else{        //当条件不为true 时执行其他代码
  alert("b的值大")
}

 

      (3)、 if….else if…else
语句来挑选多个代码块之一来执行。

        语法:

if (条件 1)
  {
  当条件 1 为 true 时执行的代码
  }
else if (条件 2)
  {
  当条件 2 为 true 时执行的代码
  }
else
  {
  当条件 1 和 条件 2 都不为 true 时执行的代码
  }

        例如:

var score = 60;   //判断成绩
if(score<=100 && score>=90){
  alert("成绩优");     
}else if(score<90 && score>=80){
  alert("成绩良");    
}else if(score<80 && score>=60){
  alert("成绩及格");
}else if(score<60){
  alert("成绩差");
}

        

    2、switch语句,基于不同之标准执行不一之动作

      语法:表达式n通常为一个变量,n的值和case的值作比较,如果case匹配成功,则行该case中之代码段,每个case中要用break来阻止代码向下一个case运行。

 如果每个case中还并未break,它以履行有的case。default代表要n的价值和case都未兼容,则实施default的代码段。

switch(n)
{
case 1:
  执行代码块 1
  break;
case 2:
  执行代码块 2
  break;
default:
  n 与 case 1 和 case 2 不同时执行的代码
}

      例子:

switch (1){   //表达式的值如果等于case的值,并且类型值相同,就运行相应case代码
  case 1:
    alert("1");
    break;   //如果不写break,它将执行所有的case,直到遇到某一个case中写了break
  case 2:
    alert("2");
    break;
  default:  
    alert("如果上面的case与n的值都不匹配,则执行我哦~");
    break;
}

 

    3、循环流程控制(for,while,do while)

      当我们需要再执行有一个动作要运行相同之代码的时节,我们便得利用循环

      (1)、for循环

        语法:

for (语句 1; 语句 2; 语句 3){
    被执行的代码块
 }

        语词 1 在循环起来前实行,通常咱们会当此处声明一个变量

        语词
2 定义运行循环的原则,通常咱们见面当这边描绘一个表达式  

        语句3独发于此次巡回完成后才行,通常我们会于这里描绘一个变量的自增或自减,

        例如:

//for循环小例子   求1-100的和
var sum = 0;   
for(var i=1;i<=100;i++){
  sum = sum + i;
}
document.write(sum);

      

      (2)、while循环

        语法:

while (条件){
  需要执行的代码
}

        例如:

       //while循环1-10
       var i=1;
            while(i<=10){
                document.write(i+'<br/>');
                i++;
            }    

 

      (3)、do while循环

        语法:do/while 循环是 while
循环的变体。不管while中之表达式成不树立,do中的代码段都见面执行同样浅。

do
  {
  需要执行的代码
  }
while (条件);

        例如:

        //do while  
            var num = 12;
            do{  //至少被执行一次,即使为false也会执行,因为输出代码块在条件之前。
                num++;
                document.write("num的值为:"+num+"<br />");
            }
            while(num<1);

    

      (4)、break和continue

        语法:

continue;   //跳出本次循环,且continue上面的代码会执行完,continue下面的代码不会执行。
break;      //结束整个循环

        例如:

       /*break*/
            var i=1;
            while(i<=10){
                if(i==3){
                    document.write(i+'<br/>');
                    break;   //结束整个循环
                }
                document.write(i+'<br/>'); //输出的值为:1,2,3
                i++;
            }

       /*continue循环*/
            i=1;
            while(i<=10){
                if(i==3){
                    i++;   //4
                    continue;  //结束本次循环,且continue上面的代码会执行完,continue下面的代码不会执行
                }
                document.write(i+'<br/>');  //输出1,2,4,5,6,7,8,9,10
                i++; 
            }    

 

八、函数

    函数是呀?

     定义:函数是以成功有功能的代码段,意义是有益维护与再次用。

     函数命名方式:不克为此特殊字符,尽量语义化,驼峰式命名,严格区分轻重缓急写,函数名重名会产生覆盖,函数最好用事件驱动。

     函数的开创方法发生三种:

      //JS函数创建方法一:
            function fun(){
                alert("Hello JavaScript");
            }
            fun();  //定义好的函数如果不被调用,函数是不会执行的哦~

       //JS函数创建方法二:将函数存储在变量中,
            var fun =  function(){
                alert("Hello HTML");
            }
            fun();  //定义好的函数如果不被调用,函数是不会执行的哦~

       //JS函数创建方法三:构造函数,函数可以自调!
            var fun = new Function(alert("Hello Java"));

 

 

     函数的调用方法:

     //声明一个函数,并调用        
            function fun(){
                alert("Hello JavaScript");
            }
            fun();  

     <!--HTML中通过事件调用函数-->
     <p>第一题:请问你会HTML吗</p>
        <button id="a" onclick="fun()" value="会">会</button>

     

     函数的参数传递:

     所谓参数传递,就是以实参的价传递给形参。通过调试好规定形参在函数调用之前是未存在的,当函数被调用的那一刻,实参被创造,并且把实参的情节传递让形参。

        //声明一个函数increase(),括号中的num就是这个函数的形参。
            function increase(num){
                num++;
                return num;
            }
            //调用方法,并传入一个实参10,根据函数要完成的功能的不同,可传入的参数也不同,
            alert(increase(10));

      参数传递的注意事项:

     (1)、形参的命名,不能使用特殊符号,开头只能以$_字母开头,同名产生覆盖,不能有中文。

     (2)、虽然JS属于弱类型语言,不强制要求形参和实参必须个数相等,但是实际项目中,形参有多少个,实参我们就传入多少个。

 

      参数传递包含两种方式:值传递及援传递。 

        值传递:形参是实参值的一个副本,对形参的改变不会影响实参 
        
        引用传递(object,array等):形参实际上是对实参引用变量的复制,导致这实参、形参都指向同一个对象实体。形参改变会同时改变实参的值。 

       //值传递
            var a = 10;
            function increase(a){
                a++;
                return a;
            }
       increase(a); //弹出形参11
       alert(a);    //弹出实参10
       //a的值并没有显示预期中的11,还是10。因为形参a和实参a是两个不同的变量,形参a的变化和实参a没有任何关系。

        /*引用传递*/
            //声明一个person对象
            var person = {
                name:'Tom',
                age:22
            }
            function myfunc(person){
                person.name='jeck';
                alert(person.age); //22
            }
            myfunc(person);
            alert(person.name);  //输出jeck,而不是Tom

 

      回调函数:传统函数以参数形式输入数据,并且应用返回语句返回值。理论及,在函数结尾处来一个return返回语句,结构及虽是:一个输入点和一个输出点。这比轻理解,函数本质上就是是输入和出口之间实现过程的投。但是,当函数的兑现过程充分久,你是择等待函数完成处理,还是用回调函数进行异步处理也?这种状况下,使用回调函数变得要,例如:AJAX请求。若是以回调函数进行拍卖,代码就得继承展开其他任务,而无需空等。实际支出被,经常于javascript中采用异步调用,甚至于此间强烈推荐使用!

       //回调函数
            function fun(){
                var num = 1;
                return  function(){
                    num = num *10;
                    document.write(num);
                    return num;
                };
            }
            var fun = fun();
            fun();

      

      window(浏览器对象模型):

        所有 JavaScript 全局对象、函数和变量均自动变成 window
对象的成员。

        全局变量是 window 对象的习性。

        全局函数是 window 对象的法门。

        甚至 HTML DOM 的 document 也是 window 对象的性之一。