JavaScript provides several built-in(内置的) datatypes. In addition to those, this page documents virtual types(虚类) like Selectors, enhanced pseudo-types(伪类) like Events and all and everything you wanted to know about Functions.

jQuery除了包含原生JS中的内置数据类型(built-in datatype),还包括一些扩展的数据类型(virtual types),如Selectors、Events等。

一、Anything

在jQuery文档中任何虚拟类型(virtual type)的使用表明可以使用任何类型或应该被期望。

二、String

A string in JavaScript is an immutable(不变的) object that contains none, one or many characters.

(1)var typeOfStr = typeof "hello world";//typeOfStr为“string"

(2)内置方法(Built-in Methods):

"hello".charAt( 0 ) // "h"
"hello".toUpperCase() // "HELLO"
"Hello".toLowerCase() // "hello"
"hello".replace( /e|o/g, "x" ) // "hxllx"
"1,2,3".split( "," ) // [ "1", "2", "3" ]

(3)length属性:返回字符长度,比如"hello".length返回5

(4)String转换为Boolean:一个空字符串("")默认为false,而一个非空字符串为true(比如"hello")。

三、htmlString

在jQuery文档用于表示一个或多个DOM元素的String被指定为htmlString,通常创建和插入文档中。当作为jQuery()函数的一个参数传递时,该字符串如果是以<tag>开始和解析,直到最后>字符。示例如下:

$( "<b>hello</b>" ).appendTo( "body" );  // <body><b>hello</b></body>
$( "<b>hello</b>bye" ).appendTo( "body" );  // <body><b>hello</b></body>
$( "bye<b>hello</b>" ).appendTo( "body" );  // 语法错误(Syntax error), unrecognized expression: bye<b>hello</b>
$( $.parseHTML( "bye<b>hello</b>" ) ).appendTo( "body" );  // <body>bye<b>hello</b></body>
$( "<b>hello</b>wait<b>bye</b>" ).appendTo( "body" );  // <b>hello</b>wait<b>bye</b>:

四、Number

在原生JavaScript中,Number是64位格式IEEE 754双精度(double-precision)值。就像字符串是不可变的。所有常见操作符等同于在于c语言中可以应用于数字(+, -, *, /, % , =,  +=, -=, * =, /=, ++, --)。

(1)String转换为Boolean:If a number is zero, it defaults to false.

(2)Math,数学对象:

Math.PI // 3.141592653589793

Math.cos(Math.PI) // -1

(3)Parsing Numbers,转换为数字:parseInt和parseFloat方法

parseInt( "123" ) = 123 // (implicit decimal(十进制))
parseInt( "010" ) = 8 // (implicit octal(八进制))
parseInt( "0xCAFE" ) = 51966 // (implicit hexadecimal(十六进制))
parseInt( "010", 10 ) = 10 // (explicit decimal(十进制))
parseInt( "11", 2 ) = 3 // (explicit binary(二进制))
parseFloat( "10.10" ) = 10.1

(4)Numbers to Strings,数字转换为字符串

[1]当将Number粘到(append)字符串后的时候,将得到字符串。

"" + 1 + 2; // "12"      "" + (1 + 2); // "3"   "" + 0.0000001; // "1e-7"   parseInt( 0.0000001 ); // 1 (!)

[2]或者用强制类型转换:

String(1) + String(2); //"12"   String(1 + 2); //"3"

(5)NaN and Infinity(Both NaN and Infinity are of type "number"):

如果对一个非数字字符串调用parseInt方法,将返回NaN(Not a Number),isNaN常用来检测一个变量是否数字类型,如下:

parseInt( "hello", 10 ) // NaN    isNaN( parseInt("hello", 10) ) // true

Infinity表示数值无穷大或无穷小,比如  1 / 0 // Infinity。

另外 NaN==NaN 返回false,但是 Infinity==Infinity 返回true。

(6)Integer 和 Float:分为表示整型和浮点型,都是数字类型。

五、Boolean:布尔类型,true或者false。

六、Object对象

(1)JavaScript中的一切皆对象。对一个对象进行typeof运算返回 "object"。

var x = {};    var y = { name: "Pete", age: 15 };

