JavaScript高级程序设计 - CH5

第五章、引用类型

一共七种引用类型：

• Object： 可经过new和字面量两种方法来建立。在使用字面量表示法的时候，并不会调用对象的构造函数
• Array： 17种经常使用方法; 同object同样可经过new和字面量两种方法来建立。
• Date：
• RegExp：
• Function： 函数名指针，this指针，prototype原型链，apply()、call()
• 基本包装类型(Boolean, Number, String)：
• 单体内置对象(Global, Math)：

1.Object类型

两种访问对象属性的方法:

1. person["name"];
2. person.name;

一般建议使用点表示法
方括号表示方法主要优势： 经过变量来访问属性。

2.Array类型

·[].length属性不是只读的，能够读取，修改，扩大/新增，缩小/删除。

Array对象方法简介 (17 = 2+2+2+2+2+5+2)

• 栈方法(LIFO): push(), pop()
• 队列方法(FIFO): push(), shift()
  另外还有unshift()
• 重排序方法： reverse(), sort()
  调用的是toString类型，因此比较的是ascii码
• 操做方法： concat(), slice()
• 位置方法： indexOf(), lastIndexOf();
  使用的是全等号
• 迭代方法： every(), filter(), some(), forEach(), map()
• 归并方法： reduce(), reduceRight()

---

经典问题: 检测对象是不是数组 arr instanceof Array?

本质依赖于构造函数，受到执行环境影响。因此，ES5当中是新增了Array.isArray(arr)方法。

经典问题: 类型判别?

• typeof

null是对象空指针，适合判断基本类型变量，不适合判断引用类型（都返回object），好比自定义的对象类型

• instanceof

若是有多个框架，那就存在两个以上不一样的全局执行环境，那就会有两个不一样版本的Array的构造函数。
并且返回的是true/false

• constructor

高效可是危险Null or Undefined

• Object.prototype.toString.call() 建议使用

---

Array对象方法详解

方法前面带*表示不修改原来数组

• *join() 全部元素拼接成一个字符串，返回字符串

['Fire', 'Air', 'Water'].join('-')); //"Fire-Air-Water"

逆方法： String.prototype.split()

• *slice()切片：从已有的数组中返回选定的元素

var animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
animals.slice(2);// Array ["camel", "duck", "elephant"]
animals.slice(2, 4);//Array ["camel", "duck"]
animals.slice(-2, -1) <==> animals.slice(3, 4) //前提条件：长度为5

• *concat()链接两个或多个数组,返回新数组

arr1.concat(arr2)

• splice()从数组中添加/删除项目，返回被删除的元素

months.splice(1, 0, 'Feb');  // inserts at index 1
months.splice(4, 1, 'May');  // replaces 1 element at index 4

• pop() 删除数组最后一个元素，返回被删除的元素。若是数组为空，则不改变数组，返回undefined
• shift()把数组的第一个元素删除，返回第一个元素的值。若空数组，不进行任何操做，返回undefined
• push()向数组末尾添加一个或多个元素返回新数组的长度
• unshift()向数组的开头添加一个或多个元素，返回新数组的长度
• reverse()颠倒元素顺序，返回该数组
• sort()根据ascii进行排序，返回该数组

[0,1,5,10,15].sort(); //[0,1,10,15,5]
[0,1,5,10,15].sort( (v1,v2) => { return (v1<=v2)? -1:1; }); //[0,1,5,10,15]

• *toString() 返回数组的字符串形式

toLocalString()

Date类型

var start = Date.now();
// do something
var end = Date.now();
costTime = stop -start;

RegExp类型

var pattern = /[bc]at/gi <==> new RegExp("[bc]at","gi"); //大小写不敏感，全局匹配bat或者cat
var matches = pattern.exec("bat is not a cat");

Function类型

函数名仅仅是指向函数的指针，不会与某个函数绑定（即变量法的函数引用是能够被覆盖的）
注意函数声明提高（function declaratioin hoisting）和变量提高是有区别的。

//unexpected identifier
alert(sum(1,1));
var sum = function(v1, v2){
    return v1 + v2;
}
//ok
alert(sum1(1,1));
function sum1(v1, v2){
    return v1 + v2;
}

内部对象，this指针和类数组对象arguments

1. 类数组对象arguments

严格模式下arguments.callee和arguments.caller无效

1. this指针

注意做用域

window.color = "red";
var o = { color : "blue"};
function sayColor(){
    alert(this.color);
}
sayColor(); //red
o.sayColor() = sayColor();
o.sayColor(); //blue

