JavaScript提升日No1

1.JavaScript分为三个部分:

• ECMAScript标准:JavaScript基本语法
• DOM:文档对象模型
• BOM:浏览器对象模型

2.JavaScript介绍及作用

• JavaScript简称:JS,原名为LiveScript,后改名为JavaScript,由网景公司的Brendan Eich开发设计,是一门基于对象的语言,可以跨平台。
• JS是一门弱类型语言、脚本语言、解析型语言、动态语言。
• JS最初目的:解决交互问题（前后台的交互，数据交接）

3.JS语法及注意事项:

• JS区分大小写:var n=10;console.log(N);小n和大N不是同一个变量
• JS中字符串可以用单引号或者双引号
• 每一行代码结束用分号:var num=100;
• 声明变量都用var:如:var number=10;var str=”哈哈,我又变帅了”;

4.JS中的注释:

• 单行注释:
  //注释内容
• 多行注释:
  /注释内容/

5.JS的代码写在页面中的script标签:如:

<script>    alert("该行代码可以弹出一个对话框");  </script>注意:如果js代码是在一个js文件中,那么在html标签中想要使用该js文件中的js内容,需要在html标签中引入外部的js文件,如下:<script src="路径/test.js"></script>上面的代码的作用是引入外部的js文件,不可以在这对script标签中再写其他的js代码,否则可能会出现问题.在html标签中script标签一般在head标签中或者在body标签中的最后,script标签可以出现多对.

6.异步和同步:

• 同步:直白解释:一个人有顺序的做多件事,例子:小明上厕所后才能吃饭,不可能上厕所同时吃饭.在js中代码执行有先后顺序

  • async:异步,属性和值就是自己本身,页面加载后就开始下载js文件,下载完毕后就执行
    
    alert("1");
    
    
    
    alert("2");
    
    
    alert("3");
    

• 异步:直白解释:多个人同时做多件事,例子:小明切菜,小红煮饭,多件事同时做,在js中代码可以同时进行。

  • defer:异步,属性和值就是自己本身,页面加载后就开始下载js文件,所有内容加载和下载完毕后才执行
    
    alert("1");
    
    
    
    alert("2");
    
    
    alert("3");
    

7.案例:交换两个变量的值

        //第一种:利用第三方变量进行交换        //使用第三方变量//        var num1=10;//        var num2=20;//        var temp=num1;//        num1=num2;//        num2=temp;//        console.log(num1);//        console.log(num2);        //第二种:利用相加和相减进行交换        //使用和差计算//        var num1=10;//        var num2=20;//        num1=num1+num2;//num1=30//        num2=num1-num2;//num2=10//        num1=num1-num2;//num1=20//        console.log(num1);//        console.log(num2);        //第三种:利用位元算进行交换        //使用补位//        var num1 = 10;//        var num2 = 20;//        num1 = num1 ^ num2;//num1=30//        num2 = num1 ^ num2;//num2=10//        num1 = num1 ^ num2;//num1=20//        console.log(num1);//        console.log(num2);

8.JS中变量的命名规范:

• 声明变量都用var,变量名以、字母、下划线开头，中间可以包含字母、数字、下划线或者、 。
• 如果变量是由多个单词组合,那么第一个单词首字母小写,其他单词的首字母大写，遵循驼峰命名法。

9.JS中的数据类型:

• string,number,boolean,undefined,null,object这些都是js的原始数据类型,这是数据类型定义的变量都是通过typeof关键字来获取变量的类型,代码如下:
• （判断一个已经申明的变量，或者是一个值的类型的方法）。
  console.log(typeof 变量名);
  或者
  console.log(typeof(变量名));

10.数据类型转换:

• 其他类型转数字类型：parseInt(),parseFloat(),Number()
• 其他类型转字符串类型:tostring(),String()
• 其他类型转布尔类型:Boolean()

11.运算符:

• 算数运算符：+ - * / % ++ –
  
  • 算术运算表达式:有算术运算符连接起来的表达式

• 复合运算符: += -= *= /= %=

  • 复合运算表达式:由复合运算符连接起来的表达式
    var num=10;
    num+=10;
    console.log(num);
    以上代码等价于下面的代码
    var num=10;
    num=num+10;
    console.log(num);

• 比较运算符: > < >= <= == === != !==

  • 比较运算表达式:由比较运算符连接起来的表达式
  • 比较运算表达式的结果为布尔类型
    var num1=10;
    var num2=20;
    console.log(num1===num2);//结果为false
• 逻辑运算符:&& || !
  
  • 逻辑运算表达式:由逻辑运算符连接起来的表达式
  • 逻辑运算表达式的结果为布尔类型
    var name=”admin”;
    var pwd=”123”;
    console.log(name===”admin”&&pwd===”123”);//结果true
  • 逻辑运算表达式关系如下:
    表达式1&&表达式2 只要有一个表达式的结果为false,整个结果为false
    表达式1||表达式2 只要有一个表达式的结果为true ,整个结果为true
    !表达式 表达式结果为false,整个结果为true,否则结果为false

12.流程控制:

• 顺序结构:代码从上至下的执行顺序

• 分支结构:if,if-else,if-else if-else if-else switch-case,三元运算符: 表达式1?表达式2 :表达式3

  • if语句:语法: if(表达式){ 代码1} 如果表达式结果为true,则执行代码1
    var num=10;
    if(num>5){
    console.log(“哈哈,我又变帅了”);
    }//结果为:哈哈,我又变帅了
  • if-else语句:语法:if(表达式){代码1}else{代码2}如果表达式结果为true则执行代码1,否则执行代码2
    var age=18;
    if(age>=18){
    console.log(“可以看电影了”);
    }else{
    console.log(“写作业去”);
    }//结果为:可以看电影了
  • if-else if语句:语法:if(表达式1){代码1}else if(表达式2){代码2}else{代码3},表达式1为true则执行代码1,如果表达式2结果为true则执行代码2,否则执行代码3
    var score=90;
    if(score>90){
    console.log(“A”);
    }else if(score>80){
    console.log(“B”);
    }else{
    console.log(“C”);
    }//结果为:B
  • switch-case语句:switch(表达式){case 值1:代码1;break;case 值2:代码1;break;default:break;}
    var num=10;
    switch(num){
    case “10”:console.log(“字符串类型”);break;
    case 10:console.log(“数字类型”);break;
    default:console.log(“都不是”);break;
    }//结果为:数字类型
    //注意:switch-case 中的表达式在判断的时候等价于 ===

• 循环结构: while循环,do-while循环,for循环,for-in循环

  • while语句:while(表达式){代码1}表达式如果为true则一直执行代码1
    var i=0;
    while(i<10){
    console.log(“爱学习,我好开心”);
    i++;
    }
  • while循环特点:先判断条件是否成立,成立则一直循环
  • do-while语句:do{代码}while(表达式)先执行代码,然后判断表达式是否成立为true
    var num=10;
    do{
    console.log(“哈哈,我又变帅了”);
    num++;
    }while(num<5);
  • do-while循环特点:至少执行一次循环
• continue:在循环中遇到continue直接进行下一次循环
• break:循环中遇到break则会跳出当前循环