直播：过年7天乐，学一门新技术

最新评论

• 

  唐尤华 （ 18 ·      ） just programmer 02/12

  2月12日

  技术是拿来解决问题的。JavaScript可以解决微信小程序开发的问题，前端在webview上运行，后端在node.js上运行。

  学习JavaScript春节7天乐：定好目标（出什么结果），行动【看懂（不会的语法记下来），能运行，会修改】，总结（学习不会的内容）。

  定好目标：能够把微信小程序解决方案JavaScript部分看懂（复制粘贴），能运行，会修改（改改更健康）

  行动：先看README，少走弯路。一共看3个README，解决方案、client、server。

  看不懂的：
  – require
  – module.exports
  – login({这里写的是什么})
  – webSocket
  – tunnel.on/tunnel.emit(on,emit是什么)
  – ()=>
  – console.log/console.error
  – new

  看不懂的分类：文件拆分，一个SDK那么大，要拆分引用；函数回调，调用了API要处理返回结果，用了回调函数？；对象、函数、一些琐碎的语法。

  试了好几样，发现过于复杂。
  找到一个简单的学习方法，安装Node.js，把文档的例子运行一遍。
  把看不懂的点，在node上跑一下。

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/18

  1.很好的学习计划。

  在有限的时间精力，资源和环境条件下一定要有目标和行为规划。

  对自己学习成果的技能有现实性价值就是学习的根本目的之一，学了不用也是“遗忘”。为了学习而学习，没有实践机会和价值也失去了技术发展的机会。

   

  技术是拿来解决问题的。依据应用领域和应用实际来制定计划更加实用。

  思维制定路径是“应用领域—应用问题—-解决方案—个人技能—差距范围”。

   

   

  2.

  学习内容及成果很现实，基于个人基础操作技能的增删改查，针对不懂的部分解决也很具体“改-跑-用”。

  认识到可能性后具体的解决方法是很重要的，保证学习计划落地，在尝试中学习是“老程序员”的最适合学习手段了。

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/13

  2月13日
  整理小程序Client JavaScript实现的功能，看这些功能的JavaScript实现，在Node.js环境下运行，掌握不理解的用法（是什么？怎么用？自己实现会怎么写？为什么示例要这么写？）。

  看不懂的：
  – require
  – module.exports
  – login({这里写的是什么})
  – webSocket
  – tunnel.on/tunnel.emit(on,emit是什么)
  – ()=>
  – console.log/console.error
  – new

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/18

  题主从小程序产品入手，

  思考功能的实现效果，实现手段，实现思路及模拟自己与他人的差距范围，

  很熟练的比较学习过程。

  赞 回复

