首页 > > 网页制作 > css >

字符串、对象、数组操作方法、json方法

2018-06-24 00:59:22来源：未知 阅读 ()

新老客户大回馈,云服务器低至5折

1.字符串操作方法

     
          1.charAt 
             *     作用
             *         通过索引找字符
             *     语法
             *         字符串.charAt(index)
             *     参数
             *         索引值
             *         取值范围：0-(length-1)
             *         如果不写参数，那默认为0
             *         如果index超出了范围后，它会返回一个空
             *     返回值
             *         返回取到的那个字符，类型为字符串
  1. var str='kaivon';
  3. var s1=str.charAt(1);
  4. console.log(s1); //a
  6. var s2=str.charAt();
  7. console.log(s2); //k
  9. var s3=str.charAt(10);
  10. console.log(s3); //空
   
          2.charCodeAt
             *     作用
             *         通过索引找字符，找到后转为Unicode编码
             *     语法
             *         字符串.charCodeAt(index)
             *     参数
             *         索引
             *         取值范围：0-length-1
             *         没有参数，默认为第0个
             *         如果参数超过了范围，那它就返回NaN
             *     返回值
             *         返回字符对应的Unicode编码
  1. var str='kaivon';
  2. var s1=str.charCodeAt(1);
  3. console.log(s1); //97
  5. var s2=str.charCodeAt();
  6. console.log(s2); //107
  8. var s3=str.charCodeAt(10);
  9. console.log(s3); //NaN
          3.indexOf
             *     作用
             *         通过字符找下标（从左往右找这个字符首次出现的位置）
             *     语法
             *         字符串.indexOf(searchValue,fromIndex)
             *     参数
             *         searchValue        要查找的字符
             *         fromIndex        从哪个位置开始查找，这个参数如果没有默认为0
             *     返回值
             *         返回一个数字，这个数字代表字符在整个字符串里的真实下标，如果没找到的话就返回-1
  1. var str='kaivaokn';
  2. var s1=str.indexOf('a');
  3. console.log(s1); //1
  5. var s2=str.indexOf('k',1);
  6. console.log(s2); //6
  8. var s3=str.indexOf('b');
  9. console.log(s3); //-1
      4.lastIndexOf
             *     作用
             *         通过字符找下标（从右往左找字符最后出现的位置）
             *     语法
             *         字符串.lastIndexOf(searchValue,formIndex)
             *     参数
             *         searchValue        要查找的字符串
             *         formIndex        从哪开始查找，如果没有的话，默认从最后一个字符开始
             *     返回值
             *         返回一个数字，如果找到的话就返回这个字符的真实下标，如果没找到返回-1
  1. var str='kaivokn';
  2. var s1=str.lastIndexOf('a');
  3. console.log(s1); //1
  5. var s2=str.lastIndexOf('k',5);
  6. console.log(s2); //5
  8. var s3=str.lastIndexOf('b');
  9. console.log(s3); //-1
  10.  
         5.slice
               *     作用
             *         截取字符串
             *     语法
             *         字符串.slice(beginSlice,endSlice)
             *     参数
             *         beginSlice        开始的位置
             *         endSlice            结束的位置
             * 
             *         如果一个参数都没有的话，直接返回整个字符串
             *         如果只有一个参数，代表开始的位置，那结束的位置默认为最后一位字符
             *         如果有两个参数，第二个参数为结束位置，但是不包含它
             *         参数可以放负数，但是开始位置不能大于结束位置
             *             开始的位置是最后一位，代表-1
             *         
             *     返回值
             *         返回截取到的那个字符串，原字符串没有变化
       区别：
               substring的作用与slice的作用一样，只是参数有区别。
             * 与slice的区别
             *     1、slice起始位置不能大于结束位置，而substring起始位置可以大于结束位置 (会自动调大小)
             *     2、slice可以放负数，而substring是不能放负数的
  
  1. var str='kaiovn';
  2. var s1=str.slice();
  3. console.log(s1); //kaiovn
  5. var s2=str.slice(3);
  6. console.log(s2); //ovn
  8. var s3=str.slice(2,4);
  9. console.log(s3); //io
  11. var s4=str.slice(-3,-2);
  12. console.log(s4); //o
  14. console.log(str); //kaiovn
             6.split
       
             *     作用
             *         用指定的分隔符把字符串分隔成数组
             *     语法
             *         字符串.split(separator,limit)
             *     参数
             *         separator        分隔符
             *         limit            分隔成数组数据的个数
             * 
             *         一个参数都没有以及参数是一个空格字符的话，会把整个字符串作为数组中的一个数据
             *         如果参数为一个空字符，它会把字符串里的每个字符做为数组中的数据
             *         如果参数为两个，分隔后的数组的个数第二个参数的值
             *     返回值
             *         返回一个数组，原字符串没有变化
  1. var str='kaivon';
  2. var s1=str.split();
  3. console.log(s1); //["kaivon"]
  5. var s2=str.split('');
  6. console.log(s2); //["k", "a", "i", "v", "o", "n"]
  8. var s3=str.split(' ');
  9. console.log(s3); //["kaivon"]
  11. var s4=str.split('a');
  12. console.log(s4); //["k", "ivon"]
  14. var s5=str.split('i',1);
  15. console.log(s5); //["ka"]
  17. console.log(str); //kaivon
                7.substr
             *     作用
             *         截取一段指定开始位置与个数的字符串
             *     语法
             *         字符串.substr(start,length)
             *     参数
             *         start        开始的位置
             *         length        截取的个数
             *         
             *         一个参数都没有，它会把整个字符串全部返回
             *         如果有一个参数，那默认会从第一个参数的位置截到最后一位字符
             * 返回值
             *         返回截取到的字符串，原字符串不变
 
  1. var str='kaivon';
  2. var s1=str.substr();
  3. console.log(s1); //kaivon
  5. var s2=str.substr(2);
  6. console.log(s2); //ivon
  8. var s3=str.substr(3,2);
  9. console.log(s3); //vo
  11. console.log(str); //kaivon
            8.toLowerCase
             *     作用
             *         把字符串转成小写
             *     语法
             *         字符串.toLowerCase()
             *     参数
             *         没有参数
             *     返回值
             *         返回字符串转成小写的结果，原来的字符串不有变化
  1. var str='KaiVoN';
  2. var s1=str.toLowerCase();
  3. console.log(s1); //kaivon
  5. console.log(str); //KaiVoN
             9.toUpperCase
             *     作用
             *         把字符串转成大写
             *     语法
             *         字符串.toUpperCase()
             *     参数
             *         没有参数
             *     返回值
             *         返回字符串转成大写的结果，原字符串不变
  1. var str='kaivon';
  2. var s1=str.toUpperCase();
  3. console.log(s1); //KAIVON
  4. console.log(str); //kaivon
            10.trim
             *     作用
             *         去掉字符串的首发空格
             *     语法
             *         字符串.trim()
             *     参数
             *         没有参数
             *     返回值
             *         返回字符串去掉首尾空格的结果，原字符串不变
  1. var str=' kaivon ';
  2. var s1=str.trim();
  3. console.log(s1); //kaivon
  4. console.log(str); // kaivon
 
