JavaScript

来自夜航船
跳到导航 跳到搜索

JavaScript, often abbreviated as JS, is a high-level, dynamic, weakly typed, prototype-based, multi-paradigm, and interpreted programming language. Alongside HTML and CSS, JavaScript is one of the three core technologies of World Wide Web content production. It is used to make webpages interactive and provide online programs, including video games. The majority of websites employ it, and all modern web browsers support it without the need for plug-ins by means of a built-in JavaScript engine. Each of the many JavaScript engines represent a different implementation of JavaScript, all based on the ECMAScript specification, with some engines not supporting the spec fully, and with many engines supporting additional features beyond ECMA.

As a multi-paradigm language, JavaScript supports event-driven, functional, and imperative (including object-oriented and prototype-based) programming styles. It has an API for working with text, arrays, dates, regular expressions, and basic manipulation of the DOM, but the language itself does not include any I/O, such as networking, storage, or graphics facilities, relying for these upon the host environment in which it is embedded.

Initially only implemented client-side in web browsers, JavaScript engines are now embedded in many other types of host software, including server-side in web servers and databases, and in non-web programs such as word processors and PDF software, and in runtime environments that make JavaScript available for writing mobile and desktop applications, including desktop widgets.

Although there are strong outward similarities between JavaScript and Java, including language name, syntax, and respective standard libraries, the two languages are distinct and differ greatly in design; JavaScript was influenced by programming languages such as Self and Scheme.

Code Camp

Note Book

User Agent Detection

Framework: mobile-detect.js

Simple Version:

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
    // is mobile..
}

Explicit Version:

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i) || navigator.userAgent.match(/WPDesktop/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

Platform Detection

var system = {  
    win : false,  
    mac : false,  
    xll : false  
};

var p = navigator.platform;  
system.win = p.indexOf("Win") == 0;  
system.mac = p.indexOf("Mac") == 0; 
system.x11 = (p == "X11") || (p.indexOf("Linux") == 0);

if(system.win||system.mac||system.xll){  
	console.log("PC");  
}else{  
	console.log("Mobile");  
}

Bitauto:

function switchMobi(mobiStatus,mobileUrl){
  if(mobiStatus){
	  var pcUrl = window.location.href;
	  var pcUrlArr = pcUrl.split("/");
	  var thisPage = pcUrlArr[5];
	  var mobileUrlDefault = "//www.bitauto.com/zhuanti/adtopic/" + thisPage +"_m";
	  a = mobileUrl.length>0 ? mobileUrl : mobileUrlDefault;
	  if(pcUrl.indexOf("index.shtml") == -1){
		//alert(a)
		if(/iphone|ios|ipad|android|mobile/i.test(navigator.userAgent.toLowerCase())){
		  location.href= a;
		}
	  }
	}
}

Async

深入理解JavaScript编程中的同步与异步机制

setTimeout

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

如果只想重复执行可以使用 setInterval() 方法,使用 clearTimeout() 方法来阻止函数的执行。

优雅的写法:

var myVar;
 
function myFunction() {
    myVar = setTimeout(alertFunc, 3000);
}
 
function alertFunc() {
    alert("Hello!");
}

<button onclick="myFunction()">点我</button>
var myVar;
 
function myFunction() {
    myVar = setTimeout(function(){ alert("Hello") }, 3000);
}
 
function myStopFunction() {
    clearTimeout(myVar);
}

myFunction();

匿名函数:

setTimeout(function(){alert("Helloooooooo"); }, 3000);

JavaScript Object

  1. Array
  2. Boolean
  3. Date
  4. Math
  5. Number
  6. String
  7. RegExp
  8. Functions
  9. Events

References

  1. https://developer.mozilla.org/
  2. https://developer.mozilla.org/zh-CN/
  3. http://www.w3school.com.cn/
  4. Strict mode
  5. CORS
  6. Compatibility Table