自己整理的一些关于JavaScript原生的面试题

1. 强制类型转换

- 字符转数值
    - parseInt()
    - parsenFloat()
    - Math.round()
    - Number()
- 数值转字符
    - toString()
    - toFixed()
    - String()
- 其他转布尔
    - boolean()

2. 循环三要素

- 执行条件
- 初始化计数器，用来记录循环次数
- 计数器的改变

3. 循环语句

- `while`
- `do-while`
- `for`

4. 控制循环的关键字

- break:停止
- continue: 跳过本次执行

5. 函数的特点

- 忽略细节
- 重复使用
- 选择使用

6. 函数的创建

- 声明式 `function fn(){}`
- 赋值式 `var fn = function (){}`

7. 函数的分类

- 有名函数：function fn(){}
- 无名函数：function (){}
- 匿名函数：(function(){})()
- 箭头函数：

8.argunments

- 函数内部用来保存当前函数执行时传入的所有实参

9. 作用域的概念

- 数据作用的区域，数据生效的区域

10. 作用域的访问规则

- 子可以那父
- 父不能拿子

11.事件分类

1. 鼠标类
    - 左键单击：click
    - 左键双击：dblclick
    - 右键单击：contextmenu
    - 进入：mouseover / mouseenter
    - 离开：mouseout / mouseleave
    - 移动：mousemove
    - 按下：mousedown
    - 抬起：mouseup
2. 键盘类
    - 抬起：keyup
    - 按下：keydown
    - 按下并抬起：keypress

3. 表单类
    - 失去焦点：blur
    - 获取焦点：focus
    - 输入：input
    - 内容改变：change
    - 提交：submit
    - 重置：reset

4. 浏览器类
    - 加载：load
    - 改变大小：resize
    - 滚动：scroll

12. 递归

- 在函数内部，执行自己
- 死循环

13. 栈和堆的关系

- 一对一，多对一，不能一对多

14. 值传递和引用传递

- 值传递：复制的就是值
- 引用传递：复制的是地址，不是值

15.浅拷贝和深拷贝

- 浅拷贝：只能复制复杂数据的地址，不能复制值，会修改新数据，影响老数据
- 深拷贝：复制值，修改新数据，不影响老数据

16. 数组的方法

- push:最后新增
- unshift:开始新增
- pop:最后删除
- shift:开始删除
- slice:截取
- splice:删除并替换
- join:转字符
- concat:合并
- reverse:反转
- sort:排序

17.ES5新增严格模式

1. 开启严格模式：`use strict`

2. 严格模式开启后的变更
    - 变量必须先声明在使用
    - 函数的形参不能重复
    - 0开头的八进制被禁止
    - with语句被禁止
    - 没有明确隶属对象的函数中的this，不知想window，指向undefined
    - 函数的arguments不允许使用callee(非严格模式下arguments.callee就是函数自己)
    - 函数的arguments保存实参，不会收到形参的改变而影响

18. ES5新增的数组的方法

- arr.indexOf()
    - 根据指定n查n的索引，m(可选) 指定从m开始查询n
- arr.forEach(val,idx,self)
    - 遍历数组
- arr.map(function(val,idx,self{}))
    - 遍历数组，返回新的数组
- arr.filter(function(val,idx,self{}))
    - 遍历数组，过滤数据
- arr.some(function(val,idx,self{}))
    - 遍历数组，根据条件查询，得到布尔值，只要出现一次true，最终结果就是true
- arr.every(function(val,idx,self){})
    - 遍历数组，根据条件查询，得到布尔值，全部为true，结果才是true
- arr.reduce()
    - 遍历数组，归并
- arr.reduceRight()
    - 遍历数组，从右向左归并

19. 字符的方法

    - indexOf       根据数据查索引
    - lastIndexOf   根据数据查索引（反向查找）
    - charAt        根据索引查数据
    - slice
    - substr
    - substring     截取
    - replace       替换
    - split         分割

20. 对象的分类

- 内置对象
- 本地对象
- 宿主对象

21. this的概念

- 关键字，类似于变量，但并不是变量，是一个指向（指针），它的指向必然是一个对象类型的数据
- 一般存在于函数中
    - 不在任何函数中的this，指向window
- this在函数中，默认是没有指向的，只有在函数执行的一瞬间，才有指向
- this指向当前所在函数的执行**对象**(当前函数被哪个对象执行，函数中的this就是这个对象)

22.内置对象 Math

1. Math的方法
    - Math.round    四舍五入
    - Math.random   随机数
    - Math.abs      绝对值
    - Math.ceil     向上取整
    - Math.floor    向下取整
    - Math.min      最小数
    - Math.max      最大数
    - Math.sqrt     根号下
    - Math.pow(n,m) n的m次方

23. 日期对象

1. 创建日期对象
    - new Date()

24.什么是BOM

- 就是浏览器对象模型（window）

25.BOM(window)的事件

- load
    - 结构和资源加载结束
- resize
    - 可视距离的尺寸
- scroll
    - 滚走了的距离

