WEB前端開發(fā)工程師 年終福利(一、 程序題問題)

程序題

  • 1、var a=[]; a[0]=0;``a[1]=1;``a[4]=4; 請問a.length的值是多少?a[3]的輸出結(jié)果是什么?

    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),說出上面代碼執(zhí)行結(jié)果?

      object undefined number boolean
  • 4、console.log(aMrg);輸出的結(jié)果是?

        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>標簽內(nèi)的文字是什么顏色的?紅色

        <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、下面這段代碼想要循環(huán)延時輸出結(jié)果0 1 2 3 4,請問輸出結(jié)果是否正確,如果不正確說明為什么,并修改循環(huán)內(nèi)的代碼使其輸出正確的結(jié)果。

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

            不正確,先執(zhí)行FOR循環(huán)。for循環(huán)完成后,在去執(zhí)行setTimeout。但是這個時候I已經(jīng)是5了,所以輸入了5次5

            for(var i = 0; i <5; ++i) {
                var a = 0;
                setTimeout (function () {
                    console.log(a++);
                },100*i);
            }
  • 11、完成函數(shù)showlmg(),要求能夠動態(tài)根據(jù)下拉列表的選項變化,更新圖片的顯示

            <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發(fā)生改變的時候調(diào)用showImg函數(shù),實參為this(select對象本身),可以通過select對象的屬性來為pic的src賦值實現(xiàn)圖片切換

  • 12、完成foo()函數(shù)的內(nèi)容,要求能彈出對話框提示當前選中的是第幾個單選框

