完美

[学习|工作|博客|交流平台|完美起航]

作者头像zyw3272018.05.18 17:58 

es6新类型之Symbol学习笔记(一)

Symbol Symbol()函数返回一个类型符号的值,具有暴露内置对象的几个成员的静态属性,具有公开全局符号注册表的静态方法,并且类似于内置对象类,但作为构造函数不完整,因为 它不支持“new Symbol()”语法。 从Symbol()返回的每个符号值都是唯一的。 符号值可以用作对象属性的标识符; 这是数据类型的唯一目的。 关于目的和用法的进一步解释可以在Symbol的词汇表中找到。 symbol 是原始数据类型 // JavaScript Demo: Symbol - Constructor const symbol1 = Symbol(); const symbol2 = Symbol(42); const symbol3 = Symbol('foo'); console.log(typeof symbol1); // expected output: "symbol" console.log(symbol3.toString()); // expected output: "Symbol(foo)" console.log(Symbol('foo') === Symbol('foo')); // expected output: false 语法 Symbol([description]) 参数 description 可选 可选,字符串。 描述可用于调试但不访问符号本身的符号。 说明 要创建一个新的原始符号,可以使用可选字符串作为其描述来编写Symbol() var sym1 = Symbol(); var sym2 = Symbol('foo'); var sym3 = Symbol('foo'); 上面的代码创建了三个新的符号。 请注意,Symbol(“foo”)不会将字符串“foo”强制转换为符号。 它每次都会创建一个新符号: Symbol('foo') === Symbol('foo'); // false 新运算符的以下语法将引发TypeError: var sym = new Symbol(); // TypeError 这可以防止作者创建一个显式的Symbol包装器对象而不是新的符号值,并且可能会令人惊讶,因为通常可以在原始数据类型周围创建显式包装器对象(例如,new Boolean,new String和New Number)。 如果你真的想创建一个Symbol包装器对象,你可以使用Object()函数: var sym = Symbol('foo'); typeof sym; // "symbol" var symObj = Object(sym); typeof symObj; // "object"

symbol 843 2

作者头像zyw3272018.05.10 16:31 

nodejs之Buffer学习笔记(一)

类方法: Buffer.alloc(size[, fill[, encoding]])History版本变化v8.9.3指定无效的字符串填充将会被替换为0来填充缓冲区。v5.10.0新增于: v5.10.0参数参数字段类型说明sizeinteger指定新创建的Buffer大小fillstring | Buffer | integer指定填充Buffer的值。 Default: 0encoding<string>如果填充的是字符串,这个参数指定的就是字符串的编码。 默认: 'utf8'分配一个指定字节大小的新Buffer。如果填充未定义,则Buffer将被零填充。constbuf=Buffer.alloc(5); //Prints:<Buffer0000000000> console.log(buf);buf.toString([encoding[, start[, end]]])新增于: v0.1.90encoding <string> 要解码的字符编码。 默认: 'utf8'start <integer> 开始解码的字节偏移量。 默认: 0end <integer> 在(不包括)停止解码的字节偏移量. 默认: buf.lengthReturns: <string> 根据编码中指定的字符编码将BUF解码为字符串。可以通过开始和结束仅解码BUF的子集字符串实例的最大长度(在UTF-16编码单元中)可以作为Buffer-Struts.Max String长度来使用。constbuf2=Buffer.alloc(11,"你好12345",'utf8'); //以下输出:<Buffere4bda0e5a5bd3132333435> console.log(buf2); //以下输出:你好12345 console.log(buf2.toString('utf8')); constbuf3=Buffer.alloc(11,"你好123456",'utf8'); //以下输出:<Buffere4bda0e5a5bd3132333435> console.log(buf2); //以下输出:你好12345=>buf3长度11,utf-8编码中一个汉字占三个字节,你好123456共12个字节,所以丢失一个字节 console.log(buf2.toString('utf8'));

Buffer 5809 4

作者头像zyw3272018.05.02 10:29 

vue中使用vuex

