前端面试锦集

最新推荐文章于 2024-05-15 12:25:33 发布
最新推荐文章于 2024-05-15 12:25:33 发布
阅读量1w 收藏 561
点赞数 127
分类专栏： 前端面试 前端小问题 文章标签： 前端面试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43174643/article/details/89852178
版权

前端面试锦集

  1. 自我介绍：
  2. List item.html常用的标签
    Div,span,p,h1-h5,input,img,strong,a,hr,br
    http://www.divcss5.com/html/h50219.shtml
  3. html5的新特性
    （1）websocket：https://www.runoob.com/html/html5-websocket.html
    WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。
    HTML5 定义的 WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。
    在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。
  4. ajax的工作原理:
    通过XmlHttpRequest对象来向服务器发出异步请求，从服务器获得数据，然后用Javascript来操作DOM而更新页面
    Ajax优势：
    页面无刷新，在页面内与服务器通信，给用户的体验非常好
    使用异步方式与服务器通信，不需要打断用户操作，具有更加迅速的响应能力
    可以嫌少服务器的负担，利用客户端闲置能力来处理任务
    Ajax工作流程：
    创建Ajax对象(XmlHttpRequest)
    判断数据的传输方式（get/post）
    打开连接open()
    发送send()
    ajax的js写法
//get方法
var ajax = new XMLHttpRequest();
ajax.open('get','getStar.php?starName='+name);
ajax.send();
ajax.onreadystatechange = function () {
   if (ajax.readyState==4 &&ajax.status==200) {
　　　　console.log(ajax.responseText);//输入相应的内容
  　　}
}

//post方法
var xhr = new XMLHttpRequest();
//post请求一定要添加请求头才行不然会报错
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
 xhr.open('post', '02.post.php' );
