Home >Web Front-end >Front-end Q&A >How many jquery data types are there?

How many jquery data types are there?

WBOY
WBOYOriginal
2022-05-18 10:46:072255browse

There are 14 jquery data types: 1. String string type; 2. Number type; 3. Math type; 4. NaN non-number and Infinity infinite or infinite small; 5. Integer and Float. Point type; 6. BOOLEAN Boolean type; 7. Array type, etc.

How many jquery data types are there?

The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.

There are several types of jquery data types

There are 14 types of jquery data types

In addition to the built-in datatypes in native JS, jQuery also includes some Extended data types (virtual types), such as Selectors, Events, etc.

1. String

String is the most common and is supported by almost any high-level programming language and scripting language, such as "Hello world! "That is a string. The type of string is string. For example

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

1.1 String built-in method

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

1.2 length attribute: returns the character length, such as "hello".length returns 5

1.3 Convert string to Boolean:

An empty string ("") defaults to false, while a non-empty string defaults to true (such as "hello").

2. Number

Number type, such as 3.1415926 or 1, 2, 3...

typeof 3.1415926 Return is "number"

2.1 Number is converted to Boolean:

If a Number value is 0, the default is false, otherwise it is true.

2.2 Since Number is implemented using double-precision floating point numbers, the following situation is reasonable:

0.1 + 0.2 // 0.30000000000000004

3. Math

The following methods are similar to the static methods of the Math class in Java.

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

3.1 Convert strings to numbers: parseInt and parseFloat methods:

parseInt("123") = 123 (采用十进制转换)
parseInt("010") = 8 (采用八进制转换)
parseInt("0xCAFE") = 51966 (采用十六进制转换)
parseInt("010", 10) = 10 (指定用10进制转换)
parseInt("11", 2) = 3 (指定用二进制转换)
parseFloat("10.10") = 10.1

3.2 Numbers to strings

When the Number is pasted (append) to the string time, you will get the string.

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

Or use cast conversion:

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

4. NaN and Infinity

If for a non-numeric string Calling the parseInt method will return NaN (Not a Number). NaN is often used to detect whether a variable is of numeric type, as follows:

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

Infinity means that the value is infinitely large or infinitely small, such as 1 / 0 // Infinity.

Calling the typeof operator on NaN and Infinity returns "numuber".

In addition, NaN==NaN returns false, but Infinity==Infinity returns true.

5. Integer and Float

are divided into integer and floating point types.

6. BOOLEAN

Boolean type, true or false.

7. OBJECT

Everything in JavaScript is an object. Performing a typeof operation on an object returns "object".

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

For the above y object, you can use dots to obtain attribute values. For example, y.name returns "Pete", y.age returns 15

7.1 Array Notation (array access method to access the object )

var operations = { increase: "++", decrease: "--" } 
var operation = "increase"; 
operations[operation] // "++"; 
operations["multiply"] = "*"; // "*"

The above operations["multiply"]="*"; adds a key-value pair to the operations object.

7.2 Object iteration access: for-in

var obj = { name: "Pete", age: 15}; 
for(key in obj) { 
alert("key is "+[key]+", value is "+obj[key]); 
}

7.3 Any object, regardless of whether it has attributes and values, defaults to true

7.4 Prototype attribute of the object

Use fn (alias of Prototype) in jQuery to dynamically add objects (functions) to jQuery Instances

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

8. OPTIONS

Almost all jQuery plug-ins provide an API based on OPTIONS. OPTIONS is a JS object, which means that the object and its properties are optional. Allow customization.

For example, if you submit a form using Ajax,

$("#myform").ajaxForm();//默认采用Form的Action属性值作为Ajax-URL,Method值作为提交类型(GET/POST)
$("#myform").ajaxForm({ url: "mypage.php", type: "POST" });//则覆盖了提交到的URL和提交类型

9. ARRAY

var arr = [1, 2, 3];

ARRAY is a variable list. ARRAY is also an object.

Read or set the value of the element in ARRAY in this way:

var val = arr[0];//val为1
arr[2] = 4;//现在arr第三个元素为4

9.1 Array loop (traversal)

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

But when considering performance, it is best Read the length property only once, as follows:

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

jQuery provides the each method to traverse the array:

var x = [1, 2, 3]; 
$.each(x, 
function(index, value) { 
console.log("index", index, "value", value); 
});

9.2 Calling the push method on the array means adding an element to the end of the array, such as x.push (5); and x.[x.length] = 5; are equivalent

9.3 Other built-in methods of arrays:

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] 
x.shift() // [2, 1, 3] 
x.sort() // [1, 2, 3] 
x.splice(1, 2) // 用于插入、删除或替换数组元素,这里为删除从index=1开始的2个元素

9.4 Arrays are objects, so they are always true

10. MAP

The map type is used by the AJAX function to hold the data of a request. This type could be a string, an arrayb2ee0969c1c5ddefce493c6ea2ce877a, a jQuery object with form elements or an object with key/value pairs. In the last case, it is possible to assign multiple values ​​to one key by assigning an array. As below:

{'key []':['valuea','valueb']}

11. FUNCTION: anonymous and named

11.1 Context, Call and Apply

In JavaScript, the variable "this" always refers to the current context. 

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

12. SELECTOR

There are lot of plugins that leverage jQuery's selectors in other ways. The validation plugin accepts a selector to specify a dependency, whether an input is required or not:

emailrules: { required: "#email:filled" }

This would make a checkbox with name "emailrules" required only if the user entered an email address in the email field, selected via its id, filtered via a custom selector ":filled" that the validation plugin provides.

13. EVENT

DOM标准事件包括:blur, focus, load, resize, scroll, unload, beforeunload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, andkeyup

14. JQUERY

JQUERY对象包含DOM元素的集合。比如$('p')即返回所有e388a4556c0f65e1904146cc1a846bee...94b3e26ee717c64999d7867364b1b4a3

JQUERY对象行为类似数组,也有length属性,也可以通过index访问DOM元素集合中的某个。但是不是数组,不具备数组的某些方法,比如join()。

许多jQuery方法返回jQuery对象本身,所以可以采用链式调用:

$("p").css("color", "red").find(".special").css("color", "green");

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

相关视频教程推荐:jQuery视频教程

The above is the detailed content of How many jquery data types are there?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn