javaScript 学习笔记

<! DOCTYPE  html>
< html >
< head >
< meta  charset =  "UTF-8" >
< title >  Insert title here </ title  >
< script  type =  "text/javascript" >
/* var a="3.145";
var b=a-2;
var c=parseFloat(a)+2;
alert(b+"\n"+c);
//尽量使用同一类型进行运算,必要时要先转换类型,再进行计算 提供了parseInt(),parseFloat()方法,
字符串+数值 变成字符串
*/
/* var test="全局变量";
function  checkScope(){
       var test="局部变量";
       alert(test);
}
checkScope();
//局部变量是在函数类声明的变量,总之是最近使用的变量有效原则,最近的覆盖之前的
//变量,分为全局变量,和局部变量,当同名时,局部变量覆盖全局变量,
// javaScript 的变量与java 不同的是没有块范围的概念,只有全局跟局部之分如下代码
 */
/*  function test(o){
       //变量i 是整个函数范围
       var i=0;
       //变量j k是整个函数范围
       if(typeof o=="object"){
              var j=5;
              for(var k=0;k<10;k++){
                     document.write(k);
              }
       }
       alert(k+"\n"+j);
}
test(document); */

/* var scope="全局变量";
function test(){
       document.writeln(scope+"<br/>")
       var scope="局部变量";
       document.writeln(scope+"<br/>")
}
test();
//第一次输出undefined 未定义,是因为在函数中局部变量已经覆盖了全局变量,而此时局部变量还没有赋值 所以是undefined
//var 会强制新建一个新变量 ,如果去掉var 那么 规则是系统会先检查上下文, 如果已经有定义则不会再新建,这时输出的是 全局变量,,代码如下
*/
/* var scope="全局变量";
function test(){
       document.writeln(scope+"<br/>")
        scope="局部变量";
       document.writeln(scope+"<br/>")
}
test();  */
/* var x="全局变量"; */
/*  if(navigator.cookieEnabled){
        alert("浏览器允许使用Cookie");
 } else{
        alert("浏览器不允许使用Cookie");
 } */
 

/*  try{
        confirm(a);
 } catch(e){
        document.writeln(e.message);
 } finally{
        document.writeln("系统的finally块");
 }
 //javaScript 捕获异常机制 可以直接throw new Error("用户自定义错误"); 没有throws关键字,只包含一个catch()一种错误类型Error 通过。message属性获得异常描述信息
typeof typeof(a) 判断某个变量的数据类型 instanceof 判断某个变量是否是某个类的实例
 */
/*  function test(age){
        if(typeof age ==="number"){
               if(age>60){
                      alert("老年人");
               }
        }
        alert(typeof(age));
 }
 test(70); */
  //字符串的很多方法
 
  //定义数组的三种方式
/*  var a=[1,2,3]
 var a=[]
 var a=new Array();
 //数组有
 alert(a instanceof Array);
 alert(a instanceof Object); */
  //javaScript 中所有的类都是Object的子类
 
/*  with(document){
        writeln("hello<br/>");
        writeln("world<br/>");
        writeln("javaScript<br/>")
 } */
  //with 语句避免重复书写对象,这里是doucment
 
/*  document.write("<h1>navigator对象的全部属性如下</h1>");
 for(proName in navigator){
        document.write('属性'+proName+"的值是:"+navigator[proName]);
        document.write("<br/>")
 } */
  //navigator javaScript的内置对象 for in 可以用来遍历数组或者对象的属性
  //递归函数
/*  var factorial = function(n){
               if(typeof(n) == "number"){
                      if(n==1){
                            return 1;
                      } else {
                           return n * factorial(n-1);
                      }
               } else {
                      alert("参数类型不对");
               }
       
       
 }

try {
       alert(factorial(3));
} catch (e) {
       document.write(e.message);
}
        */
         //全局函数,与局部函数,局部函数式写在全局函数内的函数,只有当包含局部函数的外部函数被调用时,局部函数才有被调用的机会
/*      var outer = function(){
               function inner1(){
                      document.writeln("局部函数1");
               }
               function inner2(){
                      document.writeln("局部函数2");
               }
               document.writeln("开始测试局部函数。。。。");
               inner1();
               inner2();
               document.writeln("测试结束");
        }
        try{
               outer();
        } catch (e) {
               document.write(e.message);
       }
         */
          //类 初探
         /*   function Person(name,age){
                this.name=name;
                this.age=age;
                this.info= function(){
                       document.writeln("我的名字是:"+this.name+"<br/>")
                       document.writeln("我的年龄是:"+this.age+"<br/>");
                }
         }
         var p=new Person("yu", "24");
         p.info(); */
/*       var hello=function(){
                document.write("hello world");
         }
         window.hello(); */
