起因
这不用说,那肯定是工作上提供的问题了,无非是现在需要兼容 2x 图片了,pc 需要支持 真 · 2k屏,所以理所应当的加入对 2x 图片的支持了。
作为一个程序员,总是做重复性质的劳动总是不太开心的,所以对此,我认为和设计师好好沟通一下,产出可以自动载入2x图才是上策,所以便有了一下解决方案!
more >>懒惰的后端程序员,不务正业学习前端中
这不用说,那肯定是工作上提供的问题了,无非是现在需要兼容 2x 图片了,pc 需要支持 真 · 2k屏,所以理所应当的加入对 2x 图片的支持了。
作为一个程序员,总是做重复性质的劳动总是不太开心的,所以对此,我认为和设计师好好沟通一下,产出可以自动载入2x图才是上策,所以便有了一下解决方案!
more >>我的一个小伙伴给我提出了一个神奇的问题,这样一个函数执行算不算函数科里化:
function mul(x) {
var product= x;
var tmp = function (y) {
product = product * y;
return tmp;
};
tmp.toString = function () {
return product ;
};
return tmp;
}
console.log(mul(1)(2)(3)(4)(8));
诶嘿,我是不会告诉别人,我并没有一眼看出这就是,不过,这不打紧,至少解释一下这个函数怎么执行的还是不成问题的,但是最后到console.log输出字符串的时候,有了那么一点分歧,这里主要还没想到隐式转换的那些规则,故而我想当然的认为,这里首先输出的是valueOf,而非toString,然后对后面一个问题 :
192 == mul(1)(2)(3)(4)(8)
给出了答案 false,但是显然小伙伴是不服气的,原因很简单,她执行的结果是true!
难以置信!为什么呢?(来自未来的icepro:你是不是傻,隐式转换规则都忘记了)
more >>好吧事实上。。。最后我选择死亡。。。还是用上 vue 吧,数据绑定更新什么的实在太麻烦了。。。。
这个编辑器主要是因为工作中需要实际使用了,所以才使用 vue 快速实现了一个,对于这次的 h5 编辑器主要的目的是简化一些重复修改的问题,然后把这里的编辑器最后将会导出两个内容:
You are given two non-empty linked lists representing two non-negative integers. The digits are stored in reverse order and each of their nodes contain a single digit. Add the two numbers and return it as a linked list.
You may assume the two numbers do not contain any leading zero, except the number 0 itself.
Input: (2 -> 4 -> 3) + (5 -> 6 -> 4)
Output: 7 -> 0 -> 8
Explanation: 342 + 465 = 807.
将会给你两个通过 非空 链表来描述的非负整数,其中整数的每一个数字将会以 反序 方式储存在链表的节点中。将链表组成的数字相加,并返回一个该种方式组成的链表。
除非这个数字本身是0,否则你需要假定这两个数字不存在任何前导0。
举个栗子
输入: (2 -> 4 -> 3) + (5 -> 6 -> 4)
输出: 7 -> 0 -> 8
计算过程: 342 + 465 = 807.
这题不难,凡是了解过加法器的大抵都知道进位都是咋实现的,这个处理算法实际和加法器差不多,唯一需要注意的是,因为两数的长度完全可能不同,所以这个是需要处理一下,除此以外,并没有什么特殊的地方。
由于是链表,用递归是一个常见思路
/**
* Definition for singly-linked list.
* function ListNode(val) {
* this.val = val;
* this.next = null;
* }
*/
/**
* @param {ListNode} l1
* @param {ListNode} l2
* @return {ListNode}
*/
var addTwoNumbers = function(l1, l2) {
return addTwoNumbersWithDelta(l1, l2, 0)
};
function addTwoNumbersWithDelta (l1, l2, delta) {
if (!l1 && !l2 && !delta) {
return null
}
let val1 = 0
let val1Next
let val2 = 0
let val2Next
if (l1) {
val1 = l1.val
val1Next = l1.next
}
if (l2) {
val2 = l2.val
val2Next = l2.next
}
let value = val1 + val2 + delta
let carry = parseInt(value / 10)
let val = value % 10
let next = addTwoNumbersWithDelta(val1Next, val2Next, carry)
let res = new ListNode(val)
res.next = next
return res
}
这样递归一遍得出的 res 就是实际解了
Given an array of integers, return indices of the two numbers such that they add up to a specific target.
You may assume that each input would have exactly one solution, and you may not use the same element twice.
Given nums = [2, 7, 11, 15], target = 9,
Because nums[0] + nums[1] = 2 + 7 = 9,
return [0, 1].
对于某给定整数数组,找出其中两数和为给定数字,并返回其序号。
你必须确保每一个输入都只有唯一解,且不能使用同一元素两次以上。
这题很有意思,首先想到的方法是遍历嘛,把所有的组合遍历一遍求解即可,这挺容易的
/**
* @param {number[]} nums
* @param {number} target
* @return {number[]}
*/
var twoSum = function(nums, target) {
for (let i = 0; i < nums.length; i++) {
for (let j = 1; j < nums.length; j++) {
if(i !== j && nums[i] + nums[j] === target) {
return i < j ? [i, j] : [j, i]
}
}
}
};
这就完事儿了,但是显然并不是一个最优解,好歹空间复杂度为 O(1),时间复杂度大概是 O(n^2),(这个我不太会算,不过应该没错)
首先我们知道给定的数组是不能够使用2次以上的也就是说,那些多余的重复的数字是没有意义的,另外由于是 2sum ———— 那么另外一个值显然是知道的(target - now),那么我们就有机会用空间换时间大致是空间: O(1) -> O(n) ,时间:O(n^2) -> O(n)(大多数情况下,拿空间换时间都是比较划算的)
所以大致可以这么玩:
/**
* @param {number[]} nums
* @param {number} target
* @return {number[]}
*/
var twoSum = function(nums, target) {
let map = new Map();
nums.forEach(function (value, index) {
map.set(value, index);
});
for(let index = 0; index < nums.length; index++) {
// 我记得Complement好像是补集的意思懒得查了,就用它吧
let complement = target - nums[index];
if (map.has(complement) && map.get(complement) !== index) {
return [index, map.get(complement)]
}
}
return 'no sum'
};
当然他还可以再简单一点,只消一次循环即可,因为我们知道遍历过的那一段说明里面的任意两两组合的数字都不可能相加为target,所以————我们可以这么写,只需要一次循环即可,当然咯 O(2n) === O(n) (从理智上讲并没有什么差别)
/**
* @param {number[]} nums
* @param {number} target
* @return {number[]}
*/
var twoSum = function(nums, target) {
let map = new Map();
for(let index = 0; index < nums.length; index++) {
let complement = target - nums[index];
if (map.has(complement) && map.get(complement) !== index) {
// 注意一下这里和上个解法不同,因为取出的内容是之前的,所以输出的索引顺序需要反过来
return [map.get(complement), index]
} else {
map.set(nums[index], index);
}
}
return 'no sum'
};
最后。。。当然我觉得这两种解法基本没差,如果可以说出差别的,可以留言给我~就这样吧
上一章的结尾也提到了匆匆结束了一章(不要打我,过了这么久发第二张还不是难产了。。。倒不是难度高而是太懒了写不动),那么上一章具体做了什么?
对啥也没做,就简单的完成了一个拖拽功能和一个中心 event center(来自未来icepro鄙视的眼神)。
所以本章到底要做什么呢?
主要的目标是把上一章中没有实现的打包下载功能实现掉。
这里需要补全另外一种结构也就是 text 这个,具体的非常简单直接(我觉得有点粗暴来着…
more >>接到任务是写个 h5 页面,瞬间心中呼啸而过了一排火车,当时就想狠狠甩自己一巴掌,玩个球,之前3月份搞事儿写个网站编辑器,早点完成一个 h5 编辑器这里不久省事儿了么,于是寻思着怎么写一个 h5 编辑器。
对于 h5 编辑器,我是蛮熟悉的,此前专门调研过易企秀的内容,深知一个 h5 编辑器到底是什么样子的,这不就打算实现以下了。
本章的主体内容并不涉及 h5 编辑器的实际编写,此处是做一定的配置。
我寻思着,自己的博客里面也没有写什么和 webpack 相关的内容,于是这里就先放一个基础的webpack配置吧。
文件的主要结构大致如下:
|-/
package.json
.babelrc
index.html
-src/
main.js
main.scss
-config/
devserver.js
webpack.dev.js
首先生成 package.json ,这里很多新人都会搞混 dependence 和 devdependence,很多就完全都安装到 dependence里面去了,其实按照 npm 那边的说法, dev抬头的依赖是仅在开发阶段使用的,比如 babel,webpack 等都属于这个范畴。
我大致做了如下配置:
{
"name": "h5",
"version": "1.0.0",
"description": "a h5 builder",
"main": "index.js",
"keywords": [
"h5"
],
"author": "icepro",
"license": "MIT",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-preset-stage-2": "^6.24.1",
"css-loader": "^0.28.11",
"node-sass": "^4.9.0",
"sass-loader": "^7.0.1",
"style-loader": "^0.21.0",
"webpack": "^4.6.0",
"webpack-cli": "^2.1.2",
"webpack-dev-server": "^3.1.3",
"babel-preset-es2015": "^6.24.1",
"html-webpack-plugin": "^3.2.0"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "node ./config/devserver.js"
},
"dependencies": {
"jquery": "^3.3.1"
}
}
主要添加一些依赖,基本要用的依赖都已经放上去了(后续再添加会继续说明),在dev的配置中,我们使用编写的 devserver 去实时编译并输出内容,随后让我们开始编写 webpack 文件。
首先我们要注意版本,这里我是用的是 4.0 版本,所以大家在使用的时候,主要大版本有差异。
const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
mode: "development",
entry: {
'app': [path.resolve(__dirname, "../src/main.js")]
},
output: {
path: path.resolve(__dirname, '../build'),
publicPath: "/",
filename: 'js/[name][hash].js'
},
module: {
rules: [{
test: /\.scss$/,
loader: ['style-loader', 'css-loader', 'sass-loader']
}, {
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}]
},
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: path.resolve(__dirname, './../index.html'),
inject: true,
chunks: ['app']
}),
]
}
作为一个前端想要所见即所得,是每一个前端的梦想,这里我们优先配置一下 devserver,这个由于我只需要最简单的配置,所以这里devserver用的几乎是最简单的配置:
const webpack = require('webpack');
const WebpackDevServer = require('webpack-dev-server')
var config = require("./webpack.dev.js");
// 这里读取的config的entry作为入口,当然多入口的话需要遍历添加,这个自行解决吧
config.entry.app.unshift("webpack-dev-server/client?http://localhost:8080/");
var compiler = webpack(config);
var server = new WebpackDevServer(compiler);
server.listen(8080);
ip也用的是固定的ip。
然后让我们运行一下 npm run dev 这样基本的环境就搭建完成了
本次主题是为了找出为何下述代码在 safari/IE 中会出现 Invalid Date的问题:
new Date("2019-9-1")
new Date("2018-09-09T09:11:21+0800")
new Date("2018-09-09T09:11:21z")
new Date("2018-01-03 13:30:00")
more >>
同事叫我帮忙装一下 ss ,她不会装,我就估摸着反正装个 ss 能多难,也就几分钟的事情,然而事实却有点坑。
万万没想到 centos 6 x86 的安装这么可怕
这一次使用的centos 6 x86 上面默认安装的 python 2.6.6 起初我看 ss 是支持 python2.6.6 的,但是万万没想到, pip无法正确安装
起初我是这样安装的:
yum install python-setuptools && easy_install pip
报了个错,具体是啥没记录
然后就想是不是 pip 没安装对,然后我就尝试 手工安装了:
curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py
python get-pip.py
结果报错了
Traceback (most recent call last):
File "get-pip.py", line 17474, in <module>
main()
File "get-pip.py", line 17466, in main
bootstrap(tmpdir=tmpdir)
File "get-pip.py", line 17406, in bootstrap
import pip
File "/tmp/tmpB9jhvw/pip.zip/pip/__init__.py", line 9, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/log.py", line 9, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/_vendor/colorama/__init__.py", line 2, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/_vendor/colorama/initialise.py", line 5, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/_vendor/colorama/ansitowin32.py", line 6, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/_vendor/colorama/winterm.py", line 2, in <module>
File "/tmp/tmpB9jhvw/pip.zip/pip/_vendor/colorama/win32.py", line 7, in <module>
当时我脑海中就是,emmmm这是个啥,算了我装个python34好了,centos应该有
yum install python34
yum install python3
yum install python35
yum install python36
what???没有,这个时候 打了一个 yum search一翻…对根本没有 python 2.6以上的版本,得了,自己编译吧
先把依赖装以下:
yum install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel
wget https://www.python.org/ftp/python/2.7.13/Python-2.7.13.tgz
tar vxf Python-2.7.13.tgz
cd Python-2.7.13
./configure --prefix=/usr/local
make && make install
checking for gcc... no
checking for cc... no
checking for cl.exe... no
configure: error: no acceptable C compiler found in $PATH
See `config.log' for more details.
what?没有gcc…
接着安装以下gcc
yum install gcc
再来一次
./configure --prefix=/usr/local
make && make install
libpython2.7.a(mystrtoul.o):/root/Python-2.7.13/Python/mystrtoul.c:165: more undefined references to `_PyLong_DigitValue' follow
collect2: ld 返回 1
make: *** [python] 错误 1
这是个啥…算了…我换个版本…
wget https://www.python.org/ftp/python/2.7.8/Python-2.7.8.tgz
tar vxf Python-2.7.8.tgz
cd Python-2.7.8
./configure --prefix=/usr/local
make && make install
好这次安装成功了, 还带上了pip,艰苦的历程QAQ,接下来按照之前的教程接着走一此就成了
事实证明,linux 环境更换一下是有很大差别的,总体来看,下载源码自行编译这个技能还是需要的。
这里就扯几句题外话,这个时候就要表扬一下 Debian 系统了 apt 仓库简直不能更新,全部默认提供最新的源(如果不把旧的源删除相信我就义无反顾成为死忠粉了),对比一下保守的 Redhat 系, Debian 在日常开发,自己小规模使用中体验是相当好的,但是对于成建制的运维来讲虽然是不大的,但是 Debian 系在对服务器的方面的 服务支持 是相对更少的。
最后的最后,其实实际上我们更多的是需要一个 虚拟环境 去帮我们摒除这些反复的配置 比如 docker !就是一个非常 nice 的选择!
此处空空如也~
输入点什么来搜索吧!