JS高级第一天：

1、function是什么
  1.1  function是一个函数
     1.1.1  函数的表示方式
          function Person(){}
          var p = function(){}
          new Function()
     1.1.2  有两种执行方法
           1、function Person(){
                alert("aaa");     
              }
              Person();
               说明：
                   1、声明
                   2、调用
           2、function clickMe(){
          
              }
              <input type="button" onclick="clickMe()"/>
                                       说明：
                    1、声明
                    2、该函数在什么时候执行，取决于什么时间点击button
   1.2   function是一个对象
     1.2.1 该对象有一个属性为constructor
      1.2.2 该对象是由Function函数创建出来的
      1.2.3 可以给对象动态的添加属性
      1.2.4 任何一个对象都有可能成为任何一个对象的属性
   1.3   function是一个构造器

 

/** * 1、是一个函数 * 2、是一个对象 *    2.1 该对象有一个属性为constructor *    2.2 该对象是由Function函数创建出来的 *    2.3 可以给对象动态的添加属性 *    2.4 任何一个对象都有可能成为任何一个对象的属性 * 3、命名空间 * 4、是一个构造器函数    *   可以调用new的关键字创建对象 */function Person(){ }//给Person对象动态的添加了一个属性为a,其值为5Person.a = 5;

/** * 1、Student是一个对象 * 2、b是Person对象动态添加的一个属性，值为Student */function Student(){ alert("student");}Person.b = Student;//调用Person对象的b方法Person.b();

var json = { a:function(){  alert("asdf"); }};
/** * 给Person动态添加了一个属性为c,其值为json对象 */Person.c = json;
Person.c.a();

function D(){ }function E(){ }function F(){ alert("f");}
Person.c.d = D;Person.c.d.e = E;Person.c.d.e.f = F;
Person.c.d.e.f();
function Aa(){ }var aa = new Aa();alert(aa.constructor);

              

 

var json = { a:1, b:2, c:3, d:4, e:5};
/** * i代表key值 * json[i]代表value值 * 可以利用该方式动态的遍历json */for(var i in json){ alert(i); alert(json[i]);}

/** * 给json对象动态的添加了一个属性"aa",值为"aa" */json['aa'] = "aa";alert(json.aa);
/** * 给Person对象动态的添加4个方法 *    setName,getName,setSex,getSex *     *    说明： *       1、任何一个对象都有一个属性为prototype *       2、当声明完一个对象时，该对象内部已经存在了一个属性prototype *       3、该prototype属性的初始值是一个空的json对象 *       4、在prototype属性上加内容就相当于给该json对象填充key和value的值 */function Person(){ }
Person.prototype.setName = function(name){ this.name = name;}
Person.prototype.getName = function(){ return this.name;}
Person.prototype.setSex = function(sex){ this.sex = sex;}
Person.prototype.getSex = function(){ return this.sex;}
Person.prototype["aaaa"] = 5;
var p = new Person();p.setName("王二麻子");p.setSex("人妖");alert(p.getName());alert(p.getSex());
/** * 重新声明一个对象 */function Student (){ }
Student.prototype = p;Student.prototype = Person.prototype;
var s = new Student();s.setName("是男是女不知道");s.setSex("不详");
alert(s.getName());alert(s.getSex());

对于对象的prototype属性的说明，JScript手册上如是说：所有 JScript 内部对象都有只读的 prototype 属性。可以向其原型中动态添加功能(属性和方法)，但该对象不能被赋予不同的原型。然而，用户定义的对象可以被赋给新的原型。

/** * 谁调用Person函数，this代表谁 */function Person(){ alert(this);}Person();//window.Person();==Person();  this代表window
var json = { a:Person};
json.a();//this代表json
function Student(){ }Student.a = Person;Student.a();//this为Student

 

/** * 创建类的工厂 */function createClass(json){  /**  * 声明了一个对象、函数  */ function F(){   }  /**  * 把json对象的key和value的值全部赋值给F的prototype  */ for(var i in json){  F.prototype[i] = json[i]; }  return F;}
var Person = createClass({ setName:function(name){  this.name = name; }, setSex:function(sex){  this.sex = sex; }, getName:function(){  return this.name; }, getSex:function(){  return this.sex; }});
var p = new Person();p.setName("aaa");p.setSex("bbb");alert(p.getName());alert(p.getSex());

 