xhr.send('name=fox&age=18');
xhr.onreadystatechange = function () {  if (xhr.readyState == 4 && xhr.status == 200) {
    console.log(xhr.responseText);
  } 
};

  1. js基本数据类型:Boolean null string number undefined
    复杂数据类型:object
    全局数据类型:Marth

  2. 浏览器前端发送url到服务器的过程
    https://www.cnblogs.com/max-tlp/p/6827956.html
    大体分为三步：
    一、浏览器向服务器发送请求（在地址栏中输入网页地址）
    二、服务器收到请求找到资源返回给浏览器
    三、浏览器解析服务器返回的内容（页面显示的内容）。
    URL结构,DNS解析,DNS缓存,三次tcp握手,http请求,http响应,浏览器渲染,前后端交互,四次挥手https://www.jianshu.com/p/417ac86ef086

  3. 响应式布局怎么实现
    （1） 原生代码实现：@media screen可以查询当前浏览器的尺寸，因此可采用该方法对同一个页面设置不同的CSS样式，来满足不同分辨率要求。
    （2） 采用bootstrap框架布局

  4. css实现水平垂直居中
    水平居中 margin：0 auto；
    垂直居中： https://www.cnblogs.com/zhouhuan/p/vertical_center.html

  5. 页面是怎样加载和渲染的过程

  6. 数组的操作

  7. vue.js的好处

  8. html5比html4好在哪里

  9. canvas调用了那些api

  10. js获取页面url

  11. 状态码有哪些 作用是什么 404 401 400 500 200 302等

  12. ajax请求实现的过程：
    AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

  13. 前端技术栈有哪些
    vuejs：是一套构建用户界面的渐进式框架。它最大的优势就是组件化，用这个框架可以把很多元素封装成组件，最后功能的开发变成了组件的拼装，极大的提高了代码的复用。
    reactjs，boots TV，nodejs

  14. js出现点击上一个模块下一个模块同样被点击应如何处理。事件捕获事件冒泡

  15. 函数声明、函数表达式及匿名函数的区别和调用指向https://www.cnblogs.com/zhouhuan/p/vertical_center.html
    https://blog.csdn.net/weixin_44505375/article/details/86499744
    函数声明：function fnName () {…};使用function关键字声明一个函数，再指定一个函数名，叫函数声明。
    函数表达式 ：var fnName = function () {…};使用function关键字声明一个函数，但未给函数命名，最后将匿名函数赋予一个变量，叫函数表达式，这是最常见的函数表达式语法形式。
    匿名函数：function () {}; 使用function关键字声明一个函数，但未给函数命名，所以叫匿名函数，匿名函数属于函数表达式，

  16. 立即执行函数（自执行函数）
    https://blog.csdn.net/qq_42051213/article/details/80767256
    立即执行函数的两种常见形式：( function(){…} )()和( function (){…} () )，一个是一个匿名函数包裹在一个括号运算符中，后面再跟一个小括号，另一个是一个匿名函数后面跟一个小括号，然后整个包裹在一个括号运算符中，这两种写法是等价的。要想立即执行函数能做到立即执行，要注意两点，一是函数体后面要有小括号()，二是函数体必须是函数表达式而不能是函数声明。
    除了使用()运算符之外，！，+，-，=等运算符都能起到立即执行的作用。这些运算符的作用就是将匿名函数或函数声明转换为函数表达式，如下图所示，函数体是函数声明的形式，使用运算符将其转换为函数表达式之后就可达到立即执行效果。
    使用立即执行函数的好处：通过定义一个匿名函数，创建了一个新的函数作用域，相当于创建了一个“私有”的命名空间，该命名空间的变量和方法，不会破坏污染全局的命名空间。此时若是想访问全局对象，将全局对象以参数形式传进去即可。

  17. 什么是跨域，解释一下
    跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。
    同源：是指，域名，协议，端口均相同，localhost和127.0.0.1虽然都指向本机，但也属于跨域。
    解决办法：
    1、JSONP：
    使用方式就不赘述了，但是要注意JSONP只支持GET请求，不支持POST请求。
    2、代理：
    例如www.123.com/index.html需要调用www.456.com/server.php，可以写一个接口www.123.com/server.php，由这个接口在后端去调用www.456.com/server.php并拿到返回值，然后再返回给index.html，这就是一个代理的模式。相当于绕过了浏览器端，自然就不存在跨域问题。
    3、PHP端修改header（XHR2方式）
    在php接口脚本中加入以下两句即可：
    header(‘Access-Control-Allow-Origin:*’);//允许所有来源访问
    header(‘Access-Control-Allow-Method:POST,GET’);//允许访问的方式

  18. JS中的位置和宽度：clientWidth、offsetWidth、scrollWidth等区别
    clientWidth = width+左右padding
    offsetWidth = width + 左右padding + 左右boder
    scrollWidth：获取指定标签内容层的真实宽度（可视区域宽度+被隐藏区域宽度比如滚动条）。
    width：content内容宽度。
    https://blog.csdn.net/qq_42089654/article/details/80515916

  19. 牛客网 https://www.nowcoder.com/profile/308592184/myFollowings

  20. 线程与进程的区别
    一个程序至少有一个进程，一个进程至少有一个线程。线程的划分尺度小于进程，使得多线程程序的并发性高。
    另外，进程在执行过程中拥有独立的内存单元，而多个线程共享内存，从而极大地提高了程序的运行效率。
    线程在执行过程中与进程还是有区别的。每个独立的线程有一个程序运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行，必须依存在应用程序中，由应用程序提供多个线程执行控制。
    从逻辑角度来看，多线程的意义在于一个应用程序中，有多个执行部分可以同时执行。但操作系统并没有将多个线程看做多个独立的应用，来实现进程的调度和管理以及资源分配。这就是进程和线程的重要区别。

  21. 如何对网站的文件和资源进行优化？

  22. 请说出三种减少页面加载时间的方法。（加载时间指感知的时间或者实际加载时间）
    1.优化图片
    2.图像格式的选择（GIF：提供的颜色较少，可用在一些对颜色要求不高的地方）
    3.优化CSS（压缩合并css，如margin-top,margin-left…)
    4.网址后加斜杠（如www.campr.com/目录，会判断这个“目录是什么文件类型，或者是目录。）
    5.标明高度和宽度（如果浏览器没有找到这两个参数，它需要一边下载图片一边计算大小，如果图片很多，浏览器需要不断地调整页面。这不但影响速度，也影响浏览体验。当浏览器知道了高度和宽度参数后，即使图片暂时无法显示，页面上也会腾出图片的空位，然后继续加载后面的内容。从而加载时间快了，浏览体验也更好了。）
    6.减少http请求（合并文件，合并图片）。

  23. 请写一个简单的幻灯效果页面
    如果不使用JS来完成，可以加分。（如：纯CSS实现的幻灯片效果）
    (1) js实现方法