首先是vuex的安装npminstallvuex--save引入并引用vueximportVuefrom'vue' importVuexfrom'vuex' Vue.use(Vuex)创建store.jsconststore=newVuex.Store({ state:{ count:0 }, mutations:{ increment(state){ state.count++ } } })现在,你可以通过 store.state 来获取状态对象,以及通过 store.commit 方法触发状态变更:store.commit('increment')引用store的两种方式,在组件中引用//在组件中引用 importstorefrom'store'通过在根实例中注册 store 选项,该 store 实例会注入到根组件下的所有子组件中,且子组件能通过 this.$store 访问到。constapp=newVue({ el:'#app', //把store对象提供给“store”选项,这可以把store的实例注入所有的子组件 store, components:{Counter}, template:` <divclass="app"> <counter></counter> </div> `})mapState 辅助函数当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题,我们可以使用 mapState 辅助函数帮助我们生成计算属性,让你少按几次键://在单独构建的版本中辅助函数为 Vuex.mapStateimport{mapState}from'vuex' exportdefault{ //... computed:mapState({ //箭头函数可使代码更简练 count:state=>state.count, //传字符串参数'count'等同于`state=>state.count` countAlias:'count', //为了能够使用`this`获取局部状态,必须使用常规函数 countPlusLocalState(state){ returnstate.count+this.localCount } }) }

vuex 10483 1

作者头像zyw3272018.04.22 20:33 

js基础算法学习

移除数组 arr 中的所有值与 item 相等的元素。不要直接修改数组 arr,结果返回新的数组//递归实现 functionremove(arr,item){ varnewArr=arr.slice(0); if(newArr.indexOf(item)===-1){ returnnewArr; } newArr.splice(newArr.indexOf(item),1) returnremove(newArr,item); } //循环遍历实现 functionremove1(arr,item){ varnewArr=[]; arr.forEach(function(e,index,arr){ if(e!==item){ newArr.push(e); } }) returnnewArr; }2.直接在原数组上操作functionremoveWithoutCopy(arr,item){ if(arr.indexOf(item)===-1){ returnarr; } arr.splice(arr.indexOf(item),1) returnremoveWithoutCopy(arr,item); }3. 查找数组中重复出现的数字//不改变原数组 functionduplicates(arr){ varnewArr=[]; arr.forEach(function(e,index){ if((arr.slice(index+1)).indexOf(e)!==-1){ if(newArr.indexOf(e)===-1){ newArr.push(e); } } }); returnnewArr; } //第二种方式 functionduplicates1(arr){ varnewArr=[]; arr.forEach(function(e,index){ if(arr.indexOf(e)!==arr.lastIndexOf(e)&&newArr.indexOf(e)===-1){ newArr.push(e); } }); returnnewArr; }4. 数组去重functionduplicates2(arr){ varnewArr=[]; arr.forEach(function(e,index){ if(newArr.indexOf(e)===-1){ newArr.push(e); } }); returnnewArr; }5.在数组 arr 的 index 处添加元素 item。不要直接修改数组 arr,结果返回新的数组functioninsert(arr,item,index){ varnewArr=[]; for(varkeyinarr){ if(key==index){ newArr.push(item); newArr.push(arr[key]); }else{ newArr.push(arr[key]); } } return!newArr.length?[item]:newArr; } //利用slice+concat functioninsert1(arr,item,index){ returnarr.slice(0,index).concat(item,arr.slice(index)); } //利用concat+splice functioninsert2(arr,

javascript 15893 3

作者头像zyw3272018.04.11 22:37 

兔子繁殖问题编程

问题如下:有人养了一对兔子,这对兔子以后每月生一对兔子,新生兔子从第三个月开始,也是每月生一对兔子,问 12 个月后这人有多少对新生兔子?首先分析:从上可以知道,从3月份开始每月增加的兔子对数成等差数列,因此此题从3月份开始可以通过求等差数列的前n项和求每月的兔子对数。因为是从三月开始所以n= n- 2; 首项为1,化简后得:result = 2 + (n - 2) + (n * n - 5n + 6) / 2; 其中n要大于等于2;1月则返回1对兔子C语言编程如下:/* 有人养了一对兔子,这对兔子以后每月生一对兔子,新生兔子从第三个月开始,也是每月生一对兔子,问12个月后这人有多少对新生兔子 */ #include<stdio.h> intmain(){ intn=0; intresult=0; printf("请输入月份:"); scanf("%d",&n); if(n==1){ result=1; }else{ result=2+(n-2)+(n*n-5*n+6)/2; } printf("%d月份共有%d对兔子\n",n,result); return0; }