/*       function Person(national,age){
              
                //this关键字指定 age为类的属性,通过类的对象可以访问到
                this.age=age;
                // 通过唯一类名直接指定的变量 是类 属性,只有通过类名才能访问
                Person.national=national;
                //构造方法内通过var定义的变量为局部变量
                var bb=0;
                //通过this 指定类的成员函数属性,这里需要指出的是javaScrit 类可以动态的添加属性和方法
                this.hello=function(){
                       document.write("hello world !");
                };
         }
         var p=new Person("中国", 22);
         try{
                document.write(p.age);
                //对象实例 访问类属性,这里是访问不了的
                document.write(p.national);
                //类的属性只能通过类访问,
                 document.write(Person.national);
                //局部变量 外部是访问不了的
                document.write(p.bb);
                document.write(p.hello());
         } catch (e) {
              document.write(e.message);
       }
         alert(11);
         document.write("<br/>");
         //动态的增加实例的属性
         p.name="ys";
         //动态的增加实例的方法
         p.info=function(){
                document.write(p.name);
                document.write("<br/>");
                document.write(p.age);
         }
       p.info();
       //注意动态新增的属性方法只适用于当前的对象,再次新建时 就无效了
       var p2=new Person("美国", 23);
       try{
              document.write(p2.age);
              document.write(p2.name);
       } catch (e) {
              document.write(e.message);
       }
       p2.info(); */
         //回调函数 call 方法
/*     var each = function(array,fn){
              for(var index in array){
                     //动态的调用函数,第一个Null 表示调用者,后面的是参数,参数可以有多个
                     fn.call(null,index,array[index]);
              }
       }
       each([4,2,3], function(index,ele){
              document.write("第"+index+"个元素是:"+ele+"<br/>");
       }); */
         //apply()方法
/*     var myfun = function(a,b){
              alert(a+"---"+b);
       }
       //以call方法动态的调用函数
       myfun.call(window,"a", "b");
       var example = function(num1,num2){
              myfun.apply(this,arguments);
       }
       example(20, 40);
       myfun.apply(window, [12,13]); */
         //在javaScript 中 函数是一等公民 永远是独立的 即使是写在某个类函数中
         //例一;
/*     function Person(name){
              this.name=name;
              this.info= function(){
                     document.write(this.name);
                     document.write("<br/>");
              }
       }
       var p = new Person("ys");
       p.info();
       
       var name ="windows 对象";
       p.info.call(window); */
         //例二;
/*     function Dog(name,age ,bark){
              this.name=name;
              this.age=age;
              this.bark=bark;
              this.info=function(){
                     return this.name+"的年龄为:"+this.age+",它的叫声:"+this.bark;
              }
       }
       //创建 Dog 实例;
       var dog=new Dog("旺财", 22, "旺旺");
       function Cat(name,age,bark){
              this.name=name;
              this.age=age;
              this.bark=bark;
       }
       //创建cat 实例
       var cat=new Cat("花花", 21, "喵喵");
       //以cat 为 info 调用者
       document.write(dog.info.call(cat));
        */
         //参数传递 分为值传递 和引用传递 ,值传递时,参数是副本,原来的值不变,引用传的是地址,值是改变的
         //普通类型
         /*  var test=function(arg1){
               arg1=10;
               document.write(arg1);
               document.write("<br/>");
        }
        var arg1=5;
        document.write(arg1);
        document.write("<br/>");
        test(arg1);
        document.write(arg1); */
         //复合类型 是会改变指向实际JavaScript的值的 虽然在函数类被置为null 但原来的person 依然没有变。只是传递了地址引用,会改变内容
         //符合类型包括:对象数组等
/*      var test=function(person){
               person.age=10;
               document.write("函数执行中的age值为:"+person.age+"<br/>");
               person=null;
        }
        //json 语法创建对象
        var person={age:15};
        document.write("函数调用前的Person的age的值:"+person.age+"<br/>");
        //调用函数
        test(person);
        document.write("函数调用后的Person的age的值:"+person.age+"<br/>");
        document.write("person对象为:"+person+"<br/>"); */
         //javaScript 不存在函数重载 函数名是 函数的唯一标识,如果有两个同名的函数 则后面的函数覆盖前面的函数,而不会去管参数如何.
         //javaScript 函数可能声明多个参数,但是对于直接调用不传参数的情况,语法也会通过的,所以必要时最好加上验证。
/*      function changeAge(person){
               if(typeof person=="object"){
                      person.age=10;
                      document.write("函数执行中的age的值:"+person.age);
               } else{
                      alert("参数类型不符合:"+typeof person);
               }
        }
        changeAge();
        changeAge(p);
        var p={age:1};
        changeAge(p); */
       
/*     var test= function(){
               alert("函数1");
        }
        var test=function(name){
               alert("函数2"+name);
        }
        //程序总是调用后面的同名的函数,而无论参数如何
        test(); */
         //javaScript 对象本质是一个关联数组,类之间没有继承关联关系,
         //可以通过两种方式访问
