WEB前端开发工程师 年终福利(一、 程序题问题)

程序题

  • 1、var a=[]; a[0]=0;``a[1]=1;``a[4]=4; 请问a.length的值是多少?a[3]的输出结果是什么?

    5  undefined
  • 2、var a=[5,6]; var b=a; b[0]="hello"; alert(a[0]); 请问值是多少?

    "hello"
  • 3、typeof(null),typeof(undefined),typeof(NaN),typeof(NaN==NaN),说出上面代码执行结果?

      object undefined number boolean
  • 4、console.log(aMrg);输出的结果是?

        function doSomething(){
            for(var i = 0; 4 > i; i++) {
                var k = 100;
                aMrg +=','+ (k + i);
            }
           }
        var k = 1,aMrg = k;
        doSomething();
        aMrg +=k;
        console.log(aMrg);
1,100,101,102,1031
  • 5、请写出下面输出的值

        console.log(undefined || 1);//值___1__

        console.log(null || NaN);   //值__NaN___

        console.log(0 && 1);        //值__0___

        console.log(0 && 1 || 0);  //值__0___
  • 6、看下列代码,<p>标签内的文字是什么颜色的?红色

        <style>

        .classA{color: blue};

        .classB{color: red};

        </style>

        <body>

            <p class=”classB classA”>123</p>

        </body>
  • 7、obj.foo()值是多少?

        // mixins.js文件
        export function mixins(...list) {
        return function (target) {
            Object.assign(target.prototype, ...list)
        }
        }

        // main.js文件
        import { mixins } from './mixins'

        const Foo = {
        foo() { console.log('foo') }
        };

        @mixins(Foo)
        class MyClass {}

        let obj = new MyClass();
        obj.foo() // 'foo'


  • 8、你面前有一座高塔,这座高塔有N(N > 100)个台阶,你每次只能往前迈1个或者2个台阶,请写出程序计算总共有多少种走法?

这个案例满足斐波那契定律 1,1,2,3,5,8,13,21, 34, 55, 89, 144

            varn1 = 1;
            var n2 = 1;
            var n3 = n1 + n2;
            for (var i = 3; i <= n; i++) {
                    n3 = n1 + n2;
                    n1 = n2;//往后推一项
                    n2 = n3;//往后推一项
            }
            console.log(n3);
  • 9、请阅读下面的CSS代码

            #left {

                color: white !important;

            }

            #container #left {

                color: red;

            }

            #left {

                 color: green !important;

            }

            .container #left {

                 color: blue;

            }

            则在如下html中

            <div class=”container” id=”container”>

                   <span id=”left”>left</span>

            </div>

            #left最终color属性值为?绿色

 
  • 10、下面这段代码想要循环延时输出结果0 1 2 3 4,请问输出结果是否正确,如果不正确说明为什么,并修改循环内的代码使其输出正确的结果。

            for (var i = 0; i < 5; ++i) {
                setTimeout(function () {
                       console.log(i + ‘’);
                    },100*i);
            }

            不正确,先执行FOR循环。for循环完成后,在去执行setTimeout。但是这个时候I已经是5了,所以输入了5次5

            for(var i = 0; i <5; ++i) {
                var a = 0;
                setTimeout (function () {
                    console.log(a++);
                },100*i);
            }
  • 11、完成函数showlmg(),要求能够动态根据下拉列表的选项变化,更新图片的显示

            <body>
                <img id=”pic” src=”img1.jpg” width=”200” height=”200”>
                <br/>
                <selectid=”sel” onchange=”showImg(this)”>
                    <option value=”img1”>城市生活</option>
                    <option value=”img2”>都市早报</option>
                    <option value=”img3”>青山绿水</option>
                </select>
            </body>
            <script type=”text/javascript”>
                     Function showImg (oSel) {    
     
                     };

            </script>
                            Function showImg (oSel) {        
                                var pic=document.getElementById('pic')
                                pic.src=oSel.options[oSel.selectedIndex].value
                                console.log(pic.src);     
                            };
            答案说明:当select发生改变的时候调用showImg函数,实参为this(select对象本身),可以通过select对象的属性来为pic的src赋值实现图片切换

  • 12、完成foo()函数的内容,要求能弹出对话框提示当前选中的是第几个单选框

<html>

    <head>

             <meat http-equiv=”Content-Type”content=”text/html; charset=utf-8”>

    </head>

    <body>

        <scripttype=”text/javascript”>

        function foo() {

         

        };

        </script>

                <form name=”form1” onsubmit=”retuen foo()”>
                        <input type=”radio” name = “radioGroup”>
                        <input type=”radio” name = “radioGroup”>
                        <input type=”radio” name = “radioGroup”>
                        <input type=”radio” name = “radioGroup”>
                </form>

        </body>

