JS进阶day03
目录
前言
JS进阶day03学习开始
一、复习
二、数组
2.1数组API
- API: JS下预定义的函数和方法，可以直接调用
- toString()--将一个数组转为字符串
- join()--将一个数组转为字符串，可以指定元素之间的分隔符
- concat(数组...)--拼接数组
- reverse()--翻转数组元素，返回翻转后的数组，原数组会发生变化
- slice(start, end)--截取数组元素，start开始的下标，end结束的下标，不包含end本身，end为空会截取到最后，下标为负数表示倒数，返回截取的元素，原数组不会发生变化
- splice(start, count, v1,v2,..)--删除数组元素，start开始的下标，count删除的数量，count为空删除到最后，下标为负数表示倒数，v1,v2...表示删除后要补充的元素，返回删除的元素，原数组会发生变化。
- sort()--对数组元素进行排序，默认是按照Unicode编码排列
sort(function(a,b){ return a-b //按照数字从小到大排列 //return b-a //按照数字从大到小排列 }) // 返回的是排序后的数组，原数组会发生变化
- push()--在数组的末尾添加元素，返回的数组长度，原数组会发生变化
- pop()--删除数组末尾的一个元素，返回删除的元素，原数组会发生变化
unshift()--在数组的开头添加元素，返回的数组长度，原数组会发生变化
shift()--删除数组开头的一个元素，返回删除的元素，原数组会发生变化
indexOf()--查找数组中是否含有某个元素，如果存在返回下标，不存在返回-1
其它的API:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>数组API</title> </head> <body> <script> /* // 数组转为字符串 var arr = ['a','b','c'] console.log( arr.toString() ) var num = 2 console.log( num.toString() ) var c = [5,8,6] c.toString() // 如何区分名字相同的方法是否为同一个方法：需要查看调用方法的对象的数据类型是否相同 var arr = ['a','b','c'] // 数组转为字符串，可以指定元素之间的分隔符 console.log( arr.join('') ) var arr1 = ['John','Also','周杰伦'] var arr2 = ['Anna','Lilly','Joan'] var arr3 = ['Hu','Kick','凯立德'] // 拼接多个数组 console.log( arr1.concat(arr2,arr3) ) console.log(arr1) var arr = ['a','b','c','d'] // 翻转数组元素 console.log( arr.reverse() ) // 查看原数组 console.log(arr) var arr = ['John','Also','周杰伦','Anna','Lilly','Joan','Hu','Kick','凯立德'] // 截取数组元素 // console.log( arr.slice(2) ) // console.log( arr.slice(2,5) ) console.log( arr.slice(-4,-2) ) console.log(arr) // 练习：创建数组，包含a~h，每个字母是一个元素，分别截取出bc，f，将截取的两部分拼接成一个新数组。 var arr = ['a','b','c','d','e','f','g','h'] var arr1 = arr.slice(1,3) var arr2 = arr.slice(-3,-2) console.log( arr1.concat(arr2) ) var arr = ['John','Also','周杰伦','Anna','Lilly','Joan','Hu','Kick','凯立德'] // 删除数组元素 // console.log( arr.splice(2) ) // console.log( arr.splice(2,3) ) // console.log( arr.splice(-4,2) ) console.log( arr.splice(-4,0,'李赫','李婷') ) console.log(arr) // 练习：创建数组，包含a~h，每个字母是一个元素，删除de，替换g为m，在下标为1的位置插入z。 var arr = ['a','b','c','d','e','f','g','h'] arr.splice(3,2) arr.splice(-2,1,'m') arr.splice(1,0,'z') console.log(arr) // 数组排序 var arr = [23,9,78,6,45] // 默认按照Unicode编码排列 // arr.sort() arr.sort( function(a,b){ // console.log(a,b) // return a-b //按照数字从小到大排列 return b-a //按照数字从大到小排列 } ) console.log( arr ) var arr = ['John','Also','Dange'] // 在数组的末尾添加元素 // console.log( arr.push('Anan','Jinjin') ) // 删除数组末尾的一个元素 // console.log( arr.pop() ) // 在数组的开头添加元素 // console.log( arr.unshift('Linli','Daily') ) // 删除数组开头的一个元素 console.log( arr.shift() ) console.log(arr) var arr = ['a','b','c','d'] // 检测数组中是否含有某个元素(查找元素) console.log( arr.indexOf('f') ) */ // 练习：创建数组，包含爱国福、和谐福，如果不含有敬业福，则把该福字添加到数组的最后。最后打印数组 var arr = ['爱国福','和谐福'] if( arr.indexOf('敬业福')===-1 ){ arr.push('敬业福') } console.log(arr) </script> </body> </html>
2.2 二维数组
- 数组中的元素还是数组
- [ [ ], [ ], [ ] ]
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>二维数组</title> </head> <body> <script> var arr = ['山东省','江苏省','广东省'] var city = ['济南','青岛','烟台','南京','苏州','无锡','广州','深圳','珠海'] // 二维数组：对一组数据进行分类 var city2 = [ ['济南','青岛','烟台'], ['南京','苏州','无锡'], ['广州','深圳','珠海'] ] console.log(city2[0][0]) </script> </body> </html>
三、字符串对象
- 包装对象：目的是为了让原始类型的值像对象一样，具有属性和方法，JS中提供了三种包装对象，分别是字符串对象、数字对象、布尔对象
- new String()--将一个字符串包装为对象
- String()--将一个值强制转为字符串
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>字符串对象</title> </head> <body> <script> // 字面量 var str1 = '1' // 包装对象 var str2 = new String('1') // console.log(str2, typeof str2) // console.log( str1+2, str2+2 ) // 将一个值转为字符串 var str3 = String(1) // console.log(str3, typeof str3) // arr.toString() //方法必须通过对象来调用 // String() //函数可以独立调用 </body> </html>
3.1转义字符 —— \
- \' --将具有特殊意义的引号转义为普通引号
- \n--将字符n转义为换行符
- \t--将字符t转义为制表符，就是多个连续空格(Tab键)
// 转义字符 // 转为普通引号 console.log('It\'s a dog') // 字符n转移为换行符 console.log('a\nb') // 字符t转义为制表符 console.log('a\tb') console.log('D:\\WEB2208\\JS')
3.2字符串API
- length--获取字符串的长度
- charAt(下标)--获取下标对应的字符，可以使用数组的写法 字符串[下标]
indexOf()--查找字符串某个字符串，返回的是找到的第1个的下标，找不到返回-1
- lastIndexOf()--查找字符串某个字符串，返回的是找到的最后1个的下标，找不到返回-1
- slice(start, end)--截取字符串，start开始下标，end结束下标，不包含end本身，end为空截取到最后，下标为负数表示倒数
所有的字符串API都不会影响原来的字符串，都是会产生一组新的字符串
- toUpperCase()--英文字母转大写
- toLowerCase()--英文字母转小写
- split( )--将字符串转为数组，需要指定分隔符
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>字符串API</title> </head> <body> <script> /* var str='新play' // 查看字符串长度 console.log( str.length ) // 字符串在调用属性或者方法的时候，会自动包装为对象 console.log( new String(str).length ) var str='javascript' // 获取下标对应的字符 console.log( str.charAt(1), str[1] ) // 练习：声明变量保存字符串javascript，遍历字符串，统计出字符a出现的次数 var str = 'javasjcrivpt' // 声明变量，用于计数 for(var i=0,count=0;i<str.length;i++){ // console.log(str[i]) // 如果字符是a，数量加1 if(str[i]==='a'){ count++ } } console.log(count) // 面试题：统计出一个字符串中哪一个字符出现的次数最多，共有几次 // 查找字符串中是否含有某个字符串 var str='javascript' // 找第1个 console.log( str.indexOf('a') ) // 找最后1个 console.log( str.lastIndexOf('a') ) // 截取字符串 var str='javascript' // console.log( str.slice(4) ) // console.log( str.slice(4,7) ) console.log( str.slice(-3,-1) ) // 练习：截取出文件名称的后缀名 var str = 'abc.123.min.jpg' // 查找最后一个.的下标 var n = str.lastIndexOf('.') console.log(n) // 截取后缀名 console.log(str.slice(n+1)) // 练习：截取出一个邮箱的用户名和域名 var str = 'xin123457@qq.com' // 查找@的下标 var n = str.indexOf('@') console.log(n) // 截取 console.log(str.slice(0,n), str.slice(n+1)) // 英文字母转大小写 var str = 'JavaScript' console.log( str.toUpperCase() ) //大写 console.log( str.toLowerCase() ) //小写 console.log(str) var arr = ['a','b','c'] // 数组转为字符串 var str = arr.join('-') //'a-b-c' // 字符串转为数组 console.log(str.split('-')) */ // 练习：将字符串进行翻转 // abcdef -> fedcba var str = 'abcdef' // 把字符串转为数组，每个字母作为一个元素 // 将数组进行翻转 // 将数组转为字符串 console.log( str.split('').reverse().join('') ) </script> </body> </html>
3.3练习
- 练习：将一句英文中每个单词的首字母转为大写，其余字母转为小写
hOw aRE YOU -> How Are You
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>课后练习</title> </head> <body> <script> //练习：将一句英文中每个单词的首字母转为大写，其余字母转为小写 // hOw aRE YOU -> How Are You var str = 'hOw aRE YOU' // 将字符串转为数组，用空格来分隔 var arr = str.split(' ') // 遍历数组，获取每个单词 for(var i=0;i<arr.length;i++){ // console.log(arr[i]) // 截取首个字母，转为大写 var f=arr[i].slice(0,1).toUpperCase() // 截取其余字母，转为小写 var o=arr[i].slice(1).toLowerCase() // console.log(f,o) // 把转换后的拼接成新单词，然后覆盖之前元素中的单词 arr[i]=f+o } // 将数组转为字符串，之间用空格分隔 console.log(arr.join(' ')) </script> </body> </html>
总结
JS进阶03学习结束
87
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
