《JavaScript高级程序设计》第二次阅读笔记

gax javascript

第二章

  1. <!CDATA[   javascriptCode  ]]>   在XHTML中javascript可以用这个标记保证内嵌的javascript代码能正常运行，因为XHTML标准比较严格，很多标签都不能被解析。

  2. defer和async标记都不能保证是在DOMContentLoading之前或之后执行，区别就只是保证顺序执行而已。

第三章

  1. 严格模式下，使用未定义的变量会导致错误。

  2. nul值表示一个空对象的指针，而这也是使用typeof操作符检测null值时返回“object”的原因

  3. 无论在什么情况下都没必要把一个变量的值显式地设置为undefined,但是对于null，只要在保存［对象］的变了还没有真正保存对象，就应该明确地然它保存为null值。

  4. undefined 和 null，没有任何属性和方法

   5.要把都一个值转换为字符串，可以用加号把它与一个字符串“xxx”加在一起

   6.并非所有浏览器的BOM与DOM都属于Object

   7.+操作符 会像Number()一样对这个值执行转换。－号同理，不过变成负数。

   8.do-while 循环的代码至少会执行一次。

   9.for(; ;){ doSomething(); } 无限循环

   10.通过for-in循环输出的属性名的顺序是不可预测的，具体先后顺序因浏览器而异。

   11.swicth{case xxx:} 在比较时是使用全等操作符 ===，所以10不等于“10”

   12. 标准模式下arguments与参数会相互同步，严格模式下不会同步。

标准模式下：
function add(a){
arguments[0] = 10;
console.log(a); //10
}
add(1);
严格模式下
function add(a){
        "use strict";
arguments[0] = 10;
console.log(a);//1
}
add(1);

第4章

  1. 给基本类型添加引用会被浏览器直接忽略，也不会报错。

   2.要检测一个变量是不是基本数据类型用typeof，typeof null 等于object。如果用instanceof操作符检测基本类型的值，则翻回false.

第5章

   1.对象的key只能用字符串作key

   2.数组的toString()方法会返回由数组中每一个值的字符串形式拼接逗号分隔而成的字符串。所以如果[{a:1},2] toString() 等于 [object Object],2

   3.concat()方法可以添加字符串，也可以添加数组。如：

    var colors = ["red","green","blue"];

    var colors2 = colors.concat("yellow",["black","brown"]);

    alert(colors);//red,green,blue

    alert(color2);//red,green,blue,yellow,black,brown

   4.Array的5个迭代方法,都是给定运行参数function(value,index,array){}

    1.every() //返回布尔值，每一项都是true的话，返回true

    2.filter() //将返回true的项组成新的素组

    3.forEach()//仅仅循环数组一次.没有返回值

    4.map()//将每一项的返回值组成新的数组

    5.some()//返回布尔值，其中一项返回true，则返回true

   5.关于函数是否能复制，目前只能想到eval 这种方法了 eval("var z = "+s1.toString());

   6.创建函数有一种新的思路

      var sum = function(num1, num2){

              return num1 + num2;

      }

    等于

   var sum = new Function("num1","num2","return num1 + num2");

    7.严格模式下，访问arguments.callee会导致错误。

    8.函数的length等于参数的数量,如function a(a,b){}; a.length //2

    9.在严格模式下，作为方法调用，则this等于undefined,在非严格模式，等于window.

    10.用Boolean,Number,String创建的变量，与直接定义同名的基本类型不一样。

    var value = "25";

    var number = Number(value); //转换函数

    alert(typeof number);  //number

    var obj =new Number(value); //构造函数

    alert(typeof obj); //object

    主要表现在number就是number类型的基本类型，但是obj是一个number对象，它各种属性都跟基本类型一样。

  10. slice(开始index,结束index)

         substr(开始index,length)  

         substring(开始index,结束index)  开始和结束都不接受负数。

   11.所有全局作用域中定义的属性和函数，都是Global对象的属性。如isNaN(),isFinite(),parseInt(),parseFloat();

第6章

    1.只要创建一个新函数，就会为该函数创建一个prototype,并自动获得constructor属性指向函数本身。

    2.alert(Person.prototype.isPrototypeOf(person1));//true

      isPrototypeOf可以检测person1的prototype属性是否属于Person

   3.person1.hasOwnProperty("name") //hasOwnProperty方法可以确定属性存在方法中还是存在实力中。

   4."name " in person1 //单独使用in操作符会在通过对象能过访问属性时返回true。

   5.通过在实例上添加一个同名属性，可以隐藏原型中的对应属性。

第7章

    1.

    var name = "the window";

    var object = {

        name : "My Object",

        getName: function(){

            return this.name;

        }

    }

    object.getName();    //"My Object"

    (object.getName)(); //"My Object"    object.getName == (object.getName)

    (object.getName = object.getName)();//"the window"  相当与x=object.getName;x();

第8章

    1.iframe框架之间使用instanceof不适用

第9章

    1.每次修改location的属性（hash除外），页面都会以新的url重新加载；location="xxx" 等于loaction.pathname="xxx"

第10章

    1.如果传入到appendChild()中的节点已经是文档的一部分了，那结果就是将该节点从原来的位置转移到新位置。

    2.如果参照节点是null，则insertBefore()与appendChild()执行相同的操作。

    3.cloneNode()//在参数为true的情况下，为深度复制，复制节点和整个子树；在参数为false的情况下，为浅复制，只复制节点自己。

       cloneNode 不会复制绑定事件。

    4.document.write();在页面呈现的过程中运行，则之间向页面追加内容。如果在加载结束后调用document.write();则重写整个页面。

