zoukankan      html  css  js  c++  java
  • 开始学Javascript啦。

    1、Javascript执行顺序
      1.1、Javascript是页面执行顺序,从上到下逐行执行的
       实例1:
       <script type="text/javascript">
        alert(new Date().toLocaleDateString());//显示本地当前时间
       </script>
       实例2:
      1.2、事件 onclick……
       <!--这里的href=""不是事件,是属性-->
       <a href="javascript:alert('Show me')">Show Me</a>
      
    2、变量类型
      2.1、声明变量都是用 var ,动态类型。
      2.2、命名规则:以字母、下划线或$开头,中间可以包括字母、数字、下划线或$。
      2.3、可以双引号,也可以单引号声明变量。如:var name='cy' 或name="cy"
      2.4、不用声明直接使用的变量是全局变量。如:name="yi";
      
       1、默认如果直接在script标签中定义变量,则属于“全局作用域范围”(全局执行环境),即属于window对象。
       2、全局作用域范围的变量直到网页关闭或浏览器关闭时才释放资源
       3、一个页面中的多个<script>标签中的变量可以互相访问。
       4、JS有垃圾回收机制,会定时对可释放资源的变量回收。将变量设置为null则表示可以被回收了。

      2.5、null与undefined区别:
        1、undefined表示一个未知状态
         (1)、声明了,但是没有初始化该变量,变量的值是一个未知状态(undefined)
         (2)、方法没有明确的返回值时,返回值是一个undefined
         (3)、对未声明的变量使用typeof运算符时,显示为undefined
        2、null表示尚未存在的对象,可以为变量赋值为null,用null初始化变量,清除变量内容,释放内存
        3、undefined==null,结果为true,但含义不同。
        4、undefined===null 结果为false,先判断类型,然后判断值。
      2.6、JavaScript中判断已声明变量、参数是否初始化(可用)的方法
        1、if(typeof(x)!='undefined' && x!=null){ alert('可用')};
        2、if(x) {alert('变量可用')};  null、undefined、0都认为是false
        推荐用最后一种方法。但如果x有可能没有声明,则只能用typeof判断(否则会报错)
        
    3、函数
      3.1、不需要声明返回值类型、参数类型。函数定义以function开头:function Fun(name,age){};
      3.2、JavaScript中不像C#中那样要求所有路径都有返回值,没有返回值就是undefined。
      3.3、javascript中没有方法重载。
       实例(实现方法重载可以通过arguments参数数组实现)
        function Fun()
        {
         for(var i=0;i<arguments.length;i++)
         {
          document.write(arguments[i]);
         }
        }
        Fun("hello",22,true);//实现调用
        
      3.4、匿名函数:
        实例(匿名函数的使用)
        var a=function(x1,x2){ return x1+x2;};
        alert(a(2,4));
        
    4、面向对象
      4.1、函数就是对象,对象就是函数。
      4.2、方法直接调用为函数,使用new 为对象。
       实例1(一般方法写一个Person对象)
        function Person(){}; //创建一个Person对象
        var p=new Person(); //创建对象
        p.Name='张三';//动态语言,直接属性赋值
        p.Age=21;
        p.SayHello=function(){ alert('Hello!')};//对象方法
        alert(p.Name);//获取对象属性
        alert(p['Age']);另一种动态访问属性的方式
        
       实例2(闭包创建对象,使用this)

        function Person(Name,Age)
        {
         this.Name=Name;//为属性赋值
         this.Age=Age;
         this.ShowMe=function()
         {
          alert('大家好啊!,我叫'+this.Name+',今年'+this.Age+'岁。');
         }
        }
        var cy=new Person('caoyi',22);
        cy.ShowMe();
    

    5、String字符串
      5.1、length属性:获取字符串的字符个数。   如:var str='我是abc';alert(str.length);//结果为 5
      5.2、charAt(index)方法:获取指定索引位置的字符(索引从0开始)。如:alert(str.charAt(1));//结果为 '是'
      5.3、indexOf(‘字符串’,startIndex)方法:获取指定字符串第一次出现的位置。startIndex表示从第几个开始搜索。
      5.4、split(‘分隔符’,limit);//根据分隔符将一个字符串返回为一个数组。
      5.5、substr(startIndex,len)//从startIndex开始,截取len个字符。
      5.6、substring(startIndex,stopIndex)//从startIndex开始,截取到stopIndex位置(不包括stopIndex所在的字符)。
      5.7、toUpperCase()//转换大写、toLowerCase();//转换小写。
      5.8、match()、replace()、search()方法,正则表达式相关。

    6、Array数组
      6.1、Array对象就是动态数组,类似于c#中的ArrayList、Hashtable等的综合
      6.2、无需预先定义大小,可以动态创建
      
      实例1(创建数组)

       var names=new Array();
       names[0]='Jim';
       names[1]='tom';
       var arr=['China',2008,true];//简化赋值
    

      实例2(合并数组)

       function MySplit(arr,spe)
       {
        if(!spe)
        {
         spe=',';//如果为空,默认用,分割
        }
        var str=arr[0];
        for(var i=1;i<arr.length;i++)
        {
         str=str+spe+arr[i];
        }
        return arr;
       }
       
    

    7、RegExp正则表达式
      7.1、创建方法
        1、创建RegExp对象,如:var regex = new RegExp("\\d{5}");没有@,\\代表\ 。
        2、/表达式/,如:var reg=/\d+/;此时不用考虑转义字符。
      7.2、RegExp对象的方法
        1、test(str):判断字符串str是否匹配正则表达式,相当于IsMatch。
         例如:var regex=/.+@.+/; alert(regex.test("123@qq.com"));
        2、exec(str):进行搜索匹配,返回值为匹配结果,没有找到返回null。
      7.3、String对象中的正则表达式
        1、str.match(regex),相当于调用exec
         实例1:var s="abc@163.com";

           var regex=/(.+)@(.+)/;
           var match=s.match(regex);//匹配获得结果集
           alert(RegExp.$1+",服务器:"+RegExp.$2);
           
    

         实例2(获取分组中的数据):

           var arr=str.match(/(.+)@(.+)/);
           //获取分组中的数据
           alert(RegExp.$1);
           for (var i = 0; i < arr.length; i++) {
            alert(arr[i]);
             }
    

        2、str.replace(/正则表达/,strR);
         实例1(字符替换):

             // g全局匹配
             var str2="北京    北京  北京";
             alert(str2.replace(/北京/g,"武汉"));
             //i忽略大小写
             var s="AAAbbbaacsda";
             alert(s.match(/a+/gi));
    

    8、Json对象 
       8.1、Json定义:
         Json对象是一个无序的'名称/值'对集合。一个对象以{开始,}结束。每个名称后跟一个:名称/值对之间用,分割。
       实例(Json数据的创建和访问)
          

      <script type="text/javascript">
          //创建json
          var json = { "name": "张三", "age": 18, "sex": "男" };
          //获取值
          alert(json["name"]);
          //遍历
          for (var key in json) {
           alert(key+"==="+json[key]);
          }
          //创建Json
          var json2 = { "class1": [
                { "name": "张三", "age": 18, "sex": "男" },
                { "name": "张三1", "age": 28, "sex": "男" },
                { "name": "张三2", "age": 48, "sex": "男" },
                { "name": "张三3", "age": 58, "sex": "男" },
                { "name": "张三4", "age": 16, "sex": "男" }
                ],
           "class2": [
                { "name": "张三", "age": 18, "sex": "男" },
                { "name": "张三1", "age": 28, "sex": "男" },
                { "name": "张三2", "age": 48, "sex": "男" },
                { "name": "张三3", "age": 58, "sex": "男" },
                { "name": "张三4", "age": 16, "sex": "男" }
                ]
          }
    
          var arr = json2.class2;
          for (var i = 0; i < arr.length; i++) {
           alert(arr[i].name);
           }
         </script>
    
  • 相关阅读:
    codevs 2021 中庸之道
    bzoj 1227: [SDOI2009]虔诚的墓主人
    cogs 2620. [HEOI2012]朋友圈
    bzoj 3123: [Sdoi2013]森林(45分暴力)
    cogs 1685 魔法森林
    bzoj 1061: [Noi2008]志愿者招募
    poj 1743 Musical Theme
    bzoj 1001: [BeiJing2006]狼抓兔子
    bzoj 4006: [JLOI2015]管道连接
    hdu 5693 D Game
  • 原文地址:https://www.cnblogs.com/dedeyi/p/2604015.html
Copyright © 2011-2022 走看看