By

Contents

先来一个数据结构的：实现微信，附近的人，这个功能，说说你的设计，要怎么去实现？

  • 听到这个整个人都不好了，第一想到的是GPS定位和距离，后面乱扯，说了无向带权图，然后就没有然后了。

关于TCP，如果要发送三个数据包给服务器，服务器会收到多少个包？

  • 我说了一个TCP三次握手，说至少收到5个包。结果他说我只会一点基础，他说其实还有比较复杂的拆分组合问题。

了解原型链吗？假设有函数A，然后让函数B继承函数A，再在B上添加自己特有的功能

  • 这里可以看一下智能社的javascript视频教程：29-JS面向对象高级。也可以参考JS高程第6章组合继承。
  • 属性的继承在定义B函数的时候，在B函数的作用域中，用 A.call ( this, 属性1，属性2，….) 。this是把B的运行环境传到了A中，也就实现了属性的继承。
  • 方法的继承，也就是原型链的应用：遍历A.prototype，逐一赋值给B.prototype。为什么要逐一赋值呢？因为prototype是一个引用，如果直接赋值，结果会导致A和B的prototype指向同一内容。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    function SuperType(name) {
        this.name = name;
        this.colors = ["red", "blue", "green"];
    }
    SuperType.prototype.sayName = function () {
        alert(this.name);
    }
    function SubType (name, age) {
        //继承属性
        SuperType.call(this, name);
        this.age = age;
    }
    //继承方法
    SubType.prototype = new SuperType();
    SubType.prototype.sayAge = function () {
        alert(this.age);
    }
    var instance1 = new SubType("Wing", 29);
    instance1.colors.push("black");
    alert(instance1.colors);
    instance1.sayName();
    instance1.sayAge();
    var instance2 = new SubType("Greg", 27);
    alert(instance2.colors);
    instance2.sayName();
    instance2.sayAge();
    var instance3 = new SuperType("6666");
    alert(instance3.colors);
    instance3.sayName();
    // instance3.sayAge();//会报错！

用过cookie吗？用javascript实现cookie的存取

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function setCookie(name, value, iDay) {
    if(isNaN(iDay)) {
        return ;
    }
    var oDate = new Date();
    oDate.setDate(oDate.getDate() + iDay);
    document.cookie = name + '=' + value + ';expires=' + oDate;
}
function getCookie(name) {
    var arr = document.cookie.split('; ');
    for(var i=0; i<arr.length; i++) {
        var arr2 = arr[i].split('=');
        if(arr2[0] == name) {
            return arr2[1];
        }
    }
    return '';
}
function removeCookie(name) {
    setCookie(name, 1, -1);
}

安全问题有哪些？怎么预防跨域攻击？

  • 首先代码里对用户输入的地方和变量都需要仔细检查长度和对”<”,”>”,”;”,”’”等字符做过滤；其次任何内容写到页面之前都必须加以encode，避免不小心把html tag 弄出来。这一个层面做好，至少可以堵住超过一半的XSS 攻击。
  • 首先，避免直接在cookie 中泄露用户隐私，例如email、密码等等。
  • 其次，通过使cookie 和系统ip 绑定来降低cookie 泄露后的危险。这样攻击者得到的cookie 没有实际价值，不可能拿来重放。
  • 尽量采用POST 而非GET 提交表单。

什么时候用GET，什么时候用POST？

  • GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符
  • POST：一般用于修改服务器上的资源，对所发送的信息没有限制。
  • GET方式需要使用Request.QueryString来取得变量的值，而POST方式通过Request.Form来获取变量的值，也就是说Get是通过地址栏来传值，而Post是通过提交表单来传值。
  • 然而，在以下情况中，请使用 POST 请求
  • 无法使用缓存文件（更新服务器上的文件或数据库）
  • 向服务器发送大量数据（POST 没有数据量限制）
  • 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

了解JS的垃圾回收机制吗？

  • 标记清除（mark and sweep）
    这是JavaScript最常见的垃圾回收方式，当变量进入执行环境的时候，比如函数中声明一个变量，垃圾回收器将其标记为“进入环境”，当变量离开环境的时候（函数执行结束）将其标记为“离开环境”。
    垃圾回收器会在运行的时候给存储在内存中的所有变量加上标记，然后去掉环境中的变量以及被环境中变量所引用的变量（闭包），在这些完成之后仍存在标记的就是要删除的变量了
  • 引用计数(reference counting)
    在低版本IE中经常会出现内存泄露，很多时候就是因为其采用引用计数方式进行垃圾回收。引用计数的策略是跟踪记录每个值被使用的次数，当声明了一个 变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加1，如果该变量的值变成了另外一个，则这个值得引用次数减1，当这个值的引用次数变为0的时 候，说明没有变量在使用，这个值没法被访问了，因此可以将其占用的空间回收，这样垃圾回收器会在运行的时候清理掉引用次数为0的值占用的空间。
    在IE中虽然JavaScript对象通过标记清除的方式进行垃圾回收，但BOM与DOM对象却是通过引用计数回收垃圾的， 也就是说只要涉及BOM及DOM就会出现循环引用问题。

怎么解决循环引用问题？闭包使用会不会导致内在泄漏？

  • 这个….

浏览器的渲染过程？

  1. 浏览器分析链接指向页面的URL
  2. 浏览器向DNS请求解析出IP地址
  3. 得到IP后浏览器与服务器建立TCP链接
  4. 浏览器发出请求
  5. 服务器接到请求后，解析数据，生成html文件内容放入http response中，返回给浏览器。
  6. 浏览器解析http response
  7. 浏览器创建DOM树
  8. 浏览器下载css, 并应用在DOM树中，进行渲染。
  9. 浏览器下载js，并解析执行JS。

JS会不会阻塞页面的渲染？用什么方法可以防止阻塞？这个defer和async在IE和chrome下有什么不同？

  • 会。
  • 延迟加载，可以在script标签上加上defer或者async，也可以放在body内的最下面。
  • defer是从IE4以来就有了的属性，但因为这个功能还未被所有主流浏览器实施，开发人员不应假设脚本实际上都会被延迟执行。defer属性不应在没有src属性的脚本标签上使用。从Gecko 1.9.2开始, 没有src属性的脚本标签的defer属性会被忽略。但是在Gecko 1.9.1中，如果定义了defer属性，即使内嵌的脚本也会被延迟执行。
  • async是HTML5的新属性，该布尔属性指示浏览器是否在允许的情况下异步执行该脚本。该属性对于内联脚本无作用 (即没有src属性的脚本）。IE10才支持了async属性。
    详细点这里
Contents