博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
读书笔记-《JavaScript高级程序设计(第3版)》
阅读量:7065 次
发布时间:2019-06-28

本文共 6602 字,大约阅读时间需要 22 分钟。

用来记录阅读的书中觉得很有用的东西,先从红皮书《Javascript 高级程序设计》开始。

第1章  JavaScript 简介

  1. 一个完整的JavaScript实现应该由核心(ECMAScript),文档对象模型(DOM),浏览器对象模型(BOM)组成。
  2. 文档对象模型(DOM,Document Boject Model)是针对XML但经过拓展用于HTML的应用程序接口,把整个页面映射为一个多层节点结构。
  3. 浏览器对象模型(BOM,Browser Object Model)。

第2章  在HTML中使用JavaScript

  1. script引用 defer属性。表示可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
  2. script引用 async属性,异步,立即下载,不保证执行顺序。
  3. XHTML(Extensible HyperText Markup Language)。
  4. <noscript>元素

第3章  基本概念

  1. "use strict" 严格模式(strict mode)下,ECMAScript 3中一些不确定的行为将得到处理,对默写不安全的操作也会抛出错误。
  2. ECMAScript中5种简单数据类型(也称为基本数据类型):Undefined、Null、Boolean、Number和String。1种复杂数据类型--Object,本质上是一组无序名值对。
  3. typeof 检测null 会返回 "object"
  4. undefined值派生自null,ECMA-262规定他们的相等性检测返回true
    alert(null == undefined) //true
  5. Boolean转换规则
!!Infinity;//true    !!Object;//true    !!{};//true    !!null;//false复制代码
  1. Number.MIN_VALUE ECMAScript能表示的最小值。Number.MAX_VALUE ECMAScript能表示的最大值。
  2. isFinite()函数判断是否为正负无穷。Number.NEGATIVE_INFINITY和Number.POSITIVE_INFINITY存着负无穷和正无穷。
  3. NaN == NaN; //false
  4. isNaN()函数,判断传入参数进行数值转换后是否为NaN。
  5. Number()、parseInt()、parseFloat()
Number("");//0    Number("000011");//11    parseInt("1234blue");//1234    parseInt("0xA");//10 十六进制    parseInt("22.5");//22    parseInt("070");//ECMAScript3-->八进制56 ECMAScript 5--->70    parseInt("070",8);//56 第二个参数,进制复制代码
  1. 建议无论什么情况下都明确指定parseInt()基数
  2. parseFloat()只解析十进制,没有第二个参数。
  3. \xnn 以十六进制代码nn表示的一个字符(n为0~F)。
  4. \unnnn 以十六进制代码nnnn表示的一个Unicode字符(n为0~F)。
  5. 要改变某个变量保存的字符串,先要销毁原来的字符串,再用另一个包含新值的字符串填充改变量。
  6. toString()方法可加基数,null和undefined无此方法,可用String(),如果值有toString()方法会调用toString(),null undefined返回"null","undefined"。
var n = 10;    num.toString(2);//"1010"    num.toString(16);//"a"    String(null);//"null"    String(undefined);//"undefined"复制代码
  1. Object 实例属性方法:
    • constructor:保存着用于创建当前对象的函数。
    • hasOwnProperty(propertyName):用于检查属性在当前对象实例中(非实例原型)中是否存在。
    • isPrototypeOf(object):检查传入的对象是否是当前对象的原型。
    • propertyIsEnumerable(propertyName):属性是否能够使用for-in语句枚举。
    • toLocaleString():返回对象字符串表示,与执行环境地区对应。
    • toString();
    • valueOf();
  2. 类型转换有的比较复杂, 建议一直用全等和不全等比较。
  3. break退出循环,continue退出当前循环。
  4. case 中可加表达式如case "hello"+"world"
  5. switch较特殊的用法:
var num = 25;    switch(true){        case num<0:            console.log("less than 0");        break;        case num>0:            console.log("bigger than 0");        break;        case num==25:            console.log("equal 25");        break;    }复制代码
  1. 函数中的局部变量arguments对象存储了传入的参数,可通过对传入参数类型或个数判断,一定程度上模拟重载。

第4章  变量、作用域和内存问题

  1. 基本类型值和引用类型值。基本类型值指的是简单的数据段,禁用类型值指那些可能有多个值构成的对象。
  2. 5种基本数据类型:Undefined、Null、Boolean、Number和String。
  3. 复制基本类型值只复制副本,对两个变量的操作互不影响。
  4. 复制引用类型的值,实际上是添加指针指向的对象,改变其中一个变量,会影响另一个变量。
  5. 所有函数的参数都是按值传递的
  6. 将对象作为参数传入函数,对象也是按值传递:
function setName(obj){        obj.name = "Nick";        obj = new Object();        obj.name = "Gray";    }    var person = new Object();    setName(person);    console.log(person.name);//"Nick"复制代码
  1. typeof instanceof
  2. 标识符解析是沿着作用域链一级一级地搜索标识符的过程。
  3. with 和 catch可延长作用域链
  4. 没有块级作用域
if(true){        var color = "blue";    }//color会成为一个全局变量    for(var i=0;i<5;i++){            }//i 会成为一个全局变量复制代码
  1. JavaScript自动垃圾收集,通常有标记清除和引用计数两种策略判断是否应该是否某个变量的内存。
  2. 引用计数循环引用会导致内存泄漏,IE中如BOM和DOM中的对象是使用C++以COM(Componet Object Model,组件对象模型)对象的形式实现的,COM对象的垃圾收集机制采用的引用计数策略。最好在不使用的时候手工断开原生JavaScript对象与DOM元素之间的连接。
  3. 一旦数据不再有用,最好将其值设置为null来释放引用--->解除引用(主要针对全局变量,局部变量会在不需要时离开环境)