26. BOM(window)的子对象

- location
    - href：浏览器的完整地址
    - 可获取，可设置。设置后，页面会跳转
    - search：地址栏?后的部分，表示查询数据（要向后台发送的数据）
        - 可获取，可设置。设置后，页面会跳转
    - hash：地址栏#后的部分，表示锚点链接（哈希值）
        - 可获取，可设置。设置后，页面会跳转
    - reload()：重新加载，刷新当前页面
    - assign(url)：跳转到指定地址，url为字符型数据，空字符，刷新
- history：历史记录，浏览器的前进后退按钮
    - length：历史记录的个数
    - forward()：向前一个历史记录
    - back()：向后一个历史记录
    - go(n)：正：向前走；负：向后退；0，刷新

- navigator：浏览器信息
    - userAgent：浏览器信息（名，内核，版本，运行系统）

- screen：视口，屏幕尺寸
- frames：框架，对应的是iframe的标签的操作

- document：文档对象，网页
    - 详情见DOM学习

27. window的方法(全局函数)

- parseInt()
- alert()
- confirm()
- prompt()
- open()
- close()
- setInterval()
- clearInterval()
- setTimeout()
- clearTimeout()

28. DOM节点的节点

- 元素节点
- 文本节点
- 注释节点
- 属性节点
- 根节点

29. DOM的选择器

- 元素节点选择器
    - id
    - query
    - class
    - tagName
    - queryAll

30. DOM的元素尺寸类属性

- offsetWidth/Height
    - cont + padding + border
- clientWidth/Height
    - cont + padding
- scrollWidth/Height
    - cont + padding + 溢出的尺寸

- offsetLeft/Top
    - 相对于包含块的位置

- scrollLeft/Top
    - 滚走了的距离
    - 可以设置

- 包含块：
    - 距离当前元素最近的拥有定位的父元素，如果没有这样的父元素，就是根元素
    - 获取某个元素的包含块：元素.offsetParent

31. 如何获取事件对象

- `window.event`

32. 事件对象身上的属性

- 鼠标事件的事件对象
    - 当前鼠标触发事件时，在元素身上的坐标
    - 事件对象.offsetX / Y
        - 鼠标相对于**事件目标**的坐标
    - 事件对象.clientX / Y
        - 鼠标相对于**可视区域**的坐标
    - 事件对象.pageX / Y
        - 鼠标相对于**页面**的坐标
    - 事件对象.screenX / Y
        - 鼠标相对于**显示器**的坐标
    - 事件对象.button
        - 左：0；中：1；右2
    - 事件对象.buttons
        - 左：1；中：4；右2
    - 事件对象.type：
        - 事件类型
- 键盘事件的事件对象
    - 对应的按键：事件对象.keyCode
    - ctrl键：事件对象.ctrlKey
    - shift键：事件对象.shiftKey
    - alt键：事件对象.altKey
    - win键：事件对象.metaKey

33. 事件冒泡

1. 当某个元素触发某个事件时，事件执行后，会依次向上触发所有父元素相同的事件

2. 阻止事件冒泡
    - 非IE：`stopPropagation()`
    - IE:`cancelBubble = true`

34. 如何阻止默认事件

- 非IE浏览器：`preventDefault`
- IE 浏览器：`returnValue = false`

35. 事件源和事件目标的区别

- 事件源：绑定事件的元素，可通过this获取
- 事件目标：触发事件的元素

36. 事件委托的概念及特点

- 概念：利用事件冒泡原理，将多个子元素相的同事件绑定在相同的父元素身上
- 特点：节省性能，可以给暂时不存在的元素绑定事件

37. 正则的使用及其功能

• 使用
  • 正则的方法
    • reg.test():验证
    • reg.exec():查找
  • 字符的方法
    • str.replace():替换
    • str.match():查找
    • str.search():查找
  • 正则的功能，验证test，替换replace，查询match

38. 正则的符号

- 修饰符：写在后面的斜杠的后面
    - `g`：全局匹配
    - `i`：忽略大小写
- 量词：表示前一个符号或部分出现的次数
    - `+`：表示1个或以上
    - `*`：表示0个或以上
    - `?`：表示0个或1个
    - `{n}`：表示指定的n位
    - `{n,}`：表示至少n位，多了不限
    - `{n,m}`：表示至少n位，最多m位
