前端面试，笔试知识串烧

JS中进制的表示

• 二进制： 0b开头
• 八进制：0开头
• 十六进制：0x开头

JS中的数据类型

JS中的数据类型：
数据类型指的就是字面量的数据类型！

1.字符串string
2.数字number
3.布尔值boolean
4.null
5.undefined
6.object：
	1).内建对象
	 	由ES标准中定义的对象，在任何的ES的实现中都可以使用
		比如：Math，String，Boolean，Number，Object，Function，Function的arguments 对象……
	2).宿主对象
		由JS的运行环境提供的对象，目前来讲主要指由浏览器提供的对象
		比如：BOM（浏览器对象模型），DOM（文档对象模型）
	3).自定义对象
		由开发人员自己创建的对象
7.只要不是基本数据类型，就都是object数据类型

ECMAScript 的 Boolean 值、数字和字符串的原始值是伪对象，具有属性和方法。
ECMAScript 定义所有对象都有 toString() 方法，无论它是伪对象，还是真对象。

String

属性：length
静态方法：fromCharCode()
将字符串“我是一个字符串！”赋值给str变量。

    var str = "我是一个字符串！";
    var words = "我说：'今天天气真好啊！'";
    var words = '我说："今天天气真好啊！"';

注意：
字符串需要通过引号（单引号或者双引号）引起来。
不要混用单引号与双引号
引号不能嵌套：单引号里面不能嵌套单引号，双引号里面不能嵌套双引号！
但是双引号里面嵌套单引号。

在字符串中，我们可以使用\作为转义字符
即是，当你就想要在双引号里面嵌套双引号的时候，可以这么做：

    var str = "我说：\"今天天气真好啊！\""

常用的转义字符：

\":   "
\':   '
\n:   换行
\t:   制表符
\\:   \

Number

属性：
静态方法：
在JS中，所有的数值都是Number类型，包括整数和浮点数。

    var str = "123";
    var num1 = 123;
    var num2 = 1.1
    console.log(typeof (str));  //string
    console.log(typeof (num1));  //number
    console.log(typeof num2);  //number
    console.log(str == num1);   // true
    console.log(str === num1);  //false

通过输出可以看到，str与num1是不同的数据类型，但使用==的时候却返回true
===则返回了false
回答：
==涉及到了类型转换，后面会详细介绍

Number中的某些特殊数字

• Number.MAX_VALUE
• Number.MIN_VALUE

    console.log(Number.MAX_VALUE);// 1.7976931348623157e+308
    console.log(Number.MIN_VALUE);  //5e-324

如果使用Number表示的数字超过了JS的最大值，会返回Infinity

• Infinity：正无穷，是一个字面量
• -Infinity：负无穷
  使用 typeof 返回 number
• NaN
  NaN 也是一个数字，表示Not a Number，也是个字面量
  NaN不等于他本身

    var a = "abc" * 10;
    console.log("a",a);  //a NaN
    console.log(typeof a);  //number

说到了数字，就离不开运算，来看看JS中Number的运算吧！

• 整数之间的运算基本不会出错
• 浮点数运算可能得到一个不精确的结果，所以不要用JS来进行对精确度要求比较高的运算
  所有的语言都有这个问题，原因就是二进制没办法完全正确的表示一些浮点数（有些语言自己会有一套解决方案，但JS没有）。

Boolean

布尔值只有两个值，主要用来做逻辑判断
true：真
false：假

    var bool = true;
    var str = "true";
    console.log(typeof bool);  //boolean
    console.log(bool == str);  //false
    console.log(bool === str);  //false

需要注意的是，这里使用==返回了false

Null

Null类型的值就只有一个——null
null常用于表示一个为空的对象

    console.log(typeof  null);  //object

Undefined

Undefined的值只有一个——undefined
表示未定义的。
undefined 实际上是从值 null 派生来 undefined == null 返回true

    var a;
    console.log(a);  //undefined
    console.log(typeof a); //undefined

Object

属性：
静态方法：assign()，create()

assgin()是浅度拷贝，create()是深度拷贝

Object.assign(target, …sources)

var obj1 = {a :1, b: {value: 2}, c: 3};
var obj2 = Object.assign(obj1, {c: 0});
obj2.b.value = 0;
console.log(obj2.c); //0
console.log(obj1.b.value); //0
console.log(obj1 === obj2);  //true

Object.create(prototype,[proptertiesObject])

var obj1 = {a :1, b: {value: 2}, c: 3};
var obj2 = Object.create(obj1);
obj2.b.value = 1;
console.log(obj2); // {}
console.log(obj2.c);  // 3
console.log(obj1); 
console.log(obj1 === obj2);  //false

JS中类型转换

强制转换

强制类型转换包括字符串拼接，==运算符，if语句，逻辑运算

隐式转换

何时使用 == ，何时使用 ===

例题

何时使用== ，何时使用===

JS中有哪些内置函数

JS变量按照存储方式区分为哪些类型，并描述其特点

如何理解JSON

作用域

作用域Scope：指的是变量和函数的作用范围。它是一套规则，用来管理引擎如何在当前作用域以及嵌套子作用域中根据标识符（指的是变量名和函数名）进行变量查找。

作用域链ScopeChain：当前环境与上层环境的一系列变量对象组成。

执行上下文：当前代码的执行环境。JS通过函数调用栈callstack来处理他们。

• 全局
• 函数

