- 关键词：字符串、JSON
1. 使用数组拼接出如下字符串
- 结果：result为下面的字符串
<dl class="product">
<dt>女装</dt>
<dd>短款</dd>
<dd>冬季</dd>
<dd>春装</dd>
</dl>
- 代码执行
var prod = {
name: '女装',
styles: [ '短款', '冬季', '春装' ]
};
function getTplStr(data){
// todo……
var str = '<dl class="product">'
+ ' <dt>' + prod.name + '</dt>'
+ ' <dd>' + prod.styles[0] + '</dd>'
+ ' <dd>' + prod.styles[1] + '</dd>'
+ ' <dd>' + prod.styles[2] + '</dd>'
+ '</dl>';
return str // 返出结果；若无return，result 无法获得 str 的值
};
var result = getTplStr(prod);
console.log(result) // 打印结果
2. 写出两种以上声明多行字符串的方法
- 第一种：转义——行尾添加反斜杠 ‘ \ ’
var longString = "Long \
long \
string";
console.log(longString) // Long long string
- 第二种：拼接——使用连接运算符 ‘ + ’
var longString = 'Long ' // 引号内有空格
+ 'long '
+ 'string';
console.log(longString) // Long long string
- 第三种：函数——将条件注释、toString()组合成函数
var longString = (function () { /*
Long
long
string
*/}).toString().split('\n').slice(1,-1).join('-')
console.log(longString) // Long-long-string
说明
// .toString() 将对象转换成字符串(以字符串形式表示)：此处为函数代码
// .split('\n') 参数作为分隔标识，将字符串切割成数组：此处为5个元素
// .slice(1, -1) 参数作为起始位置，挑选数组元素：此处为中间3个元素
// .join('-') 参数作为连接符，将数组元素拼接成字符串
3. 以下代码输出什么?为什么
- 题目
var str = 'jirengu\nruoyu'
console.log(str.length) //[1]
console.log(str) //[2]
- 结果：
[1] console.log(str.length)
// 结果： 13
[2] console.log(str)
/* 结果：
jirengu
ruoyu
*/
- 原因：
\n 表示一个字符，其功能为 换行，不会被打印出来，可以进行如下测试：
var str1 = '\n'
console.log(str1.length) // 1
var str2 = '\a' // \a 随手写的，不知道它是不是有什么特别的含义
console.log(str2.length) // 1
由此可知：转义字符时，它们是一个整体，代表一个字符，例如 \q \w \e...
我理解的转义：卸载字符原有的特殊含义，使字符具备的功能不起作用
4. 编写函数，其功能为：判断一个字符串是否为回文字符串
- 例如：
abcdcba是回文字符串，abcdcbb不是 - 思路：
首先，将字符串切割成数组——使用 .split('') 方法
其次，使用逆序重新排列数组元素——使用数组方法 .reverse()
第三，将数组重新拼接成字符串——使用数组方法 .join('-')
最后，根据布尔值判断两个字符串是否相等
// .reverse() 作用：使用逆序重新排列原数组元素，直接修改原数组
// .join('-') 作用：参数作为连接符，将数组元素拼接成字符串
- 代码如下
var str1 = "abcdcba"
var str2 = "abcdcbb"
function isReverse(str){
return str === str.split('').reverse().join('')
}
console.log( isReverse(str1) ) // true
console.log( isReverse(str2) ) // false
5. 编写函数，其功能为：统计字符串中出现频率最高的字符（若有多个则都需要展示出来）
- 思路：直接遍历字符串并统计，省掉转化步骤
// 1. 声明空对象，用于存储统计结果
// 2. for循环直接遍历字符串 —— 采用类数组下标的方式
// 3. 如果空对象中存在字符则频率+1；否则赋值为1
// 4. 可直接遍历字符串，不必将字符串转换成数组再去遍历
// 如果转换成数组再去遍历，相当于增加了代码量，绕了远路
// 5. 遍历数组，分别筛选最大值和最大值变量
- 代码如下（直接遍历字符串）
var str = "hello o world"
// 一、遍历字符串、统计字符个数
var arr = {}
for(var i = 0; i < str.length; i++){
if(arr[str[i]]){
arr[str[i]] = arr[str[i]] + 1
}else {
arr[str[i]] = 1
}
}
console.log(arr);
// 二、筛选字符：个数最多
var maxValue = {} // 最大值的变量
var maxCount = 0 // 最大值
var result = []
for(var key in arr){ // 遍历arr数组：筛选 最大值
if(arr[key] > maxCount){
// maxValue = key // 【只能保存一个最大值变量】
maxCount = arr[key]
}
}
for(var key in arr){ // 遍历arr数组：筛选 最大值的变量
if(arr[key] === maxCount){
result.push(key)
}
}
// console.log(maxValue, ':', maxCount) // 【只能打印一个最大值变量】
for(var n = 0; n < result.length; n++){ // 遍历result数组：打印所有结果
console.log(result[n] + ':' + maxCount)
}
6. 编写camelize函数，功能为：转化字符串的形式
- 把
my-short-string形式的字符串转化成myShortString形式的字符串，如下
camelize("background-color") == 'backgroundColor'
camelize("list-style-image") == 'listStyleImage'
- 代码执行
var str = "hello-world"
function camelize(str){
var arr = str.split('-')
var result = arr[0]
for(var i = 1; i < arr.length; i++){
// 请遍历 arr ，而不是 str，若遍历 str，导致以下语句不可使用，报错
var temp = arr[i][0].toUpperCase() + arr[i].substring(1, arr[i].length)
result += temp
}
return result
}
console.log(camelize(str)) // helloWorld
console.log(camelize("background-color")) // backgroundColor
console.log(camelize("list-style-image")) // listStyleImage