- `|`：或
- `()`：整合成一个部分
- `[]`：中元符，表示一位，内的符号之间是或的关系
- `[^]`：表示非，除了中元符中的内容
- 转义符
    - `\d`：表示所有数字，等同于：`[0-9]`
    - `\w`：表示数字字母下划线，等同于：`[0-9a-zA-Z_]`
    - `\s`：表示空格，等同于：` `
    - `\D`：表示非数字，等同于：`[^0-9]`
    - `\W`：表示非数字字母下划线，等同于：`[^0-9a-zA-Z_]`
    - `\S`：表示非空格，等同于：`[^ ]`
    - `\`：表示转义符，将正则中有含义的符号，转成没含义的字符
- `.`：通配符，表示所有字符

39.this的强制绑定

- bind
- call
- apply

40.this的绑定方式

- 默认绑定
- 隐式绑定
- 强制绑定
- new绑定

41.ES6新增的声明变量和关键字

- let:声明变量
- const:声明变量
- class:声明类
- import:模块化中引入模块
- export:模块化中暴露模块

42. let和var的区别

- 没有提升
- 不允许重复声明
- 生成块级作用域
- 暂时性死区
- 全局变量不会绑定到this

43. 箭头函数的特点

- 极简
- 不能作为构造函数使用，不能被new
- 没有自己的this，自动绑定上层this
- 当箭头函数有且仅有一个参数，可以省略小括号
- 当箭头函数体有且仅有返回值，可以省略花括号和return
- 当返回值是对象时，如果省略花括号和return，对象需要用小括号包裹

44. 面向对象编程的特点

- 封装
- 继承
- 多态

45.new的原理

- 创建一个新的对象
- 将原函数中的this指向了第一步创建的对象
- 将第一步创建的__proto__ 指向了原函数的prototype
- 检查原函数是否主动返回对象，如果没有，返回以上三步处理之后的新对象

46.原型及其概念

- `prototype`: 专属于函数（箭头函数除外）的属性，原型对象，显示原型。用来给将来的函数new出来的实例给父级用
- `__proto__`:所有的数据都有这个属性，原型对象，隐示原型，用来指向当前函数的prototype，在使用中可以省略，可以直接找到指向构造函数的prototype身上的属性和方法
- `consturctor`:专属于prototype，标签当前的prototype所属的构造函数

47. php的发送语句和接受语句

- 发送
    - echo
    - print
    - print_r
    - die()
- 接受
    - $_GET
    - $_POST
    - $_REQUEST

48.js中的同步和异步

- 同步：不一起执行
- 异步：一起执行

49. ajax的特点

- 无刷新加载数据
- 提升页面的加载速度
- 无法通过浏览器的前进后退按钮拿到曾经数据
- ajax请求的数据无法被网络爬虫搜索，破坏了SEO

50. GET和POST的区别

- POST主要用来发送数据，GET用来接受数据
- POST发送数据的安全性较好，GET的安全性较差
- POST发送数据大小不受限制，而GET的大小在2-100k左右

51.跨域的解决

- jsonp
- CORS
- 服务器代理

52.跨域

- 没有遵守浏览器的同源策略

53.jsonp的原理

- 利用script可以跨域的特点，请求资源

54. promise用来解决异步及回调地狱

55. HTTP协议的原理

- HTTP协议是一种无状态协议，基于TCP协议的一种高级协议，用于客户端和服务器之间的通信。

56. cookie的作用

- 会话跟踪技术：用来记录每次会话期间产生的所有需要记录的信息

57. cookie的概念

- cookie(会话跟踪技术)，相当于第一次跟服务器连接后，服务器给你发的一个身份牌，上面可以记录跟你有关的信息（是否登录，购物车等等信息），以后只要再跟服务器通信，必须带着这个令牌，这样一来，服务器会直接知道你身份牌上所有的信息。

57. cookie的数据特点

- 只能存文本(字符)
- 大小在4k左右
- 数量限制在50条
- 不允许跨域，不允许跨路径
- 默认时会话级，可以指定时间

58.storage的数据特点

- 只有名字和值
- 字符型数据
- 大小只有2M
- 可以存50条以上
- 没有过期时间

59. cookie和storage的相同点

- 共同点：
    不安全、不能跨域、不能跨浏览器,写入的都是字符

60. cookie和storage的不同点

- cookie:4K,storage:2M
- cookie,可以设置时间，storage不能设置时间
- cookie会被http携带，storage不会

61. localStorage和sessionStorage

- localstorage 永久
- sessionStorage 会话级

60. 本地存储

- cookie
- localStorage
- sessionStorage

61. 通信协议

- IP地址协议
- TCP面向连接的协议
- UDP面向数据包的协议
- HTTP超文本传输协议
- FTP文件传输协议

62. 闭包的概念

- 利用作用域的嵌套，将函数内部的变量进化成私有变量的环境，叫闭包

63. 闭包的特点

- 比较消耗性能
- 减少全局变量命名的污染
- 低版本浏览器会造成内存泄漏
- 在外部操作内部的变量比较放便，同时存在安全隐患
- 可以将原本要删除的变量。保存起来，方便再次使用

64. 闭包的原理

- 作用域链
- 垃圾回收机制

65. 继承的方式

- 改变this的指向
- 原型拷贝
- 原型链
- 内置方法拷贝原型
- 混合继承
- ES6的class继承

66. 设计模式

- 工厂模式
- MV*模式（mvc,mvp,mvm）
- 单例模式
- 组合模式
- 观察者模式
- 适配器模式
- 代理模式
-策略模式

67 node.js中模块的分类

- 内置模块
    - http模块
    - fs模块
    - url模块
    - querystring模块
- 第三方模块
- 自定义模块