2.JSON
             *     JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式
             *     一种类似JS中的对象格式的字符串(JSON它是一个字符串，只不过内容长得像对象)
     JSON规则
          
             *         数据放在了一对引号当中(可以是单引号，也可以是双)引号嵌套问题，如果外面单引号里面就用双引号，用{}或者[]括起来
             *         里面的每个数据都以键值对来表示        key:value
             *         key必需放双引号
             *         每个数据之间用逗号隔开
     JSON的用途
                           用于js与后端进行数据交互
  1. var j1="[1,2,3]";
  2. var j2='{"name":"老王","age":30}';
  4. console.log(j1,typeof j1); //[1,2,3] string
  5. console.log(j2,typeof j2); //{"name":"老王","age":30} string
        1.JSON.parse()
                 
                 * JSON.parse(json字符串)
                 *     把一个JSON格式的字符串转成对象，返回转过后的对象
  1. var j1="[1,2,3]";
  2. var j2='{"name":"老王","age":30}';
  5. var obj1=JSON.parse(j1);
  6. console.log(obj1,typeof obj1); //[1, 2, 3] "object"
  8. var obj2=JSON.parse(j2);
  9. console.log(obj2,typeof obj2); //{name: "老王", age: 30} "object"
  11. var j3='{name:"kaivon"}';
  12. var obj3=JSON.parse(j3); //报错 key没有加引号
  14. var j4='['aow','shw','dwn']';
  15. console.log(JOSN.parse(j4)); //报错 因为元素只是单引号，需要改成双引号
          2.JSON.stringify()
 
                  * JSON.stringify(对象)
                  *     把一个对象转换成JSON格式的字符串
                 *     如果对象当中的key没有加引号，也可以转换，转换后的结果会自动给它加上引号
  1. var obj1=[1,2,3];
  2. var obj2={"name":'老王',"age":30};
  3. var obj3={name:'老王',"age":30};
  4. var obj4=['ad','gf','fsd'];
  5. console.log(JSON.stringify(obj4)); // ["ad","gf","fsd"]
  7. var s1=JSON.stringify(obj1);
  8. console.log(s1); //[1,2,3]
  10. var s2=JSON.stringify(obj2);
  11. console.log(s2); //{"name":"老王","age":30}
  13. var s3=JSON.stringify(obj3);
  14. console.log(s3); //{"name":"老王","age":30}
 
