零碎整理

1. document.createElement()是在对象中创建一个对象，要与appendChild() 或 insertBefore()方法联合使用。其中，appendChild() 方法在节点的子节点列表末添加新的子节点。insertBefore() 方法在节点的子节点列表任意位置插入新的节点。例如：

   <script type="text/javascript">
        var board = document.getElementById("board");           
        var e3 = document.createElement("input");
         e4.setAttribute("type", "text");
         e4.setAttribute("name", "q");
         e4.setAttribute("value", "使用setAttribute");
         e4.setAttribute("onclick", "javascript:alert('This is a test!');");
         //同样可以使用e4.type = "text";赋值       
         var object = board.appendChild(e3);
    </script>

2. HTML5 Canvas arc()函数

         语法：arc(定义一个中心点，半径，起始角度，结束角度，和绘图方向：顺时针或逆时针)

   　　代码：context.arc(centerX, centerY, radius, startingAngle, endingAngle, antiClockwise);

   　　HTML5 Canvas Arc 说明：

          

    

3. canvas的每条线都有一条无限细的“中线”，线条的宽度是从中线向两侧延伸的。

   

   我们让线条的中线和像素的中间点对齐就行了！

   

   像素的中间点很好找，比如第2像素的中间点，依据图上的解释就是1.5像素的位置，那么x像素的中间点就是(x-0.5)px。对于lineWidth>1 的线，我们也不用管它：因为只有线条宽1px的时候，这个问题才最明显。

4. The Canvas State (Clip From O'reilly's <HTML5 Canvas> )

   　　　　When we draw on the Canvas context, we can make use of a stack of so-called drawing states. Each of these states stores data about the Canvas context at any one time. Here is a list of the data stored in the stack for each state:

   　　　　(1). Transformation matrix information such as rotations or translations using the context.rotate() and context.setTransform() methods

   　　　　(2). The current clipping region

   　　　　(3). The current values for canvas attributes, such as (but not limited to):

   　　　　　　globalAlpha globalCompositeOperation strokeStyle textAlign textBaseLine lineCap lineJoin lineWidth miterLimit fillStyle font shadowBlur shadowColor shadowOffsetX, and shadowOffsetY

   　　　　The current path and current bitmap being manipulated on the Canvas context are not part of the saved state.

   　　　　Use context.save() and context.restore() to save and restore the canvas states.

5. Javascript中一个对象就是由一个或多个属性（方法）组成的集合。每个集合元素不是仅能属于一个集合，而是可以动态的属于多个集合。这样，一个方法（集合元素）由谁调用，this指针就指向谁。实际上，apply方法和call方法都是通过强制改变this指针的值来实现的，使this指针指向参数所指定的对象，从而达到将一个对象的方法作为另一个对象的方法运行。每个对象集合的元素（即属性或方法）也是一个独立的部分，全局函数和作为一个对象方法定义的函数之间没有任何区别，因为可以把全局函数和变量看作为window对象的方法和属性。也可以使用new操作符来操作一个对象的方法来返回一个对象，这样一个对象的方法也就可以定义为类的形式，其中的this指针则会指向新创建的对象。对象名可以起到一个命名空间的作用，这是使用JavaScript进行面向对象程序设计的一个技巧。例如： 
   以下是引用片段： 
   

   var namespace1 = new Object(); 
   namespace1.class1 = function(){ 
       //初始化对象的代码 
   } 
   var obj1 = new namespace1.class1();  

   这里就可以把namespace1看成一个命名空间。 

   由于对象属性（方法）的动态变化特性，一个对象的两个属性（方法）之间的互相引用，必须要通过this指针，而其他语言中，this关键字是可以省略的。    
6. 每个函数都包含两个非继承而来的方法：apply()和call()。他们的用途相同，都是在特定的作用域中调用函数。接收参数方面不同，apply()接收两个参数，一个是函数运行的作用域(this)，另一个是参数数组。call()方法第一个参数与apply()方法相同，但传递给函数的参数必须列举出来。

   　　　　

   window.firstName = "diz"; 
   window.lastName = "song"; 
   var myObject = { firstName: "my", lastName: "Object" }; 
   function HelloName() { 
   　　console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
   } 
   HelloName.call(window); //huo .call(this); 
   HelloName.call(myObject); 

   　　　　运行结果为： 
   　　　　　　Hello diz song glad to meet you! 
   　　　　　　Hello my Object glad to meet you!

   　　　　如果我们想用传统的方法实现

   　　　　

   window.firstName = "diz"; 
   window.lastName = "song"; 
   var myObject = { firstName: "my", lastName: "Object" }; 
   function HelloName() { 
       console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
   } 
   HelloName(); //Hello diz song glad to meet you! 
   myObject.HelloName = HelloName; 
   myObject.HelloName(); //Hello my Object glad to meet you! 

   　　　　要想让HelloName()函数的作用域在对象myObject上，我们需要动态创建myObject的HelloName属性，此属性作为指针指向HelloName()函数，这样，当我们调用myObject.HelloName()时，函数内部的this变量就指向myObjecct，也就可以调用该对象的内部其他公共属性了。

   this变量的情况：

   function temp1() { 
   　　console.log(this); //Object {} 
   }
   
   function temp2() { 
       console.log(this); //Window 
   } 
   temp2(); 
   
   var Obj = {}; 
   temp1.call(Obj); //运行结果见上面注释！！！！ 

   执行结果与下面的相同：

   function temp1() { 
       console.log(this); 
       temp2(); //即使在temp1()中，temp2的this仍是指向Window
   } 
   function temp2() { 
       console.log(this); 
   } 
   var Obj = {}; 
   temp1.call(Obj); 

    又如：

   function thisFun(type){
       !type && (type = "");
       function temp1(){
           console.log(type + " temp1:"+this);
       }
       console.log(type + " thisfun:"+this);
       temp1();
   }
   thisFun();
           
   var obj = {};
   thisFun.call(obj,"call method");

   结果为：

   thisfun:[object Window]
   temp1:[object Window]
   call method thisfun:[object Object]
   call method temp1:[object Window]

   可见在上面代码中，如果没有指定this，都是指向Window对象。函数里定义的函数this同样指向Window。即使外面函数this指向其他对象，内部函数的this仍指向Window。 

7. 一个闭包就是一个使用了外部变量的函数.查看下面的例子:

   function A(a, b, c) {
     var ar = [a, b, c];
     return function B(i) {
       return ar[i];
     };
   }
   
   var b = A('Here', 'I', 'am');
   console.log( b(1) );

   函数声明之后的第一条语句调用了函数A,函数A创建了一个值为数组[a,b,c]的局部变量ar,返回了一个函数B(存储在了变量b中),然后运行结束.

   第二条语句调用了函数B (b),返回并打印出了数组ar.这就意味着A中的数组ar在A结束执行后仍然存在.但是它存储在什么地方呢?当然,在b上!但是究竟是存在b的哪里呢?某个属性中?不是的.

   这是JavaScript语言的一个核心特性:一个函数可以持有外层作用域的变量,并且除了调用该函数以外没有任何其他方法可以访问到这些变量.

转载于:https://www.cnblogs.com/autocrat/archive/2012/11/23/2783922.html