JavaScript100道大廠筆試面試題(一)

以下題目來自Duing公眾號，本文所有題目已獲得原作者授權

1、以下代碼輸出的結果是：

var foo=function bar(){}
console.log(typeof bar);

2、以下代碼輸出結果是：

var a=1;
if(true){
    console.log(a);
    let a=2;
}

3、以下代碼輸出的結果是：

var a=[1,2,3,3,5,6,6,6,'A',undefined,true,null]
var s=new Set(a);
console.log(s.size);

4、請你寫出代碼，計算兩個數組的交集：

let arr1=[1,2,3,4,5];
let arr2=[4,5,6,7,8];

5、以下代碼運行后，在控制台里打印輸出的內容為：

let x=1;
function f1(x,y=x){
    console.log(y);
}
function f2(y=x){
    let x=0;
    console.log(y);
}
f2(2);
f1();

6、以下代碼運行后，在控制台里打印輸出的內容為：

fn(123)
var a=456;
function fn(a){
    console.log(a);
}

7、eadonly和disabled哪個屬性對input和textarea元素都生效？

• A readonly
• B disabled

8、以下代碼輸出結果為：_________，並詳細說明原因：

function F(){
    this.a=1;
}
var obj=new F();
console.log(obj.prototype);

9、以下代碼輸出的結果為：

if(false){
    var a=1;
    let b=2;
}
console.log(a);
console.log(b);

10、請寫出代碼，計算兩個數組的差集：

let arr1=[1,2,3,4,5];
let arr2=[4,5,6,7,8]

11、a、b、c、的值分別為：

var [a=3,b=a,c=3]=[1,2,undefined];

12、以下代碼運行后，ul里的內容順序為：

<ul id="list">
    <li>百度</li>
    <li>阿里</li>
    <li>騰訊</li>
</ul>
<script>
    var list=document.getElementById('list');
    var lis=list.querySelectorAll('li');
    list.replaceChild(lis[2],lis[1]);
    list.insertBefore(lis[1],list.children[2]);
</script>
    

13、以下代碼執行后，控制台里打印的內容為：

var c=1;
function c(){
    console.log(c);
    var c=3;
}
console.log(c);
c(2);

14、以下代碼執行后，控制台里打印的內容為：

var name='kaivan';
(function () {
    if(typeof name==='undefined'){
        var name='chen';
        console.log(name);
    }else {
        console.log(name);
    }
})();

15、以下代碼執行后，控制台里打印的內容為：

var a=10;
function test() {
    a=100;
    console.log(a);
    console.log(this.a);
    var a;
    console.log(a);
}
test();

16、以下代碼執行后，控制台里打印出的內容為：

if(!('a' in window)){
    var a=1;
}
console.log(a);

17、以下代碼執行后，控制台里打印的內容為：

var val=1;
var obj={
    val:2,
    del:function () {
        console.log(this);
        this.val*=2;
        console.log(val);
    }
}
obj.del();

18、以下代碼執行后，控制台里打印出的內容為：

var name='kaivon';
var object={
    name:'chen',
    getNameFunc:function () {
        return function () {
            return this.name;
        }
    }
}
console.log(object.getNameFunc()())

19、以下代碼執行后，控制台里打印的內容為：

var name='kaivon';
var object={
    name:'chen',
    getNameFunc:function () {
        var that=this;
        return function () {
            return that.name;
        }
    }
}
console.log(object.getNameFunc()())

20、以下代碼執行后，控制台里打印的內容為：

var a=6;
setTimeout(function () {
    a=666;
},0)
console.log(a);

21、以下的代碼執行后，控制台里打印的內容為：

(function () {
    var a=b=3;
})();
console.log(typeof  a==='undefined');
console.log(typeof b==='undefined')

22、以下的代碼執行后，控制台里打印的內容為：

var a=(function (foo) {
    return typeof foo.bar;
})({foo:{bar:1}});
console.log(a);

23、以下的代碼執行后，控制台里打印的內容為：

function f() {
    return f;
}
console.log(new f() instanceof f);

24、以下的代碼執行后，控制台里打印的內容為：

function A() {}
A.prototype.n=1;
var b=new A();
A.prototype={
    n:2,
    m:3,
}
var c=new A();
console.log(b.n,b.m);
console.log(c.n,c.m)