3.Math
    
      1.Math.ceil()
             *     作用
             *         把一个数向上取整
             *     语法
             *         Mathi.ceil(数字)
             *     参数
             *         就是一个数字
             *     返回值
             *         返回参数向上取整后的结果
  1. console.log(Math.ceil(0.1)); //1
  2. console.log(Math.ceil(-10.8)); //-10
  3. console.log(Math.ceil(10)); //10
      2.Math.floor()
             *     作用
             *         把一个数向下取整
             *     语法
             *         Mathi.floor(数字)
             *     参数
             *         就是一个数字
             *     返回值
             *         返回参数向下取整后的结果
  1. console.log(Math.floor(0.1)); //0
  2. console.log(Math.floor(-10.8)); //-11
  3. console.log(Math.floor(10)); //10
        3.Math.round()
             *     作用
             *         把一个数字四舍五入
             *     语法
             *         Math.round(数字)
             *     参数
             *         就是一个数字
             *     返回值
             *         返回参数四舍五入后的结果
  1. console.log(Math.round(3.15)); //3
  2. console.log(Math.round(4.5)); //5
  3. console.log(Math.round(-10.87)); //-11
       4.Math.abs()    
        absolute
             *     作用
             *         求一个数字的绝对值
             *     语法
             *         Math.abs(数字)
             *     参数
             *         就是一个数字
             *     返回值
             *         返回参数取绝对值后的结果
  1. console.log(Math.abs(10)); //10
  2. console.log(Math.abs(-11)); //11
  3. console.log(Math.abs(5-7)); ///2
       5.Math.random()
             *     作用
             *         取0-1之间的随机数，包含0但是不包含1
             *     语法
             *         Math.random()
 
                    console.log(Math.random());  //获取到0-1之间的任何数据
     常用的随机取值方法
         
                 x ~ y : Math.round(Math.random()*(y-x) + x)
                0 ~ x : Math.round(Math.random()*x)
                1 ~ x : Math.ceil(Math.random()*x)||1
                0 ~ x-1 : Math.floor(Math.random()*x)
   
  1. //0-10
  2. console.log(Math.round(Math.random()*10));
  3. //5-7
  4. console.log(Math.round(Math.random()*(7-5) + 5));
 
