前端之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>

index.js文件

/**

*Created by Administrator on 2017/8/7.

*/

alert(123);

二 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>

三 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>

四布尔类型

<!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>

五运算符

<!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>

六流程控制

<!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>

七字符串对象

<!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>

前端之JavaScript笔记1的更多相关文章

前端之JavaScript笔记4
一按键事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
前端之JavaScript笔记3
一创建添加节点 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
前端之JavaScript笔记2
一数组对象 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
每天成长一点---WEB前端学习入门笔记
WEB前端学习入门笔记从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...
【原】javascript笔记之Array方法forEach&map&filter&some&every&reduce&reduceRight
做前端有多年了,看过不少技术文章,学了新的技术,但更新迭代快的大前端,庞大的知识库,很多学过就忘记了,特别在项目紧急的条件下,哪怕心中隐隐约约有学过一个方法,但会下意识的使用旧的方法去解决,多年前ES ...
前端：jQuery笔记
前端:jQuery笔记此系列文章乃是学习jQuery的学习笔记. Asp.net MVC Comet推送摘要: 一.简介在Asp.net MVC实现的Comet推送的原理很简单. 服务器端:接收 ...
spring mvc 及NUI前端框架学习笔记
spring mvc 及NUI前端框架学习笔记页面传值一.同一页面直接通过$J.getbyName("id").setValue(id); Set值即可二.跳转页面(bus ...
前端学习:学习笔记(JS部分）
前端学习:学习笔记(JS部分) 前端学习:JS学习总结(图解) JS的简介 JS基本语法 JS内置对象 JS的函数 JS的事件 JS的BOM JS的DOM JS的简介新建步骤 <body ...
前端之JavaScript基础
前端之JavaScript基础本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...

随机推荐

Mysql 开启Federated引擎以及使用
FEDERATED是其中一个专门针对远程数据库的实现.但通过FEDERATED引擎创建的表只是在本地有表定义文件,数据文件则存在于远程数据库中通过这个引擎可以实现类似Oracle 下DBLINK的远程 ...
Requests库入门
安装: $ pip install requests Response对象的一些基本属性: Response.status_code 请求的返回状态,正常为200 Response.text 页面的字 ...
NPOI操作word文档1
1.首先进行XWPFDocument类的实例化,该类的实例对应一个word文档 XWPFDocument MyDoc = new XWPFDocument(); 2.设置页面的大小 CT_SectPr ...
jsp 调用其他jsp页面跳转
response.sendRedirect("test2.jsp"); window.location.reload("test2.jsp"); locatio ...
jquery ajax 赋值问题, 后面程序判断逻辑用
添加async:false; 像 $.get() 等是没有async参数的, 所以需要用到如下 $.ajaxSetup({ async : false //这个意思是等这个ajax有了返回值后才会执行 ...
tomcat的catalina.out日志文件过大
今天发现一个服务器的/opt目录数据过大,最后发现是tomcat中的catalina.out日志过大引起的用du命令查看opt下一层的数据文件大小 [root@ccssapportalp opt]# ...
neo4j 常用命令查询，以及更新节点的 label 名和 property 名
常用命令查询 https://neo4j.com/docs/cypher-refcard/current/ 更新节点的 labels 有时候发现节点的 label 名字起错了怎么修改呢?!一个节点是 ...
jqeury datatable/http://www.cnblogs.com/jobs2/p/3431567.html
0.http://blog.csdn.net/mickey_miki/article/details/8240477 1.1 修改默认值代码 841处options 添加分页选择 oInit.bL ...
hmm 软件的使用
1)使用HMM模型搜索序列数据库(以青蟹蛋白库为例,简写为qingxie.pep),同源参考序列(query.fas) hmmbuild: 用多重比对序列构建HMM模型:hmmsearch: 使用HM ...
tomcat manager
在点击tomcat manager的时候提示以下内容: You are not authorized to view this page. By default the Host Manager is ...

前端之JavaScript笔记1

前端之JavaScript笔记1的更多相关文章

随机推荐

热门专题