suchen
HeimWeb-Frontendjs-TutorialZusammenfassung gängiger Operationsmethoden verschiedener Referenztypen in JavaScript_Grundkenntnisse

Object类型

Array类型
重排序方法: compare
升序:

function compare(value1, value2){
  if (value1<value2){
    return -1;
  }
  if (value1>value2){
    return 1;
  } else{
    return 0;
  }
}
var values = [0,1,5,10,15];
values.sort(compare);
console.log(values); // [0,1,5,10,15]

降序:

function compare(value1, value2){
  if (value1<value2){
    return 1;
  }
  if (value1>value2){
    return -1;
  } else{
    return 0;
  }
}

slice:
slice(start, end); slice()方法返回从参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起死和结束位置之间的项,但不包括结束位置的项。

var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);

console.log(colors2); // green, blue, yellow, purple
console.log(colors3); // green, blue, yellow

splice:
splice()有删除,插入,替换的功能

删除:
需要两个参数,要删除的第一项的位置和要删除的项数。

var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1);
console.log(colors); // greeen, blue
console.log(removed); // red

插入:
需要三个参数:起始位置、0(要删除的项数)和要插入的项

var colors = ["red", "green", "blue"];
var removed = colors.splice(1,0,"yellow", "orange");
console.log(colors); // ["red", "yellow", "orange", "green", "blue"]
console.log(removed); // 返回空

替换:
需要三个参数:起始位置、要删除的项数和要插入的任意数量的项。

var colors = ["red", "green", "blue"];
var removed = colors.splice(1,1,"yellow", "orange");
console.log(colors); // ["red", "yellow", "orange", "blue"]
console.log(removed); // ["green"]

Date类型
RegExp类型

var pattern1 = /[bc]/i;
var pattern2 = new RegExp("[bc]at", "i");

pattern1和pattern2是两个完全等价的正则表达式。要注意的是,传递给RegExp构造函数的两个参数都是字符串(不能把正则表达式字面量传递给RegExp构造函数)。由于RegExp构造函数的模式参数是字符串,所以在某些情况下要对字符串进行双重转义。

var pattern1 = /[bc]/i;
var pattern2 = new RegExp("\\[bc\\]at", "i");

RegExp实例方法
exec

exec接收一个参数,即要应用模式的字符串,然后返回包含第一个匹配信息的数组。

var text = "cat, bat, sat, fat";
var pattern1 = /.at/;

var matches = pattern1.exec(text);
console.log(matches); // ["cat"]

match
match是字符串执行匹配正则表达式规则的方法,他的参数是正则表达

var text = "cat, bat, sat, fat";
var pattern1 = /.at/;

var matches2 = text.match(pattern1);
console.log(matches2); // ["cat"]

test
test()接收一个字符串参数

var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;

if (pattern.test(text)){
  console.log("The pattern was matched"); // The pattern was matched
}

Function类型
函数内部属性
把arguments转为数组

(function() {
  var slice = Array.prototype.slice,
    aArguments = slice.apply(arguments);

    console.log(aArguments);
})(10, 20, 30);
arguments.callee

该属性是一个指针,指向拥有这个arguments对象的函数。当函数在严格模式下运行时,访问arguments.callee会导致错误。

函数属性和方法
length
length属性表示函数希望接收的命名参数的个数。

function sayName(name){
  alert(name);
}

function sum(num1,num2){
  return num1 + num2;
}

function sayHi(){
  alert("hi");
}

console.log(sayName.length); //1
console.log(sum.length); //2
console.log(sayHi.length); //0

prototype

call, apply

function sum(num1, num2){
  return num1 + num2;
}

function callSum1(num1,num2){
  return sum.apply(this,arguments);
}

function callSum2(num1, num2){
  return sum.apply(this, [num1, num2]); 
}

console.log(callSum1(10,10)); // 20
console.log(callSum2(10,10)); //20
window.color = "red";
var o = {color:"blue"};

function sayColor(){
  console.log(this.color);
}

sayColor(); // red

sayColor.call(this); // red
sayColor.call(window); // red
sayColor.call(o); // blue

基本包装类型

var value = "25";
var number = Number(value);
console.log(typeof number);
console.log(number instanceof Number);// false

var obj = new Number(value);
console.log(typeof obj);
console.log(obj instanceof Number);// true

Boolean类型

var falseObject = new Boolean(false);
var result = falseObject && true; // true 

//布尔表达式中的所有对象都会被转换为true, 因此falseObject对象在布尔表达式中代表的是true

console.log(result); // true

var falseValue = false;
result = falseValue && true;
console.log(result); //false

