内置对象源码角度理解

发表于 | 分类于

从源代码的角度理解内置对象(构造函数)

  • 本地对象: Object Function Array String Boolean Number Date 这些是基本的类(引用类型)；使用这些引用类型的时候需要进行实例化；归根到底:这些只不过就是内置的构造函数而已，仅此而已 you can do , we all can do
  • Math对象不需要new就可以直接使用，而其他对象的方法需要new才能调用它们的方法
  • 所有的构造函数—->Function构造函数—–>Object构造函数
  • function (小写) 用来声明函数 ; 就像用 var 声明 一个变量是一样的

Function 内置对象源代码 : Function是所有函数的构造函数，包括下面的内置对象

1
2
3
4
5
6
7
8
9
10
Arguments.prototype.callee = 0;
Arguments.prototype.caller = 0;
Arguments.prototype = new Array();
Arguments = {};
Function.prototype.arguments = 0;
Function.prototype.arity = 0;
Function.prototype.apply = function(thisArg,argArray) {};//apply传入数值数组
Function.prototype.call = function(thisArg,args) {};//call传入数值，单个数值传入
Function = {};//声明Function是一个对象
//ES5后有新增bind

所有的函数都是继承了Function的原型

Math内置对象源代码如下: Math对象本身就是一个对象，不需要声明就可以直接调用其方法,将Math作为对象，然后调用其方法就可以了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Math.E = 0;
Math.LN10 = 0;
Math.LN2 = 0;
Math.LOG10E = 0;
Math.LOG2E = 0;
Math.PI = 0;
Math.SQRT1_2 = 0;
Math.SQRT2 = 0;
Math.abs = function(x) {};
Math.acos = function(x) {};
Math.asin = function(x) {};
Math.atan = function(x) {};
Math.atan2 = function(x,y) {};
Math.ceil = function(x) {};
Math.cos = function(x) {};
Math.exp = function(x) {};
Math.floor = function(x) {};
Math.log = function(x) {};
Math.max = function(x) {};
Math.min = function(x) {};
Math.pow = function(x,y) {};
Math.random = function() {};
Math.round = function(x) {};
Math.sin = function(x) {};
Math.sqrt = function(x) {};
Math.tan = function(x) {};
Math = {};   //声明Math对象，以上所有的方法都是可以直接用的，无需newMath,因为Math在底层就不是构造函数

Array 内置对象(构造函数)源代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
Array.isArray = function(obj) {};//判断一个对象是不是数组，返回布尔类型
function Array(args) {} //声明Array函数,所以需要new才可以调用Array的方法
Array.prototype.concat = function(items) {};
Array.prototype.join = function(separator) {};
Array.prototype.push = function(items) {};
Array.prototype.slice = function(start,end) {};
Array.prototype.sort = function(compareFn) {};
Array.prototype.splice = function(start,deleteCount,items) {};
Array.prototype.unshift = function(items) {};
Array.prototype.valueOf = function() {};
Array.prototype.pop = function() {};
Array.prototype.shift = function() {};
Array.prototype.reverse = function() {};
//从源代码分析来看，可以得到哪些方法需要传入参数，哪些方法不需要传入参数

数组的定义

  • var arr = [ ]; var arr = new Array() ;
  • var arr = new Array(size) ; 表示定义个数组长度为size ，length为size
  • var arr = new Array(item1,item2,····)，表示定义了具体的一个数组，length为item的个数

1 arrObject.shift() : 改变原数组 删除数组的第一个 元素，返回所删除的元素；

arrObject.pop( ) : 改变原数组 删除数组的最后一个 元素，返回所删除的元素;

注意如果要操作的数组为空，那么该方法不改变数组，注意返回值是undefined 不需要传参

2 arrObject.unshift( item1,item2,···· ) : 改变原数组 向原数组中头部添加一个或多个元素，返回添加后的数组的长度；

arr.Object.push ( item1,,iten2,···· ) :改变原数组 向原数组中最后添加一个或多个元素，返回添加后数组的长度；

需要传一个参数，可以传入基本数据类型，也可以是复杂数据类型，比如向数组中添加一个对象

3 arrObject.slice(start,end) :不改变原数组 ,返回一个新的数组,会重新开辟一块内存，存储返回的数组,start必须，表示从哪个位置(索引处)开始截取数组，end可选，如果没有设定，则表示从start开始到最后所有的元素，包括start索引出的元素，不包括end索引处的元素

4 arrObject.splice(index,howmany,item1,item2,····) 改变原数组，返回含有被删除元素的数组，会重新开辟一块内存，存储返回的数组 index表示开始删除元素的索引值，howmany表示要删除的元素的个数(可以为0 ，表示不删除元素，如果未规定这个数字，那么表示删除从index索引出开始到结束所有的元素)，itemx 表示要添加的元素