兔子繁殖问题 21887 4

作者头像zyw3272018.04.10 17:16 

配置静态服务器与nginx的安装与配置

centos服务器可用登录远端服务器sshroot@ip#输入密码登入终端执行netstat -tunlp如果显示相关服务的相关情况。则进行下一步,如果提示命令不存在则执行yuminstall-ynet-tools配置静态服务器可以用的服务软件有apache、nginx等,这里以nginx为例。nginx的安装相关准备如下:首先先安装nginx所需的依赖#安装nginx依赖yuminstallzlibzlib-developensslopenssl-develpcre-devel-y yuminstall-ymakegccgcc-c++-y下载nginxnginx下载地址:http://nginx.org/en/download.html我们可以通过wget下载,当然首先要先安装wget#如果没有wget则执行yuminstall-ywget wgethttp://nginx.org/download/nginx-1.12.2.tar.gz #nginx安装另一个依赖pcre只要解压不需安装 wgethttps://ftp.pcre.org/pub/pcre/pcre-8.40.tar.gz tar-zxvfpcre-8.40.tar.gz #下载完成后解压 tar-zxvfnginx-1.12.2.tar.gz cdnginx-1.12.2 ./configure\ --prefix=/usr/local/nginx\ --sbin-path=/usr/local/nginx/sbin/nginx\ --conf-path=/usr/local/nginx/conf/nginx.conf\ --pid-path=/usr/local/nginx/nginx.pid\ --with-http_ssl_module\ --with-pcre=\ --with-zlib=\ --error-log-path=/data/nginx/error/error.log\ --http-log-path=/data/nginx/error/http.log\ --user=www\ --group=www\ --lock-path=/var/lock/nginx.lock\ --with-http_ssl_module\ --with-http_flv_module\ --with-http_stub_status_module\ --with-http_gzip_static_module\ --http-client-body-temp-path=/var/tmp/nginx/client/\ --http-proxy-temp-path=/var/tmp/nginx/proxy/\ --http-fastcgi-temp-path=/var/tmp/nginx/fcgi/\ --http-uwsgi-temp-path=/var/tmp/nginx/uwsgi\ --http-scgi-temp-path=/var/tmp/nginx/scgi\ --with-pcre=../pcre-8.40 make&&makeinstall配置首先要创建nginx的执行用户groupaddwww useraddwww-gwww-s/sbin/nologin然后进入nginx的配置文件目录cd/usr/local/nginx/c

nginx 22550 4

作者头像zyw3272018.04.10 11:26 

前端开发面试题