//css
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }
        li{
            list-style: none;
        }
        #demo{
            width: 600px;
            height: 400px;
            position: relative;
            margin: 0 auto;
        }
        #list{
            position: relative;
            width: 100%;
            height: 100%;
        }
        #list li{
            width: 100%;
            height: 100%;
            position: absolute;
            opacity: 1;
        }
        #list li img{
            width: 100%;
            height: 100%;
        }
        #btn{
            position: absolute;
            right: 10px;
            bottom: 10px;
            z-index: 10;

        }
        #btn li{
            position: relative;
            float: left;
            width: 20px;
            height: 20px;
            background-color: #fb7a24;
            color: #ffffff;
            margin: 6px;
            text-align: center;
            border-radius: 90px;
            font-size: 13px;
        }
        #btn li:hover{
            background-color: #FF0000;
        }
        .current{
            background-color: #FF0000!important;
        }
    </style>
<div id="demo">
    <ul id="list">
        <li><img src="img/img_1.jpg" alt=""></li>
        <li><img src="img/img_2.jpg" alt=""></li>
        <li><img src="img/img_3.jpg" alt=""></li>
        <li><img src="img/img_4.jpg" alt=""></li>
        <li><img src="img/img_5.jpg" alt=""></li>
    </ul>
    <ul id="btn">
        <li class="current">1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>

</div>
//js
<script type="text/javascript">

    var list=document.getElementById('list');
    var oLi=list.getElementsByTagName('li');
    console.log(oLi)
    var btn=document.getElementById('btn');
    var oImg=btn.getElementsByTagName('li');
    console.log(oImg)
   var time=null;
    var b=0;
    function show(a) {
        for(var i=0;i<oLi.length;i++)
        {
            oLi[i].style.opacity=0;
            oImg[i].className='';
        }
        oLi[a].style.opacity=200;
        oImg[a].className='current';
    }
        function autoPlay() {
        time=setInterval(function () {
            b++;
            if(b>=oImg.length)
                b=0;
            show(b)
        },1000);
}
autoPlay();
    
   //鼠标控制
    for(var i=0;i<oImg.length;i++){
        oImg[i].index = i;
        oImg[i].onmouseover=function () {
            clearInterval(time);
            show(this.index)
        }
        oImg[i].onmouseout=function(){
            autoPlay();
        }
    }



</script>

（2）css3实现方法

