CHICAGO

# 2020 / 3 / 22

自结题

# 1 / 写一个命令行字符的解析函数

例如： -name lily -age -school "chengdu university" 返回的是 [-name lily,-age 25,-school "chengdu university"]

function getData(str){
    var json = {}
    var gets = str.split("'")[0]
    gets = gets.split(' ')
    for(var i = 0; i < gets.length - 1; i++){
        if(i%2 == 0){
            json[gets[i]] = gets[i + 1]
        }
    }
    json[gets[gets.length - 1]] = str.split("'")[1]
    return json
}
1
2
3
4
5
6
7
8
9
10
11
12

# 2 / 浏览器的缓存和本地存储相关内容有哪些？这些在什么环境下都各自起到什么作用？

html页面，图片等

在联网时已经访问的内容可以直接从缓存中获取，提高访问速度；离线时，可以本地存储做离线访问（google gears）

以后我们每次访问网站时，IE会首先搜索这个目录，如果其中已经有访问过的内容，那IE就不必从网上下载，而直接从缓存中调出来，从而提高了访问网站的速度。

# 3 / 怎么优化网页性能

  • 尽量减少Http请求次数
  • 减少 DNS 查找次数
  • 资源合并与压缩
  • CSS Sprites
  • inline Images
  • 将外部脚本置底
  • 缓存

# 4 / Ajax原理，如何实现刷新数据及优点？

Ajax的工作原理相当于在用户和服务器之间加一个中间层，使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器，像一些数据验证和数据处理等都交给Ajax引擎自己来做，只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求

优点：

  • 减轻服务器负担
  • 无刷新更新页面
  • 更好的用户体验

# 5 / 使用Javascript深度克隆一个对象？

function cloneDeep(obj){
    var buf;
    if(obj instanceof Array){
        buf = []  // 创建一个空的数组
        var i = obj.length
        while(i--){
            buf[i] = cloneDeep(obj[i])
        }
        return buf
    }else if(obj instanceof Object){
        buf = {}
        for(var k in obj){
            buf[k] = cloneDeep(obj[k])
        }
        return buf
    }else{
        return obj
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 6 / 判断字符串是否是这样组成的，第一个必须是字母，后面可以是字母，数字，下划线，总长度为5-20

var reg = /^[a-zA-Z][a-zA-z0-9_]{4,19}$/
reg.test('a1a_a1a_a1a_a1a_')
1
2

# 7 / 判断一个字符串中出现次数最多的字符，统计这个次数

var str = 'abcdefgaddda'

function getMost(str){
    var obj = {}

    for(let i = 0; i < str.length; i++){
        var key = str[i]
        if(!obj[key]){
            obj[key] = 1
        }else{
            obj[key]++
        }
    }

    var max = -1
    var max_key = ''
    for(let key in obj){
        if(max < obj[key]){
            max = obj[key]
            max_key = key
        }
    }
    return '次数最多的字符：' + max_key + '，同' + max + '次'
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

# 8 / IE 与 FF脚本兼容性问题

  • window.event ：表示当前的事件对象，IE有这个对象，FF没有，FF通过给事件处理函数传递事件对象
  • 获取事件源 ：IE用srcElement获取事件源，而FF用target获取事件源
  • 添加，去除事件
    • IE：elementt.attachEvent('on' + type, func) | element.detachEvent('on' + type, func)
    • FF: element.addEventListener(type, func, false) | element.removeEventListener(type, func, false)
  • 获取标签的自定义属性
    • IE：div1.value 或 div1['value']
    • FF：可用div1.getAttribute('value')
  • document.getElementByName() 和 document.all[name]
    • IE：document.getElementByName() 和 document.all[name] 均不能获取 div 元素
    • FF：可以
  • input.type的属性
    • IE：input.type 只读
    • FF：input.type 可读写
  • innerText、textContent、outerHTML
    • IE：支持innerText，outerHTML
    • FF：支持textContent
  • 是否可用id代替HTML元素
    • IE：可以用id来代替HTML元素
    • FF：不可以

# 9 / 编写一个方法，去掉一个数组的重复元素

Array.prototype.unique = function(){
    var result = []
    var o = {}
    var Len = this.length

    for(let i = 0; i < Len; i++){
        var v = this[i]
        if(!o[v]){
            o[v] = 1
            result.push(v)
        }
    }

    return result
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 10 / Javascript中如何检测一个变量是一个String类型？请写出函数实现

String类型有两种生成方式 （1）var str = 'hello world' (2) var str = new String('hello world')

function isString(str){
    return typeof str == 'string' || str.constructor == String
}
1
2
3

← requestAnimationFrame →