console.log(typeof falseObject); //object
console.log(typeof falseValue); // Boolean
console.log(falseObject instanceof Boolean); //true
console.log(falseValue instanceof Boolean); // false

Number类型

var numberObject = new Number(10);
var numberValue = 10;
console.log(typeof numberObject); // Object
console.log(typoef numberValue); // number
console.log(numberObject instanceof Number); // true
console.log(numberValue instanceof Number); // false

String类型
字符方法
charAt() charCodeAt()

charAt()方法以单字符字符串的形式返回给定位置的那个字符串。

charCodeAt()返回的是字符编码。

var stringValue = "hello world";
console.log(stringValue.charAt(1)); // e
console.log(stringValue.charCodeAt(1)); // 101

字符串操作方法
concat()

concat()用于将一或多个字符串拼接起来。

var stringValue = "hello ";
var result = stringValue.concat("world");
console.log(result); // hello world
console.log(stringValue); // hello

slice(start, end)
end 表示字符串到哪里结束。
如果传入的是负数,slice()方法会将传入的负值与字符串长度相加。

var str="Hello happy world!";
console.log(str.slice(6)); // happy world!
console.log(str.slice(6,11));// happy
console.log(str.slice(-3)); // ld!
console.log(str.slice(3, -4)); //lo happy wo 

substring(start, end)
如果传入的是负数, substring()会把所有字符参数都转换为0

var str="Hello happy world!";
console.log(str.substring(6)); // happy world!
console.log(str.substring(6,11));// happy
console.log(str.substring(-3)); // Hello happy world!
console.log(str.substring(3, -4)); //Hel

substr(start, length)
如果传入的是负数,substr()方法将负的第一个参数加上字符串的长度,而将负的第二个参数转换为0

var str="Hello world!";
console.log(str.substr(3)); //lo world!
console.log(str.substr(3, 7)); //lo worl
console.log(str.substr(-3)); // ld!
console.log(str.substr(3, -3)); // 空字符串

字符串位置方法

indexOf() lastIndexOf()

var stringValue = "hello world";
console.log(stringValue.indexOf("o")); // 4
console.log(stringValue.lastIndexOf("o")); //7

这两个方法都可以接收可选的第二个参数,表示从字符串中的哪个位置开始搜索。

var stringValue = "hello world";
console.log(stringValue.indexOf("o", 6)); // 7
console.log(stringValue.lastIndexOf("o", 6)); //4

字符串的模式匹配方法
match()

var text = "cat, bat, sat, fat";
var pattern = /.at/;

var matches = text.match(pattern);
console.log(matches.index); //0
console.log(matches[0]); // cat
console.log(pattern.lastIndex); //0

search()

var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
console.log(pos); // 1

replace()

var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
console.log(result); // cond, bat, sat, fat

var result = text.replace(/at/g, "ond");
console.log(result); // cond, bond, sond, fond

Global对象
URI编码方法
Global对象的encodeURI()和encodeURIComponent()方法可以对URI(Uniform Resources Identifiers,通用资源标识符)进行编码,以便发送给浏览器。

var url = "http://www.baidu.com/";
console.log(encodeURI(url));
console.log(encodeURIComponent(url));
encodeURI()和encodeURIComponent()方法对象的两个方法分别是decodeURI()和decodeURIComponent()

Math对象
random()方法

Math.random()方法返回介于0和1之间一个随机数,不包含0和1。对于某些站点来说,这个方法非常实用,因为可以利用它来随机显示一些名言和新闻事件。套用下面的公式,就可以利用Math.random()从某个整数范围内随机选择一个值。

值=Math.floor(Math.random()*可能值的总数+第一个可能的值)

例如:如果想选择一个1到10之间的数值,可以像下面这边编写代码:

var num = Math.floor(Math.random()*10+1);
function selectFrom(lowerValue,upperValue){
  var choice = upperValue - lowerValue + 1;
  return Math.floor(Math.random()*choice+lowerValue);
}
var num = selectFrom(2,10);
console.log(num);
var colors = ["red", "green", "blue", "yellow", "black", "purple", "brown"];
var color = colors[selectFrom(0, colors.length-1)];
console.log(color);

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
JavaScript: Erforschung der Vielseitigkeit einer WebspracheJavaScript: Erforschung der Vielseitigkeit einer WebspracheApr 11, 2025 am 12:01 AM