5 arrObject.sort( sortby) 改变原数组 如果不传参数，默认按照字符编码 顺序进行排序；如果传入一个函数，按照函数规定的规则排序；

5 arrObject.concat(arr1,arr2····) ，不改变原数组，返回一个新的数组，会重新开辟一块内存，存储返回的数组 可以添加元素，也可以添加数组；

6 arrObject.join(seperator) ，不改变原数组 该方法把数组中的所有元素中间加一个分隔符，组成一个字符串返回

7 arrObject.toString() ; 不改变原数组 返回值与没有参数的 join() 方法返回的字符串相同。其实就是应用了join方法；

8 arrObject.reverse() ; 改变原数组 返回颠倒后的数组的引用;

9 arrObject.forEach( funtion(item,index) { } ) ; 这个是遍历数组的新的方法，第一个参数是数组中的每一个元素，第二个参数index代表每个元素的索引；function函数里面的this指向是window;

4 既然数组在new之后是一个对象，var arr = new Array() 或者通过字面量声明一个数组 var arr = [1,2,3],那么数组就可以作为对象进行操作，然后给数组添加属性

1
2
arr.name = "little arr";
arr[len] = "three";

Object 内置对象(构造函数)源代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
Object.isExtensible = function(object) {};
Object.preventExtensions = function(obj) {};
Object.getOwnPropertyDescriptor = function(obj,prop) {};
Object.defineProperty = function(obj,prop,desc) {};
Object.defineProperties = function(obj,props) {};
Object.keys = function(obj) {};
Object.getOwnPropertyNames = function(obj) {};
Object.create = function(proto,props) {};
Object.getPrototypeOf = function(obj) {};
Object.seal = function(obj) {};
Object.isSealed = function(obj) {};
Object.freeze = function(obj) {};
Object.isFrozen = function(obj) {};
//以上方法不需要实例化对象即可通过Object对象直接调用
Object.prototype.constructor = 0;
Object.prototype.length = 0;
Object.prototype.prototype = 0;
function Object(value) {}  //声明Object函数
Object.prototype.toLocaleString = function() {};
Object.prototype.hasOwnProperty = function(propertyName) {};
Object.prototype.isPrototypeOf = function(o) {};
Object.prototype.propertyIsEnumerable = function(propertyName) {};
Object.prototype.toString = function() {};
Object.prototype.valueOf = function() {};

Date内置对象(构造函数)的源代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
Date.UTC = function(year,month,date,hours,minutes,seconds,milliseconds) {};
Date.parse = function(dateString) {};//这两个方法不需要new Date 就可以使用
function Date(args) {}		//声明Date函数 以下方法必须new date对象才能用
Date.prototype.getDate = function() {};
Date.prototype.getDay = function() {};
Date.prototype.getMonth = function() {};
Date.prototype.getFullYear = function() {};
Date.prototype.getHours = function() {};
Date.prototype.getMilliseconds = function() {};
Date.prototype.getMinutes = function() {};
Date.prototype.getSeconds = function() {};
Date.prototype.getTime = function() {};
Date.prototype.getTimezoneOffset = function() {};
Date.prototype.getUTCDate = function() {};
Date.prototype.getUTCDay = function() {};
Date.prototype.getUTCFullYear = function() {};
Date.prototype.getUTCHours = function() {};
Date.prototype.getUTCMilliseconds = function() {};
Date.prototype.getUTCMinutes = function() {};
Date.prototype.getUTCMonth = function() {};
Date.prototype.getUTCSeconds = function() {};
Date.prototype.getYear = function() {};
Date.prototype.setDate = function(date) {};
Date.prototype.setFullYear = function(year,month,day) {};
Date.prototype.setHours = function(hour,min,sec,ms) {};
Date.prototype.setMilliseconds = function(ms) {};
Date.prototype.setMinutes = function(min,sec,ms) {};
Date.prototype.setMonth = function(month,day) {};
Date.prototype.setSeconds = function(sec,ms) {};
Date.prototype.setTime = function(time) {};
Date.prototype.setUTCDate = function(date) {};
Date.prototype.setUTCFullYear = function(year,month,day) {};
Date.prototype.setUTCHours = function(hour,min,sec,ms) {};
Date.prototype.setUTCMilliseconds = function(ms) {};
Date.prototype.setUTCMinutes = function(min,sec,ms) {};
Date.prototype.setUTCMonth = function(month,day) {};
Date.prototype.setUTCSeconds = function(sec,ms) {};
Date.prototype.setYear = function(value) {};
Date.prototype.toDateString = function() {};
Date.prototype.toISOString = function() {};
Date.prototype.toLocaleDateString = function() {};
Date.prototype.toLocaleString = function() {};
Date.prototype.toLocaleTimeString = function() {};
Date.prototype.toTimeString = function() {};
Date.prototype.toUTCString = function() {};