25、以下的代碼執行后，控制台里打印的內容為：

console.log(false.toString());
console.log([1,2,3].toString());
console.log(1.toString());
console.log(5..toString());

26、以下的代碼執行后，控制台里打印的內容為：

console.log(1 + '2' + '2');
console.log(1 + +'2'+ '2');
console.log(+ '1' - +'1'+'2');
console.log('A' - 'B' + '2');
console.log('A' - 'B' + 2)

27、以下的代碼執行后，控制台里打印的內容為：

var a=666;
console.log(++a);
console.log(a++);
console.log(a);

28、以下的代碼執行后，控制台里打印的內容為：

var a={n:1};
var b=a;
a.x=a={n:2};
console.log(a.n,b.n);
console.log(a.x,b.x);

29、以下的代碼執行后，控制台里打印的內容為：

console.log(c);
function c(a) {
    console.log(a);
    var a=3;
    function a() {

    }
}
c(2);

30、以下的代碼執行后，控制台里打印的內容為：

console.log(typeof a);
function a() {};
var a;
console.log(typeof  a);

31、以下的代碼執行后，控制台里打印的內容為：

var a;
var b='undefined';
console.log(typeof a);
console.log(typeof b);
console.log(typeof c);

32、以下的代碼執行后，控制台里打印的內容為：

var obj={n:1};
function fn2(a) {
    a.n=2;
}
fn2(obj);
console.log(obj.n);

33、以下的代碼執行后，控制台里打印的內容為：

var x=10;
function fn() {
    console.log(x);
}
function show(f) {
    var x=20;
    fn();
}
show(fn);

34、以下的代碼執行后，控制台里打印的內容為：

Object.prototype.bar=1;
var foo={
    goo:undefined
};
console.log(foo.bar);
console.log('bar' in foo);
console.log(foo.hasOwnProperty('bar'));
console.log(foo.hasOwnProperty('goo'));

35、以下的代碼執行后，控制台里打印的內容為：

Object.prototype.bar=1;
var foo={
    moo:2,
}
for(var i in foo){
    console.log(i);
}

36、以下的代碼執行后，控制台里打印的內容為：

function foo1() {
    return{
        bar:'hello'
    };
}
function foo2() {
    return{
        bar:'hello'
    };
}
console.log(foo1());
console.log(foo2());

37、以下的代碼執行后，控制台里打印的內容為：

console.log(function () {
    return typeof arguments;
}())

38、以下的代碼執行后，控制台里打印的內容為：

console.log(Boolean(false));
console.log(Boolean('0'));
console.log(Boolean(''));
console.log(Boolean(NaN));

39、以下的代碼執行后，控制台里打印的內容為：

var x=1;
if(function f (){}){
    x+typeof f;
}
console.log(x);

40、以下的代碼執行后，控制台里打印的內容為：

console.log('b'+'a'+ + +'a'+'a')

41、以下的代碼執行后，控制台里打印的內容為：

var obj={
    a:1,
    b:2
}
Object.setPrototypeOf(obj,{c:3});
Object.defineProperty(obj,'d',{value:4,enumerable:false});
for(let prop in obj){
    console.log(prop);
}

42、以下的代碼執行后，控制台里打印的內容為：

var x=10;
var foo={
    x:90,
    getX:function () {
        return this.x;
    }
};
console.log(foo.getX());
var xGetter=foo.getX;
console.log(xGetter());

43、寫一個sum方法，當使用下面的語法調用時它將正常工作：

console.log(sum(2,3));
console.log(sum(2)(3))

44、當用戶點擊“按鈕4”時什么被記錄到控制台？為什么？

for(var i=0;i<5;i++){
    var btn=document.createElement('button');
    btn.appendChild(document.createTextNode('按鈕'+i));
    btn.addEventListener('click',function () {
        console.log(i);
    })
    document.body.appendChild(btn);
}

45、以下代碼執行后，d里的內容為？

var d={};
var b=['car','house'];
b.forEach(function (k) {
    d[k]=undefined;
})
console.log(d);

46、以下代碼執行后，控制台里的內容為？

var arr1='john'.split('');
var arr2=arr1.reverse();
var arr3='jones'.split('');
arr2.push(arr3);
console.log('arr1:length='+arr1.length+'last='+arr1.splice(-1));
console.log('arr2:length='+arr2.length+'last='+arr2.splice(-1));

