美文网首页
进阶任务5-字符串与JSON

进阶任务5-字符串与JSON

作者: cheneyzhangch | 来源:发表于2017-06-15 23:14 被阅读0次

    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对值的类型和格式有严格的规定。
    1. 复合类型的值只能是数组或对象,不能是函数、正则表达式对象、日期对象。
    2. 简单类型的值只有四种:字符串、数值(必须以十进制表示)、布尔值和null(不能使用NaN, Infinity, Infinity和undefined)。
    3. 字符串必须使用双引号表示,不能使用单引号。
    4. 对象的键名必须放在双引号里面。
    5. 数组或对象最后一个成员的后面,不能加逗号。
      以下是合格的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)); 
    
    

    相关文章

      网友评论

          本文标题:进阶任务5-字符串与JSON

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