【Javascript基础】Javascript数据类型及其判断，数据类型及转换，函数参数传递

目录

• 使用typeof 判断数据类型
• 使用instanceof 判断数据类型
• 使用Object.prototype.toString判断数据类型
• Javascript数据类型及其转换
• Javascript函数参数传递

Javascript中具有7种内置数据类型，分别是null, undefined, boolean, number, string, object, symbol(ES6)。
对于类型判断，常用的方法有typeof, instanceof, object.prototype.toString, constuctor。

使用typeof 判断数据类型

typeof 5; // number
typeof 'lucas'; // string
typeof undefined; //undefined
typeof true; //boolean 
typeof NaN; // number

const foo = () => 1;
typeof foo; // function

const foo2 = {};
typeof foo2; // object

const foo3 = [];
typeof foo3; // object

const foo4 = new Date();
typeof foo4; // object

const foo5 = Symbol('foo');
typeof foo5; // symbol

通过以上示例，我们可以知道，使用typeof 可以准备判断出除null以外的基本数据类型，以及function 类型， symbol类型。 null 会被typeof判断为object。

使用instanceof 判断数据类型

a instanceof B判断的是，a 是否为B的实例。

function Person(name) {
    this.name = name;
}

const p = new Person('lucas');

p instanceof Person // true

关于instanceof原理，我们可以用以下代码来模拟。
// L表示左表达式，R表示右表达式

const instanceofMock = (L, R) => {
    if (typeof L !== 'object') {
        return false;
    }
    while (true) {
       if (L === null) {
          return false;
       }

       if (R.prototype === L._proto_) {
           return true;
       }
       L = L._proto_;
    }
}

根据L表示左表达式，R表示右表达式，instanceofMock的用法如下。

instanceofMock('' , String); // false
function Person(name) {
    this.name = name;
}

const p = new Person('lucas'); // true

使用Object.prototype.toString判断数据类型

在判断数据类型时，我们称Object.prototype.toString为"万能方法", "终极方法"。 示例代码如下：

console.log(Object.prototype.toString.call(1)); // [object Number]
console.log(Object.protype.toString.call('lucas')); // [object Sting]
console.log(Object.protype.toString.call(undefined)); // [object Undefined]
console.log(Object.protype.toString.call(true)); // [object Number]
console.log(Object.protype.toString.call({})); // [object Object]
console.log(Object.protype.toString.call([])); // [object Array]
console.log(Object.protype.toString.call(function () {})); // [object Function]
console.log(Object.protype.toString.call(null)); // [object Null]
console.log(Object.protype.toString.call(Symbol)); // [objectSymbol]

Javascript数据类型及其转换

console.log(1 + '1');  // 11
console.log(1 + true);  // 2
console.log(1 + false);  // 1
console.log(1 + undefined);  // NaN
console.log('lucas' + true);  // lucastrue

Javascript函数参数传递

我们知道Javascript中的引用赋值和基本数据类型赋值的区别，并了解由此引出的相关话题：深拷贝和浅拷贝。那么，函数的参数传递有什么讲究呢。

let foo = 1;
const bar = value => {
   value = 2;
   console.log(value);
}
bar(foo);
console.log(foo);

以上代码的两处输出分别为2, 1。也就是说，在bar函数中，当参数为基本数据类型时，函数体内会赋值一份参数值，而不会影响原参数的实际值。

let foo = {bar: 1};
const func = obj => {
   obj.bar = 2;
   console.log(obj.bar);
}
func(foo);
console.log(foo);

上代码的两处输出分别为2, {bar: 2}。也就是说，如果函数参数是一个引用类型，那么当在函数体内修改这个引用类型参数的某个属性值时，也将对原来的参数进行修改，因此此时函数体内的引用地址指向了原来的参数。

但是，如果在函数体内直接修改对参数的引用，则情况又不一样。

let foo = {bar: 1};
const func = obj => {
   obj = 2;
   console.log(obj);
}
bar(foo);
console.log(foo);

以上代码的结果分别为2, {bar: 1}。
i
这里有几条规则：

• 函数参数为基本数据类型时，函数体内复制了一份参数值，任何操作都不会影响原参数的实际值。
• 函数参数是引用类型时，当在函数体内修改这个值的某个属性值时，将会对原来的参数进行修改。
• 函数参数是引用类型时，如果直接修改这个值的引用地址，则相当于在函数体内新创建了一个引用，任何操作都不会影响原参数的实际值。