<div class="banner"></div>
//css3
 <style type="text/css">
        .banner{
            width: 600px;
            height: 400px;
            margin: 15px auto;
            background-size: cover;
            background-position: center;
            animation-name: mymove;
            animation-duration: 20s;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
        }
        @-webkit-keyframes mymove {
            0% {background: url(" img/img_1.jpg") no-repeat;}
           25% {background: url(" img/img_2.jpg") no-repeat;}
           50% {background: url(" img/img_3.jpg") no-repeat;}
           75% {background: url(" img/img_4.jpg") no-repeat;}
           100% {background: url(" img/img_5.jpg") no-repeat;}
       }
    </style>
  1. .什么是FOUC（无样式内容闪烁）？你如何来避免FOUC？
    FOUC(Flash Of Unstyled Content)–文档样式闪烁
    而引用CSS文件的@import就是造成这个问题的罪魁祸首。IE会先加载整个HTML文档的DOM，然后再去导入外部的CSS文件，因此，在页面DOM加载完成到CSS导入完成中间会有一段时间页面上的内容是没有样式的，这段时间的长短跟网速，电脑速度都有关系。解决方法简单的出奇，只要在 <head>之间加入一个<link>或者<script>元素就可以了。
  2. doctype（文档类型）的作用是什么？你知道多少种文档类型？
    此标签可告知浏览器文档使用哪种HTML或XHTML规范。该标签可声明三种DTD类型，分别表示严格版本、过渡版本以及基于框架的HTML文档。
  3. 使用XHTML的局限有哪些？
    XHTML 元素必须被正确地嵌套。
    XHTML 元素必须被关闭。
    标签名必须用小写字母。
    XHTML 文档必须拥有根元素。
    所有的 XHTML 文档必须拥有 DOCTYPE 声明，并且 html、head、title 和 body 元素必须存在。虽然代码更加的优雅，但缺少容错性，不利于快速开发。
  4. data-属性的作用是什么？
    data-* 属性用于存储页面或应用程序的私有自定义数据。data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。存储的（自定义）数据能够被页面的 JavaScript 中利用，以创建更好的用户体验（不进行 Ajax 调用或服务器端数据库查询）。
    data-* 属性包括两部分：
    属性名不应该包含任何大写字母，并且在前缀 “data-” 之后必须有至少一个字符
    属性值可以是任意字符串
  5. 请描述一下cookies，sessionStorage和localStorage的区别？
    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的，可以方便的在web请求之间保存数据。有了本地数据，就可以避免数据在浏览器和服务器间不必要地来回传递。
    共同点：都是保存在浏览器端，且同源的。
    区别：
    1.cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。
    2.存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
    3.数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。
    4.作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。
    5.Web Storage 支持事件通知机制，可以将数据更新的通知发送给监听者。
    6.Web Storage 的 api 接口使用更方便。
  6. 描述下“reset”CSS文件的作用和使用它的好处。
    因为浏览器的品种很多，每个浏览器的默认样式也是不同的，所以定义一个css reset可以使各浏览器的默认样式统一。
  7. 22.列举不同的清除浮动的技巧，并指出它们各自适用的使用场景。
    1.使用空标签清除浮动。这种方法是在所有浮动标签后面添加一个空标签定义css clear:both.弊端就是增加了无意义标签。
    2.使用overflow。给包含浮动元素的父标签添加css属性overflow:auto;zoom:1;zoom:1用于兼容IE6。
    3.使用after伪对象清除浮动。该方法只适用于非IE浏览器。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置height:0，否则该元素会比实际高出若干像素；二、content属性是必须的，但其值可以为空，content属性的值设为”.”，空亦是可以的。
    4.浮动外部元素
    此三种方法各有利弊，使用时应择优选择，比较之下第二种方法更为可取。
  8. 解释下CSS sprites，以及你要如何在页面或网站中使用它。
    CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background-repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。这样可以减少向服务端发起请求的次数，提高速率。
  9. 你用过媒体查询（响应式布局），或针对移动端的布局/CSS吗？
    媒体查询，就是响应式布局。通过不同的媒介类型和条件定义样式表规则。媒介查询让CSS可以更精确作用于不同的媒介类型和同一媒介的不同条件。
    语法结构及用法：@media 设备名 only （选取条件） not （选取条件） and（设备选取条件），设备二{sRules}。
    示例如下：
 /* 当浏览器的可视区域小于980px */

 @media screen and （max-width： 980px） {
 #wrap {width： 90%; margin:0 auto;}
 }
 /* 当浏览器的可视区域小于650px */
 @media screen and （max-width： 650px） {
#header {height： auto;}
}
  1. 你熟悉SVG样式的书写吗？
    SVG 意为可缩放矢量图形
    https://blog.csdn.net/dusea/article/details/49474349
    什么是SVG？
    SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
    SVG 用来定义用于网络的基于矢量的图形
    SVG 使用 XML 格式定义图形
    SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
    SVG 是万维网联盟的标准
    SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
    书写示例如下：
