前端javascript工程师 经验

前端使用工具规范commit信息

前言 通过工具规范git提交信息也是工程化的一部分,在前端领域有一些工具为我们提供了相关功能,在这里做一下使用总结。 commitlint commitlint是什么? 就像eslint用来检查js代码是否标准,commitlint用来检查提交信息是否满足固定格式的工具。 同样,commitlint ......
前端 工具 commit 信息

彻底弄懂Javascript模块导入导出

笔者开始学习Javascript的时候,对模块不太懂,不知道怎么导入模块,导出模块,就胡乱一通试 比如 import xx from 'test.js' 不起作用,就加个括号 import {xx} from 'test.js' 反正总是靠蒙,总有一种写法是对的,其实还是没有理解,还是不懂 尤其是在 ......
Javascript 模块

用Echarts实现前端表格引用从属关系可视化

在金融行业,我们经常会有审计审查的需求,对某个计算结果进行审查,但是这个计算结果可能依赖多个单元格,而且会有会有多级依赖的情况,如果让我们的从业人员靠眼睛找,工作量巨大,而且准确性存疑,基本上死路一条,因此让整个审查过程可视化,迫在眉睫,现在我们利用纯前端表格和Echarts将审计审查过程可视化 一 ......
前端 表格 Echarts

JavaScript 深拷贝的循环引用问题

如果说道实现深拷贝最简单的方法,我们第一个想到的就是 JSON.stringify() 方法,因为JSON.stringify()后返回的是字符串,所以我们会再使用JSON.parse()转换为对象,如下代码: let obj = { name: 'liaoyi',age: 22,sex: 1} J ......
拷贝 JavaScript 问题

【前端调试】- 断点调试的正确打开方式

我们有时候会不知道断点打在什么地方,比如想知道dom什么时候被修改的,网络请求在哪里 ,什么情况才断点。类似情况有很多,需要对应使用不同的打断点方式才可以提高效率,本文演示已VSCode Debugger为主,其实跟chrome是大同小异,不过更加直观方便。可以参考该文章 【前端调试】- 更好的调试 ......
断点 前端 方式

详解前端缓存,解决前端换包之后环境中仍会出现旧版效果

前端项目修改了很多东西:比如bug啊,样式啊。当你把前端项目打包之后满心欢喜的在 Nginx(测试环境)换上它,然后在 Jira 上修改bug状态@测试人员复测。然后测试人员开始找你battle了,你的bug怎么还是没修改啊,但是你明明换上了最新的版本,中间到底出现了什么问题。打开控制台的 netw ......
前端 缓存 效果 环境

还原火山引擎 A/B 测试产品——DataTester 私有化部署实践经验

作为一款面向ToB市场的产品——火山引擎A/B测试(DataTester)为了满足客户对数据安全、合规问题等需求,探索私有化部署是产品无法绕开的一条路。 在面向ToB客户私有化的实际落地中,火山引擎A/B测试(DataTester)也遇到了字节内部服务和企业SaaS服务都不容易遇到的问题。在解决这些 ......
火山 DataTester 经验 引擎 产品

前端工程化筑基-Node/npm/babel/polyfill/webpack

前端搬砖框架:开发 ⇨ 构建 ⇨ 部署上线 ⇨ 摸鱼。本文对前端工程中的基本组件,如Node.js,npm,babel,polyfill,webpack等框架用图形化、简洁的语言进行了简单的介绍。 ......
前端 polyfill webpack 工程 babel

TypeScript 前端工程最佳实践

作者:王春雨 前言 随着前端工程化的快速发展, TypeScript 变得越来越受欢迎,它已经成为前端开发人员必备技能。 TypeScript 最初是由微软开发并开源的一种编程语言,自2012年10月发布首个公开版本以来,它已得到了人们的广泛认可。TypeScript 发展至今,已经成为很多大型项目 ......
前端 TypeScript 工程

JavaScript:原型(prototype)

面向对象有一个特征是继承,即重用某个已有类的代码,在其基础上建立新的类,而无需重新编写对应的属性和方法,继承之后拿来即用; 在其他的面向对象编程语言比如Java中,通常是指,子类继承父类的属性和方法; 我们现在来看看,JS是如何实现继承这一个特征的; 要说明这个,我们首先要看看,每个对象都有的一个隐 ......
原型 JavaScript prototype

JavaScript:类(class)