第11章

    1.footer.dataset.xx="asd"；等于<footer data-xx="asd"></footer>  //可以取代setAttribute('data-asd',"xx");的方法。

     2.一个更强大的DOM操作方法:insertAdjacentHTML(); 有4种插入模式：

        beforebegin:     //作为前一个同辈元素插入

            element.insertAdjacentHTML("beforebegin", "<p>Hello world!</p>")

        afterbegin:        //作为子元素在内容前插入

            element.insertAdjacentHTML("afterbegin", "<p>Hello world!</p>")

        beforeend:        //作为子元素在内容最后插入

            element.insertAdjacentHTML("beforeend", "<p>Hello world!</p>")

        afterend:        //作为后一个同辈元素插入

            element.insertAdjacentHTML("afterend", "<p>Hello world!</p>")

第13章

    1.ie8及以前的版本只支持attachEvent，只在冒泡阶段触发。

    2.ie和其它浏览器触发顺序有点相反

        footer.addEventListener('click',function(){alert(1);})

        footer.addEventListener('click',function(){alert(2);})

        先显示1，再显示2

        footer.attachEvent('click',function(){alert(1);})

        footer.attachEvent('click',function(){alert(2);})

        先显示2，再显示1

    3.event.currentTarget //仅代表被绑定的那个元素。当用事件代理时，currentTarget!=target

    4.只有cancelable属性设置为true的属性，才可以使用preventDefault()来取消默认行为。

    5.只有在设置了<script>元素的src属性并添加到文档后，才下载javascript文件

    6.在unload事件中访问dom，不一定能访问。看浏览器而异。

    7.浏览器最小化也会触发resize事件

    8.除了mouseenter和mouseleave，所有鼠标事件都会冒泡。

    9.针对mouseover和mouseout事件，event对象的relatedTarget提供了相关元素的信息。

第14章

    1.tabIndex：表示当前字段的切换(tab)序号 

    2.对于<input>和<textarea>元素，当失去焦点且value值被改变时，才会触发chang事件

       对于select，只要选择了不同的选项就会马上触发。

    3.表单的selectionStart／selectionEnd属性       //可以知道选择字符串的位置

    4.document.designMode = "on";可以使文档的text处于可编辑状态

    5.<div contenteditable >1</div>  //使某个元素处于可编辑状态

    6.document.execCommand("bold",false,null); //用这个命令可以实现大部分的编辑器功能。

    7.document.getSelection();  与选中文本相关的api

第20章

    1.JSON.stringify(obj, [key1,key2]|function(key,value){return xxx}，int缩进空格数）；

        JSON.stringify有第二个参数，这个参数可以是数组，也可以是函数。

        如果是数组，则返回数组中只返回数组中列出的key；

        如果是函数，例子：

var json = {"a":1,"b":2,"c":3}
var sx = JSON.stringify(json,function(k,v){
	switch(k){
		case "a":
			return 4
		case "b":
			return 5;
		case "c":
			return 6;  //如果是undfined或是没返回则最终数组是{"a":4,"b":5}
		default:
			return v;
	}
})
console.log(sx); //{"a":4,"b":5,"c":6}

这里要注意，default不仅是为了返回abc以外的key，函数第一次运行，返回的k是空字符串，v是json。若这时候改变v，则后面的k将按照改变后的v进行操作。

    2.toJSON方法

    var json = {"a":1,"b":2,"c":3,d:{"c":4,toJSON:function(){ return this.c}}}

   JSON.stringify(json);// "{"a":1,"b":2,"c":3,"d":4}"

    如果在只要有一个对象，不管是父对象还是子对象，有名叫toJSON的方法的时候，真个对象可以用这个方法作为过滤。

asdd.png

巧用JSON的第二个参数，可以做到很多事情。

   3.JSON.parse也有第二个参数作为函数的方法

JSON.parse('{"a":1}',function(key,value){

console.log(value);

});

    这里会触发2次，第一次是1,第二次是对应的空对象或者空数组。

第22章

    1. function isArray(value){

            retrun Object.prototype.toString.call(value)  == "[object Array]"

    }

     function isFunction(value){

            retrun Object.prototype.toString.call(value)  == "[object Function]"

    }

    用于检查是否原生数组或者方法。

    2.防篡改对象：

        1.Object.preventExtensions();    //不能增加，但可以修改删除

        2.Object.seal()   //不能增删，但可以改。

        3.Object.freeze() //完全密封，既不能改，也不能加属性

    3.setInterval();

        1.某些间隔会被跳过

        2.多个定时器的代码之间的间隔可能会比预期小。

第24章

    1.尽可能做好初始化类型：

        var found = false;    //布尔型

        var count = -1;    //数字

        var name = ""; //字符串

        var person = null; //对象

     2.关于事件回调处理的最佳事件

         1.勿将event对象传给其它方法；只传来自event对象中所需的数据

         2.任何可以在应用层面的动作都应该可以在不执行任何事件处理程序的情况下进行

         3.任何事件处理程序都应该处理事件，然后将处理转交给应用逻辑。

     3.Page Visibility API 可以知道页面处于最小化，还是标签页中，还有触发事件。

发表评论