JS-基础问题不基础

JS基础问题

推荐：《你不知道的Javascript》

1. 引用传递与值传递

js 中什么类型是引用传递, 什么类型是值传递? 如何将值类型的变量以引用的方式传递?

简单点说, 对象是引用传递, 基础类型是值传递, 通过将基础类型包装 (boxing) 可以以引用的方式传递.

仔细查看并理解下面代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function changeStuff(a, b, c)
{
  a = a * 10;
  b.item = "changed";
  c = {item: "changed"};
}
var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};
changeStuff(num, obj1, obj2);
console.log(num);
console.log(obj1.item);    
console.log(obj2.item);

(类推C++)指针与引用的区别（C++语言中，函数的参数和返回值的传递方式有三种：值传递、指针传递和引用传递）：

  • 指针是一个实体，而引用仅是个别名
  • 引用被创建的同时必须被初始化（指针则可以在任何时候被初始化）。
  • 不能有NULL 引用，引用必须与合法的存储单元关联（指针则可以是NULL）。
  • 一旦引用被初始化，就不能改变引用的关系（指针则可以随时改变所指的对象）。
  • “sizeof 引用”得到的是所指向的变量（对象）的大小，而“sizeof指针”得到的是指针本身（所指向的变量或对象的地址）的大小；
  • 引用没有 const，指针有 const，const 的指针不可变；

引用是一种特殊的操作被限定的指针(必须初始化不为空，不用判空，不可重新赋值到其他对象的引用)，指针是一把可以砍树、割草、割断绳子的刀，引用是一把剪绳子的剪刀，引用可以干的事指针也可以，但是引用比较安全，为什么要用引用，其实即“用适当的工具做恰如其分的工作”。指针能够毫无约束地操作内存中的如何东西，尽管指针功能强大，但是非常危险。 如果的确只需要借用一下某个对象的“别名”，那么就用“引用”，而不要用“指针”，以免发生意外。比如说，某人需要一份证明，本来在文件上盖上公章的印子就行了，如果把取公章的钥匙交给他，那么他就获得了不该有的权利。

2. ==和===

  • ==， 两边值类型不同的时候，会先进行类型转换，再比较。
  • ===，不做类型转换，类型不同的一定不等。

下面分别说明：
先说 ===，这个比较简单。下面的规则用来判断两个值是否===相等：
1、如果类型不同，就[不相等]
2、如果两个都是数值，并且是同一个值，那么[相等]；(！例外)的是，如果其中至少一个是NaN，那么[不相等]。（判断一个值是否是NaN，只能用isNaN()来判断）
3、如果两个都是字符串，每个位置的字符都一样，那么[相等]；否则[不相等]。
4、如果两个值都是true，或者都是false，那么[相等]。
5、如果两个值都引用同一个对象或函数，那么[相等]；否则[不相等]。
6、如果两个值都是null，或者都是undefined，那么[相等]。
再说 ==，根据以下规则：
1、如果两个值类型相同，进行 === 比较。
2、如果两个值类型不同，他们可能相等。根据下面规则进行类型转换再比较：
a、如果一个是null、一个是undefined，那么[相等]。
b、如果一个是字符串，一个是数值，把字符串转换成数值再进行比较。
c、如果任一值是 true，把它转换成 1 再比较；如果任一值是 false，把它转换成 0 再比较。
d、如果一个是对象，另一个是数值或字符串，把对象转换成基础类型的值再比较。对象转换成基础类型，利用它的toString或者valueOf方法。 js核心内置类，会尝试valueOf先于toString；例外的是Date，Date利用的是toString转换。非js核心的对象，令说（比较麻 烦，我也不大懂）
e、任何其他组合，都[不相等]。

主要注意区分Nan、undefined、null间的判断。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
1 == '1'        //true
1 === '1'       //false
'123' === '123' //true
1 === 1         //true
[1] == [1]      //false
{} == {}        //false
1 == true       //true
1 === true      //false
2 == true       //false
0 == false      //true
0 === false     //false
var a = [1], b = a;
a === b         //true
null === null           //true
undefined == undefined  //true
undefined == null       //true
undefined === null      //false
undefined == NaN        //false
null == NaN             //false
NaN == NaN              //false ***注意***
NaN === NaN             //false ***注意***
void 0 === undefined    //true
void 0 == NaN           //false

3. 类型判断typeof

你知道下面typeof运算的结果吗？

1
2
3
4
5
6
7
8
9
10
11
12
13
typeof(1);
typeof(NaN);
typeof(Number.MIN_VALUE);
typeof(Infinity);
typeof("123");
typeof(true);
typeof(window);
typeof(document);
typeof(null);
typeof(eval);
typeof(Date);
typeof(sss);
typeof(undefined);

看看你会几个？
我们来试试看看结果：

1
2
3
4
5
6
7
8
9
10
11
12
13
alert(typeof(1));                   // number
alert(typeof(NaN));                 // number
alert(typeof(Number.MIN_VALUE));    // number
alert(typeof(Infinity));            // number  
alert(typeof("123"));               // string
alert(typeof(true));                // boolean
alert(typeof(window));              // object
alert(typeof(document));            // object
alert(typeof(null));                // object
alert(typeof(eval));                // function
alert(typeof(Date));                // function
alert(typeof(sss));                 // undefined
alert(typeof(undefined));           // undefined

