JS总结篇--[总结]JS经常使用要领与片断

1.javascript删除元素节点

IE中有如许一个要领:removeNode(),这个要领在IE下是好使的,但是在Firefox等范例浏览器中就会报错了 removeNode is not defined,但是在中心JS中有一个操纵DOM节点的要领叫:removeChild()。

我们可以先去找到要删除节点的父节点,然后在父节点中运用removeChild来移除我们想移除的节点。我们可以定义一个要领叫removeElement:

function removeElement(_element){
         var _parentElement = _element.parentNode;
         if(_parentElement){
                _parentElement.removeChild(_element); 
         }
}
<div><input onclick="removeElement(this)" type="text" value="点击移除该输入框" /></div> 

2.js sort要领依据数组中对象的某一个属性值举行升序或许降序分列

/**数组依据数组对象中的某个属性值举行排序的要领 
     * 运用例子:newArray.sort(sortBy('number'),false) //示意依据number属性降序分列;若第二个参数不通报,默许示意升序排序
     * @param attr 排序的属性 如number属性
     * @param rev true示意升序分列,false降序排序
     * */
    sortBy: function(attr,rev){
        //第二个参数没有通报 默许升序分列
        if(rev ==  undefined){
            rev = 1;
        }else{
            rev = (rev) ? 1 : -1;
        }
        
        return function(a,b){
            a = a[attr];
            b = b[attr];
            if(a < b){
                return rev * -1;
            }
            if(a > b){
                return rev * 1;
            }
            return 0;
        }
    }

3.charCodeAt()

用法:charCodeAt() 要领可返回指定位置的字符的 Unicode 编码。这个返回值是 0 – 65535 之间的整数
语法:stringObject.charCodeAt(index)
index参数必填,示意字符串中某个位置的数字,即字符在字符串中的下标。
注:字符串中第一个字符的下标是 0。假如 index 是负数,或大于即是字符串的长度,则 charCodeAt() 返回 NaN
比方:

var str="Hello world!"
document.write(str.charCodeAt(1))
//效果:101

参考地点:http://www.w3school.com.cn/js…

4.js 页面革新location.reload和location.replace的区分小结

reload 要领,该要领强制浏览器革新当前页面。
语法: location.reload([bForceGet])
参数: bForceGet, 可选参数, 默许为 false,从客户端缓存里取当前页。true, 则以 GET 体式格局,从服务端取最新的页面, 相当于客户端点击 F5(“革新”)

replace 要领,该要领经由过程指定URL替换当前缓存在汗青里(客户端)的项目,因而当运用replace要领以后,你不能经由过程“行进”和“退却”来访问已被替换的URL
语法: location.replace(URL)

在现实运用的时刻,从新革新页面的时刻,我们一般运用: location.reload() 或许是 history.go(0) 来做。由于这类做法就像是客户端点F5革新页面,所以页面的method=”post”的时刻,会涌现“网页逾期”的提醒。那是由于Session的平安庇护机制。可以想到: 当挪用 location.reload() 要领的时刻, aspx页面此时在服务端内存里已存在, 因而必定是 IsPostback 的。假如有这类运用: 我们须要从新加载该页面,也就是说我们希冀页面可以在服务端从新被建立, 我们希冀是 Not IsPostback 的。这里,location.replace() 就可以完成此使命。被replace的页面每次都在服务端从新天生。你可以这么写: location.replace(location.href)
参考地点:http://zccst.iteye.com/blog/2…

5.isFinite函数

isFinite函数返回一个布尔值,搜检某个值是否是一般数值,而不是Infinity。

isFinite(Infinity) // false
isFinite(-1) // true
isFinite(true) // true
isFinite(NaN) // false

6.parseInt()

parseInt要领用于将字符串转为整数。

parseInt('123') // 123

假如parseInt的参数不是字符串,则会先转为字符串再转换。

假如字符串头部有空格,空格会被自动去除。

字符串转为整数的时刻,是一个个字符顺次转换,假如碰到不能转为数字的字符,就不再举行下去,返回已转好的部份。

parseInt('8a') // 8
parseInt('12**') // 12
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15

面代码中,parseInt的参数都是字符串,效果只返回字符串头部可以转为数字的部份。

假如字符串的第一个字符不能转化为数字(背面随着数字的正负号除外),返回NaN。

parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1

parseInt的返回值只要两种能够,不是一个十进制整数,就是NaN。

parseInt要领还可以接收第二个参数(2到36之间),示意被剖析的值的进制,返回该值对应的十进制数。默许情况下,parseInt的第二个参数为10,即默许是十进制转十进制。

