20190902 前端开发日报

前端安全系列 | XST;前端跨域问题及解决方案;【干货】前端进阶应该知道的这些调试方法;Redux 和 Vuex 的对比;面试分享:1 年经验初探前端社招;让React组件如文档般展示的6大工具;正确姿势开发Vue后台管理系统;白话 Javascript 原型

  1. 前端安全系列 | XST XST 的全称是 Cross-Site Tracing,中文译作“ 跨站式追踪攻击 ”。具体而言,是客户端发 TRACE / TRACK 请求至服务器,如果服务器按照标准实现了 TRACE / TRACK 响应,则在 response body 里会返回此次请求的完整头信息。 通过这种方式,客户端可以获取某些敏感的 header 字段,例如 httpOnly 的 Cookie 等。 可见 XS...
  2. 前端跨域问题及解决方案 同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到 XSS、CSFR 等攻击。 同源策略限制内容有: Cookie、LocalStorage、IndexedDB 等存储性内容 对 DOM 节点的访问与操作 ajax 请求不能发送 所谓同源是指**"协议+域名+端口"**三者相同,...
  3. 【干货】前端进阶应该知道的这些调试方法平时工作量大并且很忙,也就意味着难免会在写代码的时候一不小心写出BUG。如果测试一旦没有测到,代码上到现网往往就是事故,很多同学在这种时候手忙脚乱,不知道怎么调试解决。本文就这点主要讲一下平时前端调试...
  4. Redux 和 Vuex 的对比 同样是状态管理库,Vuex 跟 Redux 差不多,几乎与 Redux 的理念一模一样。个人感觉 Vuex 使用起来要比 Redux 简单好懂,也许是因为学了 Redux 理解 Vuex 就简单了。下面来简单对比一下两者,对比可以帮助我们更好的学会使用他们, 没有代码。 1. 核心概念对比 Redux 的核心概念 Vuex 的核心概念 ...
  5. 面试分享:1 年经验初探前端社招 本文首发于 我的Github 。 年中决定离开当前所在的公司,想受一受外面社会的毒打。也面了 2 家还不错的公司(字节跳动 和 拼多多),在此记录分享一下。 字节跳动 字节跳动的技术面试都是以视频面试的形式进行的。 第 1 轮 1.1 自我介绍 1.2 js 基本知识 主要考察 js 中的基本类型、 typeof 和 instanceof ...
  6. 让React组件如文档般展示的6大工具React鼓励我们使用组件构建模块化程序。模块化给我们带来了非常多的好处,包括提高了可重用性。然而,如果你是为了贡献和复用组件,最好得让你的组件容易被找到、理解和使用。你需要将其文档化。
  7. 正确姿势开发vue后台管理系统 相信许多人和我一样刚接触 vue 时看文档都很枯燥,看完 vue,还有 vueRouter 、vuex 、vue-cli、ES6 (学不动了。。。 ) 对于看完教程之后又迟迟不能上手实际项目,只能写一些简单的小demo,这肯定和实际生产工作是有出入的,于是乎我就打算自己从零开始使用最新的技术栈搭建一个vue后台管理系统,依此加深对理论知识的学...
  8. 白话 Javascript 原型 如果你看过很多关于 Javascript 原型的文章,还没弄明白或曾经弄明白了现在又糊里糊涂不太清楚,那这篇文章很适合你。 我将用大白话讲讲什么是 Javascript 原型。那我们开始。 第一个吃螃蟹的大明星 曾经有个荒无人烟的小岛,虽然它从未有人涉足,但它却有一个响亮的名字 —— Javascript。 ...
  9. vue简单日历的实现方案(改造) 自己写个聚合首页,方便自己统一管理常用的网页工具,参考的是Mac OS的仪表盘,如下: 虽然短时间没法做到这么精美,但是起码功能得差不多吧,时钟与天气都已经OK,在做日历的时候觉得比较麻烦,就去CodePen找找看,便有了如此。 源码迁移 CodePen上的原项目本身难度不高,繁琐在理清楚日历逻辑(原作者...
  10. Vue.js技术细节 为了方便 Vue 实例跟踪每个节点的身份,从而重用和重新排列现有元素,需要为每项提供一个唯一的 key 属性。理想的 key 属性值是每项都有并且唯一的 id 。 key 的工作方式类似于一个属性,所以需要用 v-bind 来绑定动态值。 生命周期函数表 生命周期函数 含义 beforeCr...
  11. Angular公共组件开发II 上一篇:Angular公共组件开发 谈了Angular公共组件的开发,其中有个细节不知道大家注意到没有。 不知道大家有没有考虑过这边为什么在Angular的Onchange()生命周期里初始化数据。其实,这是因为通过@Input拿到的数据对于这个公共组件来说是异步的,所以,在构造器里拿不到这个数据,在OnInit里也拿不到。只有...
  12. js记录鼠标动作并按发生时间重现demo 演示记录鼠标在一个区域内的动作,并记录下来。点击回放时,按时序回放动作,包括移动,点击,拖拽
  13. Vue实战—实现商品详情页(12)这篇我们来实现商品详情页面: 在首页点击某一商品会展示商品的详细信息。如下图所示: 创建good组件 创建一个组件 good transition 来定义页面展示的形式; 使用v-show与变量showFlag来控制显示与隐藏,ref配合B...
  14. .NET 程序员如何学习Vue 之所以取这个标题,是因为本文来自内部培训的整理,培训的对象是公司的 .NET 程序员,.NET 程序员学习 Vue 是为了在项目中做二次开发时能够更好地跟产品对接。 Vue 是现在比较流行的前端框架,也是非常容易入门的前端框架,花几个小时看看官方文档基本就入门,如果连官方文档都懒得看,那本文或许对您有所帮助。 ...
  15. js获取某dom到根元素的offsetLeft/offsetTop 前言 大家知道,offsetLeft和offsetTop都是获取当前元素到其定位父级(offsetParent)的距离,我前面也有很多文章介绍宽高和offset,例如: https://www.haorooms.com/post/js_jquery_height 等 在实际的开发过程中,我们通常要获取dom到根元素的距离。这个如何做呢? 思路 其实很简单,父元素是offsetParent,我们...
  16. JavaScript 考古史闲聊 今天在整理 JavaScript 月刊新一期内容时,看到一篇文章感觉不错,遂推荐一下。文章标题是 How JavaScript Grew Up and Became a Real Language ,讲述的是 JavaScript 一路走来是如何一步步成为一门真正的编程语言的故事。 说到 JavaScript 的历史,最耳熟能详的便是网景公司在1995年雇佣 Brendan Eich,后者花了10...
  17. 正确姿势使用vue cli3创建项目 在19年8月份的时候,vue-cli更新到了3.X,新版本的脚手架封装度更高,配置起来简单许多,旨在让用户把精力都放在编写业务代码中,本人从vue-cli2.X过渡到3.X挺适应的,毕竟3.X脚手架已经自动搭建在webpack4上,所以不用大家再去从webpack3升级到webpack4,当然性能也提高了很多,所以推荐大家使用cli3.X版本去搭建自己的...
  18. 关于js中的this详解(下) 在上一篇文章中我们提到了 this 是在调用的时候被绑定的,完全取决于函数的调用位置,即函数在代码中被调用的位置(而不是声明的位置) 而“寻找”函数的调用位置,这里最重要的就是分析调用栈了。 让我们来看看什么是调用栈和调用位置吧! function baz() { // 当前调用栈是: baz // 因此, 当前调用...
  19. 前端函数式 -- 5. 偏函数和柯里化 在前面的文章中我们已经提到过在函数式编程中,一个函数“形状”的重要性,我们力求每一个函数都是一元函数,以便我们将各个函数组合在一起,但是我们总会遇到各种各样的情况迫使我们的函数是一元二元甚至是多元的,这时我们就需要借助柯里化来“改变函数的形状”,使其能够适应别的函数。同时这也是将一个函数从“一般化”引...
  20. ( 第四篇 )仿写'Vue生态'系列___"Proxy双向绑定与封装请求"( 第四篇 )仿写'Vue生态'系列___"Proxy双向绑定与封装请求" 本次任务 vue3.0使用了Proxy进行数据的劫持, 那当然就有必要研究并实战一下这方面知识了. 对Reflect进行解读, 并将Object的操作少部分改为Reflect的形...
  21. 带着问题看React-Redux源码我在读React-Redux源码的过程中,很自然的要去网上找一些参考文章,但发现这些文章基本都没有讲的很透彻,很多时候就是平铺直叙把API挨个讲一下,而且只讲某一行代码是做什么的,却没有结合应用场景和用法解释清...

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多

原文:20190902 前端开发日报 ,未经许可,禁止转载。
来源:前端开发博客 (http://caibaojian.com/fe-daily-20190902.html)