前端第一次面试

第一次面试

第一次面试，而且是电话面试，面得很惨，主要是自己基础太不牢固了，面试过程中手机也出现了一些问题给面试官的印象很不好o(╥﹏╥)o，下面是一些面试题：

js基本类型，引用类型有哪些，区别

• 基本类型：null undefined string boolean number symbol
• 引用类型：object array function等
• 区别：
  • 基本类型是按值访问，可以操作保存在变量中的实际值；
  • 引用类型的值是保存在内存中的对象，js不能直接操作对象的内存空间。操作对象时，实际上操作对象的引用而不是实际的对象。因此，引用类型的值是按引用访问的。

内置对象有了解吗

• 内置对象 ：Math String Number Date Array Object等等

Math一般在什么情况用到

• 使用Math完成计算功能，与js直接编写计算功能相比，Math对象提供的计算功能执行起来要快得多

Date 获取当前的时间，格式化日期（时间轴？？？)

• var date = new Date();
  date.toLocalString();

String千位符分割

function fromat(num){
    var reg = / \d{1,3}(?=(\d{3})+$)/g;
    return (num+' ').replace(reg,'$&,');
}
/*
\d{1,3}(?=(\d{3})+$)  表示前面有1~3个数字，后面的至少由一组3个数字结尾。

?=表示正向引用，可以作为匹配的条件，但匹配到的内容不获取，并且作为下一次查询的开始。

 $& 表示与正则表达式相匹配的内容，具体的使用可以查看字符串replace()方法

（num+ ' '）表示将数字转换为字符串

*/

var a = 1234567;
var b = 1234567.1234;

//javaScript原生方法
 console.log(a.toLocaleString());
 console.log(b.toLocaleString());//保留三位小数

倒置字符串

var reverse = function( str ){
   var stack = [];//生成一个栈
   for(var len = str.length,i=len;i>=0;i-- ){
    stack.push(str[i]);
}
return stack.join('');
};

var reverse = function( str ){
  var newStr = '', i = str.length;
   for(; i >= 0; i--) {
        newStr += str.charAt(i);
   }
   return newStr;
};

reverse('abcde')

var reverse = function( str ){
return str.split('').reverse().join('');
};

九九乘法表

 function f1(num){ 
    var str = '';
    for(var i=1;i<= num; i++){ 
      for(var j=1;j<=i;j++){ 
         document.write(`${i}*${j}=${i*j} `); 
      } 
      // 换行
      document.write('<br>');
    } 
  }
f1(9);

Ajax请求过程

//创建XMLHttpRequest对象
var xhr = '';
if(XMLHttpRequest){
  xhr = new XMLHttpRequest();
}else if{
  xhr = activeXobjec();
}
//准备发送，
//参数(method,url,async)
xhr.open('get','xxx.php?params',true);//参数 encodeURI()
//xhr.open('post','xxx.php',true); post方法
//执行发送
xhr.send(null)；
//xhr.setRequestHeader('content-Type','application/x-www-form-urlencoded');//post
//xhr.send(params);//post
//添加回调函数
 xhr.onreadystatechange = function(){
    if(xhr.readyState === 4){
    if(xhr.status === 200){
    //if((xhr.status>=200 && xhr.status<300) || xhr.status === 304){ 
     alert(xhr.responseText);
    }
     }
  }

var let const的区别

• var在函数作用域，存在变量声明提升，

• let在块级作用域, 不存在变量声明提升，不可以重复命名

• const 定义常量，不存在变量声明提升，不可以重复命名

== 和===的区别，平常用哪一种，为什么

• " === " 叫做严格运算符，" == "叫做相等运算符。

• " == " 表示只要值相等即可为真，而" === "则要求不仅值相等，而且也要求类型相同。

http请求报400是什么原因

• Bad Request

• 在ajax请求后台数据时有时会报 HTTP 400 错误 - 请求无效 (Bad request);出现这个请求无效报错说明请求没有进入到后台服务里；

原因：1）前端提交数据的字段名称或者是字段类型和后台的实体类不一致 或 前端提交的参数跟后台需要的参数个数不一致，导致无法封装；
2）前端提交的到后台的数据应该是json字符串类型，而前端没有将对象转化为字符串类型；

http请求报405错误的原因

• method not allowed方法
• 如果一个 Web 服务器是 ’ 只读 ’ （客户端不能修改 Web 服务器上的网址资源） ，那么它可以被设置为不允许 PUT 和 DELETE 方法。
  同样，如果没有用户输入（所有的网页都是静态的） ， 那么 POST 方法可设置为不允许。
  所以， 405 错误可能会因 Web 服务器没有被设置为从客户端接受输入数据而出现。
  另外， 如果客户端对请求中指明的具体网址资源没有足够的权力， 该错误也会出现。
  https://blog.csdn.net/qq_35804654/article/details/77272304

git远程提交代码

本地提交
 git init
 git add.
 git cmmmit -m '注释'
 git remote add origin git
远程提交
 git remote add origin gitgit@xx.xx.xx.xx:repos/xxx/xxx/xxx.git
 git push -u origin 分支名(master)

作用域

• 执行环境：定义了变量或函数有权访问的其他数据，每个执行环境都有一个与之关联的变量对象，环境中定义的所有变量和函数都保存在这个对象中。
  某个执行环境中所有的代码执行完毕后，该环境被销毁，保存在其中的变量和函数的定义也随之销毁。全局执行环境（window对象）直到应用程序退出（关闭网页或浏览器）才会被销毁。
• 每个函数都有自己的执行环境，局部执行环境
• js没有块级作用域

if else 里面定义的变量能不能被外部使用

• 因为js没有块级作用域，if语句的变量声明会将变量添加到当前的执行环境；for语句创建的变量i即使在for循环执行结束后，也依旧会存在循环外部的执行环境中。

if (true) {
  var color ='blue';
}
alert(color);//blue

for(var i =0;i<10;i++){
  console.log(i);
}
alert(i);//10

对vue的理解

• vue.js是一套构建用户界面的渐进式框架，
  vue只关心视图层，采用自底向上增量开发的设计，
  Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

其他面试题

vue实现双向绑定的原理

• vue.js 采用数据劫持结合发布者-订阅者模式的方式，
  通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。
• 首先我们为每个vue属性用Object.defineProperty()实现数据劫持，为每个属性分配一个订阅者集合的管理数组dep；然后在编译的时候在该属性的数组dep中添加订阅者，v-model、{{}}、v-bind会添加一个订阅者，只要用到该属性的指令理论上都会，接着为input会添加监听事件，修改值就会为该属性赋值，触发该属性的set方法，在set方法内通知订阅者数组dep，订阅者数组循环调用各订阅者的update方法更新视图。