parseInt('1000', 2) // 8
parseInt('1000', 6) // 216
parseInt('1000', 8) // 512

面代码中,二进制、六进制、八进制的1000,离别即是十进制的8、216和512。这意味着,可以用parseInt要领举行进制的转换。

假如第二个参数不是数值,会被自动转为一个整数。这个整数只要在2到36之间,才获得有意义的效果,超越这个局限,则返回NaN。假如第二个参数是0、undefined和null,则直接疏忽。

parseInt('10', 37) // NaN
parseInt('10', 1) // NaN
parseInt('10', 0) // 10
parseInt('10', null) // 10
parseInt('10', undefined) // 10

假如字符串包含关于指定进制无意义的字符,则从最高位最先,只返回可以转换的数值。假如最高位没法转换,则直接返回NaN。

parseInt('1546', 2) // 1
parseInt('546', 2) // NaN

上面代码中,关于二进制来讲,1是有意义的字符,5、4、6都是无意义的字符,所以第一行返回1,第二行返回NaN。

7.parseFloat()

parseFloat要领用于将一个字符串转为浮点数。

parseFloat('3.14') // 3.14

假如字符串相符科学计数法,则会举行响应的转换。

parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14

假如字符串包含不能转为浮点数的字符,则不再举行今后转换,返回已转好的部份。

parseFloat('3.14more non-digit characters') // 3.14

parseFloat要领会自动过滤字符串前导的空格。

parseFloat('\t\v\r12.34\n ') // 12.34

假如参数不是字符串,或许字符串的第一个字符不能转化为浮点数,则返回NaN。

parseFloat([]) // NaN
parseFloat('FF2') // NaN
parseFloat('') // NaN

面代码中,特别值得注重,parseFloat会将空字符串转为NaN

这些特性使得parseFloat的转换效果差别于Number函数。

parseFloat(true)  // NaN
Number(true) // 1

parseFloat(null) // NaN
Number(null) // 0

parseFloat('') // NaN
Number('') // 0

parseFloat('123.45#') // 123.45
Number('123.45#') // NaN

8.charAt()

charAt() 要领可返回指定位置的字符。
请注重,JavaScript 并没有一种有别于字符串范例的字符数据范例,所以返回的字符是长度为 1 的字符串。

语法:stringObject.charAt(index)

解释:字符串中第一个字符的下标是 0。假如参数 index 不在 0 与 string.length 之间,该要领将返回一个空字符串。

例子,在字符串 “Hello world!” 中,我们将返回位置 1 的字符:

var str="Hello world!"
document.write(str.charAt(1)) //e

9.toFixed()

var a=2.1512131231231321;  
console.log(a.toFixed(2)); //2.15

10.join()

join() 要领用于把数组中的一切元素放入一个字符串。元素是经由过程指定的分开符举行分开的。
语法:
arrayObject.join(separator) //separator:可选。指定要运用的分开符。假如省略该参数,则运用逗号作为分开符。

注重:返回的是一个字符串

比方:

<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join("."))
</script>

输出:George.John.Thomas

11.split()

语法:stringObject.split(separator,howmany)

separator:必需。字符串或正则表达式,从该参数指定的处所支解 stringObject。

howmany:可选。该参数可指定返回的数组的最大长度。假如设置了该参数,返回的子串不会多于这个参数指定的数组。假如没有设置该参数,全部字符串都会被支解,不斟酌它的长度。

返回值:一个字符串数组,String.split() 实行的操纵与 Array.join() 实行的操纵是相反的

"2:3:4:5".split(":")    //将返回["2", "3", "4", "5"]
"|a|b|c".split("|")    //将返回["", "a", "b", "c"]

假如您愿望把单词支解为字母,或许把字符串支解为字符,可运用下面的代码:

"hello".split("")    //可返回 ["h", "e", "l", "l", "o"]

若只须要返回一部份字符,请运用 howmany 参数:

"hello".split("", 3)    //可返回 ["h", "e", "l"]

12.indexOf()

indexOf() 要领可返回某个指定的字符串值在字符串中初次涌现的位置。
语法:stringObject.indexOf(searchvalue,fromindex)

searchvalue:必需。划定需检索的字符串值。

fromindex:可选的整数参数。划定在字符串中最先检索的位置。它的正当取值是 0 到 stringObject.length – 1。如省略该参数,则将从字符串的首字符最先检索。

indexOf() 要领对大小写敏感!
假如要检索的字符串值没有涌现,则该要领返回 -1。

<script type="text/javascript">
var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))
</script>

输出:0 -1 6

操纵DOM也能够用上:

