发表于 | 分类于

Setup

1、安装webpack依赖

1
2
3
yarn add webpack webpack-cli -D
yarn add webpack-dev-server -D
yarn add html-webpack-plugin -D

2、安装babel依赖

1
2
3
4
5
6
yarn add babel-loader @babel/core -D
# 为了转化es6代码，需要安装babel插件
yarn add @babel/preset-env @babel/polyfill -D
# 安装防止全局污染babel插件
yarn add -D @babel/plugin-transform-runtime
yarn add @babel/runtime @babel/runtime-corejs2
阅读全文 »

发表于 | 分类于

NVM 安装

1
2
3
4
5
6
7
8
9
10
11
12
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.6/install.sh | bash
# .bash_profile
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"

# 查看本地所有node版本
nvm list

# 安装node
nvm install v8.12.0
# 切换node版本
nvm use 8.12.0

发表于 | 分类于

一、UBUNTU18.04 安装

1、服务器创建用户

1
2
3
4
5
6
7
8
// 在 /home 目录下创建 username 
sudo useradd -m -s /bin/bash username
// 设置密码
sudo passwd username
// 给username 赋予管理员权限
sudo vim /etc/sudoers
root ALL=(ALL:ALL)ALL
protagonisths ALL=(ALL:ALL)ALL

安装nodejs

1
2
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
sudo apt-get install -y nodejs

https://github.com/nodesource/distributions#debinstall

安装yarn

1
2
curl -sL https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
sudo apt-get update && sudo apt-get install yarn

安装Pm2

1
2
# 4.2.1
npm i -g pm2
阅读全文 »

发表于 | 分类于

相同点就是这三个方法都可以改变函数的this指向，不同点是call，apply是修改函数作用域，修改this指向，并且立即执行。bind是返回一个新的函数,并不会立即执行，若想立即执行需要在后面加上()调用，当然关于传入的参数也有一定的差异，call和bind可以接受多个单个的参数，apply 接受的参数形式是数组。

发表于 | 分类于

一、Vue-extend

Vue.extend(options)在官法文章中的归类是全局API，是使用基础Vue构造器，创造一个子类，动态地创建实例。

1
2
3
4
5
6
7
8
9
10
const Init = Vue.extend({
	template: '<div>Hello World</div>',
	data(){
		return {
			msg:'Hello'
		}	
	}
	// render: h => h(Component)
})
new Init().$mount('app')

二、Vue.component()

注册或者获取全局组件，注册还会自动使用给定的id设置组件的名称

阅读全文 »

发表于 | 分类于

Vue组件化

插槽

插槽语法是Vue实现的内容分发API，用于复合组件开发。该技术在通用组件库开发中有大量应用。

匿名插槽
1
2
3
4
5
6
7
// child
<div>
  <slot></slot>
</div>

// parent
<child>Hello World</child>
具名插槽

将内容过分发到子组件指定位置

1
2
3
4
5
6
7
8
9
10
11
// child
<div>
  <solt></solt>
  <solt name="content"></solt>
</div>

// parent
<Child>
	<template v-solt:default>具名插槽</template>
  <template v-solt:content>hello world</template>
</Child>
阅读全文 »

发表于 | 分类于

链表

一、链表的概念

链表是物理存储单元上非连续的，非顺序的存储结构，由一系列节点组成。链表分为有头链表和无头链表。

1、节点

节点包含包含两个部分，一部分是存储数据元素的数据域，一部分是存储指向下一个节点的指针域，这两块构成一个节点，节点如何去使用？简单示意如下：

1
2
3
4
5
6
7
8
9
var Node = function(data){
  this.data = data
  this.next = null
}
var node = new Node(1)
var node1 = new Node(8)
var node2 = new Node(9)
console.log(node)
console.log(node.next.data)
阅读全文 »

发表于 | 分类于

队列

利用数组定义队列,在队列的基础上实现一些功能

一、定义队列

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
function Queue(){
  var items = []
  
  this.enqueue = function(item){
    items.push(item)
  }
  
  this.dequeue = function(){
    return items.shift()
  }
  
  this.head = function(){
    return items[0]
  }
  
  this.tail = function(){
    return items[items.length - 1]
  }
  
  this.size = function(){
    return items.length
  }
  
  this.clear = function(){
    items = []
  }
  
  this.Empty = function(){
    return items.length === 0
  }
}
阅读全文 »

发表于 | 分类于

计算表达式拆解

本例子使用数组实现栈,在栈的基础上 实现计算表达式

一、定义栈

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
function Stack(){
  var items = []
  
  this.push = function(item){
    items.push(item)
  }
  
  this.pop = function(){
    return items.pop()
  }
  
  this.isEmpty = function(){
    return items.length === 0
  }
  
  this.size = function(){
    return items.length
  }
  
  this.top = function(){
    return items[items.length - 1]
  }
  
  this.clear = function(){
    items = []
  }
}
阅读全文 »

发表于 | 分类于

编译安装nginx需要安装依赖

1
2
yum -y install gcc gcc-c++
yum -y install zlib zlib-devel openssl openssl-devel pcre-devel