JavaScript阮一峰教程标准库API一览

2018-04-23  本文已影响35人  joker731

实例方法和静态方法最直观的区别

//对象.方法(参数)
arr.push()
//静态方法(对象)
Array.isArray( arr)

记忆那么多的API是有难度的,而且常用的也不多,理解对象本身的特性是最重要的,想一下这个API方法或者属性可以对这个对象形成怎样的影响? 起了哪些便利之处

数组和对象的本质区别在于,数组的属性是有序的,而对象的属性是无序的,也就是说数组数据存放在内存的位置是排列的,这就涉及到数据结构

数组/对象...的方法调用

1.用.运算符
2.('xxx') ['xxx'] 这是调用自身拥有的属性,是key的名称
3.(xxx)[xxx]这是调用自身属性里面的变量

静态方法和实例方法的区别

var a = {
  b:'你好世界',
  c:'hello'
        }
Object.keys(a)
//['b','c']
a.keys()
//报错
为什么下面的语句会报错?
//因为静态方法和实例方法是有区别的,静态方法指的是对象本身拥有的方法,实例方法是对象.prototy.xxx放在prototy给子孙后代继承用的
//简单来说,a对象是Object对象的实例,a能用的方法是继承自Object的prototy属性里面的方法,所以a是没有keys()这个方法的,所以报错

不同的对象都有自己的toString和valueOf方法具体用法要看具体类型

数值相关全局方法

shuzi.png

常用4个

- parseInt方法用于将字符串转为整数。
- parseFloat方法用于将一个字符串转为浮点数。
- isNaN方法可以用来判断一个值是否为NaN。
- isFinite方法返回一个布尔值，表示某个值是否为正常的数值。

Object对象API

obeje.png

（1）对象属性模型的相关方法

Object.getOwnPropertyDescriptor()：获取某个属性的描述对象。
Object.defineProperty()：通过描述对象，定义某个属性。
Object.defineProperties()：通过描述对象，定义多个属性。
（2）控制对象状态的方法

Object.preventExtensions()：防止对象扩展。
Object.isExtensible()：判断对象是否可扩展。
Object.seal()：禁止对象配置。
Object.isSealed()：判断一个对象是否可配置。
Object.freeze()：冻结一个对象。
Object.isFrozen()：判断一个对象是否被冻结。
（3）原型链相关方法

Object.create()：该方法可以指定原型对象和属性，返回一个新的对象。
Object.getPrototypeOf()：获取对象的Prototype对象。

常用性思考:

一个对象拥有的东西只能是属性/属性对应的值/继承的方法,
从这方面思考就可以想到常用的API是哪些:枚举属性的,属性的tostring/valueOf,继承相关的

常用的8个

//静态方法
Object.keys()，Object.getOwnPropertyNames()
//实例方法
Object.prototype.valueOf()：返回当前对象对应的值。
Object.prototype.toString()：返回当前对象对应的字符串形式。
//toString方法，结果返回一个字符串object Object，其中第二个Object表示该值的构造函数。这是一个十分有用的判断数据类型的方法。
//由于实例对象可能会自定义toString方法，覆盖掉Object.prototype.toString方法，所以为了得到类型字符串，最好直接使用Object.prototype.toString方法。
//通过函数的call方法，可以在任意值上调用这个方法，帮助我们判断这个值的类型。
Object.prototype.toLocaleString()：返回当前对象对应的本地字符串形式。
Object.prototype.hasOwnProperty()：判断某个属性是否为当前对象自身的属性，还是继承自原型对象的属性。
/*var obj = {
  p: 123
};
obj.hasOwnProperty('p') // true
obj.hasOwnProperty('toString') // false
*/


Object.prototype.isPrototypeOf()：判断当前对象是否为另一个对象的原型。
Object.prototype.propertyIsEnumerable()：判断某个属性是否可枚举。

Array对象API

array.png 
- valueOf方法是一个所有对象都拥有的方法，表示对该对象求值。不同对象的valueOf方法不尽一致，数组的valueOf方法返回数组本身。
- toString方法也是对象的通用方法，数组的toString方法返回数组的字符串形式。
- push方法用于在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度。注意，该方法会改变原数组。
- pop方法用于删除数组的最后一个元素，并返回该元素。注意，该方法会改变原数组。
- shift方法用于删除数组的第一个元素，并返回该元素。注意，该方法会改变原数组。
- push和shift结合使用，就构成了“先进先出”的队列结构（queue）。

unshift方法用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。注意，该方法会改变原数组。
- join方法以指定参数作为分隔符，将所有数组成员连接为一个字符串返回。如果不提供参数，默认用逗号分隔。
- concat方法用于多个数组的合并。它将新数组的成员，添加到原数组成员的后部，然后返回一个新数组，原数组不变。
- reverse方法用于颠倒排列数组元素，返回改变后的数组。注意，该方法将改变原数组。
- slice方法用于提取目标数组的一部分，返回一个新数组，原数组不变。
- splice方法用于删除原数组的一部分成员，并可以在删除的位置添加新的数组成员，返回值是被删除的元素。注意，该方法会改变原数组。
- sort方法对数组成员进行排序，默认是按照字典顺序排序。排序后，原数组将被改变。
- map方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回。
- forEach方法与map方法很相似，也是对数组的所有成员依次执行参数函数。但是，forEach方法不返回值，只用来操作数据。这就是说，如果数组遍历的目的是为了得到返回值，那么使用map方法，否则使用forEach方法。
- filter方法用于过滤数组成员，满足条件的成员组成一个新数组返回。
- some方法是只要一个成员的返回值是true，则整个some方法的返回值就是true，否则返回false。
- every方法是所有成员的返回值都是true，整个every方法才返回true，否则返回false。
- reduce方法和reduceRight方法依次处理数组的每个成员，最终累计为一个值。它们的差别是，reduce是从左到右处理（从第一个成员到最后一个成员），reduceRight则是从右到左（从最后一个成员到第一个成员），其他完全一样。
- indexOf方法返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1。
- lastIndexOf方法返回给定元素在数组中最后一次出现的位置，如果没有出现则返回-1。