var elems=node.getElementsByTagName("*");
 for(var i=0;i<elems.length;i++){
      if(elems[i].className.indexOf(classname)!=-1){ 

      }
  }

13.lastIndexOf()

lastIndexOf() 要领可返回一个指定的字符串值末了涌现的位置,在一个字符串中的指定位置从后向前搜刮。
语法:stringObject.lastIndexOf(searchvalue,fromindex)

searchvalue:必需。划定需检索的字符串值。

fromindex:可选的整数参数。划定在字符串中最先检索的位置。它的正当取值是 0 到 stringObject.length – 1。如省略该参数,则将从字符串的末了一个字符处最先检索。

lastIndexOf() 要领对大小写敏感!
假如要检索的字符串值没有涌现,则该要领返回 -1。

var str="Hello world world!"
console.log(str.lastIndexOf("Hello")); //0
console.log(str.lastIndexOf("World")); //-1
console.log(str.lastIndexOf("world")); //12
console.log(str.lastIndexOf("world",9)); //6

14.call()和apply()

语法:obj1.method1.call(obj2,argument1,argument2)

如上,call的作用就是把obj1的要领放到obj2上运用,背面的argument1..这些做为参数传入.
例子:

function add(a,b){
    alert(a+b);
}
function sub(a,b){
    alert(a-b);
}

add.call(sub,3,1); //4

这个例子中的意义就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运转效果为:alert(4);

看一个轻微庞杂一点的例子:

function Class1(){
    this.name = "class1";
    this.showNam = function(){
       alert(this.name);
    }
}

function Class2(){
   this.name = "class2";
}

var c1 = new Class1();
var c2 = new Class2();

c1.showNam.call(c2); //class2

注重,call 的意义是把 c1 的要领放到c2上实行,本来c2是没有showNam() 要领,现在是把c1 的showNam()要领放到 c2 上来实行,所以this.name 应该是 class2,实行的效果就是 :alert(”class2″);

怎样,以为有意义了吧,可以让a对象来实行b对象的要领,这是java程序员所不敢想的。另有更风趣的,可以用 call 来完成继续

function Class1(){
    this.showTxt = function(txt){
       alert(txt);
    }
}
function Class2(){
   Class1.call(this);
}
var c2 = new Class2();
c2.showTxt("cc");

如许 Class2 就继续Class1了,Class1.call(this) 的 意义就是运用 Class1 对象替换this对象,那末 Class2 中不就有Class1 的一切属性和要领了吗,c2 对象就可以直接挪用Class1 的要领以及属性了,实行效果就是:alert(“cc”);

对的,就是如许,这就是 javaScript 如何来模仿面向对象中的继续的,还可以完成多重继续。

function Class10(){
    this.showSub = function(a,b){
       alert(a-b);
    }
}
function Class11(){
    this.showAdd = function(a,b){
        alert(a+b);
    }
}
function Class2(){
   Class10.call(this);
   Class11.call(this);
} 

很简单,运用两个 call 就完成多重继续了
固然,js的继续另有其他要领,比方运用原型链,这个不属于本文的领域,只是在此申明call 的用法
说了call ,固然另有 apply,这两个要领基本上是一个意义
区分在于 call 的第二个参数可所以恣意范例,而apply的第二个参数必需是数组。

参考地点:
http://www.cnblogs.com/swetin…
http://www.108js.com/article/…

15.substring()

substring() 要领用于提取字符串中介于两个指定下标之间的字符。
语法:stringObject.substring(start,stop)

start:必需。一个非负的整数,划定要提取的子串的第一个字符在 stringObject 中的位置。

stop:可选。一个非负的整数,比要提取的子串的末了一个字符在 stringObject 中的位置多 1。假如省略该参数,那末返回的子串会一直到字符串的末端。

返回值:一个新的字符串,该字符串值包含 stringObject 的一个子字符串,其内容是从 start 处到 stop-1 处的一切字符,其长度为 stop 减 start。

1.substring() 要领返回的子串包含 start 处的字符,但不包含 stop 处的字符。
2.假如参数 start 与 stop 相称,那末该要领返回的就是一个空串(即长度为 0 的字符串)。假如 start 比 stop 大,那末该要领在提取子串之前会先交流这两个参数。
3.与 slice() 和 substr() 要领差别的是,substring() 不接收负的参数。

var str="Hello world!"
console.log(str.substring(3)); //lo world!
console.log(str.substring(3,7));//lo w

16.toString()

toString() 要领可把一个逻辑值转换为字符串,并返回效果。

javascript中的toString()要领,主要用于Array、Boolean、Date、Error、Function、Number等对象。