• 

  Mr。Feiniao    02/13

  大佬厉害

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/14

  2月14日
  马上就要奔上火车了，这个时候需要离线的环境加上离线的文档，继续学习。
  恰好，Node.js可以满足这些要求。
  遇到不懂的JavaScript语法怎么查呢，恩，还是需要有参考的手册。
  电子版的ECMA标准pdf也已经备好了。
  么么哒，一路学起来。
  —
  临出发win10崩溃了，还好可以切换到mac，继续在mac上撸代码。

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/15

  2月15日

  在车站把module.require的内容过了一遍。JavaScript确实强大，比起早年接触的时候强大了许多。

  用dash里面JavaScript和node文档，搜索require关键字。对语法和语义给出了详细的解释。包括不限于，基本用法，module是什么，require中的path如何处理绝对路径，相对路径，文件链接，文件格式（文本/.js/json/二进制）。如何处理不同版本以及循环引用问题。

  验证例子用了node.js，编写示例然后 node bar.js执行看结果。

  借助这个语法，可以方便地组织项目代码（不用所有功能写在同一个文件里）。微信小程序的client正是这么处理的。今天就着这个知识点把client的js代码梳理一下。

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/16

  2月16日

  # wafer2-client-sdk的代码组织
  整个代码是由index.js与lib/的子功能分别实现的：
  – index.js
  – lib
  – login.js 登录

  通过module.exports导出模块，lib模块=>sdk模块

  这里遇到一个看不懂的，这个LoginError用了prototype，注释里说明是异常类
  var LoginError = (function() {}
  function LoginError(type, message) {
  Error.call(this, message);
  this.type = type;
  this.message = message;
  }

  LoginError.prototype = new Error();
  LoginError.prototype.contructor = LoginError;

  return LoginError;
  })();

  用Error自定义了登录错误信息，标记了错误类型，以及错误消息。
  这里用到了对Error的扩展，增加了type和message属性。
  type在consts.js中定义，在整个处理流程中非常重要，给出了每一步的错误原因和详细信息。

  在调试过程中，一直以为自己写错了代码。
  其实是在捕获异常后，console.log或console.error会直接打印error栈。
  如果要输出对应的内容，需要这么写:

  var error = new LoginError(‘code’, ‘message’);
  console.error(`${error.type} : ${error.message}`);

  这里面还牵扯到了错误信息的返回处理，在方法中定义success和fail，处理返回结果。

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/18

  很厉害，不愧是老程序猿，整个思路很流畅，

  找到问题，分析问题，解决问题，很熟练。

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/17

  2月17日

  # 导出全局配置config.js

  与constants类似，小程序中还有一些全局配置：
  host: 后台主机名
  loginUrl: 登录API
  requestUrl: 请求API
  tunnelUrl: 信道服务器API
  uploadUrl: 上传图片API

  使用module.exports导出
  在配置的过程中，可以使用字符串模板Template Literal `${varName}`，类似其他语言的format string

  通过这样的配置分离，实现了配置分离，更好地适应开发需要：比如切换生产环境与开发环境。
  这里需要注意的是：URL一定要把https://加上，否则小程序request时不会识别。

  这里有一个疑惑：module.exports与exports的区别和相同点在哪里？

  # 导出常量constants.js

  在constants中定义对象，名称和值，用module.exports导出。
  在SDK中引入constants，用Object.keys方法遍历对象中的属性，用exports[key]导出。
  这样可以在SDK引入的地方直接调用。

  console.log(mysdk.MY_CONST);

  在wafer的SDK中，定义的常量，有
  – session中的几个关键常量，code, encryptedData, iv, id, skey
  – magicId? 这个东东不知道是干啥用的
  – 错误信息，包括
  – invalid params: 参数错误
  – login failed: 登录失败
  – get user info: 获取用户信息失败
  – login timeout: 登录超时
  – login failed: 登录失败
  – login session not received: session获取失败

  # 扩展对象utils.js

  options = utils.extend({}, defaultOptions, options);

  这句在login方法中调用了，看起来是对默认的options进行了扩展，但是不明白道理。

  exports.extend = function extend(target) {
  var sources = Array.prototype.slice.call(arguments, 1);

  for (var i = 0; i < sources.length; i += 1) {
  var source = sources[i];
  for (var key in source) {
  if (source.hasOwnProperty(key)) {
  target[key] = source[key];
  }
  }
  }

  return target;
  };

  utils.js这个定义让人比较费解。

  于是，自己编写方法进行测试。实验下来的效果，确实给options增加了方法，defaultOptions中的函数。

  再仔细查看一下，发现login中的options这种用法是为了避免未定义success, fail方法做的预防异常处理：

  var noop = function noop() {};
  var defaultOptions = {
  method: ‘GET’,
  success: noop,
  fail: noop,
  loginUrl: null,
  };

  options = utils.extend({}, defaultOptions, options);

  method, success和fail给出了默认实现。
  如果options有相同的定义，用options中的定义覆盖，否则套用defaultOptions中的定义。

  这里有一个问题: 究竟是如何做到的呢，比如在options中定义了自己的success方法，method指定为POST，如何确保使用我的定义呢？
  猜想之下，最合理的做法就是检查里面的名字，如果发现options中有了自己的定义就进行替换。

  查看extend方法定义，确实如此：
  if (source.hasOwnProperty(key)) {
  target[key] = source[key];
  }

  这里用到了Object.prototype.hasOwenProperty，判断是否包含该属性。

  接下来就是 Array.prototype.slice.call 这句话的理解。
  这句把传入的对象组成了数组，var sources = Array.prototype.slice.call(arguments, 1);
  从index=1（传入的第2个元素开始，提取为数组）
  例如: 传入[1,2,3]，取到的是[2,3]
  ({}, defaultOptions, options)
  取到的就是[defaultOptions, options]，接着遍历，后面的属性会替换前面的属性

  总结: utils.js中的extends方法为调用提供了默认参数，extends调用后会覆盖默认值（属性与方法）。
  – session invalid: session无效
  – check login failed: 检查登录失败

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/18

  整个学习过程这么细致的表述出来，

  除了作者自身的程序素养功底，文字组织能力也很关键，当然还有传道授业的意愿，

  很难得很少见的程序猿。

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/18

  2月18日

  # function callback
  var getWxLoginResult = function getLoginCode(callback)
  …
  callback(…) // 回调

  把函数作为参数传入，可以进行回调。

  // 成功回调
  var callSuccess = function () {
  success.apply(null, arguments);
  complete.apply(null, arguments);
  };

  // 失败回调
  var callFail = function (error) {
  fail.call(null, error);
  complete.call(null, error);
  };

  这里apply和call的区别？

  # prototype.call
  在之前的自定义Error中，通过Error.call(this, arg)实现了构造函数调用。

  var LoginError = (function () {
  function LoginError(type, message) {
  Error.call(this, message);
  this.type = type;
  this.message = message;
  }

  LoginError.prototype = new Error();
  LoginError.prototype.constructor = LoginError;

  return LoginError;
  })();

  LoginError本身是一个匿名函数，prototype定义为Error，构造函数是LoginError(type, message)
  prototype.constructor = LoginError; // 指定了Function LoginError的constructor
  在构造函数中，Error.call(this, message) // 调用Error构造函数，this指的LoginError
  prototype.call可以调用匿名函数。

  myfunc.call(obj); // 在myfunc中this即obj
  # function object
  JavaScript每个function都是一个function对象。
  每个函数都有返回值，默认返回undefined，也可以自己返回定义的值。

  函数传递参数arguments，默认是值传递。
  如果arguments传入的是对象引用，函数内对对象修改，作用域会扩大到函数外部。

  匿名方法anonymous function，函数的名字可以不写。
  函数带名字，在出现错误时可以方便地定位到错误的函数。

  函数表达式function expression，可以不写function关键字定义一个函数。
  这里应用了IIFE（immediately invokable function expression）模式。
  (function(){
  console.log(‘This is a function expression’);
  })();
  IIFE一旦声明就会立即执行。

  箭头函数arrow function，适合non-method function，不能用作constructor
  (arg) => { console.log(`This is an arrow function with param ${arg}`)};

  注意：这里引发了一个this关键字问题
  每个函数中都有this变量，但是在函数中调用时含义会有所不同，不可嵌套。
  解决这个问题可以这么做：

  function wrapperFunc() {
  var that = this;
  that.val = 1;

  setInterval(function growUp() {
  that.val++;
  }, 1000);

  }

  然而，箭头函数没有this关键字，可以这么干：

  function wrapperFunc() {
  this.val = 1;

  setInterval(()=>{
  this.val++;
  }, 1000);
  }

  # typeof, throw, 默认属性

  typeof判断类型，JavaScript支持的类型有：
  object
  number
  function
  string

  throw Error(…) 抛出错误，通过 try…catch 捕获异常
  在request.js中自定义了RequestError，为Error增加了type属性
  捕获后可查看e.type, e.message

  var success = options.success || noop;
  默认属性，如果没有定义success，会采用noop定义的空方法。

  在request.js中，默认属性方法做了以下功能：
  从session里读取会话服务器发送的Session，request请求时，把session信息附加到request请求。
  wx.request(utils.extend({}, options, {
  header: utils.extend({}, originHeader, authHeader),…

  赞 回复

• 

  米 （   ） PHP 02/18

  很厉害啊!春节回到家里,根本没心思了

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 02/19

  2月19日

  截止今天已经7天了，过年7天乐结束。是时候总结一下这7天的成果啦。后端开发者学习JavaScript的7天之旅。

  赞 回复

• 

  mg惊艳一枪 （   ） 工程部 02/25

  1-

  2-

  3-

  赞 回复

• 

  Neo    02/25

  成果怎么样呢？

  赞 回复

• 

  唐尤华 （ 18 ·      ） just programmer 03/06

  还不错, 已经可以自己上手修改SDK啦

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/18

  对于“学习技术”这个知识论和方法论的方面的主题问题，体现在每个人个体上不同差异巨大，有的人学习快有的人有点“笨”。年轻人学习快，年纪大学习慢。

   

  我谈谈我的想法，看法。

  1.年龄。年龄对于学习效率仅仅是“记忆力，思维慢”吗？

  不，主要因素不是这方面的影响，是“固有的知识思维惯性”在干扰你新思想的输入！

  每个知识体系都是人对世界的认识，体现了人主观感受对客观世界的新的认识路径和方法。如同“牛顿经典物理学体系”和“爱因斯坦相对论物理知识体系”就是不同的。

  为什么呢？因为实验条件和实验方法有了很大的积累及其改进，观测的现象从常规尺度到了宇宙天体至原子电子光子尺度，横跨26个数量级！！！

  你说经典物理学能解释现代物理学所涵盖的现象解释吗？

  “物理两朵乌云”19世纪的最后一天所提出的：

  “动力理论肯定了热和光是运动的两种方式，现在，它的美丽而晴朗的天空却被两朵乌云笼罩了，”“第一朵乌云出现在光的波动理论上，”“第二朵乌云出现在关于能量均分的麦克斯韦-玻尔兹曼理论上。

  这就是人类进步带来的新知识的积累。“新技术”就是新知识的应用。

  原有的对技术的解释的知识体系已经不适用了，对知识解释的原理体系也已经过时。

  它们在学习新知识的时候不是在帮助你，而是在“干扰你”。

  在你建立现象与本质链路时，滑入旧的推理里。毕竟人的思维依赖物质大脑的活动，新的刺激要固化成大脑神经元的连接是要不断“训练”的。

  或许它帮不了你省去幸苦学习的过程，但是它明确了你学习时困惑的原因和形成新知识链路的方向，依此方针合理规划学习要素，认识学习关系，自然提高学习效率。

  老龄除了物质上的生理的不利因素，更要意识到旧的不断强化的知识体系对新知识体系的干扰。

   

   

   

  2.关于学习新知识的知识。

  除了物质生理上，旧的思想干扰还有什么是影响新知识技术的学习呢？

  是“关于学习的知识”。它是关于认识对象的学习本质，如何安排学习过程，应用学习方法提升效率的理论知识方法。

  一切知识都是主观对客观的能动反映，它是观测（观察测试）的积累。

  “新”新在哪里？对旧的事物认识有什么不同？

  它是操作什么，形成什么，达到什么目的？例如：前端和后端知识体系。

  前端是什么？目的是对客户的展示！本质是建立在“浏览器”下的脚本语言！

  语言意味着“描述对象的内容（人类认识中的范畴属性）”，

  在前端领域下具体就是描绘：

  “展示什么对象，对象的属性”“如何展示”“与后端的交互联系”

  “html，css，js”这些语言语法说的是什么？是对网页内容什么的描述？

   

  或者你作为前端设计人员，你在创作时考虑什么？

  依据你想要达成的目的实现效果，你要对展示内容在浏览器下“属性，动作”进行设计，或者你在设计一个“物种”！！！它有价值，你在社会领域下卖出它获得价值，表现为你的薪酬。

  前端结果展示的就是内容的“属性，动作”。

  展示内容对象自身属性由html语法描述表达。

  对于直接描述文字内容的大小颜色，形式的字体，间接描述多媒体素材的图音影的“位置链接”。

  展示内容在空间感受上用的“css”语法描述。

  说白了就是“切块”，展示内容元素之间的空间关系属性，各种“框架”就是进一步在美学限制下形成的不同安排元素空间关系的“方案”。

  js语法是“动作”的描述，在时间感受上给予客户展示内容状态改变。

  在浏览器环境下，前端的领域运用下所要求的是对展示内容“操作”，也就是动作，基础的如刷新，跳转，与后端的互操作等等行为，它对用户展示的是“行为表现”，从“静态”到“动态”给予不同用户不同动作的反馈就是展示内容的行为表现。

  展示内容对象是核心（html），用户空间感受（css）和时间感受（js），

  面向用户感受展示浏览器下的内容，内容空间关系，内容的状态的变化（对用户操作的反馈）。

  语言就是描述，你的工作就是对展示内容的设计，展示内容在浏览器环境下面向“客户”展示工作任务目标。

  为了客户你还要掌握限制设计活动思想的设计原则，这些原则是依据客户感受知识对设计元素属性，行为的要求，这让你在设计思维活动中对展示对象的属性有了一点的范围参考，不但要会说还要说的“好”。

  安排什么样式的内容，怎么安排，设计原则就是在阐述设计对象和客户感受要求下的属性行为范围。

  前端知识体系基本上就是展示内容和它的限制（设计原则）组成，了解浏览器（工作环境），了解不同展示对客户的感受刺激（美学原理）基本上是“设计工作”的内涵了。

  基于浏览器的优化，快速展示，图片压缩，分布式储存这些二级或者交叉技术则是应对诸如中等，大型网站的需求，毕竟它应对的情况就复杂了，商业环境也对前端设计提出设计范畴外的需求。

  前端人员设计素养仅仅是“入门工作技能之一”，大中小固有的设计样式怎么快速掌握对不同应用领域应用需求部署，拿来就用，小改优化，现成的设计方案是最有“成效比”的。

  从基本知识领域延伸，从设计元素的属性行为描述，到对客户美学感受需求，技术性优化，过程管理的优化，这些是对不同展示内容的创造（属性行为展示），

  展示内容与用户美学感受作用要求，展示内容与后端作用要求，展示内容设计内容与工作目的要求，展示内容与工作效率要求。这些在设计环节采用不同程度的设计作品，什么样式的作品相关。

  没有从基础原子层次设计开始的设计工作，学习过程是这样，但是应用，工作往往是借鉴，模仿，不同程度的抄袭，部分优化改进。每一个环节和属性行为都是对应工作成本的。

  这是我对所谓前端工作的认识，我仅仅是简单的“思辨”。

  基于我的“哲学”本体论，知识论，方法论推理出来“前端设计的工作领域，工作要素”。

   

  世界是运动的，联系的，相互作用的。但是无限的时空下个体又是局限在一定的环境条件和历史发展中的这就是“辩证法”。你不能绝对的去认识事物而是要相对的认识它，即“具体问题具体看待”。

  html，css，js只能保证你设计出展示的内容，但是工作目的和客户美学会对设计属性行为进行要求限制，也就是说设计在不同对象下有不同意义，联系和作用。

  前端三大知识系统的本质是什么呢？是事物对人的展示感受形式，

  字体，大小，颜色，多媒体图片声音，你不创作内容（这些是UI，编辑的工作），是对浏览器环境下的用户感受形式及交互的设计，即事物的属性和行为的反映。

  而这些对于用户而言是样式与内容一起被展示。

  在后端这些被抽象成代码与数据，在信息安全下这些就是“注入对象”。

  设计就是创造，设计时考虑的美学原则是重要的基础原则，但是这仅仅是信息在人类认识下的解读，信息还是后端下的代码和数据，商业下的生产要素，团队成员的工作技能。

  前端知识体系究竟有多少知识系统，多少内容的主题呢？这些主题的关系是什么呢？

  但是设计的二元基础设计展示与用户美学是一切的基础，因为人的哲学认识论中“存在”才能被认识。

   

   

  3.

  奔四的人了，工作十年。你有这个认识吗？

  你要首先认识到这种关于实质性知识的意识吗？

  工作只是在实现和训练你的细节知识，只是在不断的重复。

  宗教，哲学，科学。             科学：  理科，社科，人文。

  信息技术仅仅是实现。一切知识都是人对外在的认识和感受形成的。

  前端是设计工作，是对展示内容依据美学原理的人的感受形式的知识性描述。

  运用的工具就是三大不同知识领域的“语言（html，css，js）”

  分别对展示元素本体感受属性，时（对感受接受体是状态改变，对感受发出对象是动作能力）空（对象间存在的描述）。

  这些知识是保障设计人员描述设计对象对人而言如何存在的知识

  （事物在浏览器环境下存在和观测者的人感受）的知识系统。

  设计第一步就是“对浏览器说明它（展示内容）是什么”，

  描述的是局限在人类感知下的语言表达中的对象存在和改变，部分和整体（对象范畴），个性和共性（属性范畴），绝对和相对（程度范畴）。

  它是对人而言是怎么存在（性质）和改变（行为）。

  它是什么的本体论，它是人的观测手段下的知识描述的认识论。

  。

  方法论是人对事物的有目的的改造。

  它存在于不同领域，存在联系和发展。

  美学原理是展示对象与人相互作用和联系的知识，说明的是对象不同属性和行为下人的感受。这是它对于设计人员的本征态。

  它在后端是代码和数据。它在光纤是信息。它在生产过程中是产品，在项目产品中又是组成要素。

  事物存在与事物在不同领域中的关系是不同的，它反映人对事物不同侧面的把握，

  它的知识是人的认识的积累，不同知识是人对事物与关系的范畴。

  设计范畴是对信息的意义理解形式的把握（事物存在与感受感知），侧重人对事物形式的意义感受。

  数据与代码范畴是对信息在硬件存在形式的把握的抽象，侧重对事物状态和操作的信息区分。

  信息这个范畴的意义则是对物质，能量的认识分化而存在的，信息表达的是事物存在状态及其改变的形式。

  不同的范畴对人而言有不同的意义，它反映人把握事物存在的不同目的，一切的核心是人及其意识，形成的就是知识的积累。

  所谓学习就是事物范畴在人的意识下的新的认识，关于存在，关于运动，关于联系。

   

  信息是计算机科学的事物本质，数据和代码是事物状态和行为的形式反映，前端是事物的展示对人的感受展示形式，传播过程就是信息这个范畴把握事物存在，在后端就是数据和代码这两个范畴把握反映信息的分类层次，前端则在人的感受认知下细化成不同属性类别。它们认知的颗粒度和知识的性质对人的感知侧重不同。

   

  关于学习这一人主观意识思维的能力，从哲学层次把握更能找到学习的方向和路径，

  更快的理解它的对人的本质内涵和外延。

  赞 回复

• 

  时代与进步 （ 5 ） 信息安全（单身ing） 03/19

  看问题的视角不同掌握事物的范畴也不同

  赞 回复