4.array
   1.push
             *     作用
             *         给数组的末尾添加数据
             *     语法
             *         数组.push(element1,element2...)
             *     参数
             *         要添加的数据，一个或者多个数据，可以累加
             *     返回值
             *         返回数组添加后的长度，原数组变化，变成添加后的数组
  
  1. var color=['red','green','blue','pink'];
  3. var len=color.push('white');
  5. console.log(color); //['red','green','blue','pink','white'];
  6. console.log(len); //5
    2.unshift
             *     作用
             *         给数组的前面添加数据
             *     语法
             *         数组.unshift(element1,element2...)
             *     参数
             *         要添加的数据，一个或者多个数据，可以累加
             *     返回值
             *         返回数组添加后的长度，原数组变化，变成添加后的数组
  1. var color=['red','green','blue','pink'];
  3. var len=color.unshift('white');
  5. console.log(color); //['white','red','green','blue','pink']
  6. console.log(len); //5
    3.pop
             *     作用
             *         删除数组最后一位数据
             *     语法
             *         数组.pop()
             *     参数
             *         没有参数
             *     返回值
             *         返回被删除的那个数据，原数组变化，变成删除后的数组
 
  1. var color=['red','green','blue','pink'];
  3. var del=color.pop();
  5. console.log(del); //pink
  6. console.log(color); //["red", "green", "blue"]
    4.shift
             *     作用
             *         删除数组的第一位数据
             *     语法
             *         数组.shift()
             *     参数
             *         没有参数
             *     返回值
             *         返回被删除的那个数据，原数组变化，变成删除后的数组
  1. var color=['red','green','blue','pink'];
  3. var del=color.shift();
  5. console.log(del); //red
  6. console.log(color); //["green", "blue", "pink"]
    5.forEach
             *     作用
             *         遍历数组
             *     语法
             *         数组.forEach(function(currentValue,index,array){
             *             //每次循环完都会执行这里的代码
             *         })
             *     参数
             *         forEach里放的参数是一个函数
             *         函数里的参数
             *             currentValue            当前数组中的某个数据
             *             index                当前数据的索引
             *             array                数组本身
  1. var color=['red','green','blue','pink'];
  3. color.forEach(function(currentValue,index,array){
  4. console.log(currentValue,index,array)
  5. });
    6.sort
             *     作用
             *         对数组进行排序
             *     语法
             *         数组.sort(compareFunction)
             *     参数
             *         用来指定按某种顺序对数组进行排序
             *         如果没有参数的话，会按照每个字符对应的Unicode码值进行排序
             * 
             *         函数里有两个参数
             *             a,b
             *             return a-b            按从小到大的顺序去排
             *             return b-a            按从大到小的顺序去排
             * 
             *     返回值
             *         返回排序后的数组，原数组变了，变成排序后的数组
 
  1. var arr=[4,2,7,8,3,1,10];
  2. arr.sort(function(a,b){
  3. return a-b;
  4. })
  5. console.log(arr); //[1, 2, 3, 4, 7, 8, 10]
  7. var arr1=[4,2,7,8,3,1,10];
  8. arr1.sort(function(a,b){
  9. return b-a;
  10. });
  11. console.log(arr1); //[10, 8, 7, 4, 3, 2, 1]
  14. //随机排序
  15. var arr2=[4,2,7,8,3,1,10];
  16. arr2.sort(function(){
  17. return 0.5-Math.random();
  18. })
  19. console.log(arr2);
  21. //没有参数
  22. var arr3=[4,2,7,8,3,1,10];
  23. arr3.sort();
  24. console.log(arr3); //按照字符对应的unicode编码号
    7.reverse
             *     作用
             *         颠倒数组
             *     语法
             *         数组.reverse()
             *     返回值
             *         返回颠倒后的数组，原数组变化了，变成颠倒后的数组了
 
  1. var color=['red','green','blue','pink'];
  3. var a=color.reverse();
  4. console.log(a); //["pink", "blue", "green", "red"]
  5. console.log(color); //["pink", "blue", "green", "red"]
    8.concat
             *     作用
             *         连接数组，组成一个新数组
             *     语法
             *         数组.concat(varlue1,value2,value3...)
             *     参数
             *         需要与原数组进行合并的数据
             *         参数可以是数组，也可以是非数组
             *     返回值
             *         合并后的新数组，原数组是不变的
  区别
        concat与push一样都是给数组增加数据，  
       concat添加数据 返回值是新数组，并且原数组不变。
      push返回值是新数组的长度，原数组变成新数组
 
  1. var color=['red','green','blue','pink'];
  3. var newColor=color.concat('yellow');
  4. console.log(newColor); //["red", "green", "blue", "pink", "yellow"]
  5. console.log(color); //["red", "green", "blue", "pink"]
  7. var newColor2=color.concat(['yellow','gold']);
  8. console.log(newColor2); //["red", "green", "blue", "pink", "yellow", "gold"]
  10. var newColor3=color.concat(1,2,3);
  11. console.log(newColor3); //["red", "green", "blue", "pink", 1, 2, 3]
    9.join
             *     作用
             *         将数组中的所有元素都连接成一个字符串
             *     语法
             *         数组.join(separator)
             *     参数
             *         separator就是一个连接符，用来把数据连成一个字符串
             *         没参数的话，默认为一个逗号
             *         参数是一个空字符，那么数组中的每个数据将被直接连接
             *     返回值
             *         返回数组转成的字符串，原数组不变
  1. var color=['red','green','blue','pink'];
  3. var newColor=color.join();
  4. console.log(newColor); //red,green,blue,pink
  5. console.log(color); //["red", "green", "blue", "pink"]
  7. var new1=color.join('');
  8. console.log(new1); //redgreenbluepink
  10. var new2=color.join(' ');
  11. console.log(new2); //red green blue pink
  13. var new3=color.join('&');
  14. console.log(new3); //red&green&blue&pink
    10.slice
             *     作用
             *         截取数组
             *     语法
             *         数组.slice(begin,end)
             *     参数
             *         begin        开始的位置
             *         end            结束的位置(不包含最后一位)
             * 
             *         一个参数都没有，直接返回原来的数组
             *         参数只有一个数字，那从数字开始的位置一直到数组的最全截掉
             *     返回值
             *         返回截到的数组，原数组不会变
 
  1. var color=['red','green','blue','pink','yellow'];
  2. var n1=color.slice();
  3. console.log(n1); //["red", "green", "blue", "pink", "yellow"]
  5. var n2=color.slice(2);
  6. console.log(n2); //["blue", "pink", "yellow"]
  8. var n3=color.slice(3,4);
  9. console.log(n3); //["pink"]
  11. console.log(color); //["red", "green", "blue", "pink", "yellow"]
    11.splice
             *     作用
             *         用新元素替换旧元素，以此修改数组的内容（替换数组）
             *     语法
             *         数组.splice(start,deleatCount,item)
             *     参数
             *         start            开始的位置
             *         deleatCount        删除的个数
             *         item                替换的内容
             * 
             *         一个参数都不有的话，那直接返回一个空数组
             *         如果参数为一个数字，代表截取数组，从传的那个数字开始，一直截到最后一位数据
             *         如果参数为两个数字，代表截取数组，从第一个参数开始，截取的个数为第二个参数的值
             *         如果参数为三个，代表替换数组，从第一个参数开始，找到第二个参数值的个数，把找到的内容换成第三个以及第三个以后的参数
             * 返回值
             *         返回删除的数据
             *         原数组变化了，变成删除后剩下的内容
 
  1. var color=['red','green','blue','pink','yellow'];
  3. var c1=color.splice();
  4. console.log(c1); //[]
  5. console.log(color); //["red", "green", "blue", "pink", "yellow"]
  7. var c2=color.splice(3);
  8. console.log(c2); //["pink", "yellow"]
  9. console.log(color); //["red", "green", "blue"]
  11. var color1=['red','green','blue','pink','yellow'];
  12. var c3=color1.splice(1,3);
  13. console.log(c3); //["green", "blue", "pink"]
  14. console.log(color1); //["red", "yellow"]
  17. var color2=['red','green','blue','pink','yellow'];
  18. var c4=color2.splice(1,2,'white','black');
  19. console.log(c4); //["green", "blue"]
  20. console.log(color2); //["red", "white", "black", "pink", "yellow"]
  22. var color3=['red','green','blue','pink','yellow'];
  23. var c5='a,b,c';
  24. var c6=color3.splice(3,2,c5);
  25. console.log(c6); //['pink',yellow]
  26. console.log(color3); //["red", "green", "blue", "a,b,c"]
 
 
 

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有

上一篇：浅谈css中一个元素如何在其父元素居中显示

下一篇：Unicode字符集和编码方式

相关文章

IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设

网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源

网站联盟： 联盟新闻 联盟介绍 联盟点评 网赚技巧

行业资讯： 搜索引擎 网络游戏 电子商务 广告传媒

网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它

服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护

软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷

网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash

程序设计： Java技术 C/C++ VB delphi

网络知识： 网络协议 网络安全 网络管理 组网方案 Cisco技术

操作系统： Win2000 WinXP Win2003 Mac OS Linux FreeBSD

热门词条
最新资讯
热门关注
热门标签