</html>

 
        function foo() {
                var a=document.getElementsByTagName('input')
                function foo() {
                for(var i=0;i<a.length;i++){
                        if(a[i].checked){
                            alert(i+1)
                        }
                    }
                }
        }
题粗的有问题,onsubmit只有在提交的时候才会触发这里面没有submit按钮,在提交事件触发的时候遍历哪个input表单是选中状态然后alert粗来
  • 13、计算下面程序运行结果

        var msg = 'hello';

        function great(name, attr) {
                name = 'david';
                var greating = msg + name + '!';
                var msg = '您好';
                for (var i = 0 ; i < 10;i++) {
                    var next = msg + '您的id是' + i*2 + i;
                }
                console.log(arguments[0]);
                console.log(arguments[1]);
                console.log(greating);
                console.log(next);
        }

        great('Tom');
        答案:david  //参数1
            undefined         //参数2 未传入为未定义
            undefineddavid!   //name虽然是参数但是参数重新赋值为david了msg因为变量声明提升所以值为undefined
            您好您的id是189     //因为number+string=string所以for循环最后一次声明next=****18+9
  • 14、下面这段JS输出什么,并简述为什么?

            function Foo() {
                var i = 0;
                return function () {
                    console.log(i++);
                }

            }
            var f1 = Foo()
            f2 = Foo()
            f1()
            f1()
            f2()
            console.log(i);
            0       //f1=Foo() 相当于f1赋值为函数Foo()的返回值f1=function(){ console.log(i++) }

            1       //因为f1=了一个function所以有了作用域,f2和f1不同,不在一个内存中

            0

            i is not defined 报错  //i为Foo内部的变量全局不可访问,全局中没有i变量所以会报错
  • 15、请写出下面输出的值

            a)        var num = 1;
                    var fun = function () {
                                console.log(num);//值___undefined___
                                var num = 2;
                                console.log(num);//值___2___
                            }

                    fun();

            b)        varnum = 1;

                    function fun () {
                        console.log(num);//值___1____
                        num = 2;
                        console.log(num);//值___2____
                    }

            fun();
  • 16、写出以下程序执行的结果

    1)var a = 10;

      a.pro = 10;

      console.log(a.pro + a);

      NAN number对象不可以定义私有属性 namber+非数字和字符的值就等于NaN

    2)var s = ‘hello’;

      s.pro = ‘world’;   

      console.log(s.pro + s); //undefinedhello s位字符串,字符串不可以自定义属性,所以s.pro为undefined 字符串做加运算会强制拼接位字符串

    3)console.log(typeof fn);

      function fn() {};

      var fn;

      //function 函数提升优先于变量提升

    4)var f = true;

      if(f === true) {
            var a = 10;
          }
      function fn() {
            var b = 20;
            c = 30;
      }
    fn();
    console.log(a);
    //10

  • 17、请看如下的代码,写出结果

        var a = 5,b = 3;

        function test() {
            alert(b++);
            var a = 4;
            alert(--a);
            alert(this.a);
        }
        1)tese(),三次alert()的值依次是什么?335  435 535

        2)new test(),三次alert()的值依次是什么? 33undefined 43undefined53undefined //this更改了指向原来是指向window 用了new关键字后指向test test木有a属性所以为undefined
  • 18、p最后显示什么颜色。怎么让p的颜色变成黑色,并简要说明css选择器优先级关系

        <style>

            #classA{color:yellow};

            p.classB(color:red);

        </style>

        <body>
                 <p id=”classA” class=”classB”>123</p>

        </body>
       //p#classA{color:black}
  • 19、关于正则表达式声明6位数字的邮编,一下代码正确的是(C)

        A.var reg = /\d6/;

        B.var reg = \d{6}\;

        C.var reg = /\d{6}/; 

        D.var reg = new RegExp (“\d{6}”);

  • 20、关于JavaScript里xml处理,一下说明正确的(A)

        A.xml是种可扩展标记语言,格式更规范,是作为未来html的替代  //貌似XML是被替代的

        B.Xml一般用于传输和存储数据,是对html的补充,两者的目的不同

        C.在JavaScript里解析和处理xml数据时,因为浏览器的不同,其做法也不同

        D.在IE浏览器里处理xml,首先需要创建ActiveXObject对象
  • 21、请选择对javascript理解有误的(B)

        A.javascript是网景公司开发的一种基于事件和驱动网页脚本语言

        B.JScript是javascript的简称 //微软自己的浏览器才支持

        C.FireFox和IE存在大量兼容性问题的主要原因在于他们对javascript的支持不同

        D.AJAX技术一定要使用javascript技术
  • 22、在Jquery中下面哪一个是用来追加到指定元素的末尾(B)

        A.inserAfter()

        B.Append()

        C.appendTo()

        D.After()
  • 23、在javascript中定义变量var a=”35”,var b = “7”运算a % b 的结果为(C)

        A.357

        B.57

        C.0

        D.5
  • 24、下面哪个属于javascript的字符型C

        A.False

        B.你好

        C.“123”

        D.Null
  • 25、下面哪个属于javascript的布尔值(C)

        A.1.2

        B.”true”

        C.false

        D.null

  • 26、请选择结果为真的表达式(C)

        A.null instanceof Object

        B.Null === undefined;

        C.null == undefined

        D.NaN == NaN
  • 27、下列运算方式不属于逻辑运算的是(D)

        A.!a

        B.a&&b

        C.a||b

        D.a>b
  • 28、声明一个对象,给它加上name属性和show方法显示其name值,以下代码中正确的是(D)

        A.var obj = [name : “zhangsan” ,show: function(){alert(name);}];

        B.Var obj = {name : “zhangsan”,show: “alert(this.name)”};

        C.Var obj = {name : “zhangsan”,show: function () {alert(name);}};

        D.Var obj = {name : “zhangsan”,show: function () {alert(this.name);}}
  • 29、以下过于Array数组对象的说法不正确的是(C)

        A.对数组里数据的排序可以用sort函数,如果排序效果非预期,可以给sort函数加一个排序函数的参数

        B.reverse用于对数组数据的倒序排列

        C.向数组的最后位置加一个新元素,可以用pop方法 //push吧 

        D.unshift方法用于向数组删除一个元素
  • 30、要将页面的状态显示”已经选中该文本”,下列JavaScript语句正确的是(A)

        A.window.status = “已经选中该文本”

        B.Document.status = “已经选中该文本”

        C.Window.screen = “已经选中该文本”

        D.Document.screen = “已经选中该文本”

  • 31、点击页面的按钮,使之打开一个新窗口,加载一个页面,以下JavaScript代码中可执行的是(D)

        A.<input type=”button” value=”new”onclick=”open(‘new.html’,’_blank’)”>

        B.<input type=”button” value=”new”onclick=”window.location=’new.html’;”>

        C.<input type=”button” value=”new”onclick=”location.assign(‘new.html’);”>

        D.<form target=”_blank” action=”new.html”>

        <input type=”submit” value=”new”>

        </form>

  • 32、下面的JavaScript语句中,实现检索当前页面中的表单元素中的所有文本框,并将它们全部清空(B)

        A.for(var i = 0; i <form1.elements.length; i++) {

        if(form1.elements[i].type ==”text”)

        form1.elements[i].value = “”;

          }

        B.for (var i = 0; i < document.forms.length;i++) {

        if(forms[0].elements[i].type == “text”)

        form[0].elements[i].value = “”;

        }

        C.if(document.form.elements.type == “text”)

        form.elements[i].value = “”;

        D.for(var i = 0; i <document.forms.length;i++) {

        for(var j = 0;j <document.forms[i].elements.length;j++) {

        if(document.forms[i].elements[j].type== “text”)

        document.forms[i].elements[j].value= “”;

        }

        }

  • 33、在表单(form1)中有一个文本框元素(fname),用于输入电话号码,格式如:010-82668155,要求前3位是010,紧接一个”-”,后面是8位数字。要求在提交表单时,根据上述条件验证该文本框中输入内容的有效性,下列语句中(A)能正确实现以上功能

        A.var str = form1.fname.value;

        If(str.substr(0,4)!=”010-”||str.substr(4).length!=8||isNaN(parseFloat(str.substr(4))))

        Alert(“无效的电话号码!”);

         

        B.var str = form1.fname.value;

        If(str.substr(0,4)!=”010-”&&str.substr(4).length!=8&&isNaN(parseFloat(str.substr(4))))

        Alert(“无效的电话号码!”);

         

        C.var str = form1.fname.value;

        If(str.substr(0,3)!=”010-”||str.substr(3).length!=8||isNaN(parseFloat(str.substr(3))))

        alert(“无效的电话号码!”);

         

        D.var str = form1.fname.value;

        If(str.substr(0,4)!=”010-”&&str.substr(4).length!=8&&isNaN(parseFloat(str.substr(4))))

        alert(“无效的电话号码!”);

 
  • 34、关于正则表达式声明6位数字的邮编,一下代码正确的是(C)

        A.var reg = /\d6/;

        B.var reg = \d{6}\;

        C.var reg = /\d{6}/;

        D.var reg = new RegExp (“\d{6}”);
  • 35、下面关于cookie的说明正确的是(D)

        A.Cookie设置的过期时间为3600s是指60分钟过期

        B.Cookie设置的过期时间为3600s是指只要在间隔60分钟内有动作时就不过期

        C.Cookie保存在服务器端

        D.Cookie保存在用户本地
  • 36、使用js代码实现,将下面段落中含有的链接替换成可直接点击打开的链接

        <p id=”text”>这个段落里有链接

        比如:http://www.abc.comm/和https://www.github.com/都是链接。

        可是他们显示在网页中是,链接不可点,还得复制粘贴到地址栏打开,好麻烦

        </p>

  • 37、写一个方法获取url?后面的参数,并将参数对象化。

        function parseQueryString(url){
               var params = {};
               var arr =url.split("?");
               if (arr.length <= 1)
                 return params;
               arr =arr[1].split("&");
               for(var i=0, l=arr.length;i<l; i++){
                  var a =arr[i].split("=");
                  params[a[0]] = a[1];
               }
               return params;
            }
            var url ="http://witmax.cn/index.php?key0=0&key1=1&key2=2";
            var ps = parseQueryString(url);
            console.log(ps["key1"]);
 
  • 38、Node.js中,一段访问redis的代码如下

            var redis = require(‘redis’);
            var client = redis.createClient();
            client.set(‘key’, ‘value’, function (err,data) {
                if(err) {
                    console.error(err.message)
                    process.exit(1)
                }
                cilent.get(‘key’,function(err,data) {
                        if(err) {
                            console.error(err.message);
                            return;
                        }
                        console.log(data);
                        process.exit(0);
                })
            });
            请用Promise的异步调用方式重写
            请用ES6 yield的异步调用方式重写
            在经历了多个异步回调之后,如果拿到完整的堆信息(stack trace)?
  • 39、用你认为合适的数据库产品,请设计数据结构,并完成一下方法(Server);

            1.当出现一次网页浏览的时候,请实现函数click(url, ip)

            2.请实现查询函数pv(url)以及uv(url)
  • 40、补充按钮事件的函数,确认用户是否退出当前页面,确认之后关闭窗口

            <html>

            <head>

            <script type=”text/javasccript”>

            function closeWin() {

             

            }

            </script>

            </head>

            <body>

            <input type=”button” value=”关闭窗口” onclick=”closeWin()” />

            </body>

            </html>

             

            function closeWin(){
                if(confirm("您确定要关闭本页吗?")){
                    window.opener=null;
                    window.open('','_self');
                    window.close();
                }
            }
  • 41、请用JavaScript实现,控制一个文本框只能输入正整数,如输入不符合条件则文本全部字体标红,要求写出完整的文本框HTML代码和JavaScript逻辑代码?

            <!DOCTYPEhtml>

            <htmllang="en">

            <head>

            <metacharset="utf-8">

            <title>只能输入正整数</title>

            </head>

            <body>

                    <inputid="txt" type="text">
            <script>
                    var txt=document.getElementById('txt');
                    var color =window.getComputedStyle(txt,'').color
                    txt.addEventListener('keyup',function() {
                            var reg = newRegExp("^[0-9]*$");;
                            console.log(reg.test(this.value));
                            if(reg.test(this.value)){
                                    this.style.color=color;
                            }else{
                                    this.style.color='red';
                            }
                   });

            </script>

            </body>

            </html>
  • 42、请对以下代码进行优化

            var wrap = document.getElementById(“wrap”);
            for(var i = 0; i < 10; i++) {
                    var li = document.createElement(“li”);
                    var text =document.createTextNode(“hello” + i);
                    li.appendCChild(text);
                    wrap.appendChild(li);
            }

  • 43、请看下面的HTML,写出您的CSS使左边元素宽度为200px保持不变,右边元素随浏览器大小自适应

            <div class=”outer”>

                <div class=”left”></div>

                <div class=”right”></div>

            </div>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,826评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,968评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,234评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,562评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,611评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,482评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,271评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,166评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,608评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,814评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,926评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,644评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,249评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,866评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,991评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,063评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,871评论 2 354

推荐阅读更多精彩内容