Node:深入模块机制

NodeJS:深入模块机制1. CommonJS规范CommonJS(http://www.commonjs.org)规范的出现,其目标是为了构建JavaScript在包括Web服务器,桌面,命令行工具,及浏览器方面的生态系统。CommonJS其实不是一门新的语言,甚至都不能说它是一个新的解释器——实际上它只是一个概念或者是一个规范。它具体弥补了前端JavaScript 的哪些空白呢?其实这也涉及了很多前端JavaScript 所没有涉及的东西,如二进制、编码、IO、文件、系统、断言测试、套接
分类: 其他 发布时间: 03-07 08:49 阅读次数: 0

Node:I/O异步的基本要素

Node.js:异步I/O的基本要素1. 事件循环Node的执行模型为事件循环,正是它使得回调函数十分普遍;在每次进程启动时,Node就会创建一个无限循环,每执行一次循环称作Tick。每个Tick的过程就是查看是否还有待办事件,如果又,就调取其相关的回调函数;如果还存在相关联的回调函数,就执行他们;如果不再有事件处理,就退出事件循环。2. 观察者模式每个循环中又一个或多个观察者,判断是否有事件需要处理的过程就是观察者询问是否存在需要处理的事件。事件循环是一个典型的生产者和消费者的关系。异步I/O
分类: 其他 发布时间: 03-07 08:49 阅读次数: 0

Node:异步开发小贴士

NodeJS:异步开发小贴士使用匿名函数保存全局变量来看看一段代码:function asyncFunction(callback){ setTimeout(callback,200);}let color = 'blue';asyncFunction(()=>{ console.log(`The color is ${color}`);})color = 'green';相信大家都知道以上代码的输出肯定是:The color is green.因为这个例子是异步
分类: 其他 发布时间: 03-07 08:49 阅读次数: 0

Vue:生命周期函数的作用

Vue:生命周期函数的作用前言Vue实例有一个完整的生命周期,也就是说从开始创建、初始化数据、编译模板、挂在DOM、渲染-更新-渲染、卸载等一系列过程,我们成为Vue 实例的生命周期,钩子就是在某个阶段给你一个做某些处理的机会。各函数的作用beforeCreated():表示在实例被完全初始化之前调用该函数;created():此时Vue的数据和方法(data,methods)都已经初始化好了;如果要操作data和methods,最早需要在这个函数中操作;created完成后就开
分类: 其他 发布时间: 03-07 08:48 阅读次数: 0

ES6:关于Proxy,你知道多少?

ES6:关于Proxy,你知道多少?概述Proxy用于修改某些操作的默认行为,等同于在语言层面上做出修改,所以属于一种“元编程”,即对编程语言进行编程。Proxy可以理解成在目标对象前架设一层拦截层,外界访问该对象都必须先通过这层拦截,因此提供一种机制可以对外界的访问进行拦截或过滤。实例的方法1.get()get方法用于拦截某个属性的读取操作。let person = { name : '张三'}let proxy = new Proxy(person,{ get
分类: 其他 发布时间: 03-07 08:48 阅读次数: 0

JavaScript:实现一个懒人LazyMan

Javascript:实现LazyMan需求LazyMan(“Jane”)输出:Hi! This is Jane! LazyMan(“Jane”).sleep(20).eat(“dinner”)输出Hi! This is Jane!//等待20秒..Wake up after 20Eat dinner~ LazyMan(“Jane”).eat(“dinner”).eat(“supper”)输出Hi This is Jane!Eat dinner~Eat supper~
分类: 其他 发布时间: 03-07 08:48 阅读次数: 0

JavaScript:fetch,实现异步请求

JavaScript:fetch(),实现异步请求fetch是一种HTTP数据请求的方式,是XMLHttpRequest的一种替代方案。fetch不是ajax的进一步封装,而是原生js。Fetch函数就是原生js,没有使用XMLHttpRequest对象。fetch参数URL:请求地址option:配置选项,用了设置方法、请求头、请求body等;示范fetch(URL,{ method : 'POST', body : data, headers : {
分类: 其他 发布时间: 03-07 08:48 阅读次数: 0

JavaScript:防抖和节流,你了解过吗?

JavaScript:防抖和节流一、防抖定义:出发高频事件后n秒内函数只会执行一次,如果n秒内高频事件再次发生,则重新计算时间。实现思路:每次触发事件时设置一个延迟调用方法,并且取消之前的延时调用方法;缺点:如果事件在规定的时间间隔内不断被触发,则调用方法会不断地被延迟。function debounce(fn){ let timeout = null; return function(){ clearTimeout(timeout);
分类: 其他 发布时间: 03-07 08:47 阅读次数: 0

Vue:父组件传值

Vue:父组件传值prop : prop是一个子组件用来接收父组件传递过来的数据的一个自定义属性。父组件的数据都需要通过props把数据传递给子组件,子组件需要显示地调用props选项声明;创建静态实例<div id='app'> <child msg="ComesFromFather"></child></div><script> Vue.component('child',{ // 声明props
分类: 其他 发布时间: 03-07 08:47 阅读次数: 0

ES6:Generator的来龙去脉

ES6:Generator的来龙去脉概要Generator函数是ES6提供的一种异步编程解决方法.可以将它理解为一个状态机,封装了多个内部状态。-执行Generator函数会返回一个遍历器对象,可依次遍历函数内部的每一个状态;Generator函数有两个特征:function 与函数名之间有一个星号;函数体内部使用yield语句定义不同的内部状态。示例:function*helloWorldGenerator(){ yield '听不见!'; yield
分类: 其他 发布时间: 03-07 08:47 阅读次数: 0

Leetcode:找出双胞胎数组中的叛徒!

这是一道来自leetcode的简单题目,第一次接触到了使用异或运算符进行解答。题目给定一个非空整数数组,除了某个元素只出现一次以外,其余每个元素均出现两次。找出那个只出现了一次的元素。暴力遍历var singleNumber = function(nums){ let i = 0 ,j = 0 ; for(i=0;i<nums.length;i++){ for(j=0;j<nums.length;j++){ if(i != j && nums[i] =
分类: 其他 发布时间: 03-07 08:47 阅读次数: 0

Leetcode:找出数组的中心索引

Leetcode:找出数组中的中心索引概要中心索引指的是该中心索引左边的所有值的和等于中心索引右边所有值的和,若无该索引,则返回-1。例如:目标数组:[1,2,3,5,6]输出:3(这个指的是索引不是值,即为num[3])解释:5 左边的值相加为6等于右边的值6.C语言题解/* @nums:数组 @numsSize:数组长度*/int pivotIndex(int* nums,int numsSize){ int sum=0,i=0,left=0; /
分类: 其他 发布时间: 03-07 08:46 阅读次数: 0

SCSS: 芜湖起飞~

SCSS:芜湖起飞~1. 变量使用1-1. 变量声明$my-color : yellow;类似于作用域,当变量定义在模块外时,其他模块都可以使用;而当定义在模块里时,就只能在模块中使用。1-2. 变量引用$my-color : yellow;$my-border : 1px solid $my-color;header { $my-width : 100px; color : $my-color; width : $my-width; border :
分类: 其他 发布时间: 03-07 08:46 阅读次数: 0

ES6:他来了,class他来了!

ES6:class的引入概要ES6的class语法仅仅只是一个语法糖,在ES5中同样可以实现,新的class语法只是为了让对象原型的写法更加清晰,更像面向对象编程语法。class Point{ constructor(x,y){ this.x = x; this.y = y; } toString(){ console.log( '(' + this.x + ',' + this.y + ')'); }}// 调
分类: 其他 发布时间: 03-07 08:46 阅读次数: 0

ES6:Module语法基础

ES6:Module的语法入门export命令ES6提供了两种export方式://profile.jsexport var a = 1;export var b = 2;export function c(x,y){ return x+y;};//profile.jsvar a = 1;var b = 2;function c(x,y){ return x+y;};export {a,b,c};可以使用as关键字重命名变量或函数://profil
分类: 其他 发布时间: 03-07 08:46 阅读次数: 0

Vue:vue-router的基础原理

Vue:vue-router的基础原理一、前言大多数Vue应用都为单页面应用,而实现单页面应用最关键的工具就是router,router的底层封装了浏览器的History类,使得页面在切换时浏览器无需请求新页面;二、 vue-router的基本知识1. vue-router的三种模式vue-router总共有三种模式:HTML5 History、HashHistory、AbstractHistory(暂时不拓展)History模式:例如:http://test.com/abc
分类: 其他 发布时间: 03-07 08:45 阅读次数: 0

ES6:模块的加载,与CommonJS进行比较

ES6 : Module的加载ES6模块与CommonJS模块的差异CommonJS输出的是一个值的复制值,ES6模块输出的是一个值的引用,也就是说,对CommonJS模块输出的值进行更改,不会影响到其模块本身的值,而ES6则会影响对同一个模块引用的值。CommonJS是运行时加载,ES6是编译时输出接口。import命令加载CommonJS模块在Node环境中,使用import命令加载CommonJS模块,Node将会自动将module.exports属性当作模块的默认输出,等同于exp
分类: 其他 发布时间: 03-07 08:45 阅读次数: 0

TS : typescript 类型注解

TS : typescript 类型注解在ts中,类型注解是一种为函数或者变量添加约束的方式。1. 基础的类型boolean,number,string2. 数组ts可以想js一样操作数组元素,定义数字有两种方式。let list : number[] = [1,2,3];//orlet list : Array<number> = [1,2,3];3. 元组元组类型表示允许数组内的类型各不相同,但是在赋值时需要按照类型顺序来赋值。let list :
分类: 其他 发布时间: 03-07 08:45 阅读次数: 0

TS:接口的奥妙

TS: 接口的奥妙1. 接口基础语法interface Person{ name : string}function sayhelloto(person : Person){ console.log('hello,' + person.name);}let x = { name : 'yivi', age : 20}sayhelloto(x); // hello,yivi类型检查器不会去检查属性的顺序,只要相应的属性存在并且类型也是对应的就能够被识别。
分类: 其他 发布时间: 03-07 08:45 阅读次数: 0

TS:ES6类的扩展

TS:ES6类的扩展1. 公共、私有、受保护的修饰符在typescript中,对ES6标准的类的成员做了扩展,即可以使用public,private,protected,readonly对成员进行修饰,限制其使用域。理解protected与private的区别:protected成员在其派生类(子类)中仍然可以访问到;若将构造函数标记成protected,意味着这个类不能再包含他的类以外被实例化,但是能够被继承:class Person { protected name
分类: 其他 发布时间: 03-07 08:44 阅读次数: 0