/** * 当第一次调用该函数的时候，传递了一个参数json,而这个时候的json是一个json格式的对象 * 当第一次嗲用该函数的时候，传递了两个参数json(是一个函数),prop * @param {Object} json * @param {Object} prop */function extend(json,prop){ function F(){ } /**  * 当传递进来的json是一个对象的时候，经过该if语句  */ if(typeof json=="object"){  /**   * 把json对象的所有的内容赋值给F函数   */  for(var i in json){   F.prototype[i] = json[i];  } }  /**  * 当第二次调用extend函数的时候，执行该if语句  */ if(typeof json=="function"){  /**   * F继承了json   */  F.prototype = json.prototype;  /**   * 把prop里面的内容动态的赋值给F的prototype   */  for(var j in prop){   F.prototype[j] = prop[j];  } } return F;}
var Person = extend({ a:1, b:2});
var SupPerson = extend(Person,{ c:3, d:4});
var sp = new SupPerson();alert(sp.a);alert(sp.b);alert(sp.c);alert(sp.d);

/** * 写一个函数，该函数有两个参数 *    1、destination *    2、source *   该函数的功能：那source的内容复制到destination中 */function extend(destination,source){ if(source){//必须传递source参数  if(typeof source=="object"){//确保了source是一个对象   for(var i in source){    destination[i] = source[i];   }  } } return destination; }
var newjson = extend({},{ a:1, b:2, c:3});alert(newjson.a);alert(newjson.b);alert(newjson.c);
/** * 回调函数 */
function ajax(ajaxJSON){ var xmlHttpReuquest = ajaxFunction();    xmlHttpReuquest.onreadystatechange = function(){//客户端和服务器端的沟通桥梁        if (xmlHttpReuquest.readyState == 4) {//响应完成            if (xmlHttpReuquest.status == 200) {//响应成功             /**              * 该函数的参数为实参              */    ajaxJSON.callback(xmlHttpReuquest.responseText);            }        }    }    xmlHttpReuquest.open(ajaxJSON.method, ajaxJSON.url, true);        xmlHttpReuquest.send(ajaxJSON.data);}
    
/** * 创建XMLHttpRequest对象 */function ajaxFunction(){    var xmlHttp;    try { // Firefox, Opera 8.0+, Safari        xmlHttp = new XMLHttpRequest();    }     catch (e) {        try {// Internet Explorer            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");        }         catch (e) {            try {                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");            }             catch (e) {            }        }    }        return xmlHttp;}
window.onload = function(){ ajax({  method:"post",  url:'../HelloServlet',  data:null,  callback:function(data){   alert(data);  } });}
小知识点：使用POST方式提交时乱码问题可以这样解决：
response.setContentType("text/html;charset=utf-8");
/** * 写一个函数，该函数有两个参数 *   第一个参数是字符串 *   第二个参数是回调函数 *  该函数的功能： *      给页面上的一个div添加一个click事件 *          eventHandler(str,callback){ *             if(str=="click"){ *                获取页面上div,给div添加一个事件，这个事件要做的事情，回调函数决定 *             } *          } */function eventHandler(Str, callback){    if (Str == "click") {        $("#aaa").click(function(){            callback();        });    }    else {        alert("不存在该事件");    }}
$().ready(function(){    eventHandler("click", function(){        alert("aaaa");    });});
/** * 闭包： *     在函数内部定义的函数在外部使用的现象 *     可以通过闭包实现函数的公开化和私有化 *     继承的内部实现就是闭包的一个很好的应用 *//** * 匿名函数 *    在函数内部定义的函数，在外部是没有办法访问的 */(function(){ /**  * 该函数定义在了匿名函数中  */ function Person(){  /**   * 该函数返回的是一个json格式的对象   */  return {   setName:setName,   setSex:setSex,   getName:getName,   getSex:getSex  }; } /**  * 公开的api  * @param {Object} name  */ function setName(name){  this.name = name; }  function setSex(sex){  this.sex = sex; }  function getName(){  return this.name; }  function getSex(){  aa();  return this.sex; }  /**  * 私有的函数  */ function aa(){   }  window.Person = Person;})();
var p = window.Person();p.setName("aa");p.setSex("bb");alert(p.getName());
1、click可以声明一个单击事件，但是该事件要叠加，所以不好2、unbind和bind也可以声明一个事件，而且该事件不叠加，但是不能给未来的元素添加事件3、delegate能为未来的元素添加事件

$().ready(function(){    for (var i = 0; i < 4; i++) {        /**         * 循环了4次，事件叠加了4次         */        //        $("#aaa").click(function(){        //            alert("aaa");        //        });        /**         * 始终保证事件只出现一次         */        //  $("#aaa").unbind("click");        //  $("#aaa").bind("click", function(){        //   alert("aaaa");        //  });    }  /**  * 该函数能给未来的元素添加事件  */    $("html").delegate("body div", "click", function(){        alert("aaaa");    });    $("body").append(createDIV());});
/** * 创建一个div */function createDIV(){    return $("<div id=\"aaa\">aaaaaa</div>");}