(2)对于上面的y对象,可以采用点记法(Dot Notation)获取属性值,比如y.name返回"Pete",y.age返回15

(3)Array Notation(数组访问方式访问对象)

var operations = { increase: "++", decrease: "--" }

var operation = "increase" ;   operations[operation] // "++";

operations["multiply"] = "*"; // "*", 往operations对象中添加了一个key-value对。

(4)迭代循环(Iteration),for-in-loop

var obj = { name: "Pete", age: 15 };
for( key in obj ) { alert( "key is " + [ key ] + ", value is " + obj[ key ] ); }
 
$.each()jQuery的特有方式,如下:
jQuery.each( obj, function( key, value ) {
  console.log( "key", key, "value", value );
});

(5)Boolean default:任何对象不管有无属性和值,都默认为true;

(6)Prototype,对象原型属性,jQuery中用fn(Prototype的别名)动态为jQuery Instances添加对象(函数)

var form = $("#myform");
console.log( form.clearForm ); // undefined
 
// jQuery.fn == jQuery.prototype
jQuery.fn.clearForm = function() {
  return this.find( ":input" ).each(function() {
    this.value = "";
  }).end();
};
console.log( form.clearForm ); // function
form.clearForm();// works for all instances of jQuery objects, because the new method was added

七、 OPTIONS,可选

几乎所有的jQuery插件都提供了一个基于OPTIONS的API,OPTIONS是JS对象,意味着该对象以及它的属性都是optional(可选的)。允许用户自定义(customization)。

比如采用Ajax方式提交表单,

$("#myform").ajaxForm();//默认采用Form的Action属性值作为Ajax-URL,Method值作为提交类型(GET/POST)

$("#myform").ajaxForm({ url: "mypage.php", type: "POST" });//则覆盖了提交到的URL和提交类型

八、Array,数组

(1)var y = [ 1, 2, 3 ];    typeof [ 1, 2, 3 ]; // "object"    Array是可变的lists。Array也是对象。

(2)读取或设置Array中元素的值:var val = arr[0];//val为1

(3)Array中元素赋值,arr[2] = 4;//现在arr第三个元素为4

(4)Iteration,数组循环(遍历)