47、以下代碼執行后，控制台里的內容為？

console.log("0 || 1="+(0||1));
console.log('1 || 2='+(1||2));
console.log('0&&1='+(0&&1));
console.log('1&&2'+(1&&2));

48、以下代碼執行后，控制台里的內容為？

var a={}
b={key:'b'};
c={key: 'c'};
a[b]=123;
a[c]=456;
console.log(a[b]);
console.log(a[c]);

49、以下代碼執行后，控制台里的內容為？

(function (x) {
    return (function (y) {
        console.log(x);
    })(2)
})(1);

50、以下代碼執行后，控制台里的內容為？

var length=10;
function fn() {
    console.log(this.length);
}
var obj={
    length:5,
    method:function (fn) {
        fn();
        arguments[0]();
    }
};
obj.method(fn,1);

51、以下代碼執行后，控制台里的內容為？

var myObject={
    foo:'bar',
    func:function () {
        var self=this;
        console.log('outer func: this.foo='+this.foo);
        console.log('outer func: self.foo='+self.foo);
        (function () {
            console.log('inner func :this.foo='+this.foo);
            console.log('inner func :self.foo='+self.foo)
        })()
    }
}
myObject.func();

52、有關this運算符說法不正確的是？

• A this表示當前對象的一個引用
• B 在JS中，由於JS的動態性，this的指向在運行時才正確
• C this關鍵字在JavaScript中和執行環境，而非聲明環境有關
• D 通過早期綁定可以實現對this的高度復用

53、以下哪個不是JavaScript中的錯誤類型？

• A 、語法錯誤
• B、系統錯誤
• C 、類型錯誤
• D 、引用錯誤

54、有關循環語句說法正確的是？

- A、for...in循環遍歷不到繼承的屬性
- B、do...while在判斷條件前會執行一次代碼塊
- C、for循環中三個表達可以省略，分號也可以省略
- D、while循環語句至少會執行循環體一次

55、如果函數無明確的返回值，或調用了沒有參數的return語句，那么它真正返回的值是？

• A、null
• B、-1
• C、0
• D、undefined

56、JavaScript函數中包含了一個參數對象下面有關arguments的描述錯誤的是？

• A、arguments是個比較特殊的對象，使用者無需明確指出參數名即可訪問到它們
• B、可以使用arguments的屬性length來檢測傳遞給函數的參數個數
• C、借助於arguments對象，我們可以模擬函數重載
• D、arguments是一個標准數組

57、有關使用typeof運算符的不正確結論是？

• A、typeof運算符后面的參數可以使用括號引起來，也可以不帶括號
• B、typeof運算符的括號里可以放多個參數
• C、使用typeof運算符檢測的返回結果值總是一個小寫字符串形式
• D、typeof 和instanceof可以相互代替

58、使用instanceof運算符時正確的結論是？

• A、一個空對象不能使用instanceof來檢測
• B、instanceof運算符會順着原型鏈向上查找
• C、instanceof的左操作數只能是對象類型的數據
• D、instanceof可以用來檢測數據類型

59、給定x=6以及y=3，下列結果正確的是？

• A、x<10&&y>1 的結果為true
• B、x==5|| y==5 的結果為true
• C、!(x==y)的結果為false
• D、!!x==x的結果為true

60、如下不正確的結論是：

• A、關系運算符的優先級比'&&'和'||'的要高
• B、假值是false、null、undefined、0、-0、NaN和'';所有其它的值(包括所有對象)都是真值
• C、‘&&’運算符的結果並不一定是布爾值
• D、關系表達式的運算結果未必總是true或false

61、已知“var obj={a：“Hello”}；”於是“obj && obj.a；”的結果是？

• A、true
• B、null
• C、'Hello'
• D、false

62、下面關於邏輯運算符的描述錯誤的是？

• A、!總是返回true或者false
• B、!!10與10是一樣的
• C、||運算符會先計算左邊的表達式，如果結果為false,那么再計算右側的表達式，並返回右側表達式的計算結果
• D、語句'if(a==b) stop()'與語句‘(a==b)&&stop();’表達含義一致

63、有關for循環語句說法錯誤的是？