在JS中,类是后来才出的概念,早期创造对象的方式是new Function()调用构造函数创建函数对象; 而现在,可以使用new className()构造方法来创建类对象了; 所以在很多方面,类的使用方式,很像函数的使用方式: 但是类跟函数,还是有本质区别的,这在原型那里已经说过,不再赘述; 如何 ......
JavaScript class

怎么开发前端才更优雅

本文主要讲述对命名规范、工具、插件的一些建议,具体内容参见【参见】字样的超链接 本文将带你调整开发姿势,先来看以下几点 让公司给你配备三台显示器,第一台用来看浏览器效果,第二台用来写代码,第三台用来看开发者工具 让公司给你配备电竞椅,要可以躺下的那种,方便中午睡午觉 让公司给你配备独立办公室,并且可 ......
前端

【博学谷学习记录】超强总结,用心分享|前端CSS总结(一)

CSS总结(一) shift+alt,选中多行 外链式 <link rel="stylesheet" href="./my.css"> 1 选择器 1.1 标签选择器 结构:标签名 1.2 类选择器 结构:.类名{ } 1.3 id选择器 结构:#id属性值{ } 作用:通过id属性值,找到页面中带 ......
前端 CSS

前端程序员学python(爬虫向)(一文修到筑基期) (本文不含知识诅咒)

我踏马来辣 还有一件事: 本教程配合c语言中文网 python爬虫 教程 食用 本教程不适用于未成年人 一定要刷牙 本教程不存在知识诅咒 学完本教程即可进入筑基期 js 基础和本教程学习效率成正比 不要笑 暂时不要驾驶你的行李箱 本教程是针对前端程序员制定的 vscode是IDE大王,什么?你说vs ......
基期 爬虫 前端 程序员 程序

第一百一十七篇: JavaScript 工厂模式和原型模式

好家伙,本篇为《JS高级程序设计》第八章“对象、类与面向对象编程”学习笔记 1.工厂模式 工厂模式是另外一种关注对象创建概念的创建模式。 它的领域中同其它模式的不同之处在于它并没有明确要求我们使用一个构造器。 取而代之,一个工厂能提供一个创建对象的公共接口,我们可以在其中指定我们希望被创建的工厂对象 ......
模式 原型 JavaScript 工厂

三无选手上岸大厂的后端校招经验

众所周知,受疫情影响,互联网迎来了『寒冬』,大厂 HC 骤减,腾讯基本不招人,华为也不再是有手就行,阿里某些部门流传只招 23 所院校,在如此严峻的形势下,上岸大厂变得愈发困难... ......
选手 经验

高级前端进阶(七)

