zoukankan      html  css  js  c++  java
  • 前端之JavaScript笔记1

    一 JavaScript的引入方式

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <!--<script>-->
            <!--alert("你好!")-->
        <!--</script>-->
        <script src="index.js"></script>
    </head>
    <body>
    
    </body>
    </html>
    View Code

    index.js文件

    /**
    *Created by Administrator on 2017/8/7.
    */
    alert(123);
    View Code

    二 JavaScript的变量,常量和标识符

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            /*
            多行注释的类容
            */
            //               单行注释的内容
    
        //声明赋值一个变量
          /*  var i:
            i=10;
            var j=20;
          */
        //一行声明多个变量,以都好分开每一个变量
        //    var name="fang",age=18;
    
        //js以分号为一条语句的分隔符号
        /*    var i=12;
            var j=20;
            alert(i);
            alert(j);
        */
    
        //一个变量如果只声明未赋值,则会打印出undefind
        /*    var x;
            alert(x);
    
            var n=10;
            var N=3.1415926;
        */
        </script>
    </head>
    <body>
    
    </body>
    </html>
    View Code

    三 js 数据类型

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
    /*        var i=100.89;
            var s1="hello";
            var b=false;
    
            console.log(typeof i);   //number
            console.log(typeof s1);   //string
            console.log(typeof b);   //booleam
            */
    
    /*        var arr=[111,222,"hello"];
            var obj={"name":"egon","age":"84"}
            var obj2={name:"fang",age:"18"}
    
            console.log(typeof arr);      //object
            console.log(typeof obj);    //object
            console.log(obj["name"]);    //object
            console.log(obj);           //object
    
            console.log(obj2);
            */
    
    //    Undefined :1 当变量只声明未赋值,的到返回值undefined值;
                //    2 当一个函数没有返回值时,默认返回一个undefined值。
       /*     var a;
            console.log(a);       //undefined
            console.log(typeof a);    //undefined
            */
    
    //        var a=null;
    //        console.log(a);   //null
    //        console.log(typeof a);     //object
    
    
            //NAN值属于Number类型:当遇到将字符串转成数字无效时,就会得到一个NaN数据
    
        var s="fang";
        var ret2=+s;
        console.log(ret2);   //NaN
        console.log(typeof ret2)   //number
    
        </script>
    </head>
    <body>
    
    </body>
    </html>
    View Code

    四 布尔类型

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            console.log(true+2);
            console.log(false+2);
    
            if(1){
                console.log("ok");
            }
        </script>
    </head>
    <body>
    
    </body>
    </html>
    View Code

    五 运算符

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            //x++  ++x
            <!--var x=10;-->
                <!--x+=1;-->
    
    
            //x++  : 先赋值在计算
    
            <!--var ret=x++;  //x++(x=x+1)-->
    
            // ++x  先计算后赋值
            <!--var ret1=++x;  //++x(x=x+1)-->
    
            <!--console.log(x);-->
            <!--console.log(ret);-->
            <!--console.log(ret1);-->
    
    
    
    
            //   ===  !==
            <!--console.log(2==="2");-->
    
    
            //!  &&   ||  逻辑或与非
    
            <!--var name="egon";-->
            <!--var gender="male";-->
            <!--if (name=="egon"  && gender=="males"){-->
                <!--console.log("success!");-->
                <!--}-->
    
            //  +  :  字符串拼接
    
            console.log("hello"+"world");
            console.log("hello"+234);
        </script>
    </head>
    <body>
    
    </body>
    </html>
    View Code

    六 流程控制

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
    /*            //if 表达式;
                    pass
                //JS 的if语句
    
            //双分支
                if (表达式){
                    执行语句
                }
    
    
            //多分支语句
                if (表达式){
                    执行语句
                }
                else if (表示式){
                    执行语句
                }
    
                else {
                    执行语句
                }
                */
    
    /*        //练习:
            var num=67;
            if (num>90){
                alert("优秀")
            }
            else if (num>80){
                alert("良")
            }
            else if (num>60){
                alert("及格")
            }
            else {
                alert("不及格")
            }
            */
    
    //   switch case语句
     /*       var week=3;
            switch(week){
                case 1:console.log("星期一");break;
                case 2:console.log("星期二");break;
                case 3:console.log("星期三");break;
                case 4:console.log("星期四");break;
                case 5:console.log("星期五");break;
                case 6:console.log("星期六");break;
                case 7:console.log("星期日");break;
            }
            */
    
    
     //for 循环:
     //for 循环方式1:条件循环   (强烈推荐)
    /*        for (var i=0;i<10;i++){
                console.log(i);
                }*/
    
    //for  循环方式2: 遍历循环
    /*        var arr=[111,222,333];
            for (var i in arr){
                console.log(i,arr[i])
                }*/
    
    <!--//while 循环-->
            <!--while (表达式){-->
                <!--循环体-->
                <!--}-->
            <!--var count=0;-->
            <!--var sum=0;-->
            <!--while (count<101){-->
                <!--sum+=count;-->
                <!--count++;-->
                <!--}-->
                <!--console.log(sum);-->
    
    
            var sum2=0;
            for (var i=0;i<101;i++){
                sum2+=i;
                }
                console.log(sum2);
    
                //break退出整个循环,continue退出当次循环
        </script>
    
    </head>
    <body>
    
    </body>
    </html>
    View Code

    七 字符串对象

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            var s="hello world";
        // console.log(s.length);
    
            console.log(s.charAt(4));
            console.log(s.lastIndexOf("l"));
            console.log(s.indexOf("l"));
    
            console.log(s.substr(3,4));  // lo w
            console.log(s.substring(3,4));  // l  顾头不顾尾
    
            console.log(s.concat(" egon"));
        </script>
    </head>
    <body>
    
    </body>
    </html>
    View Code
  • 相关阅读:
    WPF 使用 Direct2D1 画图 绘制基本图形
    WPF 使用 Direct2D1 画图 绘制基本图形
    dot net core 使用 IPC 进程通信
    dot net core 使用 IPC 进程通信
    win2d 图片水印
    win2d 图片水印
    Java实现 LeetCode 240 搜索二维矩阵 II(二)
    PHP closedir() 函数
    PHP chroot() 函数
    PHP chdir() 函数
  • 原文地址:https://www.cnblogs.com/fangjie0410/p/7301114.html
Copyright © 2011-2022 走看看