• A、for循環中三個表達式中的任何一個都可以忽略，但是兩個分號是必不可少的
• B、for循環語句的初始化部分僅在循環開始之前執行一次
• C、for循環變量必須是數字類型
• D、for循環語句中的三部分(初始化部分、測試部分和更新部分)都是可選的

64、有關if語句說法不正確的是？

• A、if后面的條件必須使用括號包圍
• B、有的if語句可以沒有else部分
• C、if語句也支持嵌套
• D、else中語句的執行總是會匹配最外層的那個if語句中的條件判斷

65、有關switch語句的結論錯誤的是？

• A、兩個case不可共同使用一個break語句
• B、對每個case的匹配操作實際上是'==='恆等運算符比較，因此，表達式和case的匹配並不會做任何數據類型轉換
• C、ECMAScript標准的確允許每個case關鍵字更隨任意的表達式
• D、如果在函數中使用switch語句，有時可以使用return來代替break

66、有關JS函數不正確的結論有？

• A、定義函數時聲明了多個參數，但調用時可以不使用它們
• B、函數體是由JavaScript語句組成的，必須使用花括號括起來，即使函數體不包含任何語句
• C、子函數可以在父函數外而正常訪問
• D、定義函數時，並不執行函數體內的語句，調用的時候才會執行

67、有關var語句的錯誤結論的是？

• A、var 聲明的變量有時可以通過delete刪除
• B、如果在頂層代碼中使用var語句，它聲明的是全局變量
• C、如果var語句出現在函數體內，那么它定義的是一個全局變量
• D、var 和function都是聲明語句，用於聲明或者定義變量或者函數

68、有關JS變量說法錯誤的是？

• A、if語句里聲明的變量會被預解析
• B、使用var 多次聲明同一個變量沒有問題
• C、JS變量一旦定義就無法重新定義
• D、const聲明的變量是不能修改的

69、有關in運算符錯誤的結論是？

• A、for...in運算符不可用於數組元素的遍歷
• B、in運算符用來判斷對象是否存在指定名稱的屬性
• C、如果in運算符右側的對象擁有一個名為左操作數的屬性名，那么表達式返回true,否則，返回false
• D、in運算符也可以用在數組身上

70、關於JS賦值操作符描述錯誤的是？

• A、賦值操作符的順序是從左至右
• B、"i=j=k="Hello kaivon!";"的含義是把三個變量都初始化為"Hello kaivon!"
• C、賦值表達式的順序是從右往左
• D、賦值表達式的值就是右操作數的值

71、以下正確的選項是？

• A、“one”<3結果為true
• B、"111"<3結果為true
• C、"100"+200的結果是300
• D、加號運算符的一側為字符串的話，會把兩個數據都轉成字符串

72、下列說法正確的是？（多選）

• A、直接調用Math.max時它並不接受數組
• B、對於一些系統內置對象，使用toString調用不會得到你想要的源碼
• C、函數的length屬性返回函數中的形參個數
• D、arguments對象用於描述傳遞給一個函數的參數數組，是一個類數組本身

73、下面正確的是？（多選）

• A、‘111’<'33'的比較結果為true
• B、1>=Infinity的結果為true
• C、'100'+200表達式中200會被轉成數字，結果為300
• D、‘100’+‘200’的表達式結果為‘100200’

74、關於JS函數的說法錯誤的是？

• A、函數可以通過定時器去調用
• B、自執行的函數可以形成一個獨立作用域
• C、delete可以刪除全局函數
• D、如果函數無明確的返回值，或調用了沒有參數的return語句，那么它真正返回的值是undefined

75、有關this運算符正確的是（多選）？

• A、this對象不能用於箭頭函數中
• B、apply和call能夠強制改變函數執行時的當前對象，讓this指向其它對象
• C、由於JS的動態性，this的指向在運行時才確定
• D、this運算符總是指向當前的對象

76、有關跳轉語句的說法正確的是？

• A、switch中，case語句如果沒有break,它會繼續執行下一個case語句
• B、break是跳出當前次循環，containue是跳出整個循環
• C、break語句可以阻止函數繼續運行
• D、在for...in中不能使用break

77、下面有關循環語句正確的結論是？（多選）

• A、for...in循環可以像枚舉對象屬性一樣枚舉數組索引
• B、for...in語句是for循環語句完全相同，它循環的范圍是一個對象的所有屬性或是一個數組的所有元素
• C、for循環的循環變量未必都是數字
• D、for循環語句中的所有三部分（初始化語句，條件語句和變化語句）都是可選的