前言只看问题点这里看全部问题和答案点这里本文由我收集总结了一些前端面试题,初学者阅后也要用心钻研其中的原理,重要知识需要系统学习、透彻学习,形成自己的知识链。万不可投机取巧,临时抱佛脚只求面试侥幸混过关是错误的!也是不可能的!不可能的!不可能的!前端还是一个年轻的行业,新的行业标准, 框架, 库都不断在更新和新增,正如赫门在2015深JS大会上的《前端服务化之路》主题演讲中说的一句话:“每18至24个月,前端都会难一倍”,这些变化使前端的能力更加丰富、创造的应用也会更加完美。所以关注各种前端技术,跟上快速变化的节奏,也是身为一个前端程序员必备的技能之一。最近也收到许多微博私信的鼓励和更正题目信息,后面会经常更新题目和答案到github博客。希望前端er达到既能使用也会表达,对理论知识有自己的理解。可根据下面的知识点一个一个去进阶学习,形成自己的职业技能链。面试有几点需注意:(来源寒冬winter老师,github:@wintercn)面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。题目类型: 理论知识、算法、项目细节、技术视野、开放性题、工作案例。细节追问: 可以确保问到你开始不懂或面试官开始不懂为止,这样可以大大延展题目的区分度和深度,知道你的实际能力。因为这种知识关联是长时期的学习,临时抱佛脚绝对是记不住的。回答问题再棒,面试官(可能是你面试职位的直接领导),会考虑我要不要这个人做我的同事?所以态度很重要、除了能做事,还要会做人。(感觉更像是相亲( •̣̣̣̣̣̥́௰•̣̣̣̣̣̥̀ ))资深的前端开发能把absolute和relative弄混,这样的人不要也罢,因为团队需要的是:你这个人具有可以依靠的才能(靠谱)。前端开发所需掌握知识点概要:HTML&CSS: 对Web标准的理解(结构、表现、行为)、浏览器内核、渲染原理、依赖管理、兼容性、CSS语法、层次关系,常用属性、布局、选择器、权重、盒模型、 Hack、CSS预处理器、CSS3、Flexbox、CSS Modules、Document flow、BFC、HTML5(离线 & 存储、Histoy,多媒体、WebGL\SVG\Canvas); JavaScript: 数据类型、运算、对象、Function、继承、闭包、作用域、事件、Prototype、RegExp、JSON、Ajax、DOM、BOM、 内存泄漏、跨域、异步请求、模板引擎、模块化、Flux、同构、算法、ECMAScript6、Nodejs、HTTP、其他: 主流MVVM框架(React\Vue\Angular)、Hybrid App\React Native\Weex、TypeScript、RESTFul、WEB安全、前端工程化、依赖管理、性能优化、 重构、团队协作、可维护、易用性、SEO、UED、前端技术选型、快速学习能力等;作为一名前端工程师,无论工作年头长短都应该掌握的知识点:此条由 王子墨 发表在攻城师的实验室 1、DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 2、DOM操作 —— 如何添加、移除、移动、复制、创建和查找节点等。 3、事件 —— 如何使用事件,以及IE和标准DOM事件模型之间存在的差别。 4、XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误。 5、严格模式

前端开发 24540 0

作者头像SmartZ2018.04.03 19:31 

为什么网页游戏广告如此恶心,令人作呕,开发的人三观不正吗?

为什么网页游戏广告如此恶心,令人作呕,开发的人三观不正吗?

广告 27704 0

作者头像zyw3272018.04.01 23:21 

javascript作用域与函数与闭包