如果看了以后，不是很明白的话，请看下面：
typeof是一个一元运算符，它返回的结果 始终是一个字符串，对不同的操作数，它返回不同的结果。
具体的规则如下：

  1. 对于数字类型的操作数而言， typeof 返回的值是 number。比如说：typeof(1)，返回的值就是number。
    上面是举的常规数字，对于非常规的数字类型而言，其结果返回的也是number。比如typeof(NaN)，NaN在
    JavaScript中代表的是特殊非数字值，虽然它本身是一个数字类型。
    在JavaScript中，特殊的数字类型还有几种：
    Infinity 表示无穷大特殊值
    NaN　　　　　　　　　　　　特殊的非数字值
    Number.MAX_VALUE　　　　　可表示的最大数字
    Number.MIN_VALUE　　　　　可表示的最小数字（与零最接近）
    Number.NaN　　　　　 　　　特殊的非数字值
    Number.POSITIVE_INFINITY　表示正无穷大的特殊值
    Number.NEGATIVE_INFINITY 表 示负无穷大的特殊值
    以上特殊类型，在用typeof进行运算进，其结果都将是number。

  2. 对于字符串类型， typeof 返回的值是 string。比如typeof(“123”)返回的值是string。

  3. 对于布尔类型， typeof 返回的值是 boolean 。比如typeof(true)返回的值是boolean。
  4. 对于对象、数组、null 返回的值是 object 。比如typeof(window)，typeof(document)，typeof(null)返回的值都是object。
  5. 对于函数类型，返回的值是 function。比如：typeof(eval)，typeof(Date)返回的值都是function。
  6. 如 果运算数是没有定义的（比如说不存在的变量、函数或者undefined），将返回undefined。比如：typeof(sss)、typeof(undefined)都返回undefined。

4. 作用域

let 和 var 的区别？

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
let me = 'go';  // globally scoped
var i = 'able'; // globally scoped
console.log(window.me); // undefined
console.log(window.i); // 'able'
function allyIlliterate() {
    //tuce is *not* visible out here
    for( let tuce = 0; tuce < 5; tuce++ ) {
        //tuce is only visible in here (and in the for() parentheses)
        //and there is a separate tuce variable for each iteration of the loop
    }
    //tuce is *not* visible out here
}
function byE40() {
    //nish *is* visible out here
    for( var nish = 0; nish < 5; nish++ ) {
        //nish is visible to the whole function
    }
    //nish *is* visible out here
}

var的作用域：

1
2
3
4
5
6
7
8
9
10
11
12
13
var MyLike = 'C#';
YouLike = 'C++';
alert('我喜欢：' + MyLike + " 你喜欢：" + YouLike);
//输出：我喜欢：C# 你喜欢：C++
ChangeLike();
function ChangeLike() {
    alert(MyLike + '是我喜欢 ' + YouLike + '是你喜欢'); //undefined是我喜欢 C++是你喜欢
    var MyLike = 'JS';
    YouLike = 'JAVA';
    alert(MyLike + '是我喜欢 ' + YouLike + '是你喜欢')//JS是我喜欢 JAVA是你喜欢
}
alert(MyLike + '是我喜欢 ' + YouLike + '是你喜欢')//C#是我喜欢 JAVA是你喜欢

相对于let的区别:

  1. 块级作用域if

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    function test(flag) {
        if (flag) {
            var a = 'js'
        } 
        // 这里也可以访问 a
    }
    变量a在if块里声明的，但在else块和if外都可以访问到val, 把var换成let后：
    function test(flag) {
        if (flag) {
            let a = 'js'
        } 
        // 这里也访问不到 a
    }

  2. 块级作用域for

1
2
3
4
5
6
for(var i=0; i<2; i++){
    console.log('outer i: ' + i);
    for(var i=0; i<2; i++){
    console.log('inner i: '+i);
    }
}

执行结果如下：

1
2
3
outer i: 0
test.html:12 inner i: 0
test.html:12 inner i: 1

可以看到，外层循环被打断了，因为ｉ为全局变量所以 i 的值被内层循环修改了， 把内层循环的var换成let后：

1
2
3
4
5
6
for(var i=0; i<2; i++){
    console.log('outer i: ' + i);
    for(let i=0; i<2; i++){
    console.log('inner i: '+i);
    }
}

执行结果如下：

1
2
3
4
5
6
outer i: 0
test.html:12 inner i: 0
test.html:12 inner i: 1
test.html:10 outer i: 1
test.html:12 inner i: 0
test.html:12 inner i: 1
  1. 变量提升
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
//先使用后声明
console.log(a) // undefined
var a;
//变量val先使用后声明，输出undefined，也不报错。把var换成let，就报错了
console.log(a) // Uncaught ReferenceError: a is not defined
let a;
//先判断后声明
if (typeof a == 'undefined') {
    // ...
}
var a = ''
//把var换成let，if处报语法错  Uncaught ReferenceError: a is not defined
if (typeof a == 'undefined') { // Uncaught ReferenceError: a is not defined
    // ...
}
let a = ''

ES6规定，如果代码块中存在let，这个区块从一开始就形成了封闭作用域,凡是在声明之前就使用，就会报错。即在代码块内，在let声明之前使用变量都是不可用的。

  1. 覆盖声明
1
2
3
4
5
6
7
'use strict';
let me = 'foo';
let me = 'bar'; // SyntaxError: Identifier 'me' has already been declared
'use strict';
var me = 'foo';
var me = 'bar'; // No problem, `me` is replaced.

5. 箭头函数 与 function 的区别

  • function: function内this对象指向函数执行者，可使用bind(this)改变函数this指向，或者使用call(this)来调用时改变this指向。
  • 箭头函数: 函数内部的this是词法作用域，由上下文确定。

6. 内存释放

《Node.js 垃圾回收》