叨唠-CSDN博客

原创 gulp：流处理——stream-combiner2

这是流s3的流组合器的续篇。将管道转换为单个流，Combine返回一个流，该流向第一个流进行写入，并从最后一个流进行读取。监听“error”将从管道内的所有流接收错误。使用：var combine = require('stream-combiner2')gulp.task("revCSS", () => { let combined = combiner.obj([ gulp.src(config.css.SRC), gulpif( .

2020-09-01 19:26:54 255

转载运算符优先级

下面的表将所有运算符按照优先级的不同从高（20）到低（1）排列。优先级运算类型关联性运算符 20 圆括号 n/a（不相关） ( … ) 19 成员访问从左到右 … . … 需计算的成员访问从左到右 … [ … ] new(带参数列表) n/a new … ( … ) 函数调用从左到右 … (…) 可选链（Optional chaining）从左到右 ?. ...

2020-09-01 16:53:04 456

原创 springmvc的web.xml和springmvc.xml配置

要有欢迎页面的配置配置前端控制器前端控制器的框架都是servlet，tomcat启动时，就要创建，然后监视客户端的请求，配置启动项，运行到启动标签时，对象已经被创建，所以在创建之前要配置好springmvc.xml的引入。set方法用于注入，上下文的配置路径，  <servlet> <servlet-name>springmvc</servlet-name> <servlet-class

2020-08-31 21:02:30 2121

原创 gulp：条件语句插件——gulp-if

Condition条件判断使用例子：Only uglify the content if the condition is true, but send all the files to the dist folder（如果条件为真，只修改内容，但将所有文件发送到dist文件夹）var gulpif = require('gulp-if');var uglify = require('gulp-uglify'); var condition = true; // TODO: add

2020-08-31 17:41:39 408

原创使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序——Electron

使用Electron可以开发js版的桌面应用，Electron的官网：http://www.electronjs.org/来到官网我们可以看到很多信息，但是作为前端开发的我，现在才知道，一直用的vscode编辑器竟然就是用js写的！使用vscode的都知道，功能想当强大，那我们我们用js、css、html等前端技术就可以开发自己的强大软件。环境配置：node、electron包下载electron包的时候，国外的源非常慢，最好还是用淘宝镜像吧//查看node安装是否成功$ .

2020-08-29 14:04:41 868

原创 ASCII码、Unicode码、UTF-8编码

标准ASCII 码也叫基础ASCII码，使用7 位二进制数（剩下的1位二进制为0）来表示所有的大写和小写字母，数字0 到9、标点符号，以及在美式英语中使用的特殊控制字符[1]。其中：0～31及127(共33个)是控制字符或通信专用字符（其余为可显示字符），如控制符：LF（换行）、CR（回车）、FF（换页）、DEL（删除）、BS（退格)、BEL（响铃）等；通信专用字符：SOH（文头）、EOT（文尾）、ACK（确认）等；ASCII值为8、9、10 和13 分别转换为退格、制表、换行和回车字符。它们...

2020-08-26 10:12:08 4074

原创 JSON对象

1、JSON这个对象除了parse()和stringify()方法，本身并没有其他作用，也不能被调用或者作为构造函数调用。JSON是一种语法，用来序列化对象、数组、数值、字符串、布尔值和null。JavaScript不是JSON，JSON也不是JavaScript。兼容IE82、JSON.parse()方法用来解析JSON字符串，构造由字符串描述的JavaScript值或对象。提供可选的reviver函数用以在返回之前对所得到的对象执行变换(操作)。如果指定了reviver...

2020-08-25 15:35:55 399

原创 Number类型

Number数字类型1、Number对象由Number()构造器创建。JavaScript的Number类型为双精度IEEE 754 64位浮点类型。最近出了stage3BigInt任意精度数字类型，已经进入stage3规范。2、关于number对象和number字面量的区别：new Number(value); var a = new Number('123'); // a === 123 is falsevar b = Number('123'); // b === 123 i...

2020-08-25 11:27:21 390

原创内置日期对象Date

unix时间戳是从1970年1月1日（UTC/GMT的午夜）开始所经过的秒数，不考虑闰秒。在大多数的UNIX系统中UNIX时间戳存储为32位，这样会引发2038年问题或Y2038。UTC协调世界时协调世界时，又称世界统一时间、世界标准时间、国际协调时间。由于英文（CUT）和法文（TUC）的缩写不同，作为妥协，简称UTC。原子时：IAT（international atomic time），以物质的原子内部发射的电磁振荡频率为基准的时间计量系统。世界时UT[1]即格林尼治[1]...

2020-08-24 17:18:14 306

原创 gulp：压缩CSS插件——gulp-clean-css

依赖https://github.com/jakubpawlowicz/clean-css#important-40-breaking-changes

2020-08-20 18:22:29 1036

原创 String字符串方法

字符串的方法都不会改变原字符串1、charAt()方法从一个字符串中返回指定的字符。str.charAt(index)字符串中的字符从左向右索引，第一个字符的索引值为 0，最后一个字符（假设该字符位于字符串 stringName 中）的索引值为stringName.length - 1。如果指定的 index 值超出了该范围，则返回一个空字符串。...

2020-08-19 15:09:16 438

原创正则表达式面试题

1、给一个连字符串例如：get-element-by-id转化成驼峰形式。var str = "get-element-by-id";var reg = /-(\w)/g;console.log(str.replace(reg, function(match, p1){ return p1.toString().toUpperCase();})); //getElementById字符串的转为大写：toUpperCase()；转为小写：toLowerCase()2、匹配一..

2020-08-17 20:05:11 3231 2

原创正则表达式的相关方法

一、正则对象的方法讨论是否是全局匹配，因为全局匹配，会修改该正则对象的lastIndex的值，其他正则实例对象的lastIndex值不被修改，使得下一次用正则方法匹配的时候，从lastIndex的位置开始。lastIndex是正则表达式的一个可读可写的整数型属性，用来指定下一次匹配的起始索引。RegExp.lastIndex属性的属性特性： writable true enumerable false configurable false 只有正则表达式使...

2020-08-12 16:21:49 327 1

原创 JavaScript的位操作符

按位与（ AND） a & b 对于每一个比特位，只有两个操作数相应的比特位都是1时，结果才为1，否则为0。按位或（OR） a | b 对于每一个比特位，当两个操作数相应的比特位至少有一个1时，结果为1，否则为0。按位异或（XOR） a ^ b 对于每一个比特位，当两个操作数相应的比特位有且只有一个1时，结果为1，否则为0。按位非（NOT） ~ a 反转操作数的比特位，即0变成1，1变成0。左移（Left shift） a

2020-08-03 22:25:56 121

原创解构赋值原理

ES6变量的解构赋值本质上是“模式匹配”,只要等号两边的模式相同，左边的变量就会被赋予匹配的右边的值，如果匹配不成功变量的值就等于undefinedES6中只要某种数据有Iterator接口（也就是可以循环迭代 Iterable对象），都可以进行数组的解构赋值数组解构Iterable对象解构字符串：Set对象Map对象let map = new Map();map.set("a",1) .set("b",2) .set("c",3);let [[x,m],[y

2020-07-28 10:21:40 988

原创内置对象Math

Math内置对象Math是一个内置对象，它拥有一些数学常数属性和数学函数方法。Math不是一个函数对象。Math用于Number类型。它不支持BigInt。注意很多Math函数都有一个精度，而且这个精度在不同实现中也是不相同的。这意味着不同的浏览器会给出不同的结果，甚至，在不同的系统或架构下，相同的 JS 引擎也会给出不同的结果！常用方法Math.abs(x)返回一个数的绝对值。Math.ceil(x)返回大于一个数的最小整数，即一个数向上取整后的值...

2020-07-27 14:29:32 345

原创 Generator生成器对象

生成器对象是由一个 generator function返回的,并且它符合可迭代协议和迭代器协议。function*这种声明方式(function关键字后跟一个星号）会定义一个生成器函数 (generator function)，它返回一个 Generator对象要传递给函数的一个参数的名称，一个函数最多可以有255个参数。生成器函数在执行时能暂停，后面又能从暂停处继续执行。调用一个生成器函数并不会马上执行它里面的语句，而是返回一个这个生成器的迭代器（iterator ）对象...

2020-07-21 19:59:21 367

原创 async和await

async 用于申明一个 function 是异步的，并且返回一个Promise对象。而 await 用在async函数内，用于等待一个异步方法执行完成。async和await的目的是：让异步代码，在写法上实现真正的同步编程的风格，使得代码简洁，可读性高。看一个例子：function resolveAfter2Seconds() { return new Promise(resolve => { setTimeout(() => { resolve('resol

2020-07-18 16:02:57 830

原创 Promise处理异步操作

Promise对象用于表示一个异步操作的最终完成 (或失败), 及其结果值.我的理解：Promise使得异步的写法不像之前那样一直回调，而可以用同步的代码书写格式去写异步代码。事件队列：js是单线程语言，代码在执行的过程中，宏任务会直接依次执行下去，当遇到定时器或者ajax请求时，他们的处理事件，是要等一定的时间（条件）后，比如：定时器的时间到达，ajax请求成功或失败，此时将再将他们的处理事件添加到事件队列中，而代码在执行的过程中，也会有微任务，Promise的处理函数就是微任务，...

2020-07-16 20:31:44 3045 1

原创事件循环和任务队列

终于理解了事件循环和事件队列，怎么说呢，有了ES5的Promise后，需要我重新思考事件的执行顺序以及机制。 console.log(1); const p = new Promise((resolve, reject) => { // 执行器函数同步回调 console.log(Promise.resolve().then(function () { console.log(5); })); $.get("https://.

2020-07-16 20:22:52 326

原创 Proxy和Reflect的理解

Proxy 对象用于定义基本操作的自定义行为（如属性查找、赋值、枚举、函数调用等）。接收两个参数：被代理者和处理代理的对象Proxy称为代理，当通过代理来操作被代理者时，会触发代理相关的代码；如果直接操作被代理者，不会触发代理相关代码。const handler = { get(target, prop, receiver){ console.log(target); 被代理者obj对象 {name: "zhu", age: 24} console.log(prop);

2020-07-14 20:08:01 2552

原创 ES6迭代协议——可迭代协议和迭代器协议

作为 ECMAScript 2015 的一组补充规范，迭代协议并不是新的内置实现或语法，而是协议。这些协议可以被任何遵循某些约定的对象来实现。可迭代协议：（for of循环）允许对象定义他的可迭代行为，比如在for of结构中，哪些值可以遍历到。在js中的某些类型是内置好的可迭代对象，比如：字符串、数组、类型数组、Map对象、Get对象等。而Object类型不可迭代。这些内置可迭代对象可以进行迭代的原因是内部实现了@@iterator 方法，即在该对象或该对象的原型链上有Symbol.iterato

2020-07-13 15:55:09 504

原创迭代器和生成器

Interator对象1、Symbol.iterator属性为每一个对象定义了默认的迭代器。该迭代器可以被 for...of 循环使用。【终于明白了js的内置方法】属性指向一个方法，以数组来讲，大部分属性名和方法名是相同的，但也有例外，比如：constructor属性指向的是Array方法，Symbol.iterator属性指向的values方法数组原型上的构造函数constructor，指向Array方法，所以可以这么调用Array方法：2、可以调用for of的原因（1）字.

2020-07-10 16:59:53 204

原创 for of循环

for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句Symbol.iterator为每一个对象定义了默认的迭代器。该迭代器可以被 for...of 循环使用。以下可以迭代的类型，都有Symbol.iterator属性。注意iterator接口可以调用next方法，与Symbol.iterator不同！！！一、可迭代类型1、迭代遍历数组...

2020-07-09 14:54:28 1242

原创 Set对象

1、Set对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。在 ECMAScript 2015规范中-0 0 +0 是完全相等的。NaN和undefined都可以被存储在Set 中，NaN之间被视为相同的值（NaN被认为是相同的，尽管 NaN !== NaN）。引用值地址不能相同，原始值不能相等，这才能确保值的唯一性。2、方法（1）add方法add方法返回该Set对象，所以可以链式调用 let arr = [3,4]; let m...

2020-07-08 17:31:40 1284

原创 Map对象

Map对象兼容性ES6 Edge12Map对象保存键值对，并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。一个Map对象在迭代时会根据对象中元素的插入顺序来进行— 一个 for...of循环在每次迭代后会返回一个形式为[key，value]的数组。1、set方法赋值（1）set()方法为Map对象添加或更新一个指定了键（key）和值（value）的（新）键值对。（2）因为 Set() 方法返回 Map 对象本身，所以你可以像下面这...

2020-07-08 16:25:03 3716

原创布尔值Boolean

1、Boolean()方法和!!的结果是一样的，都可以来判断某个值是truth或2、== 比较的时候，会调用值的toString方法，根据值的类型调用该值原型上的toString方法，进行比较。toSting不会修改原值。

2020-06-28 17:13:07 334

原创 ES6 class类

类实际上是个“特殊的函数”，就像你能够定义的函数表达式和函数声明一样，类语法有两个组成部分：类表达式和类声明。函数声明和类声明之间的一个重要区别是函数声明会提升，类声明不会。类中定义的方法，在原型prototype上，类中constructor构造函数定义的方法和属性是实例对象的 class Foo { constructor(){ this.a = 1; this.b = 2; } fun

2020-06-28 17:04:09 277

原创数组练习题

1、不使用for循环，实现一个方法，传入m n两个参数，返回一个长度为m，每项为n的数组（1）递归，使用递归也特别注意return的使用。 function func(m, n) { if(typeof m !== "number" && m <= 0){ return arr; }else { arr[arr.length] = n;

2020-06-24 15:15:38 620

原创 instanceof

instanceof运算符用于检测构造函数的prototype属性（构造函数原型）是否出现在某个实例对象的原型链上。instanceof运算符用来检测constructor.prototype是否存在于参数object的原型链上。// 定义构造函数function C(){} function D(){} var o = new C();o instanceof C; // true，因为 Object.getPrototypeOf(o) === C.prototyp...

2020-06-24 13:45:08 267

原创包装类对象

字符串、布尔值、数字都是可以调用方法的，尤其是字符串，有很多的方法可以调用，那么他们的原理是什么呢？1、字符串的原型上的方法var str = new String(); 空字符串实例该实例的原型上的方法有：2、布尔值的原型上的方法var flag = new Boolean(); 值为false的布尔类型我们知道布尔类型也重写了toString方法 var flag = true; console.log(flag.toString(.

2020-06-23 15:55:55 341

原创 Symbol类型

symbol是一种基本数据类型（primitive data type）。每个从Symbol()返回的symbol值都是唯一的。不支持语法："new Symbol()"：从 ECMAScript 6 开始不再被支持原始数据类型创建一个显式包装器对象。然而，现有的原始包装器对象，如new Boolean、new String以及new Number，因为遗留原因仍可被创建。所以目前只有Symbol类型不能创建包装器对象。直接使用Symbol()创建新的symbol类型，并用一个可选的字符...

2020-06-23 14:33:27 1978

原创 new操作符；构造函数的继承；构造函数的this指向；函数执行时的this指向

1、new操作符之前的修改原型申明一个函数的时候，该函数的prototype属性指向原型，且原型中默认是constructor属性，指向该函数。注意修改函数的prototype，是修改引用指向，还是修改了对象本身。修改引用指向，就是修改了原型，指向一个新的对象： function Foo(){ this.name = "foo"; this.age = 24 } console.log(Foo.

2020-06-22 16:44:21 791

转载继承与原型链

在 ES2015/ES6 中引入了class关键字，但那只是语法糖，JavaScript 仍然是基于原型的，它是动态的。继承：每个实例对象（ object ）都有一个私有属性（称之为 __proto__ 兼容性：IE11，不是标准）指向它的构造函数的原型对象（prototype）。该原型对象也有一个自己的原型对象( __proto__ ) ，层层向上直到一个对象的原型对象为null。根据定义，null没有原型，并作为这个原型链中的最后一个环节。几乎所有 JavaScript 中的对象都...

2020-06-22 15:03:58 166

原创 Object对象原型

4、对象原型的操作（1）Object.setPrototypeOf() ES6 IE11设置对象的原型（即内部 [[Prototype]] 属性）Object.setPrototypeOf()方法设置一个指定的对象的原型 ( 即, 内部[[Prototype]]属性）到另一个对象或 null。当调用该方法的时候，如果对象的[[Prototype]]是不可扩展(通过Object.isExtensible()查看)，就会抛出TypeError异常。如果prototype参数不是一个对...

2020-06-20 14:53:26 1201

原创 Object.freeze() 方法冻结对象、Object.seal()方法封闭对象、Object.preventExtensions()方法象不可扩展

3、对象的设置（1）Object.isExtensible()和Object.preventExtensions() ES5Object.isExtensible()方法判断一个对象是否是可扩展的（是否可以在它上面添加新的属性）。返回一个Boolean值。默认情况下，对象是可扩展的：即可以为他们添加新的属性。以及它们的__proto__属性可以被更改。Object.preventExtensions，Object.seal或Object.freeze方法都可以标记一个对象为不可扩展（...

2020-06-20 14:23:05 420

原创 Object原型上的toString和hasOwnProperty方法、Object构造函数上的两个方法Object.is和Object.assign方法

Object.prototype可以为所有 Object 类型的对象添加属性，对象原型，上面有封装好的方法。可以供所有的对象继承使用。1、Object.defineProperty()给对象添加一个属性并指定该属性的配置。Object.defineProperties()给对象添加多个属性并分别指定它们的配置。2、Object.keys()返回一个包含所有给定对象自身可枚举属性名称的数组。Object.values()返回给定对象自身可枚举值的数组。

2020-06-19 17:21:57 504

原创数据属性和访问器属性——Object.defineProperty()方法

一、数据属性通常我们给对象设置一个属性，configurable 、 enumerable和 writable都是true。在调用 Object.defineProperty() 方法时，如果不指定， configurable 、 enumerable和 writable 特性的默认值都是 false。拥有布尔值的键configurable、enumerable和writable的默认值都是false。属性值和函数的键value、get和set字段的默认值为undefined...

2020-06-19 14:52:29 798

原创 js数组常用方法，sort方法，reduce方法

11、indexOf方法和lastINdexOf方法 -- ES5方法正向查找和反向查找数组中的值，返回找到的第一个值的索引，如果没有返回-1 var arr = ["a","c","b","ac","bc","b"]; console.log(arr.indexOf("b"));//2 console.log(arr.lastIndexOf("b"));//512、迭代方法 -- ES5方法对数组的每一项指定一个运行函数参数：item，i

2020-06-17 20:23:39 756

原创 js数组

一、数组介绍1、数组是有序列表，每一项可以保存任何类型的数据2、创建数组的方式：（1）构造函数 var arr = new Array(1,2,3); console.log(arr);如果只是一个数字，表示数组的长度，比如： var arr = new Array(3); console.log(arr); //结果：[empty × 3]（2）数组字面量与对象一样，数组字..

2020-06-17 17:03:49 460

“去哪网”城市选择json文件

空空如也