Function的prototype属性、内部方法

fn.length属性表示fn但愿接收的参数的个数
prototype属性
保存全部实例方法的真正所在，换言之甚至toString(),valueOf()等方法都在prototype之下。
在建立自定义引用类型以及实现继承时，prototype极为重要。而且它是不可枚举的，所以for-in没法发现。
内部方法
每一个fn都包含apply()和call()，apply()固定接收两个参数，做用域和arguments， call()接收多个参数，第一个是做用域。
这两个函数能够用来传参数，可是真正的做用是扩充做用域：如此对象和方法不须要有任何的耦合关系

window.color = "red";
var o = { color : "blue"};
function sayColor(){
    alert(this.color);
}
sayColor.call(this); //red
sayColor.call(window); //red
sayColor.call(o); //blue

基本包装类型(Boolean, Number, String)

咱们知道，基本类型值不是对象，所以逻辑上应该是没有方法的。可是实际当中Boolean, Number, String这三种在访问/读取的时候，会进入一种“读取模式”：建立实例 =》实例上调用方法 =》销毁实例
这种读取模式是隐性的，而且不建议显示调用。由于会让人分不清是在处理基本类型仍是引用类型。

• 直接调用基本包装类型的构造函数，返回实例都属于object

  var value = Number("25");
  alert(typeof value);// number
  var value2 = new Number("25");
  alert(typeof value2);// object

• new Object()这个构造函数是会根据参数返回相应的基本包装类型的实例。说白了就是工厂模式呗

  var obj = new Object("test");
  alert(obj instanceof String) //true

Boolean基本包装对象

很烂很烂很烂，不要去用

Number基本包装对象

num.toFixed(2); //精确两位小数
num.toExponential(2) //科学计数法保留两位小数
num.toPrecision（2） //看哪一种格式方便，自动返回fixed仍是指数形式

String基本包装对象

• 字符方法：str.charAt(2); str[2]
• 操做方法：str.concat(); str.slice(), str.substring, str.substr()
  后面三个都是返回一个新串串。均可以接受两个参数，slice()和substring()是[start,end]，而substr是[start,length]
• 位置方法：str.indexOf(); str.lastIndexOf()
  若是接受第二个参数，表示从第几位开始查起
• trim方法： 去除开头结尾的空格
• 大小写转换方法： toUpperCase(); toLowerCase()
  少数语言（好比土耳其语）会为Unicode来应用特殊的转换规则，因此最好用toLocalUpperCase()

• 模式匹配方法： str.match(pattern); str.replace(), str.split(),str.includes()

  var mathces = pattern.exec(str) <==> str.match(pattern);
  var str = "cat,bat,fat"; //pattern必定要用全局模式g
  alert( str.replace(/(.at)/g, "word ($1)") ); //word (cat), word (bat), word (fat)

• padding方法: str.padStart(), str.padEnd();

  const fullNumber = '2034399002125581';
  const last4Digits = fullNumber.slice(-4);
  const maskedNumber = last4Digits.padStart(fullNumber.length, '*'); //"************5581"

单体内置对象(Global, Math)

由ECMAScript实现提供的、不依赖于宿主环境的对象。

Global对象

• URI编码方法： encodeURI(), encodeURIComponent()

//http://www.w3school.com.cn/My%20first/
encodeURI("http://www.w3school.com.cn/My first/")
// http%3A%2F%2Fwww.w3school.com.cn%2FMy%20first%2F
encodeURIComponent("http://www.w3school.com.cn/My first/"

• eval()方法，执行字符串代码

var msg = "hello world";
eval("alert(msg)");

• window对象
  web浏览器都是把Global对象做为window对象的一部分来实现的。所以，在全局做用域中声明的全部变量和函数，都成为了window对象的属性

Math对象

• Math对象的属性

Math.E常量e，Math.PI常量圆周率

• min(), max()接受多参数

// 这个技巧的关键是把Math对象做为第一个参数，从而正确地设置this指针，而后吧values数组做为参数
var values = [1,2,3,4,5];
var max = Math.max.apply(Math, values);

• 舍入方法

Math.ceil(); // 向上取整
Math.floor(); // 向下取整
Math.round(); // 四舍五入整数

• 随机数random()

本质是返回(0,1)的一个随机数
值 = Math.floor( Math.random() * 可能值的总数 + 第一个可能的值 );

• 其余方法

Math.abs(num);
Math.pow(num,power); //num^power
三角函数、反三角函数等