js是什么意思?(手把手教你如何编写易维护的JS代码)
如果有更好的建议或者想看更多关于综合百科技术大全及相关资讯,可以多多关注茶馆百科网。

作者:奇舞周刊李
正向链接:https://mp.weixin.qq.com/s/XjlddiMNQbExB0vtTLWThA
在早期的网站中,JavaScript主要用于实现一些小的动态效果或者表单验证。今天的Web应用程序使用数千行JavaScript代码来完成各种复杂的处理。这些变化要求开发人员把可维护性放在重要位置。就像传统的软件工程师一样,JavaScript工程师是被雇佣来为公司创造价值的。现代前端工程师的使命不仅仅是保证产品如期上线,更重要的是日积月累为公司积累知识资产。
编写可维护的代码非常重要,因为许多开发人员花费大量时间来维护他人编写的代码。在实际开发中,从第一行代码开始写是非常少见的。通常你要在别人的代码上构建自己的作品。让自己的代码易于维护,可以保证其他开发人员更好地完成工作。
注意's的可维护代码概念不仅适用于JavaScript,其中许多也适用于任何编程语言。当然,有些概念可能确实是JavaScript特有的。
1.什么是可维护的代码
可维护代码有几个特点。一般来说,说代码是可维护的,意味着它具有以下特征。简单易懂:无需向原开发者求助,任何人都可以知道代码是干什么用的,是如何实现的。常识:代码中的一切看起来都很自然,不管操作有多复杂。易于适应:即使数据发生变化,也不必完全重写。易于扩展:代码架构经过精心设计,以支持核心功能的未来扩展。易于调试:当出现问题时,代码可以给出明确的信息,通过这些信息可以直接定位问题。能够编写可维护的JavaScript代码是一项重要的专业技能。这项技能是在一个周末拼凑一个网站的业余爱好者和对他们所做的一切都深思熟虑的专业开发人员之间的一个重要区别。
2.编码规范
编写可维护代码的第一步是认真考虑编码规范。大多数编程语言中都涉及到编码规范。在网上简单搜索就能找到成千上万的相关文章。专业机构为开发者建立了编码规范,旨在让人们写出更易维护的代码。优秀的开源项目都有严格的编码规范,让社区里的每个人都很容易理解代码的组织。编码规范对JavaScript非常重要,因为这种语言非常灵活。与大多数面向对象的语言不同,JavaScript不强迫开发人员将任何东西定义为对象。相反,JavaScript支持任何编程风格,包括传统的面向对象编程和声明式编程,以及函数式编程。简单看一下几个开源的JavaScript库就会发现,创建对象、定义方法和管理环境有很多种方式。
以下部分将讨论开发编码规范的一些基本方面。这些主题很重要,当然每个人的需求不同,实现方式也可以不同。
2.1可读性
要想让代码易于维护,首先要让代码易于理解。可读性必须考虑代码是一个文本文件。所以代码缩进是保证可读性的重要基础。如果每个人都使用相同的缩进,整个项目的代码会更容易理解。缩进通常是用空格数而不是Tab (tab)来定义的,因为后者在不同的文本编辑器中会有不同的显示。一般来说,缩进是以4个空格为单位的,当然具体数字可以自己确定。可读性的另一个方面是代码注释。在大多数编程语言中,为每个方法编写注释是被广泛接受的。因为JavaScript可以在代码的任何地方创建函数,所以这很容易被忽略。正因为如此,在JavaScript中给每个函数写注释可能更重要。一般来说,以下地方都要标注。
功能和方法。每个函数和方法都应该有注释来描述它的目的和用来完成任务的算法。同时要写清楚使用这个函数或方法的前提(假设),每个参数的意义,函数是否返回值(因为通过函数定义并不明显)。大代码块。如果有多行代码但都是用来完成单个任务的,前面要给出注释,让要完成的任务清晰。复杂的算法。如果你用不寻常的方法解决问题,你应该通过评论来解释。这样不仅能帮助别人,还能让你以后再看的时候记得更快。用黑科技。由于浏览器之间的差异,JavaScript代码通常包含一些黑科技。不要以为别人一眼就能明白,解决一个浏览器的问题是什么黑科技。如果对于一个浏览器来说,不能用正常的方式达到目的,那就要在评论里把黑科技的目的写出来。这样可以防止别人误以为黑科技没用& quot修理& quot它。这样一来,你已经修复的问题就会再次出现。缩进和注释可以使代码在将来更容易理解和维护。
2.2变量和函数命名
变量和函数的正确命名对于可读性和可维护性也是至关重要的。因为许多JavaScript开发人员都是& quot粗心的& quot,很容易用foo和bar命名变量,用doSomething命名函数。专业的JavaScript开发人员必须改掉这些习惯,才能写出可维护的代码。以下是关于命名的一般规则。变量名应该是名词,比如car或者person。函数名应该以动词开头,比如getName()。返回布尔值的函数通常以is开头,比如isEnabled()。对变量和函数都使用逻辑名,不用担心长度。名字长的问题可以通过后期处理和压缩来解决。变量、函数和方法应该以小写字母开头,使用驼峰大小写,比如getName()和。
isPerson。类名应该首字母大写,比如Person、RequestFactory。常量值应该全部大写并以下划线相接,比如REQUEST_TIMEOUT。名字要尽量用描述性和直观的词汇,但不要过于冗长。getName()一看就知道会返回名字,而PersonFactory一看就知道会产生某个Person对象或实例。要完全避免没有用的变量名,比如不能表示所包含数据的类型。通过适当命名,代码读起来就会像故事,因此更容易理解。
2.3变量类型透明化
因为JavaScript是松散类型的语言,所以很容易忘记变量包含的数据类型。适当命名可以在某种程度上解决这个问题,但还不够。有三种方式可以表明变量的数据类型。
第一种方式是通过初始化。定义变量时,应该立即将其初始化为一个将来要使用类型的值。例如,要保存布尔值的变量可以将其初始化为true或false,而要保存数值的变量可以将其初始化为一个数值。再看几个例子:
//通过初始化表明变量类型
letfound=false;//Boolean
letcount=-1;//number
letname="";//string
letperson=null;//object
初始化为特定数据类型的值可以明确表示变量的类型。在ES6之前,初始化方式不适合函数声明中函数的参数。ES6之后,可以在函数声明中为参数指定默认值来表明参数类型。
第二种表示变量类型的方式是使用匈牙利表示法。匈牙利表示法指的是在变量名前面前缀一个或多个字符表示数据类型。这种表示法曾经在脚本语言中非常流行,很长时间以来也是JavaScript首选的格式。对于基本数据类型,用o表示对象(object)、s表示字符串(string),i表示整数(integer),f表示浮点数(float)、b表示布尔值(boolean)。下面看几个例子。
//使用匈牙利表示法标明数据类型
letbFound;//Boolean
letiCount;//integer
letsName;//string
letoPerson;//object
匈牙利表示法也可以应用给函数参数。匈牙利表示法的缺点是让代码可读性有所下降,不够直观,破坏了类似句子的自然阅读流畅性。为此,匈牙利表示法已经被很多开发者抛弃。
最后一种表明数据类型的方式是使用类型注释。类型注释放在变量名后面,初始化表达式的前面。基本思路是在变量旁边使用注释说明类型,比如:
//使用类型注释标明数据类型
letfound=false;
letcount=10;
letname="Nicholas";
letperson=null;
类型注释在保持整体可读性的同时向代码中注入了类型信息。类型注释的缺点是不能再使用多行注释把大型代码块注释掉了。因为类型注释也是多行注释,因此会造成干扰,如下面的例子所示:
//这样多行注释不会生效
=false;
letcount=10;
letname="Nicholas";
letperson=null;
*/
这里本来是想使用多行注释把所有变量声明都注释掉。但类型注释产生了干扰,因为第一个(第3行)匹配,结果会导致语法错误。如果想注释掉包含类型注释的代码,只能使用单行注释一行一行地注释掉每一行(有的编辑器可以自动完成)。
以上是三种标明变量数据类型的最常用方式。每种方式都有优点和缺点,可以根据自己的情况选用。关键要看哪一种最适合自己的项目,并保证一致性。
3.松散耦合
只要应用的某个部分对另一个部分依赖得过于紧密,代码就会变成强耦合,因而难以维护。典型的问题是在一个对象中直接引用另一个对象。这样,修改其中一个,可能必须还得修改另一个。紧密耦合的软件难于维护,肯定需要频繁地重写。
考虑到相关的技术,Web应用在某些情况下可能变得过于强耦合。关键在于有这个意识,随时注意不要让代码产生强耦合。
3.1解耦HTML/JavaScript
Web开发中最常见的耦合是HTML/JavaScript耦合。在网页中,HTML和JavaScript分别代表不同层面的解决方案。HTML是数据,JavaScript是行为。因为它们之间要交互操作,需要通过不同的方式将这两种技术联系起来。可惜的是,其中一些方式会导致HTML与JavaScript相耦合。
把JavaScript直接嵌入在HTML中,包括使用<script>元素包含嵌入代码或使用HTML属性添加事件处理程序,都会造成强耦合。比如下面的例子:
<!--使用<script>造成HTML/JavaScript强耦合-->
<script>
document.write("Helloworld!");
</script>
<!--使用事件处理程序属性造成HTML/JavaScript强耦合-->
<inputtype="button"value="ClickMe"onclick="doSomething()"/>
虽然技术上这样做没有问题,但实践中这样会导致HTML的数据与JavaScript的行为紧密耦合在一起。理想情况下,HTML和JavaScript应该完全分开,通过外部文件引入JavaScript,然后使用DOM添加行为。
HTML与JavaScript强耦合的情况下,每次分析JavaScript的报错都要首先确定错误来自HTML还是JavaScript。而且,这样也会引入代码可用性的新错误。在这个例子中,用户可能会在doSomething()函数可用之前点击按钮,从而导致JavaScript报错。由于每次修改按钮的行为都需要既改HTML又改JavaScript,而实际上只有后者才是有必要修改的。这样就会降低代码的可维护性。
在相反的情况下,HTML和JavaScript也会变得强耦合:把HTML包含在JavaScript中。这种情况通常发生在把一段HTML通过innerHTML插入到页面中,比如:
//HTML紧耦合到了JavaScript
functioninsertMessage(msg){
letcontainer=document.getElementById("container");
container.innerHTML=`<divclass="msg">
<p>class="post">${msg}</p>
<p><em>Latestmessageabove.</em></p>
</div>`;
}
一般来说,应该避免在JavaScript中创建大量HTML。同样,这主要是为了做到数据层和行为层各司其职,在出错时更容易定位问题所在。如果使用上面的代码示例,那么如果动态插入的HTML格式不对,就会造成页面布局出错。但在这种情况下定位错误就更困难了。因为这时候通常首先会去找页面中出错的HTML源代码,但又找不到,因为它是动态生成的。而且修改数据或页面,还需要修改JavaScript,这说明两层是紧密耦合的。
HTML渲染应该尽可能与JavaScript分开。在使用JavaScript插入数据时,应该尽可能不要插入标记。相应的标记可以包含并隐藏在页面中,在需要的时候JavaScript可以直接用它来显示,而不需要动态生成。另一个办法是通过Ajax请求获取要显示的HTML,这样也可以保证同一个渲染层(PHP、JSP、Ruby等)负责输出标记,而不是把标记嵌在JavaScript中。
解耦HTML和JavaScript可以节省排错时间,因为更容易定位错误来源。同样解耦也有助于保证可维护性,对行为的修改只涉及JavaScript,而对标记的修改则只涉及要渲染的文件。
3.2解耦CSS/JavaScript
Web应用的另一层是CSS,主要负责页面的外观。JavaScript和CSS是紧密相关的,它们都是建构在HTML之上的,因此也经常一起使用。与HTML和JavaScript的情况类似,CSS也可能与JavaScript产生强耦合。最常见的例子就是使用JavaScript修改个别样式,比如:
//CSS紧耦合到了JavaScript
element.style.color="red";
element.style.backgroundColor="blue";
因为CSS负责页面外观,任何样式的问题都应该通过CSS文件解决。可是,如果JavaScript直接修改个别样式(比如颜色),就会增加一个排错时要考虑甚至要修改的因素。结果是JavaScript某种程度上承担了页面显示的任务,与CSS搞成了紧密耦合。如果将来有一天要修改样式,那么CSS和JavaScript都需要修改。这对负责维护的开发者来说是一个恶梦。层与层的清晰解耦是必需的。
现代Web应用经常使用JavaScript改变样式,因此虽然不太可能完全解耦CSS和JavaScript,但可以让这种耦合变成更松散。这主要可以通过动态修改类名而不是样式来实现,比如:
//CSS与JavaScript松散耦合
element.className="edit";
通过修改元素的CSS类名,可以把大部分样式限制在CSS文件里。JavaScript只负责修改应用样式的类名,而不直接影响元素的样式。只要应用的类名没错,那么外观的问题就只跟CSS有关,而跟JavaScript无关。
同样,保证层与层之间的适当分离是至关重要的。显示出问题就只应该去CSS里解决,行为出问题就只应该找JavaScript的问题。这些层之间的松散耦合可以提升整个应用的可维护性。
3.3解耦应用逻辑/事件处理程序
每个Web应用中都会有大量事件处理程序在监听各种事件。可是,其中很少有真正做到应用逻辑与事件处理程序分离的。来看下面的例子:
functionhandleKeyPress(event){
if(event.keyCode==13){
lettarget=event.target;
letvalue=5*parseInt(target.value);
if(value>10){
document.getElementById("error-msg").style.display="block";
}
}
}
这个事件处理程序除了处理事件,还包含了应用逻辑。这样做的问题是双重的。首先,除了事件没有办法触发应用逻辑,结果造成调试困难。如果没有发生预期的结果怎么办?是因为没有调用事件处理程序,还是因为应用逻辑有错误?其次,如果后续事件也会对应相同的应用逻辑,就会导致代码重复,否则就要把它提取到一个函数中。无论如何,都会导致原本不必要的多余工作。
更好的做法是将应用逻辑与事件处理程序分开,各自只负责处理各自的事情。事件处理程序应该专注于event对象的相关信息,然后把这些信息传给处理应用逻辑的某些方法。例如,前面的例子可以重写成这样:
functionvalidateValue(value){
value=5*parseInt(value);
if(value>10){
document.getElementById("error-msg").style.display="block";
}
}
functionhandleKeyPress(event){
if(event.keyCode==13){
lettarget=event.target;
validateValue(target.value);
}
}
这样修改之后,应用逻辑跟事件处理程序就分开了。handleKeyPress()函数只负责检查用户是不是按下了回车键(event.keyCode等于13),如果是则取得事件目标,并把目标的值传给validateValue()函数,由该函数处理应用逻辑。注意,validateValue()函数中不包含任何依赖事件处理程序的代码。这个函数只负责接收一个值,然后可以对这个值做任何处理。
把应用逻辑从事件处理程序中分离出来有很多好处。首先,可以方便地修改触发某个流程的事件。如果原来是通过鼠标单击触发流程,而现在又想增加键盘操作来触发,那么修改起来也很简单。其次,可以在不用添加事件的情况下测试代码,这样创建单元测试甚至与应用自动化整合都会更简单。
以下是在解耦应用和业务逻辑时应该注意的几点。
不要把event对象传给其他方法,而是只传递event对象中必要的数据。应用中每个可能的操作都应该无需事件处理程序就可以执行。事件处理程序应该处理事件,而把后续处理交给应用逻辑。做到上述几点能够给任何代码的可维护性带来巨大的提升,同时也能为将来的测试和开发提供很多可能性。
4.编码惯例
编写可维护的JavaScript不仅仅涉及代码格式和规范,也涉及代码做什么。大企业开发Web应用通常需要很多人协同工作。这时候就需要保证每个人的浏览器环境都有恒定不变的规则。为此,开发者应该遵守某些编码惯例。
4.1尊重对象所有权
JavaScript的动态天性意味着几乎可以在任何时候修改任何东西。过去有人说,JavaScript中没有什么是神圣不可侵犯的,因为不能把任何东西标记为最终结果或者恒定不变。但ECMAScript5引入防篡改对象之后,情况不同了。当然,对象默认还是可以修改的。在其他语言中,在没有源代码的情况下对象和类都是不可修改的。JavaScript则允许在任何时候修改任何对象,因此就可能导致意外地覆盖默认行为。既然这门语言没有什么限制,那就需要开发者自己限制自己。
在企业开发中,可能最最重的编码惯例就是尊重对象所有权,这意味着不要修改不属于你的对象。简单地讲,如果你不负责创建和维护某个对象,包括它的构造函数或它的方法,就不应该对它进行任何修改。更具体一点说,就是:
不要给实例或原型添加属性不要给实例或原型添加方法不要重定义已有的方法问题在于,开发者会假设浏览器环境以某种方式运行。修改了多个人使用的对象也就意味着会有错误发生。如果有人希望某个函数叫stopEvent(),用于取消某个事件的默认行为。然后,你把它给改了,除了取消事件的默认行为,又添加了其他事件处理程序。可想而知,问题肯定会接踵而至。别人还会认为这个函数只做最开始的那点事,由于对它后来添加的副作用并不知情,很可能会用错或者造成损失。
以上规则不仅适用于自定义类型和对象,同样适用于原生类型和对象,比如Object、String、document、window,等等。考虑到浏览器厂商也有可能会在不宣布的情况下以非预期方式修改这些对象,那么潜在的风险就更大了。
以前有一个流行的Prototype库就发生过类似事件。当时,这个库在document对象上实现了getElementsByClassName()方法,返回一个Array的实例,而这个实例上还增加了each()方法。jQuery的作者JohnResig后来在自己的博客上分析了这个问题造成的影响。他在博客中(https://johnresig.com/blog/getelementsbyclassname-pre-prototype-16/)指出这个问题是由于浏览器也原生实现了相同的getElementsByClassName()方法造成的。但Prototype的同名方法返回的是Array而非NodeList,后者没有each()方法。使用这个库的开发者之前会写这样的代码:
document.getElementsByClassName("selected").each(Element.hide);
尽管这样写在没有原生实现getElementsByClassName()方法的浏览器里没有问题,但在实现它的浏览器里就会出问题。因为两个同名方法返回的结果不一样。我们不能预见浏览器厂商将来会怎么修改原生对象,因此不管怎么修改它们都可能在将来某个时刻出现冲突时导致问题。
为此,最好的方法是永远不要修改不属于你的对象。只有你自己创建的才是你的对象,包括自定义类型和对象字面量。Array、document等这些都不是你的,因为在你的代码执行之前它们已经存在了。可以这样为对象添加新功能:
创建包含想要功能的新对象,通过它与别人的对象交互。创建新自定义类型继承本来想要修改的类型,给自定义类型添加新功能。很多JavaScript库目前都赞同这个开发理念,这样无论浏览器怎样改变都可以发展和适应。
4.2不声明全局变量
与尊重对象所有权密切相关的是尽可能不声明全局变量和函数。同样,这也关系到创建一致和可维护的脚本运行环境。最多可以创建一个全局变量,作为其他对象和函数的命名空间。来看下面的例子:
//两个全局变量——不要!
varname="Nicholas";
functionsayName(){
console.log(name);
}
以上代码声明了两个全局变量:name和sayName()。可以像下面这样把它们包含在一个对象中:
//一个全局变量——推荐
varMyApplication={
name:"Nicholas",
sayName:function(){
console.log(this.name);
}
};
这个重写后的版本只声明了一个全局对象MyApplication。在这个对象内部,又包含name和sayName()。这样可以避免之前版本的几个问题。首先,变量name会覆盖window.name属性,而这可能会影响其他功能。其次,有助于分清功能都集中在哪里。调用MyApplication.sayName()从逻辑上就会暗示出现任何问题,都可以在MyApplication的代码中找原因。
这样一个全局对象可以扩展为命名空间的概念。命名空间涉及创建一个对象,然后通过这个对象来暴露能力。比如,GoogleClosure库就利用了这样的命名空间来组织其代码。下面是几个例子:
goog.string:用于操作字符串的方法。goog.html.utils:与HTML相关的方法。goog.i18n:与国际化(i18n)相关的方法。对象goog就相当于一个容器,其他对象都包含在这里面。只要使用对象以这种方式来组织功能,就可以称该对象为命名空间。整个GoogleClosure库都构建在这个概念之上,能够在同一个页面上与其他JavaScript库共存。
关于命名空间,最重要的是确定一个所有人都同意的全局对象名称。这个名称要足够独特,不可能与其他人的冲突。多数情况下,可以使用开发者所在的公司名,例如goog或Wrox。下面的例子演示了使用Wrox作为命名空间来组织功能:
//创建全局对象
varWrox={};
//为本书(ProfessionalJavaScript)创建命名空间
Wrox.ProJS={};
//添加本书用到的其他对象
Wrox.ProJS.EventUtil={...};
Wrox.ProJS.CookieUtil={...};
在这个例子中,Wrox是全局变量,然后在它的下面又创建了命名空间。如果本书所有代码都保存在Wrox.ProJS命名空间中,那么其他作者的代码就可以使用自己的对象来保存。只要每个人都遵循这个模式,就不必担心有人会覆盖这里的EventUtil或CookieUtil,因为即使重名它们也只会出现在不同的命名空间中。比如下面的例子:
//为另一本书(ProfessionalAjax)创建命名空间
Wrox.ProAjax={};
//添加其他对象
Wrox.ProAjax.EventUtil={...};
Wrox.ProAjax.CookieUtil={...};
//可以照常使用ProJS下面的对象
Wrox.ProJS.EventUtil.addHandler(...);
//以及ProAjax下面的对象
Wrox.ProAjax.EventUtil.addHandler(...);
虽然命名空间需要多写一点代码,但从可维护性角度看,这个代价还是非常值得的。命名空间可以确保代码与页面上的其他代码互不干扰。
4.3不要比较null
JavaScript不会自动做任何类型检查,因此就需要开发者担起这个责任。结果,很多JavaScript代码都不会做类型检查。最常见的类型检查是看一个值是不是null。然而,与null进行比较的代码太多了,其中很多都因为类型检查不够而频繁引发错误。比如下面的例子:
functionsortArray(values){
if(values!=null){//不要这样比较!
values.sort(comparator);
}
}
这个函数的目的是使用给定的比较函数对数组进行排序。为保证函数正常执行,values参数必须是数组。但是,if语句在这里只简单地检查了这个值不是null。实际上,字符串、数值还有其他很多值都可以通过这里的检查,结果就会导致错误。
现实当中,单纯比较null通常是不够的。检查值的类型就要真的检查类型,而不是检查它不能是什么。例如,在前面的代码中,values参数应该是数组。为此,应该检查它到底是不是数组,而不是检查它不是null。可以像下面这样重写那个函数:
functionsortArray(values){
if(valuesinstanceofArray){//推荐
values.sort(comparator);
}
}
这个函数的这个版本可以过滤所有无效的值,根本不需要使用null。
如果看到比较null的代码,可以使用下列某种技术替换它。
如果值应该是引用类型,使用instanceof操作符检查其构造函数。如果值应该是原始类型,使用typeof检查其类型。如果希望值是有特定方法名的对象,使用typeof操作符确保对象上存在给定名字的对象。代码中比较null的地方越少,就越容易明确类型检查的目的,从而消除不必要的错误。
4.4使用常量
依赖常量的目标是从应用逻辑中分离数据,以便修改数据时不会引发错误。显示在用户界面上的字符串就应该以这种方式提取出来,可以方便实现国际化。URL也应该这样提取出来,因为随着应用越来越复杂,URL也极有可能变化。基本上,像这种地方因为这种或那种原因将来需要修改时,可能就要找到某个函数,然后修改其中的代码。而每次像这样修改应用逻辑,都可能引入新错误。为此,可以把这些可能会修改的数据提取出来,放在单独定义的常量中,以实现数据与逻辑分离。
关键在于把数据从使用它们的逻辑中分离出来。可以使用以下标准检查哪些数据需要提取。
重复出现的值。任何使用超过一次的值都应该提取到常量中。这样可以消除一个值改了而另一个值没改造成的错误。这里也包括CSS的类名。用户界面字符串。任何会显示给用户的字符串都应该提取出来,以方便实现国际化。URL:Web应用中资源的地址经常会发生变化,因此建议把所有URL集中放在一个地方管理。任何可能变化的值。任何时候,只要在代码中使用字面值,就问问自己这个值将来有没有可能会变。如果答案是有可能,那么就应该把它提取到常量中。使用常量是企业级JavaScript的重要技术,因为它可以让代码更容易维护,同时可以让代码免受数据变化的影响。
推荐JavaScript经典实例学习资料文章
《前端开发规范:命名规范、html规范、css规范、js规范》
《【规范篇】前端团队代码规范最佳实践》
《100个原生JavaScript代码片段知识点详细汇总【实践】》
《关于前端174道JavaScript知识点汇总(一)》
《关于前端174道JavaScript知识点汇总(二)》
《关于前端174道JavaScript知识点汇总(三)》
《几个非常有意思的javascript知识点总结【实践】》
《都2020年了,你还不会JavaScript装饰器?》
《JavaScript实现图片合成下载》
《70个JavaScript知识点详细总结(上)【实践】》
《70个JavaScript知识点详细总结(下)【实践】》
《开源了一个JavaScript版敏感词过滤库》
《送你43道JavaScript面试题》
《3个很棒的小众JavaScript库,你值得拥有》
《手把手教你深入巩固JavaScript知识体系【思维导图】》
《推荐7个很棒的JavaScript产品步骤引导库》
《Echa哥教你彻底弄懂JavaScript执行机制》
《一个合格的中级前端工程师需要掌握的28个JavaScript技巧》
《深入解析高频项目中运用到的知识点汇总【JS篇】》
《JavaScript工具函数大全【新】》
《从JavaScript中看设计模式(总结)》
《身份证号码的正则表达式及验证详解(JavaScript,Regex)》
《浏览器中实现JavaScript计时器的4种创新方式》
《Three.js动效方案》
《手把手教你常用的59个JS类方法》
《127个常用的JS代码片段,每段代码花30秒就能看懂-【上】》
《深入浅出讲解js深拷贝vs浅拷贝》
《手把手教你JS开发H5游戏【消灭星星】》
《深入浅出讲解JS中this/apply/call/bind巧妙用法【实践】》
《手把手教你全方位解读JS中this真正含义【实践】》
《书到用时方恨少,一大波JS开发工具函数来了》
《干货满满!如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React)》
《手把手教你JS异步编程六种方案【实践】》
《让你减少加班的15条高效JS技巧知识点汇总【实践】》
《手把手教你JS开发H5游戏【黄金矿工】》
《手把手教你JS实现监控浏览器上下左右滚动》
《JS经典实例知识点整理汇总【实践】》
《2.6万字JS干货分享,带你领略前端魅力【基础篇】》
《2.6万字JS干货分享,带你领略前端魅力【实践篇】》
《简单几步让你的JS写得更漂亮》
《手把手教你如何处理Web站点图片优化》
《手把手教你通过图片优化,将网站大小减少一半以上》
《前端性能优化之雅虎35条军规》
《函数的节流和防抖【前端优化】》
《JavaScript实现图片合成下载》
《利用JS实现多种图片相似度算法》
《关于图片懒加载的几种方案》
《使用vue实现HTML页面生成图片》
《日访问百万级微信小程序优化技巧总结》
《全面优化Web站点页面加载速度策略》
《手把手教你Vue解析pdf(base64)转图片【实践】》
《全平台(Vue/React/微信小程序)任意角度旋图片裁剪组件》
《手把手教你如何编写一个前端图片压缩、方向纠正、预览、上传插件》
《深入前端tree优化渲染速度从14.65s到0.49s【实战】》
《首屏时间从12.67s到1.06s,手把手教你如何做到的?》
作者:李松峰奇舞周刊
转发链接:https://mp.weixin.qq.com/s/XjlddiMNQbExB0vtTLWThA
本文主要介绍了关于js是什么意思?(手把手教你如何编写易维护的JS代码)的相关养殖或种植技术,综合百科栏目还介绍了该行业生产经营方式及经营管理,关注综合百科发展动向,注重系统性、科学性、实用性和先进性,内容全面新颖、重点突出、通俗易懂,全面给您讲解综合百科技术怎么管理的要点,是您综合百科致富的点金石。
以上文章来自互联网,不代表本人立场,如需删除,请注明该网址:http://23.234.50.4:8411/article/98650.html