这些前端基础题你能答对几道？(测试你的基础掌握,附答案解析 [下] )

第 21 题

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

解析：

// 输出

'false'
'1,2,3'
Uncaught SyntaxError: Invalid or unexpected token
'5'

当执行1.toString();时,由于1.也是有效数字,因此此时变成(1.)toString()。没有用.调用toString方法,因此抛出错误。
正确的应该是:

1..toString();
1 .toString();
(1).toString();

第 22 题

console.log(typeof NaN === 'number');

解析：

//输出

true

NaN为不是数字的数字。虽然它不是数字,但是它也是数字类型。

第 23 题

console.log(1 + "2" + "2");

console.log(1 + +"2" + "2");

console.log(1 + -"1" + "2");

console.log(+"1" + "1" + "2"); 

console.log( "A" - "B" + "2"); 

console.log( "A" - "B" + 2); 

解析：

//输出
'122'
'32'
'02'
'112'
'NaN2'
NaN

首先要明白两点:
+a,会把a转换为数字。-a会把a转换成数字的负值(如果能转换为数字的话,否则为NaN)。
字符串与任何值相加都是字符串拼接。
console.log(1 + “2” + “2”);简单的字符串拼接,即结果为:‘122’。
console.log(1 + +“2” + “2”);这里相当于console.log(1 + 2 + “2”);,然后再字符串拼接。即结果为:‘32’。
console.log(1 + -“1” + “2”);这里相当于console.log(1 + -1 + “2”);,然后再字符串拼接。即结果为:‘02’。
console.log(+“1” + “1” + “2”);这里相当于console.log(1 + “1” + “2”);,然后再字符串拼接。即结果为:‘112’。
console.log( “A” - “B” + “2”);,由于’A’ - ‘B’ = NaN,所以相当于console.log( NaN + “2”);, 然后再字符串拼接。即结果为:‘NaN2’。
console.log( “A” - “B” + 2);同上,相当于console.log(NaN + 2),由于NaN+任何值还是NaN,即结果为:NaN。

第 24 题

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

解析：

// 输出

667
667
668

++a先执行+1操作,再执行取值操作。 此时a的值为667。因此输出667。
a++先执行取值操作,再执行+1。 此时输出667,随后a的值变为668。
–a和a–同理。
使用这类运算符时要注意:
1）这里的++、–不能用作于常量。比如

  1++; // 抛出错误

2）如果a不是数字类型,会首先通过Number(a),将a转换为数字。再执行++等运算。

第 25 题

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

解析：

// 输出
'function'
'function'

跟第4题类似。函数会优先于变量声明提前。因此会忽略var a。

第 26 题

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

解析：

// 输出
'undefined'
'string'
'undefined'

a为声明未赋值,默认为undefined,b的值为字符串’undefined’,c为未定义。
typeof一个未定义的变量时,不会抛出错误,会返回’undefined’。注意typeof返回的都是字符串类型。

第 27 题

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

解析：

//输出
1undefined

function f(){}当做if条件判断,其隐式转换后为true。但是在()中的函数不会声明提升,因此f函数在外部是不存在的。因此typeof f = ‘undefined’,所以x += typeof f,相当于x = x + ‘undefined’为’1undefined’

第 28 题

var str = "123abc";
console.log(typeof str++);

解析：

// 输出
'number'

在24题解析时提到,使用++运算符时(无论是前置还是后置),如果变量不是数字类型,会首先用Number()转换为数字。因此typeof str++相当于typeof Number(str)++。由于后置的++是先取值后计算,因此相当于typeof Number(“123abc”)。即typeof NaN,所以输出’number’。

第 29 题

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

解析：

// 输出

baNaNa

‘b’ + ‘a’ + +‘a’+‘a’相当于’ba’ + +‘a’+‘a’,+‘a’会将’a’转换为数字类型,即+‘a’ = NaN。所以最终得到’ba’ + NaN +‘a’,通过字符串拼接,结果为:baNaNa

第 30 题

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

解析：

// 输出

2

函数传递参数时,如果是基本类型为值传递,如果是引用类型,为引用地址的值传递。其实都是值传递。因此形参a和obj引用地址相同,都指向同一个对象。当执行a.n,实际上共同指向的对象修改了,添加了个n属性,因此obj.n为2。

第 31 题

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

解析：

// 输出

10

JavaScript采用的是词法作用域,它规定了函数内访问变量时,查找变量是从函数声明的位置向外层作用域中查找,而不是从调用函数的位置开始向上查找。因此fn函数内部访问的x是全局作用域中的x,而不是show函数作用域中的x。

第 32 题

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'));

解析：

//输出

1
true
false
true

in操作符:检测指定对象(右边)原型链上是否有对应的属性值。
hasOwnProperty方法:检测指定对象自身上是否有对应的属性值。两者的区别在于in会查找原型链,而hasOwnProperty不会。
示例中对象foo自身上存在goo属性,而它的原型链上存在bar属性。
通过这个例子要注意如果要判断foo上是否有属性goo,不能简单的通过if(foo.goo){}判断,因为goo的值可能为undefined或者其他可能隐式转换为false的值。

第 33 题

Object.prototype.bar = 1;

var foo = {
    moo: 2
};
for(var i in foo) {
    console.log(i); 
}

解析：

// 输出

'moo'
'bar'

for…in…遍历对象上除了Symbol以外的可枚举属性,包括原型链上的属性。

第 34 题

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

解析：

// 输出

{ bar: "hello" }

undefined

两个函数唯一区别就是return后面跟的值,一个换行一个不换行。

当我们书写代码时忘记在结尾书写;时,JavaScript解析器会根据一定规则自动补上;。

return
{
    bar: "hello"
}
=> 会被解析成
return;
{
    bar: "hello"
};

因此函数执行后会返回undefined。

第 35 题

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

解析：

// 输出

'object'

arguments为类数组,类型为object。因此typeof arguments = ‘object’。

第 36 题

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

解析：

//输出

false
true
false
fasle

只有下面几种值在转换为布尔值时为false:

+0,-0,NaN,false,'',null,undefined。

除此之外的值在转换为布尔值的时候全部为true。

第 37 题

console.log(Array(3));

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

解析：

// 输出

[empty × 3] 

[2,3]

使用Array()创建数组时,要注意传入的值的类型和数量。

第 38 题

console.log(0.1 + 0.2 == 0.3)；

解析：

// 输出

false

第 39 题

var a=[1, 2, 3];
console.log(a.join());

解析：

//输出

1,2,3

join方法如果省略参数,默认以,分隔。

第 40 题

var a = [3];
var b = [1];
console.log(a - b); 

解析：

// 输出
2

在执行a - b时,a和b都要转换为数字。首先a先转换为字符串,[3] => [3].toString() => ‘3’,然后Number(3) => 3。b同理。因此转换之后为3 - 1 = 2。

最后
如果文中有错误，请务必留言指正，感谢你哦，喜欢就点个赞哦！
让我们共同学习，共同进步。