javascript是一门浏览器语言，对于后台攻城湿们。则是这样对其定义的

1. js是一门前端语言，因为js通常是web中的view部分，用来渲染最终呈现给用户的页面。

2. js是一门弱类型语言和解释性语言，没有使用编译器（编译器会检查语法错误，同样性质的比如php,ruby,python等。当然，不能说完全没有编译过程，只是不是严格意义上的编译），因为编译的目的最终应该是生成可执行的代码，而不是中间结果。

本文将关注两个方面

1.js重要概念

2.js小tips  主要关注容易被忽略的小问题

1.js重要概念

    1.1. 对象

var obj = {};

　　上面的代码定义了一个对象。在以后的使用中，可以动态的给这个对象增加新的属性。

obj.SayNo = func (){     return "no...";};obj.Name = "name";

       javascript中，每个对象都连接到一个原型对象，并且可以从中继承属性，比如，所有通过上面方式定义的对象，默认都连接到Object.prototype。它是js的标配对象。原型通过prototype来获取，可以给原型增加方法，这样，所有由原型产生的对象又自动获取了该方法，比如，通过以下方式给string增加trim方法。

Function.prototype.method = function(name,func) {      this.prototype[name] = func;      return this;  }String.method(‘trim‘,  function(){    return this.replace(/^\s+|\s+$/g, ‘‘);});var str = "      sss    ";str.trim();

　　1.2. 函数

      javascript中的函数就是对象，所以函数可以保存在变量，对象和数组中，函数可以作为参数被传递，也可以返回函数，而且，作为对象，也可以拥有方法。

      函数有四种调用模式

      1. 方法调用模式

      2. 函数调用模式

      3. 构造器调用模式

      4. apply调用模式

      函数在调用的时候会自动获得两个免费的参数，this和arguments。上述四种调用模式在如何初始化this上存在差异（其实就是坑）

　　1. 方法调用模式，this被绑定到该对象上

var obj = {   name : "hello kitty",   SayHello : function(){         return "hello. i am " + this.name;       },};obj.SayHello();

　　2. 函数调用模式，this被绑定到全局对象（坑来了...）  

var name = "name1";var obj = {name:"name2"};obj.tell = function(){    var sayHello = function(){          return this.name;    };    console.log(sayHello()); //输出是name1.因为this指代的是全局的this...};    

　　解决方案

var name = "name1";var obj = {name:"name2"};obj.tell = function(){    var that = this;    var sayHello = function(){          return that.name;    };    console.log(sayHello()); //输出是name2.因为that指代的是对象...};

　　3. 构造器调用模式

     4. apply调用模式

    function Person(name,age){        this.name=name;        this.age=age;    }       function Student(name,age,grade){        Person.apply(this,arguments); //apply模式  // 注意：js 中的函数其实是对象，函数名是对 Function 对象的引用。        this.grade=grade;    }        var student=new Student("qian",21,"一年级");  //构造器    console.log(student.name);    console.log(student.age);    console.log(student.grade);

　 其实还有一种调用方式(call)，如下（跟apply类似）

function Animal(){      this.name = "Animal";      this.showName = function(){          alert(this.name);      }  }  function Cat(){      this.name = "Cat";  }   var animal = new Animal();  var cat = new Cat();    animal.showName.call(cat,",");  

　　上述方式，把cat用animal的this替换了，所以，输出是cat.

　   比如，在设置时间监听时，可以使用call来完成

       addEventHandler: function(obj,eventName,fun,param) {            var fn = fun;            if(param){                fn = function(e){                    fun.call(this, param);                }            }            if(obj.attachEvent){                obj.attachEvent(‘on‘+eventName,fn);            }else if(obj.addEventListener){                obj.addEventListener(eventName,fn,false);            }else{                obj["on" + eventName] = fn;            }        },

    1.3 js的同缘策略

       js为了安全考虑，采取了同源策略。要求两个同源的js才能互相操作dom。

      1. 这里的同源（协议，域名，端口三者必须一致），指定的是页面的同源，而不是js。因为页面可以任意引用其他域名下的js（因为是主动包括，所以都实际上都属于同一个源的js，比如很多页面会加入百度广告的js，或者谷歌统计的js等。这些js是可以直接对页面的dom进行操作的）。更具体来说，就是JS只能与同一个域中的页面进行通讯.如:运行在 http://www.cnblogs.com/weijiaen/page.html上的脚本不能和http://www.cnblogs.com/weijiaen2/page.html的浏览器窗口或iframe 进行交互.不能访问它的cookie,接收它的HTTP响应等(但它可以向任何其他源发送HTTP请求，浏览器会阻止它读写响应);AJAX 和 webservice 也受此策略管束.   

      2. 同源策略的一个解决方式（让一个页面能访问另外一个域的接口）就是jsonp。jsonp其实是利用页面可以使用<script>任意引用其他域名的js（必须是可执行js段，比如var arr=[1,2,3]而不是一个数据，比如{a:[1,2,3]}），然后通过注册函数（这又是函数的一大用处），然后从另外一个域返回函数（参数为数据{}），这样就可以对返回的数据进行处理，jsonp只是一个技术而不是一个标准的协议。

      当一个页面尝试包含其他页面（比如百度广告会在你的页面中包括百度域下的一个页面），并且尝试让两个页面进行通信的时候，会遇到同源策略限制的问题。但是可以通过主页面改变url中的hash值（改变iframe的src中的hash，并不会引起页面刷新）的方式（在子页面中监听hash参数的变化）进行通信。

2. js小tips

    2.1. 对象通过引用来传递，永远不会被复制

    2.2. 直接使用未经声明的变量，会产生隐式全局变量，这会导致bug查找非常困难

    2.3. JavaScript只有函数作用域，没有块级作用域，在函数内部任何地方定义的变量，在函数内部任何地方可见（比如在一个for循环定义的变量在另外一个for循环可见）。

    2.4. 一个函数总是会返回值，不指定返回值，则返回undefined. 如果在函数调用前加上了new，则返回this。如果我们想办法让函数返回是this，则可以启用级联。作用类似c++的cout。

　　　　比如，getElementById返回的就是一个this指针

    2.5. 如何正确的生成动态script标签，并执行

	div_content = [        ‘(function() {‘,        //some code string here...         ‘ })()‘].join(‘‘);		var script_div = document.createElement("SCRIPT"); 	script_div.innerHTML = div_content;	script_div.type = "text/javascript";			        target_div=document.getElementById(‘yourid‘);	target_div.appendChild(script_div);

　2.6. css之定位

          css定位分绝对定位(absolute,fixed)，相对定位(relative)

　　　 absolute是指绝对定位，即将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位，而其层叠通过z-index属性定义。在没有设定上面四种属性时，默认依据父级的做标原始点为原始点。如果设定并且父级没有设定position属性，那么当前的absolute则以浏览器左上角为原始点进行定位，位置将由设定值决定。

　　　 比如，如果不设置父节点为relative。效果如下图

         如果设置了父节点为relative。效果如下图

　　　 ralative是指相对定位，就是依据left，right，top，bottom等属性在正常文档流中偏移位置。 

javascript语言精髓笔记