78、下面有關條件及分支語句正確的結論是？（多選）

• A、case關鍵字后也可以使用表達式
• B、if語句的括號里表達式結果為被轉成布爾值
• C、else語句可以獨立使用
• D、if后面的條件可以不使用括號

79、下面說法錯誤的是？

• A、CommonJS模塊規范可以和AMD規范都是針對服務端制定的規范
• B、字符串屬於原始數據類型
• C、任意JS值都可以轉換為布爾值
• D、null和undefined沒有包裝對象，如果訪問它們的屬性，會引發一個類型錯誤

80、下面說法錯誤的是？

• A、在ECMAScript中，‘+’既是二元加法運算符，又是一元數字運算符，還能夠把兩個字符串連接起來
• B、JavaScript運算符通常會根據需要對操作數進行類型轉換
• C、在JS中，for/in循環只能遍歷對象的所有屬性
• D、字符串可以當作只讀數組，使用方括號+下標的形式來訪問單個字符

81、關於append與appendChild的區別，下面說法錯誤的是？

• A、append方法可以添加文本節點，比如append('楊戩')，appendChild方法不行
• B、append方法是jqery的，appendChild方法是原生的
• C、append方法可以同時插入一個節點以及一個文本，appendChild()只能添加一個
• D、append方法沒有返回值，appendChild會返回添加的那個節點

82、以下代碼運行后，在控制台里輸出的內容為？

function output(a) {
    console.log(a);
}
output(typeof function () {
    output('Hello World!')
}())

83、以下代碼運行后，在控制台里輸出的內容為？

function test() {
    var n=1573;
    function add() {
        n++;
        console.log(n);
    }
    return {n:n,add:add}
}
var result=test();
var result2=test();
result.add();
result.add();
console.log(result.n);
result2.add();

84、以下代碼運行后，在控制台里輸出的內容為？

var b=1;
function outer() {
    var b=2;
    function inner() {
        b++;
        var b=3;
        console.log(b);
    }
    inner();
}
outer();

85、關於new操作符的描述錯誤的是？

• A、new第一步是創建一個空對象，並且把this指向該對象
• B、new會返回創建的這個對象
• C、new不能夠調用函數
• D、new 可以用來生成一個實例

86、關於post與get的區別描述錯誤的是？

• A、GET會將數據拼接到url地址中，POST會把數據放到請求頭里
• B、GET傳遞的數量要比POST的小
• C、GET可以跨域，POST不能跨域
• D、GET歷史參數保留在瀏覽器歷史中，POST參數不會保存在瀏覽器歷史中

87、有關各邏輯運算符錯誤的結論有？

• A、JS邏輯與運算符‘&&’會在左右兩邊的表達式結果都為真的時候才返回右邊表達式的值
• B、JS邏輯與運算符'&&'不可能出現不會計算右操作數的情形
• C、JS邏輯或運算符‘||’可能出現不會計算右操作數的情形
• D、JS邏輯與運算符‘&&’可能出現不會計算右操作數的情形

88、在下列選項中選出程序的打印輸出結果：

var settings={
    username:'alan',
    level:19,
    health:90
}
var data=JSON.stringify(settings,['level','health']);
console.log(data);

• A、"{"level":19,"health":90}"
• B、"{"username":"alan"}"
• C、"["level","health"]"
• D、"{"username":"alan","level":19,"health":90}"

89、下列打印的輸出結果是？

function Dog(name) {
    this.name=name
}
Dog.prototype.bark=function () {
    console.log(`Woof I am ${this.name}`)
}
const pet=new Dog('Mara');
pet.bark();
delete  Dog.prototype.bark;
pet.bark();

• A、‘Woof I am Mara’ ,TypeError
• B、'Woof I am Mara','Woof I am Mara'
• C、'Woof I am Mara',undefined
• D、TypeError,TypeError

90、選出程序執行的打印結果：

function greeting() {
    throw "Hello world!";
}
function sayHi() {
    try {
        const data=greeting();
        console.log('It worked!',data)
    }catch (e) {
        console.log("Oh no error:",e);
    }
}
sayHi();