// 作用域
var num1 = 55;
var num2 = 65;
function f1 (num , num1){
  num = 100;
  num1 = 100;
  num2 = 100;
  console.log(num, num1, num2); //100 100 100
}
console.log(num1, num2); // 55 65
//console.log(num); //报错  Uncaught ReferenceError: num is not defined
f1(num1, num2);
console.log(num1, num2); //55 100
//console.log(num);//报错 Uncaught ReferenceError: num is not defined

执行顺序如下：

全局作用域入栈-------function声明函数---------var 声明 变量-----从上往下执行代码-------- f1(num1，num2)调用函数，函数作用域进栈--------将全局变量num1 ,num2的值55和 65 赋给自己的局部变量 num, num1--------num = 100 、num1 = 100修改值 --------- 函数自己的作用域里边没有num2变量，便会随着作用域链查找上一级作用域中是否有num2变量，将 num2的值 由 65 改为了100-------函数作用域出栈--------执行其他代码--------全局作用域出栈

function f1(num, num1){……}
var num1;
var num2;
num1 = 55;
num2 = 65;
console.log(num1, num2);
f1(num1,num2);
// 函数作用域进栈
    var num;
    var num1;
    num = 55;
    num1 = 65;
    num = 100;
    num1 = 100;
    num2 = 100;// 访问的是全局作用域中的num2
    console.log(num, num1, num2)
// 函数作用域出栈
console.log(num1, num2); 

值类型，引用类型的传递

JS中，函数的参数永远都是按值传递，对于普通数据类型，没什么坑。
对于引用数据类型，变量值为地址，故而，传过去的值为地址。

//值类型和引用类型的传递
function Person(name, age, salary){
  this.name = name;
  this.age = age;
  this.salary = salary;
}
function f1(person){
  person.name = "ls";
  person = new Person("aa", 18, 10);
}

var p = new Person("zs", 18, 10);
console.log(p.name);//zs
f1(p);
console.log(p.name);//ls

封装函数进行字符串驼峰命名的转换

已知有字符串foo=“get-element-by-id”，写一个function将其转化成驼峰表示法”getElementById”

var str = "get-element-by-id";
console.log(changStr(str));
function changStr (str){
  if(!str){
    return;
  }
  var arr = str.split("-");
  var newStr = '';
  for(var i = 0; i < arr.length; i++){
    if(i == 0){
      newStr = arr[i];
    } else {
      var wordsArr = arr[i].split("");
      firstWord = wordsArr.slice(0,1).join("").toUpperCase();
      otherWords = wordsArr.slice(1);
      newStr += [].concat(firstWord,otherWords).join("");
    }
  }
  return newStr;
}

上面这种获取首字母的方式是用数组的方法实现的，如果不能使用数组的方法又该怎么做呢？

var str = "get-element-by-id";
console.log(changStr(str));
function changStr (str){
  if(!str){
    return;
  }
  var arr = str.split("-");
  var len = arr.length;
  for(var i = 0; i < len; i++){
    if(i == 0){
    } else {
      // stringObject.substr ( start, [length] )
      // stringObject.substring( start, [stop] ) [start, stop)
      // arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].substr(1);
     arr[i]= arr[i].charAt(0).toUpperCase() + arr[i].substring(1, arr[i].length);
    }
  }
  return arr.join("");
}

排序算法

冒泡排序

window.onload 和DOMContentLoaded的区别

考点：浏览器的渲染过程

用JS创建 10 个 <a>标签，点击的时候弹出来对应的序号

考点：作用域

简述如何实现一个模块加载器，实现类似require.js的基本功能

考点：JS模块化

实现数组的随机排序

考点：JS的基础算法
针对数组，针对对象，JS都有很多的算法需要我们去掌握
要熟记数组，对象的一些特殊的api和算法，以便很快的融入团队的开发

webpack

安装webpack

先要保证已经安装好了 node.js 和 npm
npm是Node.js的包管理工具（package manager）,在安装node的时候也会顺带安装好。

• node -v
• npm -v
• 新建一个文件夹(webpack)，在里面初始化项目
  • npm init
    初始化成功后，会出现webpack.json文件
• 安装依赖
  • npm install webpack --save -dev
  • npm install jquery --save
  • -dev 命令表示此依赖包只用于开发环境，不用于运行环境
• 卸载安装的依赖
  • npm uninstall jquery --save

配置webpack

• 在webpack里面新建一个文件，名叫webpack.config.js

这个配置文件，其实就是一个 JS 文件，通过Node中的模块操作，向外暴露一个打包的配置对象
因为 webpack 是基于Node构建的；所以 webpack 支持所有Node API 和语法
哪些 特性是 Node 支持呢？Node是基于Chrome V8引擎实现的JavaScript运行环境，如果 chrome 浏览器支持哪些，则 Node 就支持哪些。

const path = require("path");

const webpack = require("webpack");


module.exports = {
  entry: path.join(__dirname, "./src/main.js"),//入口，表示要使用 webpack 打包哪个文件
  output: {//输出文件的相关配置
    path: path.join(__dirname, "./dist"),//指定打包好的文件，输出到哪个文件夹下面去 
    filename: "bundle.js"//指定输出文件 的对应名称
  },
  devServer:{
    //配置dev-server命令参数
    //--open --port 3000 --contentBase src --hot
    open: true,//自动打开浏览器
    port:3000,//设置启动时候的运行端口
    contentBase: "src",//指定托管的根目录
  },
}
// 以下的写法不行，这是ES6中向外导出模块的API，与之对应的是import ** from '标识符'
// export default {}