第5章  引用类型

  1. 检测数组一般用instanceof Array即可
  2. Array.prototype.--->pop||push||shift||unshift||reverse||sort
  3. 比较函数接收两个参数,如果第一个参数应该位于第二个之前则返回一个负数,如两个参数相等则返回0,如果第一个参数应该位于第二个之后则返回一个正数。
var arr = [1,2,5,66,3];    function compare(value1,value2){        // if(value1 < value2){        //     return -1;//小的在前        // } else if(value1 > value2){        //     return 1;//大的在后        // } else {        //     return 0;        // }            //数值类型或其valueOf()方法返回数值类型的对象 的简写        return value1 - value2;//若返回负数,说明value1
  1. Array--->slice()
var arr = [1,2,5,66,3];    console.log(arr.slice(2));//[ 5, 66, 3 ]    console.log(arr.slice(2,4));//[ 5, 66 ]    //补充 如果参数中有负数,则用数组长度加上该数来确定相应位置复制代码
  1. Array--->splice(),可用来删除,插入,替换
var colors = ["red","green","blue"];    var removed = colors.splice(0,1);//删除第一项   参数为起始位置和要删除的项数    console.log(colors);    console.log(removed);    removed = colors.splice(1,0,"yellow","orange");//位置1开始插入两项  参数为起始位置和要删除的项数和要插入的项    console.log(colors);    console.log(removed);        removed = colors.splice(1,1,"red","purple");//插入两项删除一项  参数为起始位置和要删除的项数和要插入的任意数量的项,插入项数不必与删除的项数相等。        console.log(colors);    console.log(removed);复制代码

6.Array迭代方法--->every()||filter()||forEach()||map()||some(),都接受三个参数:数组项的值、该项在数组中的位置和数组对象本身

var numbers = [1,2,3,4,5,4,3,2,1];    var everyResult = numbers.every(function(item,index,array){//遍历判断,都满足返回true        return (item > 2);    });    console.log(everyResult);//false        var someResult = numbers.some(function(item,index,array){//有满足的就返回true        return (item > 2);    });    console.log(someResult);//true        var filterResult = numbers.filter(function(item,index,array){//筛选出数组中满足条件的,返回新数组        return (item > 2);    });    console.log(filterResult);//[ 3, 4, 5, 4, 3 ]        numbers.forEach(function(item,index,array){        console.log(item);//forEach 对数组中每一个执行特性操作 类似for循环    });    复制代码
  1. Array归并方法--->reduce()||reduceRight(),接收两个参数:一个在每一项上调用的函数和(可选的)作为归并基础的初始值,传入的函数接收4个参数:前一个值、当前值、项的索引和数组对象。
var values = [1,2,3,4,5];    var sum = values.reduce(function(prev,cur,index,array){        return prev + cur;    });    console.log(sum);//15    //reduceRight(),从后向前遍历,其他与reduce()无区别复制代码
  1. 正则表达式中的模式 g 全局 i 不区分大小写 m 多行模式
  2. RegExp属性--->global||ignoreCase||lastIndex||mutiline||source(正则表达式的字符串表示)
  3. RegExp实例方法--->exec()||test(),test用来测试传入的参数是否满足正则
var text = "mom and data and baby";    var pattern = /mom( and data( and baby)?)?/gi;        var matches = pattern.exec(text);    console.log(matches);//返回数组包含两个额外属性 index 和 input    /*[ 'mom and data and baby',      ' and data and baby',      ' and baby',      index: 0,      input: 'mom and data and baby' ]    */    console.log(matches.index);    console.log(matches.input);    console.log(matches[0]);//'mom and data and baby'    console.log(matches[1]);//' and data and baby'    console.log(matches[2]);//' and baby'复制代码
  1. RegExp构造函数属性,可分别通过长属性名和短属性名访问(Opera不支持短属性名)--->(input||$_,最近一次要匹配的字符串)||(lastMatch||$&)||(lastParen||$+最近一次匹配的捕获组||leftContext||$`)||(mutiline||$*)||(rightContext||$')
var text = "this has been a short summer";    var pattern = /(.)hort/g;        if(pattern.test(text)){        console.log(RegExp.input);//this has been a short summer        console.log(RegExp.leftContext);//this has been a        console.log(RegExp.rightContext);// summer        console.log(RegExp.lastMatch);//short        console.log(RegExp.lastParen);//s        console.log(RegExp.multiline);//undefined    }复制代码

(未完待续,每周末更新,p110)

转载地址:http://vwoll.baihongyu.com/

你可能感兴趣的文章
BAT集体升级云事业部,这背后都藏着哪些“小心思”?
查看>>
云时代的开源软件收入模式
查看>>
联合国儿童基金会投资六家区块链初创企业,目标是解决“全球性挑战”
查看>>
【leetcode】102. Binary Tree Level Order Traversal 水平遍历二叉树
查看>>
java中的内存模型
查看>>
Vue 初始化性能优化
查看>>
[LeetCode] Sudoku Solver [Backtracking]
查看>>
js函数调用模式和常用的几个方法
查看>>
zookeeper:集群中实例的数量
查看>>
基于redis实现的锁(用于控制nodejs的并发)
查看>>
js手札--关于AMD的简单分析
查看>>
Elixir Ranch: 一个用于处理套接字的网络库
查看>>
JMS规范及相关实现
查看>>
Python “黑魔法” 之 Generator Coroutines
查看>>
javascript 的工具函数
查看>>
Magento后台模块示例(2)
查看>>
衡量企业应用数据库性能的6大指标
查看>>
ng的缓存模板的用法
查看>>
Vimium 快捷键指南
查看>>
SASS入门
查看>>