字节跳动最爱考的前端面试题|JavaScript 基础到底是什么？

点击蓝字 关注我们

字节跳动最爱考的前端面试题：JavaScript 基础到底是什么？我们从 JavaScript 的定义说起。

JavaScript 简称“JS” ，它是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

JavaScript 最开始是专门为浏览器设计的一门语言，但是现在也被用于很多其他的环境，也已经成为了与 HTML/CSS 完全集成的，使用最广泛的浏览器语言。

那今天，我们来探探 JavaScript 的秘密吧！（文末有福利哦~）

01

JavaStript 的介绍

JavaScript 由 ECMAScript、DOM、BOM 三部分组成：

• ECMAScript：JavaScript 的语法标准；

• DOM：JavaScript 操作网页上的元素的 API；

• BOM：JavaScript 操作浏览器的部分功能的 API。

JavaDcript 又有哪些特点呢？这里，我举了 3 个特点，如有其他特点，欢迎在留言区补充：

1）可以使用任何文本编辑工具编写，然后使用浏览器就可以执行程序；

2）是一种解释型脚本语言：代码不进行预编译，从上往下逐行执行，不需要进行严格的变量声明；

3）主要用来向 HTML 页面添加交互行为。

除此之外，我们还要看看 JavaScript 的基础语法。它的基础语法几乎所有的语言差异不大，无非数据类型、操作符、控制语句、函数等。

这里呢，我简要的举了几个基础语法。

变量是什么

在计算机中，数据都存在内存中。而一个变量，就是一个用于存放数值的容器，每个变量存放的数值是可变的，每个变量都有其独有的名字，每个变量都占有一段内存。

注：变量不是数值本身，变量仅仅是一个用于储存数值的容器。

声明变量

通过 var 关键字来声明变量，比如：

var name = "实验楼";

上述代码声明了一个名为 name 的变量，并赋值为“实验楼”。注意此处的等于符号（=）为赋值符号，不是我们传统意义上理解的等号。

变量的命名规则如下：

• 变量名必须以字母、下划线 “_”、美元符号 “$” 开头，不能以数字开头；

• 变量可以包含字母、数字、下划线和美元符号；

• 不能使用 JavaScript 中的关键字做为变量名；

• 变量名不能有空格；

• 变量名对大小写敏感，比如：name 和 Name 就是两个完全不同的变量。

另外在 JavaScript 中，变量也可以不作声明，而在使用时再根据数据的类型来确其变量的类型，如：

x = 50; // 变量 x 为整数

变量类型

• Number：你可以在变量中存储数字，不论这些数字是 10（整数），或者是 3.1415926（浮点数）。

var x1 = 10;var x2 = 3.1415926;

• String：存储字符（比如 "shiyanlou"）的变量，字符串可以是引号中的任意文本，你可以使用单引号或双引号，也可以在字符串中使用引号，只要不匹配包围字符串的引号即可：

var carname = "shiyanlou";var carname = "shiyanlou";var answer = "I Love 'shiyanlou'";var answer = 'I Love "shiyanlou"';

• Boolean：布尔类型的值有两种：true 和 false。通常被用于在适当的代码之后，测试条件是否成立，后续会讲到。

• Array：数组是一个单个对象，其中包含很多值，方括号括起来，并用逗号分隔。后续我们将会对数值进行详细的讲解，此处看两个简单的数值例子：

var myNameArray = ["Tom", "Bob", "Jim"];var myNumberArray = [10, 15, 20];

• Object：对象类型。同样的我们会在后续的课程中详细讲解什么是对象，此处先看一个简单的例子：

var student = { name: "Tom", age: 18 };

动态类型

JavaScript 是一种“动态类型语言”，这意味着不同于其他一些语言（如 C、Java），你不需要指定变量将包含什么数据类型（例如 number 或 string），全部用 var 关键字声明就是了。

比如如果你声明一个变量并给它一个带引号的值，浏览器就会知道它是一个字符串：

var myString = "Hello";

值得注意的就是引号中如果是一个数字，它依然是 string 类型的。

我们可以在控制台中通过 typeof 函数，来查看我们声明的变量是什么类型的。

注释

单行注释：用来描述下面一个或多行代码的作用。单行注释快捷键：Ctrl + /。

// 这是一个变量var name = "zhangsan";

多行注释：用来注释多条代码。多行注释快捷键：Ctrl + Shift + /。

/*
var name = "zhangsan";
var age = 18;
console.log(name, age);
*/

数字类型

• 整数。例如：1, 2, 100, -10。

• 浮点数：就是小数。例如：0.2, 3.1415926。

• 双精度：是一种特定类型的浮点数，它们具有比标准浮点数更高的精度。

算数运算符

操作运算符

比较运算符

逻辑运算符

运算符的优先级

以上内容均出自蓝桥云课《JavaScript 基础入门》，如想学习此门课程，欢迎扫码免费学哦~

02

JavaScript 关键特性

生活中，条件与我们息息相关。

