美文网首页
js中的函数方法总结

js中的函数方法总结

作者: 8becbd689309 | 来源:发表于2018-01-10 15:25 被阅读16次

    由于方法太多,因此在此做一个总结,用的时候忘记了可以直接来查询。
    Object
    [[Configurable]] 能否通过delete删除属性,是否可配置,且如果设为false就不可在该回true,并且其他三个属性都不可在修改,除了[[Writable]]可以从true改为false以外;
    [[Enumerable]]:是否可枚举
    [[Writable]]:是否可修改属性值
    [[Value]]:包含属性的数据值,读取或者写入数值都保存在这个位置,默认值undefined
    这是数据属性,访问器属性最后两个变为了getter和setter函数,默认值为undefined;定义访问器属性
    Object.defineProperty(属性对象,属性名字,描述符对象)例如:

    Object.defineProperty(book,'name',{
    get:function(){},
    set:function(value){}
    });set参数为设置name属性的值,如book.name='alip';
    另外可以不用匿名函数定义访问器属性,比如:
    var book={'name':'Grea',
    get year(){},//用逗号隔开
    set year(value){}   };利用访问器属性可以在设置一个属性值得时候是其他的属性值改变
    另外定义对象多个属性值,比如:
    var book={};    Object.defineProperties(book,{
    name:{ writable:true,value:'Grea'},
    year:{get:function(){},set:function(value){}   }
    })用此方法未定义的描述符特性值为flase;
    

    读取属性特性值函数var descriptor=Object.getOwnPropertyDescriptor(object,attr);获取的是一个有attr所有描述符特性的对象,通过descriptor.value等等来读取其值。如果要获取原型属性的描述符必须在原型对象上调用此方法

    测试原型与获取属性

    • object.prototype.isPrototypeOf(object1);测试object.prototype是否在object的原型链上,是返回true,否则返回false;注意这个object指的是任意的一个对象。
    • Object.getPrototypeOf(object1).name获取到了object1的原型,并读取到了其中的name属性返回的是name 的值。
    • Person.hasOwnProperty('attr'),检测Person是否有自己的实例属性,有的话返回true,否则返回false,常和in操作符连用,name in Person检测Person上是否能访问到name属性,不管是在原型还是在实例上,只要有就返回true。
      因此可以写一个函数测试是不是原型属性。
    • Object.keys()接受一个对象作为参数,返回一个包含所有可枚举属性的字符串数组;
    • Object.getOwnPropertyNames()返回所有属性无论是否可枚举;
      另外有一个寄生组合式继承时用到的函数
    function inheritPrototype(subType,superType){
    var prototype=Object.create(superType.prototype);
    prototype.constructor=subType;
    subType.prototype=prototype;
    }调用时第一个参数是子类型构造函数,第二个是超类型构造函数
    

    函数内部自带的属性和方法
    arguments对象 拥有callee指针,指向拥有arguments这个对象的函数,由此可以递归
    caller是函数的属性,保存着调用当前函数的函数的引用,如果在全局作用域中调用当前函数,值为Null,否则用alert()弹出的就是调用此函数的源代码,这篇文章介绍了详细的区别 caller和callee的区别
    length属性是函数希望接受的参数的个数,prototype是不可枚举属性。
    arguments.length==arguments.callee.length,比较形参和实参的个数是否相等
    call()和apply(),这两个方法不是继承而来。区别在于有参数的话,第一个要逐个列举出来,第二个可以是数组实例或者是arguments对象。
    String
    .charAt()访问字符串给定位置的字符,也可以使用string[i]的形式(E8及以上)

    .concat()接受任意多个参数来拼接字符串,不过更建议使用(+)操作符,另外对数组也是可以的。
    .substr(),第一个参数起始位置,第二个参数是字符个数,第一个参数为负的话加上字符串长度,第二个为负则转为0;
    .substring(),如果参数为负数,则全转为0;并且参数小的作为开始位置。
    .slice(),第一个参数起始位置,第二个参数结束位置且不包括此位置,同上,不过参数为负数的时候都自动加上长度,也可以看成是从倒数第几个字符开始
    .split(),第一个参数是指定的分隔符,按分隔符分割字符串(分割后分隔符不在),第二个参数是分割的次数,也可以说是数组的长度
    
    .indexOf()返回子字符串的位置,如果没有找到子字符串返回-1,.lastIndexOf()从字符串的末尾开始查找;
    第二个参数可选,指定的话表示从哪个位置开始查找
    .trim(),返回一个副本,删除了字符串中前面和后面的空格,.trimLeft(),.trimRight()分别是删除前后空格
    
    
    toLowerCase,toUpperCase,转大小写。toLocalLowercase(),toLocalUppercase(),是针对特定地区实现。
    
    .match(),参数为正则表达式或者RegExp的对象如text.match(reg),返回一个与reg相匹配的字符串组成的数组
    .search(),返回的是字符串中第一个匹配项的索引,如果没有找到则返回-1,参数跟match()相同
    .replace(reg,string||function),第一个是需要匹配的项,如果替换的多用正则,第二个是替换的字符串或者用于决定如何替换的函数
    

    Array
    length属性不仅仅是只读,并且可写,因此通过设置length的长度就可以删除数组中后面几项数据,或者给数组添加新项,不过新加入的项的值为undefined,另外可以根据length属性方便的添加新项目,比如colors[colors.length]='black',每当添加新项后length就会变化。

    • Array.isArray(value)用来检测某个对象是不是数组(当网页有两个以上框架时不能在使用instanceOf,因为全局执行环境此时不只一个)
    • toString() valueOf() toLocalString()默认情况下调用后返回的都是这个数组每个值的字符串拼接而成用逗号分隔的字符串,用join()可以返回以指定分隔符分隔的字符串。值得关注的是,创建这个字符串实际是调用了数组每一项的toString()方法,调用数组的toLocaleString()方法为了取得每一项的值调用的是每一项的toLocaleString()方法,如果每一项中指定了toLocaleString()方法,那么返回的就是这个指定的值了。
    • 栈方法:推入push()接受任意数量的参数并添加到数组的末尾,返回修改后数组的长度;
      弹出pop()从数组末尾删除最后一项,减少length的值并返回移除的项。
    • 队列方法:先进先出shift()移除数组的第一项并返回该项,同时数组长度减一,和push()一起用模拟队列
      unshift()可以在数组的前端添加任意项,并返回新数组的长度,和pop()一起用模拟队列
    • 重排序方法,reverse()反转数组项的顺序,sort(),默认情况根据ASCII表顺序将数组每一项用toString()转成字符串后进行比较。可以接受一个比较函数作为参数,比较函数接受两个参数,如果第一个在第二个前则返回一个负数,如果第一个在第二个参数后则返回正数。
    • slice()方法跟字符串的用法差不多,另外如果初始位置小于结束位置则返回空数组
      splice(要删除的第一项的开始位置,要删除的项数,要插入或替换的任意项[可选,位置就是第一个参数])
    • indexOf(),lastIndexOf(),第一个参数是要查找的项,第二个参数可选,表示查找的起点位置。返回查找的项在数组中的位置,如果没有找到则返回-1;
    • 迭代方法 every()对数组中每一项运行给定函数,如果该函数对每一项都返回true,则返回true
      some()对数组每一项运行给定函数,如果函数对任一项返回true,则返回true
      filter(),返回该函数会返回true的项组成的数组;`map()`,返回每次调用函数的结果组成的数组
      foreach()该方法没有返回值,本质上与for循环迭代数组一样,并且上面这些方法都不会改变数组包含的值。
      这些方法的第一个参数为函数,第二个可选参数为运行该函数的作用域对象(影响this的值)
    函数都有三个参数,例如number.every(function(item,index,array){
    //函数主体
    })
    
    • 归并方法
      reduce()、reduceRifght(),接受两个参数,一个是在每一项上调用的函数和作为归并基础的初始值(可选)
      函数接受四个参数,前一个值,当前值,项的索引和数组对象,该函数返回的任何值都会作为第一个参数传给下一项,第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数是数组的第二项。
    var values=[1,2,3,4,5];
    var sum=values.reduce(function(prev,cur,index,array){
    return prev+cur;
    });
    alert(sum);//15    reduceRight()只是方向相反,决定从哪头开始遍历数组
    

    Date
    new Date()不传递参数的情况会自动获得当前的时间 new Date("month dd,yyyy hh:mm:ss")使用这种方式初始化时间

    • Date.now()返回调用这个方法时的日期和时间的毫秒数,对不支持的浏览器,使用+new Date()有同样的效果
    • valueOf()返回日期的毫秒表示,可以用比较操作符比较日期值,toString()、toLocaleString()会根据浏览器设置的地区相适应的格式返回日期和时间
    • getTime()返回日期毫秒数与valueOf()返回的值相同,或者加参数以毫秒设置日期
    • getFullYear() getMonth() getDate() getHours() getMinutes() getSeconds() getDay()返回星期几,除了getDay()以外,其他的get换成set就变成了设置相应的时间

    RegExp

    • RegExpObject.test(string)检测字符串是否满足匹配模式,返回true或false
    • exec()针对捕获组而设,接受一个参数即要应用模式的字符串(也就是需要测试的字符串),返回一个数组,假设保存在变量array中,其包含两个额外属性,index和inputarray.index是匹配到的项在匹配字符串中的位置,array.input是匹配字符串,没有匹配项的情况返回null;
      数组中第一项是与整个模式匹配的字符串,第二项是与第一个捕获组匹配的内容,第三项是与第二个捕获组匹配的内容。以此类推
      并且即使设置了全局标志,每次也仅仅返回一个匹配项的信息,不设置的情况多次在同一个字符串中调用只会返回第一个匹配项的信息,如果设置了全局标志,则会继续在字符串中查找新匹配项。(可以通过regexp.lastIndex测试出匹配到当前字符位置的下一个位置看出这一点)
      (如果仅仅要返回相同模式下匹配项组成的字符串,用之前提到的string.match(reg),不过使用的对象和参数位置变了)

    节点操作

    • appendChild(),向childNodes列表的末尾添加节点,更新完成后返回新增的节点,如果传入到这个方法中的节点已经存在于文档中了,那么就会将这个节点移动到新的位置。
    • insertBefore()把节点放在某个特定的位置上,第一个参数是要插入的元素,第二个是参照节点,如果参照节点是null,则执行和appendChild相同的操作,最后返回的是插入的这个节点。
    • replaceChild()要插入的节点和要替换的节点,同时返回要替换的节点并从文档树种移除。
    • removeChild()要移除的节点,被移除的节点成为方法的返回值;同上面一样,被移除的节点仍为节点所有,但在节点中已没有了自己的位置。
      这几个节点操作的都是某个节点的子节点,因此要先取得父节点。下面是所有节点都有的方法
    • cloneNode()接受布尔值参数,为true表示深复制,复制节点及其子节点,为false表示只复制节点本身。这个方法不会js属性,如时间处理程序。jquery的clone(true)则可以
      (通过childNodes获取的子节点,例如ul标签。如果第一个li元素与ul的起始标签有换行或者空格,那么第一个子节点是文本节点,其他地方的换行或者空格不会被浏览器解读为节点,因此如果一个ul有三个li为子元素的话,调用这个方法子节点可能会有6个或者7个,另外在IE9以下被解读为只有3个子节点)
    • Document类型表示文档
      document.documentElement指向页面html元素,document.body指向body元素,document.title可以读写,document.doctype取得对<!DOCTYPE>的引用来访问他的信息,不过浏览器对他的支持很有限
      与网页请求有关的三个属性:URL属性包含页面完整的URL(地址栏中显示的URL),domain属性只包含页面的域名,referrer属性保存着衔接到当前页面的那个页面的URL。没有来源的情况下包含空字符串。这些信息都存在于请求的HTTP头部,只是通过这些属性可以在js中访问他们。这三个属性中只有domain可设置,但并非可以设任何值。
      例如:如果URL包含一个子域名比如:p2p.wrox.com,那么domain只能设置为wrox.com,不能设置为URL不包含的域。另外一个限制是如果一开始是松散的:wrox.com,那么就不能设置为紧绷的p2p.wrox.com否则会导致错误,但相反的设置就可以,这样页面中有其他子域或者内嵌框架时,设置为相同的值就可以互相访问对方的javascript对象了。

    相关文章

      网友评论

          本文标题:js中的函数方法总结

          本文链接:https://www.haomeiwen.com/subject/aaqonxtx.html