<?xml version="1.0" standalone="no"?>
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
    <svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
        <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/>
    </svg>
  1. css盒模型
标准宽高
标准模型content的宽度
IE模型content+padding+border的宽度

盒模型的组成：content，padding，border，margin
css如何设置两种模型
这里用到了CSS3 的属性 box-sizing

/* 标准模型 */
box-sizing:content-box;

 /*IE模型*/
box-sizing:border-box;

37.display属性的作用

属性作用
none此元素不会被显示
block此元素将显示为块级元素，此元素前后会带有换行符
inline默认。此元素会被显示为内联元素，元素前后没有换行符
inline-block行内块元素
  1. css之position属性的作用
    relative 相对定位 相对于自身的位置定位，可以用left，bottom，top,right来改变位置
    fixed 固定定位 相对于整个页面来定位，滚动之后仍旧在那个位置
    absolute 绝对定位 如果父元素设置相对定位，那么就是针对父元素来定位的，否则就是针对浏览器来定位，可以用left,top,bottom,right来改变位置
    static 默认定位 默认即静止定位,是按照元素在(x)html出现的顺序依次分配位置,static是不受top right left bottom影响的。若要清除定位时可使用static来消除定位的影响。
  2. js事件代理。
    JavaScript事件代理则是一种简单的技巧，通过它你可以把事件处理器添加到一个父级元素上，这样就避免了把事件处理器添加到多个子级元素上。当我们需要对很多元素添加事件的时候，可以通过将事件添加到它们的父节点而将事件委托给父节点来触发处理函数。这主要得益于浏览器的事件冒泡机制。事件代理用到了两个在JavaSciprt事件中常被忽略的特性：事件冒泡以及目标元素。
function getEventTarget(e) {
    var e=e||window.event;
    var src= e.target||e.srcElement;
    return src;
}
  1. 解释下JavaScript中this是如何工作的。
    this永远指向函数运行时所在的对象，而不是函数被创建时所在的对象。匿名函数或不处于任何对象中的函数指向window 。
    1.如果是call，apply,with，指定的this是谁，就是谁。
    2.普通的函数调用，函数被谁调用，this就是谁。
  2. document.write()方法为什么一般不用
<html>
<head></head>
<body>
<script type="text/javascript">document.write("<p>Hello</p>");</script>
</body>
</html>

当页面加载完毕，你会在页面看到 Hello。查看源文件就是上面的代码。
但如果页面已经加载完毕，再使用 document.write，那就会覆盖整个文档。

<html>
<head></head>
<body>
<script type="text/javascript">
// 当点击鼠标时调用 document.write
document.onclick = function() {
document.write("<span>Javascript</span>");
};
</script>
</body>
</html>

因为鼠标动作是在页面加载完毕后执行的，所以整个页面会被 Javascript所覆盖。现在查看源文件就只会看到 <span>Javascript</span>

  1. 请指出document.onload和document.ready两个事件的区别。
    页面加载完成有两种事件，一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件），二是onload，指示页面包含图片等文件在内的所有元素都加载完成。
  2. 如何实现下列代码：[1,2,3,4,5].duplicator();//[1,2,3,4,5,1,2,3,4,5]