使用递归获取后代元素作用域什么是作用域变量起作用的范围什么是块级作用域JS中没有块级作用域,使用代码块限定的作用域就是块级作用域JS中的作用域叫做 词法作用域词法作用域在代码写好的时候,就能确定变量的作用域,这种作用域就是词法作用域动态作用域.(是词法作用域就不可能是动态作用域)在js当中,只有函数能创造作用域varnum=123; functionf1(){ console.log(num);//如果是动态作用域打印的就是456如果是词法作用域打印123 } functionf2(){ varnum=456; f1(); } f2();变量提升JS代码的运行分两个阶段 预解析阶段 变量名和函数提升 将var声明的变量名和function开头的函数进行提升 提升到当前作用域的最上方 * 执行阶段注意: 1.变量和函数同名的时候 只提升函数,忽略变量名 2.函数同名的时候 都提升,但是后面的函数会覆盖前面的函数 3.函数表达式,只会提升变量名,不会提后面的函数4.变量提升只会将变量和函数提升到当前作用域的最上方funcitonfoo(){ varnum=123; }5.变量提升是分块 <script> 的<script> t> foo()fun(){ o(){ .lco("第一个script标签内的函数") }; </script> <script> t> foo()fun(){ o(){ .lco("第2个script标签内的函数") } </script>6.条件式函数声明 能否被提升,取决于浏览器, 不推荐使用!!!foo();//会报错,因为未被提升 if(true){ functionfoo(){ } }作用域链只要是函数都有作用域,函数内部的作用域可以访问函数外部的作用域当多个函数嵌套的时候,就会形成一个链式的结构,这个就是作用域链绘制作用域链图的步骤1.先绘制0级作用域链2.在全局作用域中查找,变量和函数的声明,找到之后,将所有的变量和函数用小方格放在0级作用域链上3.再从0级作用域链上的函数引出1级作用域链4.再去每一个1级作用域链中查找变量和函数的声明,找到之后.....5.以此重复,就画好了整个作用域链变量的搜索规则1.首先在访问变量的作用域中查找该变量,如果找到直接使用2.如果没有找到,去上一级作用域中继续查找,如果如果找到直接使用3.如果没有找到,继续去上一级作用域中继续查找,直到全局作用域4.如果找到了就用,如果没有直到就报错闭包闭包是什么一个封闭的对外不公开的包裹结构或空间js中的闭包是函数闭包要解决的问题1、在函数外部访问不到函数内部的数据2、要解决的问题就是需要在外部间接的访问函数内部的数据闭包的基本结构functionouter(){ vardata="数据"; returnfunction(){ returndata; } } functionouter(){ vardata="数据"; vardata1="数据1"; return{ getData:function(){ returndata; }, getData1:function(){ returndata1; } } } functionouter(){ var

javascript 30666 2

作者头像zyw3272018.03.24 16:27 

javascript面向对象学习之继承

继承混入式继承for in 使用for in遍历对象1的属性,将所有的属性添加到另外一个对象2上 这时候就可以称 对象2 继承自 对象1原型继承利用对象的动态特性,为原型对象添加成员直接替换原型对象 1.替换前的对象,在替换之后,所有的成员都丢失 2.替换原型对象的时候,需要手动去指定原型对象的construtor属性利用混入给原型对象添加成员经典继承var 对象1 = Object.create(对象2);这个时候,创建出来的对象1继承自对象2Object.create方法存在兼容性问题 如何解决? 1.检测浏览器是否支持Object.create方法,如果不支持,直接手动给Object添加create方法 2.自定义函数,在函数内部判断浏览器是否支持Object.create方法,如果不支持,则手动创建对象返回,否则直接调用 functioncreate(obj){ if(Object.create){ returnObject.create(obj); }else{ functionF(){ } F.prototype=obj; returnnewF(); } }原型链什么是原型链每个构造函数都有原型对象,每个对象都有构造函数,每个构造函数的原型对象都是对象,也就有构造函数 然后就形成一个链式的结构,我们称之为原型链原型继承是什么?通过修改原型链的结构,实现继承的方式就是原型继承对象和原型的成员关系function Person(){};var p = new Person();p对象中包含的成员有:Person.prototype中的成员和自身拥有成员 Person.prototype中的成员有:Object.prototype的成员和自身的成员p对象可以访问Person.prototype和Object.prototype中的所有成员Object.prototype的成员constructor :指向和该原型相关的构造函数hasOwnProperty 方法: 判断对象本身是否拥有某个属性properIsEnumerable 方法: 1.判断属性是否属于对象本身,2.判断属性是否可以被遍历toString toLocaleString: 将对象转换成字符串 toLocalString转换成字符串的时候应用的本地的设置格式valueOf 方法:在对象参与运算的时候,首先调用valueOf方法获取对象的值,如果该值无法参与运算,将会调用toString方法proto 属性: 指向当前对象的原型对象Function3种创建函数的方式直接声明函数函数表达式new Function()可以用Function来创建函数: 语法:var 函数名 = new Function(); //创建一个空的函数var 函数名 = new Function("函数体") //创建一个没有参数的函数var 函数名 = new Function("参数1","参数2", "参数3",..."函数体")//当给Fucntion传多个参数的时候,最后一个参数为函数体,前面的参数为创建出来的函数的形参//Function接收的所有的参数都是字符串类型的!!!arguments对象arguments对象是函数内部的一个对象,在函数调用的时候,系统会默认的

javascript 42217 1

a6bfb44cbd5549740eb36647f36ef83a