zoukankan      html  css  js  c++  java
  • JavaScript学习笔记记录我的旅程

    1. 什么是JavaScript?

    (1) HTML只是描述网页长相的标记语言,没有计算,判断能力,如果所有计算,判断(比如判断文本框是否为空,判断两次密码是否输入一致)店铺放到服务器端执行的话网页的页面会非常的慢,用起来也很难用,对服务器的压力也很大,因此要求能在浏览器中执行一些简单的运算,判断,JavaScript就是一种在浏览器端执行的语言。

    (2) JavaScript和Java没有直接的关系,唯一的关系就是JavaScript原名LiveScript,后来吸取了Java的一些特性,升级为JavaScript,JavaScript有时被简称为JS。

    (3) JavaScript是解释性语言,无需编译就可以随时执行,这样哪怕语法有错误,没有语法错误的部分还是能够正确的执行。

    1. JS的开发环境

    (1) VS中JavaScript,Jqery的自动完成功能。

    (2) JS是非常灵活的动态语言,不像C#等静态语言那样严谨。

    1. JS入门

    (1)  <script type="text/javascript">

              alert(new Date().toLocaleDateString());

            </script>

    (2) JavaScript代码放到<script>标签中,<script>可以放到<head>,<body>等任意位置,而且可以有不止一个<script>标签。alert函数是弹出消息窗口,new Date()是创建一个Date类的对象,默认值就是当前的时间。

    (3) 放到<head>中的<script>在body加载之前就已经运行了,写在body中的<script>是随着页面的加载而一个个的执行的。

    (4) 除了可以再页面中声明JavaScript之外,还可以将JavaScript写在单独的JS文件中,然后在页面中引入:<script src=”common.js” type=”text/javascript”></script>。声明到单独的JS文件的好处是多页面也可以共享,减少网络流量。

    1. 事件

    (1) <a href="javascript:alert('Hello')">点击我</a>

           <a href="javascript:void(0)">我就不弹出东西</a><br />

         <a href="JSoop.htm" onclick="alert('您确认你要跳转吗?')">单击我</a>

    (2) JavaScript中也有事件的概念,当按钮被点击的时候

            1) <input type="button" value="单击我" onclick="alert('终于单击我了')" />

     2) 只有超链接的href中的JavaScript中才需要”JavaScript:”,因为他不是事件,而是把”JavaScript:’看成像”http:”,”ftp:”,”thunder://”,ed2k://,mailto://一样的网络协议,交由JS解析引擎处理,只有href中这一个特列。

    1. JS变量

    (1) JavaScript中既可以使用双引号声明字符串,也可以使用单引号声明字符串,主要是方便和HTML集成,避免转义符的麻烦。

    (2) var i=10;  //声明一个变量,名字为i,指向10这个整数,一旦指向10,i就是int类型,  alert(i);

    (3) JavaScript中有null,underfined两种,null表示变量的值为空,underfined则表示变量还没有指向任何的对象,未初始化。

    (4) JavaScript是弱类型,表示变量的时候无法:int i=10.只能通过var i=10;声明变量,和C#中的var不一样,不是C#中的那样的类型推断。

    (5) JavaScript中也可以不用var声明变量,直接用,这样的变量是”全局变量”,因此除非确实想用全局变量,否则使用的时候最好加上var。

    (6) JS是动态类型的,因此var i=10;i=”abc”是合法的。

    1. JavaScript

    (1)    var sum = 0;

            for (var i = 0; i <= 100; i++) {

                sum = sum + i;

            }

            alert(sum);

    (2) 如果JavaScript中的代码有语法错误,浏览器会弹出报错信息,查看报错信息就能帮助排查错误。

    (3) JavaScript的调试,使用VS可以很方便的进行JavaScript的调试,调试时需要注意几点:

     1) IE的调试选项要打开,Internet选项-高级,去掉”禁用脚本调试”前的勾选。

     2) 以调试方式运行界面。

     3) 设置断点,监视变量等操作和C#一样。

    1. 判断变量初始化

    (1) JavaScript中判断变量,参数是否初始化的三种方法。

    var r;             

     if (r == null) {       if (typeof (r) == "undefined") {     if (!x) {

                alert("null");              alert("undefined");                alert("不X");

            }                  }                             }

    注:推荐用最后一种方法

    1. 函数的声明

    (1) JavaScript中声明函数的方法:

    function Add(i1, i2) {

                return i1 + i2;

            }

    (2) 不需要声明返回值类型,参数类型,函数定义以function开头

    var r = Add(10, 20);

            alert(r);

            var r = Add("tom,", "您好");

            alert(r);

    (3) JavaScript中不像C#中那样要求所有路径都有返回值。

    1. 匿名函数

    (1)     var f1 = function sum(i1, i2) {

                return i1 + i2;

            }

            alert(f1(10, 20));

    (2) 类似于C#中的匿名函数。

    (3) 这种匿名的用法在Jquery中用法特别多。

    (4)     alert(function sum(i1, i2) {

                return i1 + i2;

            } (100, 10));  

    注解:C#中匿名函数使用委托来调用。

    1. JS面向对象基础

    (1) JavaScript中没有类的语法,是用函数闭包(closure)模拟出来的,下面讲解的时候还是用C#中的类,构造函数等概念,JavaScript中string,date等”类”都被叫做”对象”,JavaScript中声明类(类不是类,是对象)。

    (2)    function Person(name, age) {   //声明一个函数,当成类用

                this.Name = name;

                this.Age = age;

                this.SayHello = function () {

                    alert("你好,我是" + this.Name + ",我今年:" + this.Age + "岁了");

                }

            }

            var p1 = new Person("韩迎龙", "23");

            p1.SayHello();

    (3) 必须要声明类名,function Person(name,age)可以看做是声明构造函数,Name,Age这些属性也是使用者动态添加了。

    1. Array()对象

    (1) JavaScript中的Array对象就是数组,首先是一个动态数组,而且是一个像C#中数组ArrayList,Hashtable等的超强综合体。

    (2)         var names = new Array();

            names[0] = "韩迎龙";

            names[1] = "得到";

            names[2] = "说的";

            for (var i = 0; i < names.length; i++) {

                alert(names[i]);

            }

    (3) 无需预先制定大小,动态。

    1. Array()练习1

    (1) Array练习,求出一个数组中的最大值。

        <script type="text/javascript">

            function MyMax(arr) {

                var max = arr[0];

                for (var i = 0; i < arr.length; i++) {

                    if (arr[i] > max) {

                        max = arr[i];

                    }    }

                return max;

            }

            var arr = new Array();

            arr[0] = 20;

            arr[1] = 10;

            arr[2] = 34;

            alert(MyMax(arr));

        </script>

    1. Array()练习2

    (1) 将一个字符串数组的元素的顺序进行反转,{3,9,5,34,54}{54,34.5.9.3}。不要使用JavaScript中的反转函数,提示:第i个和第length-i-1进行交换,定义函数。

    <script type="text/javascript">

            function MyReverse(arr) {

                for (var i = 0; i < arr.length / 2; i++) {

                    var temp = arr[i];

                    arr[i] = arr[arr.length - i - 1];

                    arr[arr.length - i - 1] = temp;

                }

            }

            var arr = new Array();

            arr[0] = "3";

            arr[1] = "9";

            arr[2] = "5";

            arr[3] = "34";

            arr[4] = "54";

            alert(arr);

            MyReverse(arr);

            alert(arr);

    1. Array()练习3

    (1) 将一个字符串数组输出为|分割的形式,比如:韩迎龙|试试|订单。不要使用JavaScript中的Join函数,arr.join(1)将数组用分割符链接成一个字符串。

    <script type="text/javascript">

            function MyJoin(arr) {

                if (arr.length <= 0) {

                    return;

                }

                var s = arr[0];

                for (var i = 1; i < arr.length; i++) {

                    s = s + "|" + arr[i];

                }

                return s;

            }

            var arr = new Array();

            arr[0] = "韩迎龙";

            arr[1] = "试试";

            arr[2] = "订单";

            alert(MyJoin(arr));

            //第二种方法

            alert(arr.join("|"));

        </script>

    1. Array的字典用法

    (1) JS中的Array是一个宝贝,不仅是一个数组,还是一个Dictionary,还是一个Stack。

    (2)    var names = new Array();

            names["人"] = "ren";

            names["扣"] = "kou";

            names["手"] = "shou";

            alert(names["人"]);

            alert(names.人);

            for (var k in names) {

                alert(k);

            }

    (3) 像Hashtable,Dictionary那样用,而且像他们一样的效率高。

    1. Array()的简化声明

    (1) Array还可以有简化的方式

    var arr=[3,4,5,6,7];  //普通数组初始化

    这种数组可以看做是names[“人”]=”ren”;的特例,也就是key为0,1,2,3,4,5

    (2) 字典风格的简化创建方式

     var arr={”tom”=30,”jim=”30};

    1. 数组,for和其它

    (1) 对于数组风格的Array来说,可以使用join方法拼接为字符串。

            var arr = ["tom", "jim", "kencery"];

            alert(arr.join(","));  //JS中join是array的方法,不像.net中是string的方法

    (2) for循环可以像C#中的foreach一样的使用。

            for (var e in document) {

                alert(e);

            }

  • 相关阅读:
    转:浅谈图片服务器的架构演进
    转:Spring AOP详解
    转:Spring AOP 注解方式实现的一些“坑”
    spring AOP自定义注解方式实现日志管理
    spring的普通类中如何取session和request对像
    spring session
    转:通过Spring Session实现新一代的Session管理
    转:一个Restful Api的访问控制方法(简单版)
    Python : 什么是*args和**kwargs[转载]
    tornado项目注意点
  • 原文地址:https://www.cnblogs.com/hanyinglong/p/2509195.html
Copyright © 2011-2022 走看看