数组的常用性思考:

1.数组成员的增删改查和遍历
2.数组的出现就是要区别于简单的对象,他存在的意义就是数据的结构性
3.数组的排序,讲究的是内存区域的位置顺序而与数据类型无关,所以一个数组可以存放多种不同类型的数据
4.因为数据是牵涉到数据结构的对象,所以数据的很多API是会修改原来数组的
5.数组和伪数组的本质区别在于原型链不同,伪数组是没有继承Array.prototy.xxxx一系列方法的
6.上面这些数组方法之中，有不少返回的还是数组，所以可以链式使用。
7.push和pop结合使用，就构成了“后进先出”的栈结构（stack）。
8.push和shift结合使用，就构成了“先进先出”的队列结构（queue）。

NumberAPI

number.png

包装对象

包装的意义就在于,更改原数据的原型链,这才真正实现了JavaScript一切都是对象的定义

new Number(123).valueOf()  // 123
new String('abc').valueOf() // "abc"
new Boolean(true).valueOf() // true

new Number(123).toString() // "123"
new String('abc').toString() // "abc"
new Boolean(true).toString() // "true"

stringAPI

string.png

常用属性思路:

1.字符是单个的,字符串就是一个字符的数组,应该有很多类似Array.prototy.xxx的方法
2.牵涉到字符,肯定也会牵涉到Unicode编码
3.字符串和数组有点不同,数组侧重点在于改变数据结构,所以很多API会改变数组本身,而字符串侧重点在于取值,所以和数组很多类似的API不会改变字符串本身而是返回一个新对象
4.字串的增删改查

substr方法的第一个参数是子字符串的开始位置（从0开始计算），第二个参数是子字符串的长度。

mathAPI

math.png 
Math对象还提供一系列三角函数方法。

Math.sin()：返回参数的正弦（参数为弧度值）
Math.cos()：返回参数的余弦（参数为弧度值）
Math.tan()：返回参数的正切（参数为弧度值）
Math.asin()：返回参数的反正弦（返回值为弧度值）
Math.acos()：返回参数的反余弦（返回值为弧度值）
Math.atan()：返回参数的反正切（返回值为弧度值）

DateAPI

//Date对象提供了一系列get*方法，用来获取实例对象某个方面的值。
getTime()：返回实例距离1970年1月1日00:00:00的毫秒数，等同于valueOf方法。
getDate()：返回实例对象对应每个月的几号（从1开始）。
getDay()：返回星期几，星期日为0，星期一为1，以此类推。
getYear()：返回距离1900的年数。
getFullYear()：返回四位的年份。
getMonth()：返回月份（0表示1月，11表示12月）。
getHours()：返回小时（0-23）。
getMilliseconds()：返回毫秒（0-999）。
getMinutes()：返回分钟（0-59）。
getSeconds()：返回秒（0-59）。
getTimezoneOffset()：返回当前时间与 UTC 的时区差异，以分钟表示，返回结果考虑到了夏令时因素。
//上面这些get*方法返回的都是当前时区的时间，Date对象还提供了这些方法对应的 UTC 版本，用来返回 UTC 时间。
getUTCDate()
getUTCFullYear()
getUTCMonth()
getUTCDay()
getUTCHours()
getUTCMinutes()
getUTCSeconds()
getUTCMilliseconds()


Date对象提供了一系列set*方法，用来设置实例对象的各个方面。

setDate(date)：设置实例对象对应的每个月的几号（1-31），返回改变后毫秒时间戳。
setYear(year): 设置距离1900年的年数。
setFullYear(year [, month, date])：设置四位年份。
setHours(hour [, min, sec, ms])：设置小时（0-23）。
setMilliseconds()：设置毫秒（0-999）。
setMinutes(min [, sec, ms])：设置分钟（0-59）。
setMonth(month [, date])：设置月份（0-11）。
setSeconds(sec [, ms])：设置秒（0-59）。
setTime(milliseconds)：设置毫秒时间戳。
//set*系列方法除了setTime()和setYear()，都有对应的 UTC 版本，即设置 UTC 时区的时间。

setUTCDate()
setUTCFullYear()
setUTCHours()
setUTCMilliseconds()
setUTCMinutes()
setUTCMonth()
setUTCSeconds()

正则表达式API

zhengze.png

jsonAPI

json.png

consoleAPI console.png

属性描述对象API

kongzhi.png

意外收获

!!el&&el.NodeType ===1
//为什么要这样写代码来判断是否是元素节点呢?
//因为JavaScript是动态语言,类型可以转换,再加上,使用xxx.NodeType这些挂载在对象属性上的方法,是可以伪造的

var a = {
NodeType:1
}

//如上所示,这样是不是把a也当做一个元素啦?
所以基于这些原因,当JavaScript 代码要做判断的时候往往要用上&&来进行多层筛选,这样才能确保达到我们的目的

上一篇下一篇

猜你喜欢

热点阅读