EJoft的博客

本篇属于css学习笔记，在学习flex布局时有一些经常用到的属性，如果长期不用就会遗忘，在这里做一下记录，方便以后查看，欢迎大家提出意见。flex is a new value added to the CSS display property. Along with inline-flex it causes the element that it applies to to become ...

背景：在练习flex布局时无意间发现img元素与同级div元素之间存在间隙，网上虽然有解决方法，但是却不知道为什么这么做，在这里记录下我的观点。原因代码示例：<header> <img class="profile-thumbnail" src="https://freecodecamp.s3.amazonaws.com/quincy-twitter-photo....

当我们在开发较大的CSS文件时，会遇到使用重复变量的情况，此时可以使用 CSS变量 来简化开发，具体看代码示例。用法// 声明css变量element { --main-bg-color: brown;}// 使用css变量element { background-color: var(--main-bg-color);}demo这里使用 MDN 的例子进行说明.o...

背景：最近在参考网上的开源项目做CSS的练习，看到其中用到了 @import ，在这里进行记录（文中部分参考需要科学上网）。定义与用法：@import可以在一个CSS文件中用来导入另一个CSS文件的样式@import必须在文件的第一行（但是在@charset语句之后）@import支持媒体查询（media query），即只会在符合定义的屏幕上导入CSS规则demo语法（synt...

在用CSS调整布局时，我们经常能用到max-width与width，这里简单分析一下两者的使用场景。max-width经常用在设置元素最大宽度上，可以直接设置像素值或者百分比，看如下代码。img { max-width: 100%; display: block; height: auto; margin: 0 auto;}以上代码可以设置tupian d...

公司使用微服务的架构进行开发，这就会带来频繁的下载制品，上传镜像的操作，为此利用 electron 开发一个简单的自动化工具就显得尤为重要，以下是摘自官方文档的内容，对 electron 进行记录。Main and Render ProcessIn Electron, the process that runs package.json’s main script is called the...

本篇博客依然是娱乐博客，案例搬运自 freeCodeCamp 就当代码写累时的消遣，供大家娱乐。用CSS画一轮新月，基本的思路是用到 box-shadow 这个属性，先画一个圆，在给圆添加阴影，我们的新月就成了，以下为示例与代码。<style> .center { position: absolute; margin: auto; top: 0; ...

本篇博客记录JavaScript中闭包的使用，这也是在面试过程中被问到的点。概念A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a ...

JavaScript中的 Global 对象中 encodeURI 和 encodeURIComponent 方法可以对 URI 进行编码，以便发送给浏览器。有效的 URI 中不能包含某些字符，例如空格，而这两个方法可以对这些字符进行编码，用特殊的UTF-8字符代替。查看以下代码，可以看到 encodeURI 后的结果是出了空格转化为 %20， 其他的都没变， 但 encodeURICompon...

写前端代码是经常会用到 location 对象来进行地址参数或者位置参数的操作，需要注意的 location 既是 window 对象的属性，又是 document 对象的属性。查询字符串参数getQueryStringArgs(): any { let qs = window.location.search.length > 0 ? window.location.search....

这是一篇娱乐博客，记录在freeCodeCamp看到的用纯CSS画企鹅的案例，提前祝大家元旦快乐。以下是效果图：<style> .penguin { /* change code below */ --penguin-skin: black; --penguin-belly: gray; --penguin-beak: yellow; ...

在写js代码过程中，超时调用 setTimeout 与 间隔调用 setInterval 方法会经常用到setTimeout基本使用JavaScript是一个单线程的解释器，因此一段时间内只能执行一段代码，为了要控制执行的代码，就会有一个JavaScript的任务队列，这些任务会按照他们添加到队列的顺序执行。 setTimeout 的第二个参数会告诉JavaScript再过多长时间把当前任务...

递归在程序开发过程中会经常用到，在此记录书中看到的几个好的例子以及注意点。递归函数示例最经典的求阶乘递归程序function factorial(num){ if (num <= 1){ return 1; } else { return num * factorial(num-1); }}调用过程的问题尝试如下调用va...

Every object created by a constructor has an implicit reference (called the object’s prototype) to the value of its constructor’s “prototype” property. Furthermore, a prototype may have a non-null im...

原型是JavaScript中比较重要的概念，通过原型实现了面向对象编程，这篇博客记录下一些重要的知识点。理解原型对象。JavaScript中，无论什么时候，只要创建了一个新函数，机会根据一组特定的规则为该函数创建一个 prototype 属性，这个属性指向函数的原型对象。默认情况下，所有的原型对象都会自动获得一个 constructor（构造函数）属性，这个属性是一个指向 prototyp...

面向对象的语言有一个标志，那就是他们都有类的概念，通过类可以创建任意多个具有相同属性和方法的对象。但是ECMAScript中没有类的概念。 ——《JavaScript高级程序设计（第三版）》ECMAScript-262把对象定义为“无序属性的集合，其属性可以包含基本值、对象或者函数。” 对象的每个属性或者方法都有一个名字，而每个名字映射一个值，可以把对象想象成散列表。ECMAScript中...

为了便于操作基本类型值，ECMAScript还提供了3个特殊的引用类型：Boolean、 Number、 String。我们先来看几行简单的代码。var s1 = 'some text';var s2 = s1.subString(1);第一行代码创建了一个基本类型的字符串，运行到第二行代码时，访问过程处于一种读取模式，也就是要从内存中读取这个字符串的值，在读取模式中访问字符串时，后台会...

在JavaScript函数内部，有两个特殊的对象： arguments 和 this， arguments 是一个类数组对象，包含传入函数中的所有对象。 arguments 还有一个 callee 的属性，该属性是一个指针，指向拥有这个 arguments 对象的函数。arguments首先来看一个经典的阶乘函数function factorial(num) { if (n...

JavaScript作为2019年流行榜排名第一的语言，有必要好好学习一下，今天看一下JavaScript方法没有重载这一特性。基础Functions are one of the fundamental building blocks in JavaScript. A function is a JavaScript procedure—a set of statements that p...

在刷freeCodeCamp巩固基础时，遇到了以下一段关于label 中for属性的使用，以前从没留意过，特此记录下。It is considered best practice to set a for attribute on the label element, with a value that matches the value of the id attribute of the ...

ECMAScript 中所有函数的参数都是按值传递。也就是说，把函数外部的值复制给函数内部的参数，就和把值从一个变量复制到另一个变量一样 ——《JavaScript高级程序设计（第三版）》本篇博客将围绕书中这一知识点进行深入分析。相关概念首先要弄清楚一些概念：变量、值、值的类型、引用、对象。如果这些概念没搞清楚，就没办法讨论这个问题。变量：变量就是一个定义在某个作用域的名字(nam...

script元素script元素内引入JavaScript代码包含在<script>中的代码将会从上到下一次解释，在解释器对<script>中的代码求值完毕之前，页面中的其余内容都会不会被浏览器加载或显示<script>function sayScript() { // wrong alert("</script>") ...