最近行程码下线了,核酸检测也取消了,但是新冠病毒仍然存在,加上也是流感爆发时期,大家注意防护!!! 阳性无症状,你可能并没有真的感染新冠,新冠病毒是比普通流感病毒要厉害的,会导致发烧的,而且传染性极强。 新冠病毒一旦入侵你的免疫系统,会疯狂繁殖,免疫系统会杀不过来的,那咋办?摆烂,启动终极保护系统( ......
前端

Javascript | 分别用async await异步方法和Promise来实现一个简易的求职程序

关注公众号,一起交流,微信搜一搜: LiOnTalKING JavaScript Promise Promise 是一个 ECMAScript 6 提供的类,目的是更加优雅地书写复杂的异步任务。 如何创建一个 Promise 对象? new Promise(function (resolve, re ......
Javascript 简易 Promise 程序 方法

微前端中实现沙箱环境的方案调研

前言 在微前端实践过程中有一个必然会遇到的问题:全局作用域变量的污染问题,具体来说就是window对象挂载数据会被主子应用获取和修改导致数据相互污染问题,这时候如果能在应用之间做个数据隔离,最好能实现一个沙箱环境,对解决问题很有帮助。 iframe方案 说到沙箱隔离,首先想到的是iframe,自带数 ......
沙箱 前端 环境 方案

利用云服务提供商的免费证书,在服务器上发布https前端应用和WebAPI的应用

我们如果要在服务器上发布https前端应用和WebAPI的应用,那么我们就需要用到https证书了。我们一般发布的应用的云服务器上,都会提供一定量的相关的免费证书(一般为20个)供我们使用,每个一年期限,到期再续即可,一般情况下基本上满足要求了,本篇随笔介绍如何基于云服务提供商的免费证书,在服务器上... ......
前端 提供商 证书 服务器 WebAPI

JavaScript Promises, async/await

这篇博客不是讲如何使用 Promise,是一个学习总结。是我自己对 Promise 的理解。 new Promise() 的时候,传一个 executor 给 Promise. let promise = new Promise(function(resolve, reject) { // this ......
JavaScript Promises async await

Python全栈工程师之从网页搭建入门到Flask全栈项目实战(7) - 在线问答系统

1.项目源码/业务逻辑 百度网盘链接:链接:https://pan.baidu.com/s/13VNfrSJE6vcL3HP1J5T8ew 提取码:00s0,项目业务逻辑自行阅读 2.项目搭建 👇点击新建New Project,选择Flask项目 👇选择项目路径和使用Virtualenv新建项目 ......
在线问答 实战 工程师 网页 项目

Python全栈工程师之从网页搭建入门到Flask全栈项目实战(6) - Flask表单的实现

1.表单介绍 1.1.表单知识回顾 常见的表单元素: 表单标签<form> action:表单提交的URL地址 method:表单请求的方式(GET/POSt) enctype:请求内容的形式,如:application/x-www-form-urlencoded、multipart/form-da ......
Flask 表单 实战 工程师 网页

Python全栈工程师之从网页搭建入门到Flask全栈项目实战(4) - Flask模板语法与继承

1.Flask模板介绍 前置:理解渲染机制即上篇笔记中render_template()功能是如何实现的! 1)找到html文件地址 2)读取html文件中的内容 3)替换html中的特殊字符 4)将html的内容发送给浏览器 1 <!-- html文件 --> 2 3 <!DOCTYPE html ......
Flask 语法 实战 模板 工程师

Python全栈工程师之从网页搭建入门到Flask全栈项目实战(5) - Flask中的ORM使用

1.理解ORM ORM是MTV模型里面的Model模型 ORM(Object Relational Mapping),对象关系映射 举例:学生选课 学生和课程这两个实体,一个学生可以选择多门课程,一个课程可以被多名学生选择。这两个实体是多对多的关系,学生选课对应的数据库表 为什么要学习ORM ORM ......
Flask 实战 工程师 网页 项目

痞子衡嵌入式:我被邀请做贸泽电子&与非网联合推出的《对话工程师》节目嘉宾

《对话工程师》是「贸泽电子」赞助、「与非网」策划制作的一档网络节目,自2022年11月起,邀请不同技术领域的资深工程师,聊聊开发过程中的经验感悟,栏目共 10 期,痞子衡有幸被邀请做了第 4 期节目的嘉宾(12月5日在 「B站 - 与非网官方账号」里刚播出第 1 期)。 说起与《对话工程师》节目的结 ......
痞子 嵌入式 嘉宾 工程师 节目

软考复盘:我的一些复习经验分享

今年(2022)复习备考参加了软考高级资格中的系统架构设计师考试,为了多年前的一个所谓的高级职称资格的心愿,刚好也幸运地通过了考试。今天跟大家再次介绍一下软考,以及分享一些我的复习经验,希望对你有所帮助! ......
经验

五年经验的前端社招被问:CPU 和 GPU 到底有啥区别?

首先来看 CPU 和 GPU 的百科解释: CPU(Central ProcessingUnit,中央处理器):功能主要是解释计算机指令以及处理计算机软件中的数据 GPU(Graphics ProcessingUnit,图形处理器;又称显示核心、显卡、视觉处理器、显示芯片或绘图芯片):GPU 不同于 ......
前端 经验 CPU GPU

如何用 JavaScript 编写你的第一个单元测试

前言 测试代码是使代码安全的第一步。做到这一点的最好方法之一是使用单元测试,确保应用程序中的每个小功能都能发挥其应有的作用--特别是当应用程序处于边缘情况,比如无效的输入,或有潜在危害的输入。 为什么要单元测试 说到单元测试,有许多不同的方法。单元测试的一些主要目的是: 验证功能:单元测试确保代码做 ......
JavaScript 单元

JavaScript入门⑧-事件总结大全

事件(Event)是JavaScript的心脏,触发各种交互,让网页动起来。事件是浏览器网页可以监测到的行为,如页面加载、鼠标点击、键盘按键等。在这些事件中可以自定义事件处理程序,用于实现各种业务需求。 ......
JavaScript 事件 大全