<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只有在提交的時候才會觸發(fā)這里面沒有submit按鈕,在提交事件觸發(fā)的時候遍歷哪個input表單是選中狀態(tài)然后alert粗來
  • 13、計算下面程序運行結(jié)果

        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  //參數(shù)1
            undefined         //參數(shù)2 未傳入為未定義
            undefineddavid!   //name雖然是參數(shù)但是參數(shù)重新賦值為david了msg因為變量聲明提升所以值為undefined
            您好您的id是189     //因為number+string=string所以for循環(huán)最后一次聲明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賦值為函數(shù)Foo()的返回值f1=function(){ console.log(i++) }

            1       //因為f1=了一個function所以有了作用域,f2和f1不同,不在一個內(nèi)存中

            0

            i is not defined 報錯  //i為Foo內(nèi)部的變量全局不可訪問,全局中沒有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、寫出以下程序執(zhí)行的結(jié)果

    1)var a = 10;

      a.pro = 10;

      console.log(a.pro + a);

      NAN number對象不可以定義私有屬性 namber+非數(shù)字和字符的值就等于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 函數(shù)提升優(yōu)先于變量提升

    4)var f = true;

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

  • 17、請看如下的代碼,寫出結(jié)果

        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關(guān)鍵字后指向test test木有a屬性所以為undefined
  • 18、p最后顯示什么顏色。怎么讓p的顏色變成黑色,并簡要說明css選擇器優(yōu)先級關(guān)系

        <style>

            #classA{color:yellow};

            p.classB(color:red);

        </style>

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

        </body>
       //p#classA{color:black}
  • 19、關(guān)于正則表達式聲明6位數(shù)字的郵編,一下代碼正確的是(C)

        A.var reg = /\d6/;

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

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

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

  • 20、關(guān)于JavaScript里xml處理,一下說明正確的(A)

        A.xml是種可擴展標記語言,格式更規(guī)范,是作為未來html的替代  //貌似XML是被替代的

        B.Xml一般用于傳輸和存儲數(shù)據(jù),是對html的補充,兩者的目的不同

        C.在JavaScript里解析和處理xml數(shù)據(jù)時,因為瀏覽器的不同,其做法也不同

        D.在IE瀏覽器里處理xml,首先需要創(chuàng)建ActiveXObject對象
  • 21、請選擇對javascript理解有誤的(B)

        A.javascript是網(wǎng)景公司開發(fā)的一種基于事件和驅(qū)動網(wǎng)頁腳本語言

        B.JScript是javascript的簡稱 //微軟自己的瀏覽器才支持

        C.FireFox和IE存在大量兼容性問題的主要原因在于他們對javascript的支持不同

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

        A.inserAfter()

        B.Append()

        C.appendTo()

        D.After()
  • 23、在javascript中定義變量var a=”35”,var b = “7”運算a % b 的結(jié)果為(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、請選擇結(jié)果為真的表達式(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數(shù)組對象的說法不正確的是(C)

        A.對數(shù)組里數(shù)據(jù)的排序可以用sort函數(shù),如果排序效果非預期,可以給sort函數(shù)加一個排序函數(shù)的參數(shù)

        B.reverse用于對數(shù)組數(shù)據(jù)的倒序排列

        C.向數(shù)組的最后位置加一個新元素,可以用pop方法 //push吧 

        D.unshift方法用于向數(shù)組刪除一個元素
  • 30、要將頁面的狀態(tài)顯示”已經(jīng)選中該文本”,下列JavaScript語句正確的是(A)

        A.window.status = “已經(jīng)選中該文本”

        B.Document.status = “已經(jīng)選中該文本”

        C.Window.screen = “已經(jīng)選中該文本”

        D.Document.screen = “已經(jīng)選中該文本”

  • 31、點擊頁面的按鈕,使之打開一個新窗口,加載一個頁面,以下JavaScript代碼中可執(zhí)行的是(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語句中,實現(xiàn)檢索當前頁面中的表單元素中的所有文本框,并將它們?nèi)壳蹇?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位數(shù)字。要求在提交表單時,根據(jù)上述條件驗證該文本框中輸入內(nèi)容的有效性,下列語句中(A)能正確實現(xiàn)以上功能

        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、關(guān)于正則表達式聲明6位數(shù)字的郵編,一下代碼正確的是(C)

        A.var reg = /\d6/;

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

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

        D.var reg = new RegExp (“\d{6}”);
  • 35、下面關(guān)于cookie的說明正確的是(D)

        A.Cookie設(shè)置的過期時間為3600s是指60分鐘過期

        B.Cookie設(shè)置的過期時間為3600s是指只要在間隔60分鐘內(nèi)有動作時就不過期

        C.Cookie保存在服務(wù)器端

        D.Cookie保存在用戶本地
  • 36、使用js代碼實現(xiàn),將下面段落中含有的鏈接替換成可直接點擊打開的鏈接

        <p id=”text”>這個段落里有鏈接

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

        可是他們顯示在網(wǎng)頁中是,鏈接不可點,還得復制粘貼到地址欄打開,好麻煩

        </p>

  • 37、寫一個方法獲取url?后面的參數(shù),并將參數(shù)對象化。

        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的異步調(diào)用方式重寫
            請用ES6 yield的異步調(diào)用方式重寫
            在經(jīng)歷了多個異步回調(diào)之后,如果拿到完整的堆信息(stack trace)?
  • 39、用你認為合適的數(shù)據(jù)庫產(chǎn)品,請設(shè)計數(shù)據(jù)結(jié)構(gòu),并完成一下方法(Server);

            1.當出現(xiàn)一次網(wǎng)頁瀏覽的時候,請實現(xiàn)函數(shù)click(url, ip)

            2.請實現(xiàn)查詢函數(shù)pv(url)以及uv(url)
  • 40、補充按鈕事件的函數(shù),確認用戶是否退出當前頁面,確認之后關(guān)閉窗口

            <html>

            <head>

            <script type=”text/javasccript”>

            function closeWin() {

             

            }

            </script>

            </head>

            <body>

            <input type=”button” value=”關(guān)閉窗口” onclick=”closeWin()” />

            </body>

            </html>

             

            function closeWin(){
                if(confirm("您確定要關(guān)閉本頁嗎?")){
                    window.opener=null;
                    window.open('','_self');
                    window.close();
                }
            }
  • 41、請用JavaScript實現(xiàn),控制一個文本框只能輸入正整數(shù),如輸入不符合條件則文本全部字體標紅,要求寫出完整的文本框HTML代碼和JavaScript邏輯代碼?

            <!DOCTYPEhtml>

            <htmllang="en">

            <head>

            <metacharset="utf-8">

            <title>只能輸入正整數(shù)</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、請對以下代碼進行優(yōu)化

            var wrap = document.getElementById(“wrap”);
            for(var i = 0; i < 10; i++) {
                    var li = document.createElement(“l(fā)i”);
                    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>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容