举几个例子：如果这周放假，那么我就要出去玩；如果明天不下雨，我就和小花出去踢足球；如果我饿了，我要么吃饭，要么吃面，要么就忍着。

同样的，在 JavaScript 中，我们也有条件语句，下面为大家讲解在 JavaScript 中如何使用条件语句。

if...else 语句

1.最基本的 if...else 语句

它的语法为：

if (条件) {  // 当条件为 true 时执行的语句} else {  // 当条件为 false 时执行的语句}

例子：

if (3 > 2) {  console.log("我真帅");
} else {  console.log("不可能");
}

上述例子在控制台中打印的语句为：我真帅。

2.if...else 嵌套

它的语法是：

if(条件 1){    // 当条件 1 为 true 时执行的代码
    }else if(条件 2){    // 当条件 2 为 true 时执行的代码
    }else{    // 当条件 1 和 条件 2 都不为 true 时执行的代码
    }

注：根据实际情况，还可以嵌套更多的 else if。

例子：

var d = new Date().getDay();if (d == 0) {  console.log("今天星期天");
} else if (d == 1) {  console.log("今天星期一");
} else if (d == 2) {  console.log("今天星期二");
} else {  console.log("好多啊，我不想写了");
}

switch case 语句

从前面的例子中我们可以看出来，当条件很多的时候，一直嵌套 else if 语句，显然是有点不科学的。

由此我们引出了 switch case 语句，先来看看它的语法：

switch(k){    case 1:
        执行代码块 1 ;        break;    case 2:
        执行代码块 2 ;        break;    default:
        默认执行（k 值没有在 case 中找到匹配时）;
}

通过 switch case 语句来改写上面的例子：

var d = new Date().getDay();switch (d) {  case 0:    console.log("今天星期天");    break;  case 1:    console.log("今天星期一");    break;  case 2:    console.log("今天星期二");    break;  case 3:    console.log("今天星期三");    break;  case 4:    console.log("今天星期四");    break;  case 5:    console.log("今天星期五");    break;  default:    console.log("今天星期六");    break;
}

三元运算符

语法：

条件表达式？结果 1:结果 2

含义：问号前面的位置是判断的条件，判断结果为 boolean 型，为 true 时执行结果 1，为 false 时执行结果 2。

例子:

3 > 2 ? console.log("3 比 2 大") : console.log("3 比 2 小");

通过循环函数来帮助我们完成一些重复性的工作。

for 循环

for 循环是我们编码中经常会使用到的。

先来看看它的语法结构：

for (初始化; 条件; 增量) {
  循环代码;
}

举个打印 1 到 100 的例子：

for (var i = 1; i <= 100; i++) {  console.log(i);
}

使用 break 跳出循环

我们在前面的 switch case 结构中已经见过 break 语句了。

当 switch 语句中符合输入表达式的情况满足时，break 语句立即退出 switch 语句并移动到之后的代码。

上述的 for 循环例子，我们来加个条件，使其能打印一个能被 7 整除的整数。

for (var i = 1; i <= 100; i++) {  if (i % 7 == 0) {    console.log(i);    break;
  }
}

使用 continue 跳过迭代

使用 continue 跳过迭代，不是完全跳出循环，而是跳过当前循环而执行下一个循环。

比如我们使用 continue 可以实现打印 1 到 100 所有能被 7 整除的整数，而前面的例子中只能打印出：7。

for (var i = 1; i <= 100; i++) {  if (i % 7 == 0) {    console.log(i);    continue;
  }
}

这么写可能不好理解，大家或许会想到上面的例子不写 continue 最后打印的效果和写了是一样的啊，那 continue 是不是就没用了？

其实 continue 主要是跳过当前循环去执行下一个循环也就是说，当前循环下的其他语句就不执行了。

来看下面的例子：

for (var i = 1; i <= 7; i++) {  if (i % 7 == 0) {    console.log(i);    continue;    console.log("*");
  }
}

大家可以把上面的代码运行一下，然后把 continue 删除，再运行一下，细细体会一下 continue 语句的作用。

while 语句 和 do while 语句

在 JavaScript 中不止有 for 循环，还有其他的循环语句。

我们先来看看 while 循环的语法结构：

while (条件) {  // 需要执行的代码;}

同样的，我们来写一个打印 1 到 100 之间整数的例子：

var i = 1;while (i <= 100) {  console.log(i);
  i++;
}

do while 循环的语法结构：

do {  // 需要执行的代码;} while (条件);

例子：

var i = 1;do {  console.log(i);
  i++;
} while (i <= 100);

注：而这两者的区别是，do while 循环在检测条件之前就会执行。也就是说，即使条件为 false，do while 也会执行一次循环代码。

而 while 循环只有在条件为真的时候才执行，可以这样简单记忆：while 循环，先判断再执行；do while 循环先执行一次再判断。

因内容有限，今天的分享就到这里啦！如果想学习 JavaScript 基础，欢迎扫码免费学哦~

▼扫码领取免费学▼