JS学习笔记

2021-3-19 前端达人

JS学习笔记

js和java的异同点

变量声明

函数声明

js中的变量提升和函数提升

为什么有变量提升

总结

js和java的异同点

首先，js的语法和kottlin的语法有些相似。比如var，方法声明用

function 方法名称 (参数名称...){

//方法内部逻辑

}

还有变量类型声明 :

数据类型 : 变量名=值

区别：一：js的数据类型和java类似。只不过js中的数据类型number将java中的int，double，float整合了。

二：js中可以不用声明变量类型。变量不声明数据类型的话，那么他的类型取决于当前的值是什么数据类型。举例：

var num=0;

num-"lyyyyyyyyyyyyyy";

num=[];

num={};

三：js中的类型判断：

判断基本类型，返回一个字符串

1

console.log(typeof '');//string

console.log(typeof []);//object

console.log(typeof {});//object

console.log(typeof 1);//number

console.log(typeof null);//object

console.log(typeof undefined);//undefined

console.log(typeof true);//boolean

console.log(typeof function(){});//function

console.log(typeof /\d/);//object

检查某个对象属于哪个构造函数，返回true/false

1

function A(){};

function B(){};

let a = new A();

console.log(a instanceof A);

console.log(a instanceof B);

console.log([] instanceof Array);//true

console.log({} instanceof Object);//true

console.log(/\d/ instanceof RegExp);//true

console.log(function(){} instanceof Object);//true

console.log(function(){} instanceof Function);//true

变量声明

js的变量声明其实大体上可以分为三种：var声明、let与const声明和函数声明。

函数声明

doSomething();

function doSomething() {

console.log('doSomething');

}

var foodoSomething= 2;

你觉得上面会输出什么？TypeError吗？其实输出的结果是foo。这就引出了我们的问题了，当函数声明与其他声明一起出现的时候，是以谁为准呢？答案就是，函数声明高于一切，毕竟函数是js的第一公民。

那么，下面的例子呢？

doSomething();

function doSomething() {

console.log('1');

}

function doSomething() {

console.log('2');

}

当出现多个函数声明，那怎么办呢？以上代码输出结果为2。

因为有多个函数声明的时候，是由最后面的函数声明来替代前面的。

domeSomething();

var domeSomething= function() {

console.log('domeSomething');

}

var domeSomething = function() {}这种格式我们叫做函数表达式。

它其实也是分为两部分，一部分是var foo,而一部分是foo = function() {}，参照例2，我们可以知道，这道题的结果应该是报了TypeError(因为foo声明但未赋值，因此foo是undefined)。

js中的变量提升和函数提升

在js中对变量进行操作后打印值经常会出现undefined的现象。其实原因是因为js中有一个叫做变量提升的功能。举例：

1

var data="lyyyyy";

getData();

function getData(){

//第一次打印

console.log("data值为: ", data);

var data="yyyyyyy";

//第二次打印

console.log("data值为: ", data);

}

打印的值第一个为undefined，而第二个打印的值为yyyyy.

原因：

在执行getData()方法的时候会在函数内部首先将变量的声明提升到第一步。

然后再声明函数内部的函数（如果函数内部有函数的话）。

之后才会按照方法内部的逻辑先后顺序执行代码。前两步只是声明！！！

看到这里应该就已经知道为什么会有上面那样的结果了。

实际的方法内部代码执行顺序应该是这样的：

function getData(){

//一。声明变量

var data;

//二。声明函数（如果函数内部有函数的话）

//三。按照代码的顺序执行

console.log("data值为: ", data);

data="yyyyyyy";

//第二次打印

console.log("data值为: ", data);

}

看到拆分后的代码执行顺序对结果也就不迷茫了。

为什么有变量提升

那么为什么会出现变量提升这个现象呢?

其实js和其他语言一样，都要经历编译和执行阶段。而js在编译阶段的时候，会搜集所有的变量声明并且提前声明变量，而其他的语句都不会改变他们的顺序，因此，在编译阶段的时候，第一步就已经执行了，而第二步则是在执行阶段执行到该语句的时候才执行。

总结

1.js会将变量的声明提升到js顶部执行，因此对于这种语句:var a = 2;其实上js会将其分为var a;和a = 2;两部分，并且将var a这一步提升到顶部执行。

2.变量提升的本质其实是由于js引擎在编译的时候，就将所有的变量声明了，因此在执行的时候，所有的变量都已经完成声明。