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
  • 相关阅读:
    Android RSS阅读器
    X86汇编语言学习教程之1 ————前言
    beanstalk源码剖析——概述
    从软件质量看如何写代码(1)
    软件开发模型
    软件质量思考
    数据结构概述
    Don't Distract New Programmers with OOP(转)
    Linus Torvalds’s Lessons on Software Development Management(转)
    谈测试驱动开发
  • 原文地址:https://www.cnblogs.com/fangjie0410/p/7301114.html
Copyright © 2011-2022 走看看