(注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!) (注2:更多内容请查看我的目录。)
技术的诞生是为了解决某个问题,模块化也是。 随着前端的发展,web技术日趋成熟,js功能越来越多,代码量也越来越大。之前一个项目通常各个页面公用一个js,但是js逐渐拆分,项目中引入的js越来越多. 在js模块化诞生之前,开发者面临很多问题:
平时写CSS,感觉有很多多余的代码或者不好实现的方法,于是有了预处理器的解决方案,主旨是write less &do more。其实原生css中,用上css变量也不差,加上bem命名规则只要嵌套不深也能和less、sass的嵌套媲美。在一些动画或者炫酷的特效中,不用js的话可能是用了css动画、svg的animation、过渡,复杂动画实现用了js的话可能用了canvas、直接修改style属性。用js的,然后有没有想过一个问题:“要是canvas那套放在dom上就爽了”。因为复杂的动画频繁操作了dom,违背了倒背如流的“性能优化之一:尽量少操作dom”的规矩,嘴上说着不要,手倒是很诚实地ele.style.prop = <newProp>,可是要实现效果这又是无可奈何或者大大减小工作量的方法。
今天我们来聊聊webpack中注入环境变量的各种姿势,或者你会觉得注入环境变量通过命令行注入不就可以了吗?
JS的变量可能包含两种不同数据类型的值,基本类型和引用类型; 基本类型是指简单的数据段,引用类型是指可能由多个值构成的对象; JS高级程序设计第三章介绍了变量分为 5种简单数据类型(string/number/undefined/null/boolean)--------基本类型(按值访问): 这五种数据类型是按值访问的,可以操作保存在变量中的实际的值. 1个复杂数据类型(object)--------引用类型(按索引访问): 引用类型的值是保存在内存中的对象;js不予许直接访问内存中的位置,也就是说不能直
根据公司业务要求而定,一般: 主流程测试:Chrome 30+、IE9+; 完整测试: Chrome 21、IE8+、360浏览器、微信webview/QQ手机浏览器。
变量提升 时js里一个很特殊的概念,这和js代码的 编译和执行,作用域 息息相关。
平时经常会逛 Github,除了一些 star 极高的大项目外,还会在 Github 上发现很多有意思的小项目。项目或是想法很有趣,或是有不错的技术点,读起来都让人有所收获。所以准备汇总成一个「漫游Github」系列,不定期分享与解读在 Github 上偶遇的有趣项目。本系列重在原理性讲解,而不会深扣源码细节。
本系列文章针对目前常见的面试题,仅提供了相应的核心原理及思路,部分边界细节未处理。后续会持续更新,希望对你有所帮助。
我们知道最常见的模块化方案有CommonJS、AMD、CMD、ES6,AMD规范一般用于浏览器,异步的,因为模块加载是异步的,js解释是同步的,所以有时候导致依赖还没加载完毕,同步的代码运行结束;CommonJS规范一般用于服务端,同步的,因为在服务器端所有文件都存储在本地的硬盘上,传输速率快而且稳定。
在线教室中台提供封装了核心能力的教室 SDK,业务方基于教室 SDK 开发面向用户的在线教室 App。最近对教室 SDK 做一次比较大的改动时,我遇到了一个懵逼的问题。这个问题耗费了我 3 天左右时间,让我压力一度大到全身发热。当时虽然解决了问题,但并没有很理解原因。直到一个多月后,才有时间做一些更深入的分析,并写下这篇文章。
node.js是一个基于Google V8引擎的、跨平台的JavaScript运行环境,不是一个语言
js的内存机制在很多前端开发者看来并不是那么重要,但是如果你想深入学习js,并将它利用好,打造高质量高性能的前端应用,就必须要了解js的内存机制。对于内存机制理解了以后,一些基本的问题比如最基本的引用数据类型和引用传递到底是怎么回事儿?比如浅复制与深复制有什么不同?还有闭包,原型等等就迎刃而解了。
如果一个页面中有十几个地方用到Ajax,那么我们需要写十几次open()、十几次send()、十几次获取xhr对象; 代码重复相当多,而凡是有代码重复的地方,就有封装的可能;
模块是Node.js里面一个很基本也很重要的概念,各种原生类库是通过模块提供的,第三方库也是通过模块进行管理和引用的。本文会从基本的模块原理出发,到最后我们会利用这个原理,自己实现一个简单的模块加载机制,即自己实现一个require。
举个例子:一个公司需要正常运转,就有市场部,技术部,人事部等等,这每个部门就相当于一个模块,在前端项目中也就有比如专门网络请求的模块,错误处理的模块,专门渲染的模块。
模块化的开发方式可以提高代码复用率,方便进行代码的管理。通常一个文件就是一个模块,有自己的作用域,只向外暴露特定的变量和函数。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。参见阮一峰老师的文章 module-loader 。
项目中有这么一个需求,就是按需启动mock功能。考虑到mock只是在特定情况下,所以考虑通过 cross-env 来处理。
从ECMAScript 2015开始,JavaScript引入了模块的概念。TypeScript也沿用这个概念
Express的源码还是比较复杂的,自带了路由处理和静态资源支持等等功能,功能比较全面。与之相比,本文要讲的Koa就简洁多了,Koa虽然是Express的原班人马写的,但是设计思路却不一样。Express更多是偏向All in one的思想,各种功能都集成在一起,而Koa本身的库只有一个中间件内核,其他像路由处理和静态资源这些功能都没有,全部需要引入第三方中间件库才能实现。下面这张图可以直观的看到Express和koa在功能上的区别,此图来自于官方文档:
一般我们说到JS的数据类型指的是它的原始(Primitive types)数据类型(共有6种):
因此如果想要给一个变量赋值一个引用类型的值,那么则必须在堆内存中为这个值分配空间,由于这种值的大小不固定,因此不能把她保存到栈内存中,但是内存地址的大小是固定的,因此可以将内存地址保存在栈内存中。这样,在查询引用类型的变量时,就可以首先从栈中读取内存地址,在找到在堆内存中保存的值。这种访问方式叫做引用访问,因为我们不是操作的实际的值,而是被那个值引用的对象。
##下载node.js 下载并解压好 node.js,本文下载的是v8.11.1 windows64位版本。
UDP在传输数据之前不需要先建立连接,远地主机的运输层在接收到UDP报文后,不需要确认,提供不可靠交付。总结就以下四点:
最近在学习bash脚本语法,但是如果对bash语法不是熟手的话,感觉非常容易出错,比如说:显示未定义的变量shell中变量没有定义,仍然是可以使用的,但是它的结果可能不是你所预期的。举个例子:
一、基本类型和引用类型的值 1.基本类型和引用类型的值 基本类型值:指那些保存在栈内存中的简单数据,即这种值完全保存在内存中的一个位置,他们所占据的空间大小是固定的。 引用类型值:指那些保存在堆内存中的对象,这些类型的真正数据是保存在堆内存中的,而同时在栈内存中保存的只是一个指针,这个指针指向的是这个对象在堆内存中的一块地址。 基本类型的复制:基本类型在内存中占有的空间大小是固定的,复制的时候会重新在栈内存中开辟一块空间,是按值来访问的。 引用类型的复制:由于这种对象所占的大小是不固定的,是放在堆内
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
JavaScript 有一个很长的处理模块化代码的历史,TypeScript 从 2012 年开始跟进,现在已经实现支持了很多格式。不过随着时间流逝,社区和 JavaScript 规范已经收敛为名为 ES 模块(或者 ES6 模块)的格式,这也就是我们所知道的 import/export 语法。
原创不易,未经作者允许禁止转载!! 认识Plugin Loader是用于特定的模块类型进行转换; Plugin可以用于执行更加广泛的任务,比如打包优化、资源管理、环境变量注入等; 常用Plugin CleanWebpackPlugin 每次修改了一些配置,重新打包时,都需要手动删除dist文件夹: 我们可以借助于一个插件来帮助我们完成,这个插件就是CleanWebpackPlugin; 安装: npm install clean-webpack-plugin --save 配置: const { Clea
# 原始值与引用值 在把一个值赋给变量时,JS引擎必须确定这个值是原始值还是引用值(原始值有6种:Undefined,Null,Boolean,Number,String和Symbol) 原始值(primitive value)就是最简单的数据(原始值大小固定,因此保存在栈内存) 保存原始值的变量是按值(by value)访问的,因为操作的就是存储在变量中的实际值 引用值(reference value)则是由多个值构成的对象(引用值是对象,保存在堆内存) 引用值是保存在内存中的对象 与其他语言不同,J
then/promise项目是基于Promises/A+标准实现的Promise库,从这个项目当中,我们来看Promise的原理是什么,它是如何做到的,从而更加熟悉Promise
最近在整理 JavaScript 的时候发现遇到了很多面试中常见的面试题,本部分主要是作者在 Github 等各大论坛收录的 JavaScript 相关知识和一些相关面试题时所做的笔记,分享这份总结给大家,对大家对 JavaScript 的可以来一次全方位的检漏和排查,感谢 CavsZhouyou 的付出,原文链接放在文章最下方,如果出现错误,希望大家共同指出!
作用域是JS中一个很基础但是很重要的概念,面试中也经常出现,本文会详细深入的讲解这个概念及其他相关的概念,包括声明提升,块级作用域,作用域链及作用域链延长等问题。
最近在使用 Vite4.0 构建一个中型前端项目的过程中,遇到了一些坑,也做了一些项目在构建生产环境时的优化,在这里做一个记录,以便后期查阅。(完整配置在后面)
作者:汪娇娇 日期:2016.10.12 一、原始值 1、定义:本身很简单,不能由其他值组成的值,例如5、“foo”、true、null和undefined等,因为它们是不可细化的。也就是说,数字是数字,字符是字符,布尔值则是true或false,null和undefined就是null和undefined。 2、存储和复制:复制是真实值复制。 都知道,我们将字符串“foo”存储到myString中后,也同时将它存储到了内存中。myString的值复制给myStringCopy后,因为复制是真实值复制,而不
1、定义:本身很简单,不能由其他值组成的值,例如5、“foo”、true、null和undefined等,因为它们是不可细化的。也就是说,数字是数字,字符是字符,布尔值则是true或false,null和undefined就是null和undefined。
VsCode自从诞生以来,以其各自优异的特性迅速走红。尤其是对于前端开发小伙伴来说,几乎成为必不可少的开发工具。所以,熟练掌握VsCode的各自使用技巧与调试技巧会让你的日常开发工作效率倍增。本文将会以大量图文的方式,从下面几个方面详细介绍VsCode的各种技巧:
按照上述操作以后,才可以正常访问新添加的页面,之后才开始对新页面进行正常开发。但是这样的机械化步骤我们完全可以用代码帮我们执行,更进一步,对于一些简单的页面,我们甚至可以一键生成页面,包括从后端请求数据等操作。
我们在使用Node.js开发服务端时通常会使用TypeScript来开发大型项目,但是使用ts-node进行全量编译时经常遇到编译速度慢的问题,通常是修改一行代码编译两分钟。这时我们需要使用增量编译来优化编译速度,及其他的文件在项目启动时进行全量编译,开发时修改了哪个TS文件就编译成对应的JS文件。
如果我们有内存溢出,程序占用的内存会越来越大,最终引起客户端卡顿,甚至无响应。如果我们使用Node.js做后端应用,因为后端程序会长时间运行,如果有内存溢出,造成的后果会更严重,服务器内存可能会很快就消耗光,应用不能正常运行。
关于never类型的详细解释可以看一下vue的作者尤雨溪的回答:TypeScript中的never类型具体有什么用?
cmd打开命令框,找到自己的less文件的根目录,复制路径到命令行中,按Enter执行。注意,D:是换到D盘下,cd是打开目录
正所谓条条道路通罗马,上次我们使用了Selenium自动化工具来爬取网易云的音乐评论,Selenium自动化工具可以驱动浏览器执行特定的动作,获得浏览器当前呈现的页面的源代码,做到可见即可爬,但需要等网页完全加载完,也就是JavaScript完全渲染出来才可以获取到当前的网页源代码,这样的爬取效率太低了、爬取速度太慢了。
因为JavaScript具有自动垃圾回收机制,所以对于前端开发来说,内存空间并不是一个经常被提及的概念,很容易被大家忽视。特别是很多不是计算机专业的朋友在进入到前端之后,会对内存空间的认知比较模糊,甚至有些人干脆就是一无所知。
压缩项目打包后的体积大小、提升打包速度,是前端性能优化中非常重要的环节,笔者结合工作中的实践总结,梳理出一些 常规且有效 的性能优化建议
https://juejin.cn/post/6949385808755294245
领取专属 10元无门槛券
手把手带您无忧上云