Widzę kilka rozwiązań dla projektów kodu .
Ale czy JavaScript jest regularnie wdrażany?
Widzę kilka rozwiązań dla projektów kodu .
Ale czy JavaScript jest regularnie wdrażany?
Odpowiedzi:
Jeśli musisz napisać kod dla Internet Explorera, upewnij się, że wybrałeś implementację, która używa sprzężeń tablicowych. Łączenie łańcuchów z operatorem +
lub +=
jest wyjątkowo wolne w IE. Jest to szczególnie prawdziwe w przypadku IE6. W nowoczesnych przeglądarkach+=
jest zwykle tak samo szybkie, jak sprzężenia tablic.
Kiedy muszę wykonać wiele konkatenacji ciągów, zwykle wypełniam tablicę i nie używam klasy konstruktora ciągów:
var html = [];
html.push(
"<html>",
"<body>",
"bla bla bla",
"</body>",
"</html>"
);
return html.join("");
Zauważ, że push
metody akceptują wiele argumentów.
[foo(), "bar", "baz"].join("");
działa.
push
zaakceptować wiele argumentów. Losowe rzeczy, których się uczysz.
Właśnie sprawdziłem wydajność na http://jsperf.com/javascript-concat-vs-join/2 . Przypadki testowe konkatenują lub dołączają do alfabetu 1000 razy.
W obecnych przeglądarkach (FF, Opera, IE11, Chrome) „concat” jest około 4-10 razy szybszy niż „dołącz”.
W IE8 oba zwracają prawie równe wyniki.
W IE7 „dołącz” jest niestety około 100 razy szybszy.
Nie, nie ma wbudowanej obsługi ciągów znaków. Zamiast tego musisz użyć konkatenacji.
Możesz oczywiście utworzyć tablicę różnych części łańcucha, a następnie wywołać join()
tę tablicę, ale zależy to od tego, w jaki sposób sprzężenie jest implementowane w używanym interpretera JavaScript.
Zrobiłem eksperyment, aby porównać szybkość str1+str2
metody z array.push(str1, str2).join()
metodą. Kod był prosty:
var iIterations =800000;
var d1 = (new Date()).valueOf();
str1 = "";
for (var i = 0; i<iIterations; i++)
str1 = str1 + Math.random().toString();
var d2 = (new Date()).valueOf();
log("Time (strings): " + (d2-d1));
var d3 = (new Date()).valueOf();
arr1 = [];
for (var i = 0; i<iIterations; i++)
arr1.push(Math.random().toString());
var str2 = arr1.join("");
var d4 = (new Date()).valueOf();
log("Time (arrays): " + (d4-d3));
Przetestowałem to w Internet Explorer 8 i Firefox 3.5.5, oba na Windows 7 x64.
Na początku testowałem na małej liczbie iteracji (około stu, około tysiąca pozycji). Wyniki były nieprzewidywalne (czasem konkatenacja łańcuchów trwała 0 milisekund, czasem 16 milisekund, to samo przy łączeniu tablic).
Gdy zwiększyłem tę liczbę do 50 000, wyniki były różne w różnych przeglądarkach - w Internet Explorerze łączenie ciągów było szybsze (94 milisekundy), a łączenie było wolniejsze (125 milisekund), podczas gdy w Firefoksie łączenie tablic było szybsze (113 milisekund) niż łączenie ciągów (117 milisekund).
Potem zwiększyłem liczbę do 500 000. Teraz array.join()
było wolniej niż konkatenacja łańcuchów w obu przeglądarkach: konkatenacja łańcuchów wynosiła 937 ms w przeglądarce Internet Explorer, 1155 ms w przeglądarce Firefox, przyłączenie tablicy 1265 w przeglądarce Internet Explorer i 1207 ms w przeglądarce Firefox.
Maksymalna liczba iteracji, które mogłam przetestować w Internet Explorerze bez „wykonywania skryptu zbyt długo” wynosiła 850 000. Następnie Internet Explorer był 1593 dla łączenia łańcuchów i 2046 dla łączenia tablic, a Firefox miał 2101 dla łączenia łańcuchów i 2249 dla łączenia tablic.
Wyniki - jeśli liczba iteracji jest niewielka, możesz spróbować użyć array.join()
, ponieważ może być szybsza w Firefoksie. Gdy liczba rośnie, string1+string2
metoda jest szybsza.
Test wykonałem na Internet Explorerze 6 (Windows XP). Proces przestał odpowiadać natychmiast i nigdy się nie zakończył, jeśli spróbowałem testu na ponad 100 000 iteracjach. Przy 40 000 iteracjach wyniki były
Time (strings): 59175 ms
Time (arrays): 220 ms
Oznacza to - jeśli chcesz obsługiwać Internet Explorera 6, wybierz, array.join()
który jest znacznie szybszy niż konkatenacja ciągów.
join()
jest częścią ECMAScript i afaik każdy interpreter JavaScript go implementuje. Dlaczego miałoby to zależeć?
Ten kod wygląda jak trasa, którą chcesz obrać z kilkoma zmianami.
Będziesz chciał zmienić metodę dołączania, aby wyglądała tak. Zmieniłem go, aby zaakceptował cyfrę 0 i sprawił, że zwróci, this
aby można było łączyć swoje załączniki.
StringBuilder.prototype.append = function (value) {
if (value || value === 0) {
this.strings.push(value);
}
return this;
}
null
, false
, puste struny, undefined
albo NaN
.
Wersja ECMAScript 6 (znana również jako ECMAScript 2015) JavaScript wprowadziła literały łańcuchowe .
var classType = "stringbuilder";
var q = `Does JavaScript have a built-in ${classType} class?`;
Zauważ, że tyknięcia zamiast pojedynczych cudzysłowów otaczają ciąg.
W C # możesz zrobić coś takiego
String.Format("hello {0}, your age is {1}.", "John", 29)
W JavaScript możesz zrobić coś takiego
var x = "hello {0}, your age is {1}";
x = x.replace(/\{0\}/g, "John");
x = x.replace(/\{1\}/g, 29);
{0}
zostanie zastąpiony, zawiera {1}
.
Dla zainteresowanych, oto alternatywa dla wywołania Array.join:
var arrayOfStrings = ['foo', 'bar'];
var result = String.concat.apply(null, arrayOfStrings);
console.log(result);
Dane wyjściowe, zgodnie z oczekiwaniami, to ciąg „foobar”. W Firefoksie takie podejście przewyższa Array.join, ale jest lepsze niż konkatenacja. Ponieważ String.concat wymaga, aby każdy segment był określony jako osobny argument, obiekt wywołujący jest ograniczony przez dowolny limit liczby argumentów narzucony przez silnik JavaScript. Więcej informacji można znaleźć w dokumentacji Function.prototype.apply () .
Zdefiniowałem tę funkcję:
function format() {
var args = arguments;
if (args.length <= 1) {
return args;
}
var result = args[0];
for (var i = 1; i < args.length; i++) {
result = result.replace(new RegExp("\\{" + (i - 1) + "\\}", "g"), args[i]);
}
return result;
}
I można go nazwać jak c #:
var text = format("hello {0}, your age is {1}.", "John", 29);
Wynik:
cześć John, masz 29 lat.
Kiedy widzę, że robię dużo łączenia łańcuchów w JavaScript, zaczynam szukać szablonów. Handlebars.js działa całkiem dobrze, utrzymując HTML i JavaScript bardziej czytelnymi.http://handlebarsjs.com
A może sys.StringBuilder()
wypróbujesz następujący artykuł.