/*      function Person(name,age){
               this.name=name;
               this.age=age;
               this.info=function(){
                      alert("info method!"+this.age);
               }
        }
        var p=new Person("ys", 49);
        for(proName in p){
               document.write("p对象的:"+proName+"属性值为:"+p[proName]+"<br/>");
        } */
         //javaScript 面向对象编程
         //要注意防止闭包,就是在函数内部定义函数 并且把局部变量返回到外部使得 局部变量的生命周期扩大,最终导致内存溢出
/*      function Person(){
               //定义局部变量
               var local="hello World";
               this.info=function(){
                      return local;
               }
        }
        var p=new Person();
        var val=p.info();
        alert(val); */
         //建议使用prototype
/*      function Person(name,age){
               this.name=name;
               this.age=age;
               this.info=function(){
                      document.write("name:"+this.name+"<br/>"+"age:"+this.age);
               }
        }
        var p1 =new Person("ys", 22);
        p1.info();
        //伪继承 通过prototype属性增加方法,使得所有对象都可以用到这个方法
        //因为每一个类都有一个prototype属性,所有这种给类添加的方法,可以被该类的所有实例对象所共享
        //同时因为walk函数不在函数体内,所以不会形成闭包
        //实质上 是通过改变 原来的类为新的类 ,当通过 prototype 添加方法后,原来的不带walk方法的类将不复存在。取而代之的是新的类
        Person.prototype.walk=function(){
               document.write(this.name+"正在慢慢溜达。。。。<br/>");
        }
        var p2=new Person("小李", 33);
        p2.info();
        p2.walk();
        //p1可以共享walk方法
        p1.walk(); */
       
         //通过prototype 属性还可以对 javaScript内建类进行扩展
/*      Array.prototype.indexof=function(obj){
               var result=-1;
               for(var i=0;i<this.length;i++){
                      if(this[i]==obj){
                            result=i;
                            break;
                      }
               }
               return result;
        }
        var arr=["a","b","c","d"];
        alert(arr.indexof("d")); */
         //javaScript 创建对象的三种方式 new ,Object json
       
         function  Person(name){
                this .name=name;
        }
         //new
         var  p= new  Person( "ys I am new的函数对象<br/>"  );
        p.info=  function  (){
               document.write(p.name);
        }
        p.info();
       
          //obj
         var  myobj= new  Object();
        myobj.name=  "hehe I am new 的Ojbect 对象<br/>"  ;
        myobj.info=  function  (){
               document.write(myobj.name);
        }
       myobj.info();
       
         function  abc(){
               document.write(  "abc" );
       }
         //将已有的函数绑定对象 只要将赋值方法名即可
        myobj.printAbc=abc;
        myobj.printAbc();
       
        document.write(  "<br/>" );
         //通过json 创建对象更加方便快捷 var p={k,v};即可
         var  jsonObj={
                      name:  "jack" ,
                      age:22,
                      hobby:{
                            hb1:  "唱歌" ,
                            hb2:  "跳舞"
                      },
                      schoos:[  "小学" , "中学"  , "大学"  ],
                      parents:[{
                            name:  "father" ,
                            age:52,
                            address:  "淮安"
                      },
                      {
                            name:  "mother" ,
                            age:49,
                            address:  "淮安"
                      }],
                      info:  function (){
                            document.write(  "姓名:" + this  .name+ "年龄:"  + this .age);
                      }
        };
        document.write(  "我是通过 json 创建的对象<br/>"  );
         var  iterator= function (obj){
                for (proname  in  obj){
                       if ( typeof  proname == "hobby" ){
                            iterator(proname);
                      }
                      document.write(  typeof (proname)+ "属性:"  +proname+ "值" +jsonObj[proname]+  "<br/>" );
               }
       }
       iterator(jsonObj);
       document.write(jsonObj.hobby.hb1+  "<br/>" +jsonObj.hobby.hb2+ "<br/>"  );
       document.write(jsonObj.parents[0].name+  "<br/>" );
         /* var t=jsonObj.parents[0];
       alert(t.name); */
         //注意json 不支持三层 遍历,
         //可以使用赋值引用数组到临时变量 再遍历
         var  arr =jsonObj.parents;
         for ( var  i=0,l=arr.length;i<l;i++){
                for ( var  k  in  arr[i]){
                     document.write(arr[i][k]+  "<br/>" );
              }
       }
         for (index  in  arr){
                for (k  in  arr[index]){
                     document.write(arr[index][k]+  "<br/>" );
              }
              
       }
         //注意function() 一定要加()!
</ script >
</ head >
< body >
<!-- <input type="button" value="局部变量" οnclick="var x='局部变量';alert('输出x局部变量的值:'+x);">
<input type="button" value="全局变量" οnclick="alert('输出x全局变量的值:'+x);"> -->
</ body >
</ html >
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值