`
fengjia10
  • 浏览: 30563 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

Top 10 Things that JavaScript Got Wrong!!!

阅读更多
reference from http://net.tutsplus.com/tutorials/javascript-ajax/top-10-things-that-javascript-got-wrong/

    JavaScript, if only by default, is one of the most popular programming languages available. Over the years, it's been labeled as a nightmare to work with, and, to some extent, this is true! However, more often than not, what people mean to say is that the DOM API is a nightmare. Nevertheless, there are a handful of flat-out errors in the language.

1. The Name. JavaScript is NOT Java

    We'll start with a fun jab at the name choice. While it was originally called Mocha, and then LiveScript, it was later changed to JavaScript. According to history, its similarities to the name Java was the result of a collaboration between Netscape and Sun, in exchange for Netscape bundling the Java runtime within their popular browser. It's also been noted that the name came, almost as a joke, due to the rivalry between LiveScript and Java for client-side scripting.

    Nevertheless, it resulted in thousands of "JavaScript has nothing to do with Java" comments in forums across the web!

2. Null is an Object?

    Consider this..
console.log(typeof null); // object 
.

    his makes zero sense. If null is the absence of a value, then how could its type be "object?" The simple answer is that it's flat-out an error that dates back to the first release of JavaScript - one that was even incorrectly carried over to Microsoft's JScript.

3. NaN !== NaN

    NaN, as we'd expect refers to a value that is not a legal number. The problem is that NaN isn't equal to anything...including itself.

   
  console.log(NaN === NaN); // false  


    This is just wrong. Instead, if you want to determine if a value is indeed NaN, you can use the isNaN() function.

4. Global Variables

    The dependence upon global variables is widely considered to be far and away the worst part of JavaScript. For simple projects, much like the quick tips on this site, it doesn't truly make a difference. However, the real burden of globals come into play when you begin referencing multiple scripts, without any knowledge of how they're created, or named. If they happen to share the same name as one of your variables, your program is going to throw some sort of error.

5. User-Agent Strings Report Mozilla. Ever Wonder Why?

    Alright - this one isn't the fault of JavaScript. I cheated a bit. It's because of the browser vendors. Having said that, user-agent string detection is very common in JavaScript; so it's important to know what you're dealing with. It probably doesn't belong in this list, but who cares! It's good to know.

    This one isn't as much a mistake as it was an unavoidable decision. For example, open Safari, access the Web Inspector, and log the user agent string into the console.

 
   console.log(navigator.userAgent);  
   // Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_8; en-us) AppleWebKit/531.21.8 (KHTML, like Gecko) Version/4.0.4 Safari/531.21.10  


    Note that first string of characters: Mozilla/5.0. Why would Safari identify it as a Mozilla based browser? Though it later correctly identifies itself, that still doesn't explain why they'd bother to mislead programmers. In fact, you'll find that most browsers identify themselves as Mozilla. The answer goes back a decade, and is, again, less an error, and more an unavoidable circumstance.

    For those unfamiliar, a user-agent string is simply meant to identify the browser and its version. As an example, the first ever browser, Mosaic, had a user-agent string that looked like so:
   Mosaic/0.9     // browser name / version number  


    This makes perfect sense. And when Netscape came onto the scene, they kept Mosaic's usage, and also added an encryption type section.

   Mozilla/2.02 [en] (Win95; I)     // browser name / version / encryption  


    So far so good. The problems came into play when - wait for it - Internet Explorer 3 was released. Keep in mind that, when they launched, Netscape was the most popular browser available. In fact, many servers and programs were already implementing user-agent detection in order to identify Netscape. Though this is a highly debated topic today, back then, it wasn't much of an issue. If IE had used their own user-agent string, it would have looked something like this:

MSIE/3.0 (Win95; U)  


    This would have left them at a huge disadvantage, because Netscape was already being identified by many servers. As such, the developers decided to incorrectly identify the browser as Mozilla, and then append an additional set of information labeling it as Internet Explorer.

Mozilla/2.0 (compatible; MSIE 3.0; Windows 95)  


    Nowadays, user-agent detection is a last effort, and its considered so precisely for this reason. You'll find that most browsers followed IE's lead in identifying themselves as Mozilla. Think of it as a chain reaction.

    Further Reading

    I highly recommend that you read Nicholas Zakas's "History of the User-Agent String," if you'd like to delve deeper.

6. Scope Inconsistencies

    Consider the following code:
   // Create a function that will call a function with the name equal to parameter fn.  
   function foo(fn) {  
       if (typeof fn === "function") {  
           fn();  
       }  
    }  
     
    // Create an object with a property and a method.   
    var bar = {  
      barbar : "Hello, World!",  
       method  : function() {  
          alert(this.barbar);  
       }  
   };  
    
  bar.method(); // Alerts Hello, World!  
  foo(bar.method); // If we call the foo function add pass the "bar.method" method, it somehow alerts "undefined."  
  foo(function() { bar.method(); }); // alerts Hello, World, after  


    The reason why foo(bar.method) does not render the same result is because the method function will be called as a method of the window object, rather than bar. To fix this, we must call bar.method() from within the passed anonymous function.

    Thanks so much to Jeremy McPeak for notifying me of this error.

7. The Use of Bitwise Operators

JavaScript shares many similarities with Java - one of them being the set of bitwise operators.

  
    * & - and
    * | - or
    * ^ - xor
    * ~ - not
    * >> - signed right shift
    * ??? - unsigned right shift
    * << - left shift


    Consider the first item, &; it would be much more efficient to use the && operator, as it's quicker. This is because JavaScript isn't the same as Java, and doesn't have integers. As such, a relatively length process is required to convert the operand, do something with it, and then convert it back.

    This is why you can get away with using & for "and", and | for "or" - even though you should be using && and ||.

8. Too Many Falsy/Bottom Values

    Maybe this isn't specifically an error in JavaScript, but it certainly makes the learning process, especially for beginners, a tough one. Values like null, false, and undefined almost mean the same thing, but there are differences that can be confusing to understand.

    To test, open up the console in Firefox, and find the boolean of the following items.

   
   !!(0); // false  
   !!(false); // false  
   !!(''); // false  
   !!(null); // false  
   !!(undefined); // false  
   !!(NaN); // false  


    Please note that any other values will be interpreted as truthy.

    More than an error, this many falsy values is just confusing!

9. It Can't Do Arithmetic

    Okay, okay - I'm 99% teasing with the heading above. But JavaScript does have a few minor issues when working with decimals, for example, things like money transactions. For example, open up your console, and log ".2 + .4". We would expect it to display ".6", correct? Well it does, and it doesn't!

   console.log(.2 + .4); // 0.6000000000000001  


   How come? At a high level, it's because JavaScript used the IEEE Standard for Binary Floating-Point Arithmetic. I, probably like you, don't fully understand exactly what that specifies, but just know that, when dealing with decimal fractions, results can vary slightly from what you might expect. Keep in mind that integer arithmetic is perfect, so this really isn't a huge issue.

10. Code Styling Isn't your Choice!

    When it comes to your coding style, it's exactly that: your style. Some people prefer to place their curly braces on the same line as the control, others prefer that it goes on its own.

   
   // braces on the right  
   return {  
     foo : bar  
   };  
      
    // braces on their own line  
  return   
   {  
      foo : bar  
   };  


    Dependent upon the first web dev book we read, or how our teacher taught us, it's perfectly acceptable to use either of the methods above, or even a combination of the two. The problem with JavaScript is that it's not your choice!

    I learned this particular example from a lecture that Doug Crockford gave around a year ago. Consider the return statement from above. Believe it or not, they ARE NOT equal. Don't believe me? Try this out. Add the following to some HTML page.

  
  var foo = function() {  
         
     return {  
         a : 'b'  
       };  
        
    }();  
    
 alert(foo.a); // b  


    The code above simply creates a variable called foo, which is equal to the returned object. When we alert(foo.a), we, as expected, see an alert box with a value of 'b.' Now, simply take that opening curly brace, from the return statement, and push it down to its own line, like so.

  
  return  
   {  
      a : 'b'  
  };  


    If you run it in your browser again, you'll receive a Firebug error, logging that "foo is undefined." What the hell!?

    So why does JavaScript do this? It's because of something called "semicolon insertion." Essentially, JavaScript will attempt to correct our bad coding. If, for instance, it thinks that you've left off a closing semicolon, it'll go ahead and add it on for you. Though this was originally intended to be a convenience, especially for newer JavaScripters, it's actually a very bad thing when you don't have control over your own code, as demonstrated above.

    In our example, there's no way to determine why foo.a returns "undefined. " Now that we're aware of semicolon insertion, the reason it's undefined is because JavaScript will add a semicolon to the end of the return statement.

  return; // JS incorrectly adds this semicolon.  
  {  
     a : 'b'; // It'll add a semicolon here as well, because it doesn't realize that this is an object.  
  };  

   
    Aritcle so far ended ,but dispute about js confuse is not over ,if you like this article ,please paste your idea or thoughts below this blog ,in chineses or english ,help by yourself.

    No doubt here, no progress there!!!
0
0
分享到:
评论

相关推荐

    practical internet of things with javascript

    Practical Internet of Things with [removed] Build standalone exciting IoT projects with Raspberry Pi 3 and JavaScript (ES5/ES6) End to end solutions for IoT enthusiasts and web developers Key ...

    Internet of Things Programming with JavaScript

    Title: Internet of Things Programming with JavaScript Author: Ruben Oliva Ramos Length: 407 pages Edition: 1 Language: English Publisher: Packt Publishing Publication Date: 2017-03-06 ISBN-10: ...

    things:所有的事情!

    在"things-master"这个压缩包中,很可能是包含了一个JavaScript项目或教程的源代码。可能包括了不同主题的示例代码、练习或完整的项目结构,供学习者参考和实践。通过解压并研究这些文件,你可以了解到JavaScript的...

    SCREEN2EXE

    good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good things!good ...

    Making Things Smart Easy Embedded JavaScript Programming for Making epub

    Making Things Smart Easy Embedded JavaScript Programming for Making Everyday Objects into Intelligent Machines 英文epub 本资源转载自网络,如有侵权,请联系上传者或csdn删除 本资源转载自网络,如有...

    Making Things Smart Easy Embedded JavaScript Programming for Making mobi

    Making Things Smart Easy Embedded JavaScript Programming for Making Everyday Objects into Intelligent Machines 英文mobi 本资源转载自网络,如有侵权,请联系上传者或csdn删除 本资源转载自网络,如有...

    javascript-on-things:《 JavaScript on Things(Manning)》一书的源代码-java source code

    《JavaScript on Things》是Lyza Gardner撰写的一本书,专注于探讨如何在物联网(IoT)设备上使用JavaScript进行开发。这本书的源代码存放在名为“javascript-on-things-master”的压缩包中,供读者深入理解并实践书...

    Thingsboard详细说明.doc

    Thingsboard是一款开源的物联网平台,用于数据采集、处理和可视化。本文档详细介绍了Thingsboard的项目框架、涉及的流程图、第三方包、设备连接协议、打包过程、日志管理、数据库结构以及前端技术概述,旨在帮助...

    Windows.10.for.the.Internet.of.Things.epub

    This book, Windows 10 for the Internet of Things, provides just the help you need to get started in putting your Windows skills to use in a burgeoning new world of development for small devices that ...

    thingsboard3.6安装指南

    ThingsBoard是一款开源的物联网平台,提供了数据采集、处理、可视化和设备管理等功能。在本安装指南中,我们将详细讲解如何在您的系统上安装并配置ThingsBoard 3.6版本。 一、系统需求 在开始安装前,确保您的系统...

    BL10x工业物联网关连接thingsboard操作说明.pdf

    BL10x系列物联网关是专为工业环境设计的,能够与各种设备通信,如西门子S7-1200等PLC,将现场数据无缝上传至云端平台。 首先,我们需要登录Thingsboard物联网平台。注册并登录后,创建一个新的设备。在创建设备的...

    Programming JavaScript Applications

    In the real world, JavaScript applications are fragile, and when you change them things often break. Author Eric Elliott shows you how to add features without creating bugs or negatively impacting ...

    thingsboard源码分析

    本文将对开源物联网平台Thingsboard进行深入的源码分析,旨在帮助读者理解其内部机制、项目架构以及规则引擎的工作原理。Thingsboard是一款强大的设备管理平台,提供了丰富的功能,如数据可视化、设备连接管理、规则...

    深入浅出javascript

    of cool things that are impossible with HTML alone. If you can answer “yes” to any of these: this book is for you. this book is not for you. [Note from marketing: this book is for anyone with a ...

    Top 11 Things you need to know about Devops

    1. What is DevOps and where did it come from? 2. How does DevOps differ from Agile? 3. How does DevOps differ from ITIL or ITSM?...10. My DevOps Favorite Pattern #2 11. My DevOps Favorite Pattern #3

    Thingsboard修改为Mysql数据

    Thingsboard是一款开源的物联网平台,主要用于设备管理、数据可视化和数据分析。它原生支持使用PostgreSQL作为其数据库系统,但用户可以根据需求将其修改为使用MySQL。在本文中,我们将深入探讨如何将Thingsboard的...

    AliOS Things物联网操作系统,采用弹性内核,支持Python和JavaScript轻应用

    AliOS Things物联网操作系统,采用弹性内核,支持Python和JavaScript轻应用,主打“易上手”。AliOS Things 支持多种CPU架构,包括:ARM,C-Sky,MIPS,RISCV等。AliOS Things 适配了分层架构和组件架构。所有的模块...

Global site tag (gtag.js) - Google Analytics