blog icon indicating copy to clipboard operation
blog copied to clipboard

📒 Yang's Notes & Blog

Results 100 blog issues
Sort by recently updated
recently updated
newest added

1. Set 2. WeakSet 3. Map 4. WeakMap 5. 之间的特点 ---- ## Set ### 基本用法 ES6 提供了新的数据结构 Set。**它类似于数组,但是成员的值都是唯一的,没有重复的值。** **Set 本身是一个构造函数,用来生成 Set 数据结构。** ``` const s = new Set(); [2, 3,...

JavaScript

目录: 1. 概述 2. 作为属性名的 Symbol 3. 实例:消除魔术字符串 4. 属性名的遍历 5. Symbol.for(),Symbol.keyFor() 6. 实例:模块的 Singleton 模式 7. 内置的Symbol值 ## 概述 ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。 ES6 引入了一种新的**原始数据类型Symbol**,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。 ###...

JavaScript

目录: `Proxy` 1. 概述 2. Proxy 实例的方法 3. Proxy.revocable() 4. this 问题 1. 实例:Web 服务的客户端 `Reflect` 1. 概述 1. 静态方法 1. 实例:使用 Proxy 实现观察者模式 ---- ## 概述 Proxy 用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程。...

JavaScript

每一节都很重要,是ES6的基础,对于后面内容的理解是很重要的铺垫 ### 目录: 1. 字符串的扩展 2. 正则的扩展 3. 数值的扩展 4. 函数的扩展 5. 数组的扩展 6. 对象的扩展 --- # 字符串的扩展 ES6 加强了对 Unicode 的支持,并且扩展了字符串对象。 目录: 1. 字符的 Unicode 表示法 2. codePointAt() 3....

JavaScript

像`SCSS`这样的被称为 **"CSS预处理器"(css preprocessor)**。 它的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件。 定义了一种新的专门的编程语言,编译后成正常的CSS文件。为CSS增加一些编程的特性,无需考虑浏览器的兼容问题,让CSS更加简洁,适应性更强,可读性更佳,更易于代码的维护等诸多好处。 CSS预处理器语言:SCSS(Sass)、LESS等 ## Directory: 1. 什么是Sass 2. 安装和使用 3. 语法 1. 基本规则 2. SassScript 3. @规则和指令 4. Control Directives 5. @function 4. Sass与SCSS的异同 5. Sass与Less的比较 #...

CSS

## 同源政策 所谓“同源”指的是”三个相同“。 1. 协议相同 2. 域名相同 3. 端口相同 同源政策的目的,是为了保证用户信息的安全,防止恶意的网站窃取数据。 随着互联网的发展,“同源政策”越来越严格。目前,如果非同源,共有三种行为受到限制。 1. Cookie、LocalStorage 和 IndexedDB 无法读取。 2. DOM 无法获得。 3. AJAX 请求无效(可以发送,但浏览器会拒绝接受响应)。 虽然这些限制是必要的,但是有时很不方便,合理的用途也受到影响。下面,将详细介绍,如何规避上面三种限制。 # Cookie Cookie 是服务器写入浏览器的一小段信息,只有同源的网页才能共享。但是,两个网页一级域名相同,只是二级域名不同,浏览器允许通过设置`document.domain`共享 Cookie。(这种方法又被称为 降域) -...

JavaScript

# CSS3 CSS3是在CSS的接触上增加了很多新的特性,与低版本的CSS并不冲突 介绍一些常用的特性 ## 文本 ### `text-overflow` - `clip` 剪切超出文本 - `ellipsis` 显示省略号 (需要与 `overflow: hiddien ; white-space: nowrap` 合用) ## 换行 ### `word-wrap` 允许长单词或 URL 地址换行到下一行 - `normal`...

HTML
CSS

## 数据类型 JavaScript 语言的每一个值,都属于某一种数据类型。共有六种数据类型。(ES6 又新增了第七种 Symbol 类型的值) 1. 数值(number):整数和小数(比如1和3.14) 2. 字符串(string):字符组成的文本(比如”Hello World”) 3. 布尔值(boolean):true(真)和false(假)两个特定值 4. undefined:表示“未定义”或不存在,即由于目前没有定义,所以此处暂时没有任何值 5. null:表示无值,即此处的值就是“无”的状态。 6. 对象(object):各种值组成的集合 - 通常,我们将数值、字符串、布尔值称为原始类型(也叫基本类型/简单类型)(primitive type)的值,即它们是最基本的数据类型,不能再细分了。 - 而将对象称为引用类型(也叫合成类型/复杂类型)(complex type)的值,因为一个对象往往是多个原始类型的值的合成,可以看作是一个存放各种值的容器。 - 至于undefined和null,一般将它们看成两个特殊值。 对象又可以分成三个子类型。 1....

JavaScript

## 模块化的价值 最主要的目的: 1. 解决命名冲突 2. 依赖管理 其他价值 1. 提高代码可读性 2. 代码解耦,提高复用性 ## 前端模块化 在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可;如今CPU、浏览器性能得到了极大的提升,很多页面逻辑迁移到了客户端(表单验证等),随着web2.0时代的到来,Ajax技术得到广泛应用,jQuery等前端库层出不穷,前端代码日益膨胀 这时候JavaScript作为嵌入式的脚本语言的定位动摇了,JavaScript却没有为组织代码提供任何明显帮助,甚至没有类的概念,更不用说模块(module)了,JavaScript极其简单的代码组织规范不足以驾驭如此庞大规模的代码 ## 模块 既然JavaScript不能handle如此大规模的代码,我们可以借鉴一下其它语言是怎么处理大规模程序设计的,在Java中有一个重要的概念——package,逻辑上相关的代码组织到同一个包内,包内是一个相对独立的王国,不用担心命名冲突什么的,那么外部如果使用呢?直接import对应的package即可 import java.util.ArrayList; 遗憾的是JavaScript在设计时定位原因,没有提供类似的功能,开发者需要模拟出类似的功能,来隔离、组织复杂的JavaScript代码,我们称为模块化。 一个模块就是实现特定功能的文件,有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。模块开发需要遵循一定的规范,各行其是就都乱套了 规范形成的过程是痛苦的,前端的先驱在刀耕火种、茹毛饮血的阶段开始,发展到现在初具规模,简单了解一下这段不凡的历程 ## 函数封装 我们在讲函数的时候提到,函数一个功能就是实现特定逻辑的一组语句打包,而且JavaScript的作用域就是基于函数的,所以把函数作为模块化的第一步是很自然的事情,在一个文件里面编写几个相关函数就是最开始的模块了 ``` function fn1(){...

Engineering
JavaScript

this篇也有介绍 #35 ## 深入理解 call、apply 和 bind 在JavaScript 中,call、apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果。 本文将对这三个方法进行详细的讲解,并列出几个经典应用场景。 ## 1、call(thisArgs [,args...]) 该方法可以传递一个thisArgs参数和一个参数列表,thisArgs 指定了函数在运行期的调用者,也就是函数中的 this 对象,而参数列表会被传入调用函数中。thisArgs 的取值有以下4种情况: - 不传,或者传null,undefined, 函数中的 this 指向...

point