RegExp正则对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
RegExp.leftContext = null;
RegExp.input = null;
RegExp.lastParen = null;
RegExp.lastMatch = null;
RegExp.rightContext = null;
RegExp.$1 = null;
RegExp.$2 = null;
RegExp.$3 = null;
RegExp.$4 = null;
RegExp.$5 = null;
RegExp.prototype.global = 0;
RegExp.prototype.ignoreCase = 0;
RegExp.prototype.lastIndex = 0;
RegExp.prototype.multiline = 0;
RegExp.prototype.source = null;
function RegExp(pattern,options) {}
RegExp.prototype.exec = function(String) {};
RegExp.prototype.test = function(String) {};

创建正则对象的方法:

1
2
3
4
5
6
1 字面量		 var patt1 = / pattern / attribute
2 构造函数声明   var patt2 = new RegExp('pattern','attribute')
	var patt1 = /d\d/g;
    var patt2 = new RegExp('d\\d','g');
    var patt3 = new RegExp('d\d','g');
//注意区分patt2 和patt3 \ 是转义字符

正则对象的属性

1
2
3
4
5
6
7
8
9
10
11
var patt1 = /d\d/g;
console.log(patt1.source);//d\d
console.log(patt1.global);//true
console.log(patt1.ignoreCase);//false
console.log(patt1.multiline );//fa;se
console.log(patt1.lastIndex);//该属性存放一个整数，它声明的是上一次匹配文本之后的第一个字符的位置。
//source :返回字符串形式 返回正则表达式匹配的原文本 pattern，该文本不包括正则表达式直接量使用的定界符，也不包括标志 g、i、m。
//global ignoreCase multiline  返回true 或者false ,用来判断正则对象是否声明了 g  i  m
//lastIndex:
/*上次匹配的结果是由方法 RegExp.exec() 和 RegExp.test() 找到的，它们都以 lastIndex 属性所指的位置作为下次检索的起始点。这样，就可以通过反复调用这两个方法来遍历一个字符串中的所有匹配文本。
该属性是可读可写的。只要目标字符串的下一次搜索开始，就可以对它进行设置。当方法 exec() 或 test() 再也找不到可以匹配的文本时，它们会自动把 lastIndex 属性重置为 0。*/

正则对象的方法

1
2
RegExpObject.test(str) 用来检测str字符串中是否有该正则对象，返回值是true或者false；
RegExpObject.exec(str) 返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。

###JS包装对象如下

Boolean 内置对象(构造函数)的源代码如下

1
2
function Boolean(value) {}   //声明Boolean函数
Boolean.prototype.valueOf = function() {};

Number内置对象(构造函数)的源代码如下

1
2
3
4
5
6
7
8
9
10
11
Number.MAX_VALUE = 0;
Number.MIN_VALUE = 0;
Number.NaN = 0;
Number.NEGATIVE_INFINITY = 0;
Number.POSITIVE_INFINITY = 0;//上面这几个Number方法不需要 new Number便可以直接使用
function Number(value) {}   //声明Number函数
Number.prototype.toExponential = function(fractionalDigits) {};
Number.prototype.toFixed = function(fractionalDigits) {};
Number.prototype.toPrecision = function(precision) {};
Number.prototype.toString = function(radix) {};
Number.prototype.valueOf = function() {};

1 numberObject.toString() 可以传入基数，表达将数字按照那个进制转化为字符串

2 numberObject.valueOf() 得到number对象的原始值；

3 numberObject.toFixed(n) 返回的是具有指定位数小数的数字的字符串表示

String 内置对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
String.fromCharCode = function(chars) {};
function String(value) {}
String.prototype.anchor = function(nameAttribute) {};
String.prototype.big = function() {};
String.prototype.blink = function() {};
String.prototype.bold = function() {};
String.prototype.charAt = function(pos) {};
String.prototype.charCodeAt = function(index) {};
String.prototype.concat = function(strings) {};
String.prototype.fixed = function() {};
String.prototype.fontcolor = function(color) {};
String.prototype.fontsize = function(size) {};
String.prototype.indexOf = function(searchString,position) {};
String.prototype.italics = function() {};
String.prototype.lastIndexOf = function(searchString,position) {};
String.prototype.link = function(href) {};
String.prototype.localeCompare = function(that) {};
String.prototype.match = function(regexp) {};
String.prototype.replace = function(searchValue,replaceValue) {};
String.prototype.search = function(regexp) {};
String.prototype.slice = function(start,end) {};
String.prototype.small = function() {};
String.prototype.split = function(separator,limit) {};
String.prototype.strike = function() {};
String.prototype.sub = function() {};
String.prototype.substr = function(start,length) {};
String.prototype.substring = function(start,end) {};
String.prototype.sup = function() {};
String.prototype.toLowerCase = function() {};
String.prototype.toLocaleLowerCase = function() {};
String.prototype.toLocaleUpperCase = function() {};
String.prototype.toUpperCase = function() {};
String.prototype.valueOf = function() {};