zoukankan      html  css  js  c++  java
  • Javascript基础

    JavaScript的组成:

      Javascript基础分为三个部分:

        1,ECMAScript:JavaScript的语法标准,包括变量,表达式,运算符,函数,if语句,for语句等。

        2,DOM:操作网页上的元素的API。比如让盒子移动,变色,轮播图等。

        3,BOM:操作浏览器部分功能的API。比如让浏览器自动滚动。

    JavaScript的特点:

      1,简单易用:可以使用任何文本编辑工具编写,只需要浏览器就可以执行程序。

      2,解释执行(解释语言):事先不编译,逐行执行,无需进行严格的变量声明。

      3,基于对象:内置大量现成对象,编写少量程序可以完成目标。

    第一个JavaScript代码:

    !DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script>
            alert("顾清秋")
        </script>
    </head>
    <body>
        
    </body>
    </html>
    View Code

    alert:弹出警告框。

    语法规则:

      1,JavaScript对换行,空格,缩进不敏感。末尾一定要加分号。

      2,所有的符号,都是英语的。

      3,JavaScript的注释:单行注释://   。  多行注释:/**/  。

    JavaScript在网页中输出信息的写法:

      弹出警告框:alert('')

      控制台输出:console.log(")

    console.log(")表示在控制台中输出,console表示“控制台”,log表示"输出"。

    控制台在chrome浏览器的F12中。 

    用户输入:prompt()语句

      prompt() 就是专门用来弹出能够让用户输入的对话框。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script>
            alert("顾清秋")
            var a = prompt('请输入你的姓名:')
            alert(a)
            console.log(a)
        </script>
    </head>
    <body>
    
    </body>
    </html>
    prompt

      prompt语句,输入的内容都会转成字符串的方式打印出来。

    直接量:数字和字符串

      ”直接量“即常量,也称为“字面量”。

      1,数字。2,字符串。

    变量的定义和赋值:

      定义变量:var 变量名。

      变量的赋值:如: var a = 10;

    变量的命名规范:

      只能由字母,数字,下划线,美元符号$构成,且不能以数字开头。

    下列的是保留字,不允许被当作变量名:

    abstract、boolean、byte、char、class、const、debugger、double、enum、export、extends、final、float、goto
    implements、import、int、interface、long、native、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile

    变量的类型:

      变量里面能够存储数字,字符串等,变量会自动的根据存储的内容的类型的不同来决定自己的类型。

    数值型:number

      存放数字的类型就是数值型。

      typeof():可以查看变量的类型。

      在JavaScript中,只要是数就是数值型。

    字符串型:string  

    var a = "abcde";
        var b = "路飞";
        var c = "123123";
        var d = "哈哈哈哈哈";
        var e = "";     //空字符串
    
        console.log(typeof a);
        console.log(typeof b);
        console.log(typeof c);
        console.log(typeof d);
        console.log(typeof e);
    View Code

    连字符和加号的区别

    键盘上的+可能是连字符,也可能是数字的加号。如下:

       console.log("我" + "爱" + "你");   //连字符,把三个独立的汉字,连接在一起了
        console.log("我+爱+你");           //原样输出
        console.log(1+2+3);             //输出6

    总结:如果加号两边都是数值,此时是加。否则,就是连字符(用来连接字符串)。

    变量值的传递(赋值):

    语句:

       a = b;

    把b的值赋给a,b不变。

    将等号右边的值,赋给左边的变量;等号右边的变量,值不变。

    举个特殊的例子:

            var a = "3";
            var b = 2;
            console.log(a-b);

    效果:(注意,字符串 - 数值 = 数值)

    变量格式转换

    用户的输入

    我们在上面的内容里讲过,prompt()就是专门用来弹出能够让用户输入的对话框。重要的是:用户不管输入什么,都是字符串。

    parseInt():字符串转数字

    parseInt()可以将字符串转数字。parse表示“转换”,Int表示“整数”(注意Int的拼写)。例如:

    字符串转数字的方法:

     parseInt(“5”);

    parseInt()还具有以下特性

    (1)带有自动净化的功能;只保留字符串最开头的数字,后面的中文自动消失。例如:

    console.log(parseInt("2018你真帅!!");

    (2)自动带有截断小数的功能:取整,不四舍五入

    var a = parseInt(5.8) + parseInt(4.7);
    console.log(a);
     var a = parseInt(5.8 + 4.7);
     console.log(a);

    数据类型:

    基本数据类型:

      number:

    var a = 123;
    //typeof 检查当前变量是什么数据类型
    console.log(typeof a)
    //特殊情况
    var a1 = 5/0;
    console.log(typeof e1) //Infinity 无限大. number类型

      string:

    var str  = '123'
    console.log(typeof str)

      boolean:

    var b1 = false;
    console.log(typeof b1)

      null:

    var c1 = null;//空对象. object
    console.log(c1)

      undefined:

    var d1;
    //表示变量未定义
    console.log(typeof d1)

    引用数据类型:

    • Function
    • Object
    • Arrray
    • String
    • Date

    赋值运算符:

      以var x = 12, y = 5 示例:

    算术运算符:

      var a = 5 , b = 2

     比较运算符:

    字符串的拼接:

    var  firstName  = '小';
    var lastName = '马哥';
    var name = '伊拉克';
    var am = '美军';
    // 字符串拼接
    var str = "2003年3月20日,"+name+"战争爆发,以美军为主的联合部队仅用20多天就击溃了萨达姆的军队。这是继十多年前的海湾战争后,"+am+"又一次取得的大规模压倒性军事胜利。"
    var fullStr = str;
    console.log(fullStr)
    
    var fullName = firstName +" "+ lastName;
    console.log(fullName)
    View Code
    // 不能对字符串进行+运算 只能拼接
    var a1 = '1';
    var a2 = '2';
    console.log(a1-a2) //12
    var b1 = 'one';
    var b2  = 'two';
    
    // NaN. ==== not a number 是number类型
    console.log(typeof(b1*b2))

    数值型转换成字符串类型:

    隐式转换:

    var n1 = 123;
    var n2 = '123';
    var n3 = n1+n2;
    // 隐式转换:会将数值型转换成字符串型,然后进行拼接。
    console.log(typeof n3);

    强制类型转换:

    // 强制类型转换String(),toString()
    var str1 = String(n1);
    console.log(typeof str1);
    
    var num = 234;
    console.log(num.toString())

    将字符串类型转换成数值类型:

    var  stringNum = '789.123wadjhkd';
    var num2 =  Number(stringNum);
    console.log(num2); //NaN   Not a Number  不是一个数值,但是NaN是数值类型。  
    //类似于遍历 将数值型遍历出来直到遇到非数字。
    
    // parseInt()可以解析一个字符串 并且返回一个整数
    console.log(parseInt(stringNum));  // 789
    console.log(parseFloat(stringNum)); // 789.123

    任何数据类型都可以转换为boolean类型:

    var b1 = '123';
            var b2 = 0;
            var b3 = -123;
    
            var b4 = Infinity; 
            var b5 = NaN;
    
            var b6; //undefined
            var b7 = null;
    
            // 非0既真
            console.log(Boolean(b1)); // true
            console.log(Boolean(b2));  // false   
            console.log(Boolean(b3));  // true
            console.log(Boolean(b4));  // true
            console.log(Boolean(b5));  // false
            console.log(Boolean(b6));  // false
            console.log(Boolean(b7));  // false
    View Code

    流程控制:

      if            if else            if  else if  else

            var a = 18;
            if (a>=20){
                console.log('恭喜恭喜');
            }
            else if(a<20 && a>=15){
                console.log('不错');
            }
            else if(a<15 && a>=10){
                console.log('很好');
            }
            else{
                console.log('抱歉');
            }

    逻辑与&& 逻辑或 ||:

    //1.模拟  如果总分 >400 并且数学成绩 >89分 被清华大学录入
    //逻辑与&& 两个条件都成立的时候 才成立
    if(sum>400 && math>90){
        console.log('清华大学录入成功')
    }else{
        alert('高考失利')
    }

    switch:

    var gameScore = 'better';
    
    switch(gameScore){
    
    //case表示一个条件 满足这个条件就会走进来 遇到break跳出。break终止循环。如果某个条件中不写 break,那么直到该程序遇到下一个break停止
        case 'good':
        console.log('玩的很好')
        //break表示退出
        break;
        case  'better':
        console.log('玩的老牛逼了')
        break;
        case 'best':
        console.log('恭喜你 吃鸡成功')
        break;
    
        default:
        console.log('很遗憾')
    
    }

    while 循环:

    var i = 1; //初始化循环变量
    
    while(i<=9){ //判断循环条件
        console.log(i);
        i = i+1; //更新循环条件
    }

    do_while:

    //不管有没有满足while中的条件do里面的代码都会走一次
    var i = 3;//初始化循环变量
    do{
    
        console.log(i)
        i++;//更新循环条件
    
    }while (i<10) //判断循环条件

    for 循环:

    for(var i = 1;i<=10;i++){
         console.log(i)
     }

      1~100之间所有数的和:

    var sum = 0;
    for(var j = 1;j<=100;j++){
        sum = sum+j
    }
    console.log(sum)

      双重for循环:

    for(var i=1;i<=3;i++){
                
       for(var j=0;j<6;j++){
            document.write('*')
        }
                
       document.write('<br>')
     }

    在浏览器中输出直角三角形:

    for(var i=1;i<=6;i++){
       for(var j=1;j<=i;j++){
            document.write("*");
       }
                    
         document.write('<br>');
    }

    在浏览器中输出等腰三角形:

              for(var i=1;i<=6;i++){ //行数
                    
                    //控制我们的空格数
                    for(var s=i;s<6;s++){
                        document.write('&nbsp;')
                    }
                
    
                    for(var j=1;j<=2*i-1;j++){
                        document.write('*')
                    }
                    document.write('<br>')
                    
                }
  • 相关阅读:
    fork子进程
    多输入使用多线程
    多输入select
    多输入之轮询
    开启telnet
    slickedit编译调试linux应用程序
    电子书框架
    通用Makefile
    STDIN_FILENO和stdin
    libiconv交叉编译提示arm-none-linux-gnueabi-gcc
  • 原文地址:https://www.cnblogs.com/stfei/p/9101924.html
Copyright © 2011-2022 走看看