zoukankan      html  css  js  c++  java
  • 2015阿里校园招聘前端在线测验题目

    1、JavaScript有哪些方式能解决跨主域问题?
    a. document.domain+iframe的设置
    b. 动态创建script
    c. 利用iframe和location.hash
    d. window.name实现的跨域数据传输
    e. 使用HTML5 postMessage
    f. 利用flash
    JavaScript跨域:处于安全方面的考虑,不允许跨域调用其它页面的对象。简单来说,由于JavaScript同源策略的限制,a.com域名下的js无法操作b.com或c.a.com域名下的对象 。

    详见:http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html
     

    2、以下关于Nodejs的说法, 正确的是(ACD)
    A: Nodejs是一个Javascript运行环境, 基于chrome V8引擎进行代码解析
    B: Nodejs自身不是单线程的, 但我们的js代码是在单线程的环境中执行
    C: 可以使用uncaughtException或者Domain捕获异常, 其中uncaughtException可以保持上下文
    D: Nodejs高并发特性使其适合I/O密集型的应用
    3、关于HTTP返回码的说法,下面哪些是错误的?(AB)
    A: 302代表服务器端网页未修改过,客户端可从浏览器缓存中获取内容
    B: 404代表资源虽然存在,但运行出错
    C: 503为服务器负载过高不能响应请求
    D: 传送数据过大可能导致413(请求实体过大)的错误
    4.1 说说nodejs的异步I/O是什么。
    4.2 面对复杂的业务需求,多次回调的node代码场景,你有什么看法?如何让代码更好阅读和维护。

    5、你使用NodeJS编写了一个博客程序并把它部署到了一台linux服务器上,如何确保服务安全稳定地可持续运行呢?(必要部分可以附上代码、命令等) 

    6、淘宝首页需要实现这样一个功能,对于页面上非taobao.com域名下的链接,在用户点击时,需要在链接处弹出提示框,提示用户此链接非淘宝域名下的链接,并给与用户选择是否继续访问。如果用户确认继续访问,则在新窗口打开链接。请写出对应的代码。 

    <!DOCTYPE html>
    <html>

    <head>
        <meta charset="utf-8"></meta>
        <title></title>
    </head>

    <body>
        <href="http://www.taobao.com">taobao.com</a>
        <href="http://m.taobao.com">taobao.com</a>
        <href="http://www.baidu.com">baidu.com</a>
        <script type="text/javascript" src="link.js"></script>
    </body>

    </html>
    View HTML Code
    //Method 1 对事件进行处理。这样做的好处是避免了对每一个a标签进行逐个绑定,节省了时间开销,另外代码更简洁。
    (function() {
        var b = document.body;
        var reg = /^(https?://)?([da-z.-]+).taobao.com([/w .-]*)*/?$/;

        function doClick(event) {
            if (event.target.tagName == 'A') {
                event.preventDefault();
                var href = event.target.href;
                if (reg.exec(href)) {
                    location.href = href;
                } else {
                    if (window.confirm("非本地站点,是否继续?")) {
                        location.href = href;
                    }
                }
            }
        }
        b.onclick = doClick;
    })();

    //Method 2
    (function() {
        var hrefs = document.getElementsByTagName('a');
        for(var i=0; i <hrefs.length; i++) {
            var href = hrefs[i].getAttribute("href");
            hrefs[i].onclick = function(href) {
                return function() {
                    var reg = /^(https?://)?([da-z.-]+).taobao.com([/w .-]*)*/?$/;
                    if(reg.exec(href)) {
                        return true;
                    } else {
                        return window.confirm("非本地站点,是否继续?");
                    }
                };
            }(href);
        }
    })();
    View JavaScript Code
     

    7、编写一个JavaScript函数,输入指定类型的选择器(仅需支持id,class,tagName三种简单CSS选择器,无需兼容组合选择器)可以返回匹配的DOM节点,需考虑浏览器兼容性和性能。

    /**
    * @param selector {String} 传入的CSS选择器。
    * @return {Array}
    */
    var query = function(selector){
    //返回查找到的节点数组
    return [];
    }
    <!DOCTYPE html>
    <html>

    <head>
        <title></title>
    </head>

    <body>
        <div class="test" name="a"></div>
        <div class="test" name="b"></div>
        <div class="test" name="c"></div>
        <div class="test" name="d"></div>
        <div class="test" name="e"></div>

       <script type="text/javascript">
            var query = function(selector) {
                var reg_id = /^#[w]+/;
                var reg_class = /^.[w]+/;

                var elems;
                if (document.querySelectorAll) {
                    return document.querySelectorAll(selector);
                }

                if (reg_id.test(selector)) {
                    elems = document.getElementById(selector.slice(1));
                } else if (reg_class.test(selector)) {
                    elems = getElementsByClassName(selector.slice(1));
                } else {
                    elems = document.getElementsByTagName(selector);
                }

                return elems;
            };

            function getElementsByClassName(className) {
                var arr = document.getElementsByTagName("*"),
                    result;
                for (var i = 0, len = arr.length; i < len; i++) {
                    if (arr[i].className.indexOf(className) != -1) {
                        result.push(arr[i]);
                    }
                }
                return result;
            }

            console.log(query(".test"));
    </script>

    </body>

    </html>
    View Code
    var query = function(selector) {
            var rId = /^#/;
            var rCls = /^./;
            //标准浏览器
            if (window.addEventListener) {
                return document.querySelectorAll(selector);
            }
            //IE
            if (rId.test(selector)) {
                return document.getElementById(selector.slice(1));
            }
            if (rCls.test(selector)) {
                return getElementsByClass(selector.slice(1));
            }
            return document.getELementsByTagName(selector);


        };

        var getElementsByClass = function(searchClass, node, tag) {
            var classElements = new Array();
            if (node == null)
                node = document;
            if (tag == null)
                tag = '*';
            var els = node.getElementsByTagName(tag);
            var elsLen = els.length;
            var pattern = new RegExp("(^|\s)" + searchClass + "(\s|$)");
            for (i = 0, j = 0; i < elsLen; i++) {
                if (pattern.test(els[i].className)) {
                    console.log(true);classElements[j] = els[i];
                    j++;
                }
            }
            return classElements;
        }; 
    View Code

    8、一个页面上有大量的图片,加载很慢,你有哪些方法优化这些图片的加载,给用户更好的体验。 

    a. CSS Sprites:将一个网页中涉及的零星图片,整合到一张大图中,然后利用CSS技术展现出来。这样一来,减少了整个页面图片的大小,并且能减少网页http请求次数,从而大大地提高网页的性能。

    b. 压缩图片

    c. 功能图片优先加载

    d. 图片格式优化(JPEG,GIF,和PNG):对于产品图片质量要求极高,使用JPEG格式,用GIF做动画或是装饰性小图,PNG同时也擅长处理简单地装饰图而只需很小的体积

    9、使用 JavaScript 的 Promise 模式实现延迟3秒输出 

    // 先封装一个返回promise的函数
    var Promise = function () {
       
    };

    Promise.prototype.then = function (onResolved, onRejected) {
        this.onResolved = onResolved;
        this.onRejected = onRejected;
        return this;
    };

    Promise.prototype.resolve = function (value) {
       this.onResolved(value);
       return this;
    };
     
    Promise.prototype.reject = function (error) {
        this.onRejected(error);
        return this;
    };

    new Promise().then(function(value) {
        setTimeout(function() {
            console.log(value);
        }, 3000);
    }, function(error) {
        alert("error");
    }).resolve("3 sec output.");
    View Code


    10、实现一个页面

    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body style="960px; margin: 20px auto;">
        <div id="nav" style="height: 80px;text-align: center;font-size: 3em;border-bottom: solid #DDDDDD;">阿里巴巴面试题</div>
        <div id = "Content">
            <div id = "sidebar" style="20%; float: left;">
                <ul>
                    <li style="list-style: none;"><href="" style="text-decoration: none;">前端工程师面试题</a></li>
                    <li style="list-style: none;"><href="" style="text-decoration: none;">设计师面试题</a></li>
                    <li style="list-style: none;"><href="" style="text-decoration: none;">java面试题</a></li>
                </ul>    
            </div>
            <div id = "main" style="80%;">
                <table style="border-collapse:collapse;">
                    <tr> 
                        <th  style="border:1px solid black; 250px; height:40px;">我是标题一</th>
                        <th  style="border:1px solid black; 90px; height:40px;">标题二</th>
                        <th  style="border:1px solid black; 90px; height:40px;"></th>
                    </tr>
                    <t>
                        <td style="border:1px solid black; 250px; height:40px;">内容</td>
                        <td style="border:1px solid black; 250px; height:40px;">内容</td>
                        <td style="border:1px solid black; 250px; height:40px;">内容</td>
                    </tr>
                </table>
            </div>
        </div>
    </body>
    </html>
    View HTML Code

    11、个人的github地址 

  • 相关阅读:
    委托和事件的区别
    委托小练习
    线程安全小练习
    线程等待练习
    线程练习
    C# Parallel用法
    Winform 跨线程更新UI控件常用方法汇总
    世界顶级思维,收藏终身受用!
    Win10预览版怎么关闭自动更新?怎么更改更新设置
    win7删除桌面文件后手动刷新才会消失的解决方法
  • 原文地址:https://www.cnblogs.com/sun-mile-rain/p/3949456.html
Copyright © 2011-2022 走看看