进阶任务5-字符串与JSON
2017-06-15 本文已影响0人
cheneyzhangch
1、使用数组拼接出如下字符串：
var prod = {
name: '女装',
styles: ['短款', '冬季', '春装']
};
function getTpl(data){
//todo...
};
var result = getTplStr(prod); //result为下面的字符串
<dl class="product">
<dt>女装</dt>
<dd>短款</dd>
<dd>冬季</dd>
<dd>春装</dd>
</dl>
<script>
var prod = {
name: '女装',
season: '冬季',
styles: ['短款', '冬季', '春装']
};
function getTpl(data) {
var str = '<dl class="product">';
for (var key in data) {
if(typeof data[key] === 'number'
|| typeof data[key] === 'string'
|| typeof data[key] === 'boolean'
|| data[key] === undefined
|| data[key] === null) {
str += ('<dt>' + data[key] + '</dt>')
} else {
for (var i = 0; i < data[key].length; i++) {
str += ('<dd>' + data[key][i] + '</dd>')
}
}
}
str += '</dl>';
return str;
}
var result = getTpl(prod)
console.log(result);
</script>
2、写出两种以上声明多行字符串的方法
例如：
var str = 'abcdeabcdeabcdeancdeabcdeabcdeabcdeancdeabcdeabcdeabcdeancdeabcdeabcdeabcdeancde'
这段字符串很长，如何多行优雅的显示
<script>
var str = 'abcdeabcdeabcdeancde\
abcdeabcdeabcdeancde\
abcdeabcdeabcdeancde\
abcdeabcdeabcdeancd '
var str2 = 'abcdeabcdeabcdeancde'
+ 'abcdeabcdeabcdeancde'
+ 'abcdeabcdeabcdeancde'
+ 'abcdeabcdeabcdeancde';
console.log(str, str2)
</script>
3、补全如下代码,让输出结果为字符串: hello\ \饥人谷
var str = //补全代码
console.log(str)
var str3 = 'hello\\' + '\\饥人谷'//补全代码
var str4 = 'hello\\\\饥人谷'//补全代码
console.log(str3)
console.log(str4)
4、以下代码输出什么?为什么
var str = 'jirengu\nruoyu' // '\n'为转义符'换行'，占一个字符长度
console.log(str.length) // 13
5、写一个函数，判断一个字符串是回文字符串，如 abcdcba是回文字符串, abcdcbb不是
<script>
var str1 = 'abcdcba'
function detecBackWriting(str) {
var newstr = str.split('').reverse().join('');
return newstr
}
var str2 = detecBackWriting(str1)
if (str2 == str1) {
console.log('字符串为回文')
}
</script>
6、写一个函数，统计字符串里出现出现频率最多的字符
<script>
// 写一个函数，得到一个字符串里出现频率最高的一个字符
var str = 'hello world, jirengu haha hoho hoho lol'
var dict = {}
for (var i = 0; i < str.length; i++) {
if (dict[str[i]]) {
++dict[str[i]]
} else {
dict[str[i]] = 1
}
}
console.log(dict)
var count = 0
var maxValue
for (key in dict) {
if (dict[key] > count) {
maxValue = key
count = dict[key]
}
}
console.log(maxValue, count)
</script>
7、写一个camelize函数，把my-short-string形式的字符串转化成myShortString形式的字符串，如
camelize("background-color") == 'backgroundColor'
camelize("list-style-image") == 'listStyleImage'
<script>
var str1 = 'background-color'
var str2 = 'list-style-image'
function fn(str) {
var arry = str.split('-');
for (var i = 1; i < arry.length; i++) {
arry[i] = arry[i][0].toUpperCase() + arry[i].substr(1);
}
str = arry.join('');
return str;
}
console.log(fn(str1))
console.log(fn(str2))
</script>
8、写一个 ucFirst函数，返回第一个字母为大写的字符 （***）
ucFirst("hunger") == "Hunger"
<script>
var str1 = 'hunger'
function ucFirst(str) {
var arry = str[0].toUpperCase() + str.substr(1);
return arry
}
console.log(ucFirst(str1))
</script>
9、写一个函数truncate(str, maxlength), 如果str的长度大于maxlength，会把str截断到maxlength长，并加上...，如
<script>
// 写一个函数truncate(str, maxlength), 如果str的长度大于maxlength，会把str截断到maxlength长，并加上...，如
// truncate("hello, this is hunger valley,", 10) == "hello, thi...";
// truncate("hello world", 20) == "hello world"
function truncat(str1, str2) {
var newstr
if (str1.length > str2) {
newstr = str1.substr(0, str2) + '...'
} else {
newstr = str1
}
return newstr
}
console.log(truncat("hello, this is hunger valley,", 10))
console.log(truncat("hello world", 20))
</script>
10、什么是 JSON格式数据？JSON格式数据如何表示对象？window.JSON 是什么？
- 什么是 JSON格式数据
JSON格式数据即JavaScript Object Notation数据，是一种用于数据交换的文本格式；
简单说，每个JSON对象，就是一个值。要么是简单类型的值，要么是复合类型的值，但是只能是一个值，不能是两个或更多的值。这就是说，每个JSON文档只能包含一个值。 - JSON格式数据如何表示对象？
JSON对值的类型和格式有严格的规定。
- 复合类型的值只能是数组或对象，不能是函数、正则表达式对象、日期对象。
- 简单类型的值只有四种：字符串、数值（必须以十进制表示）、布尔值和null（不能使用NaN, Infinity, Infinity和undefined）。
- 字符串必须使用双引号表示，不能使用单引号。
- 对象的键名必须放在双引号里面。
- 数组或对象最后一个成员的后面，不能加逗号。
以下是合格的JSON值：
["one", "two", "three"]
{ "one": 1, "two": 2, "three": 3 }
{"names": ["张三", "李四"] }
[ { "name": "张三"}, {"name": "李四"} ]
以下是不合格的JSON值:
{ name: "张三", 'age': 32 } // 属性名必须使用双引号
[32, 64, 128, 0xFFF] // 不能使用十六进制值
{ "name": "张三", "age": undefined } // 不能使用undefined
{ "name": "张三",
"birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'),
"getName": function() {
return this.name;
}
} // 不能使用函数和日期对象
需要注意的是，空数组和空对象都是合格的JSON值，null本身也是一个合格的JSON值。
- window.JSON 是什么？
window.JSON是指通过将如下代码放在script的开始位置，达到在低版本不兼容JSON的浏览器中使用JSON对象的作用
if (!window.JSON) {
window.JSON = {
parse: function(sJSON) { return eval('(' + sJSON + ')'); },
stringify: (function () {
var toString = Object.prototype.toString;
var isArray = Array.isArray || function (a) { return toString.call(a) === '[object Array]'; };
var escMap = {'"': '\\"', '\\': '\\\\', '\b': '\\b', '\f': '\\f', '\n': '\\n', '\r': '\\r', '\t': '\\t'};
var escFunc = function (m) { return escMap[m] || '\\u' + (m.charCodeAt(0) + 0x10000).toString(16).substr(1); };
var escRE = /[\\"\u0000-\u001F\u2028\u2029]/g;
return function stringify(value) {
if (value == null) {
return 'null';
} else if (typeof value === 'number') {
return isFinite(value) ? value.toString() : 'null';
} else if (typeof value === 'boolean') {
return value.toString();
} else if (typeof value === 'object') {
if (typeof value.toJSON === 'function') {
return stringify(value.toJSON());
} else if (isArray(value)) {
var res = '[';
for (var i = 0; i < value.length; i++)
res += (i ? ', ' : '') + stringify(value[i]);
return res + ']';
} else if (toString.call(value) === '[object Object]') {
var tmp = [];
for (var k in value) {
if (value.hasOwnProperty(k))
tmp.push(stringify(k) + ': ' + stringify(value[k]));
}
return '{' + tmp.join(', ') + '}';
}
}
return '"' + value.toString().replace(escRE, escFunc) + '"';
};
})()
};
}
11、如何把JSON 格式的字符串转换为 JS 对象？如何把 JS对象转换为 JSON 格式的字符串?
parse：把字符串转化为JSON对象
stringify：把JSON对象转化为字符串
var json = {
"name": "Byron",
"age": 24
};
var json_str = JSON.stringify(json);
console.log(json_str);
console.log(JSON.parse(json_str));
