javaScript基础

99 阅读5分钟

基本类型和引用类型

基本数据类型:number、string、boolean、null、undefined

引用数据类型:function、obkect、Array

null和undefined的区别

**undefined:**表示变量声明但未初始化时的值

**null:**表示准备用来保存对象,还没有真正保存对象的值。从逻辑角度来看,null值表示一个空对象指针

JavaScript(ECMAScript标准)里共有5种基本类型:Undefined, Null, Boolean, Number,String,和一种复杂类型 Object。可以看到 null 和 undefined 分属不同的类型,未初始化定义的值用 typeof 检测出来是"undefined"(字符串),而 null 值用 typeof 检测出来是"object"(字符串)。任何时候都不建议显式的设置一个变量为 undefined,但是如果保存对象的变量还没有真正保存对象,应该设置成 null。实际上,undefined 值是派生自 null值的,ECMAScript 标准规定对二者进行相等性测试要返回 true

如何判断javaScript的数据类型

javaScript的数据类型一共有7种:

Undefined、Null、Boolean、String、Symbol、Number、Object

除了object之外的6种属于原始数据类型,有时,我们还回细分object的类型,比如Arrayfunction,date,regexp等等……

判断方法

typeOf

typeOf可以用来区分除了null类型之外的原始数据类型,对象类型的可以从普通对象里识别出函数:

typeof undefined // "undefined"
typeof null // "object"
typeof 1 // "number"
typeof "1" // "string"
typeof Symbol() // "symbol"
typeof function() {} // "function"
typeof {} // "object"

第一个问题:typeOf不能识别null,那么该如何识别null?

如果想要判断是否为null,可以直接使用===全等运算符来判断(或者使用下面的Object。prototype。toString方法):

let a = null
a === null // true

第二个问题:typeof 作用于未定义的变量,会报错吗?

不会报错,返回"undefined"。 ``

typeof randomVariable // "undefined"

第三个问题:typeof Number(1)的返回值是什么?

"number"。注意 Number 和 String 作为普通函数调用的时候,是把参数转化为相应的原始数据类型,也就是类似于做一个强制类型转换的操作,而不是默认当做构造函数调用。注意和 Array 区分,Array(...)等价于 new Array(...)

typeof Number(1) // "number"
typeof String("1") // "string"
Array(1, 2, 3)
// 等价于
new Array(1, 2, 3)

第四个问题:typeof new Number(1)的返回值是什么?

object

typeof new Number(1) // "object"
typeof new String(1) // "object

instanceof

instanceof 不能用于判断原始数据类型的数据:

3 instanceof Number // false
'3' instanceof String // false
true instanceof Boolean // false

instanceof 可以用来判断对象的类型:

var date = new Date()
date instanceof Date // true
var number = new Number()
number instanceof Number // true
var string = new String()
string instanceof String // true

需要注意的是,instanceof 的结果并不一定是可靠的,因为在 ECMAScript7 规范中可以通过自定义 Symbol.hasInstance 方法来覆盖默认行为。Object.prototype.toString

Object.prototype.toString.call(undefined).slice(8, -1) // "Undefined"
Object.prototype.toString.call(null).slice(8, -1) // "Null"
Object.prototype.toString.call(3).slice(8, -1) // "Number"
Object.prototype.toString.call(new Number(3)).slice(8, -1) // "Number"
Object.prototype.toString.call(true).slice(8, -1) // "Boolean"
Object.prototype.toString.call('3').slice(8, -1) // "String"
Object.prototype.toString.call(Symbol()).slice(8, -1) // "Symbol"

由上面的示例可知,该方法没有办法区分数字类型和数字对象类型,同理还有字符串类型和字符串对象类型、布尔类型和布尔对象类型另外,ECMAScript7 规范定义了符号 Symbol.toStringTag,你可以通过这个符号自定义Object.prototype.toString 方法的行为:

