开发过程中js遇到的问题及一些基础知识恶补

Supermarket 开发过程中js遇到的问题及一些基础知识恶补

函数相关问题
DOM元素相关操作
变量操作
异常捕获
开发过程中关于条形码识别
开发结束关于前端板块思路

函数相关问题

(function(){})() 这种形式定义即被执行,即自调用函数
隐式参数可通过方法内置的arguments获取（arguments为数组对象）
setInterval(method,time) //method只写名称，即表示引用函数对象（method()表示的是函数结果）

DOM元素相关操作

除了querySelector，还可以可通过获取getElemrntby+ id、name、Tagname、classname获取元素节点
document.querySlector(key) 若获取为空，会返回null.null是作为一个Object来存在的。
onload 是在document加载完成后执行的，它属于dom的event事件，类似的还有鼠标焦点事件，点击事件，dom加载事件
标签创建:createElement（‘’） -> 标签写入:element.append()
addEventListinor可对dom的相关事件进行监听

还有MutationObserver对象，可用来监听元素属性，元素子节点，元素的结构变化

     let MutationObserver =window.MutationObserver ||window.WebKitMutationObserver ||window.MozMutationObserver;let observer = new MutationObserver(mutationList => {//这里是观察到标签样式改变就会执行的函数console.log('change1');});observer.observe(dom, {// attributes: true,//监听属性attributeFilter: ["style"],//监听样式// attributeOldValue: true,// childList: true,//子元素的变动// subtree: true, //所有下属节点（包括子节点和子节点的子节点）的变动//characterData:true //节点内容或节点文本的变动});

变量操作

变量基本操作是从左向右

 911+7+'test' //918test ; 'test'+911+7 //test9117

基本数据类型；string,number,boolean,undefined
null属于Object
‘==’:值判断; ‘===’: 值与类型均判断。eg. undefined == null //true; undefined===null //false
对于Object类型的判断 ——>
可通过constructor返回构造函数，构造函数包含Object类型的相关关键字，可通过字符串转换结果后截取
默认undefined的Boolean为false
forEach中function有三个参数(item,index,array);
forEach不可用break与continue
对于blob(二进制大对象)，可用来接收媒体类、文档类及相关应用数据

异常捕获

try{}catch(err){console.log(err.message)}try{if(errflag) throw 'errr mine'}catch(err){console.log(err);//print 'errr mine'}

开发过程中关于条形码识别

当时的思路是使用前端的JS库来完成条形码识别任务，当时选用的的是quaggaJS,调用也特别简单，想法是使用两种模式来进行条形码识别:

调用设备摄像头，对媒体流进行捕捉，quaggaJS有这种想法的API，但是识别效率较低；
调用前端的input标签获取静态图像，进行相关识别，quaggaJS中命名的是static image，照片输入分辨率调了很久，依旧识别效率不高。
这个库使用起来相对比较好理解，细节不赘述，流程是初始化（设置照片处理的分辨率、照片识别块的大小，使用的处理器个数，图片处理事件初始化，一些DOM event触发事件初始化，其中，前几个照片参数得调教）-> 输入图片->图片经过UrlObject相关方法处理输入识别api ->这里有几个函数接口一个是过程函数progress，一个是结果函数都会获取识别结果，看需求增加相应的响应函数体

但是参数没调教好，识别效果不太理想，满足不了正常需求，好在正式环境基本没有并发量，后来使用了python的pyzbar,后端直接处理相应的需求。

开发结束关于前端板块思路

首先，对于请求可以通过后端的模板渲染得到网页尽量减少api的暴露，xhr请求可适当的改变，可返回后端渲染后的结果，以确保页面加载逻辑不被破环；也可以进行加密等等，例如可通过MD5对一些标志进行对等判断等等

其次，js对于在加载时不触发的js加入defer，可预先加载，但不执行
可返回后端渲染后的结果，以确保页面加载逻辑不被破环；也可以进行加密等等，例如可通过MD5对一些标志进行对等判断等等

开发过程中js遇到的问题及一些基础知识恶补相关推荐

论文浅尝 - WWW2020 | 通过对抗学习从用户—项目交互数据中挖掘隐含的实体偏好来用于知识图谱补全任务...
笔记整理 | 陈湘楠,浙江大学在读硕士. 现有的知识图谱补全方法都在试图设计全新的学习算法,来使用已知的事实信息去推理知识图谱中的潜在语义.但随着知识图谱的广泛使用,知识图谱中的许多实体对应着应用程序 ...
python的知识点运用_程序猿在Python编程中不得不使用的十二种基础知识
Python编程中常用的12种基础知识,其中肯定有你不会的! 人生苦短,我用Python 1.正则表达式替换目标: 将字符串line中的 overview.gif 替换成其他字符串. 人生苦短,我用 ...
计算机中常用术语CAD是指,计算机基础知识理论复习题及答案
计算机基础知识理论复习题及答案基础知识复习题及答案一. 选择题 1. 第三代计算机所使用的电子器件是( ). A)晶体管 A)科学计算 A)存储记忆 A)计算机辅助设计 A)体积大 A)8位 A) ...
lsdyna如何设置set中的node_list_ANSA中进行二次开发的Python基础知识
ANSA.META的二次开发均基于Python开发.本文基于ANSA的帮助文档<Introduction to Python>进行一定的扩展,希望能帮助大家快速掌握这门语言. 首先来介绍下 ...
java easing_[译] 动画中缓动（easing）的基础知识
自然界中没有东西是从一个点线性地移动到另一点. 在现实中,事物在运动时可能加速或减速. 我们的大脑习惯于期待这种运动,因此在做动画时,应利用此规律. 自然的运动会让用户对你的应用感觉更舒服,从而产生更 ...
spidermonkey php,javascript SpiderMonkey中的函数序列化如何进行_基础知识
在Javascript中,函数可以很容易的被序列化(字符串化),也就是得到函数的源码.但其实这个操作的内部实现(引擎实现)并不是你想象的那么简单.SpiderMonkey中一共使用过两种函数序列化的技 ...
在html中列表是块元素还是,HTML基础知识4-列表及表单的写法、块级元素和内联（行内）元素的区别...
一.有序列表.无序列表.自定义列表如何使用?写个简单的例子.三者在语义上有什么区别?在哪些情况下使用哪种(重要)? 如何嵌套? 1.简单例子如下: Document div.div1 { backgr ...
中点和中值滤波的区别_滤波器基础知识简介
从图1中可以看到,滤波器广泛应用在接收机中的射频.中频以及基带部分.虽然对这数字技术的发展,采用数字滤波器有取代基带部分甚至中频部分的模拟滤波器,但射频部分的滤波器任然不可替代.因此,滤波器是射频系统 ...
j2se学习中的一些零碎知识点2之基础知识
1.static修饰的变量叫做"静态变量"(静态变量,被存储在方法区中,所有的java对象共享静态变量,所有静态变量是类级别的,使用"类名."的方式访问.),s ...