美文网首页
Javascript 使用 "大杂烩"

Javascript 使用 "大杂烩"

作者: 编程鸭 | 来源:发表于2019-05-13 16:31 被阅读0次

      这是我早期在网上看的javascript学习方法,觉得很不错,就保存到word了,这几天学习Js,再看了一遍,对初学或者已经会Js的程序员来说,还是可以学习的。还有大家如果有更好的Js学习方法,可以提供下噢。谢谢!

    如果你对编程感兴趣或者想往编程方向发展,可以关注微信公众号【筑梦编程】,大家一起交流讨论!小编也会每天定时更新既有趣又有用的编程知识!

    1.Javascript 数组API

    1.//定义数组  

    2.varpageIds =newArray();

    3.pageIds.push('A');

    5.数组长度

    6.pageIds.length;

    8.//shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined   

    9.vara = [1,2,3,4,5];

    10.varb = a.shift();//a:[2,3,4,5]   b:1   

    12.//unshift:将参数添加到原数组开头,并返回数组的长度   

    13.vara = [1,2,3,4,5];

    14.varb = a.unshift(-2,-1);//a:[-2,-1,1,2,3,4,5]   b:7   

    15.//注:在IE6.0下测试返回值总为undefined,FF2.0下测试返回值为7,所以这个方法的返回值不可靠,需要用返回值时可用splice代替本方法来使用。

    17.//pop:删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined   

    18.vara = [1,2,3,4,5];

    19.varb = a.pop();//a:[1,2,3,4]   b:5   

    21.//push:将参数添加到原数组末尾,并返回数组的长度   

    22.vara = [1,2,3,4,5];

    23.varb = a.push(6,7);//a:[1,2,3,4,5,6,7]   b:7   

    25.//concat:返回一个新数组,是将参数添加到原数组中构成的   

    26.vara = [1,2,3,4,5];

    27.varb = a.concat(6,7);//a:[1,2,3,4,5]   b:[1,2,3,4,5,6,7]   

    29.//splice(start,deleteCount,val1,val2,):从start位置开始删除deleteCount项,并从该位置起插入val1,val2,   

    30.vara = [1,2,3,4,5];

    31.varb = a.splice(2,2,7,8,9);//a:[1,2,7,8,9,5]   b:[3,4]   

    32.varb = a.splice(0,1);//同shift   

    33.a.splice(0,0,-2,-1);varb = a.length;//同unshift   

    34.varb = a.splice(a.length-1,1);//同pop   

    35.a.splice(a.length,0,6,7);varb = a.length;//同push   

    37.//reverse:将数组反序   

    38.vara = [1,2,3,4,5];

    39.varb = a.reverse();//a:[5,4,3,2,1]   b:[5,4,3,2,1]   

    41.//sort(orderfunction):按指定的参数对数组进行排序   

    42.vara = [1,2,3,4,5];

    43.varb = a.sort();//a:[1,2,3,4,5]   b:[1,2,3,4,5]   

    45.//slice(start,end):返回从原数组中指定开始下标到结束下标之间的项组成的新数组   

    46.vara = [1,2,3,4,5];

    47.varb = a.slice(2,5);//a:[1,2,3,4,5]   b:[3,4,5]   

    49.//join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符   

    50.vara = [1,2,3,4,5];

    51.varb = a.join("|");//a:[1,2,3,4,5]   b:"1|2|3|4|5"   

    2.Dom最常用的API

    1.document方法:

    2.getElementById(id)Node返回指定结点的引用

    3.getElementsByTagName(name)NodeList返回文档中所有匹配的元素的集合

    4.createElement(name)NodeNode

    5.createTextNode(text)Node创建一个纯文本结点

    6.ownerDocumentDocument指向这个节点所属的文档

    7.documentElementNode返回html节点

    8.document.bodyNode返回body节点

    10.element方法:

    11.getAttribute(attributeName)String返回指定属性的值

    12.setAttribute(attributeName,value)String给属性赋值

    13.removeAttribute(attributeName)String移除指定属性和它的值

    14.getElementsByTagName(name)NodeList返回结点内所有匹配的元素的集合

    16.node方法:

    17.appendChild(child)Node给指定结点添加一个新的子结点

    18.removeChild(child)Node移除指定结点的子结点

    19.replaceChild(newChild,oldChild)Node替换指定结点的子结点

    20.insertBefore(newChild,refChild)Node在同一层级的结点前面插入新结点

    21.hasChildNodes()Boolean如果结点有子结点则返回true

    23.node属性:

    24.nodeNameString以字符串的格式存放结点的名称

    25.nodeTypeString以整型数据格式存放结点的类型

    26.nodeValueString以可用的格式存放结点的值

    27.parentNodeNode指向结点的父结点的引用

    28.childNodesNodeList指向子结点的引用的集合

    29.firstChildNode指向子结点结合中的第一个子结点的引用

    30.lastChildNode指向子结点结合中的最后一个子结点的引用

    31.previousSiblingNode指向前一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null

    32.nextSiblingNode指向后一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null

    3.常用的数字函数

    1.·数字型(Number)

    2.1.声明

    3.vari =1;

    4.vari =newNumber(1);

    6.2.字符串与数字间的转换

    7.vari =1;

    8.varstr = i.toString();//结果: "1"   

    9.varstr =newString(i);//结果: "1"   

    10.i =parseInt(str);//结果: 1   

    11.i =parseFloat(str);//结果: 1   

    13.//注意: parseInt,parseFloat会把一个类似于"32G"的字符串,强制转换成32  

    15.3.判断是否为有效的数字

    16.vari =123;varstr ="string";

    17.if(typeofi =="number"){ }//true   

    19.//某些方法(如:parseInt,parseFloat)会返回一个特殊的值NaN(Not a Number)   

    20.//请注意第2点中的[注意],此方法不完全适合判断一个字符串是否是数字型!!   

    21.i =parseInt(str);

    22.if(isNaN(i) ){ }

    24.4.数字型比较

    25.//此知识与[字符串比较]相同   

    27.5.小数转整数

    28.varf =1.5;

    29.vari =Math.round(f);//结果:2 (四舍五入)   

    30.vari =Math.ceil(f);//结果:2 (返回大于f的最小整数)   

    31.vari =Math.floor(f);//结果:1 (返回小于f的最大整数)   

    33.6.格式化显示数字

    34.vari =3.14159;

    36.//格式化为两位小数的浮点数   

    37.varstr = i.toFixed(2);//结果: "3.14"   

    39.//格式化为五位数字的浮点数(从左到右五位数字,不够补零)   

    40.varstr = i.toPrecision(5);//结果: "3.1416"   

    42.7.X进制数字的转换

    43.//不是很懂 -.-   

    44.vari =parseInt("0x1f",16);

    45.vari =parseInt(i,10);

    46.vari =parseInt("11010011",2);

    47.

    48.8.随机数

    49.//返回0-1之间的任意小数   

    50.varrnd =Math.random();

    51.//返回0-n之间的任意整数(不包括n)      

    52.varrnd =Math.floor(Math.random() * n)

    4.网上收藏的javascript堆栈

    1.function stack(){

    2.if(this.top==undefined){

    3.//初始化堆栈的顶部指针和数据存放域  

    4.this.top=0;

    5.this.unit=new Array();

    6.}

    7.this.push=function(pushvalue){

    8.//定义压入堆栈的方法              

    9.this.unit[this.top]=pushvalue;

    10.this.top+=1;

    11.}

    12.this.readAllElements=function(){

    13.//定义读取所有数据的方法  

    14.if(this.top==0){

    15.alert("当前栈空,无法读取数据");

    16.return("");

    17.}

    18.varcount=0;

    19.varoutStr="";

    20.

    21.for(count=0;count

    22.outStr+=this.unit[count]+",";

    23.}

    24.return(outStr);

    25.}

    26.this.pop=function(){

    27.//定义弹出堆栈的方法  

    28.if(this.top==0){

    29.alert("当前栈空,无法弹出数据");

    30.return("");

    31.}

    32.varpopTo=this.unit[this.top-1];

    33.this.top--;

    34.return(popTo);

    35./* 从堆栈弹出数据,顶部指针减一,不过这里没有做到资源的释放,也

    36.            就是说数据仍然存在于this.unit的数组中,只不过无法访问罢了。目前

    37.            我也没想到好的办法解决。*/

    38.}

    39.}

    5.最常用的javascript日期函数

    1.function stack(){

    2.if(this.top==undefined){

    3.//初始化堆栈的顶部指针和数据存放域  

    4.this.top=0;

    5.this.unit=new Array();

    6.}

    7.this.push=function(pushvalue){

    8.//定义压入堆栈的方法              

    9.this.unit[this.top]=pushvalue;

    10.this.top+=1;

    11.}

    12.this.readAllElements=function(){

    13.//定义读取所有数据的方法  

    14.if(this.top==0){

    15.alert("当前栈空,无法读取数据");

    16.return("");

    17.}

    18.varcount=0;

    19.varoutStr="";

    20.

    21.for(count=0;count

    22.outStr+=this.unit[count]+",";

    23.}

    24.return(outStr);

    25.}

    26.this.pop=function(){

    27.//定义弹出堆栈的方法  

    28.if(this.top==0){

    29.alert("当前栈空,无法弹出数据");

    30.return("");

    31.}

    32.varpopTo=this.unit[this.top-1];

    33.this.top--;

    34.return(popTo);

    35./* 从堆栈弹出数据,顶部指针减一,不过这里没有做到资源的释放,也

    36.            就是说数据仍然存在于this.unit的数组中,只不过无法访问罢了。目前

    37.            我也没想到好的办法解决。*/

    38.}

    39.}

    6.最常用字符窜函数API

    1.·字符串(String)

    2.1.声明

    3.varmyString =newString("Every good boy does fine.");

    4.varmyString ="Every good boy does fine.";

    5.

    6.2.字符串连接

    7.varmyString ="Every "+"good boy "+"does fine.";

    8.varmyString ="Every ";  myString +="good boy does fine.";

    9.

    10.3.截取字符串

    11.//截取第 6 位开始的字符   

    12.varmyString ="Every good boy does fine.";

    13.varsection = myString.substring(6);//结果: "good boy does fine."   

    14.

    15.//截取第 0 位开始至第 10 位为止的字符   

    16.varmyString ="Every good boy does fine.";

    17.varsection = myString.substring(0,10);//结果: "Every good"   

    18.

    19.//截取从第 11 位到倒数第 6 位为止的字符   

    20.varmyString ="Every good boy does fine.";

    21.varsection = myString.slice(11,-6);//结果: "boy does"   

    22.

    23.//从第 6 位开始截取长度为 4 的字符   

    24.varmyString ="Every good boy does fine.";

    25.varsection = myString.substr(6,4);//结果: "good"   

    26.

    27.4.转换大小写

    28.varmyString ="Hello";

    29.varlcString = myString.toLowerCase();//结果: "hello"   

    30.varucString = myString.toUpperCase();//结果: "HELLO"   

    31.

    32.5.字符串比较

    33.varaString ="Hello!";

    34.varbString =newString("Hello!");

    35.if( aString =="Hello!"){ }//结果: true   

    36.if( aString == bString ){ }//结果: true   

    37.if( aString === bString ){ }//结果: false (两个对象不同,尽管它们的值相同)   

    38.

    39.6.检索字符串

    40.varmyString ="hello everybody.";

    41.// 如果检索不到会返回-1,检索到的话返回在该串中的起始位置   

    42.if( myString.indexOf("every") >-1){ }//结果: true   

    43.

    44.7.查找替换字符串

    45.varmyString ="I is your father.";

    46.varresult = myString.replace("is","am");//结果: "I am your father."   

    47.

    48.8.特殊字符:

    49.\b : 后退符         \t : 水平制表符

    50.\n : 换行符         \v : 垂直制表符

    51.\f : 分页符         \r : 回车符

    52.\" : 双引号         \' : 单引号

    53.    \\ : 反斜杆

    54.

    55.  9.将字符转换成Unicode编码

    56.    var myString = "

    hello";

    57.    var code = myString.charCodeAt(3);  //返回"

    l"的Unicode编码(整型)

    58.    var char = String.fromCharCode(66); //返回Unicode为66的字符

    59.

    60.  10.将字符串转换成URL编码

    61.    var myString = "

    hello all";

    62.    var code = encodeURI(myString);     //结果: "

    hello%20all"

    63.    var str = decodeURI(code);          //结果: "

    hello all"

    64.    //相应的还有:  encodeURIComponent()  decodeURIComponent()

        Js内容来源于网络,本着大家一起学习的思想,所以分享一下。大家也可以分享下学习Js的方法论噢。一直在学习!  

    相关文章

      网友评论

          本文标题:Javascript 使用 "大杂烩"

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