JavaScript ist die Kernsprache der modernen Webentwicklung und wird für seine Vielfalt und Flexibilität häufig verwendet. 1) Front-End-Entwicklung: Erstellen Sie dynamische Webseiten und einseitige Anwendungen durch DOM-Operationen und moderne Rahmenbedingungen (wie React, Vue.js, Angular). 2) Serverseitige Entwicklung: Node.js verwendet ein nicht blockierendes E/A-Modell, um hohe Parallelitäts- und Echtzeitanwendungen zu verarbeiten. 3) Entwicklung von Mobil- und Desktop-Anwendungen: Die plattformübergreifende Entwicklung wird durch reaktnative und elektronen zur Verbesserung der Entwicklungseffizienz realisiert.

Die Entwicklung von JavaScript: Aktuelle Trends und ZukunftsaussichtenDie Entwicklung von JavaScript: Aktuelle Trends und ZukunftsaussichtenApr 10, 2025 am 09:33 AM

Zu den neuesten Trends im JavaScript gehören der Aufstieg von Typenkripten, die Popularität moderner Frameworks und Bibliotheken und die Anwendung der WebAssembly. Zukunftsaussichten umfassen leistungsfähigere Typsysteme, die Entwicklung des serverseitigen JavaScript, die Erweiterung der künstlichen Intelligenz und des maschinellen Lernens sowie das Potenzial von IoT und Edge Computing.

Entmystifizieren JavaScript: Was es tut und warum es wichtig istEntmystifizieren JavaScript: Was es tut und warum es wichtig istApr 09, 2025 am 12:07 AM

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Ist Python oder JavaScript besser?Ist Python oder JavaScript besser?Apr 06, 2025 am 12:14 AM

Python eignet sich besser für Datenwissenschaft und maschinelles Lernen, während JavaScript besser für die Entwicklung von Front-End- und Vollstapel geeignet ist. 1. Python ist bekannt für seine prägnante Syntax- und Rich -Bibliotheks -Ökosystems und ist für die Datenanalyse und die Webentwicklung geeignet. 2. JavaScript ist der Kern der Front-End-Entwicklung. Node.js unterstützt die serverseitige Programmierung und eignet sich für die Entwicklung der Vollstapel.

Wie installiere ich JavaScript?Wie installiere ich JavaScript?Apr 05, 2025 am 12:16 AM

JavaScript erfordert keine Installation, da es bereits in moderne Browser integriert ist. Sie benötigen nur einen Texteditor und einen Browser, um loszulegen. 1) Führen Sie sie in der Browser -Umgebung durch, indem Sie die HTML -Datei durch Tags einbetten. 2) Führen Sie die JavaScript -Datei nach dem Herunterladen und Installieren von node.js nach dem Herunterladen und Installieren der Befehlszeile aus.

Wie sende ich Benachrichtigungen, bevor eine Aufgabe in Quartz beginnt?Wie sende ich Benachrichtigungen, bevor eine Aufgabe in Quartz beginnt?Apr 04, 2025 pm 09:24 PM

So senden Sie im Voraus Aufgabenbenachrichtigungen in Quartz Wenn der Quartz -Timer eine Aufgabe plant, wird die Ausführungszeit der Aufgabe durch den Cron -Ausdruck festgelegt. Jetzt...

Wie erhalten Sie in JavaScript Parameter einer Funktion auf einer Prototypkette in einem Konstruktor?Wie erhalten Sie in JavaScript Parameter einer Funktion auf einer Prototypkette in einem Konstruktor?Apr 04, 2025 pm 09:21 PM

So erhalten Sie die Parameter von Funktionen für Prototyp -Ketten in JavaScript in JavaScript -Programmier-, Verständnis- und Manipulationsfunktionsparametern auf Prototypungsketten ist eine übliche und wichtige Aufgabe ...

Was ist der Grund für das Versagen von Vue.js Dynamic Style -Verschiebung im WeChat Mini -Programm Webview?Was ist der Grund für das Versagen von Vue.js Dynamic Style -Verschiebung im WeChat Mini -Programm Webview?Apr 04, 2025 pm 09:18 PM

Analyse des Grundes, warum der dynamische Verschiebungsfehler der Verwendung von VUE.JS im WeChat Applet Web-View Vue.js verwendet ...

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
3 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Sicherer Prüfungsbrowser

Sicherer Prüfungsbrowser

Safe Exam Browser ist eine sichere Browserumgebung für die sichere Teilnahme an Online-Prüfungen. Diese Software verwandelt jeden Computer in einen sicheren Arbeitsplatz. Es kontrolliert den Zugriff auf alle Dienstprogramme und verhindert, dass Schüler nicht autorisierte Ressourcen nutzen.

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

MinGW – Minimalistisches GNU für Windows

MinGW – Minimalistisches GNU für Windows

Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

PHPStorm Mac-Version

PHPStorm Mac-Version

Das neueste (2018.2.1) professionelle, integrierte PHP-Entwicklungstool