前端第一次面试

最新推荐文章于 2022-04-13 20:19:55 发布

hzzhhh

最新推荐文章于 2022-04-13 20:19:55 发布

阅读量279

点赞数 2

分类专栏：前端面试前端实习前端秋招文章标签：前端面试

本文链接：https://blog.youkuaiyun.com/hzzhhh/article/details/101208560

版权

前端面试前端实习前端秋招专栏收录该内容

1 篇文章

订阅专栏

第一次面试

第一次面试，而且是电话面试，面得很惨，主要是自己基础太不牢固了，面试过程中手机也出现了一些问题给面试官的印象很不好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.youkuaiyun.com/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方法更新视图。