javascript 权威指南 学习笔记3：javascript 作用域

var testvar = 'window属性';
var o3 = {
   testvar:'3',
   testvar2:'3**',
   fun:function(){
      alert('o3: '+this.testvar);//'obj3'
      var inner = function(){
         alert('o3-inner: '+this.testvar);//'window属性'
         alert('o3-inner: '+this.testvar2);//undefined（未定义）
      };
      inner();
   }
};
o3.fun();

  调用函数时，你可以把this 想象为每个函数内的一个特殊（躲起来的）参数。无论什么时候，JavaScript都会把this 放到function内部。它是基于一种非常简单的思想：如果函数直接是某个对象的成员，那么this 的值就是这个对象。如果函数不是某个对象的成员那么this 的值便设为某种全局对象（常见有，浏览器中的window对象）。下面的内部函数可以清晰的看出这种思想。

 

Since the Window object is the global object in client-side JavaScript, all global variables are defined as properties of the window. For example, the following two lines of code perform essentially the same function:

var answer = 42;     // Declare and initialize a global variable

window.answer = 42;  // Create a new property of the Window object

span.meecallWrapper { font-size:1em; color:#B0E0E6; text-decoration:none; } a.meecallLink { color:#000000; text-decoration:none; } span.meecallInLink:hover { background-color:#B0E0E6; }

 

引用js文件的好处：

When JavaScript functions are used by more than one page, placing them in a separate JavaScript file allows them to be cached by the browser, making them load more quickly. When JavaScript code is shared by multiple pages, the time savings of caching more than outweigh the small delay required for the browser to open a separate network connection to download the JavaScript file the first time it is requested.

 

setCapture函数的作用就是将后续的mouse事件都发送给这个对象，releaseCapture就是将鼠标事件还回去，由 document、window、object之类的自行来处理，这样就保证了在拖动的过程中，不会由于经过了其它的元素而受到干扰。另外，还有一个很重 要的事情是，在Win32上，mouse move的事件不是一个连续的，也就是说，并不是我们每次移动1px的鼠标指针，就会发生一个mousemove，windows会周期性检查mouse 的位置变化来产生mousemove的事件。所以，如果是一个很小的页面对象，比如一个直径5px的圆点，如果没有setCapture和 releaseCapture，那么在鼠标按住之后，快速的移动鼠标，就有可能鼠标移动走了，但是小圆点还在原地，就是因为下一次的mousemove事 件已经不再发给这个圆点对象了。

 

 

 

<input type="button" value="Click Here" onclick="alert(typeof this.onclick);"> 

If you click the button, it displays a dialog box containing the word "function," not the word "string." (Note that in event handlers, the this keyword refers to the object on which the event occurred.

 

 

 

 

<script>

// This function recursively looks at Node n and its descendants, 

// replacing all Text nodes with their uppercase equivalents.

function uppercase(n) {

    if (n.nodeType == 3 /*Node.TEXT_NODE*/) {

        // If the node is a Text node, create a new Text node that

        // holds the uppercase version of the node's text, and use the

        // replaceChild(  ) method of the parent node to replace the

        // original node with the new uppercase node.

        var newNode = document.createTextNode(n.data.toUpperCase(  ));

        var parent = n.parentNode;

        parent.replaceChild(newNode, n);

    }

    else {

        // If the node is not a Text node, loop through its children

        // and recursively call this function on each child.

        var kids = n.childNodes;

        for(var i = 0; i < kids.length; i++) uppercase(kids[i]);

    }

}

</script>



<!-- Here is some sample text. Note that the <p> tags have id attributes. -->

<p id="p1">This <i>is</i> paragraph 1.</p>

<p id="p2">This <i>is</i> paragraph 2.</p>



<!-- Here is a button that invokes the uppercase(  ) function defined above. -->

<!-- Note the call to document.getElementById(  ) to find the desired node. -->

<button onclick="uppercase(document.getElementById('p1'));">Click Me</button>