var number = new Number(3);
  number[Symbol.toStringTag] = "Custom";
  Object.prototype.toString.call(number).slice(8, -1); // "Custom"
  function a() {}
  a[Symbol.toStringTag] = "Custom";
  Object.prototype.toString.call(a).slice(8, -1); // "Custom"
  var array = [];
  array[Symbol.toStringTag] = "Custom";
  Object.prototype.toString.call(array).slice(8, -1); // "Custom"
  console.log(number, a, array);

因为 Object.prototype.toString 方法可以通过 Symbol.toStringTag 属性来覆盖默认行为,所以使用这个方法来判断数据类型也不一定是可靠的

Array.isArray

Array.isArray(value)可以用来判断 value 是否是数组:

Array.isArray([]) // true
Array.isArray({}) // false
(function () {console.log(Array.isArray(arguments))}()) // false

简述创建函数的几种方式?

第一种:

function sum1(num1,num2){
    return num1+num2;
}

第二种:

var sum2 = function(num1,num2){
    return num1+num2;
}

第三种:

var sum3 = new Function("num1","num2","return num1+num2");

Javascript 创建对象的几种方式

1、简单对象的创建 使用对象字面量的方式{}创建一个对象(最简单,好理解,推荐使用)代码如下

var Cat = {}; //JSON
  Cat.name = "kity"; //添加属性并赋值
  Cat.age = 2;
  Cat.sayHello = function () {
    alert("hello " + Cat.name + ",今年" + Cat["age"] + "岁了"); //可以使用“.”的方式访问属性,也可以使用 HashMap 的方式访问
  };
  Cat.sayHello(); //调用对象的(方法)函数

9.16.png 2、用 function(函数)来模拟 class2.1) 创建一个对象,相当于 new 一个类的实例(无参构造函数)代码如下

 function Person() {}
  var personOne = new Person(); //定义一个 function,如果有 new 关键字去"实例化",那 么该 function 可以看作是一个类
  personOne.name = "dylan";
  personOne.hobby = "coding";
  personOne.work = function () {
    alert(personOne.name + " is coding now...");
  };
  personOne.work();

9.19.png 2.2)可以使用有参构造函数来实现,这样定义更方便,扩展性更强(推荐使用)代码如下

function Pet(name, age, hobby) {
    this.name = name; //this 作用域:当前对象
    this.age = age;
    this.hobby = hobby;
    this.eat = function () {
      alert("我叫" + this.name + ",我喜欢" + this.hobby + ",也是个吃货");
    };
  }
  var maidou = new Pet("麦兜", 5, "睡觉"); //实例化/创建对象
  maidou.eat(); //调用 eat 方法(函数)

9.21.png 3、使用工厂方式来创建(Object 关键字)代码如下:

var wcDog = new Object();
  wcDog.name = "旺财";
  wcDog.age = 3;
  wcDog.work = function () {
    alert("我是" + wcDog.name + ",汪汪汪......");
  };
  wcDog.work();

9.23.png 4、使用原型对象的方式 prototype 关键字代码如下:

function Dog() {}
  Dog.prototype.name = "旺财";
  Dog.prototype.eat = function () {
    alert(this.name + "是个吃货");
  };
  var wangcai = new Dog();
  wangcai.eat();

9.25.png 5、混合模式(原型和构造函数)代码如下:

function Car(name, price) {
    this.name = name;
    this.price = price;
  }
  Car.prototype.sell = function () {
    alert("我是" + this.name + ",我现在卖" + this.price + "万元");
  };
  var camry = new Car("凯美瑞", 27);
  camry.sell();

9.28.png 6、动态原型的方式(可以看作是混合模式的一种特例)代码如下:

function Car(name, price) {
    this.name = name;
    this.price = price;
    if (typeof Car.sell == "undefined") {
      Car.prototype.sell = function () {
        alert("我是" + this.name + ",我现在卖" + this.price + "万元");
      };
      Car.sell = true;
    }
  }
  var camry = new Car("凯美瑞", 27);
  camry.sell();

9.27.png 以上几种,是 javascript 中最常用的创建对象的方式

总结

这就是JavaScript的基础的一部分,在不会的时候也可以来看一下这个哦,也许会有一点帮助呢?