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

随机推荐

ListView 操作
TListItem *Item; ; i < ; i++) { Item = ListView1->Items->Add(); Item->Caption = i; } Lis ...
从底层谈WebGIS 原理设计与实现(四)：WebGIS中通过行列号来换算出多种瓦片的URL 之离线地图
从底层谈WebGIS 原理设计与实现(四):WebGIS中通过行列号来换算出多种瓦片的URL 之离线地图作者:naaoveGI… 文章来源:naaoveGIS 点击数:1759 更 ...
系统批量运维管理器pexpect的使用
# pip install pexpect 或 # easy_install pexpect 1 #!/usr/bin/env python 2 import pexpect 3 child = pe ...
配置tomcat日志分割
由于Tomcat在默认情况下会将没有经过配置的web应用所产生的日志输出已及其本身的日志内容都输出到这个文件中,那么随着时间的推移,这个文件的尺寸将会越来越大,当需要检查日志内容时间会导致文件难以打开 ...
Java中的默认构造函数
java中如果在一个类中没有写明任何构造函数的,那么会存在一个无参的构造函数,如下: public class Children { private String name; private Stri ...
求数组中的逆序对的数量----剑指offer36题
在数组中的两个数字,如果前面一个数字大于后面的数字,则这两个数字组成一个逆序对.输入一个数组,求出这个数组中的逆序对的总数: 如数组{7,5,6,4},逆序对总共有5对,{7,5},{7,6},{7, ...
==、is
==.is 总结 is 是比较两个引用是否指向了同一个对象(引用比较). == 是比较两个对象的值是否相等(值比较).
java rsa 加解密
参考 http://blog.csdn.net/a394268045/article/details/52232120 package rsa; import org.apache.commons.c ...
ECMAScript6新特性之Reflect
一 Reflect.ownKeys()获取对象属性. 可枚举的.不可枚举的.自有的.继承的. let fruit = { '2' : 'mango', [Symbol.for('pink')] : ' ...
ftp指令集
想进行ftp相关编程,得了解ftp的指令集. 可参考:http://blog.csdn.net/weiyuefei/article/details/51758288 ftp的命令和指令集不同: 命令是 ...

前端之JavaScript笔记1

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

随机推荐

热门专题