• A、"It worked! Hello world!"
• B、"Oh no an error: undefined"
• C、SyntaxError:can only throw Error objects
• D、"Oh no an error:Hello world!"

91、選擇程序的輸出結果：

function getInfo(member,year) {
    member.name='Lydia';
    year='1998'
}
const person={
    name:'Alan'
}
const birthYear='1997';
getInfo(person,birthYear);
console.log(person,birthYear)

• A、{name:'Lydia'},'1997'
• B、{name:'Sarah'},'1998'
• C、{name:'Lydia'},'1998'
• D、{name:'Sarah'},'1997'

92、從下列選項中選出輸出結果：

const newArr=[1,2,3].map(n=>{
    if(typeof n==='number') return;
    return n*2;
})

• A、[]
• B、[null,null,null]
• C、[undefined,undefined,undefined]
• D、[3 x empty]

93、說出下面的打印值：

const firstPromise=new Promise((res,rej)=>{
    setTimeout(res,500,'one')
});
const secondPromise=new Promise((res,rej)=>{
    setTimeout(res,100,'two')
});
Promise.race([firstPromise,secondPromise]).then(res=>{
    console.log(res)
})

• A、one
• B、two
• C、two，one
• D、one,two

94、說出下面的輸出結果：

function sayHi(){
    console.log(name);
    console.log(age);
    var name='Lydia';
    let age=21;
}

• A、Lydia 和undefined
• B、Lydia 和ReferenceError
• C、ReferenceError和21
• D、undefinede和undefined

95、選擇代碼執行后的打印結果：

for(var i=0;i<3;i++){
    setTimeout(()=>{
        console.log(i);
    },1)
}
for(let i=0;i<3;i++){
    setTimeout(()=>{
        console.log(i);
    },1)
}

• A、0，1，2和0，1，2
• B、0，1，2和3，3，3
• C、3，3，3和0，1，2

96、說出函數執行后的調用結果：

const shape={
    radius:10,
    diameter(){
        return this.radius*2
    },
    perimeter:()=>2*Math.PI*this.radius
}
console.log(shape.diameter());
console.log(shape.perimeter());

- A、20and 62.83185307179586
- B、20和NaN
- C、20和63
- D、NaN和63

97、下列選項中哪一個描述是正確的：

const bird={
    size:'small'
}
const mouse={
    name:'Micky',
    small:true
}

• A、mouse.bird.size是無效的
• B、mouse[bird.size]是無效的
• C、mouse[bird['size']]是無效的
• D、以上三個選項都是有效的

98、說出打印值的輸出結果：

async function getData(){
    return await Promise.resolve("I made it!");
}
const data=getData();
console.log(data);

• A、'I made it!'
• B、Promise { :'I made It!'}
• C、Promise{ }
• D、undefined

99、說出下面構造函數的輸出結果：

class Chameleon{
    static colorChange(newColor){
        this.newColor=newColor;
        return this.newColor;
    }
    constructor({newColor='green'}={}){
        this.newColor=newColor;
    }
}
const freddie=new Chameleon({
    newColor:'purple'
})
freddie.colorChange('orange')

• A、orange
• B、purple
• C、green
• D、TypeError

100、說出下面的打印輸出結果：

function Person(firstName,lastName) {
    this.firstName=firstName;
    this.lastName=lastName;
}
const lydia=new Person('Lydia','Hallie');
const sarch=Person('Sarch','Smith');
console.log(lydia);
console.log(sarch);

• A、Pseron {fistName:'Lydia',lastName:'Hallie'} and undefined
• B、Person {firstName:'Lydia',lastName:'Hallie'} and Person {firstName:'Sarah',lastName:'Smith'}
• C、Person {firstName:'Lydia',lastName:'Hallie'} and {}
• D、Person {firstName:'Lydia',lastName:'Hellie'} and ReferenceError

部分題目參考：https://github.com/lydiahallie/javascript-questions/blob/master/zh-CN/README-zh_CN.md

原文鏈接：https://mp.weixin.qq.com/mp/homepage?__biz=MzI2NTQ5NTE4OA==&hid=7&sn=b6e703f14342dd6d416520b30bcb01f5&scene=25&uin=&key=&devicetype=Windows+10+x64&version=63020184&lang=zh_CN&ascene=1&session_us=gh_c36046921bbe&fontgear=1