(1)Array.toString():将数组转换成一个字符串,而且返回这个字符串。

形貌:当数组用于字符串环境中时,javascript会挪用这一要领将数组自动转换成一个字符串。toString()在把数组转换成字符串时,起首要将数组的每一个元素都转换成字符串(经由过程挪用这些元素的toString要领)。当每一个元素都被转换成字符串时,它就以列表的情势输出这些字符串,字符串之间用逗号分开。返回值与没有参数的jion()要领返回的字符串雷同。

比方:

var arr = ['php','mysql','apache'];
console.log(arr.join()); //php,mysql,apache
console.log(arr.toString());//php,mysql,apache

(2)Boolean.toString():将布尔值转换为字符串。

形貌:依据原始布尔值或许Boolean对象的值返回字符串“true”或“false”。

比方:

var b = new Boolean();//boolean对象默许值为false
console.log(b.toString()); //false
console.log(("chia" == "chia").toString());//true

(3)Date.toString():将Date对象转换成一个字符串,采纳当地时候。

var today = new Date();
console.log(today);//Tue Mar 28 2017 09:16:27 GMT+0800 (中国范例时候)
console.log(today.toString());//Tue Mar 28 2017 09:16:27 GMT+0800 (中国范例时候)
console.log(today.toLocaleString());//2017/3/28 上午9:16:27

注重:toLocaleString()是返回采纳处所日期运用处所日期花样的范例的字符串。

(4)Error.toString():将Error对象转换成字符串

形貌:完成定义的字符串。ECMAScript范例除了划定该要领的返回值是字符串外,没有再做其他划定。特别是,它不请求返回的字符传包含毛病名和毛病信息。

(5)Function.toString():把函数转换成字符串

形貌:可以以一种与完成相干的要领将函数转换成字符串。在大多数的完成中,比方ie和firefox,它返回Function关键字、参数列表、函数体部份。

function add(a,b){
    var a,b,c;
    c = a + b;
    return c;
}
console.log(add.toString()); 

效果:

function add(a,b){
    var a,b,c;
    c = a + b;
    return c;
}

(6)Number.toString():将数字转换为字符串。用它的参数指定的基数或底数(底数局限为2-36)。假如省略参数,则运用基数10。当参数值为2时,返回二进制数。

var a = 34;
console.log(a.toString());//34
console.log(a.toString(2));//100010
console.log(a.toString(8));//42
console.log(a.toString(16));//22

参考地点:
http://www.cnblogs.com/muguaw…

17.fromCharCode()

fromCharCode() 可接收一个指定的 Unicode 值,然后返回一个字符串。
语法:String.fromCharCode(numX,numX,...,numX)

numX:必需。一个或多个 Unicode 值,即要建立的字符串中的字符的 Unicode 编码。

解释:该要领是 String 的静态要领,字符串中的每一个字符都由零丁的数字 Unicode 编码指定。
它不能作为您已建立的 String 对象的要领来运用。因而它的语法应该是 String.fromCharCode(),而不是 myStringObject.fromCharCode()。

比方,我们将依据 Unicode 来输出 “HELLO” 和 “ABC”:

<script type="text/javascript">
document.write(String.fromCharCode(72,69,76,76,79))
document.write("<br />")
document.write(String.fromCharCode(65,66,67))
</script>

18.substr() 要领

substr() 要领可在字符串中抽取从 start 下标最先的指定数量的字符。
语法:stringObject.substr(start,length)

参数形貌
start必需。要抽取的子串的肇端下标。必需是数值。假如是负数,那末该参数声明从字符串的尾部最先算起的位置。也就是说,-1 指字符串中末了一个字符,-2 指倒数第二个字符,以此类推。
length可选。子串中的字符数。必需是数值。假如省略了该参数,那末返回从 stringObject 的最先位置到末端的字串。

返回值

一个新的字符串,包含从 stringObject 的 start(包含 start 所指的字符) 处最先的 length 个字符。假如没有指定 length,那末返回的字符串包含从 start 到 stringObject 的末端的字符。

提醒和解释

解释:substr() 的参数指定的是子串的最先位置和长度,因而它可以替换 substring() 和 slice() 来运用。

主要事项:ECMAscript 没有对该要领举行范例化,因而阻挡运用它。

主要事项:在 IE 4 中,参数 start 的值无效。在这个 BUG 中,start 划定的是第 0 个字符的位置。在以后的版本中,此 BUG 已被修改。

var str="Hello world!"
document.write(str.substr(3,7))

效果:lo worl
逐渐更新中…

    原文作者:风雨后见彩虹
    原文地址: https://segmentfault.com/a/1190000008632671
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