深入js系列-类型(对象)

开篇

值的传递方式

1.值传递表示传递过程中复制了值

2.引用传递表示传递过程中传递的是值的引用

js的传递方式值传递

看下面的例子

// 这里值传递很容易理解

var a = 1

var b = a // a = 1 b = 1

b = 3 // a = 1 b = 3

// 引用也是值传递

var a = [1,2,3];

var b = a;

a; // [1,2,3]

b; // [1,2,3]

// 然后

b = [4,5,6];

a; // [1,2,3]

b; // [4,5,6]

// 假如是引用传递

b = [4,5,6];

a; // [4,5,6]

b; // [4,5,6]

b=[4,5,6] 并不影响a 指向值[1,2,3]，除非b 不是指向数组的引用，而是指向a 的指针，在C++你可以用指针来实现这种变化

但在JavaScript 中不存在这种情况！

如何生成对象

1.使用对象字面值

let person = {

  age: 21

}

2.使用构造函数

function Person(age) {

  this.age = age

}

let person = new Person(age)

我们先看一下原生构造函数

String() // 字符串

Number() // 数字

Boolean() // 布尔

Array() // 数组

Object() // 对象

Function() // 函数

RegExp() // 正则

Date() // 日期

Error() // 异常父类

Symbol()——ES6 中新加入的！ // symbol

如何区分内置对象

所有typeof 返回值为"object" 的对象（如数组）都包含一个内部属性[[Class]],目前ES6这个属性改了名字，暂时没找到文献，不过行为是一致的

Object.prototype.toString.call( null )

// "[object Null]"

Object.prototype.toString.call( undefined )

// "[object Undefined]"

Object.prototype.toString.call( "abc" )

// "[object String]"

Object.prototype.toString.call( 42 )

// "[object Number]"

Object.prototype.toString.call( true )

// "[object Boolean]"

Object.prototype.toString.call( Symbol())

// "[object Symbol]"

Object.prototype.toString.call( {} )

// "[object Object]"

Object.prototype.toString.call( [1,2,3] )

// "[object Array]"

Object.prototype.toString.call( new Date() )

// "[object Date]"

Object.prototype.toString.call( new Error() )

// "[object Error]"

Object.prototype.toString.call( new Function () )

// "[object Function]"

Object.prototype.toString.call( /regex-literal/i );

// "[object RegExp]"

对象包装和拆封

默默无闻的对象包装和拆封，但很重要，注意下面的例子，"abc"是我经常使用的字符串表达方式，它是基本值,是没有.length和.toString方法的，需要把它封装成对象才能访问这些属性或者方法

  // 自动包装前

  var a = new String("abc")

  a.length // 3

  a.toUpperCase // ABC

  // 自动包装后

  var a = "abc"

  a.length // 3

  a.toUpperCase // "ABC"

一般情况下，最好是让js引擎来决定使用封装对象的时机，就是说我们优先考虑"abc"、42 而不是 new String("abc") new Number(42)

特殊情况封装对象结果和基本值不同

var a = new Boolean( false ); // 对象是真值

if (!a) {

console.log( "Oops" ); // 执行不到这里

}

拆封

使用包装对象的valueof函数即可

var a = new String( "abc" );

var b = new Number( 42 );

var c = new Boolean( true );

a.valueOf(); // "abc"

b.valueOf(); // 42

c.valueOf(); // true

原生函数作为构造函数

1.Array() // new 在不写是会默认补全

var a = new Array( 1, 2, 3 );

a; // [1, 2, 3]

var b = [1, 2, 3];

b; // [1, 2, 3]

问题

Array作为构造函数时，单个参数被认为是预设数组的长度

1.这个异常行为很容易被人忘记导出容易犯错

2.预设长度会导致空数组，就是数组包含未赋值的元素，更严重的问题是，数组api对这种称为稀疏数组的行为不一致

var a = new Array( 3 ); // [empty * 3] 而不是 [3] 

a.map((e, index) => index) // [empty * 3] 而不是 [0，1， 2]

a.join("-") //  - -

生成指定长度undefined单元数组

var a = Array.apply( null, { length: 3 } );

a; // [ undefined, undefined, undefined ]

ES6 Array.from()

var a = Array.from({length: 3})

a; // [ undefined, undefined, undefined ]

2.Object()

使用Object构造对象，需要逐个赋值

var c = new Object();

c.foo = "bar";

c; // { foo: "bar" }

var d = { foo: "bar" };

d; // { foo: "bar" }

3.Function

需要在动态定义函数和函数体时才使用

var sum = new Function('a', 'b', 'return a + b');

console.log(sum(2, 6));

4.RegExp

在动态定义正则表达式时使用

var name = "Kyle";

var namePattern = new RegExp( "\\b(?:" + name + ")+\\b", "ig" );

var matches = someText.match( namePattern );

5.Date

用来获取时间戳

new Date().getTime()

// ES6 新API

Date.now

6.Error

获取函数调用栈信息和产生错误的代码行号

7.Symbol()

Symbol() /不能使用new