[1]for (var i = 0; i < a.length; i++) { // Do something with a[i] }

[2]但是当考虑性能时,则最好只读一次length属性,如下:

for (var i = 0, j = a.length; i < j; i++) { // Do something with a[i] }

[3]通过变量(variable)

for ( var i = 0, item; item = a[i]; i++ ) { // Do something with item }
[4] jQuery提供了each方法遍历数组:  
var x = [ 1, 2, 3 ];
jQuery.each( x, function( index, value ) {
  console.log( "index", index, "value", value );
});

(5)数组的length属性也可添加元素,对数组调用push方法,二者都将一个元素添加到数组末尾:

var x = [];  x.push( 1 );  x[ x.length ] = 2;  x // [ 1, 2 ]

(6)数组其他内置方法:

var x = [0, 3, 1, 2];

x.reverse() // [2, 1, 3, 0],反转

x.join(" – ") // "2 - 1 - 3 - 0",插入

x.pop() // [2, 1, 3],取出最后一个

x.unshift(-1) // [-1, 2, 1, 3],不移换,该方法在IE中不返回length属性

x.shift() // [2, 1, 3],移换

x.sort() // [1, 2, 3],排序

x.splice(1, 2) // [ 2, 3 ]用于插入、删除或替换数组元素,这里为删除从index=1开始的2个元素

(7)Boolean Default,无论是否为空,均默认为true

(8)Array<Type> ,可将数组作为参数传递,Array<String>

九、PlainObject

1)该类型为键值对( key-value pairs),通过jQuery.isPlainObject()方法可验证

var a = [];  var d = document;  var o = {};

typeof a; // object  typeof d; // object  typeof o; // object

$.isPlainObject( a ); // false  $.isPlainObject( d ); // false  $.isPlainObject( o ); // true

十、Date

(1)使用new Date()创建日期对象,需传递数字参数,参数顺序为:year, month, day, hour, minute, second, millisecond

例如:new Date( 2014, 0, 1, 8, 15 ); //January 1st, 2014, at 8:15,月份为0~11.

十一、Function,函数

(1)在JavaScript函数可以命名或匿名(anonymous)的。任何函数都可以分配给一个变量或传递给一个方法,但是通过成员函数这种方式可以使他们的上下文中调用另一个对象(即有不同的“this”对象)。例如:

[1]function named() {}  [2]var handler = function() {}  以下为匿名函数
[3]$( document ).ready(function() {});  [4]$( "a" ).click(function() {});
[5]$.ajax({ url: "someurl.php", success: function() {} });
typeof(handler);// function

(2)Arguments,参数

[1]有length属性

function log( x ) { console.log( typeof x, arguments.length ); }
log(); // "undefined", 0  log( 1 ); // "number", 1  log( "1", "2", "3" ); // "string", 3
[2]参数也有callee属性

var awesome = function() { return arguments.callee; }
awesome() == awesome // true

(3)Context, Call and Apply

[1]在JavaScript中,变量"this"总是指当前上下文。默认情况下,"this"指的是窗口对象。这个上下文可以改变在一个函数,这取决于如何被函数调用。在jQuery中所有事件处理程序附带处理元素作为上下文被调用。

$( document ).ready(function() {  // this refers to window.document  });
$( "a" ).click(function() {  // this refers to an anchor DOM element  });

(4)作用范围(Scope)

//全局(global)var x = 0;
(function() { // 私有(private)  var x = 1;  console.log( x ); // 1 })();
console.log( x ); // 0

(5)闭包(Closures)

当一个变量在当前范围外被定义从内部范围访问时,闭包(Closures)被创建。

function create() {
  var counter = 0;//被定义在Create()内
  return {  increment: function() { counter++; },
            print: function() { console.log( counter );} } }
var c = create(); c.increment(); c.print(); // 1

(6)代理模式(Proxy Pattern):支持基本的面向对象编程(aspect-oriented programming (AOP))

(function() {
  // log all calls to setArray
  var proxied = jQuery.fn.setArray;
  jQuery.fn.setArray = function() {
    console.log( this, arguments );
    return proxied.apply( this, arguments );
  };
})();
以上包装它的代码在一个函数中来隐藏"proxied"变量。将Jquery的setArray方法放进一个闭包,并且重写它。然后代理(proxy)记录所有方法的调用和原始调用的委托。使用apply( this, arguments )保证调用者不能注意到原方法及代代理(proxied)方法之间的区别。 

(7)回调(Callback):回调是一个简单的JS函数作为参数传递给一些方法或选项。

[1]带参数:$( "body" ).click(function( event ) { console.log( "clicked: " + event.target ); });
[2]返回:$( "#myform" ).submit(function() { return false; });

十二、选择器(Selector):选择器在jQuery中用来从一个DOM文档中选择DOM元素。

十三、事件(Event)

DOM对象模型( Document Object Model)的标准事件:blur, focus, load, resize, scroll, unload, beforeunload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, and keyup.

十四、元素(Element):在文档对象模型(DOM)中一个元素可以有attributes, text,和children。

$( "input[type='text']" ).on( "blur", function() {
if( !this.value ) { alert( "Please enter some text!" ); } });  //this.value 相当于$(this).val()

十五、jQuery

[1]JQuery对象包含DOM元素的集合。比如$('p')即返回所有<p>...</p>。

[2]jQuery对象本身的表现更像一个数组,对象有length属性,也可以通过index([0]~[length - 1])访问DOM元素集合中的某个。但是不是数组,不具备数组的某些方法,比如join()。

[3]可以使用别名$()调用,除非调用jQuery.noConflict()来禁用这个选项。

[4]许多jQuery方法返回jQuery对象本身,所以可以采用链式调用:$( "p" ).css( "color", "red" ).find( ".special" ).css( "color", "green" );

[5]但是如果你调用的方法会破坏jQuery对象,比如find()和filter(),则返回的不是原对象。要返回到原对象只需要再调用end()方法即可。

十六、XMLHttpRequest:Ajax技术体系中最为核心的技术

jQuery的一些Ajax函数返回本机XMLHttpRequest(XHR)对象,或者把它作为参数传递给success/error/complete处理程序(handlers),这样就可以做额外处理或者监视请求。注意,,当一个XHR对象实际在请求中使用时,Ajax函数只返回或传递一个XHR对象。

参考来自: http://docs.jquery.com/Types

Jquery Types 小结的更多相关文章

  1. Jquery Mobile 小结

    第一次做一个移动站点,当时纠结选Jquery Mobile还是Zepto,Zepto相对于JM更加轻巧,语法上面也很相似,但考虑到时间问题和JM自带了很多组件(Bootstrap惯出来的),还是选择了 ...

  2. jQuery用法小结

    jQuery加载1.$(document).ready()2.添加css样式:单个:$("p").css("color","red"); 多 ...

  3. jQuery学习小结3——AJAX

    一.jQuery的Ajax方法 jQuery对Ajax 做了大量的封装,使用起来也较为方便,不需要去考虑浏览器兼容性.对于封装的方式,jQuery 采用了三层封装: 最底层的封装方法为——$.ajax ...

  4. jQuery学习小结2——动画

    一.基础动画 方法名 说明 show([speed,[easing],[fn]])hide([speed,[easing],[fn]]) speed:三种预定速度之一的字符串("slow&q ...

  5. jQuery学习小结1-CSS操作+事件

    一.DOM对象和jQuery 对象互换 1.jQuery对象 就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的,其可以使用jQuery里的方法.比如: $(&quo ...

  6. Jquery 使用小结

    JQuery API中文档地址:http://www.hemin.cn/jq/index.html JQuery 中文社区:http://www.jquery.org.cn/ 1.siblings() ...

  7. jquery 应用小结

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jQuery 学习小结

    1,jQuery是一个简单的JavaScript库,提供了一系列辅助函数:以下简称jq; 使用jq时,通常将jq代码放到head部分的事件处理方法中,也可以将其单独写出 .js 文件,引入:但无论哪种 ...

  9. jQuery使用小结

    $(document).ready( function(){} ); 选择器 $("p:first")            第一个元素 $("p.intro" ...

随机推荐

  1. hdu 4442 Physical Examination 贪心排序

    Physical Examination Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others ...

  2. Python3使用setuptools

    旧版的setuptools已经不能用于Python3上了,国外有大神fork出了另一分支distribute,它可以支持Python3:     1 2 3 4 5 6 7 #下载 wget http ...

  3. Tasker to detect application running in background

    We used to be told that tasker is only capable of detecting foreground application, if the app gets ...

  4. mysql安装三 linux源码安装mysql5.6.22

    http://blog.csdn.net/beiigang/article/details/43053803

  5. python文本 字符与字符值转换

    python文本 字符与字符值转换 场景: 将字符转换成ascii或者unicode编码 在转换过程中,注意使用ord和chr方法 >>> print(ord('a'))    97 ...

  6. Android中关于项目中对Thread的管理(不是线程池)

    背景 项目中对于一些并不复杂的耗时操作,比如计算,不频繁操作数据库等,因为没必要使用线程池,所以之前项目会直接使用new Thread的方式,时间一长,回头再看,原来new Thread之处已经很多了 ...

  7. Ext.state.Manager.setProvider(new Ext.state.CookieProvider())

    Ext.state.Manager.setProvider(new Ext.state.CookieProvider()) 初始化Ext状态管理器,在Cookie中记录用户的操作状态,如果不启用,象刷 ...

  8. .NET:如何让线程支持超时?

    背景 本文是为了回复博客园一个兄弟的问题,主要回答两个问题: 如何让线程支持超时? 如何让线程在执行结束后销毁? MS 现在不推荐使用低级别的 Thread 编程,而推荐使用 Task,另外我多数情况 ...

  9. Selenium2+python自动化39-关于面试的题

    前言 最近看到群里有小伙伴贴出一组面试题,最近又是跳槽黄金季节,小编忍不住抽出一点时间总结了下, 回答不妥的地方欢迎各位高手拍砖指点.   一.selenium中如何判断元素是否存在? 首先selen ...

  10. 让Mac风扇面对PD不再疯狂

    对于所有喜欢Mac操作系统的用户来说,如果办公环境必须使用Windows及Windows程序,那一定会非常崩溃,因为你很可能使用了Parallels Desktop来运行你的Windows虚拟机,那么 ...