var arr = [1,2,3,4,5];
    Array.prototype.duplicator = function (){
        var len = this.length;
        for(var i=0;i<len;i++){
            this.push(this[i]);
        }
        return this;
    }
       console.log(arr.duplicator())
  1. 什么是”use strict”;?使用它的好处和坏处分别是什么？
    在代码中出现表达式-“use strict”; 意味着代码按照严格模式解析，这种模式使得Javascript在更严格的条件下运行。
    好处：
    消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;
    消除代码运行的一些不安全之处，保证代码运行的安全；
    提高编译器效率，增加运行速度；
    为未来新版本的Javascript做好铺垫。
    坏处
    同样的代码，在”严格模式”中，可能会有不一样的运行结果；一些在”正常模式”下可以运行的语句，在”严格模式”下将不能运行。
  2. javascript的typeof返回哪些数据类型.
    string,boolean,Array,undefined,object,function
  3. js强制类型转换和隐式类型转换
    强制类型转换：parseIn,parseFloat,number
    隐式类型转换:== ===
  4. splite和join的区别
    splite 是字符串切割成数组
    join 将数组合并成字符串
  5. splice和slice操作数组的区别
    splice(1,0,‘ww’) 在1的位置添加www
    splce(1,1,‘rrr’) 从位置1开始的1个元素 用rr替代删除的元素
    slice(start,end）从start位置开始选取元素到end截止 并且返回选择的元素
  6. 尾部 push() pop() 头部unshif() shif()
  7. js继承的几种方式：https://blog.csdn.net/wyw223/article/details/86567897
  8. js事件流：https://segmentfault.com/a/1190000004463384?utm_source=tag-newest
    DOM事件流包括三个阶段。
    事件捕获阶段
    处于目标阶段
    事件冒泡阶段
  9. CSS有哪些属性是可以继承的？
    常见：
    　　1、字体系列属性
    　　font-family：字体系列
    　　font-weight：字体的粗细
    　　font-size：字体的大小
    　　font-style：字体的风格
    　　2、文本系列属性
    　　text-indent：文本缩进
    　　text-align：文本水平对齐
    　　line-height：行高
    　　word-spacing：单词之间的间距
    　　letter-spacing：中文或者字母之间的间距
    　　text-transform：控制文本大小写（就是uppercase、lowercase、capitalize这三个）
    　　color：文本颜色
    　　3、元素可见性：
    　　visibility：控制元素显示隐藏
    　　4、列表布局属性：
    　　list-style：列表风格，包括list-style-type、list-style-image等
    　　5、光标属性：
    　　cursor：光标显示为何种形态
  10. 手动写动画最小的时间间隔是多久：
    多数显示器的默认频率是60HZ，即每秒刷新60次。所以理论上的最小间隔是 1/60*1000ms = 16.7ms
关于vue的面试题：

https://segmentfault.com/a/1190000018225708?utm_source=tag-newest

数据结构

1、数组
2、栈
3、队列
4、链表
5、树
6、散列表
7、堆
8、图
https://blog.csdn.net/yeyazhishang/article/details/82353846

计算机网络

IOS七层 TCP/UDP/IP等：
https://blog.csdn.net/Trap_In_Study/article/details/87731638

我的ID是小白
关注
专栏目录
前端面试项目总结+this指向总结
qiao_qiao_happy的博客
03-03 1507
1. 做过的工作比较有创意的地方或者亮点 2020.01-2020.12 AIZOO 可视化机器学习平台 项目介绍：实现用户自定义上传算法模型和数据资源，通过可视化界面拖拽组件构建模型，提交任务，使用 slurm 集群管理自动部署模型训练，查看训练结果以及分析图表等的一站式机器学习平台。 负责内容： (1) 前端开发：采用 Vue 框架+iview 组件库，基于 WebSocket 即时通讯和 Echarts 图表库绘制 动态折线图，通过 API 接口与 Java 后台交互。 (2) 可视化构建模型：使用
2024年前端最全如何写一个vue组件发布到npm，包教包会，保姆级教学(1)，BAT大厂前端面试真题锦集干货整理
2401_84447328的博客
05-06 651
但是本人觉得看书也很必要，可以节省很多时间，常见的javascript的书，例如：javascript的高级程序设计，是每位前端工程师必不可少的一本书，边看边用，了解js的一些基本知识，基本上很全面了，如果有时间可以读一些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。打包之前，建议将将要发布的版本修改为最小，并且将name中加上你独有的标志，比如我在后面加上的-sheldon，防止和npm上已经有的包重名，否则有可能因为重名而上传失败。按照我们最开始的认知，如果一个项目引用包，就需要使用。
2024年最新前端面试知识点整理——项目整理_前端面试项目介绍，面试技巧的书籍
最新发布
2401_84437691的博客
05-15 400
前端资料汇总开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】框架原理真的深入某一部分具体的代码和实现方式时，要多注意到细节，不要只能写出一个框架。算法方面很薄弱的，最好多刷一刷，不然影响你的工资和成功率😯在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。
前端面试知识点整理——项目整理
qq_43819274的博客
04-02 3568
项目整理 一、华工线上黑市（安卓） 1.MVP架构方面 先介绍整个架构是怎样的，并与传统的mvp架构的区别 后来经过两次变革 （1）抽出了base层，包括baseactivity（定义一些通用的view接口的函数，和一些绑定样式、初始化的函数）和basepresenter（定义一些绑定和解绑view的函数） （2）把model层进行了整合，将所有网络请求封装在一个类当中，对于上层就像在调用api获取数据一样 首先定义了一个okhttpclientutil的类，类里面封装了相应的post和get等请求，然后我
面试介绍项目
qq593249106的博客
10-23 7715
前端面试题之介绍项目 仿O2O外卖平台微信小程序 这个项目是基于微信小程序的外卖点餐平台。 选择外卖平台是因为现在的餐饮业越来越发达，外卖平台是一个低成本的高回报的项目，比如说，经营一个好线下的店铺，要考虑店铺的所在地的人流量，房租，水电，人力等等，而搭建一个好的外卖平台就可以大大减少这些成本，因为现在大家都喜欢点外卖，点外卖已经成为了一个趋势。 选择小程序是因为现在微信的普及率已经非常高了，人人...
面试项目介绍
醉梦者的博客
09-17 8864
洋葱OMALL APP ： 整个项目主要用vue来搭建的，用vue-router实现底部导航等页面跳转功能，然后购物车信息，货物数量，秒杀时间段等数据用vuex储存，各个页面又分为多个父组件和子组件，用props,$emit方法来进行数据通讯。 买货页 消息和分享的ui图标是我做的，调用后端接口，实现分享功能。 搜索点进去立马就会发送一个ajax请求，将历史和热门搜索返回到下面的两个div中......
2022年关于计算机类自荐信模板锦集6篇.docx
07-13
术发展的步伐。在这一点上，我不敢说自己做得有多好，但我一直致力于不断提升自己这方面的能力，并通过不断阅读和实践提升技术...在准备面试或者撰写自荐信时，求职者应重点展示这些方面的能力，以增加被录用的可能性。
500道网络安全面试题集锦（附答案）
2301_77300311的博客
04-19 1668
1.反射型一般是在url构造恶意js，将链接发给目标用户，当用户访问该链接的时候，会向服务器发起一个GET请求来提交一个带有恶意代码的链接2.DOM型脚本程序可以通过DOM来动态修改页面内容。3.持久型常见的就是在博客留言板，反馈投诉，论坛评论等将恶意代码和正文都存入服务器的数据库，每次用户访问都会触发恶意代码。xss盲打是一种攻击场景，也属于存储型xss盲打的意思是无法直接在前端看到反馈效果，只有后台能看到输入的内容，从前端无法判断是否存在xss。
前端框架及项目面试一
weixin_53944118的博客
03-13 454
前端框架及项目面试聚焦Vue Reacet Webpack 为什么要做面试题 面试前的准备太复杂 日积月累，总结思路 我们可否自己复习？答案是可以的，但是需要有足够的时间，有自学能力，需要有足够毅力。 如果跟着课程呢？ 主要分为两点： 1.全面 全面的知识体系 大量的面试真题 完整的技术面试流程 2.高效 直击面试考点和重点，无需自己去扒那些详细的文档 会深入浅出讲解原理，无需自己去阅读那些源码，原理是不等于源码的 会解读项目的设计的思路，提炼项目的经验 注意 课程不能保证100%通过面试 课程不能
WEB前端面试技巧
11-06
面试完了多总结自己哪里做得不好，哪里做得好，都记录下来，后续扬长避短；通过面试肯定亲身体会到了公司团队文化、面试官体现出来的技术能力、专业性以及职位将来所做的事情，跟自己预期是否有差距，多个 offer 的话多做对比。
前段框架及项目面试的介绍 一
WLIULIANBO的博客
03-13 500
前段框架及项目面试 Vue Reace Webpack 通过看这个视频让我知道面试都要准备那些面试题，面试题的准备不要太繁杂了，如果是你自学准备的话，是需要你有足够的时间，需要你有自学能力，需要你有毅力，要是通过这个视频的可以让快速的掌握面试题的技巧。 主要分为两点： 1.全面 全面的知识体系 大量的面试真题 完整的技术面试流程 2.高效 直击面试考点和重点，无需自己去扒那些详细的文档 会深入浅出讲解原理，无需自己去阅读那些源码，原理是不等于源码的 会解读项目的设计的思路，提炼项目的经验 需要主意： 1
前端面试必考题：介绍项目和项目难点
Perback的博客
11-14 3906
【面试官提问】介绍一下你近期（半年之内）做过的一个项目【面试官提问】介绍一下项目中的一个难点或者成就。
面试集锦之前端介绍
奋斗的清风~的博客
03-03 394
Jquery 的常用选择器 ID选择器 通过#idName获取一个元素 class选择器 通过类获取元素 标签选择器 通过标签选择元素 层次选择器 儿子选择器 &gt; 获取下面的子元素 后代选择器 空格 获取下面的后代元素，包括儿子，孙子等后代 通用选择器 * 获取所有的元素 属性选择器 标签[属性名称=‘属性值’] 获取属性名为‘属性名称’，并且为属性值的所有标签 JQuery的页...
前端面试（一）
htong521的博客
06-04 1158
JavaScript中如何检测一个变量是一个String类型？请写出函数实现 function str(obj){ rerurn typeof(obj) == 'string' } function str(obj){ return obj.constructor === String } function type(data){ return Object.proto...
【面试必看】零经验如何准备前端面试（面试项目技能描述）
weixin_45663697的博客
06-03 3473
转载自b站up主宇哥在学习的【面试必看】零经验如何准备前端项目？教你3个方法，助你收获 offer！ 项目 demo 类，一个仿首页和小游戏 主要体现出对html，css，js的掌握程度 准备2-3个例子 仿写首页 展现出自己扎实的html功底以及对CSS常用布局、选择器的用法、响应式原理、动画、过渡的掌握 比如在写的过程中掌握了各种选择器、子选择器、伪类选择器的用法。 实现一个小游戏 通过这个游戏考验自己抽象的能力，学会如何把复杂的逻辑用代码表示 例如：2048，在写的过程中需要考虑游戏初始
web前端常见面试题整理(JS)
kksw1121
05-29 1275
JS 1.JS基本数据类型 Number String boolean null undefined Object null类型进行typeof操作符后，结果是object，原因在于，null类型被当做一个空对象引用。 2.typeof的返回值类型 number：NaN boolean string undefined：undefined 不存在的变量 object：对象，数组，null Function：Array Date symbol：typeof Symbol() // ES6提供的新的类型 3.
嗯哼～2017美团点评前端面试（一年工作经验）
github_35924246的博客
08-30 6282
美团目前也是在大量的招人啊～～当时参加的是美团打车部门的面试（一年工作经验以上的），部门技术栈vue，后台就是node，一面通过，等了两个小时面试二面，然后通知我回去等消息，一般这样就是挂掉了，毫无疑问。美团是一次性全部面完的。所以去参加最好做好面试四个小时的打算。 先来聊聊一面吧～哈哈 一面 1.简单的自我介绍，与大体的了解我。。。 一面面试官非常不错，先问了下几个项目和用到的技术，会先
前端面试题集：链表操作解析
"这是一份前端程序员面试分类真题集，包含了多项选择题，主要涉及前端技术中的链表操作，适合求职面试准备。" 在前端程序员的面试中，数据结构和算法是重要的考察部分，尤其是链表这类基础数据结构。这份真题集提到...
评论 8
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值