From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- .../de/web/javascript/about_javascript/index.html | 61 ++ .../index.html" | 340 ++++++++ files/de/web/javascript/closures/index.html | 471 ++++++++++ files/de/web/javascript/datenstrukturen/index.html | 271 ++++++ .../index.html | 909 +++++++++++++++++++ .../index.html" | 411 +++++++++ files/de/web/javascript/eventloop/index.html | 138 +++ .../guide/ausdruecke_und_operatoren/index.html | 965 +++++++++++++++++++++ .../javascript/guide/einf\303\274hrung/index.html" | 140 +++ .../guide/feinheiten_des_objektmodells/index.html | 721 +++++++++++++++ .../de/web/javascript/guide/funktionen/index.html | 657 ++++++++++++++ .../guide/grammatik_und_typen/index.html | 699 +++++++++++++++ files/de/web/javascript/guide/index.html | 130 +++ .../guide/indexed_collections/index.html | 448 ++++++++++ .../javascript/guide/keyed_collections/index.html | 157 ++++ .../kontrollfluss_und_fehlerbehandlung/index.html | 430 +++++++++ .../javascript/guide/meta_programming/index.html | 265 ++++++ .../guide/mit_objekten_arbeiten/index.html | 506 +++++++++++ files/de/web/javascript/guide/modules/index.html | 446 ++++++++++ .../javascript/guide/numbers_and_dates/index.html | 378 ++++++++ .../guide/regular_expressions/index.html | 625 +++++++++++++ .../guide/schleifen_und_iterationen/index.html | 337 +++++++ .../javascript/guide/textformatierung/index.html | 257 ++++++ .../web/javascript/guide/using_promises/index.html | 341 ++++++++ files/de/web/javascript/index.html | 120 +++ .../inheritance_and_the_prototype_chain/index.html | 300 +++++++ .../index.html | 389 +++++++++ .../javascript_technologieuebersicht/index.html | 87 ++ .../web/javascript/language_resources/index.html | 142 +++ files/de/web/javascript/reference/about/index.html | 52 ++ .../reference/fehler/already_has_pragma/index.html | 42 + .../fehler/array_sort_argument/index.html | 47 + .../reference/fehler/bad_octal/index.html | 54 ++ .../reference/fehler/bad_radix/index.html | 61 ++ .../reference/fehler/bad_regexp_flag/index.html | 105 +++ .../fehler/bad_return_or_yield/index.html | 55 ++ .../fehler/called_on_incompatible_type/index.html | 64 ++ .../index.html | 60 ++ .../fehler/cant_access_property/index.html | 59 ++ .../index.html | 64 ++ .../reference/fehler/cant_delete/index.html | 58 ++ .../fehler/cant_redefine_property/index.html | 51 ++ .../fehler/cyclic_object_value/index.html | 67 ++ .../reference/fehler/dead_object/index.html | 50 ++ .../fehler/delete_in_strict_mode/index.html | 70 ++ .../index.html | 75 ++ .../deprecated_expression_closures/index.html | 78 ++ .../reference/fehler/deprecated_octal/index.html | 67 ++ .../fehler/deprecated_source_map_pragma/index.html | 58 ++ .../fehler/deprecated_string_generics/index.html | 104 +++ .../fehler/deprecated_tolocaleformat/index.html | 90 ++ .../reference/fehler/equal_as_assign/index.html | 54 ++ .../for-each-in_loops_are_deprecated/index.html | 168 ++++ .../reference/fehler/getter_only/index.html | 83 ++ .../fehler/identifier_after_number/index.html | 53 ++ .../reference/fehler/illegal_character/index.html | 80 ++ .../fehler/in_operator_no_object/index.html | 72 ++ .../de/web/javascript/reference/fehler/index.html | 29 + .../fehler/invalid_array_length/index.html | 77 ++ .../invalid_assignment_left-hand_side/index.html | 53 ++ .../fehler/invalid_const_assignment/index.html | 90 ++ .../reference/fehler/invalid_date/index.html | 54 ++ .../fehler/invalid_for-in_initializer/index.html | 74 ++ .../fehler/invalid_for-of_initializer/index.html | 63 ++ .../index.html | 62 ++ .../reference/fehler/is_not_iterable/index.html | 103 +++ .../reference/fehler/json_bad_parse/index.html | 112 +++ .../fehler/malformed_formal_parameter/index.html | 61 ++ .../reference/fehler/malformed_uri/index.html | 66 ++ .../fehler/missing_bracket_after_list/index.html | 56 ++ .../missing_colon_after_property_id/index.html | 77 ++ .../missing_curly_after_function_body/index.html | 67 ++ .../missing_curly_after_property_list/index.html | 51 ++ .../fehler/missing_formal_parameter/index.html | 80 ++ .../fehler/missing_initializer_in_const/index.html | 58 ++ .../missing_name_after_dot_operator/index.html | 68 ++ .../index.html | 42 + .../missing_parenthesis_after_condition/index.html | 70 ++ .../missing_semicolon_before_statement/index.html | 67 ++ .../fehler/more_arguments_needed/index.html | 48 + .../fehler/negative_repetition_count/index.html | 44 + .../reference/fehler/no_non-null_object/index.html | 66 ++ .../reference/fehler/no_properties/index.html | 40 + .../reference/fehler/no_variable_name/index.html | 84 ++ .../non_configurable_array_element/index.html | 83 ++ .../reference/fehler/not_a_codepoint/index.html | 55 ++ .../reference/fehler/not_a_constructor/index.html | 97 +++ .../reference/fehler/not_a_function/index.html | 124 +++ .../reference/fehler/not_defined/index.html | 70 ++ .../reference/fehler/precision_range/index.html | 96 ++ .../fehler/property_access_denied/index.html | 47 + .../reference/fehler/read-only/index.html | 78 ++ .../fehler/redeclared_parameter/index.html | 61 ++ .../index.html | 88 ++ .../fehler/reserved_identifier/index.html | 80 ++ .../fehler/resulting_string_too_large/index.html | 49 ++ .../reference/fehler/stmt_after_return/index.html | 77 ++ .../fehler/strict_non_simple_params/index.html | 111 +++ .../reference/fehler/too_much_recursion/index.html | 54 ++ .../typed_array_invalid_arguments/index.html | 77 ++ .../reference/fehler/undeclared_var/index.html | 67 ++ .../reference/fehler/undefined_prop/index.html | 63 ++ .../reference/fehler/unexpected_token/index.html | 47 + .../reference/fehler/unexpected_type/index.html | 67 ++ .../fehler/unnamed_function_statement/index.html | 115 +++ .../fehler/unterminated_string_literal/index.html | 67 ++ .../reference/fehler/var_hides_argument/index.html | 56 ++ .../functions/arguments/@@iterator/index.html | 78 ++ .../functions/arguments/callee/index.html | 157 ++++ .../reference/functions/arguments/index.html | 223 +++++ .../functions/arguments/length/index.html | 87 ++ .../functions/default_parameters/index.html | 223 +++++ .../javascript/reference/functions/get/index.html | 174 ++++ .../web/javascript/reference/functions/index.html | 594 +++++++++++++ .../functions/methoden_definitionen/index.html | 230 +++++ .../reference/functions/pfeilfunktionen/index.html | 360 ++++++++ .../reference/functions/rest_parameter/index.html | 167 ++++ .../javascript/reference/functions/set/index.html | 149 ++++ .../global_objects/array/@@iterator/index.html | 89 ++ .../global_objects/array/@@species/index.html | 76 ++ .../global_objects/array/@@unscopables/index.html | 76 ++ .../global_objects/array/concat/index.html | 156 ++++ .../global_objects/array/copywithin/index.html | 187 ++++ .../global_objects/array/entries/index.html | 84 ++ .../global_objects/array/every/index.html | 195 +++++ .../reference/global_objects/array/fill/index.html | 155 ++++ .../global_objects/array/filter/index.html | 235 +++++ .../reference/global_objects/array/find/index.html | 243 ++++++ .../global_objects/array/findindex/index.html | 189 ++++ .../reference/global_objects/array/flat/index.html | 116 +++ .../global_objects/array/flatmap/index.html | 117 +++ .../global_objects/array/foreach/index.html | 303 +++++++ .../reference/global_objects/array/from/index.html | 227 +++++ .../global_objects/array/includes/index.html | 181 ++++ .../reference/global_objects/array/index.html | 460 ++++++++++ .../global_objects/array/indexof/index.html | 226 +++++ .../global_objects/array/isarray/index.html | 121 +++ .../reference/global_objects/array/join/index.html | 114 +++ .../reference/global_objects/array/keys/index.html | 76 ++ .../global_objects/array/lastindexof/index.html | 168 ++++ .../global_objects/array/length/index.html | 149 ++++ .../reference/global_objects/array/map/index.html | 337 +++++++ .../global_objects/array/observe/index.html | 91 ++ .../reference/global_objects/array/of/index.html | 102 +++ .../reference/global_objects/array/pop/index.html | 98 +++ .../global_objects/array/prototypen/index.html | 183 ++++ .../reference/global_objects/array/push/index.html | 141 +++ .../global_objects/array/reduce/index.html | 564 ++++++++++++ .../global_objects/array/reduceright/index.html | 334 +++++++ .../global_objects/array/reverse/index.html | 92 ++ .../global_objects/array/shift/index.html | 111 +++ .../global_objects/array/slice/index.html | 244 ++++++ .../reference/global_objects/array/some/index.html | 209 +++++ .../reference/global_objects/array/sort/index.html | 264 ++++++ .../global_objects/array/splice/index.html | 162 ++++ .../global_objects/array/tolocalestring/index.html | 183 ++++ .../global_objects/array/tosource/index.html | 69 ++ .../global_objects/array/tostring/index.html | 80 ++ .../global_objects/array/unobserve/index.html | 88 ++ .../global_objects/array/unshift/index.html | 99 +++ .../global_objects/array/values/index.html | 86 ++ .../arraybuffer/@@species/index.html | 72 ++ .../arraybuffer/bytelength/index.html | 70 ++ .../global_objects/arraybuffer/index.html | 144 +++ .../global_objects/arraybuffer/isview/index.html | 89 ++ .../arraybuffer/prototype/index.html | 68 ++ .../global_objects/arraybuffer/slice/index.html | 88 ++ .../global_objects/arraybuffer/transfer/index.html | 84 ++ .../global_objects/asyncfunction/index.html | 124 +++ .../asyncfunction/prototype/index.html | 61 ++ .../global_objects/atomics/add/index.html | 83 ++ .../global_objects/atomics/and/index.html | 129 +++ .../atomics/compareexchange/index.html | 86 ++ .../global_objects/atomics/exchange/index.html | 85 ++ .../reference/global_objects/atomics/index.html | 116 +++ .../global_objects/atomics/islockfree/index.html | 73 ++ .../global_objects/atomics/load/index.html | 81 ++ .../reference/global_objects/atomics/or/index.html | 129 +++ .../global_objects/atomics/store/index.html | 82 ++ .../global_objects/atomics/sub/index.html | 86 ++ .../global_objects/atomics/wait/index.html | 95 ++ .../global_objects/atomics/wake/index.html | 93 ++ .../global_objects/atomics/xor/index.html | 130 +++ .../reference/global_objects/boolean/index.html | 159 ++++ .../global_objects/boolean/prototype/index.html | 83 ++ .../global_objects/boolean/tosource/index.html | 60 ++ .../global_objects/boolean/tostring/index.html | 89 ++ .../global_objects/boolean/valueof/index.html | 85 ++ .../global_objects/dataview/buffer/index.html | 71 ++ .../global_objects/dataview/bytelength/index.html | 77 ++ .../global_objects/dataview/byteoffset/index.html | 74 ++ .../global_objects/dataview/getfloat32/index.html | 95 ++ .../global_objects/dataview/getfloat64/index.html | 95 ++ .../global_objects/dataview/getint16/index.html | 95 ++ .../global_objects/dataview/getint32/index.html | 95 ++ .../global_objects/dataview/getint8/index.html | 93 ++ .../global_objects/dataview/getuint16/index.html | 98 +++ .../global_objects/dataview/getuint32/index.html | 98 +++ .../global_objects/dataview/getuint8/index.html | 95 ++ .../reference/global_objects/dataview/index.html | 127 +++ .../global_objects/dataview/prototype/index.html | 109 +++ .../global_objects/dataview/setfloat32/index.html | 97 +++ .../global_objects/dataview/setfloat64/index.html | 97 +++ .../global_objects/dataview/setint16/index.html | 100 +++ .../global_objects/dataview/setint32/index.html | 100 +++ .../global_objects/dataview/setint8/index.html | 95 ++ .../global_objects/dataview/setuint16/index.html | 100 +++ .../global_objects/dataview/setuint32/index.html | 100 +++ .../global_objects/dataview/setuint8/index.html | 95 ++ .../global_objects/date/@@toprimitive/index.html | 69 ++ .../global_objects/date/getday/index.html | 69 ++ .../global_objects/date/getfullyear/index.html | 88 ++ .../global_objects/date/gethours/index.html | 83 ++ .../global_objects/date/getmilliseconds/index.html | 81 ++ .../global_objects/date/getminutes/index.html | 81 ++ .../global_objects/date/getmonth/index.html | 83 ++ .../global_objects/date/getseconds/index.html | 83 ++ .../global_objects/date/gettime/index.html | 126 +++ .../date/gettimezoneoffset/index.html | 102 +++ .../global_objects/date/getutcdate/index.html | 80 ++ .../global_objects/date/getutcday/index.html | 82 ++ .../global_objects/date/getutcfullyear/index.html | 85 ++ .../global_objects/date/getutchours/index.html | 81 ++ .../date/getutcmilliseconds/index.html | 79 ++ .../global_objects/date/getutcminutes/index.html | 79 ++ .../global_objects/date/getutcmonth/index.html | 81 ++ .../global_objects/date/getutcseconds/index.html | 79 ++ .../global_objects/date/getyear/index.html | 127 +++ .../reference/global_objects/date/index.html | 230 +++++ .../reference/global_objects/date/now/index.html | 105 +++ .../reference/global_objects/date/parse/index.html | 173 ++++ .../global_objects/date/prototype/index.html | 182 ++++ .../global_objects/date/setdate/index.html | 91 ++ .../global_objects/date/setfullyear/index.html | 97 +++ .../global_objects/date/sethours/index.html | 102 +++ .../global_objects/date/setmilliseconds/index.html | 90 ++ .../global_objects/date/setminutes/index.html | 100 +++ .../global_objects/date/setmonth/index.html | 103 +++ .../global_objects/date/setseconds/index.html | 98 +++ .../global_objects/date/settime/index.html | 91 ++ .../global_objects/date/setutcdate/index.html | 90 ++ .../global_objects/date/setutcfullyear/index.html | 96 ++ .../global_objects/date/setutchours/index.html | 98 +++ .../date/setutcmilliseconds/index.html | 90 ++ .../global_objects/date/setutcminutes/index.html | 96 ++ .../global_objects/date/setutcmonth/index.html | 94 ++ .../global_objects/date/setutcseconds/index.html | 94 ++ .../global_objects/date/setyear/index.html | 96 ++ .../global_objects/date/todatestring/index.html | 92 ++ .../global_objects/date/togmtstring/index.html | 87 ++ .../global_objects/date/toisostring/index.html | 109 +++ .../global_objects/date/tojson/index.html | 81 ++ .../date/tolocaledatestring/index.html | 188 ++++ .../global_objects/date/tolocaleformat/index.html | 81 ++ .../global_objects/date/tolocalestring/index.html | 188 ++++ .../date/tolocaletimestring/index.html | 177 ++++ .../global_objects/date/tosource/index.html | 61 ++ .../global_objects/date/tostring/index.html | 94 ++ .../global_objects/date/totimestring/index.html | 88 ++ .../global_objects/date/toutcstring/index.html | 84 ++ .../reference/global_objects/date/utc/index.html | 133 +++ .../global_objects/date/valueof/index.html | 85 ++ .../global_objects/decodeuricomponent/index.html | 127 +++ .../reference/global_objects/encodeuri/index.html | 163 ++++ .../global_objects/encodeuricomponent/index.html | 163 ++++ .../global_objects/error/columnnumber/index.html | 43 + .../global_objects/error/filename/index.html | 47 + .../reference/global_objects/error/index.html | 241 +++++ .../global_objects/error/linenumber/index.html | 55 ++ .../global_objects/error/message/index.html | 75 ++ .../reference/global_objects/error/name/index.html | 58 ++ .../global_objects/error/prototype/index.html | 113 +++ .../global_objects/error/stack/index.html | 124 +++ .../global_objects/error/tosource/index.html | 57 ++ .../global_objects/error/tostring/index.html | 116 +++ .../reference/global_objects/escape/index.html | 132 +++ .../reference/global_objects/evalerror/index.html | 118 +++ .../global_objects/evalerror/prototype/index.html | 89 ++ .../global_objects/float32array/index.html | 204 +++++ .../global_objects/float64array/index.html | 204 +++++ .../global_objects/function/apply/index.html | 226 +++++ .../global_objects/function/arguments/index.html | 92 ++ .../global_objects/function/arity/index.html | 32 + .../global_objects/function/bind/index.html | 286 ++++++ .../global_objects/function/call/index.html | 163 ++++ .../global_objects/function/caller/index.html | 84 ++ .../global_objects/function/displayname/index.html | 81 ++ .../reference/global_objects/function/index.html | 188 ++++ .../global_objects/function/isgenerator/index.html | 56 ++ .../global_objects/function/length/index.html | 92 ++ .../global_objects/function/name/index.html | 229 +++++ .../global_objects/function/prototype/index.html | 99 +++ .../global_objects/function/tosource/index.html | 72 ++ .../global_objects/function/tostring/index.html | 236 +++++ .../reference/global_objects/generator/index.html | 137 +++ .../global_objects/generator/next/index.html | 116 +++ .../global_objects/generator/return/index.html | 102 +++ .../global_objects/generator/throw/index.html | 101 +++ .../global_objects/generatorfunction/index.html | 115 +++ .../generatorfunction/prototype/index.html | 66 ++ .../reference/global_objects/globalthis/index.html | 96 ++ .../javascript/reference/global_objects/index.html | 191 ++++ .../reference/global_objects/infinity/index.html | 83 ++ .../reference/global_objects/int16array/index.html | 204 +++++ .../reference/global_objects/int32array/index.html | 204 +++++ .../reference/global_objects/int8array/index.html | 209 +++++ .../global_objects/internalerror/index.html | 82 ++ .../internalerror/prototype/index.html | 61 ++ .../intl/collator/compare/index.html | 101 +++ .../global_objects/intl/collator/index.html | 179 ++++ .../intl/collator/prototype/index.html | 79 ++ .../intl/collator/resolvedoptions/index.html | 100 +++ .../intl/collator/supportedlocalesof/index.html | 98 +++ .../intl/datetimeformat/format/index.html | 101 +++ .../intl/datetimeformat/formattoparts/index.html | 169 ++++ .../global_objects/intl/datetimeformat/index.html | 248 ++++++ .../intl/datetimeformat/prototype/index.html | 83 ++ .../intl/datetimeformat/resolvedoptions/index.html | 107 +++ .../datetimeformat/supportedlocalesof/index.html | 99 +++ .../intl/getcanonicallocales/index.html | 74 ++ .../reference/global_objects/intl/index.html | 129 +++ .../intl/numberformat/format/index.html | 98 +++ .../global_objects/intl/numberformat/index.html | 195 +++++ .../intl/numberformat/prototype/index.html | 81 ++ .../numberformat/supportedlocalesof/index.html | 98 +++ .../global_objects/intl/pluralrules/index.html | 161 ++++ .../intl/pluralrules/supportedlocalesof/index.html | 85 ++ .../reference/global_objects/isfinite/index.html | 99 +++ .../reference/global_objects/isnan/index.html | 192 ++++ .../reference/global_objects/json/index.html | 155 ++++ .../reference/global_objects/json/parse/index.html | 128 +++ .../global_objects/json/stringify/index.html | 310 +++++++ .../global_objects/map/@@iterator/index.html | 102 +++ .../global_objects/map/@@species/index.html | 72 ++ .../global_objects/map/@@tostringtag/index.html | 58 ++ .../reference/global_objects/map/clear/index.html | 77 ++ .../reference/global_objects/map/delete/index.html | 73 ++ .../global_objects/map/entries/index.html | 78 ++ .../global_objects/map/foreach/index.html | 104 +++ .../reference/global_objects/map/get/index.html | 80 ++ .../reference/global_objects/map/has/index.html | 83 ++ .../reference/global_objects/map/index.html | 207 +++++ .../reference/global_objects/map/keys/index.html | 69 ++ .../global_objects/map/prototype/index.html | 86 ++ .../reference/global_objects/map/set/index.html | 96 ++ .../reference/global_objects/map/size/index.html | 67 ++ .../reference/global_objects/map/values/index.html | 77 ++ .../reference/global_objects/math/acos/index.html | 103 +++ .../reference/global_objects/math/acosh/index.html | 98 +++ .../reference/global_objects/math/asin/index.html | 103 +++ .../reference/global_objects/math/asinh/index.html | 99 +++ .../reference/global_objects/math/atan/index.html | 105 +++ .../reference/global_objects/math/atan2/index.html | 113 +++ .../reference/global_objects/math/cbrt/index.html | 98 +++ .../reference/global_objects/math/ceil/index.html | 170 ++++ .../reference/global_objects/math/clz32/index.html | 112 +++ .../reference/global_objects/math/cos/index.html | 98 +++ .../reference/global_objects/math/cosh/index.html | 102 +++ .../reference/global_objects/math/e/index.html | 83 ++ .../reference/global_objects/math/exp/index.html | 95 ++ .../reference/global_objects/math/expm1/index.html | 94 ++ .../reference/global_objects/math/floor/index.html | 137 +++ .../global_objects/math/fround/index.html | 112 +++ .../reference/global_objects/math/hypot/index.html | 128 +++ .../reference/global_objects/math/imul/index.html | 92 ++ .../reference/global_objects/math/index.html | 201 +++++ .../reference/global_objects/math/ln10/index.html | 83 ++ .../reference/global_objects/math/ln2/index.html | 83 ++ .../reference/global_objects/math/log/index.html | 113 +++ .../reference/global_objects/math/log10/index.html | 101 +++ .../global_objects/math/log10e/index.html | 85 ++ .../reference/global_objects/math/log1p/index.html | 102 +++ .../reference/global_objects/math/log2/index.html | 101 +++ .../reference/global_objects/math/log2e/index.html | 83 ++ .../global_objects/math/math.random/index.html | 112 +++ .../reference/global_objects/math/max/index.html | 118 +++ .../reference/global_objects/math/min/index.html | 112 +++ .../reference/global_objects/math/pi/index.html | 81 ++ .../reference/global_objects/math/pow/index.html | 113 +++ .../reference/global_objects/math/round/index.html | 99 +++ .../reference/global_objects/math/sign/index.html | 115 +++ .../reference/global_objects/math/sin/index.html | 97 +++ .../reference/global_objects/math/sinh/index.html | 102 +++ .../reference/global_objects/math/sqrt/index.html | 99 +++ .../global_objects/math/sqrt1_2/index.html | 84 ++ .../reference/global_objects/math/sqrt2/index.html | 82 ++ .../reference/global_objects/math/tan/index.html | 102 +++ .../reference/global_objects/math/tanh/index.html | 93 ++ .../reference/global_objects/math/trunc/index.html | 125 +++ .../reference/global_objects/nan/index.html | 97 +++ .../reference/global_objects/null/index.html | 93 ++ .../global_objects/number/epsilon/index.html | 75 ++ .../reference/global_objects/number/index.html | 180 ++++ .../global_objects/number/isfinite/index.html | 93 ++ .../global_objects/number/isinteger/index.html | 98 +++ .../global_objects/number/isnan/index.html | 104 +++ .../global_objects/number/issafeinteger/index.html | 99 +++ .../number/max_safe_integer/index.html | 68 ++ .../global_objects/number/max_value/index.html | 82 ++ .../number/min_safe_integer/index.html | 66 ++ .../global_objects/number/min_value/index.html | 83 ++ .../reference/global_objects/number/nan/index.html | 65 ++ .../number/negative_infinity/index.html | 100 +++ .../global_objects/number/parsefloat/index.html | 72 ++ .../global_objects/number/parseint/index.html | 77 ++ .../number/positive_infinity/index.html | 100 +++ .../global_objects/number/prototype/index.html | 89 ++ .../global_objects/number/toexponential/index.html | 108 +++ .../global_objects/number/tofixed/index.html | 113 +++ .../global_objects/number/tointeger/index.html | 52 ++ .../number/tolocalestring/index.html | 192 ++++ .../global_objects/number/toprecision/index.html | 107 +++ .../global_objects/number/tosource/index.html | 53 ++ .../global_objects/number/tostring/index.html | 116 +++ .../global_objects/number/valueof/index.html | 85 ++ .../object/__definegetter__/index.html | 150 ++++ .../global_objects/object/assign/index.html | 277 ++++++ .../global_objects/object/constructor/index.html | 192 ++++ .../global_objects/object/create/index.html | 268 ++++++ .../object/defineproperty/index.html | 413 +++++++++ .../global_objects/object/entries/index.html | 168 ++++ .../global_objects/object/freeze/index.html | 253 ++++++ .../object/getownpropertynames/index.html | 201 +++++ .../object/getprototypeof/index.html | 133 +++ .../object/hasownproperty/index.html | 203 +++++ .../reference/global_objects/object/index.html | 186 ++++ .../reference/global_objects/object/is/index.html | 120 +++ .../global_objects/object/isextensible/index.html | 153 ++++ .../global_objects/object/isfrozen/index.html | 173 ++++ .../global_objects/object/keys/index.html | 206 +++++ .../global_objects/object/observe/index.html | 199 +++++ .../global_objects/object/proto/index.html | 196 +++++ .../global_objects/object/prototype/index.html | 219 +++++ .../global_objects/object/tosource/index.html | 169 ++++ .../global_objects/object/valueof/index.html | 115 +++ .../global_objects/object/values/index.html | 148 ++++ .../reference/global_objects/parsefloat/index.html | 147 ++++ .../reference/global_objects/parseint/index.html | 195 +++++ .../global_objects/promise/all/index.html | 137 +++ .../global_objects/promise/finally/index.html | 93 ++ .../reference/global_objects/promise/index.html | 244 ++++++ .../global_objects/promise/race/index.html | 184 ++++ .../global_objects/promise/reject/index.html | 74 ++ .../global_objects/promise/then/index.html | 149 ++++ .../reference/global_objects/rangeerror/index.html | 174 ++++ .../global_objects/rangeerror/prototype/index.html | 128 +++ .../global_objects/reflect/apply/index.html | 98 +++ .../global_objects/reflect/construct/index.html | 157 ++++ .../reference/global_objects/reflect/index.html | 88 ++ .../global_objects/regexp/flags/index.html | 83 ++ .../reference/global_objects/regexp/index.html | 560 ++++++++++++ .../global_objects/regexp/input/index.html | 105 +++ .../global_objects/regexp/test/index.html | 127 +++ .../reference/global_objects/set/add/index.html | 69 ++ .../reference/global_objects/set/delete/index.html | 84 ++ .../reference/global_objects/set/has/index.html | 131 +++ .../reference/global_objects/set/index.html | 264 ++++++ .../global_objects/string/charat/index.html | 305 +++++++ .../global_objects/string/concat/index.html | 140 +++ .../global_objects/string/endswith/index.html | 148 ++++ .../global_objects/string/fromcharcode/index.html | 134 +++ .../global_objects/string/includes/index.html | 131 +++ .../reference/global_objects/string/index.html | 310 +++++++ .../global_objects/string/indexof/index.html | 200 +++++ .../global_objects/string/lastindexof/index.html | 148 ++++ .../global_objects/string/length/index.html | 87 ++ .../global_objects/string/match/index.html | 140 +++ .../global_objects/string/prototype/index.html | 189 ++++ .../reference/global_objects/string/raw/index.html | 160 ++++ .../global_objects/string/repeat/index.html | 286 ++++++ .../global_objects/string/replace/index.html | 344 ++++++++ .../global_objects/string/slice/index.html | 152 ++++ .../global_objects/string/split/index.html | 212 +++++ .../global_objects/string/startswith/index.html | 150 ++++ .../global_objects/string/substr/index.html | 171 ++++ .../global_objects/string/substring/index.html | 199 +++++ .../global_objects/string/suchen/index.html | 105 +++ .../global_objects/string/tolowercase/index.html | 79 ++ .../global_objects/string/touppercase/index.html | 127 +++ .../global_objects/string/trim/index.html | 93 ++ .../global_objects/string/trimleft/index.html | 58 ++ .../global_objects/string/trimright/index.html | 58 ++ .../global_objects/syntaxerror/index.html | 133 +++ .../syntaxerror/prototype/index.html | 88 ++ .../reference/global_objects/typeerror/index.html | 133 +++ .../global_objects/typeerror/prototype/index.html | 88 ++ .../reference/global_objects/undefined/index.html | 135 +++ .../reference/global_objects/unescape/index.html | 126 +++ .../reference/global_objects/uneval/index.html | 109 +++ .../global_objects/webassembly/compile/index.html | 91 ++ .../webassembly/compilestreaming/index.html | 87 ++ .../global_objects/webassembly/index.html | 111 +++ files/de/web/javascript/reference/index.html | 49 ++ .../reference/iteration_protocols/index.html | 349 ++++++++ .../reference/klassen/constructor/index.html | 165 ++++ .../reference/klassen/extends/index.html | 172 ++++ .../de/web/javascript/reference/klassen/index.html | 376 ++++++++ .../javascript/reference/klassen/static/index.html | 136 +++ .../reference/lexical_grammar/index.html | 549 ++++++++++++ .../reference/operators/addition/index.html | 82 ++ .../operators/array_comprehensions/index.html | 200 +++++ .../reference/operators/async_function/index.html | 107 +++ .../reference/operators/await/index.html | 112 +++ .../operators/bitwise_operatoren/index.html | 574 ++++++++++++ .../reference/operators/class/index.html | 157 ++++ .../reference/operators/comma_operator/index.html | 107 +++ .../operators/conditional_operator/index.html | 190 ++++ .../reference/operators/dekrement/index.html | 82 ++ .../reference/operators/delete/index.html | 295 +++++++ .../destrukturierende_zuweisung/index.html | 404 +++++++++ .../operators/expression_closures/index.html | 76 ++ .../reference/operators/function/index.html | 151 ++++ .../reference/operators/function_star_/index.html | 91 ++ .../operators/generator_comprehensions/index.html | 172 ++++ .../reference/operators/grouping/index.html | 91 ++ .../javascript/reference/operators/in/index.html | 145 ++++ .../web/javascript/reference/operators/index.html | 303 +++++++ .../reference/operators/inkrement/index.html | 80 ++ .../reference/operators/instanceof/index.html | 172 ++++ .../operators/logische_operatoren/index.html | 246 ++++++ .../reference/operators/modulo/index.html | 78 ++ .../reference/operators/new.target/index.html | 102 +++ .../javascript/reference/operators/new/index.html | 190 ++++ .../operators/objekt_initialisierer/index.html | 315 +++++++ .../operators/operator_precedence/index.html | 318 +++++++ .../operators/optionale_verkettung/index.html | 194 +++++ .../operators/pipeline_operator/index.html | 67 ++ .../operators/property_accessors/index.html | 150 ++++ .../reference/operators/spread_operator/index.html | 219 +++++ .../reference/operators/spread_syntax/index.html | 236 +++++ .../reference/operators/super/index.html | 184 ++++ .../javascript/reference/operators/this/index.html | 394 +++++++++ .../reference/operators/typeof/index.html | 259 ++++++ .../operators/vergleichsoperatoren/index.html | 243 ++++++ .../javascript/reference/operators/void/index.html | 108 +++ .../reference/operators/yield/index.html | 119 +++ .../reference/operators/yield_star_/index.html | 164 ++++ .../operators/zuweisungsoperator/index.html | 412 +++++++++ .../reference/statements/async_function/index.html | 223 +++++ .../reference/statements/block/index.html | 115 +++ .../reference/statements/break/index.html | 164 ++++ .../reference/statements/class/index.html | 192 ++++ .../reference/statements/const/index.html | 170 ++++ .../reference/statements/continue/index.html | 165 ++++ .../reference/statements/debugger/index.html | 52 ++ .../reference/statements/default/index.html | 120 +++ .../reference/statements/do...while/index.html | 132 +++ .../reference/statements/empty/index.html | 147 ++++ .../reference/statements/export/index.html | 126 +++ .../reference/statements/for...in/index.html | 227 +++++ .../reference/statements/for...of/index.html | 183 ++++ .../javascript/reference/statements/for/index.html | 201 +++++ .../reference/statements/for_each...in/index.html | 122 +++ .../reference/statements/function_star_/index.html | 200 +++++ .../reference/statements/funktion/index.html | 190 ++++ .../reference/statements/if...else/index.html | 168 ++++ .../reference/statements/import/index.html | 151 ++++ .../web/javascript/reference/statements/index.html | 148 ++++ .../reference/statements/label/index.html | 205 +++++ .../javascript/reference/statements/let/index.html | 454 ++++++++++ .../reference/statements/return/index.html | 192 ++++ .../reference/statements/switch/index.html | 289 ++++++ .../reference/statements/throw/index.html | 256 ++++++ .../reference/statements/try...catch/index.html | 382 ++++++++ .../javascript/reference/statements/var/index.html | 243 ++++++ .../reference/statements/while/index.html | 102 +++ .../javascript/reference/strict_mode/index.html | 401 +++++++++ .../reference/template_strings/index.html | 219 +++++ .../veraltete_und_abgeschaffte_features/index.html | 291 +++++++ .../the_legacy_iterator_protocol/index.html | 78 ++ .../web/javascript/speicherverwaltung/index.html | 184 ++++ files/de/web/javascript/typed_arrays/index.html | 230 +++++ .../index.html | 424 +++++++++ 573 files changed, 82863 insertions(+) create mode 100644 files/de/web/javascript/about_javascript/index.html create mode 100644 "files/de/web/javascript/aufz\303\244hlbarkeit_und_zugeh\303\266rigkeit_von_eigenschaften/index.html" create mode 100644 files/de/web/javascript/closures/index.html create mode 100644 files/de/web/javascript/datenstrukturen/index.html create mode 100644 files/de/web/javascript/eine_wiedereinfuehrung_in_javascript/index.html create mode 100644 "files/de/web/javascript/einf\303\274hrung_in_den_gebrauch_von_xpath_in_javascript/index.html" create mode 100644 files/de/web/javascript/eventloop/index.html create mode 100644 files/de/web/javascript/guide/ausdruecke_und_operatoren/index.html create mode 100644 "files/de/web/javascript/guide/einf\303\274hrung/index.html" create mode 100644 files/de/web/javascript/guide/feinheiten_des_objektmodells/index.html create mode 100644 files/de/web/javascript/guide/funktionen/index.html create mode 100644 files/de/web/javascript/guide/grammatik_und_typen/index.html create mode 100644 files/de/web/javascript/guide/index.html create mode 100644 files/de/web/javascript/guide/indexed_collections/index.html create mode 100644 files/de/web/javascript/guide/keyed_collections/index.html create mode 100644 files/de/web/javascript/guide/kontrollfluss_und_fehlerbehandlung/index.html create mode 100644 files/de/web/javascript/guide/meta_programming/index.html create mode 100644 files/de/web/javascript/guide/mit_objekten_arbeiten/index.html create mode 100644 files/de/web/javascript/guide/modules/index.html create mode 100644 files/de/web/javascript/guide/numbers_and_dates/index.html create mode 100644 files/de/web/javascript/guide/regular_expressions/index.html create mode 100644 files/de/web/javascript/guide/schleifen_und_iterationen/index.html create mode 100644 files/de/web/javascript/guide/textformatierung/index.html create mode 100644 files/de/web/javascript/guide/using_promises/index.html create mode 100644 files/de/web/javascript/index.html create mode 100644 files/de/web/javascript/inheritance_and_the_prototype_chain/index.html create mode 100644 files/de/web/javascript/introduction_to_object-oriented_javascript/index.html create mode 100644 files/de/web/javascript/javascript_technologieuebersicht/index.html create mode 100644 files/de/web/javascript/language_resources/index.html create mode 100644 files/de/web/javascript/reference/about/index.html create mode 100644 files/de/web/javascript/reference/fehler/already_has_pragma/index.html create mode 100644 files/de/web/javascript/reference/fehler/array_sort_argument/index.html create mode 100644 files/de/web/javascript/reference/fehler/bad_octal/index.html create mode 100644 files/de/web/javascript/reference/fehler/bad_radix/index.html create mode 100644 files/de/web/javascript/reference/fehler/bad_regexp_flag/index.html create mode 100644 files/de/web/javascript/reference/fehler/bad_return_or_yield/index.html create mode 100644 files/de/web/javascript/reference/fehler/called_on_incompatible_type/index.html create mode 100644 files/de/web/javascript/reference/fehler/cant_access_lexical_declaration_before_init/index.html create mode 100644 files/de/web/javascript/reference/fehler/cant_access_property/index.html create mode 100644 files/de/web/javascript/reference/fehler/cant_define_property_object_not_extensible/index.html create mode 100644 files/de/web/javascript/reference/fehler/cant_delete/index.html create mode 100644 files/de/web/javascript/reference/fehler/cant_redefine_property/index.html create mode 100644 files/de/web/javascript/reference/fehler/cyclic_object_value/index.html create mode 100644 files/de/web/javascript/reference/fehler/dead_object/index.html create mode 100644 files/de/web/javascript/reference/fehler/delete_in_strict_mode/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_caller_or_arguments_usage/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_expression_closures/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_octal/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_source_map_pragma/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_string_generics/index.html create mode 100644 files/de/web/javascript/reference/fehler/deprecated_tolocaleformat/index.html create mode 100644 files/de/web/javascript/reference/fehler/equal_as_assign/index.html create mode 100644 files/de/web/javascript/reference/fehler/for-each-in_loops_are_deprecated/index.html create mode 100644 files/de/web/javascript/reference/fehler/getter_only/index.html create mode 100644 files/de/web/javascript/reference/fehler/identifier_after_number/index.html create mode 100644 files/de/web/javascript/reference/fehler/illegal_character/index.html create mode 100644 files/de/web/javascript/reference/fehler/in_operator_no_object/index.html create mode 100644 files/de/web/javascript/reference/fehler/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_array_length/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_assignment_left-hand_side/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_const_assignment/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_date/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_for-in_initializer/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_for-of_initializer/index.html create mode 100644 files/de/web/javascript/reference/fehler/invalid_right_hand_side_instanceof_operand/index.html create mode 100644 files/de/web/javascript/reference/fehler/is_not_iterable/index.html create mode 100644 files/de/web/javascript/reference/fehler/json_bad_parse/index.html create mode 100644 files/de/web/javascript/reference/fehler/malformed_formal_parameter/index.html create mode 100644 files/de/web/javascript/reference/fehler/malformed_uri/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_bracket_after_list/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_colon_after_property_id/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_curly_after_function_body/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_curly_after_property_list/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_formal_parameter/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_initializer_in_const/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_name_after_dot_operator/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_parenthesis_after_argument_list/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_parenthesis_after_condition/index.html create mode 100644 files/de/web/javascript/reference/fehler/missing_semicolon_before_statement/index.html create mode 100644 files/de/web/javascript/reference/fehler/more_arguments_needed/index.html create mode 100644 files/de/web/javascript/reference/fehler/negative_repetition_count/index.html create mode 100644 files/de/web/javascript/reference/fehler/no_non-null_object/index.html create mode 100644 files/de/web/javascript/reference/fehler/no_properties/index.html create mode 100644 files/de/web/javascript/reference/fehler/no_variable_name/index.html create mode 100644 files/de/web/javascript/reference/fehler/non_configurable_array_element/index.html create mode 100644 files/de/web/javascript/reference/fehler/not_a_codepoint/index.html create mode 100644 files/de/web/javascript/reference/fehler/not_a_constructor/index.html create mode 100644 files/de/web/javascript/reference/fehler/not_a_function/index.html create mode 100644 files/de/web/javascript/reference/fehler/not_defined/index.html create mode 100644 files/de/web/javascript/reference/fehler/precision_range/index.html create mode 100644 files/de/web/javascript/reference/fehler/property_access_denied/index.html create mode 100644 files/de/web/javascript/reference/fehler/read-only/index.html create mode 100644 files/de/web/javascript/reference/fehler/redeclared_parameter/index.html create mode 100644 files/de/web/javascript/reference/fehler/reduce_of_empty_array_with_no_initial_value/index.html create mode 100644 files/de/web/javascript/reference/fehler/reserved_identifier/index.html create mode 100644 files/de/web/javascript/reference/fehler/resulting_string_too_large/index.html create mode 100644 files/de/web/javascript/reference/fehler/stmt_after_return/index.html create mode 100644 files/de/web/javascript/reference/fehler/strict_non_simple_params/index.html create mode 100644 files/de/web/javascript/reference/fehler/too_much_recursion/index.html create mode 100644 files/de/web/javascript/reference/fehler/typed_array_invalid_arguments/index.html create mode 100644 files/de/web/javascript/reference/fehler/undeclared_var/index.html create mode 100644 files/de/web/javascript/reference/fehler/undefined_prop/index.html create mode 100644 files/de/web/javascript/reference/fehler/unexpected_token/index.html create mode 100644 files/de/web/javascript/reference/fehler/unexpected_type/index.html create mode 100644 files/de/web/javascript/reference/fehler/unnamed_function_statement/index.html create mode 100644 files/de/web/javascript/reference/fehler/unterminated_string_literal/index.html create mode 100644 files/de/web/javascript/reference/fehler/var_hides_argument/index.html create mode 100644 files/de/web/javascript/reference/functions/arguments/@@iterator/index.html create mode 100644 files/de/web/javascript/reference/functions/arguments/callee/index.html create mode 100644 files/de/web/javascript/reference/functions/arguments/index.html create mode 100644 files/de/web/javascript/reference/functions/arguments/length/index.html create mode 100644 files/de/web/javascript/reference/functions/default_parameters/index.html create mode 100644 files/de/web/javascript/reference/functions/get/index.html create mode 100644 files/de/web/javascript/reference/functions/index.html create mode 100644 files/de/web/javascript/reference/functions/methoden_definitionen/index.html create mode 100644 files/de/web/javascript/reference/functions/pfeilfunktionen/index.html create mode 100644 files/de/web/javascript/reference/functions/rest_parameter/index.html create mode 100644 files/de/web/javascript/reference/functions/set/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/@@iterator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/@@species/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/concat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/copywithin/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/entries/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/every/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/fill/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/filter/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/find/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/findindex/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/flat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/flatmap/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/foreach/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/from/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/includes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/indexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/isarray/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/join/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/keys/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/lastindexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/length/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/map/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/observe/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/of/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/pop/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/prototypen/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/push/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reduce/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reduceright/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reverse/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/shift/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/slice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/some/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/sort/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/splice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/unobserve/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/unshift/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/values/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/@@species/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/isview/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/slice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/arraybuffer/transfer/index.html create mode 100644 files/de/web/javascript/reference/global_objects/asyncfunction/index.html create mode 100644 files/de/web/javascript/reference/global_objects/asyncfunction/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/add/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/and/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/compareexchange/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/exchange/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/islockfree/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/load/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/or/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/store/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/sub/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/wait/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/wake/index.html create mode 100644 files/de/web/javascript/reference/global_objects/atomics/xor/index.html create mode 100644 files/de/web/javascript/reference/global_objects/boolean/index.html create mode 100644 files/de/web/javascript/reference/global_objects/boolean/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/boolean/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/boolean/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/boolean/valueof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/buffer/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/bytelength/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/byteoffset/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getfloat32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getfloat64/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getint16/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getint32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getint8/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getuint16/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getuint32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/getuint8/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setfloat32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setfloat64/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setint16/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setint32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setint8/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setuint16/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setuint32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/dataview/setuint8/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/@@toprimitive/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getday/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getfullyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/gethours/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getmilliseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getminutes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getmonth/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/gettime/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcdate/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcday/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcfullyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutchours/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcminutes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcmonth/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getutcseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/getyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/now/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/parse/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setdate/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setfullyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/sethours/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setmilliseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setminutes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setmonth/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/settime/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcdate/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcfullyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutchours/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcminutes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcmonth/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setutcseconds/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/setyear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/todatestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/togmtstring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/toisostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tojson/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tolocaledatestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tolocaleformat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tolocalestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tolocaletimestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/totimestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/toutcstring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/utc/index.html create mode 100644 files/de/web/javascript/reference/global_objects/date/valueof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/decodeuricomponent/index.html create mode 100644 files/de/web/javascript/reference/global_objects/encodeuri/index.html create mode 100644 files/de/web/javascript/reference/global_objects/encodeuricomponent/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/columnnumber/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/filename/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/linenumber/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/message/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/name/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/stack/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/error/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/escape/index.html create mode 100644 files/de/web/javascript/reference/global_objects/evalerror/index.html create mode 100644 files/de/web/javascript/reference/global_objects/evalerror/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/float32array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/float64array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/apply/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/arguments/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/arity/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/bind/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/call/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/caller/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/displayname/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/isgenerator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/length/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/name/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/function/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generator/next/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generator/return/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generator/throw/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generatorfunction/index.html create mode 100644 files/de/web/javascript/reference/global_objects/generatorfunction/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/globalthis/index.html create mode 100644 files/de/web/javascript/reference/global_objects/index.html create mode 100644 files/de/web/javascript/reference/global_objects/infinity/index.html create mode 100644 files/de/web/javascript/reference/global_objects/int16array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/int32array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/int8array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/internalerror/index.html create mode 100644 files/de/web/javascript/reference/global_objects/internalerror/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/collator/compare/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/collator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/collator/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/collator/resolvedoptions/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/collator/supportedlocalesof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/format/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/formattoparts/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/resolvedoptions/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/datetimeformat/supportedlocalesof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/numberformat/format/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/numberformat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/pluralrules/index.html create mode 100644 files/de/web/javascript/reference/global_objects/intl/pluralrules/supportedlocalesof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/isfinite/index.html create mode 100644 files/de/web/javascript/reference/global_objects/isnan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/json/index.html create mode 100644 files/de/web/javascript/reference/global_objects/json/parse/index.html create mode 100644 files/de/web/javascript/reference/global_objects/json/stringify/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/@@iterator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/@@species/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/@@tostringtag/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/clear/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/delete/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/entries/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/foreach/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/get/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/has/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/keys/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/set/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/size/index.html create mode 100644 files/de/web/javascript/reference/global_objects/map/values/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/acos/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/acosh/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/asin/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/asinh/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/atan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/atan2/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/cbrt/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/ceil/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/clz32/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/cos/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/cosh/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/e/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/exp/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/expm1/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/floor/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/fround/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/hypot/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/imul/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/ln10/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/ln2/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log10/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log10e/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log1p/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log2/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/log2e/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/math.random/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/max/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/min/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/pi/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/pow/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/round/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sign/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sin/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sinh/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sqrt/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sqrt1_2/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/sqrt2/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/tan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/tanh/index.html create mode 100644 files/de/web/javascript/reference/global_objects/math/trunc/index.html create mode 100644 files/de/web/javascript/reference/global_objects/nan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/null/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/epsilon/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/isfinite/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/isinteger/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/isnan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/issafeinteger/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/max_safe_integer/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/max_value/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/min_safe_integer/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/min_value/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/nan/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/negative_infinity/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/parsefloat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/parseint/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/positive_infinity/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/toexponential/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/tofixed/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/tointeger/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/tolocalestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/toprecision/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/number/valueof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/__definegetter__/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/assign/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/constructor/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/create/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/defineproperty/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/entries/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/freeze/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/getownpropertynames/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/getprototypeof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/hasownproperty/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/is/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/isextensible/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/isfrozen/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/keys/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/observe/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/proto/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/valueof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/object/values/index.html create mode 100644 files/de/web/javascript/reference/global_objects/parsefloat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/parseint/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/all/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/finally/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/race/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/reject/index.html create mode 100644 files/de/web/javascript/reference/global_objects/promise/then/index.html create mode 100644 files/de/web/javascript/reference/global_objects/rangeerror/index.html create mode 100644 files/de/web/javascript/reference/global_objects/rangeerror/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/reflect/apply/index.html create mode 100644 files/de/web/javascript/reference/global_objects/reflect/construct/index.html create mode 100644 files/de/web/javascript/reference/global_objects/reflect/index.html create mode 100644 files/de/web/javascript/reference/global_objects/regexp/flags/index.html create mode 100644 files/de/web/javascript/reference/global_objects/regexp/index.html create mode 100644 files/de/web/javascript/reference/global_objects/regexp/input/index.html create mode 100644 files/de/web/javascript/reference/global_objects/regexp/test/index.html create mode 100644 files/de/web/javascript/reference/global_objects/set/add/index.html create mode 100644 files/de/web/javascript/reference/global_objects/set/delete/index.html create mode 100644 files/de/web/javascript/reference/global_objects/set/has/index.html create mode 100644 files/de/web/javascript/reference/global_objects/set/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/charat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/concat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/endswith/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/fromcharcode/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/includes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/indexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/lastindexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/length/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/match/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/raw/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/repeat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/replace/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/slice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/split/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/startswith/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/substr/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/substring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/suchen/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/tolowercase/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/touppercase/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/trim/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/trimleft/index.html create mode 100644 files/de/web/javascript/reference/global_objects/string/trimright/index.html create mode 100644 files/de/web/javascript/reference/global_objects/syntaxerror/index.html create mode 100644 files/de/web/javascript/reference/global_objects/syntaxerror/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/typeerror/index.html create mode 100644 files/de/web/javascript/reference/global_objects/typeerror/prototype/index.html create mode 100644 files/de/web/javascript/reference/global_objects/undefined/index.html create mode 100644 files/de/web/javascript/reference/global_objects/unescape/index.html create mode 100644 files/de/web/javascript/reference/global_objects/uneval/index.html create mode 100644 files/de/web/javascript/reference/global_objects/webassembly/compile/index.html create mode 100644 files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html create mode 100644 files/de/web/javascript/reference/global_objects/webassembly/index.html create mode 100644 files/de/web/javascript/reference/index.html create mode 100644 files/de/web/javascript/reference/iteration_protocols/index.html create mode 100644 files/de/web/javascript/reference/klassen/constructor/index.html create mode 100644 files/de/web/javascript/reference/klassen/extends/index.html create mode 100644 files/de/web/javascript/reference/klassen/index.html create mode 100644 files/de/web/javascript/reference/klassen/static/index.html create mode 100644 files/de/web/javascript/reference/lexical_grammar/index.html create mode 100644 files/de/web/javascript/reference/operators/addition/index.html create mode 100644 files/de/web/javascript/reference/operators/array_comprehensions/index.html create mode 100644 files/de/web/javascript/reference/operators/async_function/index.html create mode 100644 files/de/web/javascript/reference/operators/await/index.html create mode 100644 files/de/web/javascript/reference/operators/bitwise_operatoren/index.html create mode 100644 files/de/web/javascript/reference/operators/class/index.html create mode 100644 files/de/web/javascript/reference/operators/comma_operator/index.html create mode 100644 files/de/web/javascript/reference/operators/conditional_operator/index.html create mode 100644 files/de/web/javascript/reference/operators/dekrement/index.html create mode 100644 files/de/web/javascript/reference/operators/delete/index.html create mode 100644 files/de/web/javascript/reference/operators/destrukturierende_zuweisung/index.html create mode 100644 files/de/web/javascript/reference/operators/expression_closures/index.html create mode 100644 files/de/web/javascript/reference/operators/function/index.html create mode 100644 files/de/web/javascript/reference/operators/function_star_/index.html create mode 100644 files/de/web/javascript/reference/operators/generator_comprehensions/index.html create mode 100644 files/de/web/javascript/reference/operators/grouping/index.html create mode 100644 files/de/web/javascript/reference/operators/in/index.html create mode 100644 files/de/web/javascript/reference/operators/index.html create mode 100644 files/de/web/javascript/reference/operators/inkrement/index.html create mode 100644 files/de/web/javascript/reference/operators/instanceof/index.html create mode 100644 files/de/web/javascript/reference/operators/logische_operatoren/index.html create mode 100644 files/de/web/javascript/reference/operators/modulo/index.html create mode 100644 files/de/web/javascript/reference/operators/new.target/index.html create mode 100644 files/de/web/javascript/reference/operators/new/index.html create mode 100644 files/de/web/javascript/reference/operators/objekt_initialisierer/index.html create mode 100644 files/de/web/javascript/reference/operators/operator_precedence/index.html create mode 100644 files/de/web/javascript/reference/operators/optionale_verkettung/index.html create mode 100644 files/de/web/javascript/reference/operators/pipeline_operator/index.html create mode 100644 files/de/web/javascript/reference/operators/property_accessors/index.html create mode 100644 files/de/web/javascript/reference/operators/spread_operator/index.html create mode 100644 files/de/web/javascript/reference/operators/spread_syntax/index.html create mode 100644 files/de/web/javascript/reference/operators/super/index.html create mode 100644 files/de/web/javascript/reference/operators/this/index.html create mode 100644 files/de/web/javascript/reference/operators/typeof/index.html create mode 100644 files/de/web/javascript/reference/operators/vergleichsoperatoren/index.html create mode 100644 files/de/web/javascript/reference/operators/void/index.html create mode 100644 files/de/web/javascript/reference/operators/yield/index.html create mode 100644 files/de/web/javascript/reference/operators/yield_star_/index.html create mode 100644 files/de/web/javascript/reference/operators/zuweisungsoperator/index.html create mode 100644 files/de/web/javascript/reference/statements/async_function/index.html create mode 100644 files/de/web/javascript/reference/statements/block/index.html create mode 100644 files/de/web/javascript/reference/statements/break/index.html create mode 100644 files/de/web/javascript/reference/statements/class/index.html create mode 100644 files/de/web/javascript/reference/statements/const/index.html create mode 100644 files/de/web/javascript/reference/statements/continue/index.html create mode 100644 files/de/web/javascript/reference/statements/debugger/index.html create mode 100644 files/de/web/javascript/reference/statements/default/index.html create mode 100644 files/de/web/javascript/reference/statements/do...while/index.html create mode 100644 files/de/web/javascript/reference/statements/empty/index.html create mode 100644 files/de/web/javascript/reference/statements/export/index.html create mode 100644 files/de/web/javascript/reference/statements/for...in/index.html create mode 100644 files/de/web/javascript/reference/statements/for...of/index.html create mode 100644 files/de/web/javascript/reference/statements/for/index.html create mode 100644 files/de/web/javascript/reference/statements/for_each...in/index.html create mode 100644 files/de/web/javascript/reference/statements/function_star_/index.html create mode 100644 files/de/web/javascript/reference/statements/funktion/index.html create mode 100644 files/de/web/javascript/reference/statements/if...else/index.html create mode 100644 files/de/web/javascript/reference/statements/import/index.html create mode 100644 files/de/web/javascript/reference/statements/index.html create mode 100644 files/de/web/javascript/reference/statements/label/index.html create mode 100644 files/de/web/javascript/reference/statements/let/index.html create mode 100644 files/de/web/javascript/reference/statements/return/index.html create mode 100644 files/de/web/javascript/reference/statements/switch/index.html create mode 100644 files/de/web/javascript/reference/statements/throw/index.html create mode 100644 files/de/web/javascript/reference/statements/try...catch/index.html create mode 100644 files/de/web/javascript/reference/statements/var/index.html create mode 100644 files/de/web/javascript/reference/statements/while/index.html create mode 100644 files/de/web/javascript/reference/strict_mode/index.html create mode 100644 files/de/web/javascript/reference/template_strings/index.html create mode 100644 files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/index.html create mode 100644 files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/the_legacy_iterator_protocol/index.html create mode 100644 files/de/web/javascript/speicherverwaltung/index.html create mode 100644 files/de/web/javascript/typed_arrays/index.html create mode 100644 files/de/web/javascript/vergleiche_auf_gleichheit_und_deren_verwendung/index.html (limited to 'files/de/web/javascript') diff --git a/files/de/web/javascript/about_javascript/index.html b/files/de/web/javascript/about_javascript/index.html new file mode 100644 index 0000000000..5f5fdca9cc --- /dev/null +++ b/files/de/web/javascript/about_javascript/index.html @@ -0,0 +1,61 @@ +--- +title: Über JavaScript +slug: Web/JavaScript/About_JavaScript +tags: + - Beginner + - Introduction + - JavaScript +translation_of: Web/JavaScript/About_JavaScript +--- +
{{JsSidebar}}
+ +

Was ist JavaScript?

+ +

JavaScript® (oft auch JS abgekürzt) ist eine leichte, interpretierte, objektorientierte Sprache mit First-Class-Funktionen und ist bekannt als Skriptsprache für Webseiten. Die Sprache wird aber auch in vielen nicht-Browserumgebungen (englisch) eingesetzt. Es ist eine prototypenbasierte, multiparadigmen Skriptsprache, die dynamisch ist und objektorientierten, imperativen und funktionalen Programmierstil erlaubt.

+ +

JavaScript wird auf der Clientseite des Webs ausgeführt, was dazu genutzt werden kann, um das Design und Verhalten einer Webseite ereignisgesteuert zu ändert. JavaScript ist eine leicht zu lernende und mächtige Skriptsprache, die auf Webseiten weit verbreitet ist.

+ +

Im Gegensatz zu dem weit verbreiteten Irrtum ist JavaScript kein interpretiertes Java. Kurz gesagt ist JavaScript eine dynamische Skriptsprache, die prototypenbasierte Objektkonstrukte unterstützt. Die Basissyntax ist absichtlich ähnlich zu Java und C++, um die Anzahl der neu zu lernenden Sprachkonzepte zu reduzieren. Sprachkonstrukte, wie if-Anweisungen, for- und while-Schleifen und switch- und try...catch-Blöcke funktionieren genauso wie in den oben genannten Sprachen (oder fast genauso).

+ +

JavaScript kann sowohl als prozedurale als auch als objektorientierte Sprache eingesetzt werden. Objekte werden in JavaScript programmatisch erstellt und durch anfügen von Methoden und Eigenschaften zu leeren Objekten zur laufzeit erstellt,  was anders ist als in Klassendefinitionen in kompilierten Sprachen wie C++ und Java. Wenn ein Objekt erstellt wurde, kann dieses als Blaupause (oder Prototyp) für das erstellen gleicher Objekte verwendet werden.

+ +

JavaScripts dynamische Fähigkeiten beinhalten Objekterzeugung zur Laufzeit, variable Parameterlisten, Funktionsvariablen,  dynamische Skripterzeugung (mit {{jsxref("eval")}}), Objekt Introspektion (mit {{jsxref("Statements/for...in", "for...in")}}) und Quelltextwiederherstellung (JavaScriptprogramme können Funktionskörper zurück in den Quelltext übersetzen).

+ +

Für einen tieferen Einblick in die JavaScript-Programmiersprache folgen den JavaScript Quellen unten.

+ +

Welche JavaScript Implementierungen gibt es?

+ +

Das Mozilla Projekt verfügt über zwei JavaScript Implementierungen. Als erstes gab es JavaScript (erstellt von Brendan Eich) in dem Netscape-Browser und seit dem wurde diese JavaScript Version aktualisiert um konform zu dem ECMA-262 Standard in der 5. Auflage und späteren Versionen zu sein. Diese Umgebung, mit dem Codenamen SpiderMonkey, ist in C/C++ implementiert. Die Rhino Umgebung, hauptsächlich erstellt von Norris Boyd (auch bei Netscape), ist eine JavaScript Implementierung, die in Java geschrieben wurde. Wie auch SpiderMonkey ist Rhino kompatibel zu dem  ECMA-262 Standard in der 5. Auflage.

+ +

Einige wichtige Laufzeitoptimierungen, wie TraceMonkey (Firefox 3.5), JägerMonkey (Firefox 4) and IonMonkey wurden zu der SpiderMonkey JavaScriptumgebung hinzugefügt. Die arbeit geht immernoch weiter, um die Ausführungsperformance in JavaScript zu verbessern.

+ +

Neben den oben genannten Implementierungen gibt es weitere bekannte JavaScript-Umgebungen:

+ + + +

Jede JavaScript Umgebung von Mozilla enthält eine öffentliche API, mit der Entwickler JavaScript in ihre Applikationen integrieren können. Bei weitem sind Web-Browser die häufigsten Einsatzgebiete von JavaScript-Umgebungen. Web-Browser benutzen typischeweise die öffentliche API um Host-Objekte zu erstellen, um das DOM in JavaScript wiederzuspiegeln.

+ +

Eine weiteres Einsatzgebiet für JavaScript ist der Einsatz als serverseitige Skriptsprache. Ein JavaScript Web-Server wird Host-Objekte erstellen, die eine HTTP-Anfrage und -Antwort repräsentieren. Diese können dann verändert werden, um dynamische Webseiten zu programmieren. Node.js ist das bekannteste Beispiel für einen solchen Server.

+ +

JavaScript Quellen

+ +
+
SpiderMonkey
+
Informationen spezifisch zu Mozillas Implementierung von JavaScript der C/C++ Umgebung SpiderMonkey. Beinhaltet auch Informationen über das einbetten in Applikationen.
+
+ +
+
Rhino
+
Informationen spezifisch zu Mozillas Implementierung von JavaScript in der Java Umgebungen Rhino.
+
Sprachquellen
+
Zeigt veröffentliche JavaScript-Standards.
+
Eine (Wieder)-Einführung in JavaScript
+
JavaScript Guide und JavaScript-Referenzen.
+
+ +

JavaScript® ist eine Marke oder registrierte Marke von Oracle in den USA und anderen Ländern.

diff --git "a/files/de/web/javascript/aufz\303\244hlbarkeit_und_zugeh\303\266rigkeit_von_eigenschaften/index.html" "b/files/de/web/javascript/aufz\303\244hlbarkeit_und_zugeh\303\266rigkeit_von_eigenschaften/index.html" new file mode 100644 index 0000000000..70c769be5a --- /dev/null +++ "b/files/de/web/javascript/aufz\303\244hlbarkeit_und_zugeh\303\266rigkeit_von_eigenschaften/index.html" @@ -0,0 +1,340 @@ +--- +title: Aufzählbarkeit und Zugehörigkeit von Eigenschaften +slug: Web/JavaScript/Aufzählbarkeit_und_Zugehörigkeit_von_Eigenschaften +tags: + - Eigenschaft + - JavaScript + - Objekt + - enumerable +translation_of: Web/JavaScript/Enumerability_and_ownership_of_properties +--- +
{{JsSidebar("More")}}
+ +

Aufzählbare Eigenschaften sind jene, deren internes Statusfeld enumerable gesetzt ist.

+ +

Alle aufzählbaren Eigenschaften eines Objektes sind mit for...in-Schleifen zu durchlaufen (sofern der Name der Eigenschaft kein Symbol ist), daher die Bezeichnung „aufzählbar“.
+ Neben for…in gibt es weitere Möglichkeiten, die Existenz einer Eigenschaft zu erkennen, Eigenschaften aufzuzählen oder abzurufen. Siehe dazu nachfolgende Tabellen.

+ +

Standardmäßig aufzählbar sind Eigenschaften, die durch einfache Zuweisung oder Initialisierung entstanden sind, nicht jedoch Eigenschaften, die durch Object.defineProperty oder ähnliche Mechanismen erzeugt wurden.

+ +

Die Zugehörigkeit einer Eigenschaft ergibt sich aus dem Ort seiner Definition; dies ist entweder das Objekt selbst oder einer seiner Prototypen. Eine Eigenschaft, die im Objekt definiert wurde, gehört zu diesem Objekt.

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Aufzählbarkeit und Zugehörigkeit – Eingebaute Methoden zur Erkennung, zum Abruf und zur Aufzählung
FunktionObjektObjekt und geerbt aus Prototypenkettenur geerbt aus Prototypenkette
Erkennung + + + + + + + + + + + + + + + +
aufzählbarnicht aufzählbaraufzählbar und nicht aufzählbar
+

propertyIsEnumerable

+ +

hasOwnProperty

+
+

hasOwnProperty – aufzählbare Eigenschaften mit propertyIsEnumerable entfernt

+
hasOwnProperty
+
+ + + + + + + + + + + + + + + +
aufzählbarnicht aufzählbaraufzählbar und nicht aufzählbar
nur mit eigenem Code möglichnur mit eigenem Code möglichin
+
nur mit eigenem Code möglich
Abruf + + + + + + + + + + + + + + + +
aufzählbarnicht aufzählbaraufzählbar und nicht aufzählbar
+

Object.keys

+ +

getOwnPropertyNames 

+ +

getOwnPropertySymbols

+
getOwnPropertyNames, getOwnPropertySymbols – aufzählbare Eigenschaften mit propertyIsEnumerable entfernt +

getOwnPropertyNames

+ +

getOwnPropertySymbols

+
+
nur mit eigenem Code möglichnur mit eigenem Code möglich
Aufzählung + + + + + + + + + + + + + + + +
aufzählbarnicht aufzählbaraufzählbar und nicht aufzählbar
+

Object.keys

+ +

getOwnPropertyNames 

+ +

getOwnPropertySymbols

+
getOwnPropertyNames, getOwnPropertySymbols – aufzählbare Eigenschaften mit propertyIsEnumerable entfernt +

getOwnPropertyNames

+ +

getOwnPropertySymbols

+
+
+ + + + + + + + + + + + + + + +
aufzählbarnicht aufzählbaraufzählbar und nicht aufzählbar
+

for..in

+ +

(ohne Symbole)

+
nur mit eigenem Code möglichnur mit eigenem Code möglich
+
nur mit eigenem Code möglich
+
+ +

Sichtbarkeit von Eigenschaften

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
infor..inobj.hasOwnPropertyobj.propertyIsEnumerableObject.keysObject.getOwnPropertyNamesObject.getOwnPropertyDescriptorsReflect.ownKeys()
Aufzählbarjajajajajajajaja
Nicht aufzählbarjaneinjaneinneinjajaja
Symbol als Namejaneinjajaneinneinjaja
Aufzählbar, geerbtjajaneinneinneinneinneinnein
Nicht aufzählbar, geerbtjaneinneinneinneinneinneinnein
Symbol als Name, geerbtjaneinneinneinneinneinneinnein
+
+ +

Eigenschaften nach Aufzählbarkeit oder Zugehörigkeit abrufen

+ +

Der nachfolgende Code ist nicht immer der effizienteste Weg, aber als einfaches Beispiel gut geeignet.

+ + + +
var SimplePropertyRetriever = {
+    getOwnEnumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._enumerable);
+         // Or could use for..in filtered with hasOwnProperty or just this: return Object.keys(obj);
+    },
+    getOwnNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._notEnumerable);
+    },
+    getOwnEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._enumerableAndNotEnumerable);
+        // Or just use: return Object.getOwnPropertyNames(obj);
+    },
+    getPrototypeEnumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._enumerable);
+    },
+    getPrototypeNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._notEnumerable);
+    },
+    getPrototypeEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._enumerableAndNotEnumerable);
+    },
+    getOwnAndPrototypeEnumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._enumerable);
+        // Or could use unfiltered for..in
+    },
+    getOwnAndPrototypeNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._notEnumerable);
+    },
+    getOwnAndPrototypeEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._enumerableAndNotEnumerable);
+    },
+    // Private static property checker callbacks
+    _enumerable: function(obj, prop) {
+        return obj.propertyIsEnumerable(prop);
+    },
+    _notEnumerable: function(obj, prop) {
+        return !obj.propertyIsEnumerable(prop);
+    },
+    _enumerableAndNotEnumerable: function(obj, prop) {
+        return true;
+    },
+    // Inspired by http://stackoverflow.com/a/8024294/271577
+    _getPropertyNames: function getAllPropertyNames(obj, iterateSelfBool, iteratePrototypeBool, includePropCb) {
+        var props = [];
+
+        do {
+            if (iterateSelfBool) {
+                Object.getOwnPropertyNames(obj).forEach(function(prop) {
+                    if (props.indexOf(prop) === -1 && includePropCb(obj, prop)) {
+                        props.push(prop);
+                    }
+                });
+            }
+            if (!iteratePrototypeBool) {
+                break;
+            }
+            iterateSelfBool = true;
+        } while (obj = Object.getPrototypeOf(obj));
+
+        return props;
+    }
+};
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/closures/index.html b/files/de/web/javascript/closures/index.html new file mode 100644 index 0000000000..a9fcd90d9c --- /dev/null +++ b/files/de/web/javascript/closures/index.html @@ -0,0 +1,471 @@ +--- +title: Closures (Funktionsabschlüsse) +slug: Web/JavaScript/Closures +tags: + - Closure + - ES5 + - Intermediate + - JavaScript + - Reference +translation_of: Web/JavaScript/Closures +--- +
{{jsSidebar("Intermediate")}}
+ +

Closures sind Funktionen mit unabhängigen, freien Variablen. Anders ausgedrückt: Die in der Closure definierte Funktion merkt sich die Umgebung, in der sie erzeugt wurde.

+ +

Lexical scoping

+ +

Lexikalischer Geltungsbereich

+ +

Betrachten wir folgendes Beispiel:

+ +
+
function init() {
+  var name = "Mozilla"; // name ist eine von init erzeugte lokale Variable
+  function displayName() { // displayName() ist die innere, umschlossene Funktion, sprich die 'Closure'
+    alert(name); // hier wird die in der umschließenden Eltern-Funktion deklarierte Variable benutzt
+  }
+  displayName();
+}
+init();
+
+ +

init() erzeugt eine lokale Variable name und anschließend eine Funktion displayName(). displayName() ist eine interne Funktion definiert in init() und ist ausschließlich im Rahmen dieser Funktion verfügbar. displayName() besitzt keine eigenen lokalen Variablen, hat jedoch Zugriff auf Variablen umgebender Funktionen und kann darum die Variable name aus der umschließenden Eltern-Funktion abrufen.

+ +

{{JSFiddleEmbed("https://jsfiddle.net/78dg25ax/", "js,result", 250)}}

+ +

Dieses Code-Beispiel zeigt, dass es funktioniert. Es handelt sich hier um einen lexikalischen Geltungsbereich (lexical scoping), d.h. in JavaScript wird der Geltungsbereich (scope) einer Variablen bestimmt durch ihren Fundort im Quellcode (darum lexikalisch). Und verschachtelte Funktionen haben Zugriff auf Variablen, die im umschließenden Geltungsbereich (outer scope) deklariert werden.

+ +

Closure

+ +

Funktionsabschluss

+ +

Betrachten wir folgendes Beispiel:

+ +
function makeFunc() {
+  var name = "Mozilla";
+  function displayName() {
+    alert(name);
+  }
+  return displayName;
+}
+
+var myFunc = makeFunc();
+myFunc();
+
+ +

Zum Laufen gebracht zeigt dieser Code exakt den gleichen Effekt wie das vorherige init() Beispiel: Die Zeichenfolge "Mozilla" wird als JavaScript alert Meldung angezeigt. Der interessante Unterschied besteht darin, dass die innere Funktion displayName() von der äußeren Funktion schon vor ihrer Ausführung zurückgegeben wurde.

+ +

Dass der Code weiterhin funktioniert, mag verwundern. Üblicherweise existieren die in einer Funktion enthaltenen lokalen Variablen nur während ihrer Ausführung. Man könnte also annehmen, dass die Variable name nicht mehr abrufbar ist, nachdem makeFunc() geendet hat. Da der Code trotzdem funktioniert, ist dies offensichtlich nicht der Fall.

+ +

Des Rätsels Lösung ist, dass myFunc zu einem Funktionsabschluss, einer Closure, geworden ist. Die Closure ist ein besonderes Objekt mit zwei außergewöhnlichen Merkmalen – sie umfasst sowohl die Funktion, wie auch das Umfeld, in dem diese erzeugt wurde. Dieses Umfeld besteht aus sämtlichen lokalen Variablen, die im Geltungsbereich (Scope) lagen zum Zeitpunkt der Erzeugung der Closure. Im obigen Beispiel ist myFunc eine Closure, die sowohl die Funktion myFunc, wie auch die Zeichenfolge "Mozilla", die bei der Erzeugung der Closure exisitierte, umfasst. 

+ +

Hier nun ein etwas interessanteres Beispiel, eine makeAdder() Funktion:

+ +
function makeAdder(x) {
+  return function(y) {
+    return x + y;
+  };
+}
+
+var add5 = makeAdder(5);
+var add10 = makeAdder(10);
+
+console.log(add5(2));  // 7
+console.log(add10(2)); // 12
+
+ +

In diesem Beispiel haben wir eine Funktion makeAdder(x) definiert, die ein einzelnes Argument x erwartet und eine neue Funktion zurück gibt. Die zurückgegebene Funktion erwartet ein Argument y und liefert die Summe von x und y als Ergebnis.

+ +

Die Funktion makeAdder ist im Wesentlichen eine Factory für spezielle Funktionen: sie erzeugt  Funktionen, welche ihrem Argument einen bestimmten Wert hinzuaddieren. Im vorangegangenen Beispiel erzeugen wir mittels dieser Factory zwei neue Funktionen: eine von ihnen addiert 5 zu ihrem Argument, die andere addiert 10 hinzu.

+ +

add5 und add10 sind beides Closures. Sie teilen beide den selben Funktionsrumpf, behalten aber verschiedene Kontexte. In add5's Kontext ist x 5, im Kontext von add10 ist x 10.

+ +

Practical closures

+ +

Closures in der Praxis

+ +

Soviel zur Theorie von Closures — aber gibt es tatsächlich einen Praxisnutzen? Betrachten wir dafür die Auswirkungen in der Praxis. Ein Closure lässt uns Daten (die Ausführungsumgebung) mit einer Funktion, die auf diesen Daten operiert, verbinden. Das hat offensichtliche Parallelen zur objektorientierten Programmierung, bei der die Daten eines Objekts (die Objekteigenschaften) mit einer oder mehreren Methoden verbunden werden. Somit kann ein Closure immer dann verwendet werden, wo normalerweise ein Objekt mit einer einzigen Methode verwendet wird.

+ +

Besonders im Web kommt uns das häufig entgegen. Ein Großteil von JavaScript-Code ist ereignisbasierter Code: wir definieren erst ein Verhalten, und hängen es dann an ein Benutzerereignis (bspw. einen Mausklick oder Tastendruck). Unser Code nimmt dabei üblicherweise die Form eines Callback an: eine einzelne Funktion, die bei Eintreten des Ereignisses aufgerufen wird.

+ +

Hier ein Beispiel aus der Praxis: Angenommen, wir wollen Buttons auf einer Seite hinzufügen, die die Schriftgröße ändern – eine Möglichkeit wäre, die Schriftgröße mittels der Eigenschaft font-size im body-Element in Pixel (px) zu setzen und bei anderen Elementen der Seite (z.B. header-Elemente wie h1h2) die Eigenschaft font-size in der relativen Einheit em anzugeben:

+ +
body {
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 12px;
+}
+
+h1 {
+  font-size: 1.5em;
+}
+
+h2 {
+  font-size: 1.2em;
+}
+
+ +

Unser interaktiver Schriftgößen-Button ändert die font-size-Eigenschaft des body-Elements. Diese Änderung wird von den anderen Elementen auf der Seite wahrgenommen und die Elemente passen sich dank der relativen Einheit em nun der neuen Schriftgröße an.

+ +

Hier das JavaScript:

+ +
function makeSizer(size) {
+  return function() {
+    document.body.style.fontSize = size + 'px';
+  };
+}
+
+var size12 = makeSizer(12);
+var size14 = makeSizer(14);
+var size16 = makeSizer(16);
+
+ +

size12, size14 und size16 sind nun Funktionen, die den body-Text in Schriftgröße 12 Pixel, 14 Pixel oder 16 Pixel ändern. Diese Funktionen können nun wie folgt als Buttons (in diesem Fall als Links) hinzugefügt werden:

+ +
document.getElementById('size-12').onclick = size12;
+document.getElementById('size-14').onclick = size14;
+document.getElementById('size-16').onclick = size16;
+
+ +
<a href="#" id="size-12">12</a>
+<a href="#" id="size-14">14</a>
+<a href="#" id="size-16">16</a>
+
+ +

{{JSFiddleEmbed("https://jsfiddle.net/vnkuZ/7726/","","200")}}

+ +

Emulation privater Methoden mit Hilfe von Closures

+ +

Sprachen wie Java bieten die Möglichkeit Methoden als privat zu deklarieren, was bedeutet, dass sie nur von anderen Methoden der gleichen Klasse aufgerufen werden können.

+ +

Dies ist in JavaScript nicht explizit vorgesehen, aber es kann mit Hilfe von Funtionsabschlüssen nachgebildet werden. Private Methoden sind nicht nur nützlich um den Zugriff auf Code einzuschränken: sie bieten auch ein mächtiges Werkzeug um den globalen Namensraum zu verwalten indem sie weniger wichtige Methoden vor dem öffentlichen Interface verbergen.

+ +

Das folgende Beispiel zeigt, wie man ein paar öffentliche Funktionen definiert, welche Zugriff auf private Funktionen und Variablen haben, indem man Closures verwendet. Die ist auch als module pattern bekannt:

+ +
var counter = (function() {
+  var privateCounter = 0;
+  function changeBy(val) {
+    privateCounter += val;
+  }
+  return {
+    increment: function() {
+      changeBy(1);
+    },
+    decrement: function() {
+      changeBy(-1);
+    },
+    value: function() {
+      return privateCounter;
+    }
+  };
+})();
+
+console.log(counter.value()); // logs 0
+counter.increment();
+counter.increment();
+console.log(counter.value()); // logs 2
+counter.decrement();
+console.log(counter.value()); // logs 1
+
+ +

In den vorhergehenden Beispielen hatte jede Closure ihr eigenes Umfeld; hier erzeugen wir ein einziges Umfeld, welches von 3 Funktionen geteilt wird: counter.increment, counter.decrement und counter.value.

+ +

Das gemeinsame Umfeld wird im Inneren einer anonymen Funktion erzeugt, welche nach der Definition auch gleich aufgerufen wird. Das Umfeld enthält 2 private Dinge: eine Variable mit dem Namen privateCounter und eine Funktion mit dem Namen changeBy. Auf keines von diesen privaten Dingen kann von ausserhalb der anonymen Funktion zugegriffen werden. Statt dessen muß auf sie mit Hilfe der drei öffentlichen Funktionen zugegriffen werden, welche von der anonymen Funktion zurueckgegeben werden.

+ +

Diese drei öffentlichen Funktionen sind Closures, welche das gleiche Umfeld teilen. Wegen JavaScripts lexikalischem Geltungsbereich haben sie alle Zugriff auf die privateCounter Variable und die changeBy Funktion.

+ +
+

Du siehst: wir definieren eine anonyme Funktion, die einen Zähler erzeugt, und dann rufen wir sie unmittelbar auf und weisen das Ergebnis der counter Variablen zu. Wir könnten diese Funktion in einer separaten Variablen makeCounter speichern und sie zum Erzeugen mehrerer Zähler benutzen.

+
+ +
var makeCounter = function() {
+  var privateCounter = 0;
+  function changeBy(val) {
+    privateCounter += val;
+  }
+  return {
+    increment: function() {
+      changeBy(1);
+    },
+    decrement: function() {
+      changeBy(-1);
+    },
+    value: function() {
+      return privateCounter;
+    }
+  }
+};
+
+var counter1 = makeCounter();
+var counter2 = makeCounter();
+alert(counter1.value()); /* Alerts 0 */
+counter1.increment();
+counter1.increment();
+alert(counter1.value()); /* Alerts 2 */
+counter1.decrement();
+alert(counter1.value()); /* Alerts 1 */
+alert(counter2.value()); /* Alerts 0 */
+
+ +

Beachte wie jeder der zwei Zähler, counter1 und counter2, seine Unabhängigkeit vom anderen erhält. Jede Closure referenziert eine andere Version der privateCounter Variablen durch ihren eigene Closure. Jedes mal, wenn einer der Zähler aufgerufen wird, ändert sich das lexikalische Umfeld durch ändern des Wertes dieser Variablen; jedoch haben Änderungen des Wertes der Variablen in der einen Closure keinen Einfluss auf den Wert in der anderen Closure.

+ +
+

Diese Art Closures zu verwenden bietet einige Vorteile, die man der Objekt orientierten Progammierung zuspricht, insbesondere Daten verbergen und Klammerung.

+
+ +

Closure Scope Chain

+ +

Kette von Closure Geltungsbereichen

+ +

Für jede Closure haben wir drei Geltungsbereiche:

+ + + +

Wir haben also drei Geltungsbereiche für eine Closure. Aber häufig machen wir Fehler, wenn wir geschachtelte innere Funktionen haben. Betrachten wir das folgende Beispiel:

+ +
// global scope
+var e = 10;
+function sum(a){
+  return function(b){
+    return function(c){
+      // outer functions scope
+      return function(d){
+        // local scope
+        return a + b + c + d + e;
+      }
+    }
+  }
+}
+
+console.log(sum(1)(2)(3)(4)); // log 20
+
+// We can also write without anonymous functions:
+
+// global scope
+var e = 10;
+function sum(a){
+  return function sum2(b){
+    return function sum3(c){
+      // outer functions scope
+      return function sum4(d){
+        // local scope
+        return a + b + c + d + e;
+      }
+    }
+  }
+}
+
+var s = sum(1);
+var s1 = s(2);
+var s2 = s1(3);
+var s3 = s2(4);
+console.log(s3) //log 20
+
+ +

Also in dem obigen Beispiel haben wir eine Serie von geschachtelten Funktionen, die alle Zugriff auf den Geltungsbereich der äusseren Funktionen haben aber fälschlicherweise oft angenommen wird, dass sie Zugriff nur auf den Geltungsbereich der nächsten äusseren Funktion haben. Zur Verdeutlichung kann man sagen, dass alle Closures Zugriff auf die Geltungsbereiche aller Funktionen haben, innerhalb derer sie deklariert sind.

+ +

Creating closures in loops: A common mistake

+ +

Erzeugen von Closures in Schleifen: Ein häufiger Fehler

+ +

Vor der Einführung des let Schlüsselwortes in ECMAScript 6, gab es ein häufiges Problem mit Closures, wenn sie innerhalb einer Schleife erzeugt wurden. Hier ein Beispiel:

+ +
<p id="help">Helpful notes will appear here</p>
+<p>E-mail: <input type="text" id="email" name="email"></p>
+<p>Name: <input type="text" id="name" name="name"></p>
+<p>Age: <input type="text" id="age" name="age"></p>
+
+ +
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': 'Your e-mail address'},
+      {'id': 'name', 'help': 'Your full name'},
+      {'id': 'age', 'help': 'Your age (you must be over 16)'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    var item = helpText[i];
+    document.getElementById(item.id).onfocus = function() {
+      showHelp(item.help);
+    }
+  }
+}
+
+setupHelp();
+
+ +

{{JSFiddleEmbed("https://jsfiddle.net/v7gjv/8164/", "", 200)}}

+ +

Das helpText Array definiert drei Hilfshinweise, die jeweils mit der ID eines Eingabefeldes verknüpft sind. Die Schleife geht durch diese Definitionen und hängt an das onfocus Ereignis die entsprechende Hilfemethode.

+ +

Wenn du aber diesen Code ausprobierst, wirst du sehen, dass er nicht tut was er sollte. Egal auf welches Feld du den Fokus gibst, es wird immer die Meldung über dein Alter gezeigt.

+ +

Der Grund dafür ist, dass die Callbacks, die an onfocus gehängt sind, Closures sind; sie bestehen aus der Funktionsdefinition und dem Umfeld aus dem Geltungsbereich von setupHelp. Drei Closures wurden von der Schleife erzeugt, aber jede benutzt das gleiche gemeinsame lexikalische Umfeld, das eine Variable mit sich änderndem Wert besitzt (item.help). Der Wert von item.help wird bestimmt, wenn die onfocus Callbacks ausgeführt werden. Weil aber die Schleife zu dieser Zeit bereits gelaufen ist, zeigt das item Objekt (das von allen drei Closures geteilt wird) weiterhin auf den letzten Eintrag in der helpText Liste.

+ +

Eine Lösung ist in diesem Fall die Benutzung von mehreren Closures: insbesondere, eine Funktionsfabrik zu benutzten wie früher beschrieben:

+ +
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function makeHelpCallback(help) {
+  return function() {
+    showHelp(help);
+  };
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': 'Your e-mail address'},
+      {'id': 'name', 'help': 'Your full name'},
+      {'id': 'age', 'help': 'Your age (you must be over 16)'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    var item = helpText[i];
+    document.getElementById(item.id).onfocus = makeHelpCallback(item.help);
+  }
+}
+
+setupHelp();
+
+ +

{{JSFiddleEmbed("https://jsfiddle.net/v7gjv/9573/", "", 300)}}

+ +

Das tut wie erwartet. Anstatt den Callbacks ein gemeinsames lexikales Umfeld zu geben erzeugt die makeHelpCallback Funktion ein neues lexikalisches Umfeld für jeden Callback, in dem sich help auf den entsprechenden String aus dem helpText Array bezieht.

+ +

Ein anderer Weg das obige mit einer anonymonen Closure zu schreiben ist:

+ +
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': 'Your e-mail address'},
+      {'id': 'name', 'help': 'Your full name'},
+      {'id': 'age', 'help': 'Your age (you must be over 16)'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    (function() {
+       var item = helpText[i];
+       document.getElementById(item.id).onfocus = function() {
+         showHelp(item.help);
+       }
+    })(); // Immediate event listener attachment with the current value of item (preserved until iteration).
+  }
+}
+
+setupHelp();
+ +

Wenn du nicht mehrere Closures benutzten möchtest, kannst du das let Schlüsselwort benutzen, das in ES2015 eingeführt wurde:

+ +
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': 'Your e-mail address'},
+      {'id': 'name', 'help': 'Your full name'},
+      {'id': 'age', 'help': 'Your age (you must be over 16)'}
+    ];
+
+  for (var i = 0; i < helpText.length; i++) {
+    let item = helpText[i];
+    document.getElementById(item.id).onfocus = function() {
+      showHelp(item.help);
+    }
+  }
+}
+
+setupHelp();
+ +

Dieses Beispiel benutzt let anstatt var, so dass jede Closure die blocksichtbare Variable bindet, was bedeutet, dass keine zusätzlichen Closures gebraucht werden.

+ +

Eine weitere Alternative könnte sein forEach() für die Iteration über das helpText Array zu benutzen und einen Callback für jeden {{htmlelement("div")}} zuzuweisen, wie hier gezeigt:

+ +
function showHelp(help) {
+  document.getElementById('help').innerHTML = help;
+}
+
+function setupHelp() {
+  var helpText = [
+      {'id': 'email', 'help': 'Your e-mail address'},
+      {'id': 'name', 'help': 'Your full name'},
+      {'id': 'age', 'help': 'Your age (you must be over 16)'}
+    ];
+
+  helpText.forEach(function(text) {
+    document.getElementById(text.id).onfocus = function() {
+      showHelp(text.help);
+    }
+  });
+}
+
+setupHelp();
+ +

Performance considerations

+ +

Effizienzbetrachtungen

+ +

Es ist unklug unnötigerweise Funktionen innerhalb anderer Funktionen zu erzeugen, wenn Closures für eine bestimmte Aufgabe nicht gebraucht werden. Denn es hat negativen Einfluss auf die Scripteffizienz sowohl in Bezug auf Geschwindigkeit als auch Speicherbedarf.

+ +

Wenn zum Beispiel ein neues Objekt/Klasse erzeugt wird, sollten die Methoden mit dem Prototypen des Objekts verbunden sein anstatt im Objektkonstuktor erzeugt werden. Der Grund ist, dass immer wenn der Konstruktor aufgerufen wird, die Methoden neu zugewiesen würden (das heisst, für jede Objekterzeugung).

+ +

Betrachte folgenden Fall:

+ +
function MyObject(name, message) {
+  this.name = name.toString();
+  this.message = message.toString();
+  this.getName = function() {
+    return this.name;
+  };
+
+  this.getMessage = function() {
+    return this.message;
+  };
+}
+
+ +

Da der vorliegende Code die Vorteile von Closures in diesem speziellen Fall nicht nutzt, könnten wir ihn umschreiben so dass wir die Closure vermeiden:

+ +
function MyObject(name, message) {
+  this.name = name.toString();
+  this.message = message.toString();
+}
+MyObject.prototype = {
+  getName: function() {
+    return this.name;
+  },
+  getMessage: function() {
+    return this.message;
+  }
+};
+
+ +

Es wird jedoch nicht empfohlen, den Prototyp neu zu definieren. Das folgende Beispiel erweitert statt dessen den existierenden Prototyp:

+ +
function MyObject(name, message) {
+  this.name = name.toString();
+  this.message = message.toString();
+}
+MyObject.prototype.getName = function() {
+  return this.name;
+};
+MyObject.prototype.getMessage = function() {
+  return this.message;
+};
+
+ +

In den zwei vorhergehenden Beispielen kann der vererbte Prototyp von allen Objekten benutzt werden und die Definition der Methoden muss nicht bei jeder Objekterzeugung durchgeführt werden. Weitere Informationen unter Details zum Objektmodell.

diff --git a/files/de/web/javascript/datenstrukturen/index.html b/files/de/web/javascript/datenstrukturen/index.html new file mode 100644 index 0000000000..d918cd7a0e --- /dev/null +++ b/files/de/web/javascript/datenstrukturen/index.html @@ -0,0 +1,271 @@ +--- +title: JavaScript Datentypen und Datenstrukturen +slug: Web/JavaScript/Datenstrukturen +tags: + - Beginner + - JavaScript + - Types +translation_of: Web/JavaScript/Data_structures +--- +
{{jsSidebar("More")}}
+ +

Alle Programmiersprachen besitzen eingebaute Datenstrukturen. Diese unterschieden sich aber je nach Programmiersprache. Dieser Artikel versucht, die in JavaScript verfügbaren Datenstrukturen und ihre Eigenschaften zu erläutern. Außerdem werden an passenden Stellen Vergleiche zu anderen Programmiersprachen gezogen.

+ +

Dynamische Typisierung

+ +

JavaScript ist eine schwach typisierte oder dynamische Programmiersprache. Datentypen werden bei einer Variable nicht explizit deklariert und jede Variable kann mit Werten jedes Typen beschrieben (überschrieben) werden:

+ +
var foo = 42;    // foo ist jetzt eine number
+var foo = "bar"; // foo ist jetzt ein string
+var foo = true;  // foo ist jetzt ein boolean
+
+ +

Datentypen

+ +

Der aktuelle ECMAScript Standard definiert sieben Datentypen:

+ + + +

Primitive Werte

+ +

Alle Datentypen, bis auf Object, definieren unveränderbare Werte (Werte, die nicht verändert werden können). Zum Beispiel im Gegensatz zu C sind Strings unveränderbar. Die Werte dieser Datentypen werden als "primitive Werte" bezeichnet.

+ +

Boolean Datentyp

+ +

Boolean repräsentiert eine logische Einheit und kann zwei Werte annehmen: true und false.

+ +

Null Datentyp

+ +

Der Null Typ hat genau einen Wert: null. Siehe {{jsxref("null")}} und {{Glossary("Null")}} für mehr Details.

+ +

Undefined Datentyp

+ +

Eine Variable, der noch kein Wert zugewiesen wurde, hat den Wert undefined. Siehe {{jsxref("undefined")}} und {{Glossary("Undefined")}} für mehr Details.

+ +

Number Datentyp

+ +

Laut dem ECMAScript Standard gibt es nur einen Datentyp für Zahlen: double-precision 64-bit binary format IEEE 754 value (Zahlen zwischen -(263) und +263-1). Es gibt keinen spezifischen Datentyp für Ganzzahlen. Neben Gleitkommazahlen kann der Datentyp für Zahlen auch drei symbolische Werte annehmen: +Infinity, -Infinity und NaN (not-a-number = keine Zahl).

+ +

Um auf größere oder kleinere Werte als +/-Infinity zu prüfen, können die Konstanten {{jsxref("Number.MAX_VALUE")}} oder {{jsxref("Number.MIN_VALUE")}} verwendet werden. Ab ECMAScript 2015 kann auch geprüft werden, ob sich eine Zahl innerhalb des Bereichs der Gleitkommazahlen mit doppelter Präzision befindet. Die ist mit {{jsxref("Number.isSafeInteger()")}} als auch {{jsxref("Number.MAX_SAFE_INTEGER")}} und {{jsxref("Number.MIN_SAFE_INTEGER")}} möglich. Zahlen außerhalb diesen Bereichs sind in JavaScript nicht mehr sicher.

+ +

Der Datentyp für Zahlen hat eine Ganzzahl mit zwei Repräsentationen: 0 kann als -0 und +0 repräsentiert werden. ("0" ist ein Alias für +0). In der Praxis hat dies fast keinen Einfluss. +0 === -0 ist zum Beispiel true. Eine Division ergibt aber zwei unterschiedliche Werte:

+ +
> 42 / +0
+Infinity
+> 42 / -0
+-Infinity
+
+ +

Obwohl eine Zahl oft ihren Wert repräsentiert, bietet JavaScript einige binäre Operatoren an. Mit ihnen können zum Beispiel mehrere Boolean Werte innerhalb einer einzigen Zahl mittels Bitmaskierung repräsentiert werden. Das gilt generell als schlechte Praxis, da JavaScript andere Wege anbietet, um eine Menge von Booleans zu repräsentierten (wie zum Beispiel ein Array von Booleans oder ein Objekt mit Boolean Werten als benannte Eigenschaften). Bitmaskierung führt außerdem dazu, dass Code schwerer zu lesen, zu verstehen und zu warten ist. In sehr speziellen Anwendungsgebiete kann eine Bitmaskierung aber notwendig sein. Zum Beispiel wenn nur geringe Speichermengen verfügbar sind oder in extremen Fällen, wenn jedes übertragene Bit im Netzwerk zählt. Diese Technik sollte aber als letzter Ausweg gesehen werden, um die Größe zu optimieren.

+ +

String Datentyp

+ +

Der Datentyp String wird in JavaScript für die Repräsentation von textuellen Daten verwendet. Er ist eine Menge von "Elementen" aus 16-Bit vorzeichenlosen Ganzzahlenwerten. Jedes Element im String nimmt eine Position im String ein. Das erste Element befindet sich an der Position mit dem Index 0, das nächste beim Index 1 und so weiter. Die Länge eines String ist die Anzahl der sich darin befindenden Elemente.

+ +

In Gegensatz zu anderen Programmiersprachen wie C kann ein String in JavaScript nicht verändert werden. Das bedeutet, dass ein String nicht mehr verändert werden kann, nachdem er erstellt wurde. Es ist aber möglich einen anderen String mit der Hilfe von Operationen aus dem ursprünglichen String zu erstellen:

+ + + +

Vermeiden Sie "stringly-typing" in Ihrem Code!

+ +

Es kann verlockend sein mit String komplexe Daten zu repräsentieren. Es bringt kurzfristige Vorteile mit sich:

+ + + +

Ohne Konventionen kann jede Datenstruktur als String repräsentiert werden. Das ist aber keine gute Idee. Es könnte zum Beispiel eine Liste emuliert werden, indem die Listenelemente im String durch einen Separator getrennt werden. In diesem Fall ist ein JavaScript Array aber geeigneter, denn die Liste kann zerstört werden sobald ein Listenelement den Separator enthält. Ein Escape-Zeichen oder Ähnliches müsste verwendet werden. Dafür sind aber zusätzliche Konventionen nötig und die Wartung des Codes nimmt an Komplexität zu.

+ +

Strings sollten nur für textuelle Daten verwendet werden. Wenn komplexe Daten repräsentiert werden sollen, parsen Sie den String und verwenden Sie eine geeignete Abstraktion.

+ +

Symbol Datentyp

+ +

Symbole in JavaScript sind mit ECMAScript 2015 eingeführt worden. Ein Symbol ist ein eindeutiger und unveränderbarer primitiver Wert. Er kann als Schlüssel einer Eigenschaft eines Objekts (siehe unten) verwendet werden. In manchen Programmiersprachen werden Symbole auch Atoms genannt. Details dazu sind unter {{Glossary("Symbol")}} und dem {{jsxref("Symbol")}} Object Wrapper in JavaScript zu finden.

+ +

Objekte

+ +

Objekte sind in der Informatik Werte im Speicher, die möglicherweise über einen {{Glossary("Identifier", "identifier")}} referenziert werden.

+ +

Eigenschaften

+ +

In JavaScript können Objekte als eine Sammlung von Eigenschaften (Properties) angesehen werden. Mit der Object Literal Syntax werden die nötigsten Eigenschaften initialisiert. Danach können Eigenschaften hinzugefügt oder wieder entfernt werden. Der Wert einer Eigenschaft kann von jedem Datentyp sein. Darunter können sich auch andere Objekte befinden. Dadurch können komplexe Datenstrukturen realisiert werden. Eigenschaften werden mit einem Key identifiziert. Ein Key ist entweder ein String oder ein Symbol.

+ +

Es gibt zwei Arten von Eigenschaften, die bestimmte Attribute haben: Die Dateneigenachften und Zugriffseigenschaften.

+ +

Dateneigenschaften

+ +

Assoziiert einen Key mit einem Wert und besitzt die folgenden Attribute:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Attribute einer Dateneigenschaft
AttributDatentypBeschreibungStandardwert
[[Value]]beliebiger JavaScript DatentypDer Wert, der bei einem Get-Zugriff auf die Eigenschaft zurückgegeben wirdundefined
[[Writable]]Booleanfalse, wenn [[Value]] der Eigenschaft nicht verändert werden kann.false
[[Enumerable]]Booleantrue, wenn die Eigenschaft in for...in Schleifen aufgelistet wird. Siehe dazu auch Aufzählbarkeit und Eigentum von Eigenschaften.false
[[Configurable]]Booleanfalse, wenn die Eigenschaft nicht gelöscht und die Attribute [[Value]] und [[Writable]] nicht verändert werden können.false
+ +

Zugriffseigenschaften

+ +

Assoziiert einen Key mit einer oder zwei Accessor-Funktionen (get und set), um einen Wert zu erhalten oder zu speichern. Es besitzt die folgenden Attribute:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Attribute eines Zugriffseigenschaft
AttributDatentypBeschreibungStandardwert
[[Get]]Funktionsobjekt oder undefinedDie Funktion wird ohne ein Argument aufgerufen und gibt den Wert der Eigenschaft zurück, sobald ein Get-Zugriff auf den Wert ausgeführt wird. Siehe auch get.undefined
[[Set]]Funktionsobjekt oder undefinedDie Funktion wird mit einem Argument aufgerufen, das den Wert für die Zuweisung enthält. Sie wird immer aufgerufen, sobald eine bestimmte Eigenschaft verändert werden soll. Siehe auch set.undefined
[[Enumerable]]Booleantrue, wenn die Eigenschaft in for...in Schleifen aufgelistet wird.false
[[Configurable]]Booleanfalse, wenn die Eigenschaft nicht gelöscht und nicht zu einer Dateneigenschaft verändert werden kann.false
+ +
+

Hinweis: Attribut wird normalerweise von der JavaScript-Umgebung genutzt und man kann nicht direkt zugreifen (mehr darüber: Object.defineProperty()). Deswegen sind die Attribute in doppelten eckigen Klammern statt in einfachen.

+
+ +

"Normale" Objekte und Funktionen

+ +

Ein Objekt in JavaScript ist ein Mapping zwischen Keys und Werten. Keys sind Strings oder Symbole und Werte können von jedem Datentyp sein. Dadurch sind Objekte eine Art Hashtabelle.

+ +

Funktionen sind reguläre Objekte mit der Fähigkeit direkt aufgerufen werden zu können.

+ +

Datum

+ +

Mit der in JavaScript eingebauten Date Utility kann ein Datum repräsentiert werden.

+ +

Indizierte Collections: Arrays und typisierte Arrays

+ +

Arrays sind reguläre Objekte bei denen eine Beziehung zwischen Eigenschaften, die über Ganzzahlen indiziert werden, und der Eigenschaft 'length' besteht. Zusätzlich erben Arrays von Array.prototype, einer Helfermethoden, die die Manipulation von Arrays anbietet, wie zum Beispiel indexOf (zur Suche eines Werts im Array) oder push (um Elemente zu einem Array hinzufügen). Dadurch können Listen und Mengen über ein Array repräsentiert werden.

+ +

Typisierte Arrays sind in JavaScript mit ECMAScript Edition 2015 eingeführt worden. Sie bieten eine Array-ähnliche Sicht auf einen darunterliegenden binären Datenpuffer an. Die folgende Tabelle stellt äquivalente C Datentypen dar:

+ +

{{page("/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects", "", 0, 3)}}

+ +

Keyed Collections: Maps, Sets, WeakMaps, WeakSets

+ +

Diese Datenstrukturen verwenden Objektreferenzen als Keys. Sie wurden mit ECMAScript Edition 6 eingeführt. {{jsxref("Set")}} und {{jsxref("WeakSet")}} repräsentieren eine Menge von Objekten, während {{jsxref("Map")}} und {{jsxref("WeakMap")}} einen Wert mit einem Objekt assoziieren. Der Unterschied zwischen Maps und WeakMaps ist, dass bei Maps über Objekt-Keys iteriert werden kann. Das erlaubt eine spätere Optimierung der Garbage Collection.

+ +

Maps und Sets könnten in reinem ECMAScript 5 implementiert werden. Da Objekte aber nicht verglichen werden können (im Sinne von zum Beispiel "kleiner gleich"), wäre die Performance für einen Look-Up linear. Native Implementierungen (inklusive WeakMaps) können eine ungefähr logarithmische Look-Up Performance haben.

+ +

Um Daten an einen DOM-Knoten zu binden, werden normalerweise die Eigenschaften direkt auf dem Objekt gesetzt oder es werden data-* Attribute verwendet. Das hat aber den Nachteil, dass die Daten für jedes Skript in demselben Kontext verfügbar sind. Mit Maps und WeakMaps können Daten einfach privat an ein Objekt gebunden werden.

+ +

Strukturierte Daten: JSON

+ +

JSON (JavaScript Object Notation) ist ein leichtgewichtges Format zum Datenaustausch, das von JavaScript abgeleitet aber auch von vielen anderen Programmiersprachen verwendet wird. Mit JSON können universelle Datenstrukturen aufgebaut werden. Siehe {{Glossary("JSON")}} und {{jsxref("JSON")}} für mehr Details.

+ +

Mehr Objekte in der Standardbibliothek

+ +

JavaScript hat eine Standardbibliothek mit zahlreichen eingebauten Objekten. Details darüber sind unter Referenz zu finden.

+ +

Datentypen mit dem typeof Operator bestimmen

+ +

Der typeof Operator kann den Datentyp einer Variablen herausfinden. Unter der Referenzseite sind mehr Details und Grenzfälle zu finden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}initiale Definition
{{SpecName('ES5.1', '#sec-8', 'Types')}}{{Spec2('ES5.1')}} 
{{SpecName('ES2015', '#sec-ecmascript-data-types-and-values', 'ECMAScript Data Types and Values')}}{{Spec2('ES2015')}} 
{{SpecName('ESDraft', '#sec-ecmascript-data-types-and-values', 'ECMAScript Data Types and Values')}}{{Spec2('ESDraft')}} 
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/eine_wiedereinfuehrung_in_javascript/index.html b/files/de/web/javascript/eine_wiedereinfuehrung_in_javascript/index.html new file mode 100644 index 0000000000..a306d9fd16 --- /dev/null +++ b/files/de/web/javascript/eine_wiedereinfuehrung_in_javascript/index.html @@ -0,0 +1,909 @@ +--- +title: Eine Wiedereinführung in JavaScript +slug: Web/JavaScript/Eine_Wiedereinfuehrung_in_JavaScript +tags: + - Anleitung + - CodingScripting + - Einleitung + - Guide + - Intermediate + - JavaScript + - Lernen +translation_of: Web/JavaScript/A_re-introduction_to_JavaScript +--- +
{{jsSidebar}}
+ +

Warum eine "Wieder" - Einführung? Weil {{Glossary("JavaScript")}} als die am meisten missverstandene Programmiersprache der Welt bekannt ist. Obwohl die Sprache oft als Spielzeug abgewertet wird, besitzt sie neben ihrer Einfachheit einige mächtige Sprachfunktionen. Heutzutage wird JavaScript in einer Großzahl von wichtigen Anwendungen verwendet, was zeigt, dass Wissen über diese Technologie eine wichtige Eigenschaft für jeden Web- und Mobil-Entwickler ist.

+ +

Es ist sinnvoll mit einem Überblick über die Sprachgeschichte zu beginnen. JavaScript wurde im Jahr 1995 von Brendan Eich entworfen, der Ingenieur bei Netscape war. JavaScript wurde erstmals 1996 mit Netscape 2 veröffentlicht. Ursprünglich hieß die Sprache LiveScript, wurde aber wegen unglücklichen Marketingentscheidung umbenannt, die sich die Popularität der Java-Sprache von Sun Microsystem zunutze machen wollte - obwohl beide wenig gemeinsam hatten. Dies ist seither eine Quelle für Verwirrung.

+ +

Einige Monate später veröffentlichte Microsoft JScript mit dem Internet Explorer 3. Diese war eine weitgehend zu JavaScript kompatibele Sprache. Einige Monate später übergab Netscape JavaScript an Ecma International, einer Europäischen Standardisierungsorganisation, welche noch im selben Jahr die ersten Edition des {{Glossary("ECMAScript")}} Standards veröffentlichten. Der Standard bekam 1999 ein bedeutendes Update mit ECMAScript Edition 3 und hält sich seither sehr stabil. Die vierte Edition des Standards wurde aufgrund von politischen Meinungsverschiedenheiten zur Komplexität der Sprache fallen gelassen. Viele Teile der vieren Edition bildeten die Basis der fünften und sechsten Edition des Standards, welche im Dezember 2009 bzw. im Juni 2015 veröffentlicht wurden.

+ +
+

Aus Gründen der Vertrautheit verwenden wir ab hier die Bezeichnung "JavaScript" anstatt "ECMAScript".

+
+ +

Anders als viele andere Programmiersprachen, gibt es bei JavaScript kein Konzept für Eingabe und Ausgabe. JavaScript wurde als Skriptsprache in eine Hostumgebung entworfen und es ist die Aufgabe dieser Umgebung Mechanismen für die Kommunikation mit der Außenwelt bereitzustellen. Die hierfür am meisten genutzte Hostumgebung ist der Browser, jedoch findet man Interpreter auch in vielen anderen Anwendungen, zum Beispiel Adobe Acrobat, Photoshop, SVG Bilder, Yahoo! Widget Umgebung, serverseitigen Applikationen wie node.js, NoSQL-Datenbanken wie die Open Source-Datenbank Apache CouchDB, integrierte Computer, Desktopumgebungen wie GNOME (eine der beliebtesten Desktopumgebungen für GNU/Linux Betriebssysteme) und vielen mehr.

+ +

Überblick

+ +

JavaScript ist eine dynamische Multi-Paradigmen-Sprache mit Typen und Operatoren, Standardobjekten und Methoden. Die Syntax basiert auf den Sprachen Java und C — viele Strukturen aus diesen Sprachen wurden in JavaScript übernommen. JavaScript unterstützt Objektorientierung mit Prototypobjekten statt Klassen (mehr darüber in Vererbung mit Prototypen und ES2015 Klassen). JavaScript unterstützt auch funktionale Programmierung — Funktionen sind Objekte, die Funktionen ermöglichen, ausführbaren Code zu speichern und wie jedes andere Objekt weitergegeben zu werden.

+ +

Beginnen wir mit einer Betrachtung der Sprachbausteine. JavaScript Programme manipulieren Werte und jeder Wert ist von einem bestimmten Typ. JavaScript Typen sind:

+ + + +

... und {{jsxref("undefined")}} und {{jsxref("null")}}, die ein wenig speziell sind. Und {{jsxref("Array")}} , die eine besonere Art von Objekt ist. Und {{jsxref("Date")}} und {{jsxref("RegExp")}}, welche man quasi mitgeliefert bekommt. Wenn man genau sein will, sind Funktionen ebenfalls eine spezielle Art von Objekten. Also sieht das Typdiagramm eher so aus:

+ + + +

Zusätzlich gibt es noch einige vordefinierte {{jsxref("Error")}} Typen. Der Einfachheit halber beschränken wir uns im Folgenden erst einmal auf die Typen aus dem ersten Diagramm.

+ +

Numbers

+ +

Numbers sind in JavaScript laut der Spezifikation "doppeltpräzise 64-bit Werte im IEEE 754 Format". Das hat einige interessante Konsequenzen. Es gibt in JavaScript nichts vergleichbares wie Integer, weshalb man vorsichtig mit Arithmetik umgehen muss, wenn man Mathematik wie in C oder Java nutzt.

+ +

Achte auch auf Dinge wie:

+ +
0.1 + 0.2 == 0.30000000000000004
+ +

In der Praxis werden Integer-Werte wie 32-Bit-Integer behandelt und einige Implementierungen speichern sie sogar so, bis sie einen Befehl ausführen sollen, der für eine Number, aber nicht für eine 32-Bit Integer gültig ist. Das kann z.B. für Bitoperationen wichtig sein.

+ +

Unterstützt werden die arithmetischen Standardoperationen, inklusive Addition, Subtraktion, Modulo (oder Rest) Arithmetik und so weiter. Außerdem existiert noch ein Objekt Math für die Anwendung von mathematischen Funktionen und Konstanten, welches oben noch nicht genannt wurde:

+ +
Math.sin(3.5);
+var umfang = 2 * Math.PI * r;
+ +

Man kann Strings mit der eingebauten {{jsxref("Global_Objects/parseInt", "parseInt()")}} Funktion nach Integer konvertieren. Die Funktion enthält die Basis des Zahlensystems für die Konvertierung als zweiten optionalen Parameter, welcher immer angegeben werden sollte:

+ +
parseInt("123", 10); // 123
+parseInt("010", 10); // 10
+
+ +

In älteren Browsern werden Strings, die mit "0" anfangen als Oktalzahlen (Basis 8) interpretiert, seit 2013 ist das aber nicht mehr so. Wenn man sich bei dem Stringformat nicht sicher ist, kann das in den älteren Browsern zu überraschenden Ergebnissen führen:

+ +
parseInt("010");  //  8
+parseInt("0x10"); // 16
+ +

Hier sieht man, dass die {{jsxref("Global_Objects/parseInt", "parseInt()")}} Funktion den ersten String als Oktalzahl, wegen der führenden 0, und den zweiten String als Hexadezimalzahl, wegen des führenden "0x", interpretiert. Die Hexadezimalnotation ist immernoch zulässig; nur die Oktalnotation wurde entfernt, weil sie praktisch nicht mehr verwendet wird.

+ +

Um eine Binärzahl in ein Integer zu ändern, verwendet man einfach die Basis 2:

+ +
parseInt("11", 2); // 3
+ +

Auf die gleiche Weise lassen sich auch Gleitkommazahlen mit Hilfe der Funktion {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} konvertieren. Anders als bei der {{jsxref("Global_Objects/parseInt", "parseInt()")}} Funktion nutzt parseFloat() immer die Basis 10.

+ +

Auch der unäre + Operator kann eingesetzt werden, um zu einer Zahl zu konvertieren:

+ +
+ "42";   // 42
++ "010";  // 10
++ "0x10"; // 16
+ +

Ein spezieller Wert mit der Bezeichnung {{jsxref("NaN")}} (für "Not a Number") wird zurückgegeben, wenn der String keinen numerischen Wert enthält:

+ +
parseInt("hello", 10); // NaN
+ +

NaN ist gefährlich: Wenn es als Operand in eine mathematische Operation benutzt wird, wird das Ergebnis ebenfalls NaN sein;

+ +
NaN + 5; // NaN
+ +

Mit der eingebauten  {{jsxref("Global_Objects/isNaN", "isNaN()")}} Funktion kann man auf NaN testen:

+ +
isNaN(NaN); // true
+ +

JavaScript kennt außerdem die speziellen Werte {{jsxref("Infinity")}} und -Infinity:

+ +
 1 / 0; //  Infinity
+-1 / 0; // -Infinity
+ +

Man kann auf Infinity, -Infinity und NaN Werte mit der eingebauten Funktion {{jsxref("Global_Objects/isFinite", "isFinite()")}} testen:

+ +
isFinite(1 / 0);     // false
+isFinite(-Infinity); // false
+isFinite(NaN);       // false
+ +
+

Die {{jsxref("Global_Objects/parseInt", "parseInt()")}} und {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} Funktionen lesen einen String, bis ein Zeichen erreicht wird, welches für das Zahlensystem unzulässig ist und geben die Zahl bis zu dieser Stelle zurück. Der unäre + Operator konvertiert den String einfach zu NaN, wenn dieser ein unerlaubtes Zeichen enthält. Probiere mal aus, den String "10.2abc" mit jeder der Methoden in der Console zu konvertieren, um die Unterschiede besser zu verstehen.

+
+ +

Strings

+ +

Strings sind in JavaScript eine Folge von Unicode-Zeichen. Das sollte für alle erfreulich sein, die mit Internationalisierung arbeiten. Genauer gesagt sind Strings Folgen von UTF-16 Codeeinheit; jeder Codeeinheit ist durch eine 16-Bit Zahl repräsentiert. Jedes Unicode-Zeichen besteht aus 1 oder 2 Codeeinheiten.

+ +

Für ein einzelnes Zeichen, verwendet man einfach einen String mit einem Zeichen.

+ +

Um die Länge eines Strings (in Codeeinheiten) herauszufinden, nutzt man die length Eigenschaft:

+ +
'hello'.length; // 5
+ +

Da ist die erster Begegnung mit JavaScript Objekten! Haben wir schon erwähnt, dass man auch Strings wie {{jsxref("Object", "Objekte", "", 1)}} verwenden kann? Sie haben auch {{jsxref("String", "Methoden", "#Methoden", 1)}}, um den Strings zu verändern und Informationen zu erhalten.

+ +
'hello'.charAt(0); // "h"
+'hello, world'.replace('hello', 'goodbye'); // "goodbye, world"
+'hello'.toUpperCase(); // "HELLO"
+ +

Andere Datentypen

+ +

JavaScript unterscheidet zwischen {{jsxref("null")}}, wobei es sich um einen Wert handelt, der einen "nicht Wert" repräsentiert (und nur über das null Schlüsselwort erreichbar ist) und {{jsxref("undefined")}}, wobei es sich um einen Wert vom Typ undefined handelt, welcher für einen nicht initialisierten Wert steht - also, dass noch kein Wert zugewiesen wurde. Variablen werden später besprochen, aber in JavaScript ist es möglich Variablen zu deklarieren, ohne ihnen eine Wert zuzuweisen. Wenn das gemacht wird ist die Variable vom Typ undefined. undefined ist sogar eine Konstante.

+ +

JavaScript hat einen Boolean Typ mit den möglichen Werten true und false (beide sind Schlüsselwörter). Jeder Wert kann mit den folgenden Regeln zu einem Boolean konvertiert werden:

+ +
    +
  1. false, 0, leere Strings (""), NaN, null, und undefined werden false.
  2. +
  3. Alle anderen Werte werden true.
  4. +
+ +

Die Konvertierung kann explizit mit der Boolean() Funktion durchgeführt werden:

+ +
Boolean('');  // false
+Boolean(234); // true
+ +

Das ist jedoch kaum nötig, da JavaScript die Konvertierung automatisch vornimmt, wenn ein Boolean erwartet wird, wie z.B. bei einer if-Anweisung (siehe unten). Aus diesem Grund ist oft von "true Werten" und "false Werten" die Rede, womit Werte gemeint sind, die zu true oder false werden, nachdem sie zu einem Boolean konvertiert wurden. Alternativ können diese Werte auch "truthy" und "falsy" genannt werden.

+ +

Boolesche Operationen wie beispielsweise && (logisches und), || (logisches oder) und ! (logisches nicht) werden ebenfalls unterstützt (siehe unten).

+ +

Variablen

+ +

Neue Variablen werden in JavaScript mit einem der drei Schlüsselwort let, const oder var deklariert.

+ +

let erlaubt es Variablen auf Blockebene zu deklarieren. Die deklarierte Variable ist in dem Block gültig, von dem sie umschlossen wird.

+ +
let a;
+let name = "Simon";
+ +

Im folgenden ist ein Beispiel für den Gültigkeitsbereich einer mit let deklarierten Variablen:

+ +
// myLetVariable ist hier *nicht* sichtbar
+
+for (let myLetVariable = 0; myLetVariable < 5; myLetVariable++) {
+  // myLetVariable ist nur hier sichtbar
+}
+
+// myLetVariable ist hier *nicht* sichtbar
+
+ +

const erlaubt es Variablen zu deklarieren, dessen Wert nie wieder geändert wird. Die Variable ist in dem Block sichtbar, von dem sie umschlossen wird.

+ +
const Pi = 3.14;  // Variable Pi wird initialisiert
+Pi = 1;  // Führt zu einem Fehler, weil konstante (const) Variablen nicht geändert werden können.
+
+ +

var ist das gebräuchlichste deklarative Schlüsselwort. Es hat nicht die Restriktionen, die die anderen beiden Schlüsselwörter haben. Das liegt daran, dass das traditionell der einzige Weg war, um eine Variable in JavaScript zu deklarieren. Eine Variable, die mit dem var Schlüsselwort definiert wird, ist in der Funktion, in der sie deklariert wird, erreichbar.

+ +
var a;
+var name = 'Simon';
+ +

Im folgenden ist ein Beispiel für den Gültigkeitsbereich einer mit var deklarierten Variablen:

+ +
// myVarVariable *ist* hier sichtbar
+
+for (var myVarVariable = 0; myVarVariable < 5; myVarVariable++) {
+// myVarVariable ist in der ganzen Funktion sichtbar
+}
+
+// myVarVariable *ist* hier sichtbar
+ +

Deklariert man eine Variable, ohne ihr einen Wert zuzuweisen, ist ihr Typ undefined.

+ +

Ein sehr wichtiger Unterschied zu anderen Programmiersprachen wie Java besteht darin, dass bei JavaScript keine Blöckegültigkeitsbereiche hat, sondern nur Funktionsgültigkeitsbereiche. Wird eine Variable mit dem var Schlüsselwort in einer zusammengesetzten Statement (z.B. if-Anweisung) definiert, so ist diese Variable innerhalb der ganzen Funktion sichtbar. Jedoch ist es ab ECMAScript 2015 mit let und const Deklarationen möglich, Variablen mit Blocksichtbarkeitsbereich zu erstellen.

+ +

Operatoren

+ +

JavaScripts numerische Operatoren sind +, -, *, / und % welches der Divisionsrestoperator ist (nicht dasselbe wie Modulo). Werte werden mit = zugewiesen und es gibt zusammengesetzte Zuweisungsstatement wie += und -=. Diese werden als x = x Operator y interpretiert.

+ +
x += 5
+x = x + 5
+ +

Zum Inkrementieren und Dekrementieren kann ++ und -- verwendet werden. Diese können als Prefix oder Postfix Operatoren benutzt werden.

+ +

Mit dem + Operator ist es auch möglich, Strings zu verbinden:

+ +
'hello' + ' world'; // "hello world"
+ +

Addiert man einen String mit einer Zahl (oder einem anderen Wert), wird alles zuerst zu einem String konvertiert. Dies bereitet manchmal Probleme:

+ +
"3" + 4 + 5;  // "345"
+3 + 4 + "5"; // "75"
+ +

Das Addieren eines leeren Strings zu einem Wert ist eine hilfreiche Methode, den Wert in einen String zu konvertieren.

+ +

Vergleiche können in JavaScript mit <, >, <= und >= durchgeführt werden. Dieses funktionieren bei Strings und Zahlen. Gleichheit ist etwas komplizierter. Der Doppelgleichoperator hat einen Typzwang, was zu überraschend Ergebnissen führen kann:

+ +
123 == "123"; // true
+1 == true;    // true
+ +

Um den Typzwang zu vermeiden, benutzt man den Dreifachgleichoperator:

+ +
123 === "123"; // false
+1 === true;    // false
+ +

Des Weiteren gibt es die Operatoren != und !== für das Testen auf Ungleichheit.

+ +

Außerdem gibt es in JavaScript noch bitweise Operationen.

+ +

Kontrollstrukturen

+ +

JavaScript hat eine ähnliche Menge an Kontrollstrukturen wie andere Sprachen aus der C Familie. Bedingte Statements sind durch if und else unterstützt; man kann sie auch verketten:

+ +
var name = 'kittens';
+if (name == 'puppies') {
+  name += ' woof';
+} else if (name == 'kittens') {
+  name += ' neow';
+} else {
+  name += '!';
+}
+name == 'kittens neow';
+
+ +

JavaScript hat while- und do-while-Schleifen. Die erste ist gut für normale Schleifen. Die zweite ist für Schleifen geeignet, bei denen sichergestellt werden soll, dass der Schleifeninhalt mindestens einmal ausgeführt wird:

+ +
while (true) {
+  // Endlosschleife!
+}
+
+var input;
+do {
+  input = get_input();
+} while (inputIsNotValid(input))
+
+ +

JavaScripts for-Schleife ist die selbe wie in C und Java: Die Kontrollinformationen können in einer einzigen Zeile angegeben werden.

+ +
for (var i = 0; i < 5; i++) {
+  // Wird 5-Mal ausgeführt
+}
+
+ +

JavaScript hat zudem zwei weitere bekannte for Schleifen: for...of

+ +
for (let value of array) {
+  // Tue etwas mit value
+}
+ +

und for...in:

+ +
for (let property in object) {
+  // Tue etwas mit dem objects property
+}
+ +

Die Operatoren && und || benutzen Kurzschlusslogik, was bedeutet, dass die Ausführung des zweiten Operanden abhängig von dem ersten ist. Dieses ist nützlich für die Überprüfung auf null, bevor auf Objektattribute zugegriffen wird:

+ +
var name = o && o.getName();
+
+ +

Oder für das Abfangen von Werten (wenn falsy Werte nicht valide sind):

+ +
var name = cachedName || (cachedName = getName());
+
+ +

JavaScript besitzt einen ternären Operator für bedingte Ausdrücke:

+ +
var allowed = (age > 18) ? 'yes' : 'no';
+
+ +

Das switch Statement kann führ mehrere Zweige abhängig von einer Zahl oder einem String eingesetzt werden:

+ +
switch(action) {
+    case 'draw':
+        drawIt();
+        break;
+    case 'eat':
+        eatIt();
+        break;
+    default:
+        doNothing();
+}
+
+ +

Lässt man das break Statement weg, werden auch der folgezweig ausgeführt. Dieses Verhalten ist selten gewollt — es lohnt sich in solchen Fällen explizite Kommentare hinzuzufügen, um späteres Debugging zu unterstützen:

+ +
switch(a) {
+    case 1: // fallthrough
+    case 2:
+        eatit();
+        break;
+    default:
+        donothing();
+}
+
+ +

Die default Klausel ist optional. Wenn gewünscht, können Ausdrücke im switch und im case eingesetzt werden. Der Vergleiche zwischen beiden wird mit dem === Operator durchgeführt:

+ +
switch(1 + 3) {
+    case 2 + 2:
+        yay();
+        break;
+    default:
+        neverhappens();
+}
+
+ +

Objekte

+ +

JavaScript Objekte setzen sich aus einfachen Name-Wert-Paaren zusammen. Sie sind ähnlich wie:

+ + + +

Der Fakt, dass diese Datenstruktur so oft eingesetzt wird, zeigt seine Vielseitigkeit. Da alles (reine Kerntypen) in JavaScript ein Objekt ist, beinhaltet jedes JavaScript-Programm natürlich eine große Menge von Suchoperationen in Hashtabellen. Gut, dass diese so schnell sind!

+ +

Der "Name"-Teil ist ein JavaScript String, während als Wert jeder JavaScript Wert in Frage kommt — auch andere Objekte. Dies ermöglicht das Erstellen von beliebig komplexen Datenstrukturen.

+ +

Es gibt zwei grundlegende Möglichkeiten, ein leeres Objekt zu erstellen:

+ +
var obj = new Object();
+
+ +

Und:

+ +
var obj = {};
+
+ +

Beide sind semantisch äquivalent. Die zweite wird "Objektliteral Syntax" genannt und ist verbreiteter. Diese Syntax ist zudem der Kern des JSON Formates und sollte immer bevorzugt genutzt werden.

+ +

"Objektliteral Syntax" kann eingesetzt werden, um ein umfassendes Objekt zu erstellen:

+ +
var obj = {
+    name: "Carrot",
+    "for": "Max",
+    details: {
+        color: "orange",
+        size: 12
+    }
+}
+
+ +

Der Zugriff auf Eigenschaften kann verkettet werden:

+ +
obj.details.color; // orange
+obj["details"]["size"]; // 12
+ +

Das folgende Beispiel erstellt einen Prototyp Person und eine Instanz dieses Prototyps you.

+ +
function Person(name, age) {
+  this.name = name;
+  this.age = age;
+}
+
+// Definiere ein Objekt
+var you = new Person('You', 24);
+// Wir erstellen eine Person mit dem Namen "You" und dem Alter 24
+ +

Nach der Erstellung kann eine Objekteigenschaft über einem von zwei möglichen Wegen erreicht werden:

+ +
obj.name = "Simon";
+var name = obj.name;
+
+ +

Und...

+ +
// Klammernotation
+obj['name'] = 'Simon';
+var name = obj['name'];
+// man kann eine Variable benutzen, um einen Schlüssel zu definieren
+var user = prompt('was ist dein Schlüssel?');
+obj[user] = prompt('was ist dein Schlüssel?');
+
+ +

Beide sind wieder semantisch äquivalent. Die zweite Methode hat den Vorteil, dass der Name der Eigenschaft als String zur Verfügung gestellt wird, was bedeutet, dass dieser zur Laufzeit berechnet werden kann. Jedoch verhindert diese Methode, dass einige JavaScript-Engines "Minifier Optimierungen" durchführen können. Sie kann außerdem eingesetzt werden, um Eigenschaften zu erreichen, die ein reservierte Schlüsselwörter als Namen haben:

+ +
obj.for = "Simon"; // Syntaxfehler, da 'for' ein reserviertes Schlüsselwort ist
+obj["for"] = "Simon"; // funktioniert
+
+ +
+

Ab ECMAScript 5 können reservierte Wörter bei Objektliteralen verwendet werden. Das bedeutet, dass keine Anführungszeichen und eckige Klammern mehr nötig sind. Siehe ES5 Spec.

+
+ +

Weitere Informationen zu Objekten und Prototypen gibt es im Artikel Object.prototype. Für eine Erklärung von Objektprototypen und die Objektprototypenkette siehe in den Artikel Vererbung und die Prototypenkette.

+ +
+

Ab ECMAScript 2015 können Schlüssel mit Variablen definiert werden, indem eckige Klammern verwendet werden. {[phoneType]: 12345} ist möglich, statt var userPhone = {}; userPhone[phoneType] = 12345 zu verwenden.

+
+ +

Arrays

+ +

Arrays sind in JavaScript ein spezieller Typ von Objekten. Sie funktionieren weitgehend wie normale Objekte (numerische Eigenschaften können nur über die []-Syntax erreicht werden), besitzen jedoch eine zusätzliche Eigenschaft length. Der Wert dieser Eigenschaft ist immer der höchsten Index des Arrays + 1.

+ +

Eine Möglichkeit ein Array zu erstellen ist die folgende:

+ +
var a = new Array();
+a[0] = 'dog';
+a[1] = 'cat';
+a[2] = 'hen';
+a.length; // 3
+ +

Eine praktischere Möglichkeit  ist die Erstellung über ein Array-Literal.

+ +
var a = ['dog', 'cat', 'hen'];
+a.length; // 3
+ +

Zu beachten ist, dass array.length nicht unbedingt der Anzahl der Elemente des Arrays entspricht. Siehe das folgende Beispiel:

+ +
var a = ['dog', 'cat', 'hen'];
+a[100] = 'fox';
+a.length; // 101
+ +

Zur Erinnerung: Der Wert von length entspricht immer dem höchsten Index + 1.

+ +

Versucht man auf einen nicht-existenten Array-Index zuzugreifen, erhält man undefined:

+ +
typeof a[90]; // undefined
+ +

Wenn Sie die obigen Angaben über [] und Länge (array.length) berücksichtigen, können Sie über ein Array iterieren, indem Sie die folgende for-Schleife verwenden:

+ +
for (var i = 0; i < a.length; i++) {
+    // Verarbeitung von a[i]
+}
+
+ +

ECMAScript (ES2015) empfiehlt die wesentlich kürzer gefasste for...of-Schleife, um über Objekte und Arrays zu iterieren:

+ +
for (const currentValue of a) {
+  // Tue etwas mit currentValue
+}
+ +

Man kann auch mit einer for...in Schleife über ein Array iterieren, wobei diese nicht über die Arrayelemente, sondern die Arrayindizes iteriert. Zudem wird bei einer solchen Schleife auch über Eigenschaften iteriert, die evtl. später in Array.prototype hinzugefügt werden. Deshalb wird diese Methode für Arrays nicht empfohlen.

+ +

In ECMAScript (ES2015) wurde mit forEach() eine weitere Schleife zur Iteration über Arrays eingeführt:

+ +
['dog', 'cat', 'hen'].forEach(function(currentValue, index, array) {
+  // Verarbeite currentValue oder array[index]
+});
+ +

Das Anhängen eines neuen Elements zu einem Array funktioniert folgendermaßen:

+ +
a.push(item);
+ +

Arrays besitzen viele Methoden. Hier findet man die Dokumentation für alle Array Methoden.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodennameBeschreibung
a.toString()Gibt einen String zurück, bei dem toString() jedes Objektes getrennt mit Komma ist.
a.toLocaleString()Gibt einen String zurück, bei dem toLocaleString() jedes Objektes getrennt mit Komma ist.
a.concat(item1[, item2[, ...[, itemN]]])Erstellt eine Kopie mit den neu hinzugefügten Elemente.
a.join(sep)Wandelt das Array in einen String um. Die Elemente werden durch sep getrennt.
a.pop()Entfernt das letzte Element und gibt es zurück.
a.push(item1, ..., itemN)Fügt ein oder mehrere Elemente am Ende hinzu.
a.reverse()Kehrt die Reihenfolge des Arrays um.
a.shift()Entfernt das erste Element und gibt es zurück.
a.slice(start, end)Gibt einen Teil eines Arrays zurück.
a.sort([cmpfn])Sortiert das Array. Ein Vergleichsfunktion kann optional angegeben werden.
a.splice(start, delcount[, item1[, ...[, itemN]]])Modifiziert ein Array, indem ein Teil gelöscht und durch mehrere Elemente ersetzt wird.
a.unshift(item1[, item2[, ...[, itemN]]])Fügt Elemente am Anfang des Arrays hinzu.
+ +

Funktionen

+ +

Neben Objekten gehören Funktionen zu den Kernkomponenten von JavaScript. Die Syntax für eine einfache Funktion könnte kaum einfacher sein:

+ +
function add(x, y) {
+    var total = x + y;
+    return total;
+}
+
+ +

Das Beispiel demonstriert eine einfache Funktion. Einer JavaScript-Funktion können 0 oder mehr benannte Parameter übergeben werden. Der Funktionsrumpf kann beliebig viele Anweisungen enthalten und kann seine eigene lokalen Variablen definieren, die nur in der Funktion erreichbar sind. Das return Statement kann dazu benutzt werden, um jederzeit einen Rückgabewert festzulegen und die Funktion zu beenden. Wird kein return-Statement angegeben (oder ein leeres return-Statement ohne Wert), gibt JavaScript undefined zurück.

+ +

Die benannten Parameter sind eher als Richtlinie zu verstehen, weniger als eine Pflichtangabe. Eine Funktion kann also auch ohne Angabe der Parameter aufgerufen werden, wobei die Parameter dann den Wert undefined bekommen.

+ +
add() //NaN
+// Addition mit undefined ist nicht möglich
+
+ +

Mann kann der Funktion auch mehr Parameter übergeben, als erwartet werden:

+ +
add(2, 3, 4) // 5
+// Addition der ersten beiden Parameter; 4 wird ignoriert
+
+ +

Auf den ersten Blick wirkt das komisch, jedoch haben Funktionen innerhalb des Funktionsrumpfes Zugriff auf eine zusätzliche Variable namens arguments, welche ein arrayähnliches Objekt ist, das alle der Funktion übergebenen Werte enthält. Hier eine überarbeitete add-Funktion, die beliebig viele Parameter verarbeitet:

+ +
function add() {
+    var sum = 0;
+    for (var i = 0, j = arguments.length; i < j; i++) {
+        sum += arguments[i];
+    }
+    return sum;
+}
+
+add(2, 3, 4, 5); // 14
+
+ +

Das ist jedoch nicht nützlicher als 2 + 3 + 4 + 5 zu schreiben. Deswegen erstellen wir eine Funktion, welche den Durchschnitt aller Werte in unserem Array berechnet:

+ +
function avg() {
+  var sum = 0;
+  for (var i = 0, j = arguments.length; i < j; i++) {
+    sum += arguments[i];
+  }
+  return sum / arguments.length;
+}
+
+avg(2, 3, 4, 5); // 3.5
+ +

Das ist wirklich nützlich, jedoch wirkt es noch ein bisschen lang. Um den Code ein wenig zu reduzieren, kann man den Einsatz des arguments-Arrays durch eine Rest Parameter Syntax ersetzen. Damit können beliebig viele Argumente übergeben werden und der Code bleibt minimal. Der Rest Parameter Operator wird in der Funktionsparameterliste mit dem Format ...variable geschrieben und enthält alle nicht benannten, der Funktion übergebenen Argumente in der Variable. Zudem kann man die for-Schleife durch eine for...of-Schleife ersetzen, um die Werte in der Variablen direkt verwenden zu können.

+ +
function avg(...args) {
+  var sum = 0;
+  for (let value of args) {
+    sum += value;
+  }
+  return sum / args.length;
+}
+
+avg(2, 3, 4, 5); // 3.5
+ +
+

Die Variable args in der oberen Funktion enthält alle an die Funktion übergebenen Werte.

+ +

Es ist wichtig zu beachten, dass der Einsatz des Rest Parameter Operators in einer Funktionsdeklaration alle Argumente nach der Deklaration enthält, jedoch nicht die davor. Z. B. wird bei function avg(firstValue, ...args) der erste der Funktion übergebene Wert in der Variable firstValue gespeichert und alle folgenden Werte werden in der Variable args gespeichert. Das ist eine sehr nützliche Sprachfunktion, die jedoch ein neues Problem aufwirft. Die Funktion avg() nimmt eine mit Kommata getrennte Liste von Argumenten entgegen — was ist jedoch, wenn man den Durchschnitt eines Arrays haben möchte? Man kann die Funktion folgendermaßen umschreiben:

+
+ +
function avgArray(arr) {
+  var sum = 0;
+  for (var i = 0, j =  arr.length; i < j; i++) {
+    sum += arr[i];
+  }
+  return sum / arr.length;
+}
+
+avgArray([2, 3, 4, 5]); // 3.5
+ +

Es wäre jedoch schöner, wenn man die erste Funktion wiederverwenden könnten. Glücklicherweise ist es bei JavaScript möglich, eine Funktion mit einem Array von Argumenten aufzurufen, indem man die Methode apply() benutzt, die alle Function-Objekte besitzen:

+ +
avg.apply(null, [2, 3, 4, 5]); // 3.5
+ +

Das zweite Argument der apply()-Funktion ist das Array mit den Argumenten; das erste Argument wird später bzw. weiter unten näher erklärt. Das betont noch einmal die Tatsache, dass Funktionen auch Objekte sind.

+ +
+

Man kann das gleiche Ergebnis mit dem Einsatz des Spread operator im Funktionsaufruf erreichen.

+ +

Zum Beispiel: avg(...numbers);

+
+ +

JavaScript erlaubt es, anonyme Funktionen zu erstellen:

+ +
var avg = function() {
+    var sum = 0;
+    for (var i = 0, j = arguments.length; i < j; i++) {
+        sum += arguments[i];
+    }
+    return sum / arguments.length;
+}
+
+ +

Die Semantik ist äquivalent zu function avg() Form. Es ist extrem mächtig, weil es erlaubt, an bestimmten Stellen vollständige Funktionsdefinition zu schreiben, wo normalerweise ein Ausdruck verwendet wird. Das ermöglicht allerlei klevere Tricks. Hier eine Möglichkeit, eine Variable zu verbergen — wie Variablen mit Blocksichtbarkeit in C:

+ +
var a = 1;
+var b = 2;
+
+(function() {
+  var b = 3;
+  a += b;
+})();
+
+a; // 4
+b; // 2
+ +

JavaScript erlaubt den rekursiven Aufruf von Funktionen. Das ist praktisch beim Verarbeiten von Baumstrukturen, wie es beim Browser-DOM der Fall ist.

+ +
function countChars(elm) {
+    if (elm.nodeType == 3) { // TEXT_NODE
+        return elm.nodeValue.length;
+    }
+    var count = 0;
+    for (var i = 0, child; child = elm.childNodes[i]; i++) {
+        count += countChars(child);
+    }
+    return count;
+}
+
+ +

Das hebt ein potentielles Problem mit anonymen Funktionen hervor: Wie ruft man sie rekursiv auf, wenn sie keinen Namen haben? JavaScript erlaubt hierfür die Benennung von Funktionsausdrücken. Man kann dazu benannte "IIFEs" (Immediately Invoked Function Expressions) wie unten beschrieben benutzen:

+ +
var charsInBody = (function counter(elm) {
+    if (elm.nodeType == 3) { // TEXT_NODE
+        return elm.nodeValue.length;
+    }
+    var count = 0;
+    for (var i = 0, child; child = elm.childNodes[i]; i++) {
+        count += counter(child);
+    }
+    return count;
+})(document.body);
+
+ +

Der angegebene Name im Funktionsausdruck ist nur innerhalb der selben Funktion verfügbar. Das erlaubt der JavaScript-Engine, den Code besser zu optimieren und fördert die Lesbarkeit des Codes. Der Name wird zudem im Debugger und einigen Stack Traces angezeigt, was beim Debuggen viel Zeit sparen kann.

+ +

Zu beachten ist auch hier wieder, dass JavaScript-Funktionen ebenfalls Objekte sind — wie alles andere in JavaScript. Und man kann Eigenschaften ändern und hinzufügen, wie es im oberen Abschnitt über Objekte bereits gezeigt wurde.

+ +

Benutzerdefinierte Objekte

+ +
Detaillierte Informationen zum objektorientiertem Programmieren in JavaScript finden Sie in der Einführung zu objektorientiertem Programmieren in JavaScript.
+ +

In klassischen objektorientierten Programmiersprachen sind Objekte Zusammenstellungen von Daten und Methoden, die mit den Daten arbeiten. JavaScript ist eine Prototypenbasierte Sprache, die anders als in Java oder C++ kein Klassen-Statement besitzt (was manchmal verwirrend für Programmierer ist, die bisher nur mit Sprachen mit Klassen-Statements gearbeitet haben). Stattdessen benutzt JavaScript Funktionen als Klassen. Angenommen es gibt ein Objekt person mit Feldern für Vor- und Nachnamen. Es gibt zwei Wege den Namen zu schreiben: als "Vorname Nachname" oder "Nachname, Vorname". Nutzt man die vorher beschriebenen Funktionen und Objekte, lässt sich dies z. B. so umsetzen:

+ +
function makePerson(first, last) {
+  return {
+    first: first,
+    last: last
+  };
+}
+function personFullName(person) {
+  return person.first + ' ' + person.last;
+}
+function personFullNameReversed(person) {
+  return person.last + ', ' + person.first;
+}
+
+s = makePerson("Simon", "Willison");
+personFullName(s); // "Simon Willison"
+personFullNameReversed(s); // "Willison, Simon"
+ +

Das funktioniert zwar, ist aber keine schöne Lösung. Man hat am Ende dutzende unnötiger Funktionen im globalen Namensraum. Was man braucht ist die Möglichkeit, eine Funktion an ein Objekt anzuhängen. Weil Funktionen Objekte sind, lässt sich dies einfach realisieren:

+ +
function makePerson(first, last) {
+  return {
+    first: first,
+    last: last,
+    fullName: function() {
+      return this.first + ' ' + this.last;
+    },
+    fullNameReversed: function() {
+      return this.last + ', ' + this.first;
+    }
+  };
+}
+
+s = makePerson("Simon", "Willison")
+s.fullName(); // "Simon Willison"
+s.fullNameReversed(); // "Willison, Simon"
+ +

Hier sehen Sie etwas, was vorher noch nicht eingesetzt wurde: Das this-Schlüsselwort. Wird es innerhalb einer Funktion benutzt, verweist this auf das aktuelle Objekt. Was das tatsächlich bedeutet, hängt davon ab, wie die Funktion aufgerufen wird. Wenn die Funktion mit der Punkt- oder Klammer-Notation auf einem Objekt aufgerufen wird, repräsentiert this dieses Objekt. Wird die Punkt-Notation nicht verwendet, dann verweist this auf das globale Objekt.

+ +

Zu beachten ist, dass this ein häufiger Grund für Fehler ist. Zum Beispiel:

+ +
s = makePerson("Simon", "Willison");
+var fullName = s.fullName;
+fullName(); // undefined undefined
+ +

Wenn fullName() alleine und ohne den Einsatz von s.fullName() aufgerufen wird, referenziert this das globale Objekt. Dort gibt es keine globalen Variablen first oder last, weshalb man als Rückgabewert undefined erhält.

+ +

Man kann Vorteile des this-Schlüsselwortes nutzen, um die makePerson-Funktion zu optimieren:

+ +
function Person(first, last) {
+    this.first = first;
+    this.last = last;
+    this.fullName = function() {
+        return this.first + ' ' + this.last;
+    }
+    this.fullNameReversed = function() {
+        return this.last + ', ' + this.first;
+    }
+}
+var s = new Person("Simon", "Willison");
+
+ +

Hier wird ein neues Schlüsselwort aufgeführt: new. new steht in starker Beziehung zu this. Es erstellt ein neues Objekt und ruft die nachstehende Funktion auf, wobei this dann das neue Objekt ist. Zu beachten ist, dass die Funktion keinen Wert zurückgibt, sondern das this-Objekt modifiziert. Das new gibt dann das this-Objekt an den Aufrufer zurück. Funktionen die für den Aufruf mit new konzipiert sind, nennt man Konstruktoren. Gängige Praxis ist es, diese Funktionen mit einem großen Anfangsbuchstaben zu versehen, um an den Einsatz von new zu erinnern.

+ +

Die nun optimiertere Funktion hat jedoch immernoch eine Fehlerquelle mit dem Aufruf von fullName().

+ +

Das person-Objekt wird besser, weist jedoch noch immer einige unangenehme Effekte auf: Bei jedem Erstellen eines person-Objekts werden zwei neue Funktionen erzeugt — wäre es nicht besser, wenn dieser Code wiederverwendet werden könnte?

+ +
function personFullName() {
+    return this.first + ' ' + this.last;
+}
+function personFullNameReversed() {
+    return this.last + ', ' + this.first;
+}
+function Person(first, last) {
+    this.first = first;
+    this.last = last;
+    this.fullName = personFullName;
+    this.fullNameReversed = personFullNameReversed;
+}
+
+
+ +

Das ist besser: Man erstellt die Methodenfunktionen nur einmal und referenziert zu diesen im Konstruktor. Geht das noch besser? Die Antwort ist auch hier wieder ja:

+ +
function Person(first, last) {
+  this.first = first;
+  this.last = last;
+}
+Person.prototype.fullName = function() {
+  return this.first + ' ' + this.last;
+}
+Person.prototype.fullNameReversed = function() {
+  return this.last + ', ' + this.first;
+}
+ +

Person.prototype ist ein Objekt, das sich alle Person-Instanzen teilen. Dies ist ein Teil einer Prototypen-Suchkette (mit dem speziellen Namen Prototypenkette (prototype chain)): Bei jedem Versuch, auf eine Eigenschaft von Person zuzugreifen, die nicht gesetzt ist, prüft JavaScript ob diese Eigenschaft stattdessen in Person.prototype vorhanden ist. Als Ergebnis wird alles in Person.prototype für alle Instanzen eines Konstruktors über this verfügbar.

+ +

Das ist ein unglaublich mächtiges Werkzeug. JavaScript erlaubt es Prototypen irgendwo innerhalb des Programmes zu verändern, was bedeutet, dass man Methoden zur Laufzeit zu existierenden Objekten hinzufügen kann:

+ +
s = new Person("Simon", "Willison");
+s.firstNameCaps(); // TypeError on line 1: s.firstNameCaps is not a function
+
+Person.prototype.firstNameCaps = function firstNameCaps() {
+  return this.first.toUpperCase()
+};
+s.firstNameCaps(); // "SIMON"
+ +

Interessanterweise können auch neue Eigenschaften zu Prototypen von JavaScript-Objekten hinzugefügt werden. So kann z. B. dem String-Objekt eine neue Methode hinzugefügt werden, welche den String in umgekehrter Reihenfolge zurückgibt:

+ +
var s = "Simon";
+s.reversed(); // TypeError on line 1: s.reversed is not a function
+
+String.prototype.reversed = function reversed() {
+  var r = "";
+  for (var i = this.length - 1; i >= 0; i--) {
+    r += this[i];
+  }
+  return r;
+};
+
+s.reversed(); // nomiS
+ +

Die neue Methode funktioniert sogar mit String-Literalen!

+ +
"This can now be reversed".reversed(); // desrever eb won nac sihT
+ +

Wie schon vorher erwähnt, ist der Prototyp ein Teil einer Kette. Der Anfang dieser Kette ist Object.prototype, welcher die Methode toString() enthält — das ist die Methode die aufgerufen wird, wenn ein Objekt als String repräsentiert werden soll. Das ist für das Debuggen des Person-Objekts nützlich:

+ +
var s = new Person("Simon", "Willison");
+s; // [object Object]
+
+Person.prototype.toString = function() {
+  return '<Person: ' + this.fullName() + '>';
+};
+
+s.toString(); // "<Person: Simon Willison>"
+ +

Erinnern Sie sich an die Stelle weiter oben, als avg.apply() als erstes Argument null übergeben bekommen hat? Diese Stelle können wir uns zur genaueren Betrachtung wieder heranziehen. Mit diesem ersten übergebenen Argument von apply() wird das Objekt festgelegt, welches this repräsentiert. Hier ist z. B. eine einfache Implementierung von new:

+ +
function trivialNew(constructor, ...args) {
+  var o = {}; // Create an object
+  constructor.apply(o, args);
+  return o;
+}
+ +

Das ist keine exakte Replikation von new, weil die Prototypenkette nicht angelegt wird (es wäre schwer, hier vollständig darzustellen). Das ist nichts, was man häufig benötigt, jedoch ist es nützlich darüber Bescheid zu wissen. In diesem Codeteil nennt man ...args (mit den Punkten) das sogenannte Restargument — wie der Name impliziert, enthält dieser alle restlichen Argumente.

+ +

Der Aufruf von

+ +
var bill = trivialNew(Person, "William", "Orange");
+ +

ist somit fast äquivalent zu

+ +
var bill = new Person("William", "Orange");
+ +

apply() hat eine Schwesterfunktion namens call, die ebenfalls das Setzen von this erlaubt, jedoch statt eines Arrays nimmt sie eine erweiterte Liste mit Argumenten entgegen.

+ +
function lastNameCaps() {
+  return this.last.toUpperCase();
+}
+var s = new Person("Simon", "Willison");
+lastNameCaps.call(s);
+// Das gleiche wie:
+s.lastNameCaps = lastNameCaps;
+s.lastNameCaps();
+ +

Innere Funktionen

+ +

Funktionsdeklarationen sind in JavaScript auch innerhalb von Funktionen erlaubt. Das lies sich bei der weiter oben verwendeten makePerson()-Funktion schon erkennen. Ein wichtige Eigenschaft von verschachtelten Funktionen in JavaScript ist der Zugriff auf Variablen aus der Elternfunktion:

+ +
function betterExampleNeeded() {
+    var a = 1;
+    function oneMoreThanA() {
+        return a + 1;
+    }
+    return oneMoreThanA();
+}
+
+ +

Dies bietet einen großen Nutzen beim Schreiben von einfacher wartbarem Code. Wenn eine Funktion ein oder zwei andere Funktionen benutzt, diese aber im Code nirgendwo anders benötigt werden, kann man diese Hilfsfunktionen in die Funktion schachteln, die diese schlussendlich eigentlich aufruft. Das hällt die Anzahl der globalen Funktionen niedrig, was immer gut ist.

+ +

Dieses ist ein Gegenpool zum oft verlockenden Einsatz von globalen Variablen. Wenn komplexer Code geschrieben wird, ist es oft verlockend und einfach, globale Variablen für das Teilen von Werten zwischen mehreren Funktionen zu benutzen — was aber zu einem unwartbaren Code führen kann. Geschachtelte Funktionen teilen sich Variablen aus der Elternfunktion, weshalb dieser Mechanismus gut für das Koppeln von Funktionen geeignet ist, wenn es Sinn ergibt, ohne dabei den globalen Namensraum zu verunreinigen — "lokal global" wenn man so will. Diese Technik sollte mit Vorsicht eingesetzt werden, ist jedoch eine nützliche Möglichkeit.

+ +

Closures

+ +

Nun wird einer der mächtigsten Abstraktionsmechanismen vorgestellt, den JavaScript mit sich bringt —  der jedoch oft auch für Verwirrung sorgt. Was passiert im nachfolgenden Codeschnipsel?

+ +
function makeAdder(a) {
+  return function(b) {
+    return a + b;
+  };
+}
+var x = makeAdder(5);
+var y = makeAdder(20);
+x(6); // ?
+y(7); // ?
+ +

Der Name der makeAdder-Funktion lässt es schon vermuten, was diese bewirken soll: sie erstellt neue adder-Funktionen, welche dann mit einem Argument aufgerufen werden, welches zu dem Argument addiert wird, mit dem sie erstellt wurden.

+ +

Was hier passiert ist das gleiche wie das, was vorab mit den inneren Funktionen geschehen ist: eine Funktion, die in einer anderen Funktion definiert ist, hat Zugriff auf die Variable der äußeren Funktion. Hier jedoch mit dem Unterschied, dass die äußere Funktion etwas zurückgibt und vortäuscht, dass die lokalen Variablen nicht mehr existieren. Doch bleiben diese bestehen — andernfalls könnte die adder-Funktion nicht funktionieren. Außerdem gibt es zwei verschiedene Kopien der lokalen Variablen der makeAdder()-Funktion — eine, wo a den Wert 5 hat und eine wo a den Wert 20 hat. Die Ergebnisse der beiden Funktionsaufrufe ist deswegen folgendes:

+ +
x(6) // ergibt 11
+y(7) // ergibt 27
+
+ +

Hier ist, was tatsächlich passiert. Immer, wenn JavaScript eine Funktion ausführt, wird ein Scopeobjekt erstellt, welches die lokalen Variablen enthält, die in der Funktion erstellt werden. Es wird mit jeder Variablen initialisiert, die als Funktionsparameter übergeben wird. Das ist wie mit dem globalen Objekt, welches alle globalen Variablen und Funktionen in sich vorhält, jedoch mit einigen wichtigen Unterschieden: erstens wird immer ein neues Scopeobjekt für jeden Aufruf einer Funktion erstellt und zweitens (anders als bei globalen Objekten, welche als this und in Browsern als window erreichbar sind), sind diese Scopeobjekte nicht direkt im JavaScript Code erreichbar. Es gibt zum Beispiel keinen Mechanismus zum Iterieren aller Eigenschaften eines Scopeobjekts.

+ +

Beim Aufruf der makeAdder()-Funktion wird ein Scope-Objekt erstellt, das eine Eigenschaft besitzt: a, welche das übergebene Argument der makeAdder() Funktion ist. makeAdder() gibt dann eine neu erstellte Funktion zurück. Normalerweise würde der Garbage Collector von JavaScript das für makeAdder() erstellte Scopeobjekt an dieser Stelle entsorgen, doch die zurückgegebene Funktion enthält noch immer eine Referenz auf das Scopeobjekt. Als Resultat wird das Scopeobjekt nicht entsorgt, bis es keine Referenzen mehr auf die von makeAdder() zurückgegebene Funktion gibt.

+ +

Scopeobjekte bilden eine Scopekette, die ähnlich funktioniert wie die Prototypenkette von JavaScripts Objektsystem.

+ +

Eine Closure ist eine Kombination aus einer Funktion und dem Scopeobjekt, in dem die Funktion erstellt wurde. Closures sind in der Lage, einen Status zu speichern — als solches können sie oft an Stellen von Objekten eingesetzt werden. Hier sind einige gute Einführungen zu Closures zu finden.

diff --git "a/files/de/web/javascript/einf\303\274hrung_in_den_gebrauch_von_xpath_in_javascript/index.html" "b/files/de/web/javascript/einf\303\274hrung_in_den_gebrauch_von_xpath_in_javascript/index.html" new file mode 100644 index 0000000000..6af0ba9e0e --- /dev/null +++ "b/files/de/web/javascript/einf\303\274hrung_in_den_gebrauch_von_xpath_in_javascript/index.html" @@ -0,0 +1,411 @@ +--- +title: Einführung in den Gebrauch von XPath in JavaScript +slug: Web/JavaScript/Einführung_in_den_Gebrauch_von_XPath_in_JavaScript +translation_of: Web/XPath/Introduction_to_using_XPath_in_JavaScript +--- +

Dieses Dokument beschreibt die Schnittstelle zu XPath in JavaScript intern, in Erweiterungen und in Webseiten. Mozilla implementiert einen großen Teil von DOM 3 XPath, sodass XPath auf HTML- und XML-Dokumente angewendet werden kann.

+ +

Die Hauptschnittstelle für die Anwendung von XPath ist die evaluate-Methode des document-Objekts.

+ +

document.evaluate

+ +

Diese Methode wertet  XPath Ausdrücke in Bezug auf ein XML basierendes Dokument (einschließlich HTML-Documente) aus und gibt ein XPathResult-Objekt zurück, das ein Einzelknoten oder eine Zusammenstellung mehrerer Knoten sein kann. Die vorhandene Dokumentation dieser Methode ist unter document.evaluate zu finden, sie ist jedoch für unseren jetzigen Bedarf ziemlich knapp gehalten. Eine umfangreichere Betrachtung wird nachfolgend beschrieben.

+ +
var xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );
+
+ +

Parameter

+ +

Die evaluate Funktion nimmt insgesamt fünf Parameter entgegen:

+ + + +

Rückgabewert

+ +

Returns xpathResult, which is an XPathResult object of the type specified in the resultType parameter. The XPathResult Interface is defined {{ Source("dom/interfaces/xpath/nsIDOMXPathResult.idl", "here") }}.

+ +

Einen Standard-Namensraumauflöser (Default Namespace Resolver) implementieren

+ +

Wir erstellen einen Namensraumauflöser mit Hilfe der createNSResolver-Methode des document-Objekts.

+ +
var nsResolver = document.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement );
+
+ +

Or alternatively by using the <code>createNSResolver</code> method of a <code>XPathEvaluator</code> object. <pre> var xpEvaluator = new XPathEvaluator(); var nsResolver = xpEvaluator.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement ); </pre> And then pass document.evaluate, the nsResolver variable as the namespaceResolver parameter.

+ +

Note: XPath defines QNames without a prefix to match only elements in the null namespace. There is no way in XPath to pick up the default namespace as applied to a regular element reference (e.g., p[@id='_myid'] for xmlns='http://www.w3.org/1999/xhtml'). To match default elements in a non-null namespace, you either have to refer to a particular element using a form such as ['namespace-uri()='http://www.w3.org/1999/xhtml' and name()='p' and @id='_myid'] (this approach works well for dynamic XPath's where the namespaces might not be known) or use prefixed name tests, and create a namespace resolver mapping the prefix to the namespace. Read more on how to create a user defined namespace resolver, if you wish to take the latter approach.

+ +

Anmerkungen

+ +

Adapts any DOM node to resolve namespaces so that an XPath expression can be easily evaluated relative to the context of the node where it appeared within the document. This adapter works like the DOM Level 3 method lookupNamespaceURI on nodes in resolving the namespaceURI from a given prefix using the current information available in the node's hierarchy at the time lookupNamespaceURI is called. Also correctly resolves the implicit xml prefix.

+ +

Festlegung des Rückgabetyps

+ +

The returned variable xpathResult from document.evaluate can either be composed of individual nodes (simple types), or a collection of nodes (node-set types).

+ +

Simple Types

+ +

When the desired result type in resultType is specified as either:

+ + + +

We obtain the returned value of the expression by accessing the following properties respectively of the XPathResult object.

+ + + +
Beispiel
+ +

The following uses the XPath expression count(//p) to obtain the number of <p> elements in a HTML document:

+ +
var paragraphCount = document.evaluate( 'count(//p)', document, null, XPathResult.ANY_TYPE, null );
+
+alert( 'This document contains ' + paragraphCount.numberValue + ' paragraph elements' );
+
+ +

Although JavaScript allows us to convert the number to a string for display, the XPath interface will not automatically convert the numerical result if the stringValue property is requested, so the following code will not work:

+ +
var paragraphCount = document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null );
+
+alert( 'This document contains ' + paragraphCount.stringValue + ' paragraph elements' );
+
+ +

Instead it will return an exception with the code NS_DOM_TYPE_ERROR.

+ +

Node-Set-Typen

+ +

The XPathResult object allows node-sets to be returned in 3 principal different types:

+ + + +
Iteratoren
+ +

When the specified result type in the resultType parameter is either:

+ + + +

The XPathResult object returned is a node-set of matched nodes which will behave as an iterator, allowing us to access the individual nodes contained by using the iterateNext() method of the XPathResult.

+ +

Once we have iterated over all of the individual matched nodes, iterateNext() will return null.

+ +

Note however, that if the document is mutated (the document tree is modified) between iterations that will invalidate the iteration and the invalidIteratorState property of XPathResult is set to true, and a NS_ERROR_DOM_INVALID_STATE_ERR exception is thrown.

+ +
Iterator Example
+ +
var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
+
+try {
+  var thisNode = iterator.iterateNext();
+
+  while (thisNode) {
+    alert( thisNode.textContent );
+    thisNode = iterator.iterateNext();
+  }
+}
+catch (e) {
+  dump( 'Error: Document tree modified during iteration ' + e );
+}
+
+ +
Momentabbilder (Snapshots)
+ +

When the specified result type in the resultType parameter is either:

+ + + +

The XPathResult object returned is a static node-set of matched nodes, which allows us to access each node through the snapshotItem(itemNumber) method of the XPathResult object, where itemNumber is the index of the node to be retrieved. The total number of nodes contained can be accessed through the snapshotLength property.

+ +

Snapshots do not change with document mutations, so unlike the iterators the snapshot does not become invalid, but it may not correspond to the current document, for example the nodes may have been moved, it might contain nodes that no longer exist, or new nodes could have been added.

+ +
Snapshot Example
+ +
var nodesSnapshot = document.evaluate('//phoneNumber', documentNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
+
+for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ )
+{
+  dump( nodesSnapshot.snapshotItem(i).textContent );
+}
+
+ +
Erster Knoten
+ +

When the specified result type in the resultType parameter is either:

+ + + +

The XPathResult object returned is only the first found node that matched the XPath expression. This can be accessed through the singleNodeValue property of the XPathResult object. This will be null if the node set is empty.

+ +

Note that, for the unordered subtype the single node returned might not be the first in document order, but for the ordered subtype you are guaranteed to get the first matched node in the document order.

+ +
First Node Example
+ +
var firstPhoneNumber = document.evaluate('//phoneNumber', documentNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null );
+
+dump( 'The first phone number found is ' + firstPhoneNumber.singleNodeValue.textContent );
+
+ +

Die Konstante ANY_TYPE

+ +

When the result type in the resultType parameter is specified as ANY_TYPE, the XPathResult object returned, will be whatever type that naturally results from the evaluation of the expression.

+ +

It could be any of the simple types (NUMBER_TYPE, STRING_TYPE, BOOLEAN_TYPE), but, if the returned result type is a node-set then it will only be an UNORDERED_NODE_ITERATOR_TYPE.

+ +

To determine that type after evaluation, we use the resultType property of the XPathResult object. The constant values of this property are defined in the appendix. None Yet =====Any_Type Example===== <pre> </pre>

+ +

Beispiele

+ +

Innerhalb eines HTML-Dokuments

+ +

The following code is intended to be placed in any JavaScript fragment within or linked to the HTML document against which the XPath expression is to be evaluated.

+ +

To extract all the <h2> heading elements in an HTML document using XPath, the xpathExpression is simply '//h2'. Where, // is the Recursive Descent Operator that matches elements with the nodeName h2 anywhere in the document tree. The full code for this is: link to introductory xpath doc

+ +
var headings = document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null );
+
+ +

Notice that, since HTML does not have namespaces, we have passed null for the namespaceResolver parameter.

+ +

Since we wish to search over the entire document for the headings, we have used the document object itself as the contextNode.

+ +

The result of this expression is an XPathResult object. If we wish to know the type of result returned, we may evaluate the resultType property of the returned object. In this case, that will evaluate to 4, an UNORDERED_NODE_ITERATOR_TYPE. This is the default return type when the result of the XPath expression is a node set. It provides access to a single node at a time and may not return nodes in a particular order. To access the returned nodes, we use the iterateNext() method of the returned object:

+ +
var thisHeading = headings.iterateNext();
+
+var alertText = 'Level 2 headings in this document are:\n'
+
+while (thisHeading) {
+  alertText += thisHeading.textContent + '\n';
+  thisHeading = headings.iterateNext();
+}
+
+ +

Once we iterate to a node, we have access to all the standard DOM interfaces on that node. After iterating through all the h2 elements returned from our expression, any further calls to iterateNext() will return null.

+ +

Auswertung an einem XML-Dokument innerhalb einer Erweiterung

+ +

The following uses an XML document located at chrome://yourextension/content/peopleDB.xml as an example.

+ +
<?xml version="1.0"?>
+<people xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" >
+  <person>
+	<name first="george" last="bush" />
+	<address street="1600 pennsylvania avenue" city="washington" country="usa"/>
+	<phoneNumber>202-456-1111</phoneNumber>
+  </person>
+  <person>
+	<name first="tony" last="blair" />
+	<address street="10 downing street" city="london" country="uk"/>
+	<phoneNumber>020 7925 0918</phoneNumber>
+  </person>
+</people>
+
+ +

To make the contents of the XML document available within the extension, we create an XMLHttpRequest object to load the document synchronously, the variable xmlDoc will contain the document as an XMLDocument object against which we can use the evaluate method

+ +

JavaScript used in the extensions xul/js documents.

+ +
var req = new XMLHttpRequest();
+
+req.open("GET", "chrome://yourextension/content/peopleDB.xml", false);
+req.send(null);
+
+var xmlDoc = req.responseXML;
+
+var nsResolver = xmlDoc.createNSResolver( xmlDoc.ownerDocument == null ? xmlDoc.documentElement : xmlDoc.ownerDocument.documentElement);
+
+var personIterator = xmlDoc.evaluate('//person', xmlDoc, nsResolver, XPathResult.ANY_TYPE, null );
+
+ +

Anmerkung

+ +

When the XPathResult object is not defined, the constants can be retreived in privileged code using Components.interfaces.nsIDOMXPathResult.ANY_TYPE (CI.nsIDOMXPathResult). Similarly, an XPathEvaluator can be created using:

+ +
Components.classes["@mozilla.org/dom/xpath-evaluator;1"].createInstance(Components.interfaces.nsIDOMXPathEvaluator)
+ +

Anhang

+ +

Einen benutzerdefinierten Namensauflöser implementieren

+ +

This is an example for illustration only. This function will need to take namespace prefixes from the xpathExpression and return the URI that corresponds to that prefix. For example, the expression:

+ +
'//xhtml:td/mathml:math'
+
+ +

will select all MathML expressions that are the children of (X)HTML table data cell elements.

+ +

In order to associate the 'mathml:' prefix with the namespace URI 'http://www.w3.org/1998/Math/MathML' and 'xhtml:' with the URI 'http://www.w3.org/1999/xhtml' we provide a function:

+ +
function nsResolver(prefix) {
+  var ns = {
+    'xhtml' : 'http://www.w3.org/1999/xhtml',
+    'mathml': 'http://www.w3.org/1998/Math/MathML'
+  };
+  return ns[prefix] || null;
+}
+
+ +

Our call to document.evaluate would then looks like:

+ +
document.evaluate( '//xhtml:td/mathml:math', document, nsResolver, XPathResult.ANY_TYPE, null );
+
+ +

Einen Standard-Namensrauf für XML-Dokumente implementieren

+ +

As noted in the Implementing a Default Namespace Resolver previously, the default resolver does not handle the default namespace for XML documents. For example with this document:

+ +
<?xml version="1.0" encoding="UTF-8"?>
+<feed xmlns="http://www.w3.org/2005/Atom">
+    <entry />
+    <entry />
+    <entry />
+</feed>
+
+ +

doc.evaluate('//entry', doc, nsResolver, XPathResult.ANY_TYPE, null) will return an empty set, where nsResolver is the resolver returned by createNSResolver. Passing a null resolver doesn't work any better, either.

+ +

One possible workaround is to create a custom resolver that returns the correct default namespace (the Atom namespace in this case). Note that you still have to use some namespace prefix in your XPath expression, so that the resolver function will be able to change it to your required namespace. E.g.:

+ +
function resolver() {
+    return 'http://www.w3.org/2005/Atom';
+}
+doc.evaluate('//myns:entry', doc, resolver, XPathResult.ANY_TYPE, null)
+
+ +

Note that a more complex resolver will be required if the document uses multiple namespaces.

+ +

An approach which might work better (and allow namespaces not to be known ahead of time) is described in the next section.

+ +

Using XPath functions to reference elements with a default namespace

+ +

Another approach to match default elements in a non-null namespace (and one which works well for dynamic XPath expressions where the namespaces might not be known), involves referring to a particular element using a form such as [namespace-uri()='http://www.w3.org/1999/xhtml' and name()='p' and @id='_myid']. This circumvents the problem of an XPath query not being able to detect the default namespace on a regularly labeled element.

+ +

Getting specifically namespaced elements and attributes regardless of prefix

+ +

If one wishes to provide flexibility in namespaces (as they are intended) by not necessarily requiring a particular prefix to be used when finding a namespaced element or attribute, one must use special techniques.

+ +

While one can adapt the approach in the above section to test for namespaced elements regardless of the prefix chosen (using local-name() in combination with namespace-uri() instead of name()), a more challenging situation occurs, however, if one wishes to grab an element with a particular namespaced attribute in a predicate (given the absence of implementation-independent variables in XPath 1.0).

+ +

For example, one might try (incorrectly) to grab an element with a namespaced attribute as follows: var xpathlink = someElements[local-name(@*)="href" and namespace-uri(@*)='http://www.w3.org/1999/xlink'];

+ +

This could inadvertently grab some elements if one of its attributes existed that had a local name of "href", but it was a different attribute which had the targeted (XLink) namespace (instead of @href).

+ +

In order to accurately grab elements with the XLink @href attribute (without also being confined to predefined prefixes in a namespace resolver), one could obtain them as follows:

+ +
var xpathEls = 'someElements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/xlink"]]'; // Grabs elements with any single attribute that has both the local name 'href' and the XLink namespace
+var thislevel = xml.evaluate(xpathEls, xml, null, XPathResult.ANY_TYPE, null);
+var thisitemEl = thislevel.iterateNext();
+
+ +

In XPathResult definierte Konstanten

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Result Type Defined ConstantValueDescription
ANY_TYPE0A result set containing whatever type naturally results from evaluation of the expression. Note that if the result is a node-set then UNORDERED_NODE_ITERATOR_TYPE is always the resulting type.
NUMBER_TYPE1A result containing a single number. This is useful for example, in an XPath expression using the count() function.
STRING_TYPE2A result containing a single string.
BOOLEAN_TYPE3A result containing a single boolean value. This is useful for example, in an XPath expression using the not() function.
UNORDERED_NODE_ITERATOR_TYPE4A result node-set containing all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.
ORDERED_NODE_ITERATOR_TYPE5A result node-set containing all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.
UNORDERED_NODE_SNAPSHOT_TYPE6A result node-set containing snapshots of all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.
ORDERED_NODE_SNAPSHOT_TYPE7A result node-set containing snapshots of all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.
ANY_UNORDERED_NODE_TYPE8A result node-set containing any single node that matches the expression. The node is not necessarily the first node in the document that matches the expression.
FIRST_ORDERED_NODE_TYPE9A result node-set containing the first node in the document that matches the expression.
+ +

Siehe auch

+ + + +
+

Original Document Information

+ + +
diff --git a/files/de/web/javascript/eventloop/index.html b/files/de/web/javascript/eventloop/index.html new file mode 100644 index 0000000000..9f8093aa57 --- /dev/null +++ b/files/de/web/javascript/eventloop/index.html @@ -0,0 +1,138 @@ +--- +title: Concurrency model and Event Loop +slug: Web/JavaScript/EventLoop +tags: + - Advanced + - Event Loop + - Event Management + - Event Queue + - Handling Events + - JavaScript + - events +translation_of: Web/JavaScript/EventLoop +--- +
{{JsSidebar("Advanced")}}
+ +

JavaScript hat ein Nebenläufigkeitsmodell, auf Basis einer Eventschleife. Dieses Modell unterscheidet sich stark von Modellen aus anderen Sprachen wie C und Java.

+ +

Laufzeitkonzepte

+ +

Der folgenden Abschnitt erklärt ein theoretisches Modell. Moderne JavaScript-Engines implementieren und optimieren die beschriebenen Semantiken sehr stark.

+ +

Visuelle Repräsentation

+ +

Stack, heap, queue

+ +

Stack

+ +

Funktionsaufrufe von einem Stack von Frames.

+ +
function foo(b){
+  var a = 10;
+  return a + b + 11;
+}
+
+function bar(x){
+  var y = 3;
+  return foo(x * y);
+}
+
+console.log(bar(7)); // gibt 42 zurück
+
+ +

Beim Aufruf von bar wird ein erster Frame erstellt, der die Argumente und lokalen Variablen von bar enthält. Sobald bar die Funktion foo aufruft, wird ein zweiter Frame erstellt, der auf den ersten gelegt wird und die Argumente und lokalen Variablen von foo enthält. Wenn foo beendet wird, wird der der oberste Frame aus dem Stack entfernt (nur der bar Frame bleibt auf dem Stack). Wenn bar beendet wird, ist der Stack leer.

+ +

Heap

+ +

Objekte werden in einem Heap gespeichert, welcher hauptsächlich eine meist große unstrukturierte Region im Speicher ist.

+ +

Queue

+ +

Eine JavaScript Laufzeitumgebung benutzt eine Nachrichten-Queue, welche eine Liste von Nachrichten ist, die ausgeführt werden. Jede Nachricht hat eine Funktion, die aufgerufen wird, um die Nachricht abzuarbeiten.

+ +

An diesem Punkt, während der {{anch("Eventschleife", "Eventschleife")}}, beginnt die Laufzeitumgebung mit der ältesten Nachricht. Dazu wird die Nachricht aus der Queue entfernt und die zugehörige Funktion mit der Nachricht als Eingabeparameter aufgerufen. Wie immer erzeugt das Aufrufen einer Funktion einen neuen Frame auf dem Stack, für den Funktionsgebrauch.

+ +

Die Ausführung von Funktionen geht so lange weiter, bis der Stack wieder leer ist; dann wird die Eventschleife die nächste Nachricht ausführen (wenn eine vorhanden ist).

+ +

Eventschleife

+ +

Die Eventschleife ist nach der Art und Weise, wie diese meist implementiert ist, benannt. Dies ähnelt meist der folgenden Struktur:

+ +
while (queue.waitForMessage()){
+  queue.processNextMessage();
+}
+ +

queue.waitForMessage() wartet synchron auf eine eingehende Nachricht, wenn keine vorhanden ist.

+ +

Ausführungsfertigstellung

+ +

Jede Nachricht wird vollständig verarbeitet, bevor eine andere Nachricht verarbeitet wird. Dies bietet einige nette Eigenschaften zum Verständnis der Ausführung ihres Programms, einschließlich der Tatsache, dass eine Funktion, wann immer sie ausgeführt wird, nicht vorzeitig verlassen werden kann. Die Funktion wird daher vollständig ausgeführt bevor irgendein anderer Code ausgeführt wird (und die Daten ändern könnte). Dies unterscheidet sich z. B. von C, wo eine Funktion in einem Thread läuft und gestoppt werden kann, um anderen Code in einem anderen Thread auszuführen.

+ +

Dies bringt aber den Nachteil mit sich, dass während einer Nachricht, die sehr lange dauern kann, keine Nutzer-Interaktionen, wie z.B. Klicken oder Scrollen, möglich ist. Der Browser entschärft dies mit dem "Ein Skript antwortet nicht mehr" Dialog. Gute Praxis ist es daher die Dauer der Nachrichten kurz zu halten und wenn möglich in einzelne Nachrichten aufzuteilen.

+ +

Hinzufügen von Nachrichten

+ +

In einem Webbrowser werden Nachrichten immer hinzugefügt, wenn ein Event auftritt und diesem ein Event Listener hinzugefügt wurde. Ist kein Listener vorhanden, geht das Event verloren. Ein Klick auf ein Element mit einem Click-Event-Handler fügt also eine Nachricht hinzu - ähnlich wie bei jedem anderen Ereignis.

+ +

Die Funktion {{domxref("WindowTimers.setTimeout", "setTimeout")}} wird mit 2 Argumenten aufgerufen: eine Nachricht, die der Queue hinzugefügt wird, und einen Zeitwert (optional; Standardwert 0). Der Zeitwert gibt die (minimale) Zeit an, nach der die Nachricht zur Queue hinzugefügt wird. Die Nachricht wird nach dieser Zeit aufgeführt, wenn keine anderen Nachrichten ausgeführt werden. Aus diesem Grund ist der zweite Parameter die minimale und nicht die garantierte Zeit.

+ +

Hier ist ein Beispiel, welches das Konzept demonstriert (setTimeout wird nicht direkt nach dem Ablaufen der Zeit aufgeführt):

+ +
const s = new Date().getSeconds();
+
+setTimeout(function() {
+  // prints out "2", meaning that the callback is not called immediately after 500 milliseconds.
+  console.log("Ran after " + (new Date().getSeconds() - s) + " seconds");
+}, 500);
+
+while(true) {
+  if(new Date().getSeconds() - s >= 2) {
+    console.log("Good, looped for 2 seconds");
+    break;
+  }
+}
+
+ +

Nullverzögerungen

+ +

Nullverzögerung bedeutet nicht, dass der Aufruf nach null Millisekunden gefeuert wird. Der Aufruf von {{domxref("WindowTimers.setTimeout", "setTimeout")}} mit einer Verzögerung von 0 Millisekunden führt die übergebene Funktion nicht nach dem gegebenen Intervall aus.

+ +

Die Ausführung hängt von der Anzahl von wartenden Aufrufen in der Queue ab. Im Beispiel unten, wird die Nachricht ''this is just a message'' vor der Ausführung des Callback auf der Konsole ausgegeben, weil die Verzögerung die minimale Verzögerung für die Laufzeigumgebung ist, aber diese nicht garantiert werden kann.

+ +

Im Grunde muss setTimeout warten, bis der gesamte Code für Nachrichten in der Warteschlange abgeschlossen wurde, obwohl ein bestimmtes Zeitlimit für setTimeout angegeben wurde.

+ +
(function() {
+
+  console.log('this is the start');
+
+  setTimeout(function cb() {
+    console.log('this is a msg from call back');
+  });
+
+  console.log('this is just a message');
+
+  setTimeout(function cb1() {
+    console.log('this is a msg from call back1');
+  }, 0);
+
+  console.log('this is the end');
+
+})();
+
+// "this is the start"
+// "this is just a message"
+// "this is the end"
+// note that function return, which is undefined, happens here
+// "this is a msg from call back"
+// "this is a msg from call back1"
+
+ +

Komunikation mehrere Laufzeitumgebungen zur gleichen Zeit

+ +

Ein Web Worker oder ein Cross-Origin iFrame hat seinen eigenen Stack, Heap und Nachrichten Queue. Zwei unabhängige Laufzeitumgebungen können nur durch das Senden von Nachrichten über die postMessage Methode kommunizieren. Diese Methode fügt der Message Queue der anderen Laufzeit eine Nachricht hinzu, wenn diese auf die Message-Events hört.

+ +

Niemals blockierend

+ +

Eine sehr interessante Eigenschaft des Eventschleifen Modells ist, dass Javascript, im Gegensatz zu vielen anderen Sprachen, niemals blockiert. Die Handhabung von I/O wird typischerweise über Events und Callback-Funktionen erledigt, so dass die Applikation, während sie auf Ergebnisse einer IndexedDB- oder XHR-Anfrage wartet, weitere Benutzereingaben verarbeiten kann.

+ +

Es gibt Ausnahmen, wie z.B. alert oder synchrone XHR, wobei es eine gute Praxis ist, diese zu vermeiden. Obacht, es existieren Ausnahmen für die Ausnahme (aber diese sind für gewöhnlich eher Bugs bei der Implementierung als irgendetwas anderes).

diff --git a/files/de/web/javascript/guide/ausdruecke_und_operatoren/index.html b/files/de/web/javascript/guide/ausdruecke_und_operatoren/index.html new file mode 100644 index 0000000000..7a0e723c6c --- /dev/null +++ b/files/de/web/javascript/guide/ausdruecke_und_operatoren/index.html @@ -0,0 +1,965 @@ +--- +title: Ausdrücke und Operatoren +slug: Web/JavaScript/Guide/Ausdruecke_und_Operatoren +tags: + - Beginner + - Extensions + - Guide + - JavaScript + - Operatoren + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Funktionen", "Web/JavaScript/Guide/Numbers_and_dates")}}
+ +

Dieses Kapitel beschreibt JavaScript Ausdrücke und Operatoren, Zuweisungsoperatoren, Vergleichsoperatoren, Rechenoperatoren, Bit-Operatoren, Logische Operatoren, Operator zur Zeichenkettenverknüpfung, Bedingte (ternäre) Operatoren und mehr.

+ +

Eine vollständige und detaillierte Liste mit Operatoren und Ausdrücken ist in den Referenzen zu finden.

+ +

Operatoren

+ +

JavaScript besitzt verschiedene Operatortypen. Dieser Abschnitt beschreibt die einzelnen Operatoren und beinhaltet Informationen über die Operator-Prioritäten.

+ + + +

JavaScript verfügt über beides, binäre als auch unäre Operatoren. Zudem existiert ein spezieller ternärer Operator - der Bedingungsoperator. Ein binärer Operator benötigt zwei Operanden, einen vor dem Operator und einen nach dem Operator:

+ +
operand1 operator operand2
+
+ +

Zum Beispiel: 3+4, oder x*y.

+ +

Ein unärer Operator erwartet einen einzelnen Operanden, entweder vor, oder nach dem Operator:

+ +
operator operand
+
+ +

oder

+ +
operand operator
+
+ +

Zum Beispiel: x++, oder ++x.

+ +

Zuweisungsoperatoren

+ +

Ein Zuweisungsoperator weißt seinem linken Operanden einen Wert zu. Dieser Wert basiert auf dem Ergebnis des rechten Operanden. Der einfachste Zuweisungsoperator ist das "Gleich" (=), welches den Wert des rechten Operanden dem linken Operanden zuweist.

+ +

Zum Beispiel: x = y (y wid der Wert von x zugewiesen).

+ +

Es gibt auch zusammengesetzte Zuweisungsoperatoren, diese stellen Abkürzungen für die in der folgenden Tabelle aufgelisteten Operationen dar:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Zusammengesetzte Zuweisungsoperatoren
NameAbgekürzter OperatorAusgeschriebener Operator
Zuweisungx = yx = y
Additionx += yx = x + y
Subraktionx -= yx = x - y
Multiplikationx *= yx = x * y
Divisionx /= yx = x / y
Modulo (Division mit Rest)x %= yx = x % y
Exponentiation assignment {{experimental_inline}}x **= yx = x ** y
Left shift assignmentx <<= yx = x << y
Right shift assignmentx >>= yx = x >> y
Unsigned right shift assignmentx >>>= yx = x >>> y
Bitwise AND assignmentx &= yx = x & y
Bitwise XOR assignmentx ^= yx = x ^ y
Bitwise OR assignmentx |= yx = x | y
+ +

Destrukturierung

+ +

Komplexere Zuweisungen ermöglicht Javascript über die sogenannte Destrukturierung. Diese ermöglicht es, Daten aus Arrays oder Objekten mithilfe einer Syntax zu extrahieren, die die Konstruktion von Array- und Objektliteralen widerspiegelt.

+ +
var foo = ["eins", "zwei", "drei"];
+
+// Ohne Destrukturierung
+var eins   = foo[0];
+var zwei   = foo[1];
+var drei   = foo[2];
+
+// mit Destrukturierung
+var [eins, zwei, drei] = foo;
+ +

Vergleichsoperatoren

+ +

Ein Vergleichsoperator vergleicht seine Operanden und gibt einen logischen Wert zurück, der darauf basiert, ob der Vergleich wahr ist, oder nicht.

+ +

Die Operanden können numerische-, string-, logische- oder Objektwerte sein. Zeichenfolgen werden basierend auf der lexikographischen Standardreihenfolge mit unicodewerten verglichen. Wenn die beiden Operanden nicht vom selben Typ sind, versucht JavaScript in den meisten Fällen, sie in einen geeigneten Typ für den Vergleich zu konvertieren. Dieses Verhalten führt im Allgemeinen dazu, dass die Operanden numerisch verglichen werden. Die einzigen Ausnahmen für die Typumwandlung innerhalb von Vergleichen sind die Operatoren === und !==, die strenge Vergleiche durchführen. Diese Operatoren versuchen nicht, die Operanden in kompatible Typen zu konvertieren, bevor sie die Gleichheit überprüfen.

+ +

Die folgende Tabelle beschreibt die Vergleichsoperatoren in Bezug auf diesen Beispielcode:

+ +
var var1 = 3;
+var var2 = 4;
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Vergleichsoperatoren
OperatorBeschreibungBeispiele, die true zurückgeben
Equal (==)Gibt true zurück, wenn die Operanden gleich sind.3 == var1 +

"3" == var1

+ 3 == '3'
Not equal (!=)Gibt true zurück, wenn die Operanden ungleich sind.var1 != 4
+ var2 != "3"
Strict equal (===)Gibt true zurück, wenn die Operanden gleich sind und auch der Typ übereinstimmt. Weitere Informationen unter {{jsxref("Object.is")}} und sameness in JS.3 === var1
Strict not equal (!==)Gibt true zurück, wenn die Operanden vom selben Typ sind, doch nicht den selben Wert haben, oder wenn sie den selben Wert haben, doch nicht vom selben Typ sind.var1 !== "3"
+ 3 !== '3'
Greater than (>)Gibt true zurück, wenn der linke Operand größer dem rechten Operanden ist.var2 > var1
+ "12" > 2
Greater than or equal (>=)Gibt true zurück, wenn der linke Operand größer als, oder gleich dem linken Operanden ist.var2 >= var1
+ var1 >= 3
Less than (<)Gibt true zurück, wenn der linke Operand kleiner dem rechten Operanden ist.var1 < var2
+ "2" < 12
Less than or equal (<=)Gibt true zurück, wenn der linke Operand kleiner als, oder gleich dem rechten Operanden ist.var1 <= var2
+ var2 <= 5
+ +
+

Note: (=>) ist kein Operator, hiermit werden Arrow functions notiert.

+
+ +

Arithmetische Operatoren (Rechenzeichen)

+ +

Ein arithmetischer Operator nimmt numerische Werte (Literale oder Variablen) als Operanden entgegen und gibt einen einzelnen numerischen Wert zurück. Die arithmetischen Standardoperatoren sind Addition (+), Subtraktion (-), Multiplikation (*) und Division (/). Diese Operatoren funktionieren wie in den meisten anderen Programmiersprachen, wenn sie mit Fließkommazahlen verwendet werden (beachten Sie insbesondere, dass die Division durch Null {{jsxref ("Infinity")}} ergibt).

+ +
1 / 2; // 0.5
+1 / 2 == 1.0 / 2.0; // this is true
+
+ +

Neben den arithmetischen Standardoperatoren (+, -, * /), stellt JavaScript noch weitere Rechenzeichen zur Verfügung. Diese werden in der folgenden Tabelle aufgeführt:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Arithmetische Operatoren
OperatorBeschreibungBeispiel
Remainder (%)Binärer Operator. Gibt den ganzzahligen Rest der Division beider Operanden zurück.12 % 5 gibt 2 zurück.
Increment (++) +

Unärer Operator. Addiert 1 zu seinem Operanden.

+ +

Wenn der Operator vorangestellt wird (++x), gibt er den Wert seines Operanden zurück nachdem 1 addiert wurde; Wenn der Operator nachgestellt wird (x++), gibt er den Wert seines Operanden zurück, bevor 1 addiert wurde.

+
Wenn x gleich 3 ist, setzt ++x x auf 4 und gibt 4 zurück, wobei x++  3 zurückgibt und erst danach x auf 4 setzt.
Decrement (--) +

Unärer Operator. Subtrahiert 1 von seinem Operanden.

+ +

Der Rückgabewert verhält sich analog zum increment Operator.

+
Wenn x gleich 3 ist, setzt --x x auf 2 und gibt 2 zurück, wobei x-- 3 zurückgibt und erst danach, x auf 2 setzt.
Unary negation (-)Unärer Operator. Gibt die Negierung seines Operanden zurück.Wenn x gleich 3 ist, gibt -x -3 zurück.
Unary plus (+)Versucht, den Operanden in eine Zahl umzuwandeln, wenn dies nicht bereits der Fall ist.+"3" gibt 3 zurück.
+ +true gibt 1 zurück.
Exponentiation operator (**) {{experimental_inline}}Calculates the base to the exponent power, that is, baseexponent2 ** 3 gibt 8 zurück.
+ 10 ** -1 gibt 0.1 zurück.
+ +

Bitweise Operatoren

+ +

Ein bitweiser Operator behandelt seine Operanden als eine Menge von 32 Bits (Nullen und Einsen) und nicht als dezimale, hexadezimale oder oktale Zahlen. Zum Beispiel hat die Dezimalzahl Neun eine binäre Darstellung von 1001. Bitweise Operatoren führen ihre Operationen mit solchen binären Darstellungen aus, doch sie geben standardmäßige numerische JavaScript-Werte zurück.

+ +

Die folgende Tabelle fasst die bitweisen Operatoren von JavaScript zusammen.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Bitweise Operatoren
OperatorVerwendungBeschreibung
Bitwise ANDa & bReturns a one in each bit position for which the corresponding bits of both operands are ones.
Bitwise ORa | bReturns a zero in each bit position for which the corresponding bits of both operands are zeros.
Bitwise XORa ^ bReturns a zero in each bit position for which the corresponding bits are the same.
+ [Returns a one in each bit position for which the corresponding bits are different.]
Bitwise NOT~ aInverts the bits of its operand.
Left shifta << bShifts a in binary representation b bits to the left, shifting in zeros from the right.
Sign-propagating right shifta >> bShifts a in binary representation b bits to the right, discarding bits shifted off.
Zero-fill right shifta >>> bShifts a in binary representation b bits to the right, discarding bits shifted off, and shifting in zeros from the left.
+ +

Bitweise logische Operatoren

+ +

Konzeptuell arbeiten bitweise logische Operatoren wie folgt:

+ + + +

Zum Beispiel ist die binäre Darstellung der Zahl neun 1001, die binäre Darstellung der Zahl 15 ist 1111. Wenn die bitweisen logischen Operatoren auf diese Zahlen angewendet werden, ergeben sich folgende Ergebnisse:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Beispiele für bitweise Operatoren
AusdruckErgebnisBinäre Darstellung
15 & 991111 & 1001 = 1001
15 | 9151111 | 1001 = 1111
15 ^ 961111 ^ 1001 = 0110
~15-16~00000000...00001111 = 11111111...11110000
~9-10~00000000...00001001 = 11111111...11110110
+ +

Beachte, dass alle 32 Bits invertiert werden, wenn der bitweise NOT Operator benutzt wird. Wenn dabei das höchstwertigste (ganz linke) Bit auf 1 gesetzt wird, entsteht eine negative Zahl. Note that all 32 bits are inverted using the Bitwise NOT operator, and that values with the most significant (left-most) bit set to 1 represent negative numbers (Zweierkomplement). ~x wird also genauso ausgewertet wie -x - 1.

+ +

Bitweise Schiebeoperatoren

+ +

Die bitweisen Schiebeoperatoren erwarten zwei Operanden. Der erste ist der Wert, der geschoben werden soll, der zweite die Anzahl der Bits, um die geschoben werden soll. Die Richtung, in die geschoben wird, wird durch den verwendeten Operator bestimmt.

+ +

Schiebeoperatoren konvertieren ihre Operanden in 32 Bit Integer Zahlen und liefern als Ergebnis einen Wert vom selben Typen wir der linke Operand.

+ +

Die Schiebeoperatoren sind in der folgenden Tabelle aufgelistet.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Bitwise shift operators
OperatorDescriptionExample
Left shift
+ (<<)
This operator shifts the first operand the specified number of bits to the left. Excess bits shifted off to the left are discarded. Zero bits are shifted in from the right.9<<2 yields 36, because 1001 shifted 2 bits to the left becomes 100100, which is 36.
Sign-propagating right shift (>>)This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Copies of the leftmost bit are shifted in from the left.9>>2 yields 2, because 1001 shifted 2 bits to the right becomes 10, which is 2. Likewise, -9>>2 yields -3, because the sign is preserved.
Zero-fill right shift (>>>)This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Zero bits are shifted in from the left.19>>>2 yields 4, because 10011 shifted 2 bits to the right becomes 100, which is 4. For non-negative numbers, zero-fill right shift and sign-propagating right shift yield the same result.
+ +

Logische Operatoren

+ +

Logische Operatoren werden normalerweise mit boolesche (logischen) Werten verwendet - hierbei geben sie dann einen booleschen Wert zurück. Die Operatoren && und || geben den Wert von einem der Operatoren zurück, sodass sie im Falle der Verwendung mit einem nicht-booleschen Wert auch einen nicht-booleschen Wert zurückgeben können. Die logischen Operatoren werden in der folgenden Tabelle beschrieben: 

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Logische Operatoren
OperatorVerwendungBeschreibung
Logical AND (&&)expr1 && expr2Gibt expr1 zurück, sofern es zu false konvertiert werden kann; ansonsten wird expr2 zurückgegeben. Insofern mit booleschen Werten verwendet, && gibt true zurück, wenn beide Operanden wahr sind; ansonsten false.
Logical OR (||)expr1 || expr2 +

Gibt expr1 zurück, sofern er zu true konvertiert werden kann. Insofern mit booleschen Werten verwendet, gibt der Operator || true zurück, wenn einer von beiden Operanden true ist; wenn beide false sind, wird false zurückgegeben. 

+
Logical NOT (!)!expr +

Gibt false zurück, wenn sein einziger Operand in true konvertiert werden kann; andernfalls gibt er true zurück. 

+
+ +

Beispiele von Ausdrücken, die in false umgewandelt werden können, sind solche, die null, 0, NaN, einen leeren String ("") oder undefined sind. 

+ +

Die folgenden Zeilen zeigen Beispiele des && (logisches UND) Operators.

+ +
var a1 =  true && true;     // t && t returns true
+var a2 =  true && false;    // t && f returns false
+var a3 = false && true;     // f && t returns false
+var a4 = false && (3 == 4); // f && f returns false
+var a5 = "Cat" && "Dog";    // t && t returns Dog
+var a6 = false && "Cat";    // f && t returns false
+var a7 = "Cat" && false;    // t && f returns false
+
+ +

Die folgenden Zeilen zeigen Beispiele des || (logisches ODER) Operators:

+ +
var o1 =  true || true;     // t || t returns true
+var o2 = false || true;     // f || t returns true
+var o3 =  true || false;    // t || f returns true
+var o4 = false || (3 == 4); // f || f returns false
+var o5 = "Cat" || "Dog";    // t || t returns Cat
+var o6 = false || "Cat";    // f || t returns Cat
+var o7 = "Cat" || false;    // t || f returns Cat
+
+ +

Die folgenden Zeilen zeigen Beispiele des ! (logisches NICHT) Operators:

+ +
var n1 = !true;  // !t returns false
+var n2 = !false; // !f returns true
+var n3 = !"Cat"; // !t returns false
+
+ +

Short-circuit-Bewertung 

+ +

Da logische Ausdrücke von links nach rechts bewertet werden, werden sie auf eine mögliche "Abkürzung" (short-circuit) hin gemäß den folgenden Regeln evaluiert:

+ + + +

Die Regeln der Logik garantieren, dass diese Bewertungen immer korrekt sind. Der irgendwas-Operand werden in den o.g. Beispielen hierbei nicht bewertet. 

+ +

String-Operatoren

+ +

In addition to the comparison operators, which can be used on string values, the concatenation operator (+) concatenates two string values together, returning another string that is the union of the two operand strings.

+ +

For example,

+ +
console.log("my " + "string"); // console logs the string "my string".
+ +

The shorthand assignment operator += can also be used to concatenate strings.

+ +

For example,

+ +
var mystring = "alpha";
+mystring += "bet"; // evaluates to "alphabet" and assigns this value to mystring.
+ +

Conditional (ternary) operator

+ +

The conditional operator is the only JavaScript operator that takes three operands. The operator can have one of two values based on a condition. The syntax is:

+ +
condition ? val1 : val2
+
+ +

If condition is true, the operator has the value of val1. Otherwise it has the value of val2. You can use the conditional operator anywhere you would use a standard operator.

+ +

For example,

+ +
var status = (age >= 18) ? "adult" : "minor";
+
+ +

This statement assigns the value "adult" to the variable status if age is eighteen or more. Otherwise, it assigns the value "minor" to status.

+ +

Comma operator

+ +

The comma operator (,) simply evaluates both of its operands and returns the value of the last operand. This operator is primarily used inside a for loop, to allow multiple variables to be updated each time through the loop.

+ +

For example, if a is a 2-dimensional array with 10 elements on a side, the following code uses the comma operator to update two variables at once. The code prints the values of the diagonal elements in the array:

+ +
var x = [0,1,2,3,4,5,6,7,8,9];
+var a = [x, x, x, x, x]
+
+for (var i = 0, j = 9; i <= j; i++, j--)
+  console.log("a[" + i + "][" + j + "]= " + a[i][j]);
+
+ +

Unary operators

+ +

A unary operation is an operation with only one operand.

+ +

delete

+ +

The delete operator deletes an object, an object's property, or an element at a specified index in an array. The syntax is:

+ +
delete objectName;
+delete objectName.property;
+delete objectName[index];
+delete property; // legal only within a with statement
+
+ +

where objectName is the name of an object, property is an existing property, and index is an integer representing the location of an element in an array.

+ +

The fourth form is legal only within a with statement, to delete a property from an object.

+ +

You can use the delete operator to delete variables declared implicitly but not those declared with the var statement.

+ +

If the delete operator succeeds, it sets the property or element to undefined. The delete operator returns true if the operation is possible; it returns false if the operation is not possible.

+ +
x = 42;
+var y = 43;
+myobj = new Number();
+myobj.h = 4;    // create property h
+delete x;       // returns true (can delete if declared implicitly)
+delete y;       // returns false (cannot delete if declared with var)
+delete Math.PI; // returns false (cannot delete predefined properties)
+delete myobj.h; // returns true (can delete user-defined properties)
+delete myobj;   // returns true (can delete if declared implicitly)
+
+ +
Deleting array elements
+ +

When you delete an array element, the array length is not affected. For example, if you delete a[3], a[4] is still a[4] and a[3] is undefined.

+ +

When the delete operator removes an array element, that element is no longer in the array. In the following example, trees[3] is removed with delete. However, trees[3] is still addressable and returns undefined.

+ +
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+delete trees[3];
+if (3 in trees) {
+  // this does not get executed
+}
+
+ +

If you want an array element to exist but have an undefined value, use the undefined keyword instead of the delete operator. In the following example, trees[3] is assigned the value undefined, but the array element still exists:

+ +
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+trees[3] = undefined;
+if (3 in trees) {
+  // this gets executed
+}
+
+ +

typeof

+ +

The typeof operator is used in either of the following ways:

+ +
typeof operand
+typeof (operand)
+
+ +

The typeof operator returns a string indicating the type of the unevaluated operand. operand is the string, variable, keyword, or object for which the type is to be returned. The parentheses are optional.

+ +

Suppose you define the following variables:

+ +
var myFun = new Function("5 + 2");
+var shape = "round";
+var size = 1;
+var today = new Date();
+
+ +

The typeof operator returns the following results for these variables:

+ +
typeof myFun;     // returns "function"
+typeof shape;     // returns "string"
+typeof size;      // returns "number"
+typeof today;     // returns "object"
+typeof dontExist; // returns "undefined"
+
+ +

For the keywords true and null, the typeof operator returns the following results:

+ +
typeof true; // returns "boolean"
+typeof null; // returns "object"
+
+ +

For a number or string, the typeof operator returns the following results:

+ +
typeof 62;            // returns "number"
+typeof 'Hello world'; // returns "string"
+
+ +

For property values, the typeof operator returns the type of value the property contains:

+ +
typeof document.lastModified; // returns "string"
+typeof window.length;         // returns "number"
+typeof Math.LN2;              // returns "number"
+
+ +

For methods and functions, the typeof operator returns results as follows:

+ +
typeof blur;        // returns "function"
+typeof eval;        // returns "function"
+typeof parseInt;    // returns "function"
+typeof shape.split; // returns "function"
+
+ +

For predefined objects, the typeof operator returns results as follows:

+ +
typeof Date;     // returns "function"
+typeof Function; // returns "function"
+typeof Math;     // returns "object"
+typeof Option;   // returns "function"
+typeof String;   // returns "function"
+
+ +

void

+ +

The void operator is used in either of the following ways:

+ +
void (expression)
+void expression
+
+ +

The void operator specifies an expression to be evaluated without returning a value. expression is a JavaScript expression to evaluate. The parentheses surrounding the expression are optional, but it is good style to use them.

+ +

You can use the void operator to specify an expression as a hypertext link. The expression is evaluated but is not loaded in place of the current document.

+ +

The following code creates a hypertext link that does nothing when the user clicks it. When the user clicks the link, void(0) evaluates to undefined, which has no effect in JavaScript.

+ +
Click here to do nothing
+
+ +

The following code creates a hypertext link that submits a form when the user clicks it.

+ +

+Click here to submit
+ +

Relational operators

+ +

A relational operator compares its operands and returns a Boolean value based on whether the comparison is true.

+ +

in

+ +

The in operator returns true if the specified property is in the specified object. The syntax is:

+ +
propNameOrNumber in objectName
+
+ +

where propNameOrNumber is a string or numeric expression representing a property name or array index, and objectName is the name of an object.

+ +

The following examples show some uses of the in operator.

+ +
// Arrays
+var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+0 in trees;        // returns true
+3 in trees;        // returns true
+6 in trees;        // returns false
+"bay" in trees;    // returns false (you must specify the index number,
+                   // not the value at that index)
+"length" in trees; // returns true (length is an Array property)
+
+// built-in objects
+"PI" in Math;          // returns true
+var myString = new String("coral");
+"length" in myString;  // returns true
+
+// Custom objects
+var mycar = { make: "Honda", model: "Accord", year: 1998 };
+"make" in mycar;  // returns true
+"model" in mycar; // returns true
+
+ +

instanceof

+ +

The instanceof operator returns true if the specified object is of the specified object type. The syntax is:

+ +
objectName instanceof objectType
+
+ +

where objectName is the name of the object to compare to objectType, and objectType is an object type, such as {{jsxref("Date")}} or {{jsxref("Array")}}.

+ +

Use instanceof when you need to confirm the type of an object at runtime. For example, when catching exceptions, you can branch to different exception-handling code depending on the type of exception thrown.

+ +

For example, the following code uses instanceof to determine whether theDay is a Date object. Because theDay is a Date object, the statements in the if statement execute.

+ +
var theDay = new Date(1995, 12, 17);
+if (theDay instanceof Date) {
+  // statements to execute
+}
+
+ +

Operator precedence

+ +

The precedence of operators determines the order they are applied when evaluating an expression. You can override operator precedence by using parentheses.

+ +

The following table describes the precedence of operators, from highest to lowest.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Operator precedence
Operator typeIndividual operators
member. []
call / create instance() new
negation/increment! ~ - + ++ -- typeof void delete
multiply/divide* / %
addition/subtraction+ -
bitwise shift<< >> >>>
relational< <= > >= in instanceof
equality== != === !==
bitwise-and&
bitwise-xor^
bitwise-or|
logical-and&&
logical-or||
conditional?:
assignment= += -= *= /= %= <<= >>= >>>= &= ^= |=
comma,
+ +

A more detailed version of this table, complete with links to additional details about each operator, may be found in JavaScript Reference.

+ +

Expressions

+ +

An expression is any valid unit of code that resolves to a value.

+ +

Every syntactically valid expression resolves to some value but conceptually, there are two types of expressions: with side effects (for example: those that assign value to a variable) and those that in some sense evaluate and therefore resolve to a value.

+ +

The expression x = 7 is an example of the first type. This expression uses the = operator to assign the value seven to the variable x. The expression itself evaluates to seven.

+ +

The code 3 + 4 is an example of the second expression type. This expression uses the + operator to add three and four together without assigning the result, seven, to a variable.
+
+ JavaScript has the following expression categories:

+ + + +

Primary expressions

+ +

Basic keywords and general expressions in JavaScript.

+ +

this

+ +

Use the this keyword to refer to the current object. In general, this refers to the calling object in a method. Use this either with the dot or the bracket notation:

+ +
this["propertyName"]
+this.propertyName
+
+ +

Suppose a function called validate validates an object's value property, given the object and the high and low values:

+ +
function validate(obj, lowval, hival){
+  if ((obj.value < lowval) || (obj.value > hival))
+    console.log("Invalid Value!");
+}
+
+ +

You could call validate in each form element's onChange event handler, using this to pass it the form element, as in the following example:

+ +

+
+

Enter a number between 18 and 99:

+ +

+ +

Grouping operator

+ +

The grouping operator ( ) controls the precedence of evaluation in expressions. For example, you can override multiplication and division first, then addition and subtraction to evaluate addition first.

+ +
var a = 1;
+var b = 2;
+var c = 3;
+
+// default precedence
+a + b * c     // 7
+// evaluated by default like this
+a + (b * c)   // 7
+
+// now overriding precedence
+// addition before multiplication
+(a + b) * c   // 9
+
+// which is equivalent to
+a * c + b * c // 9
+
+ +

Comprehensions

+ +

Comprehensions are an experimental JavaScript feature, targeted to be included in a future ECMAScript version. There are two versions of comprehensions:

+ +
+
{{experimental_inline}} {{jsxref("Operators/Array_comprehensions", "[for (x of y) x]")}}
+
Array comprehensions.
+
{{experimental_inline}} {{jsxref("Operators/Generator_comprehensions", "(for (x of y) y)")}}
+
Generator comprehensions.
+
+ +

Comprehensions exist in many programming languages and allow you to quickly assemble a new array based on an existing one, for example.

+ +
[for (i of [ 1, 2, 3 ]) i*i ];
+// [ 1, 4, 9 ]
+
+var abc = [ "A", "B", "C" ];
+[for (letter of abc) letter.toLowerCase()];
+// [ "a", "b", "c" ]
+ +

Left-hand-side expressions

+ +

Left values are the destination of an assignment.

+ +

new

+ +

You can use the new operator to create an instance of a user-defined object type or of one of the built-in object types. Use new as follows:

+ +
var objectName = new objectType([param1, param2, ..., paramN]);
+
+ +

super

+ +

The super keyword is used to call functions on an object's parent. It is useful with classes to call the parent constructor, for example.

+ +
super([arguments]); // calls the parent constructor.
+super.functionOnParent([arguments]);
+
+ +

Spread operator

+ +

The spread operator allows an expression to be expanded in places where multiple arguments (for function calls) or multiple elements (for array literals) are expected.

+ +

Example: Today if you have an array and want to create a new array with the existing one being part of it, the array literal syntax is no longer sufficient and you have to fall back to imperative code, using a combination of push, splice, concat, etc. With spread syntax this becomes much more succinct:

+ +
var parts = ['shoulder', 'knees'];
+var lyrics = ['head', ...parts, 'and', 'toes'];
+ +

Similarly, the spread operator works with function calls:

+ +
function f(x, y, z) { }
+var args = [0, 1, 2];
+f(...args);
+ +
{{PreviousNext("Web/JavaScript/Guide/Funktionen", "Web/JavaScript/Guide/Numbers_and_dates")}}
diff --git "a/files/de/web/javascript/guide/einf\303\274hrung/index.html" "b/files/de/web/javascript/guide/einf\303\274hrung/index.html" new file mode 100644 index 0000000000..b38cb1b700 --- /dev/null +++ "b/files/de/web/javascript/guide/einf\303\274hrung/index.html" @@ -0,0 +1,140 @@ +--- +title: Einführung +slug: Web/JavaScript/Guide/Einführung +tags: + - Beginner + - Guide + - Introduction + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Introduction +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammatik_und_Typen")}}
+ +

Dieses Kapitel stellt JavaScript vor und behandelt einige grundlegende Konzepte.

+ +

Was solltest du bereits wissen

+ +

Für diese Einführung solltest du die folgenden Grundkenntnisse besitzen:

+ + + +

Wo findest du Informationen zu JavaScript

+ +

Die Dokumentation zu JavaScript im MDN umfasst Folgendes:

+ + + +

Falls du dich das erste Mal mit JavaScript befasst, beginne einfach mit den Tutorials von Learning the Web [de] und dem JavaScript Guide [de]. Sobald du mit den ersten Grundlagen vertraut bist, kannst du die JavaScript Referenz [de] nutzen, um noch mehr über die einzelnen Methoden, Funktionen und Objekte von JavaScript zu erfahren.

+ +

Was ist JavaScript?

+ +

JavaScript ist eine plattformübergreifende, objektorientierte Skriptsprache. Es ist eine kompakte und ressourcenschonende Sprache. Innerhalb einer Host-Umgebung kann JavaScript mit den Objekten seiner Umgebung verknüpft werden, um diese programmatisch zu steuern.

+ +

JavaScript beinhaltet eine Standardbibliothek von Objekten wie Array, Date, und Math, sowie einen Kern an Sprachelementen wie Operatoren, Kontrollstrukturen und Anweisungen. Der JavaScript-Kern kann für eine Vielzahl von Anwendungsfällen erweitert werden, indem man ihn durch zusätzliche Objekte ergänzt. Beispiele:

+ + + +

JavaScript und Java

+ +

JavaScript und Java gleichen einander in manchen Aspekten, sind in anderen aber grundlegend verschieden. Die Sprache JavaScript ähnelt Java, verfügt jedoch nicht über Javas statische Typisierung und seine strenge Typprüfung. JavaScript folgt weitgehend der Ausdruckssyntax, den Namenskonventionen und den elementaren Kontrollstrukturen von Java, was der Grund für die Umbenennung von LiveScript in JavaScript gewesen ist.

+ +

Im Gegensatz zu Javas durch Deklarationen aufgebautes System, von zur Compile-Zeit verfügbaren Klassen, unterstützt JavaScript ein Laufzeitsystem, das auf einer kleinen Zahl an Datentypen basiert, die numerische und Boolesche Werte sowie Zeichenketten repräsentieren. JavaScript besitzt ein prototypen-basiertes Objektmodell anstatt des verbreiteteren klassenbasierten. Das prototypen-basierte Modell liefert dynamische Vererbung; das bedeutet, was vererbt wird, kann zwischen einzelnen Objekten variieren. JavaScript unterstützt zudem Funktionen ohne spezielle deklarative Anforderungen. Funktionen können Objekt Eigenschaften sein, ausgeführt als schwach typisierte Methoden.

+ +

JavaScript ist im Vergleich zu Java eine syntaktisch sehr freie Sprache. Sie müssen nicht alle Variablen, Klassen und Methoden deklarieren. Sie müssen sich nicht damit befassen, ob Methoden öffentlich, privat oder geschützt sind und Sie müssen keine Interfaces implementieren. Variablen, Parameter und Rückgabewerte von Funktionen sind nicht explizit typisiert.

+ +

Java ist eine auf schnelle Ausführung und Typsicherheit ausgelegte, klassenbasierte Programmiersprache. Typsicherheit bedeutet, dass Sie zum Beispiel keine Ganzzal in Java in eine Objektreferenz wandeln oder auf geschützten Speicher zugreifen können, indem Sie den Bytecode von Java manipulieren. Javas klassenbasiertes Modell bedeutet, dass Programme ausschließlich aus Klassen und ihren Methoden bestehen. Javas Klassenvererbung und strenge Typisierung erfordern im Allgemeinen eng gekoppelte Objekthierarchien. Wegen dieser Anforderungen ist das Programmieren in Java komplexer als in JavaScript.

+ +

Im Gegensatz dazu steht JavaScript in der Tradition einer Reihe kleiner, dynamisch typisierter Sprachen wie HyperTalk und dBase. Diese Skriptsprachen stellen, dank ihrer einfacheren Syntax, spezialisierter eingebauter Funktionalität und minimalen Anforderungen, für die Objektgenerierung Programmierwerkzeuge für einen deutlich breiteren Adressatenkreis zu Verfügung.

+ + + + + + + + + + + + + + + + + + + + + + + +
JavaScript im Vergleich zu Java
JavaScriptJava
Objektorientiert. Keine Unterscheidung zwischen Typen von Objekten. Vererbung mittels des Prototypen-Mechanismus, jedes beliebige Objekt kann dynamisch um Eigenschaften und Methoden erweitert werden.Klassenbasiert. Objekte werden in Klassen und Instanzen unterteilt, Vererbung erfolgt vollständig über die Klassenhierarchie. Klassen und Instanzen können keine Eigenschaften und Methoden dynamisch hinzugefügt werden.
Datentypen von Variablen werden nicht deklariert (dynamische Typisierung)Datentypen von Variablen müssen deklariert werden (statische Typisierung)
Kein automatischer Schreibzugriff auf die Festplatte.Kein automatischer Schreibzugriff auf die Festplatte.
+ +

Weitere Informationen zu den Unterschieden zwischen JavaScript und Java finden Sie im Kapitel Einzelheiten des Objektmodells.

+ +

JavaScript und die ECMAScript-Spezifikation

+ +

JavaScript wird durch Ecma International standardisiert — den europäischen Verband zur Standardisierung von Informations- und Telekommunikationssystemen (ECMA war vormals ein Akronym für 'European Computer Manufacturers Association'), um eine standardisierte, internationale Programmiersprache auf der Basis von JavaScript verfügbar zu machen. Diese standardisierte Version von JavaScript, genannt ECMAScript, verhält sich in allen standardkonformen Applikationen identisch. Unternehmen können die offene Sprachdefinition verwenden, um ihre eigene Implementierung von JavaScript zu entwickeln. Der ECMAScript-Standard ist in der Spezifikation ECMA-262 dokumentiert. Unter Neu in JavaScript erfahren Sie mehr über die unterschiedlichen Versionen von JavaScript und den ECMAScript-Spezifikationen.

+ +

ECMA-262 ist auch von der ISO (International Organization for Standardization) als ISO-16262 verabschiedet. Sie finden die Spezifikation auch auf der Website von Ecma International. Die Spezifikation von ECMAScript beschreibt nicht das Document Object Model (DOM), welches durch das World Wide Web Consortium (W3C) und der WHATWG (Web Hypertext Application Technology Working Group) standardisiert wird. Das DOM definiert die Art und Weise, in der HTML-Dokumentenobjekte für Ihr Skript sichtbar sind. Um ein besseres Verständnis der verschiedenen bei der Programmierung in JavaScript eingesetzten Technologien zu entwickeln, lesen Sie den Artikel JavaScript Technologieübersicht.

+ +

JavaScript-Dokumentation vs. ECMAScript-Spezifikation

+ +

Die Spezifikation von ECMAScript besteht aus Anforderungen an eine Implementierung von ECMAScript; sie ist zweckdienlich, falls Sie standardkonforme Spracheigenschaften in Ihrer ECMAScript-Implementierung oder ihrer Laufzeitumgebung (wie SpiderMonkey in Firefox oder v8 in Chrome) realisieren wollen.

+ +

Das ECMAScript-Dokument soll nicht den Skriptprogrammierer unterstützen; nutzen Sie für Informationen zum Erstellen von Skripten die JavaScript-Dokumentation.

+ +

Die ECMAScript-Spezifikation verwendet Terminologie und Syntax, mit der JavaScript-Programmierer möglicherweise nicht vertraut sind. Obwohl sich die Beschreibung der Sprache in ECMAScript unterscheiden kann, bleibt die Sprache selbst die gleiche. JavaScript unterstützt jede Funktionalität, die in der ECMAScript-Spezifikation genannt wird.

+ +

Die JavaScript-Dokumentation beschreibt Aspekte der Sprache in für JavaScript-Programmierer passender Form.

+ +

Erste Schritte mit JavaScript

+ +

Die ersten Schritte mit JavaScript sind einfach: alles was Sie brauchen, ist einen aktuellen Browser. Diese Einführung nimmt auf einige Spracheigenschaften von JavaScript Bezug, die zur Zeit nur in den jüngsten Versionen von Firefox verfügbar sind, somit wird die Nutzung der aktuellsten Firefox-Version empfohlen.

+ +

Es gibt zwei Werkzeuge in Firefox, die zum Experimentieren mit JavaScript nützliche sind: die Web-Konsole and die JavaScript-Umgebung.

+ +

Die Web-Konsole

+ +

Die Web-Konsole zeigt Ihnen Informationen zur aktuell geladenen Webseite an und beinhaltet zudem eine Kommandozeile, die Sie nutzen können, um JavaScript-Ausdrücke im Kontext der aktuellen Seite auszuführen.

+ +

Um die Web-Konsole zu öffnen (Ctrl+Shift+K), wählen Sie "Web-Konsole" im Menü "Entwicklerwerkzeuge", das Sie im Menü von Firefox finden. Die Konsole wird am unteren Rand des Browserfensters angezeigt. Entlang des unteren Randes der Konsole befindet sich die Kommandozeile, in der Sie JavaScript eingeben können; die zugehörige Ausgabe erscheint im darüberliegenden Fensterbereich:

+ +

+ +

JavaScript-Umgebung (Scratchpad)

+ +

Die Web-Konsole eignet sich hervorragend zur Ausführung einzelner Zeilen JavaScript, möchten Sie jedoch mehrere Zeilen ausführen können, ist das nicht besonders komfortabel und Ihren Beispielcode speichern können Sie mit der Web-Konsole auch nicht. Daher ist für komplexere Beispiele die JavaScript-Umgebung die bessere Wahl.

+ +

Um die JavaScript-Umgebung zu öffnen (Shift+F4), wählen Sie "JavaScript-Umgebung" aus dem Menü "Entwicklerwerkzeuge", das Sie im Firefox-Menü finden. Die JavaScript-Umgebung öffnet sich in einem eigenen Fenster als Editor, mit dem Sie JavaScript schreiben und im Browser ausführen können. Sie können auch Skripte auf der Festplatte speichern bzw. laden.

+ +

+ +

Hello world

+ +

Beginnen Sie mit dem Programmieren in JavaScript, indem Sie die JavaScript-Umgebung öffnen und Ihr erstes "Hello World"-Programm in JavaScript schreiben:

+ +
function greetMe(yourName) {
+  alert("Hello " + yourName);
+}
+
+greetMe("World");
+
+ +

Markieren Sie den Quelltext und drücken Sie Ctrl+R, um zu schauen, ob alles funktioniert.

+ +

Auf den folgenden Seiten macht Sie diese Einführung mit Syntax und Spracheigenschaften von JavaScript vertraut, sodass Sie bald komplexere Anwendungen schreiben können.

+ +

{{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammatik_und_Typen")}}

diff --git a/files/de/web/javascript/guide/feinheiten_des_objektmodells/index.html b/files/de/web/javascript/guide/feinheiten_des_objektmodells/index.html new file mode 100644 index 0000000000..4d5e46ac26 --- /dev/null +++ b/files/de/web/javascript/guide/feinheiten_des_objektmodells/index.html @@ -0,0 +1,721 @@ +--- +title: Feinheiten des Objektmodells +slug: Web/JavaScript/Guide/Feinheiten_des_Objektmodells +tags: + - Guide + - Intermediate + - JavaScript + - Object + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Mit_Objekten_arbeiten", "Web/JavaScript/Guide/Using_promises")}}
+ +

JavaScript ist eine Objektbasierte Programmiersprache, die auf Prototypen, statt auf Klassen basiert. Aufgrund dieser Tatsache ist es u. U. schwieriger zu erkennen, wie in JavaScript Objekthierarchien erstellt werden und die Vererbung von Eigenschaften und deren Werten erfolgt. Dieses Kapitel versucht diese Situation zu klären.

+ +

Dieses Kapitel geht davon aus, dass bereits Erfahrungen mit JavaScript vorhanden sind und man einfache Objekte mit Funktionen schon erstellt hat.

+ +

Klassenbasierte vs. Prototypbasierte Sprachen

+ +

Klassenbasierte, Objektorientierte Sprachen wie Java und C++ bauen auf dem Konzept von Klassen und Instanzen auf.

+ + + +

Eine Prototypbasierte Sprache wie JavaScript hat diese Unterscheidung nicht: es gibt einfach Objekte. Eine Prototypbasierte Sprache hat die Notation eines prototypischen Objektes, ein Objekt welches als Template genutzt wird und die initialen Eigenschaften für ein neues Objekt vorgibt. Jedes Objekt kann seine eigenen Eigenschaften spezifizieren, entweder beim Erstellen oder zur Laufzeit. Zudem kann jedes Objekt als Prototyp für ein anderes Objekt verwendet werden, was es auch dem zweiten Objekt erlaubt seine Eigenschaften mit dem ersten Objekt zu teilen.

+ +

Eine Klasse definieren

+ +

In einer Klassenbasierten Sprache definiert man Klassen in separaten Klassendefinitionen. In diesen Definitionen spezifiziert man spezielle Methoden, Konstruktoren genannt, um eine Instanz der Klasse zu erstellen. Eine Konstruktormethode spezifiziert Initialwerte für die Eigenschaften einer Instanz und kann andere Prozesse während der Erstellungszeit durchführen. Man benutzt den new Operator in Verbindung mit der Konstruktormethode, um Klasseninstanzen zu erstellen.

+ +

JavaScript folgt einem ähnlichen Modell, jedoch hat keine vom Konstruktor getrennte Klassendefinition. Stattdessen definiert man eine Konstruktorfunktion, um ein Objekt mit einer initialen Menge an Eigenschaften und Werten zu erstellen. Jede JavaScript Funktion kann als Konstruktor verwendet werden. Man benutzt den new Operator mit einer Konstruktorfunktion, um ein neues Objekt zu erstellen.

+ +

Unterklassen und Vererbung

+ +

In einer Klassenbasierten Sprache erstellt man eine Hierarchie von Klassen durch die Klassendefinition. In der Klassendefinition kann man spezifizieren, dass die neue Klasse eine Unterklasse der schon existierenden Klassen ist. Die Unterklasse erbt alle Eigenschaften von der Oberklasse und kann neue Eigenschaften hinzufügen oder vererbte verändern. Angenommen die Employee Klasse hat nur die Eigenschaften name und dept und Manager ist eine Unterklasse von Employee welche die Eigenschaft reports hinzufügt. In diesem Fall hat eine Instanz der Manager Klasse alle drei Eigenschaften: name, dept und reports.

+ +

JavaScript implementiert Vererbung so, dass man jedes Prototypobjekt mit jeder Konstruktorfunktion verbinden kann. So kann man das gleiche EmployeeManager Beispiel erstellen, jedoch mit einer leicht anderen Terminologie. Als erstes definiert man die Employee Konstruktorfunktion, welche die Eigenschaften name und dept spezifiziert. Als nächstes definiert man die Manager Konstruktorfunktion, ruft den Employee Konstruktor auf und spezifiziert die reports Eigenschaft. Letztlich weist man ein neues Objekt zu, welches von Employee.prototype stammt und als prototype für die Manager Konstruktorfunktion dient. Dann, wenn man einen neuen Manager erstellt, erbt dieser die Eigenschaften name und dept von dem Employee Objekt.

+ +

Hinzufügen und Entfernen von Eigenschaften

+ +

In Klassenbasierten Sprachen wird eine Klasse typischerweise zur Übersetzungszeit erstellt und Instanzen dieser Klasse werden zur Übersetzungs- oder Laufzeit instantiiert. Man kann die Anzahl oder die Typen von Eigenschaften einer Klasse nicht nach der Definition der Klasse verändern. In JavaScript kann man immer EIgenschaften während der Laufzeit zu Objekten hinzufügen oder von ihnen entfernen. Wenn eine Eigenschaft zu einem Objekt hinzugefügt wird, welches als Prototyp für andere Objekte fungiert, so bekommen die anderen Objekte auch diese neue Eigenschaft.

+ +

Zusammenfassung von Unterschieden

+ +

Die folgende Tabelle gibt eine kurze Zusammenfassung von einigen der Unterschiede. Der Rest des Kapitels beschreibt detailliert den Einsatz von JavaScript Konstruktoren und Prototypen, um eine Objekthierarchie zu erstellen und vergleicht dieses mit der Sprache Java.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Vergleich von Klassbasierten (Java) und Prototypebasierten (JavaScript) Objektsystemen
Klassenbasiert (Java)Prototypbasiert (JavaScript)
Klassen und Instanzen sind verschiedene Dinge.Alle Objekte können von anderen Objekt erben.
Definieren einer Klasse mit einer Klassendefinition; Instantiieren eine Klasse mit Konstruktormethoden.Definieren und Erstellen einer Menge von Objekten mit Konstruktorfunktionen.
Erstellt ein Objekt mit dem new Operator.Genauso.
Konstruiert eine Objekthierarchie mit Klassendefinitionen, um Unterklasse aus existierenden Klassen zu definieren.Konstruiert eine Objekthierarchie, indem ein Objekt als Prototyp mit einer Konstruktorfunktion verbunden werden.
Erbt Eigenschaften entlang der Klassenkette.Erbt Eigenschaften entlang der Prototypenkette.
Klassendefinitionen spezifizieren alle Eigenschaften von allen Klasseninstanzen. Man kann keine Eigenschaften dynamisch zur Laufzeit hinzufügen.Konstruktorfunktionen oder Prototypen spezifizieren eine initiale Menge von Eigenschaften. Man kann Eigenschaften dynamisch zu individuellen Objekten hinzufügen oder entfernen oder zu einer Menge von Objekten.
+ +

Das Mitarbeiter-Beispiel

+ +

Das restliche Kapitel benutzt die Mitarbeiterhierarchie, die in folgender Grafik dargestellt ist.

+ +
+
+

Eine einfache Objekthierarchie mit den folgenden Objekten:

+ +

+
+ +
+
    +
  • Employee (Mitarbeiter) hat die Eigenschafte name (die als Initialwert einen leerer String hat) und dept (Abteilung) (die als Initialwert "general" hat).
  • +
  • Manager basiert auf Employee. Er fügt die Eigenschaft reports (Berichte) hinzu (die als Initialwert ein leeres Array hat und für ein Array von Employees vorgesehen ist).
  • +
  • WorkerBee (Arbeitsbiene) basiert ebenfalls auf Employee. Er fügt die Eigenschaft projects hinzu (die als Initialwert ein leeres Array hat und für ein Array von Strings vorgesehen ist).
  • +
  • SalesPerson (Verkäufer) basiert auf WorkerBee. Er fügt die Eigenschaft quota (Pensum) hinzu (die als Initialwert 100 hat). zudem überschreibt er die dept Eigenschaft mit dem Wert "sales", um anzudeuten, dass alle Verkäufer in der gleichen Abteilung sind.
  • +
  • Engineer (Ingenieur) basiert auf WorkerBee. Er fügt die Eigenschaft machine (Maschine) hinzu (die als Initialwert einen leeren String hat) und überschreibt die Eigenschaft dept mit dem Wert "engineering".
  • +
+
+
+ +

Erstellen der Hierarchie

+ +

Es gibt viele Wege, um angemessene Konstruktorfunktionen für die Mitarbeiterhierarchie zu implementieren. Welchen man auswählt hängt stark davon ab, was in der Anwendung erreicht werden soll.

+ +

Dieser Abschnitt zeigt, wie man eine sehr einfache (und vergleichbar unflexible) Definition benutzen kann, um zu demonstrieren, wie die Vererbung funktioniert. In dieser Definition ist es nicht möglich jeden Eigenschaftswert zu spezifizieren, wenn ein Objekt erstellt wird. Die neu erstellten Objekte bekommen nur die Initialwerte und können später verändert werden.

+ +

In einer echten Anwendung würde man Konstruktoren so definieren, dass man diesen Eigenschaftswerte zur Erstellzeit übergeben kann (siehe Flexiblere Konstruktoren für mehr Informationen). Für den Anfang zeigen diese Definitionen wie die Vererbung funktioniert.

+ +

Die folgenden Java und JavaScript Employee Definitionen sind gleich. Der einzige Unterschied ist, dass in Java für jede Eigenschaft ein Typ definiert sein muss, in JavaScript jedoch nicht (das liegt daran, dass Java eine stark typisierte Sprache ist, während JavaScript eine schwach typisierte Sprache ist).

+ +
+

JavaScript

+ +
function Employee() {
+  this.name = '';
+  this.dept = 'general';
+}
+
+ +


+ Java

+ +
public class Employee {
+   public String name = "";
+   public String dept = "general";
+}
+
+
+ +

Die Manager und WorkerBee Definitionen zeigen die Unterschiede bei der Spezifizierung eines Oberobjektes in der Vererbungskette. In JavaScript fügt man eine Prototypinstanz der Eigenschaft prototype der Konstruktorfunktion hinzu. Man kann dieses zu jedem Zeitpunkt nach der Definition des Konstruktors machen. In Java spezifiziert man die Oberklasse in der Klassendefinition. Man kann die Oberklasse nicht außerhalb der Klassendefinition ändern.

+ +
+

JavaScript

+ +
function Manager() {
+  Employee.call(this);
+  this.reports = [];
+}
+Manager.prototype =
+    Object.create(Employee.prototype);
+
+function WorkerBee() {
+  Employee.call(this);
+  this.projects = [];
+}
+WorkerBee.prototype =
+    Object.create(Employee.prototype);
+
+ +


+ Java

+ +
public class Manager extends Employee {
+   public Employee[] reports =
+       new Employee[0];
+}
+
+
+
+public class WorkerBee extends Employee {
+   public String[] projects = new String[0];
+}
+
+
+
+
+ +

Die Engineer und SalesPerson Definition erstellt Objekte, welche von WorkerBee und somit auch von Employee abstammen. Ein Objekt von diesen Typen hat alle Eigenschaften der vorherigen Objekte in der Vererbungskette. Zudem überschreiben diese Definitionen den Wert der geerbten dept Eigenschaft mit einem neuen Wert für diese Objekte.

+ +
+

JavaScript

+ +
function SalesPerson() {
+   WorkerBee.call(this);
+   this.dept = 'sales';
+   this.quota = 100;
+}
+SalesPerson.prototype =
+    Object.create(WorkerBee.prototype);
+
+function Engineer() {
+   WorkerBee.call(this);
+   this.dept = 'engineering';
+   this.machine = '';
+}
+Engineer.prototype =
+    Object.create(WorkerBee.prototype);
+
+ +


+ Java

+ +
public class SalesPerson extends WorkerBee {
+   public String dept = "sales";
+   public double quota = 100.0;
+}
+
+
+public class Engineer extends WorkerBee {
+   public String dept = "engineering";
+   public String machine = "";
+}
+
+
+
+ +

Mit diesen Definitionen kann man Instanzen dieser Objekte mit ihren Initialwerten und Eigenschaften erstellen. Die nächste Grafik zeigt diese JavaScript Definitionen, um neue Objekte zu erzeugen und die Werte der neuen Objekte.

+ +
+

Hinweis: Der Term Instanz hat eine spezielle technische Bedeutung in Klassenbasierten Sprachen. In diesen Sprachen ist eine Instanz eine individuelle Instanz von einer Klasse und ist fundamental anders als eine Klasse. In JavaScript gibt es diese technische Bedeutung nicht, weil JavaScript nicht zwischen Klassen und Instanzen unterscheidet. Immer wenn über JavaScript Instanzen gesprochen wird, ist das rein informell und bedeutet, dass ein Objekte mit einer Konstruktorfunktion erstellt wurde. So kann man in diesem Beispiel sagen, dass jane eine Instanz von Engineer ist. Ebenso haben die Terme Eltern, Kind, Vorfahre und Nachfahre keine formale Bedeutung in JavaScript; Man kann diese benutzen, um deutlich zu machen wo sich ein Objekt in der Prototypenkette befindet.

+
+ +

Objekte mit der einfachen Definition erstellen

+ +
+

Objekthierarchie

+ +

Die folgende Hierarchie wird mit dem Code auf der rechten Seite erstellt.

+ +

+ +

Individuelle Objekte = Jim, Sally, Mark, Fred, Jane, etc.
+ "Instanzen" erstellt vom Konstruktor

+ +
var jim = new Employee;
+// Parentheses can be omitted if the
+// constructor takes no arguments.
+// jim.name is ''
+// jim.dept is 'general'
+
+var sally = new Manager;
+// sally.name is ''
+// sally.dept is 'general'
+// sally.reports is []
+
+var mark = new WorkerBee;
+// mark.name is ''
+// mark.dept is 'general'
+// mark.projects is []
+
+var fred = new SalesPerson;
+// fred.name is ''
+// fred.dept is 'sales'
+// fred.projects is []
+// fred.quota is 100
+
+var jane = new Engineer;
+// jane.name is ''
+// jane.dept is 'engineering'
+// jane.projects is []
+// jane.machine is ''
+
+
+ +

Objekteigenschaften

+ +

Dieser Abschnitt diskutiert, wie Objekte EIgenschaften von anderen Objekten in der Prototypenkette erben und was passiert, wenn eine Eigenschaft währende der Laufzeit hinzugefügt wird.

+ +

Eigenschaften vererben

+ +

Es wird vorausgesetzt, dass das Objekt mark als WorkerBee mit dem folgenden Statement erstellt wurde:

+ +
var mark = new WorkerBee;
+
+ +

Wenn JavaScript den new Operator sieht, erstellt es ein neues generisches Objekt und setzt implizit den Wert der internen Eigenschaft [[Prototype]] auf den Wert WorkerBee.prototype und setzt die this Referenz in der WorkerBee Konstruktorfunktion auf das neu erstellte Objekt. Die interne [[Prototype]] Eigenschaft legt die Prototypenkette fest, die zum Zurückgeben von Eigenschaftswerten benutzt wird. Sobald diese Eigenschaften gesetzt sind, gibt JavaScript das neue Objekt zurück und das Zuweisungsstatement setzt die Variable mark mit diesem Objekt.

+ +

Dieser Prozess fügt keine Werte in das mark-Objekt (lokale Werte) für Eigenschaften, die mark von der Prototypenkette erbt. Wenn man nach einem Wert einer Eigenschaft fragt, prüft JavaScript erst, ob der Wert in dem Objekt existiert. Wenn dies der Fall ist, wird dieser zurückgegeben. Wenn kein lokaler Wert vorhanden ist, prüft JavaScript die Prototypenkette (über die interne [[Prototype]] Eigenschaft). Wenn ein Objekt in der Prototypenkette einen Wert für die Eigenschaft hat, wird diese zurückgegeben. Wenn keine solche Eigenschaft gefunden wird, geht JavaScript davon aus, dass das Objekt keine solche Eigenschaft hat. Dementsprechend hat das mark Objekt folgende Eigenschaften und Werte:

+ +
mark.name = '';
+mark.dept = 'general';
+mark.projects = [];
+
+ +

Das mark Objekt hat lokale Werte für die name und dept Eigenschaft über den Employee Konstruktor zugewiesen bekommen. Es wurde ein Wert für die Eigenschaft projects vom WorkerBee Konstruktor zugewiesen. Dieses gibt die Vererbung von Eigenschaften und Werten in JavaScript her. Einige Feinheiten dieses Prozesses werden in Eigenschaftsvererbung erneut besuchen behandelt.

+ +

Weil diese Konstruktoren keine instanzspezifischen Werte bereitstellen können, sind diese Informationen generisch. Die Eigenschaftswerte sind die Standardwerte, die bei der Erstellung aller mit WorkerBee erstellten Objekt genutzt werden. Man kann natürlich die Werte jeder Eigenschaft ändern. So kann man spezifische Informationen für mark wie folgt vergeben:

+ +
mark.name = 'Doe, Mark';
+mark.dept = 'admin';
+mark.projects = ['navigator'];
+ +

Eigenschaften hinzufügen

+ +

In JavaScript kann man zu jedem Objekt zur Laufzeit Eigenschaften hinzufügen. Man ist nicht nur auf die unterstützten Eigenschaften der Konstruktorfunktion angewiesen. Um eine Eigenschaft spezifisch zu einem einfachen Objekt hinzuzufügen, kann man diese wie folgt dem Objekt zuweisen:

+ +
mark.bonus = 3000;
+
+ +

Jetzt hat das mark Objekt eine bonus Eigenschaft, aber kein anderer WorkerBee hat diese Eigenschaft.

+ +

Wenn man eine neue Eigenschaft zu einem Objekt hinzufügt, welches als Prototyp für eine Konstruktorfunktion benutzt wird, fügt man die Eigenschaft zu allen Objekten hinzu, die Eigenschaften von diesem Prototypen erben. Zum Beispiel kann man eine specialty Eigenschaft zu allen employees mit dem folgenden Statement hinzufügen:

+ +
Employee.prototype.specialty = 'none';
+
+ +

Nach der Ausführung dieses Statements durch JavaScript, hat das mark Objekt auch die specialty Eigenschaft mit dem Wert "none". Die folgende Grafik zeigt den Effekt des Hinzufügens dieser Eigenschaft zum Employee Prototyp und das Überschreiben des Engineer Prototypen.

+ +


+ Eigenschaften hinzufügen

+ +

Flexiblere Konstruktoren

+ +

Mit den bisher gezeigten Konstruktorfunktionen kann man beim Erstellen einer Instanz keine Eigenschaftswerte angeben. Wie bei Java kann man Konstruktoren Argumente zum Initialisieren von Eigenschaftswerten für Instanzen übergeben. Die folgende Abbildung zeigt eine Möglichkeit, dies zu tun.

+ +


+ Spezifizieren von Eigenschaften in einem Konstruktor, Teil 1

+ +

Die folgende Tabelle zeigt die Java und JavaScript Definitionen für diese Objekte.

+ +
+

JavaScript

+ +

Java

+
+ +
+
function Employee(name, dept) {
+  this.name = name || '';
+  this.dept = dept || 'general';
+}
+
+ +
public class Employee {
+   public String name;
+   public String dept;
+   public Employee () {
+      this("", "general");
+   }
+   public Employee (String name) {
+      this(name, "general");
+   }
+   public Employee (String name, String dept) {
+      this.name = name;
+      this.dept = dept;
+   }
+}
+
+
+ +
+
function WorkerBee(projs) {
+
+ this.projects = projs || [];
+}
+WorkerBee.prototype = new Employee;
+
+ +
public class WorkerBee extends Employee {
+   public String[] projects;
+   public WorkerBee () {
+      this(new String[0]);
+   }
+   public WorkerBee (String[] projs) {
+      projects = projs;
+   }
+}
+
+
+ +
+
+function Engineer(mach) {
+   this.dept = 'engineering';
+   this.machine = mach || '';
+}
+Engineer.prototype = new WorkerBee;
+
+ +
public class Engineer extends WorkerBee {
+   public String machine;
+   public Engineer () {
+      dept = "engineering";
+      machine = "";
+   }
+   public Engineer (String mach) {
+      dept = "engineering";
+      machine = mach;
+   }
+}
+
+
+ +

Diese JavaScript Definitionen benutzen eine spezielle Syntax für das Setzen von Standardwerten:

+ +
this.name = name || '';
+
+ +

Der logische ODER Operator (||) von JavaScript wertet das erste Argument aus. Wenn das Argument zu true konvertiert wird, gibt der Operator dieses zurück. Andernfalls wird der Wert des zweiten Arguments zurückgegeben. Demnach prüft diese Zeile Code, ob name einen nützlichen Wert für die name Eigenschaft hat. Wenn das der Fall ist, wird this.name auf diesen Wert gesetzt. Andernfalls wird this.name auf den leeren String gesetzt. Dieses Kapitel nutzt diese Syntax aus Gründen der Kürze; es kann jedoch auf den ersten Blick verwirrend sein.

+ +
+

Hinweis: Das kann möglicherweise nicht wie erwartet funktionieren, wenn der Konstruktorfunktion Argumente übergeben werden, welche zu false konvertiert werden (wie 0 (null) und der leere String ("")). In diesen Fällen wird der Standardwert benutzt.

+
+ +

Mit dieser Definition, kann man beim Erstellen einer Objektinstanz spezifische Werte für die lokal definierten Eigenschaften benutzen. Man kann das folgende Statement nutzen, um einen neuen Engineer zu erstellen:

+ +
var jane = new Engineer('belau');
+
+ +

Jane's Eigenschaften sind jetzt:

+ +
jane.name == '';
+jane.dept == 'engineering';
+jane.projects == [];
+jane.machine == 'belau';
+
+ +

Zu beachten ist, dass man mit diesen Definitionen keinen Initialwert für vererbte Eigenschaft wie name spezifizieren kann. Wenn man einen Initialwert für vererbe Eigenschaften in JavaScript spezifizieren möchte, muss man mehr Code zum Konstruktor hinzufügen.

+ +

Bisher hat die Konstruktorfunktion ein generisches Objekt erstellt und dann lokale Eigenschaften und Werte für das neue Objekt angegeben. Man kann den Konstruktor weitere Eigenschaften hinzufügen lassen, indem Sie die Konstruktorfunktion für ein Objekt in der Prototypkette direkt aufrufen. Die folgende Abbildung zeigt diese neuen Definitionen.

+ +


+ Spezifizieren von Eigenschaften in einem Konstruktor, Teil 2

+ +

Sehen wir uns eine dieser Definitionen genauer an. Hier ist die neue Definition für den Engineer-Konstruktor:

+ +
function Engineer(name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, 'engineering', projs);
+  this.machine = mach || '';
+}
+
+ +

Angenommen, man erstellt ein neues Engineer-Objekt wie folgt:

+ +
var jane = new Engineer('Doe, Jane', ['navigator', 'javascript'], 'belau');
+
+ +

JavaScript folgt folgenden Schritten:

+ +
    +
  1. Der new Operator erstellt ein generisches Objekt und setzt die __proto__ EIgenschaft auf Engineer.prototype.
  2. +
  3. Der new Operator übergibt das neue Objekt dem Engineer Konstruktor als Wert des this Schlüsselwortes.
  4. +
  5. Der Konstruktor erstellt eine neue Eigenschaft namens base für dieses Objekt und weist dieser den Wert des WorkerBee Konstruktors zu. Das macht den WorkerBee Konstruktor zu einer Methode des Engineer Objektes. Der Name der base Eigenschaft ist nicht festgelegt. Man kann jeden legalen Eigenschaftsnamen nutzen; base erinnert einfach an den Zweck.
  6. +
  7. Der Konstruktor ruft die base Methode auf, übergibt als Argumente zwei der Argumente des Konstruktors ("Doe, Jane" und ["navigator", "javascript"]) und zudem den String "engineering". Der explizite Einsatz von "engineering" im Konstruktor zeigt, dass alle Engineer Objekte den selben Wert für dei geerbte dept Eigenschaft haben und dieser Wert den vererbten Wert von Employee überschreibt.
  8. +
  9. Weil base eine Methode von Engineer ist, weshalb JavaScrip beim Aufruf von base das Schlüsselwort this an das erstellte Objekt aus Schritt 1 bindet. Somit übergibt die WorkerBee Funktion die "Doe, Jane" und "engineering" Argumente zu der Employee Konstruktorfunktion. Nach der Rückgabe der Employee Konstruktorfunktion verwendet die WorkerBee Funktion das restliche Argument, um die projects Eigenschaft zu setzen.
  10. +
  11. Nach der Rückgabe der base Methode initialisiert der Engineer Konstruktor die Objekteigenschaft machine mit "belau".
  12. +
  13. Nach der Rückgabe des Konstruktors weist JavaScript das neue Objekte, der jane Variablen zu.
  14. +
+ +

Man kann denken, dass man, nachdem der WorkerBee-Konstruktor innerhalb des Engineer-Konstruktors aufgerufen wird, die Vererbung für das Engineer-Objekte entsprechend eingerichtet hat. Das ist nicht der Fall. Der Aufruf des WorkerBee Konstruktors stellt sicher, dass ein Engineer Objekt mit den Eigenschaften beginnt, die in allen aufgerufenen Konstruktorfunktionen angegeben sind. Wenn jedoch später eine Eigenschaft zum Employee oder WorkerBee Prototyp hinzugefügt wird, wird diese Eigenschaft nicht von Engineer Objekt geerbt. Nimmt man zum Beispiel folgende Statements an:

+ +
function Engineer(name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, 'engineering', projs);
+  this.machine = mach || '';
+}
+var jane = new Engineer('Doe, Jane', ['navigator', 'javascript'], 'belau');
+Employee.prototype.specialty = 'none';
+
+ +

Das jane Objekt erbt nicht die specialty Eigenschaft. Man muss explizit den Prototypen einstellen, um dynamische Vererbung sicherzustellen. Nimmt man stattdessen folgende Statements an:

+ +
function Engineer(name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, 'engineering', projs);
+  this.machine = mach || '';
+}
+Engineer.prototype = new WorkerBee;
+var jane = new Engineer('Doe, Jane', ['navigator', 'javascript'], 'belau');
+Employee.prototype.specialty = 'none';
+
+ +

Jetzt ist der Wert der specialty Eigenschaft des jane Objektes "none".

+ +

Ein anderer Weg wür Vererbung ist der Einsatz der call() / apply() Methoden. Die folgenden Beispiele sind äquivalent:

+ +
+
function Engineer(name, projs, mach) {
+  this.base = WorkerBee;
+  this.base(name, 'engineering', projs);
+  this.machine = mach || '';
+}
+
+ +
function Engineer(name, projs, mach) {
+  WorkerBee.call(this, name, 'engineering', projs);
+  this.machine = mach || '';
+}
+
+
+ +

Der Einsatz von javascript call() Methode ergibt ein sauberere Implementierung, weil base nicht mehr benötigt wird.

+ +

Eigenschaftsvererbung erneut besuchen

+ +

Im vorangegangenen Abschnitten wurde beschrieben, wie JavaScript Konstruktoren und Prototypen Hierarchien und Vererbung bereitstellt. Dieser Abschnitt diskutiert einige Feinheiten, die in der vorherigen Diskussion nicht unbedingt ersichtlich waren.

+ +

Lokale versus vererbte Werte

+ +

Wenn man auf eine Objekteigenschaft zugreift, führt JavaScript diese Schritte, wie vorhin in dem Kapitel beschrieben, durch:

+ +
    +
  1. Prüft, ob der Wert lokal existiert. Ist das der Fall, wird er zurückgegeben.
  2. +
  3. Wenn kein lokaler Wert vorhanden ist, wird die Prototypenkette (über die __proto__ Eigenschaft) geprüft.
  4. +
  5. Wenn ein Objekt in der Prototypenkette einen Wert für die spezifizierte Eigenschaft hat, wird dieser zurückgegeben.
  6. +
  7. Wenn keine solche Eigenschaft gefunden wird, hat das Objekt diese Eigenschaft nicht.
  8. +
+ +

Das Resultat dieser Schritte hängt davon ab, wie Dinge im Code definiert sind. Das originale Beispiel hat diese Definition:

+ +
function Employee() {
+  this.name = '';
+  this.dept = 'general';
+}
+
+function WorkerBee() {
+  this.projects = [];
+}
+WorkerBee.prototype = new Employee;
+
+ +

Nimmt man mit diesen Definitionen an, man erstellt amy als eine Instanz von WorkerBee mit folgendem Statement:

+ +
var amy = new WorkerBee;
+
+ +

Das amy Objekt hat eine lokale Eigenschaft, projects. Die Werte der name und dept Eigenschaften sind nicht lokal in amy und werden über die Objekteigenschaft __proto__ von amy erreicht. Deshalb hat amy diese Eigenschaftswerte:

+ +
amy.name == '';
+amy.dept == 'general';
+amy.projects == [];
+
+ +

Nimmt man jetzt an, man ändert den Wert der name Eigenschaft in dem Employee Prototyp:

+ +
Employee.prototype.name = 'Unknown';
+
+ +

Auf den ersten Blick erwartet man, dass der neue Wert an alle Instanzen von Employee propagiert wird. Jedoch ist das falsch.

+ +

Wenn man irgendeine Instanz des Employee Objektes erstellt, bekommt die Instanz einen lokalen Wert für die name Eigenschaft (der leere String). Das bedeutet, wenn man den WorkerBee Prototyp mit einem neuen Employee Objekt einstellt, dass WorkerBee.prototype einen lokalen Wert für die name Eigenschaft hat. Wenn demnach JavaScript nach der name Eigenschaft im amy Objekt sucht (eine Instanz von WorkerBee), wird der lokale Wert der Eigenschaft WorkerBee.prototype gefunden. Demnach wird nicht tiefer in der Kette in Employee.prototype gesucht.

+ +

Wenn man den Wert einer Objekteigenschaft zur Laufzeit ändert möchte und den neuen Wert für alle Nachkommenschaften dieses Objektes haben möchte, kann man die Eigenschaft nicht in der Konstruktorfunktion des Objektes definieren. Stattdessen fügt man sie zu dem Konstruktor assoziierten Prototyp hinzu. Angenommen man ändert zum Beispiel deb vorherigen Code wie folgt:

+ +
function Employee() {
+  this.dept = 'general';    // Note that this.name (a local variable) does not appear here
+}
+Employee.prototype.name = '';    // A single copy
+
+function WorkerBee() {
+  this.projects = [];
+}
+WorkerBee.prototype = new Employee;
+
+var amy = new WorkerBee;
+
+Employee.prototype.name = 'Unknown';
+
+ +

In diesem Fall wird die name Eigenschaft von amy "Unknown".

+ +

Das Beispiel zeigt, dass wenn man Standardwerte für Objekteigenschaften haben möchte und zudem dass diese zur Laufzeit geändert werden können, muss man die Eigenschaft im Konstruktorprototypen setzen und nicht in der Konstruktorfunktion.

+ +

Instanzbeziehungen prüfen

+ +

Das Nachgucken von Eigenschaften in JavaScript prüft erst die eigenen Eigenschaften und wenn die Eigenschaft dort nicht ist die Eigenschaften der speziellen Eigenschaft __proto__. Das setzt sich rekursiv fort; der Prozess wird "nachschlagen in der Prototypenkette" genannt.

+ +

Die spezielle Eigenschaft __proto__ wird beim erstellen des Objektes gesetzt; sie wird auf den Wert der prototype Eigenschaft des Konstruktors gesetzt. Deshalb erstellt der Ausdruck new Foo() ein Objekt mit __proto__ == Foo.prototype. Folglich ändert die Änderung der Foo.prototype Eigenschaft alle Nachschlage Prozesse für alle Objekte, die mit new Foo() erstellt wurden.

+ +

Alle Objekte haben eine __proto__ Objekteigenschaft (außer Object); Alle Funktionen haben eine prototype Objekteigenschaft. So können Objekte über 'Prototypenvererbung' mit anderen Objekten verbunden werden. Man kann auf Vererbung testen, indem __proto__ eines Objekts mit einer prototype Objekt einer Funktion verglichen wird. JavaScript hat dafür eine Kurzschreibweise: der instanceof Operator prüft ein Objekt gegen eine Funktion und gibt true zurück, wenn das Objekt von dem Funktionsprototyp erbt. Zum Beispiel:

+ +
var f = new Foo();
+var isTrue = (f instanceof Foo);
+ +

Für ein detailierteres Beispiel nehmen wir an, dass wir die gleichen Definition wie in Eigenschaften vererben haben. Ein Engineer wird wie folgt erstellt:

+ +
var chris = new Engineer('Pigman, Chris', ['jsd'], 'fiji');
+
+ +

Mit diesem Objekt, sind alle folgenden Statements true:

+ +
chris.__proto__ == Engineer.prototype;
+chris.__proto__.__proto__ == WorkerBee.prototype;
+chris.__proto__.__proto__.__proto__ == Employee.prototype;
+chris.__proto__.__proto__.__proto__.__proto__ == Object.prototype;
+chris.__proto__.__proto__.__proto__.__proto__.__proto__ == null;
+
+ +

Damit kann man eine instanceOf Funktion wie folgt schreiben:

+ +
function instanceOf(object, constructor) {
+   object = object.__proto__;
+   while (object != null) {
+      if (object == constructor.prototype)
+         return true;
+      if (typeof object == 'xml') {
+        return constructor.prototype == XML.prototype;
+      }
+      object = object.__proto__;
+   }
+   return false;
+}
+
+ +
Hinweis: Die obige Implementierung überprüft den Typ des Objekts gegen "xml", um eine Eigenart der Darstellung von XML-Objekten in neueren JavaScript-Versionen zu umgehen. die wesentlichen Details sind in {{bug(634150)}}, beschrieben.
+ +

Der Einsatz der oben definierten instanceOf Funktion führt bei folgenden Ausdrücken zu true:

+ +
instanceOf(chris, Engineer)
+instanceOf(chris, WorkerBee)
+instanceOf(chris, Employee)
+instanceOf(chris, Object)
+
+ +

Jedoch ist der folgende Ausdruck false:

+ +
instanceOf(chris, SalesPerson)
+
+ +

Globale Informationen in Konstruktoren

+ +

Wenn man einen Konstruktor erstellt, muss man vorsichtig sein, wenn man globale Informationen im Konstruktor einstellt. Nimmt man zum Beispiel an, man möchte eine eindeutige ID, die automatisch für jeden neuen employee zugewiesen wird, kann man die folgende Definition für Employee benutzen:

+ +
var idCounter = 1;
+
+function Employee(name, dept) {
+   this.name = name || '';
+   this.dept = dept || 'general';
+   this.id = idCounter++;
+}
+
+ +

Wenn man mit dieser Definition ein neuen Employee erstellt, weist der Konstruktor die nächste ID in der Sequenz zu und inkrementiert dann den globalen ID-Zähler. Wenn die nächsten Statemants die folgenden sind, so ist victoria.id == 1 und harry.id == 2:

+ +
var victoria = new Employee('Pigbert, Victoria', 'pubs');
+var harry = new Employee('Tschopik, Harry', 'sales');
+
+ +

Auf den ersten Blick ist das super. Jedoch wird idCounter jedes mal, wenn ein Employee erstellt wird, wofür auch immer, inkrementiert. Wenn man eine Employee Hierarchie wie im Kapitel oben gezeigt, so wird der Employee Konstruktor für jedes einstellen des Prototypen aufgerufen. Angenommen man hat den folgenden Code:

+ +
var idCounter = 1;
+
+function Employee(name, dept) {
+   this.name = name || '';
+   this.dept = dept || 'general';
+   this.id = idCounter++;
+}
+
+function Manager(name, dept, reports) {...}
+Manager.prototype = new Employee;
+
+function WorkerBee(name, dept, projs) {...}
+WorkerBee.prototype = new Employee;
+
+function Engineer(name, projs, mach) {...}
+Engineer.prototype = new WorkerBee;
+
+function SalesPerson(name, projs, quota) {...}
+SalesPerson.prototype = new WorkerBee;
+
+var mac = new Engineer('Wood, Mac');
+
+ +

Angenommen die Definitionen lassen hier die base Eigenschaft weg und rufen den Konstruktor oberhalb in der Prototypenkette auf. In diesem Fall, bekommt das mac Objekt die id 5.

+ +

Abhängig von der Anwendung ist es sinnvoll oder auch nicht, dass der Zähler an diesen Stellen extra hochzählt. Wenn man an dem exakten Wert des Zählers interessiert ist, ist eine mögliche Lösung den folgenden Konstruktor zu nutzen:

+ +
function Employee(name, dept) {
+   this.name = name || '';
+   this.dept = dept || 'general';
+   if (name)
+      this.id = idCounter++;
+}
+
+ +

Wenn eine Instanz von Employee erstellt wird, der als Prototyp genutzt wird, übergibt man keine Argumente an den Konstruktor. Benutzt man diese Definition des Konstruktors, wird keine id vergeben und der Zäher nicht aktualisiert, wenn dem Konstruktor keine Argumente übergeben werden. Daraus folgt, dass man einem Employee einen Namen geben muss, damit er eine id erhält. In diesem Beispiel ist mac.id == 1.

+ +

Alternativ kann man WorkerBee eine Kopie des Employee Prototypenobjektes zuweisen:

+ +
WorkerBee.prototype = Object.create(Employee.prototype);
+// instead of WorkerBee.prototype = new Employee
+
+ +

Keine Mehrfachvererbung

+ +

Einige objektorientierte SPrachen erlauben Mehrfachvererbung. Das bedeutet, dass ein Objekt die Eigenschaften und Werte von mehreren Elternobjekte erben kann. JavaScript unterstützt keine Mehrfachvererbung.

+ +

Vererbung von Eigenschafteswerten funktioniert zu JavaScripts Laufzeit durch das Suchen in der Prototypenkette eines Objektes. Weil ein Objekt ein einzigen Prototypen hat, kann JavaScript nicht dynamisch von mehr als einer Prototypenkette erben.

+ +

In JavaScript kann eine Konstruktorfunkton mehrere andere Konstruktorfunktionen in sich aufrufen. Das gibt die Illusion von Mehrfachvererbung. Zum Beispiel die folgenden Statements:

+ +
function Hobbyist(hobby) {
+   this.hobby = hobby || 'scuba';
+}
+
+function Engineer(name, projs, mach, hobby) {
+   this.base1 = WorkerBee;
+   this.base1(name, 'engineering', projs);
+   this.base2 = Hobbyist;
+   this.base2(hobby);
+   this.machine = mach || '';
+}
+Engineer.prototype = new WorkerBee;
+
+var dennis = new Engineer('Doe, Dennis', ['collabra'], 'hugo');
+
+ +

Vorausgesetzt wird, die Definition von WorkerBee früher in diesem Kapitel. In diesem Fall hat das dennis Objekt die folgenden Eigenschaften:

+ +
dennis.name == 'Doe, Dennis';
+dennis.dept == 'engineering';
+dennis.projects == ['collabra'];
+dennis.machine == 'hugo';
+dennis.hobby == 'scuba';
+
+ +

dennis hat also die hobby Eigenschaften des Hobbyist Konstruktors bekommen. Setzt man jetzt noch voraus, dass danach Eigenschaften zum Konstruktorprototypen Hobbyist hinzugefügt werde:

+ +
Hobbyist.prototype.equipment = ['mask', 'fins', 'regulator', 'bcd'];
+
+ +

Das dennis Objekt erbt diese neue Eigenschaft nicht.

+ +
{{PreviousNext("Web/JavaScript/Guide/Mit_Objekten_arbeiten", "Web/JavaScript/Guide/Using_promises")}}
diff --git a/files/de/web/javascript/guide/funktionen/index.html b/files/de/web/javascript/guide/funktionen/index.html new file mode 100644 index 0000000000..3eeeb4f4e5 --- /dev/null +++ b/files/de/web/javascript/guide/funktionen/index.html @@ -0,0 +1,657 @@ +--- +title: Funktionen +slug: Web/JavaScript/Guide/Funktionen +tags: + - Beginner + - Functions + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Functions +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Schleifen_und_Iterationen", "Web/JavaScript/Guide/Ausdruecke_und_Operatoren")}}
+ +

Funktionen sind ein Grundbaustein in JavaScript. Eine Funktion ist eine Prozedur - eine Reihe von Anweisungen, um eine Aufgabe auszuführen oder eine Wert auszurechnen. Um Funktionen zu verwenden, müssen diese im Scope (Gültigkeitsbereich) deklariert werden, in dem sie ausgeführt werden soll.

+ +

Siehe ebenfalls in der ausführlichen Referenz über JavaScript Funktionen nach, um noch mehr Detail zu erfahren.

+ +

Funktionen definieren

+ +

Funktionsdeklaration

+ +

Eine Funktionsdefinition (auch Funktionsdeklaration oder Funktionsanweisung genannt) besteht aus dem Schlüsselwort function, gefolgt von:

+ + + +

Das folgende Beispiel definiert eine Funktion mit dem Namen square:

+ +
function square(number) {
+  return number * number;
+}
+
+ +

Die Funktion square nimmt einen Parameter entgegen, welcher number heißt. Die Funktion besteht aus einer Anweisung, die besagt, dass der Parameter der Funktion (das ist number), multipliziert mit sich selbst, zurückgegeben werden soll. Dabei gibt das  return Statement an, welcher Wert von der Funktion zurückzugeben wird.

+ +
return number * number;
+
+ +

Bei Primitive Parameter, wie Zahlen, wird der Funktionen der Wert übergeben. Werte, die der Funktion übergeben wurden und innerhalb der Funktion geändert werden, ändert den Wert zwar innerhalb der Funktion, aber nicht global oder in der aufrufenden Funktion.

+ +

Wird ein Objekt als Parameter übergeben (z. B. ein nicht primitiver Wert wie ein  {{jsxref("Array")}} oder ein selbst definiertes Objekt) und die Funktion ändert die Objekteigenschaften, so sind die Änderungen außerhalb der Funktion sichtbar, wie im folgendem Beispiel veranschaulicht wird:

+ +
function myFunc(theObject) {       //Funktiondekleration
+  theObject.make = 'Toyota';
+}
+
+var mycar = {make: 'Honda', model: 'Accord', year: 1998};
+var x, y;
+
+x = mycar.make;  // x bekommt den Wert "Honda"
+
+myFunc(mycar);
+y = mycar.make;  // y  bekommt den Wert "Toyota"
+                 // (die make Eigenschaft wurde in der Funktion geändert)
+ +

Funktionsausdrücke

+ +

Während die Funktionsdeklarationen oben syntaktisch ein Statement sind, kann eine Funktion auch durch Funktionsausdrücke erstellt werde. Derartige Funktionen können auch anonym sein; denn Funktionen benötigten keinen Namen. So kann zum Beispiel die Funktion square auch so definiert werden:

+ +
var square = function(number) { return number * number; };
+var x = square(4); // x bekommt den Wert 16
+ +

Jedoch kann die Funktion auch einen Name haben, um sich innerhalb der Funktion selbst aufzurufen oder die Funktion im Stack Traces des Debuggers zu identifizieren zu können:

+ +
var factorial = function fac(n) { return n < 2 ? 1 : n * fac(n - 1); };
+
+console.log(factorial(3));
+
+ +

Funktionsausdrücke sind praktisch, um Funktionen als ein Argument einer anderen Funktion zu übergeben. Das folgende Beispiel zeigt die Definition einer map Funktion, die eine Funktion als ersten Parameter erwartet:

+ +
function map(f, a) {
+  var result = [],i; // erstellt ein neues Array
+  for (i = 0; i != a.length; i++)
+    result[i] = f(a[i]);
+  return result;
+}
+
+ +

Im folgenden Quelltext wird einer Funktion eine Funktion übergeben, welche zuvor durch einen Funktions-Ausdruck definiert wurde. Diese Funktion wird für jedes Element in einem Array (zweiter Parameter) ausgeführt.

+ +
function map(f, a) {
+  var result = []; // erstellt ein neues Array
+  var i;
+  for (i = 0; i < a.length; i++) {
+    result[i] = f(a[i]);
+  }
+  return result;
+}
+var f = function(x) {
+  return x * x * x;
+}
+var numbers = [0, 1, 2, 5, 10];
+var cube = map(f,numbers);
+console.log(cube);
+
+ +

gibt [0, 1, 8, 125, 1000]  zurück.

+ +

In JavaScript kann eine Funktion definiert werden, wenn eine Bedingung erfüllt ist. Zum Beispiel wird myFunc nur definiert, wenn num gleich 0 ist:

+ +
var myFunc;
+if (num === 0) {
+  myFunc = function(theObject) {
+    theObject.make = 'Toyota';
+  }
+}
+ +

Im Unterschied zu den hier gezeigten Funktionsdeklarationen, kann man auch den {{jsxref("Function")}} Konstruktor verwenden, um eine Funktion von einem String zur Laufzeit zu erstellen, ähnlich der {{jsxref("eval()")}} Funktion.

+ +

Eine Methode ist eine Funktion, die Eigenschaft eines Objektes ist. Mehr Informationen über Objekt und Methoden sind im Artikel "Mit Objekten arbeiten" zu finden.

+ +

Aufruf von Funktionen

+ +

Das Definieren einer Funktion führen diese noch nicht aus. Die Definition gibt der Funktion lediglich einen Namen und beschreibt was geschehen soll, wenn die Funktion aufgerufen wird. Erst der Aufruf ermöglicht es die Aktionen mit den angegebenen Parametern durchzuführen. Zum Beispiel wird die vorher definierte Funktion square so aufgerufen:

+ +
square(5);
+
+ +

Es wird die Funktion mit dem Argument 5 aufgerufen. Die Funktion führt ihre Anweisungen aus und gibt den Wert 25 zurück.

+ +

Funktionen müssen im Scope (Gültigkeitsbereich) sein, wenn sie aufgerufen werden, können jedoch auch erst später definiert werden, wie im folgenden Beispiel:

+ +
console.log(square(5));
+/* ... */
+function square(n) { return n * n; }
+
+ +

Der Scope einer Funktion ist die Funktion in der sie deklariert wird, oder das gesamte Programm, falls sie auf oberster Ebene deklariert wird.

+ +
+

Hinweis: Nur die oben angegebene Syntax für Funktionen wird funktionieren (function funcName(){}). Der folgende Code funktioniert nicht. Das bedeutet, dass das nur mit Funktionsdeklarationen funktioniert aber nicht mit Funktionsausdrücken.

+
+ +
console.log(square); // square ist mit dem Initialwert undefined gehoisted.
+console.log(square(5)); // TypeError: square is not a function
+var square = function(n) {
+  return n * n;
+}
+
+ +

Die Argumente einer Funktion sind nicht auf Strings und Nummern limitiert, denn es können auch ganze Objekte übergeben werden. Die showProps() Funktion (definiert in Beitrag "Arbeiten mit Objekten") ist ein Beispiel für einer Funktion, die Objekte als Argument entgegennimmt.

+ +

Eine Funktion kann sich selbst Aufrufen. Zum Beispiel berechnet folgende Funktion die Fakultät rekursiv:

+ +
function factorial(n) {
+  if ((n === 0) || (n === 1))
+    return 1;
+  else
+    return (n * factorial(n - 1));
+}
+
+ +

Die Fakultät von 1 bis 5 kann wie folgt berechnet werden:

+ +
var a, b, c, d, e;
+a = factorial(1); // a wird der Wert 1 zugewiesen
+b = factorial(2); // b wird der Wert 2 zugewiesen
+c = factorial(3); // c wird der Wert 6 zugewiesen
+d = factorial(4); // d wird der Wert 24 zugewiesen
+e = factorial(5); // e wird der Wert 120 zugewiesen
+
+ +

Es gibt aber noch weitere Möglichkeiten Funktionen aufzurufen. Oftmals gibt es Fälle, in denen Funktionen dynamisch aufgerufen werden müssen, die Anzahl der Argumente variiert oder der Kontext einer Funktion zur Laufzeit gesetzt werden muss. Das zieht nach sich, dass Funktionen selbst Objekte sind, die Methoden haben (siehe das {{jsxref("Function")}} Objekt). Eine diese Methoden ist die {{jsxref("Function.apply", "apply()")}} Methode, mit der man die oben genannten Aufgaben lösen kann.

+ +

Scopes (Gültigkeitsbereiche) von Funktionen

+ +

Variablen, die in einer Funktion definiert werden, können nicht außerhalb der Funktion erreicht werden, weil die Variablen nur im Scope (Gültigkeitbereich) der Funktion definiert sind. Im Gegensatz dazu kann eine Funktion alle Variablen und Funktionen erreichen, die in dem Scope definiert wurden, in dem auch die Funktion definiert wurde. Anders gesagt kann eine Funktion, die im globalen Scope definiert wurde, alle Variablen und Funktionen des globalen Scopes erreichen. Wenn eine Funktion in einer Funktion definiert wird, kann die innere Funktion auf alle Definitionen seiner Elternfunktion und alle Definitionen, auf die die Elternfunktion Zugriff hat, zugreifen.

+ +
// Die folgenden Variablen sind im globalen Scope definiert
+var num1 = 20,
+    num2 = 3,
+    name = 'Chamahk';
+
+// Diese Funktion ist im globalen Scope definiert
+function multiply() {
+  return num1 * num2;
+}
+
+multiply(); // gibt 60 zurück
+
+// Ein Beispiel für verschachtelte Funktionen
+function getScore() {
+  var num1 = 2,
+      num2 = 3;
+
+  function add() {
+    return name + ' scored ' + (num1 + num2);
+  }
+
+  return add();
+}
+
+getScore(); // gibt "Chamahk scored 5" zurück
+
+ +

Scope und der Funktionsstack

+ +

Rekursion

+ +

Eine Funktion kann sich selbst referenzieren und aufrufen. Dabei gibt es drei Möglichkeiten, wie eine Funktion sich selbst referenzieren kann:

+ +
    +
  1. Der Funktionsname
  2. +
  3. arguments.callee
  4. +
  5. Eine im Scope liegende Variable, die auf die Funktion referenziert.
  6. +
+ +

Nimmt man zum Beispiel folgende Funktion:

+ +
var foo = function bar() {
+   // Anweisungen
+};
+
+ +

Folgende Anweisungen im Körper der Funktion bewirken alle das Gleiche:

+ +
    +
  1. bar()
  2. +
  3. arguments.callee()
  4. +
  5. foo()
  6. +
+ +

Eine Funktion, die sich selbst aufruft, wird rekursive Funktion genannt. Rekursion ist dabei vergleichbar mit einer Schleife. Beide führen den selben Quelltext mehrfach aus und beide benötigen eine Bedingung (um eine unendliche Schleife zu vermeiden oder eine unendliche Rekursion zu vermeiden). Das nächste Beispiel zeigt eine Schleife:

+ +
var x = 0;
+while (x < 10) { // "x < 10" ist die Schleifenbedingung
+   // do stuff
+   x++;
+}
+
+ +

Diese Schleife kann in eine rekursive Funktion konvertiert werden, die aufgerufen wird:

+ +
function loop(x) {
+  if (x >= 10) // "x >= 10" ist die Abbruchbedingung (gleich zu "!(x < 10)")
+    return;
+  // do stuff
+  loop(x + 1); // der rekursive Aufruf
+}
+loop(0);
+
+ +

Jedoch können manche Algorithmen nicht in eine einfache Schleife umgewandelt werden. Zum Beispiel kann das Abrufen aller Knoten einer Baumstruktur (z. B. DOM) einfacher rekursiv realisieren werden:

+ +
function walkTree(node) {
+  if (node == null) //
+    return;
+  // do something with node
+  for (var i = 0; i < node.childNodes.length; i++) {
+    walkTree(node.childNodes[i]);
+  }
+}
+
+ +

Verglichen mit der Funktion loop, erzeugt hier jeder rekursive Aufruf mehrere weitere rekursive Aufrufe.

+ +

Es ist möglich jeden rekursiven Algorithmus in einen nicht rekursiven umzuwandeln, jedoch ist die Logik oftmals sehr viel komplexer und es wird ein zusätzlicher Stack benötigt. Rekursion nutzt ebenfalls einen Stack: den Funktionsstack.

+ +

Die Stack-ähnliche Funktionsweise kann in folgendem Beispiel betrachtet werden:

+ +
function foo(i) {
+  if (i < 0)
+    return;
+  console.log('begin:' + i);
+  foo(i - 1);
+  console.log('end:' + i);
+}
+foo(3);
+
+// Output:
+
+// begin: 3
+// begin: 2
+// begin: 1
+// begin: 0
+// end: 0
+// end: 1
+// end: 2
+// end: 3
+ +

Verschachtelte Funktionen und Closures

+ +

Man kann eine Funktion in eine andere verschachteln. Die verschachtelte (innere) Funktion ist privat innerhalb ihrer Containerfunktion (äußere Funktion). Sie formt auch eine Closure. Eine Closure ist ein Ausdruck, der freie Variablen enthalten kann, (typischerweise eine Funktion) zusammen mit einer Umgebung, welche die diese Variablen einschließt (und damit den Ausdruck abschließt, daher der Name closure).

+ +

Weil eine verschachtelte Funktion eine Closure ist, bedeutet das, dass sie die Argumente und Variablen ihrer Containerfunktion vererbt bekommt. Anders gesagt enthält der Scope der inneren Funktion den Scope der äußeren Funktion.

+ +

Zusammenfassend:

+ + + +

Im folgenden Beispiel werden innere Funktionen gezeigt:

+ +
function addSquares(a, b) {
+  function square(x) {
+    return x * x;
+  }
+  return square(a) + square(b);
+}
+a = addSquares(2, 3); // gibt 13 zurück
+b = addSquares(3, 4); // gibt 25 zurück
+c = addSquares(4, 5); // gibt 41 zurück
+
+ +

Weil die innere Funktion eine Closure formt, kann die äußere Funktion aufgerufen werden und Argumente für die innere und äußere Funktion spezifizieren::

+ +
function outside(x) {
+  function inside(y) {
+    return x + y;
+  }
+  return inside;
+}
+fn_inside = outside(3);  // Man kann sich das folgendermaßen vorstellen
+                         // gib mir eine Funktion, die 3 zu einem Parameter addiert.
+result = fn_inside(5);   // gibt 8 zurück
+
+result1 = outside(3)(5); // gibt 8 zurück
+
+ +

Erhaltung von Variablen

+ +

Bemerkenswert ist, dass x erhalten wird, wenn inside zurückgegeben wird. Eine Closure muss alle Argumente und Variablen erhalten, die sie referenziert. Weil jeder Aufruf potenziell verschiedene Argumente benötigt, wird eine neue Closure für jeden Aufruf erstellt. Der Speicher kann nur freigegeben werden, wenn die zurückgegebene inside Funktion nicht mehr erreichbar ist.

+ +

Das ist nicht anders mit gespeicherten Referenzen in anderen Objekten, jedoch oftmals weniger deutlich, weil man diese nicht direkt referenziert und nicht inspizieren kann.

+ +

Mehrfach verschachtelte Funktionen

+ +

Funktionen können mehrfach verschachtelt sein, z. B. eine Funktion (A) enthält eine Funktion (B), die eine Funktion (C) enthält. Beide Funktionen, B und C sind Closures, B kann A erreichen und C kann B erreichen. Zudem kann C auch A erreichen, weil C B erreichen kann und B A erreichen kann. Deswegen kann eine Closure mehrere Scopes enthalten.; sie enthält rekursiv die Scopes der Funktion, die der Container ist. Das wird Scopeverkettung (scope chaining) genannt.

+ +

Untersuche das nächste Beispiel:

+ +
function A(x) {
+  function B(y) {
+    function C(z) {
+      console.log(x + y + z);
+    }
+    C(3);
+  }
+  B(2);
+}
+A(1); // logs 6 (1 + 2 + 3)
+
+ +

In diesem Beispiel benutzt C die Variablen y, von B, und x, von A. Das kann gemacht werden weil:

+ +
    +
  1. B ist eine Closure, die A enthält, z. B. B kann die Argumente und Variablen von A benutzen.
  2. +
  3. C ist ein Closure, die B enthält.
  4. +
  5. Weil die Closure von B auf A zugreifen kann, kann die Closure von C auf die Argumente und Variablen von A und B zugreifen. Anders gesagt verkettet C den Scope von B und A in dieser Reihenfolge.
  6. +
+ +

Das umgekehrte ist nicht möglich. A kann nicht auf C zugreifen, weil A nicht auf die Variablen und Argumente von B zugreifen kann und C eine Variable von B ist. So bleibt C für B privat.

+ +

Namenskonflikte

+ +

Wenn zwei Argumente oder Variablen in dem Scope einer Closure mit dem gleichen Namen existieren, gibt es einen Namenskonflikt. Der innerste Scope hat dann Vorrang, was bedeutet, dass der innerste Scope die höchste Priorität hat, während der äußerste Scope die geringste Priorität hat. Das ist wegen der Scopeverkettung. Das erste Glied in der Kette ist der innerste Scope und das letzt Glied ist der äußerste Scope. Dieses ist im folgenden Beispiel zu sehen:

+ +
function outside() {
+  var x = 10;
+  function inside(x) {
+    return x;
+  }
+  return inside;
+}
+result = outside()(20); // gibt 20 statt 10 zurück
+
+ +

Der Namenskonflikt tritt beim der Anweisung return x auf und ist zwischen dem Parmeter x von inside und der Variable x von outside. Die Scopekette ist hier {inside, outside, globales Objekt}. Dabei bekommt x von inside eine höhere Priorität als das x von outside. und 20 wird statt der 10 zurückgegeben.

+ +

Closures

+ +

Closures sind eines der mächtigsten Funktionen von JavaScript. JavaScript unterstützt das Verschachteln von Funktionen und erlaubt der inneren Funktionen den vollen Zugriff auf alle definierten Variablen und Funktionen der äußeren Funktion (und alle anderen Variablen und Funktionen die die äußere Funktion erreichen kann). Jedoch hat die äußere Funktion keinen Zugriff auf die Variablen und Funktione, die in der innere Funktion definiert werden. Das unterstützt mehr oder weniger Sicherheit für die Variablen der inneren Funktion. Wenn die innere Funktion Zugriff auf den Scope der äußeren Funktion hat, müssen die Variablen und Funktionen der äußeren Funktion länger leben, als die Ausführungen der inneren Funktion, weil die innere Funktion das Überleben der äußeren Funktion managet. Eine Closure wird erstellt, wenn die innere Funktion irgendwie in einem äußeren Scope der äußeren Funktion erreichbar gemacht wird.

+ +
var pet = function(name) {   // Die äußere Funktion definiert eine Variable "name"
+  var getName = function() {
+    return name;             // Die innere Funktion hat Zugriff auf die "name" Variable der äußeren Funktion
+  }
+  return getName;            // gibt die innere Funktion zurück
+}
+myPet = pet('Vivie');
+
+myPet();                     // gibt "Vivie" zurück
+
+ +

Es kann viel komplexer sein, als der oben gezeigte Quelltext. Ein Objekt enthält Methoden zum verändern von inneren Variablen der äußeren Funktion.

+ +
var createPet = function(name) {
+  var sex;
+
+  return {
+    setName: function(newName) {
+      name = newName;
+    },
+
+    getName: function() {
+      return name;
+    },
+
+    getSex: function() {
+      return sex;
+    },
+
+    setSex: function(newSex) {
+      if(typeof newSex === 'string' && (newSex.toLowerCase() === 'male' || newSex.toLowerCase() === 'female')) {
+        sex = newSex;
+      }
+    }
+  }
+}
+
+var pet = createPet('Vivie');
+pet.getName();                  // Vivie
+
+pet.setName('Oliver');
+pet.setSex('male');
+pet.getSex();                   // male
+pet.getName();                  // Oliver
+
+ +

Im Quelltext oben ist die name Variable der äußeren Funktion in den inneren Funktionen erreichbar und es gibt keine andere Möglichkeit die inneren Variablen zu erreichen, als über die inneren Funktion. Die innere Variable der inneren Funktion fungiert als sicherer Speicher für die äußeren Parameter und Variablen. Sie enthalten permanent und sicher die Daten mit denen die innere Funktion arbeitet. Die Funktion hat niemals eine Variable beschrieben noch hat sie einen Namen.

+ +
var getCode = (function() {
+  var secureCode = '0]Eal(eh&2';    // Ein Code der nicht von Außerhalb verändert werden soll
+
+  return function () {
+    return secureCode;
+  };
+}());
+
+getCode();    // gibt secureCode zurück.
+
+ +

Es gibt aber eine menge von Tücken, die der Einsatz von Closures mit sich bringt. Wenn eine innere Funktion eine Variable definiert, die den gleichen Namen wie eine Variable im äußeren Scope hat, kann die äußere Variable nicht mehr referenziert werden.

+ +
var createPet = function(name) {  // Äußere Funktion definiert die Variable "name"
+  return {
+    setName: function(name) {    // Innere Funktion definiert ebenfalls eine Variable "name"
+      name = name;               // Wie referenziert man die Variable "name" der äußeren Funktion?
+    }
+  }
+}
+
+ +

Einsatz des arguments Objekts

+ +

Die Argumente einer Funktion werden in einem Array-ähnlichen Objekt gewartet. In einer Funktion können die Argumente wie folgt adressiert werden:

+ +
arguments[i]
+
+ +

i ist die Ordnungsnummer des Arguments, beginnend bei null. So ist das erste übergebene Argument einer Funktion arguments[0]. Die Anzahl der übergebenen Argumente ist arguments.length.

+ +

Mit dem arguments Objekt kann man eine Funktion mit mehr Agumenten aufrufen als sie formal deklariert wurden. Das ist oft nützlich, wenn man nicht weiß, wie viele Argumente einer Funktion übergeben werden. Mit arguments.length kann die Anzahl der Argumente, die einer Funktion übergeben wurde, ermittelt werden. Über das arguments Objekt können dann alle Argumente gelesen werden.

+ +

Zum Beispiel kann es eine Funktion geben, die verschieden viele Strings zusammenfügt. Das einzige formale Argument der Funktion ist das Trennzeichen, welches die Zeichen definiert, die zwischen den Strings eingefügt werden. Im folgenden Quelltext ist die Funktion implementiert:

+ +
function myConcat(separator) {
+   var result = ''; // initialize list
+   var i;
+   // iterate through arguments
+   for (i = 1; i < arguments.length; i++) {
+      result += arguments[i] + separator;
+   }
+   return result;
+}
+
+ +

Man kann der Funktion jede Anzahl an Argumenten übergeben und die Funktion fügt die Argumente in einem String zusammen:

+ +
// returns "red, orange, blue, "
+myConcat(', ', 'red', 'orange', 'blue');
+
+// returns "elephant; giraffe; lion; cheetah; "
+myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah');
+
+// returns "sage. basil. oregano. pepper. parsley. "
+myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');
+
+ +
+

Hinweis: Die arguments Variable ist "Array-ähnlich", aber kein Array. Es ist Array-ähnlich indem es nummerierte Indizes und eine length Eigenschaft hat. Jedoch unterstützt es nicht alle Array-Manipulations-Methoden.

+
+ +

Siehe im {{jsxref("Function")}} Objekt in den JavaScript Referenzen für mehr Informationen.

+ +

Funktionsparameter

+ +

Mit ECMAScript 2015, gibt es zwei neue Arten von Parametern: Default-Parameter und Rest-Parameter.

+ +

Default-Parameter

+ +

In JavaScript ist der Standardwert eines Parameters undefined. In manchen Situationen ist es sinnvoll den Standardwert auf einen anderen Wert zu setzen. Das ist das Einsatzgebiet von Default-Parametern.

+ +

In der Vergangenheit war die Strategie für das Setzen von Standardwerten, dass im Körper der Funktion geprüft wird, ob ein Parameter undefined ist und ihn in diesem Fall neu zu beschreiben. Wenn im folgenden Beispiel kein Argument b übergeben wird, wird dieser undefined sein und die Auswertung von a*b wird NaN sein. Deswegen ist dieser Fall in der zweiten Zeile des Beispiels abgefangen:

+ +
function multiply(a, b) {
+  b = typeof b !== 'undefined' ?  b : 1;
+
+  return a * b;
+}
+
+multiply(5); // 5
+
+ +

Mit Default-Parametern ist die Überprüfung im Körper der Funktion nicht mehr nötig. Jetzt kann man 1 als Standardwert für b im Funktionskopf angeben:

+ +
function multiply(a, b = 1) {
+  return a * b;
+}
+
+multiply(5); // 5
+ +

Für mehr Details, siehe in den Referenzen unter Default-Parameter.

+ +

Rest-Parameter

+ +

Die Rest-Parameter Syntax ermöglicht er eine unendliche Anzahl von Argumenten als Array zu repräsentieren. Im Beispiel wird der Rest-Parameter eingesetzt um die alle Argumente ab dem zweiten Argument zu sammeln. Danach werden diese mit dem ersten Parameter multipliziert. Dieses Beispiel benutzt Pfeilfunktionen, welche in nächsten Kapitel erklärt werden:

+ +
function multiply(multiplier, ...theArgs) {
+  return theArgs.map(x => multiplier * x);
+}
+
+var arr = multiply(2, 1, 2, 3);
+console.log(arr); // [2, 4, 6]
+ +

Pfeilfunktionen

+ +

Ein Pfeilfunktions Ausdruck hat eine kürzere Syntax verglichen mit Funktionsausdrücken und bindet lexikalisch den this Wert. Pfeilfunktionen sind immer anonym. Sie dazu auch den hacks.mozilla.org Blogbeitrag: "ES6 In Depth: Arrow functions".

+ +

Zwei Faktoren haben die Einführung von Pfeilfunktionen beeinflusst: kürzere Funktionen und lexikalisches this.

+ +

Kürzere Funktionen

+ +

In manchen funktionalen Patterns sind kurze Funktionen willkommen. Vergleiche:

+ +
var a = [
+  'Hydrogen',
+  'Helium',
+  'Lithium',
+  'Beryl­lium'
+];
+
+var a2 = a.map(function(s) { return s.length; });
+
+console.log(a2); // logs [8, 6, 7, 9]
+
+var a3 = a.map( s => s.length );
+
+console.log(a3); // logs [8, 6, 7, 9]
+
+ +

Lexikalisches this

+ +

Bis es Pfeilfunktionen gab, hat jede neue Funktion sein eigenen this Wert definiert (ein neues Objekt in Fällen eines Konstruktors, undefined in Funktionsaufrufen im strict mode, das Kontextobjekt, wenn eine Funktion als Objektmethode aufgerufen wird, etc.). Das ist lästig mit objektorientierten Programmierstilen.

+ +
function Person() {
+  // The Person() constructor defines `this` as itself.
+  this.age = 0;
+
+  setInterval(function growUp() {
+    // In nonstrict mode, the growUp() function defines `this`
+    // as the global object, which is different from the `this`
+    // defined by the Person() constructor.
+    this.age++;
+  }, 1000);
+}
+
+var p = new Person();
+ +

In ECMAScript 3/5, wurde dieses Problem behoben, indem der Wert der Variablen this in einer weiteren Variablen gespeichert wird.

+ +
function Person() {
+  var self = this; // Some choose `that` instead of `self`.
+                   // Choose one and be consistent.
+  self.age = 0;
+
+  setInterval(function growUp() {
+    // The callback refers to the `self` variable of which
+    // the value is the expected object.
+    self.age++;
+  }, 1000);
+}
+ +

Alternativ kann eine gebundene Funktion  erstellt werden, so dass der Wert für this mit übergeben werden kann.

+ +

Pfeilfunktionen nutzen den this Wert des umschließenden Kontextes, so dass der folgende Quelltext wie erwartet funktioniert:

+ +
function Person() {
+  this.age = 0;
+
+  setInterval(() => {
+    this.age++; // |this| properly refers to the person object
+  }, 1000);
+}
+
+var p = new Person();
+ +

Vordefinierte Funktionen

+ +

JavaScript hat einige eingebaute Funktionen:

+ +
+
{{jsxref("Global_Objects/eval", "eval()")}}
+
+

Die eval() Methode wertet JavaScript Quelltext repräsentiert als String aus.

+
+
{{jsxref("Global_Objects/uneval", "uneval()")}} {{non-standard_inline}}
+
+

Die uneval() Methode erstellt einen String der Quelltext eines {{jsxref("Object")}}s repräsentiert.

+
+
{{jsxref("Global_Objects/isFinite", "isFinite()")}}
+
+

Die globale isFinite() Funktion ob ein übergebener Wert endlich ist. Der übergebene Wert wird, wenn es nötig ist, zu einer Zahl konvertiert.

+
+
{{jsxref("Global_Objects/isNaN", "isNaN()")}}
+
Die isNaN() Funktion überprüft, ob ein Wert {{jsxref("Global_Objects/NaN", "NaN")}} ist oder nicht. Hinweis: Wegen einigen Zwängen innerhalb der isNaN Funktion gibt es interessante Regeln; alternativ kann auch die in  ECMAScript 2015 definierte Funktion Funktion {{jsxref("Number.isNaN()")}} oder der Operator typeof verwendet werden, um einen {{jsxref("Global_Objects/NaN", "NaN")}} Wert zu erkennen.
+
{{jsxref("Global_Objects/parseFloat", "parseFloat()")}}
+
+

Doe parseFloat() Funktion liest einen String als Argument ein und gibt eine Gleitkommazahl zurück.

+
+
{{jsxref("Global_Objects/parseInt", "parseInt()")}}
+
+

Die parseInt() Funktion liest einen String als Argument ein und gibt eine ganze Zahl der Spezifizierten Basis zurück (die Basis ist in der Mathematik das Zahlensystem).

+
+
{{jsxref("Global_Objects/decodeURI", "decodeURI()")}}
+
+

Die decodeURI() Methode decodiert einen Uniform Resource Identifier (URI), der vorher mit der {{jsxref("Global_Objects/encodeURI", "encodeURI")}} Funktion order einer ähnlichen Funktion erstellt wurde.

+
+
{{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}
+
+

Die decodeURIComponent() Methode decodiert eine Uniform Resource Identifier (URI) Komponente, die vorher mit der {{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}} Funktion oder einer ähnlichen Funktion erstellt wurde.

+
+
{{jsxref("Global_Objects/encodeURI", "encodeURI()")}}
+
+

Die encodeURI() Methode codiert einen Uniform Resource Identifier (URI), indem jedes besondere Zeilen durch eine Sequenz aus zwei drei oder vier Zeichen escaped wird. Dieses Sequenzen Repräsentieren die UTF-8 Darstellung der Zeichen (wird nur vier escape Sequenzen von Zeichen zu zwei zwei Platzhalterzeichen umwandeln)

+
+
{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}
+
+

Die encodeURIComponent() Methode codiert eine Uniform Resource Identifier (URI) Komponente, indem jedes besondere Zeilen durch eine Sequenz aus zwei drei oder vier Zeichen escaped wird. Dieses Sequenzen Repräsentieren die UTF-8 Darstellung der Zeichen (wird nur vier escape Sequenzen von Zeichen zu zwei zwei Platzhalterzeichen umwandeln)

+
+
{{jsxref("Global_Objects/escape", "escape()")}} {{deprecated_inline}}
+
+

Die veraltete escape() Methode berechnet einen neuen String indem manche Zeichen durch Hexadezimalsequenzen ersetzt werden. Man sollte {{jsxref("Global_Objects/encodeURI", "encodeURI")}} oder {{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}} stattdessen benutzen.

+
+
{{jsxref("Global_Objects/unescape", "unescape()")}} {{deprecated_inline}}
+
+

Die veraltete unescape() Methode berechnet einen neuen String indem Hexadezimalsequenzen durch die repräsentierenden Zeichen ersetzt werden. Die Hexadezimalsequenzen können von Funktionen wie {{jsxref("Global_Objects/escape", "escape")}} eingeführt werden. Weil unescape() veraltet ist, sollte man stattdessen die Funktion {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} oder {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} benutzen.

+
+
+ +

{{PreviousNext("Web/JavaScript/Guide/Schleifen_und_Iterationen", "Web/JavaScript/Guide/Ausdruecke_und_Operatoren")}}

diff --git a/files/de/web/javascript/guide/grammatik_und_typen/index.html b/files/de/web/javascript/guide/grammatik_und_typen/index.html new file mode 100644 index 0000000000..3ca2b9936b --- /dev/null +++ b/files/de/web/javascript/guide/grammatik_und_typen/index.html @@ -0,0 +1,699 @@ +--- +title: Grammatik und Typen +slug: Web/JavaScript/Guide/Grammatik_und_Typen +tags: + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Grammar_and_types +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Einführung", "Web/JavaScript/Guide/Kontrollfluss_und_Fehlerbehandlung")}}
+ +

Dieses Kapitel behandelt die grundlegende Grammatik von JavaScript, Deklaration von Variablen, Datentypen und Objektinstanzen.

+ +

Grundlagen

+ +

JavaScript leiht sich den größten Teil seiner Syntax von Java, ist aber auch von Sprachen wie Awk, Perl und Python beeinflusst.

+ +

JavaScript ist case-sensitiv (unterscheidet zwischen Groß- und Kleinschreibung) und benutzt den Unicode-Zeichensatz. Zum Beispiel kann das Wort Früh als Variablenname genutzt werden.

+ +
var Früh = "foobar";
+
+ +

Jedoch ist die Variable früh nicht dieselbe wie Früh, weil JavaScript case-sensitiv ist.

+ +

In JavaScript heißen Anweisungen "{{Glossary("Statement", "statements")}}" und werden durch ein Semikolon (;) voneinander getrennt. Ein Semikolon ist nicht nötig, wenn jedes Statement in einer neuen Zeile ist. Wenn mehrere Statements in einer Zeile geschrieben werden, sollte nach jedes mit einem Semikolon trennen. Zudem ist es gängige Praxis, hinter jedem Statement ein Semikolon zu schreiben. Leerzeichen, Tabulatoren und Zeilenumbrüche werden "Whitespace" genannt. Der Quelltext von JavaScript wird vom Interpreter von links nach rechts gelesen und in Sequenzen von Eingabe-Elementen wie JavaScript-Tokens, Steuerzeichen, Zeichenumbrüche, Kommentare und Objektinstanzen (Literale) umgewandelt. ECMAScript beschreibt für den Interpreter reservierte Schlüsselwörter sowie Objektinstanzen und hat eingebaute Regeln für die automatische Einfügung von Semikola (ASI) um Anweisungen zu beenden. Es wird jedoch empfohlen jede Anweisung mit einem Semikolon zu beenden; dies vermeidet ungewollte Nebeneffekte. Mehr Informationen dazu sind in der detaillierten Referenz über JavaScripts lexikalische Grammatik zu finden.

+ +

Kommentare

+ +

Die Syntax von Kommentaren ist dieselbe wie in C++ und in vielen anderen Sprachen:

+ +
// Einzeiliger Kommentar
+
+/* Das ist ein langer,
+ * mehrzeiliger Kommentar
+ */
+
+/* Man kann keine Kommentare, /* Verschachteln */ SyntaxError */
+ +

Kommentare sind wie Whitespaces und werden bei der Ausführung von Skripten verworfen.

+ +

Deklarationen

+ +

Es gibt drei mögliche Arten, Variablen zu deklarieren:

+ +
+
{{jsxref("Statements/var", "var")}}
+
Deklariert eine Variable. Optional wird ein Wert initialisiert.
+
{{jsxref("Statements/let", "let")}}
+
Deklariert eine Variable mit Gültigkeit im aktuellen Block. Optional wird ein Wert initialisiert.
+
{{jsxref("Statements/const", "const")}}
+
Deklariert eine Konstante mit Gültigkeit im aktuellen Block.
+
+ +

Variablen

+ +

Variablen werden benutzt, um Werte zu speichern. Dabei gibt man einer Variablen einen Namen, der {{Glossary("identifier", "Bezeichner")}} bzw. Bezeichner genannt wird und der bestimmten Regeln folgt.

+ +

Ein JavaScript Bezeichner muss mit einem Buchstaben, Unterstrich (_) oder einem Dollarzeichen ($) beginnen. Die nachfolgenden Zeichen können auch Zahlen sein. Da JavaScript case-sensitive ist, wird zwischen Groß- und Kleinschreibung unterschieden und somit repräsentiert "A" einen anderen Buchstaben als "a".

+ +

Es kann ein Großteil der ISO 8859-1 und Unicode-Zeichen benutzt werden, wie z.B. ü oder auch å, aber auch Unicode escape sequences können genutzt werden.

+ +

Beispiele für zulässige Bezeichner sind Number_hits, temp99 und _name.

+ +

Variablendeklaration

+ +

Die Deklaration einer Variable ist durch drei unterschiedliche Wege möglich:

+ + + +

Variablen auswerten

+ +

Eine Variable, die mit var ohne Initialisierung deklariert wurde, hat den Wert {{jsxref("undefined")}}.

+ +

Der Zugriff auf eine nicht initialisierte Variable und der Zugriff auf eine let-Variable, bevor diese Initialisiert wurde, erzeugt einen {{jsxref("ReferenceError")}} Fehler:

+ +
var a;
+console.log("Der Wert von a ist " + a); // Der Wert von a ist undefined
+
+console.log("Der Wert von b ist " + b); // Der Wert von b ist undefined
+var b;
+
+console.log("Der Wert von c ist " + c); // ReferenceError: c is not defined
+
+let x
+console.log("Der Wert von x ist " + x); // Der Wert von x ist undefined
+
+console.log("Der Wert von y ist " + y); // ReferenceError: y is not defined
+let y;
+
+ +

undefined kann benutzt werden, um zu überprüfen ob eine Variable einen Wert hat. Im Folgenden Codebeispiel ist der Variable input kein Wert zugewiesen worden und das if-Statement wird somit true ausgeben.

+ +
var input;
+if(input === undefined){
+  macheDas();
+} else {
+  macheDasAndere();
+}
+
+ +

undefined verhält sich wie ein false, wenn es in einem boolschen Kontext verwendet wird. Zum Beispiel wird im folgendem Codebeispiel die Funktion myFunction ausgeführt, weil das myArray Element undefined ist:

+ +
var myArray = [];
+if (!myArray[0]) myFunction();
+
+ +

undefined wird zu NaN (Not a Number) konvertiert, wenn es in einem numerischen Kontext verwendet wird:

+ +
var a;
+a + 2;  //NaN
+ +

Wenn eine {{jsxref("null")}} Variable ausgewertet wird, verhält sie sich im numerischen Kontext wie 0 und in booleschem Kontext wie false:

+ +
var n = null;
+console.log(n * 32);  // wird 0 in die Konsole eintragen
+
+ +

Variablen Scope

+ +

Wird eine Variable außerhalb eines Code-Blocks deklariert, wird sie eine globale Variable genannt, da sie jetzt in jedem Bereich verfügbar ist. Wenn eine Variable jedoch innerhalb eines Code-Blocks deklariert wird, so ist sie nur innerhalb dieses Blocks verfügbar und wird aus diesem Grund lokale Variable genannt.

+ +

JavaScript hatte vor ECMAScript 2015 keinen Block-Anweisungs Scope; daher wurde eine deklarierte Variable in einem Block immer zu der Funktion (oder dem globalen Scope) gezählt, in dem sich der Block befand. Zum Beispiel wird der folgende Quelltext 5 ausgeben, weil der Scope von x die Funktion ist bzw. der globale Kontext, in dem x deklariert wurde, und nicht der Block, in diesem Fall die if Anweisung, selbst.

+ +
if (true) {
+  var x = 5;
+}
+console.log(x);  // 5
+
+ +

Das Verhalten ändert sich, wenn man die in ECMAScript 2015 eingeführte let Deklaration benutzt.

+ +
if (true) {
+  let y = 5;
+}
+console.log(y);  // ReferenceError: y is not defined
+
+ +

Variablen hochziehen (hoisting)

+ +

Eine andere Besonderheit mit Variablen in JavaScript ist, dass man eine Variable referenzieren kann, bevor sie deklariert wurde, ohne das es zu einem Fehler kommt. Diese Konzept ist bekannt als hoisting (hochziehen); Variablen in JavaScript sind hochgezogen und quasi zum Anfang der Funktion oder des Statements gehoben worden. Immer wenn Variablen hochgezogen werden, werden sie den Wert undefined zurückgeben. So wird immer undefined zurückgegeben, wenn man die Variablen benutzt, bevor sie deklariert und initialisiert wurden.

+ +
/**
+ * Beispiel 1
+ */
+console.log(x === undefined); // true
+var x = 3;
+
+/**
+ * Beispiel 2
+ * wird den Wert undefined zurückgeben
+ */
+var myvar = "my value";
+
+(function() {
+  console.log(myvar); // undefined
+  var myvar = "local value";
+})();
+
+ +

Das obere Beispiel wird genauso interpretiert, wie das folgende Beispiel:

+ +
/**
+ * Beispiel 1
+ */
+var x;
+console.log(x === undefined); // true
+x = 3;
+
+/**
+ * Beispiel 2
+ */
+var myvar = "my value";
+
+(function() {
+  var myvar;
+  console.log(myvar); // undefined
+  myvar = "local value";
+})();
+
+ +

Wegen des Hochziehens sollten alle var Anweisungen so weit am Anfang der Funktion wie nur möglich platziert werden. Dieses Vorgehen verbessert die Qualität des Quelltextes.

+ +

In ECMAScript 2015 wird let (bzw. const) nicht an den Anfang eines Blocks hochgezogen. Das Referenzieren der Variable in dem Block, bevor diese deklariert wurde, führt zu einem {{jsxref("ReferenceError")}}. Die Variable ist in einer "temporären toten Zone", die vom Start des Blocks bis zur Deklaration der Variablen besteht.

+ +
console.log(x); // ReferenceError
+let x = 3;
+ +

Funktionen hochziehen (hoisting)

+ +

Bei Funktionen (nur Funktionsdeklarationen) werden die Deklarationen ebenfalls nach oben gezogen. Bei Funktionsausdrücken gilt das jedoch nicht.

+ +
/* Funktionsdeklaration */
+
+foo(); // "bar"
+
+function foo() {
+   console.log("bar");
+}
+
+
+/* Funktionsausdruck */
+
+baz(); // TypeError: baz ist keine Funktion
+
+var baz = function() {
+   console.log("bar2");
+};
+
+ +

Globale Variablen

+ +

Globale Variablen sind faktisch Eigenschaften des globalen Objekts. In Webseiten ist das globale Objekt das {{domxref("window")}} Objekt, so dass globale Variablen gesetzt und erreicht werden können, indem die Syntax window.variable eingesetzt wird.

+ +

Folglich kann man globale Variablen, die in einem window oder frame deklariert wurden, aus einem anderen window oder Frame erreichen, indem der window oder framename angegeben wird. Zum Beispiel kann eine Variable phoneNumber, die in einem Dokument deklariert wurde, von einem iframe mit parent.phoneNumber erreicht werden.

+ +

Konstanten

+ +

Man kann eine nur lesende, benannte Konstante mit dem Schlüsselwort {{jsxref("Statements/const", "const")}} erstellen. Die Syntax für einen Konstantenbezeichner ist dieselbe, wie für Variablenbezeichner: Er muss mit einem Buchstaben, Unterstrich oder Dollarzeichen beginnen und kann alphabetische Zeichen, numerische Zeichen und Unterstriche enthalten.

+ +
const PI = 3.14;
+
+ +

Der Wert einer Konstanten kann nicht zur Laufzeit durch Zuweisungen oder Neudeklarationen geändert werden. Konstanten müssen deswegen immer initialisiert werden.

+ +

Die Sichtbarkeitsregeln (Scope) bei Konstanten sind die gleichen, wie für let Blockscope Variablen. Wenn das Schüsselwort const weggelassen wird, wird vorausgesetzt, dass der Bezeichner eine Variable repräsentiert.

+ +

Man kann keine Konstante mit dem gleichen Namen einer Funktion oder Variablen im gleiche Gültigkeitsbereich deklarieren. Zum Beispiel:

+ +
// DAS WIRD ZU EINEM ERROR FÜHREN
+function f() {};
+const f = 5;
+
+// DAS WIRD EBENFALLS ZU EINEM ERROR FÜHREN
+function f() {
+  const g = 5;
+  var g;
+
+  //statements
+}
+
+ +

Immer, wenn Objektattribute nicht geschützt sind, werden die folgenden Anweisungen ohne Probleme ausgeführt.

+ +
const MY_OBJECT = {"key": "value"};
+MY_OBJECT.key = "otherValue";
+ +

Jedoch ist der Inhalt eines Arrays nicht geschützt, sodass folgendes Statement ohne Probleme ausgeführt wird.

+ +
const MY_ARRAY = ['HTML','CSS'];
+MY_ARRAY.push('JAVASCRIPT');
+console.log(MY_ARRAY); // logs ['HTML','CSS','JAVASCRIPT']
+
+ +

Datenstrukturen und -typen

+ +

Datentypen

+ +

Der neuste ECMAScript Standard definiert sieben Datentypen:

+ + + +

Obwohl die Anzahl der Datentypen relativ klein ist, eröffnen sie die Möglichkeit nützliche Funktionen für Applikationen zu erstellen. {{jsxref("Object", "Objects")}} und {{jsxref("Function", "functions")}} sind die anderen fundamentalen Elemente der Sprache. Man kann sich Objekte als benannte Container für Werte und Funktionen, die die Applikation ausführen kann, vorstellen.

+ +

Datentypkonvertierungen

+ +

JavaScript ist eine dynamisch typisierte Sprache. Das bedeutet, dass man den Datentypen einer Variable bei der Deklaration nicht mit angibt. Der Datentyp wird während der Ausführung automatisch konvertiert, wenn es notwendig ist. So kann eine Variable folgendermaßen definiert werden:

+ +
var answer = 42;
+
+ +

Und Später kann der gleichen Variablen eine Zeichenkette zugewiesen werden:

+ +
answer = "Thanks for all the fish...";
+
+ +

Weil JavaScript dynamisch typisiert ist, erzeugt diese Zuweisung keinen Fehler im Programm.

+ +

In Ausdrücken, in denen Zahlen und Zeichenketten mit dem + Operator gebraucht werden, konvertiert JavaScript die Zahlen in Zeichenketten. Siehe dazu das folgende Beispiel:

+ +
x = "The answer is " + 42 // "The answer is 42"
+y = 42 + " is the answer" // "42 is the answer"
+
+ +

In Ausdrücken mit anderen Operatoren, konvertiert JavaScript zahlen nicht in Zeichenketten. Zum Beispiel:

+ +
"37" - 7 // 30
+"37" + 7 // "377"
+
+ +

Konvertieren von Zeichenketten zu Zahlen

+ +

In Fällen, in denen eine Zahl durch einen String repräsentiert wird, gibt es folgende Methoden, um die Zeichenkette in eine Zahl umzuwandeln.

+ + + +

parseInt gibt nur ganze Zahlen zurück, weshalb der Einsatz für Dezimalzahlen nicht geeignet ist. Zu einem guten Programmierstil gehört es, dass man immer die Basis bei parseInt mit angibt. Der radix Parameter der Methode gibt an, aus welchem Zahlensystem die Zahl stammt.

+ +

Eine alternative Methode, um einen String in eine Zahl zu konvertieren ist der + (unär Plus) Operator:

+ +
"1.1" + "1.1" // "1.11.1"
+(+"1.1") + (+"1.1") // 2.2
+// Hinweis: die hinzugefügten Klammern sind nur für die Lesbarkeit.
+ +

Literale

+ +

Man benutzt Literale, um in JavaScript Werte zu repräsentieren. Es sind feste Werte, keine Variablen, die man in einem Skript einsetzt. Dieses Kapitel beschreibt die folgeden Literaltypen:

+ + + +

Array Literal

+ +

Ein Array Literal ist eine Liste von null oder mehr Ausdrücken. Jeder Ausdruck repräsentiert ein Element des Arrays. Diese Elemente sind von eckigen Klammern ([]) umschlossen. Wenn ein Array mit einem Array Literal erstellt wird, wird das Array mit allen definierten Elementen initialisiert und die länge des Arrays wird auf die Menge der Elemente gesetzt.

+ +

Das folgende Beispiel erstellt das coffees Array mit drei Elementen und der Länge drei:

+ +
var coffees = ["French Roast", "Colombian", "Kona"];
+
+ +
+

Hinweis: Ein Array Literal ist eine Art von Objektinitialisierung. Sie dazu auch den Einsatz von Objektinitialisierern.

+
+ +

Wenn ein Array durch ein Literal im Toplevel Skript erstellt wird, interpretiert JavaScript das Array immer dann, wenn ein Ausdruck dieses Literal enthält. Im Gegensatz dazu wird ein Literal in einer Funktion immer neu erstellt, wenn die Funktion aufgerufen wird.

+ +

Array Literale sind ebenfalls Array Objekte. Für mehr Details siehe {{jsxref("Array")}} und Indexed collections.

+ +

Extra Kommas in Array Literalen

+ +

Man muss nicht alle Elemente in einem Array Literal spezifizieren. Wenn man zwei Kommas in einer Reihe verwendet, wird das Array mit einem undefined Element erstellt. Das folgende Beispiel erstellt das fish Array:

+ +
var fish = ["Lion", , "Angel"];
+
+ +

Dieses Array hat zwei Elemente mit Werten und ein leeres Element (fish[0] ist "Lion", fish[1] ist undefined und fish[2] ist "Angel").

+ +

Wenn man ein trennendes Komma am Ende der Elementliste hinzufügt, wird es ignoriert. Im folgenden Beispiel ist die Länge des Arrays drei. Es gibt kein myList[3]. Alle weiteren Kommas in der Liste führen zu einem neuen Element.

+ +
+

Hinweis: Trennende Kommas können in älteren Browserversionen zu Fehlern führen. Zudem ist es ein guter Stil diese Kommas zu entfernen.

+
+ +
var myList = ['home', , 'school', ];
+
+ +

Im folgenden Beispiel hat das Array vier Elemente und myList[0] und myList[2] sind nicht spezifiziert.

+ +
var myList = [ , 'home', , 'school'];
+
+ +

Im folgenden Beispiel hat das Array vier Elemente und myList[1] und myList[3] sind nicht spezifiziert. Nur das letzte Komma wird ignoriert.

+ +
var myList = ['home', , 'school', , ];
+
+ +

Das Verständnis für das Verhalten von extra Kommas ist wichtig, um JavaScript als Sprache zu verstehen. Immer, wenn man seinen eigenen Quelltext schreibt, sollten explizit fehlenden Elementen mit undefined deklariert werden, damit die Lesbarkeit und Wartbarkeit des Quelltextes besser ist.

+ +

Boolean Literale

+ +

Der Boolean Typ hat zwei Literale: true und false.

+ +

Man sollte die primitiven Werte true und false jedoch nicht mit den Werten true und false des Boolean Objektes verwechseln. Das Boolean Objekt ist eine Hülle um den primitiven Boolean Datentypen. Siehe im Artikel {{jsxref("Boolean")}} für weitere Informationen.

+ +

Numerische Literale

+ +

Ganze Zahlen können als Dezimal- (Basis 10), Hexadezimal- (Basis 16), Oktal- (Basis 8) und Binärzahl (Basis 2) ausgedrückt werden.

+ + + +

Im folgenden Beispiel sind einige Beispiele für Zahlenliterale:

+ +
0, 117 und -345 (dezimal, Basis 10)
+015, 0001 und -0o77 (oktal, Basis 8)
+0x1123, 0x00111 und -0xF1A7 (hexadezimal, "hex", Base 16)
+0b11, 0b0011 und -0b11 (binär, Basis 2)
+
+ +

Für weitere Informationen siehe numerische Literale in der Lexikalischen Grammatik Referenz.

+ +

Gleitkomma Literale

+ +

Ein Gleitkomma Literal kann die folgenden Abschnitte beinhalten:

+ + + +

Der Exponent besteht aus einem "e" oder "E" gefolgt von einer ganzen Zahl, die mit einem Vorzeichen ("+" oder "-") versehen sein kann. Eine Gleitkommazahl muss mindestens aus einer Ziffer und entweder einem Dezimalpunkt oder einem "e" (oder "E") bestehen.

+ +

Kurz und knapp sieht die Syntax folgendermaßen aus:

+ +
[(+|-)][ziffern][.ziffern][(E|e)[(+|-)]ziffern]
+
+ +

Zum Beispiel:

+ +
3.1415926
+-.123456789
+-3.1E+12
+.1e-23
+
+ +

Objekt Literale

+ +

Ein Objekt Literal ist eine Liste von null oder mehr Paaren von Eigenschaftsnamen und -werten, umschlossen von geschweiften Klammern ({}). Man sollte kein Objektliteral am Anfang eines Statements benutzen. Das wird zu einem Fehler führen oder nicht wie erwartet funktionieren, weil das {-Zeichen als Anfang eines Blocks interpretiert wird.

+ +

Es folgt ein Beispiel für ein Objekt Literal. Das erste Element des car Objektes definiert eine Eigenschaft myCar und beschreibt diese mit einem neuen String "Saturn". Am zweiten Element, der getCar Eigenschaft, wird der Rückgabewert der aufgerufenen Funktion carTypes("Honda") zugewiesen. Das dritte Element, die special Eigenschaft, benutzt eine existierende Variable sales.

+ +
var sales = "Toyota";
+
+function carTypes(name) {
+  if (name === "Honda") {
+    return name;
+  } else {
+    return "Sorry, we don't sell " + name + ".";
+  }
+}
+
+var car = {
+  myCar: "Saturn",
+  getCar: carTypes("Honda"),
+  special: sales
+};
+
+console.log(car.myCar);   // Saturn
+console.log(car.getCar);  // Honda
+console.log(car.special); // Toyota
+
+ +

Für die Namen der Eigenschaften kann auch ein String oder ein Zahlen Literal verwendet werden. Für den Wert kann auch ein verschachteltes Objekt Literal genutzt werden. Das folgende Beispiel nutzt diese Optionen.

+ +
var car = { manyCars: {a: 'Saab', b: 'Jeep'}, 7: 'Mazda' };
+
+console.log(car.manyCars.b); // Jeep
+console.log(car[7]); // Mazda
+
+ +

Die Namen von Objekteigenschaften können ein String sein, was auch den leeren String beinhaltet. Wenn die Eigenschaftsnamen keine gültigen JavaScript {{Glossary("Identifier","Bezeichner")}} sind, müssen sie in Anführungszeichen geschrieben werden. Eigenschaftsnamen die keine gültigen Bezeichner sind, können nicht mit der Punktschreibweise (.) erreicht werden. Wohl aber mit der Array ähnlichen Notation ("[]").

+ +
var unusualPropertyNames = {
+  "": "An empty string",
+  "!": "Bang!"
+}
+console.log(unusualPropertyNames."");   // SyntaxError: Unexpected string
+console.log(unusualPropertyNames[""]);  // An empty string
+console.log(unusualPropertyNames.!);    // SyntaxError: Unexpected token !
+console.log(unusualPropertyNames["!"]); // Bang!
+ +

Erweiterte Objekt Literale

+ +

In ES2015 wurde das Objekt Literal dahingehend erweitert, dass der Prototyp bei der Erstellung gesetzt wird. Desweiteren sind neue Funktionalitäten hinzugekommen, die eine Kurzschreibweise für foo: foo Zuweisungen, die Definitionen für Methoden, das Aufrufen von super Methoden und die Berechnung der Eigenschaftsnamen mit Ausdrücken ermöglichen. Alle diese Funktionen bringen zum Einen Klassendefinition und Objekt Literale näher zusammen und sind somit objektbasiertes Design und zum Anderen häufig vorteilhafter und bequemer.

+ +
var obj = {
+    // __proto__
+    __proto__: theProtoObj,
+    // Shorthand for ‘handler: handler’
+    handler,
+    // Methods
+    toString() {
+     // Super calls
+     return "d " + super.toString();
+    },
+    // Computed (dynamic) property names
+    [ 'prop_' + (() => 42)() ]: 42
+};
+ +

Bitte beachten:

+ +
var foo = {a: "alpha", 2: "two"};
+console.log(foo.a);    // alpha
+console.log(foo[2]);   // two
+//console.log(foo.2);  // Error: missing ) after argument list
+//console.log(foo[a]); // Error: a is not defined
+console.log(foo["a"]); // alpha
+console.log(foo["2"]); // two
+
+ +

RegExp Literale

+ +

Ein RegExp Literal (welcher im Detail später erklärt wird) ist ein Pattern (Muster) umschlossen von Slashes (/). Das Folgende ist ein Beispiel für ein RegExp Literal:

+ +
var re = /ab+c/;
+ +

String Literale

+ +

Ein String Literal besteht aus null oder mehr Zeichen, die von doppelten (") oder einfachen (') Anführungszeichen umschlossen sind. Ein String muss immer von gleichen Anführungszeichen umschlossen sein. Entweder von einfachen oder von doppelten Anführungszeichen. Im folgenden Beispiel sind ein paar String Literale gezeigt:

+ +
"foo"
+'bar'
+"1234"
+"eine Zeile \n weitere Zeile"
+"John's cat"
+
+ +

Man kann alle Methoden des String Objektes auf einem String Literal aufrufen, denn JavaScript konvertiert das Literal automatisch in ein temporäres String Objekt, führt die Methode aus und verwirft danach das temporäre Objekt. Man kann auch die String.length Eigenschaft mit einem String Literal benutzen:

+ +
console.log("John's cat".length)
+// Wird die Anzahl der Zeichen (auch Leerzeichen) ausgeben.
+// In diesem Fall 10.
+
+ +

In ES2015, wurden zudem Template Literale eingeführt. Template Literale sind von Backticks (` `) (Gravis) umschlossen. Template Strings bieten syntaktischen Zucker für das Erstellen von Strings an. Sie sind vergleichbar mit den String Interpolations Funktionen in Perl, Python und anderen Sprachen. Optional können Marken eingefügt werden, um einen String benutzerdefiniert zu erstellen. Sie vermeiden Injection-Attacken und ermöglichen es Datenstrukturen in Strings unterzubringen.

+ +
// Standardliteral für die String erstellung
+`In JavaScript '\n' is a line-feed.`
+
+// Mehrzellige Strings
+`In JavaScript ist das
+ nicht erlaubt.`
+
+// String Interpolation
+var name = "Bob", time = "today";
+`Hello ${name}, how are you ${time}?`
+
+// Erstellung einer HTTP Anfrage.
+POST`http://foo.org/bar?a=${a}&b=${b}
+     Content-Type: application/json
+     X-Credentials: ${credentials}
+     { "foo": ${foo},
+       "bar": ${bar}}`(myOnReadyStateChangeHandler);
+ +

Man sollte String Literale benutzen, sofern man nicht explizit ein Objekt benötigt. Für weitere Informationen siehe im {{jsxref("String")}} Artikel nach.

+ +

Einsatz von Sonderzeichen in Strings

+ +

Neben den normalen Zeichen ist es auch möglich Sonderzeichen in einem String zu verwenden. Ein Beispiel ist im folgenden zu sehen:

+ +
"eine Zeile \n nächste Zeile"
+
+ +

Die folgende Tabelle Zeigt die Sonderzeichen, die in JavaScript Strings verwendet werden können:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Table: JavaScript Sonderzeichen
ZeichenBedeutung
\0Null Byte
\bBackspace
\fForm feed
\nNew line
\rCarriage return
\tTab
\vVertical tab
\'Einfache Anführungszeichen
\"Doppelte Anführungszeichen
\\Backslash Zeichen
\XXXDas Zeichen, das im Latin-1 Encoding mit drei Oktalzahlen (XXX) Spezifiziert wird (0 bis 377). Zum Beispiel ist \251 die Oktalsequenz für das Copyrightsymbol.
\xXXZeichen, die im Latin-1 Encoding mit zwei Hexadezimalzahlen (XX) spezifiziert werden (00 bis FF). Zum Beispiel ist \xA9 die Hexadezimalsequenz für das Copyrightsymbol.
\uXXXXDie Unicode Zeichen, die mit vier Hexadezimalziffern XXXX beschreiben werden. Zum Beispiel ist \u00A9 die Hexadezimalsequenz für das Copyrightsymbol. Siehe Unicode escape Sequenzen.
\u{XXXXX}Unicode code point escapes. Zum Beispiel ist \u{2F804} das gleiche wie das einfache Unicodezeichen \uD87E\uDC04.
+ +

Escaping Zeichen

+ +

Für nicht in der Tabelle gezeigte Zeichen wird ein voranstehendes Backslash ignoriert. Der Einsatz von Backslashs ist Veraltet und sollte vermieden werden.

+ +

Man kann Anführungszeichen in einen String hinzufügen, indem ein Führendes Backslash eingesetzt wird. Das wird auch escaping der Anführungszeichen genannt. Ein Beispiel:

+ +
var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
+console.log(quote);
+
+ +

Das Ergebnis ist:

+ +
He read "The Cremation of Sam McGee" by R.W. Service.
+
+ +

Um ein Backslash in einem String zu verwenden, muss dieses mit einem Backslash escaped werden. Zum Beispiel muss der Pfad c:\temp wie folgt geschrieben werden:

+ +
var home = "c:\\temp";
+
+ +

Man kann zudem Zeilenumbrüche mit einem vorangegangenen Backslash escapen. Das Backslash und der Zeilenumbruch werden aus dem String entfernt.

+ +
var str = "this string \
+is broken \
+across multiple\
+lines."
+console.log(str);   // this string is broken across multiple lines.
+
+ +

JavaScript kennt keine "heredoc" Syntax. Um eine solche zu simulieren muss am Ende jeder Zeile mit einem Zeilenumbruch (\n) ein Backslash stehen:

+ +
var poem =
+"Roses are red,\n\
+Violets are blue.\n\
+Sugar is sweet,\n\
+and so is foo."
+
+ +

ECMAScript 2015 führte einen neuen Literaltyp, das Template Literal, ein. Dieses führte, für viele neue Funktionen, Strings mit mehrere Zeilen ein!

+ +
var poem =
+`Roses are red,
+Violets are blue.
+Sugar is sweet,
+and so is foo.`
+
+ +

Mehr Informationen

+ +

Dieses Kapitel beschränkt sich auf die Basissyntax für Deklarationen und Typen. Um mehr über die Sprachkonstrukte von JavaScript zu lernen siehe in die folgenden Kapitel dieses Guides:

+ + + +

Im nächsten Kapitel wird ein Blick auf Kontrollflüsse und Fehlerbehandlungen geworfen.

+ +

{{PreviousNext("Web/JavaScript/Guide/Einführung", "Web/JavaScript/Guide/Kontrollfluss_und_Fehlerbehandlung")}}

diff --git a/files/de/web/javascript/guide/index.html b/files/de/web/javascript/guide/index.html new file mode 100644 index 0000000000..8e9fcfa13b --- /dev/null +++ b/files/de/web/javascript/guide/index.html @@ -0,0 +1,130 @@ +--- +title: Guide +slug: Web/JavaScript/Guide +tags: + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide +--- +

{{jsSidebar("JavaScript Guide")}}

+ +

Der JavaScript Guide stellt einen Überblick zu JavaScript bereit und zeigt wie man die Sprache verwenden kann. Für detaillierte Informationen über einzelne Sprachteile JavaScripts gibt es die JavaScript Referenz.

+ +

Kapitel

+ +

Dieser Guide ist in mehrere Kapitel aufgeteilt:

+ + + + + + + + + +

{{Next("Web/JavaScript/Guide/Introduction")}}

diff --git a/files/de/web/javascript/guide/indexed_collections/index.html b/files/de/web/javascript/guide/indexed_collections/index.html new file mode 100644 index 0000000000..fa47c0841b --- /dev/null +++ b/files/de/web/javascript/guide/indexed_collections/index.html @@ -0,0 +1,448 @@ +--- +title: Indexed collections +slug: Web/JavaScript/Guide/Indexed_collections +tags: + - Guide + - Handbuch + - JavaScript + - Method + - Méthode + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Indexed_collections +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}
+ +

Dieses Kapitel beschreibt Datensammlungen, die nach einem Indexwert sortiert sind. Diese beinhalten Arrays und Array-ähnliche Konstrukte, wie {{jsxref("Array")}} Objekte {{jsxref("TypedArray")}} Objekte.

+ +

Array Objekt

+ +

Ein Array ist ein sortiertes Set an Werten, die mit einem Namen und einem Index referenziert werden. Zum Beispiel könnte ein Array mit dem Namen emp Mitarbeiternamen enthalten, die über ihre Mitarbeiternummer indexiert sind. emp[1] würde somit Mitarbeiter Eins sein, emp[2] ist Mitarbeiter Zwei, und so weiter.

+ +

JavaScript hat keinen expliziten Array-Datentyp, aber es ist möglich, das vordefinierte Array Objekt und dessen Methoden zu verwenden, um mit Arrays zu arbeiten. Das Array Objekt verfügt über Methoden, um Arrays auf unterschiedliche Weisen zu manipulieren. Es hat ein Property um die Arraylänge zu bestimmen, und andere Properties für die Verwendung von Regular Expressions.

+ +

Ein Array erstellen

+ +

Die folgenden Statements erstellen äquivalente Arrays:

+ +
var arr = new Array(element0, element1, ..., elementN);
+var arr = Array(element0, element1, ..., elementN);
+var arr = [element0, element1, ..., elementN];
+
+ +

element0, element1, ..., elementN ist eine Liste von Werten für die Elemente im Array. Das Array wird mit den Werten als Elemente initialisiert. Das length Property des Arrays entspricht dann der Anzahl Argumente.

+ +

Die Bracket-Syntax wird als "Array-Literal" oder "Array-Initialisierer" bezeichnet. Es ist eine kürzere Form der Array-Erstellung und wird allgemein bevorzugt. Siehe Array literals für weitere Details.

+ +

Um ein leeres Array mit einer Länge von mehr als Null zu erstellen, kann eine der folgenden Statements verwendet werden:

+ +
var arr = new Array(arrayLength);
+var arr = Array(arrayLength);
+
+// Folgendes hat den selben Effekt.
+var arr = [];
+arr.length = arrayLength;
+
+ +
+

Bemerkung : im obigen Code, arrayLength muss ein Number Objekt sein, ansonsten wird ein Array mit einem Element (dem übergebenen Wert) erstellt. Ein Aufruf von arr.length wird arrayLength zurückgeben, aber das Array besteht aus leeren (undefined) Elementen. Eine {{jsxref("Statements/for...in","for...in")}} Schleife wird keine der Elemente aus dem Array zurückgeben.

+
+ +

Neben der Zuweisung an eine neue Variable, wie im Beispiel oben gezeigt, können Arrays auch als Property eines neuen oder existierenden Objekts zugewiesen werden:

+ +
var obj = {};
+// Weist das Array einem Property des bestehenden Objekts 'obj'
+// zu.
+obj.prop = [element0, element1, ..., elementN];
+
+// Weist das Array einem Property auf dem neuen Objekt 'obj'
+// zu.
+var obj = {prop: [element0, element1, ...., elementN]};
+
+ +

Wenn ein Array mit einem einzelnen Number Objekt erstellt werden soll, muss die Bracket-Syntax verwendet werden. Wenn ein einzelnes Number Objekt an den/der Array() Konstruktor oder Funktion übergeben wird, wird es als arrayLength und nicht als einzelnes Element interpretiert.

+ +
var arr = [42];      // Erstellt ein Array mit genau einem
+                     // Element: der Nummer 42.
+
+var arr = Array(42); // Erstellt ein Array ohne Elemente und
+                     // arr.length wird als 42 gesetzt; dies
+                     // ist äquivalent zu:
+var arr = [];
+arr.length = 42;
+
+ +

Wenn Array(N) aufgerufen wird und N keine Ganzzahl ist, wird ein RangeError geworfen. Das folgende Beispiel illustriert dieses Verhalten:

+ +
var arr = Array(9.3);  // RangeError: Invalid array length
+                       // "Ungültige Array-Länge"
+ +

Wenn im Code Arrays mit einzelnen Elements eines willkürlichen Datentyp verlangt sind, ist es sicherer, Array-Literals zu verwenden, oder zuerst ein leeres Array zu erstellen und dann das einzelne Element hinzuzufügen.

+ +

Ein Array abfüllen

+ +

Ein Array kann abgefüllt werden, indem dessen Elemente mit Werten abgefüllt werden:

+ +
var emp = [];
+emp[0] = 'Casey Jones';
+emp[1] = 'Phil Lesh';
+emp[2] = 'August West';
+
+ +
+

Bemerkung : Wenn ein Wert dem Array-Operator übergeben wird, der kein Integer ist, wie im obigen Code, wird ein Property auf dem Array-Objekt erstellt, statt als Array-Element.

+ +

Der Array-Operator ist die Rechteckige Klammer nach der Array-Variable.

+
+ +
var arr = [];
+arr[3.4] = 'Oranges';
+console.log(arr.length);                // 0
+console.log(arr.hasOwnProperty(3.4));   // true
+
+ +

Arrays können auch bei der Erstellung abgefüllt werden:

+ +
var myArray = new Array('Hello', myVar, 3.14159);
+var myArray = ['Mango', 'Apple', 'Orange'];
+
+ +

Array-Elemente referenzieren

+ +

Ein Element in einem Array kann mit dessen Ordinalzahl (Index) referenziert werden. Beispielweise wird der folgende Array erstellt:

+ +
var myArray = ['Earth', 'Wind', 'Fire'];
+
+ +

Das erste Element kann mit myArray[0], und das zweite Element des Arrays mit myArray[1] referenziert werden. Der Index der Elemente beginnt mit Null.

+ +
+

Bemerkung : Der Array-Operator (Rechteckige Klammer) wird auch für den Zugriff auf die Properties des Arrays (Arrays sind in JavaScript auch Objekte) verwendet. Beispielsweise:

+
+ +
var arr = ['one', 'two', 'three'];
+arr[2];                            // three
+arr['length'];                     // 3
+
+ +

Das length Property verstehen

+ +

Auf dem Implementierungslevel, Arrays in JavaScript legen ihre Elemente als normale Properties eines Objekts (dem Array selbst) mit dessen Index als Property-Name ab. Das length Property ist speziell; Es gibt immer den Index des letzen Elements plus Eins (im folgenden Beispiel hat Dusty den Index 30, also gibt cats.length 30 + 1 zurück) zurück. Array-Indexe starten in JavaScript immer mit 0 und nicht mit 1. Dies bedeutet, dass das length Property immer um Eins grösser ist, als der höchste Index im Array:

+ +
var cats = [];
+cats[30] = ['Dusty'];
+console.log(cats.length); // 31
+
+ +

Das length Property kann auch beschrieben werden. Wird ein Wert zugewiesen, der kleiner ist, als die Anzahl Elemente im Array, wird das Array auf die angegebene Grösse geschrumpft; das Array wird geleert, wenn 0 zugewiesen wird:

+ +
var cats = ['Dusty', 'Misty', 'Twiggy'];
+console.log(cats.length); // 3
+
+cats.length = 2;
+console.log(cats); // Loggt "Dusty, Misty" - Twiggy wurde
+                   // entfernt.
+
+cats.length = 0;
+console.log(cats); // Loggt nichts; Das 'cats' Array ist leer.
+
+cats.length = 3;
+console.log(cats); // Loggt [undefined, undefined, undefined].
+
+ +

Iteration über Arrays

+ +

Eine gebräuchliche Operation ist die Iteration über die Werte eines Arrays, um jedes Element auf eine Weise zu verarbeiten. Die einfachste Variate ist:

+ +
var colors = ['red', 'green', 'blue'];
+for (var i = 0; i < colors.length; i++) {
+  console.log(colors[i]);
+}
+
+ +

Wenn es ausgeschlossen ist, dass eines der Elemente im Array in einem Boolean-Kontext als false evaluiert wird — beispielsweise, wenn es nur aus DOM Knoten besteht — kann ein effizienterer Ausdruck verwendet werden:

+ +
var divs = document.getElementsByTagName('div');
+for (var i = 0, div; div = divs[i]; i++) {
+  /* Verarbeite das div auf irgendeine Weise. */
+}
+
+ +

Dies vermeidet den Overhead bei der Überprüfung der Array-Länge und  weist der div Variable den aktuellen Wert des Schleifendurchlaufs sofort zu.

+ +

Die {{jsxref("Array.forEach", "forEach()")}} Methode erlaubt eine andere Variate zur Iteration über ein Array:

+ +
var colors = ['red', 'green', 'blue'];
+colors.forEach(function(color) {
+  console.log(color);
+});
+
+ +

Die Funktion, die forEach übergeben wird, wird für jedes Element im Array ausgeführt, wobei das Element als Argument der Funktion übergeben wird. Elemente ohne Wert (undefined) werden von forEach nicht iteriert.

+ +

Elemente ohne Wert werden von forEach nur übersprungen, wenn sie nicht manuell zugewiesen wurden:

+ +
var array = ['first', 'second', , 'fourth'];
+
+// Gibt ['first', 'second', 'fourth'] zurück.
+array.forEach(function(element) {
+  console.log(element);
+})
+
+if (array[2] === undefined) { // true
+  console.log('array[2] is undefined');
+}
+
+var array = ['first', 'second', undefined, 'fourth'];
+
+// Gibt ['first', 'second', undefined, 'fourth'] zurück.
+array.forEach(function(element) {
+  console.log(element);
+})
+ +

Weil JavaScript Elemente als normale Objekt-Properties abgelegt werden, ist es nicht ratsam Arrays mit {{jsxref("Statements/for...in","for...in")}} zu iterieren, weil normale Elemente plus alle aufzählbaren (enumerable) Properties aufgelistet werden.

+ +

Array-Methoden

+ +

Das {{jsxref("Array")}} Objekt verfügt über folgende Methoden:

+ +

{{jsxref("Array.concat", "concat()")}} hängt zwei Arrays aneinander und gibt das kombinierte Array zurück.

+ +
var myArray = new Array('1', '2', '3');
+myArray = myArray.concat('a', 'b', 'c');
+// myArray ist nun ["1", "2", "3", "a", "b", "c"].
+
+ +

{{jsxref("Array.join", "join(deliminator = ',')")}} kombiniert alle Elemente eines Arrays in einen String mit einem Delimiter.

+ +
var myArray = new Array('Earth', 'Wind', 'Fire');
+var list = myArray.join(' - '); // list ist
+                                // "Earth - Wind - Fire".
+
+ +

{{jsxref("Array.push", "push()")}} fügt eines oder mehrere Elemente an ein Array und gibt den Wert des neuen length Property zurück.

+ +
var myArray = new Array('1', '2');
+myArray.push('3'); // myArray ist nun ["1", "2", "3"].
+
+ +

{{jsxref("Array.pop", "pop()")}} entfernt das letzte Element des Arrays und gibt es zurück.

+ +
var myArray = new Array('1', '2', '3');
+var last = myArray.pop();
+// myArray ist nun ["1", "2"], last = "3"
+
+ +

{{jsxref("Array.shift", "shift()")}} entfernt das erste Element des Arrays und gibt es zurück.

+ +
var myArray = new Array('1', '2', '3');
+var first = myArray.shift();
+// myArray ist nun ["2", "3"], first = "1"
+
+ +

{{jsxref("Array.unshift", "unshift()")}} fügt eines oder mehrere Elemente an den Anfang des Arrays und gibt den Wert des neuen length Property zurück.

+ +
var myArray = new Array('1', '2', '3');
+myArray.unshift('4', '5');
+// myArray wird ["4", "5", "1", "2", "3"].
+ +

{{jsxref("Array.slice", "slice(start_index, upto_index)")}} extrahiert einen Ausschnitt des Arrays und gibt ein neues Array zurück.

+ +
var myArray = new Array('a', 'b', 'c', 'd', 'e');
+myArray = myArray.slice(1, 4); // Beginnt bei Index 1 und
+                               // extrahiert alle Elemente bis
+                               // Index 3 und gibt somit
+                               // [ "b", "c", "d"] zurück.
+
+ +

{{jsxref("Array.splice", "splice(index, count_to_remove, addElement1, addElement2, ...)")}} entfernt einen Teil des Arrays und ersetzt sie (optional). Der rückgegebene Wert entspricht den entfernten Elementen.

+ +
var myArray = new Array('1', '2', '3', '4', '5');
+myArray.splice(1, 3, 'a', 'b', 'c', 'd');
+// myArray ist nun ["1", "a", "b", "c", "d", "5"].
+// Dieser Code startet mit Index 1 (wo '2' war), entfernt dort
+// 3 Elemente, und fügt die Werte 'a' bis '5' ein.
+
+ +

{{jsxref("Array.reverse", "reverse()")}} kehrt die Reihenfolge der Array-Elemente um; das erste Element ist neu das letzte und das letzte Element ist nun das erste.

+ +
var myArray = new Array('1', '2', '3');
+myArray.reverse();
+// Kehrt die Reihenfolge der Array-Elemente um.
+// myArray = ["3", "2", "1"]
+
+ +

{{jsxref("Array.sort", "sort()")}} sortiert die Elemente im Array.

+ +
var myArray = new Array('Earth', 'Wind', 'Fire');
+myArray.sort();
+// Sortiert das Array.
+// myArray = ["Earth", "Fire", "Wind"]
+
+ +

sort() kann auch eine Callback-Funktion verwenden, um zu bestimmen, wie die Elemente miteinander verglichen werden sollen. Die Funktion vergleicht zwei Werte und gibt einen von drei Werten zurück:

+ +

Beispielsweise wird der folgende Code das Array nach dem letzten Buchstaben des Strings sortieren:

+ +
var sortFn = function(a, b) {
+  if (a[a.length - 1] < b[b.length - 1]) return -1;
+  if (a[a.length - 1] > b[b.length - 1]) return 1;
+  if (a[a.length - 1] == b[b.length - 1]) return 0;
+}
+myArray.sort(sortFn);
+// Sortiert das Array nach dem letzten Buchstaben.
+// myArray = ["Wind","Fire","Earth"]
+ + + +

{{jsxref("Array.indexOf", "indexOf(searchElement[, fromIndex])")}} durchsucht das Array nach searchElement und gibt den Index des ersten Treffers zurück.

+ +
var a = ['a', 'b', 'a', 'b', 'a'];
+console.log(a.indexOf('b')); // Loggt 1.
+// Nochmals, die Suche beginnt ab dem Element mit dem Index 2.
+console.log(a.indexOf('b', 2)); // Loggt 3.
+console.log(a.indexOf('z')); // Loggt -1, weil 'z' nicht
+                             // gefunden wurde.
+
+ +

{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} funktioniert wie indexOf, aber startet die Suche am Ende des Arrays.

+ +
var a = ['a', 'b', 'c', 'd', 'a', 'b'];
+console.log(a.lastIndexOf('b')); // Loggt 5.
+// Startet die Suche ab dem Element mit dem Index 4.
+console.log(a.lastIndexOf('b', 4)); // Loggt 1.
+console.log(a.lastIndexOf('z')); // Loggt -1.
+
+ +

{{jsxref("Array.forEach", "forEach(callback[, thisObject])")}} führt callback für jedes Element aus.

+ +
var a = ['a', 'b', 'c'];
+a.forEach(function(element) { console.log(element); });
+// Loggt jedes Element.
+
+ +

{{jsxref("Array.map", "map(callback[, thisObject])")}} gibt ein neues Array zurück, aus dem Rückgabewert der callback Funktion.

+ +
var a1 = ['a', 'b', 'c'];
+var a2 = a1.map(function(item) { return item.toUpperCase(); });
+console.log(a2); // Loggt ['A', 'B', 'C'].
+
+ +

{{jsxref("Array.filter", "filter(callback[, thisObject])")}} gibt ein Array zurück, das aus allen Elementen besteht, bei denen die callback Funtion true zurückgibt.

+ +
var a1 = ['a', 10, 'b', 20, 'c', 30];
+var a2 = a1.filter(function(item) { return typeof item === 'number'; });
+console.log(a2); // Loggt [10, 20, 30].
+
+ +

{{jsxref("Array.every", "every(callback[, thisObject])")}} gibt true zurück, wenn die callback Funktion für jedes Element auch true zurückgibt.

+ +
function isNumber(value) {
+  return typeof value === 'number';
+}
+var a1 = [1, 2, 3];
+console.log(a1.every(isNumber)); // Loggt true.
+var a2 = [1, '2', 3];
+console.log(a2.every(isNumber)); // Loggt false.
+
+ +

{{jsxref("Array.some", "some(callback[, thisObject])")}} gibt true zurück, wenn die callback Funktion für alle Elemente mindestens einmal true zurückgibt.

+ +
function isNumber(value) {
+  return typeof value === 'number';
+}
+var a1 = [1, 2, 3];
+console.log(a1.some(isNumber)); // Loggt true.
+var a2 = [1, '2', 3];
+console.log(a2.some(isNumber)); // Loggt true.
+var a3 = ['1', '2', '3'];
+console.log(a3.some(isNumber)); // Loggt false.
+
+ +

Die obige Methoden, die eine callback Funktion als Argument verlangen sind als Iterative Methoden bekannt, weil sie über das ganze Array auf irgendeine Weise iterieren. Jede der Methoden nimmt ein optionales zweites Argument thisObject. Wenn thisObject übergeben wird, wird es im Kontext der callback Funktion als this behandelt. Falls es nicht übergeben wird, wie es auch der Fall ist, wenn eine Funktion ausserhalb eines expliziten Objektkontext aufgerufen wird, referenziert this das globale Objekt ({{domxref("window")}}).

+ +

Die callback Funktion wird jeweils mit drei Argumenten aufgerufen. Das erste ist der Wert des aktuellen Elements in der Iteration, das zweite ist der Index des Elements und das dritte ist eine Referenz auf das Array selbst. JavaScript Funktionen ignorieren Parameter, die in der Liste nicht benannt werden, es ist somit sicher, eine Funktion als callback zu definieren, die nur ein einzelnes Argument nimmt, zum Beispiel alert.

+ +

 

+ +

{{jsxref("Array.reduce", "reduce(callback[, initialValue])")}} wendet callback(firstValue, secondValue) an, um die Liste auf einen einzelnen Wert zu reduzieren.

+ +
var a = [10, 20, 30];
+var total = a.reduce(function(first, second) { return first + second; }, 0);
+console.log(total) // Loggt 60.
+
+ +

{{jsxref("Array.reduceRight", "reduceRight(callback[, initialValue])")}} funktioniert wie reduce(), aber startet am Ende des Arrays.

+ +

reduce und reduceRight sind die unauffälligsten iterativen Array-Methoden. Sie sollten dazu verwendet werden, rekursiv jeweils zwei Werte miteinander zu kombinieren, bis nur noch ein einzelner Wert verbleibt.

+ +

Mehrdimensionale Arrays

+ +

Arrays können verschachtelt sein. Das bedeutet, dass ein Array ein anderes Array als Element beinhalten kann. Mit dieser EIgenschaft von JavaScript können mehrdimensionale Arrays erstellt werden. Der folgende Code erstellt ein zwei-dimensionales Array:

+ +
var a = new Array(4);
+for (i = 0; i < 4; i++) {
+  a[i] = new Array(4);
+  for (j = 0; j < 4; j++) {
+    a[i][j] = '[' + i + ', ' + j + ']';
+  }
+}
+
+ +

Dieses Beispiel erstellt ein Array mit den folgenden Zeilen:

+ +
Zeile 0: [0, 0] [0, 1] [0, 2] [0, 3]
+Zeile 1: [1, 0] [1, 1] [1, 2] [1, 3]
+Zeile 2: [2, 0] [2, 1] [2, 2] [2, 3]
+Zeile 3: [3, 0] [3, 1] [3, 2] [3, 3]
+
+ +

Arrays und Regular Expressions

+ +

Wenn ein Array das Resultat einer Regular Expression auf einem String ist, wird das Array Properties und Elemente zuückgeben, die Informationen zum Match liefern. Der Rückgabewert der {{jsxref("Global_Objects/RegExp/exec","RegExp.exec()")}}, {{jsxref("Global_Objects/String/match","String.match()")}}, und {{jsxref("Global_Objects/String/split","String.split()")}} Methode ist ein Array. Für weitere Informationen für die Verwendung von Arrays mit Regular Expressions, siehe Regular Expressions.

+ +

Mit Array-ähnlichen Objekten arbeiten

+ +

Manche JavaScript Objekte, wie {{domxref("NodeList")}}, welche von {{domxref("document.getElementsByTagName()")}} zurückgegeben oder als {{jsxref("Functions/arguments","arguments")}} in einem Funktionskörper referenziert wird, verhalten sich wie Arrays, aber teilen nicht alle deren Methoden. Das arguments Objekt stellt ein {{jsxref("Global_Objects/Function/length","length")}} Attribut zur Verfügung, implementiert aber beispielsweise nicht die {{jsxref("Array.forEach", "forEach()")}} Methode.

+ +

Array Prototyp-Methoden können auf einem Array-ähnlichen Objekt aufgerufen werden, siehe folgendes Beispiel:

+ +
function printArguments() {
+  Array.prototype.forEach.call(arguments, function(item) {
+    console.log(item);
+  });
+}
+
+ +

Array Prototyp-Methoden können auch für Strings verwendet werden, weil diese einen sequenziellen Zugriff auf deren Zeichen erlauben, ähnlich wie Arrays:

+ +
Array.prototype.forEach.call('a string', function(chr) {
+  console.log(chr);
+});
+ +

Typisierte Arrays

+ +

JavaScript typisierte Arrays sind Array-ähnliche Objekte und stellen einen Mechanismus für den Zugriff auf Raw-Binärdaten zur Verfügung. Wie bereits erklärt, passen {{jsxref("Array")}} Objekte ihre Grösse dynamisch an und können beliebige Werte enthalten. JavaScript Engines führen Optimierungen durch, damit diese Arrays schneller sind. Je stärker Web-Applikationen werden mit Features wie Audio und Video Manipulation, Zugriff auf Raw Daten mit WebSockets und so weiter, ist es hilfreich, wenn JavaScript Code einfach und schnell Raw Binärdaten in typisierten Arrays manipulieren kann.

+ +

Buffers und Views: Typisierte Array Architektur

+ +

Um maximale Flexibilität und Effizienz zu erreichen, werden typisierte Arrays in JavaScript auf Buffers und Views aufgeteilt. Ein Buffer (implementiert durch das {{jsxref("ArrayBuffer")}} Objekt) ist ein Objekt, welches einen Block Daten repräsentiert; es hat kein Format und keine Mechanismen für den Zugriff auf Inhalte. Um auf den Speicher in einem Buffer zuzugreifen, wird eine View benötigt. Eine View stellt einen Kontext — einen Datentyp, Start-Offset und eine Anzahl Elemente — zur Verfügung, welcher die Daten in einen typisierten Array verwandelt.

+ +

Typed arrays in an ArrayBuffer

+ +

ArrayBuffer

+ +

Der {{jsxref("ArrayBuffer")}} ist ein Datentyp, welcher für die Darstellung von generischen Binär-Daten-Buffer mit einer fixen Grösse. Der Inhalt eines ArrayBuffer kann nicht direkt manipuliert werden; stattdessen kann eine typisierte Array-View oder eine {{jsxref("DataView")}} erstellt werden, welches den Buffer in einem spezifischen Format darstellt, welche dann für das Lesen und Schreiben der Inhalte auf dem Buffer verwendet werden kann.

+ +

Typisierte Array-Views

+ +

Typisierte Array-Views haben selbstbeschreibende Namen und stellen Views für alle geläufigen numerischen Typen, wie Int8, Uint32, Float64 und so weiter, zur Verfügung. Es gibt ein spezielles typisiertes Array: Uint8ClampedArray. Es klemmt (clamps) zwischen 0 und 255. Dies ist hilfreich für Canvas Datenverarbeitung, zum Beispiel.

+ +

{{page("/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects")}}

+ +

Für weitere Informationen, siehe JavaScript Typisierte Arrays und die Referenzdokumentation für die unterschiedlichen {{jsxref("TypedArray")}} Objekte.

+ +

{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}

diff --git a/files/de/web/javascript/guide/keyed_collections/index.html b/files/de/web/javascript/guide/keyed_collections/index.html new file mode 100644 index 0000000000..a9b501da9e --- /dev/null +++ b/files/de/web/javascript/guide/keyed_collections/index.html @@ -0,0 +1,157 @@ +--- +title: Collections mit Schlüssel +slug: Web/JavaScript/Guide/Keyed_collections +tags: + - Collections + - Guide + - JavaScript + - Map + - 'l10n:priority' + - set +translation_of: Web/JavaScript/Guide/Keyed_collections +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Indexed_Collections", "Web/JavaScript/Guide/Working_with_Objects")}}
+ +

Dieses Kapitel gibt eine Einleitung in Sammlungen von Daten, welche mit einem Schlüssel verknüpft werden. Map und Set Objekte enthalten Elemente, die in der Reihenfolge ihres Einfügens iterierbar sind.

+ +

Maps

+ +

Map Objekt

+ +

ECMAScript 2015 führt eine neue Datenstruktur ein, um Werte auf Werte zu abbildet. Ein {{jsxref("Map")}} Objekt ist eine einfache Schlüssel/Werte-Abbildung und man kann über die Element in der Einfügereihenfolge iterieren.

+ +

Das folgende Beispiel zeigt einige Basisoperationen mit einer Map.  Für mehr Beispiele und die komplette API siehe zudem die Referenzseite {{jsxref("Map")}}. Man kann eine {{jsxref("Statements/for...of","for...of")}} Schleife benutzen, um ein Array von [key, value] für jede Iteration zurückzugeben.

+ +
var sayings = new Map();
+sayings.set('dog', 'woof');
+sayings.set('cat', 'meow');
+sayings.set('elephant', 'toot');
+sayings.size; // 3
+sayings.get('fox'); // undefined
+sayings.has('bird'); // false
+sayings.delete('dog');
+sayings.has('dog'); // false
+
+for (var [key, value] of sayings) {
+  console.log(key + ' goes ' + value);
+}
+// "cat goes meow"
+// "elephant goes toot"
+
+sayings.clear();
+sayings.size; // 0
+
+ +

Object und Map im Vergleich

+ +

Traditionell werden {{jsxref("Object", "Objekte", "", 1)}} eingesetzt, um Strings auf Werte abzubilden. Objekte erlauben es Werte zu Schlüsseln zu setzen, diese Werte abzufragen, Schlüssel zu löschen und erkennen, ob etwas zu einem Schlüssel gespeichert wurde. Map Objekte haben ein paar Vorteile, was sie zu besseren Abbildungen macht.

+ + + +

Diese drei Tipps können bei der Entscheidung für eine Map oder ein Object helfen:

+ + + +

WeakMap Objekte

+ +

Das {{jsxref("WeakMap")}} Objekt ist eine Collection von Schlüssel/Werte-Paaren, wobei der Schlüssel nur ein Objekt sein kann und die Werte willkürliche Werte sein können. Die Objektreferenzen in den Schlüsseln werden weakly gehalten, was bedeutet, dass diese Referenz ein Ziel des Speicherbereinigung (Garbage Collectors (GC)) wird, wenn keine andere Referenz mehr auf dieses Objekt referenziert. Die WeakMap API ist die gleiche wie die Map API.

+ +

Einen Unterschied zu Map Objekten ist, dass WeakMap Schlüssel nicht aufzählbar sind (z. B. gibt es keine Methode, die eine Liste von Schlüsseln zurückgibt). Wenn dies der Fall wäre, würde die Liste vom Zustand der Speicherbereinigung abhängen, was zu Nicht-Determinismus führen würde.

+ +

Für mehr Informationen, Beispiele und "Warum WeakMap" auf der {{jsxref("WeakMap")}} Referenzseite.

+ +

Ein Einsatzgebiet für WeakMaps ist der Einsatz für Private Daten oder das Verbergen von Implementierungsdetails. Das folgende Beispiel ist von Nick Fitzgeralds Blogpost "Hiding Implementation Details with ECMAScript 6 WeakMaps". Die privaten Daten und Methoden, die zu dem Objekt gehören, werden in dem WeakMap Objekt privates gespeichert. Alles offene auf der Instanz und dem Prototyp ist Öffentlich; alles andere ist von Außen nicht erreichbar, weil privates vom Modul nicht exportiert wird.

+ +
const privates = new WeakMap();
+
+function Public() {
+  const me = {
+    // Private data goes here
+  };
+  privates.set(this, me);
+}
+
+Public.prototype.method = function() {
+  const me = privates.get(this);
+  // Do stuff with private data in `me`...
+};
+
+module.exports = Public;
+
+ +

Sets

+ +

Set Objekte

+ +

{{jsxref("Set")}} Objekte sind Collectionen mit Werten. Man kann über die Elemente in der Einfügereihenfolge iterieren. Ein Wert in einem Set kann nur einmal existieren und ist einzigartig in einer Set Collection.

+ +

Das folgende Beispiel zeigt einige Basisoperationen mit einem Set. Für mehr Beispiele und die komplette API siehe auf der {{jsxref("Set")}} Referenzseite nach.

+ +
var mySet = new Set();
+mySet.add(1);
+mySet.add('some text');
+mySet.add('foo');
+
+mySet.has(1); // true
+mySet.delete('foo');
+mySet.size; // 2
+
+for (let item of mySet) console.log(item);
+// 1
+// "some text"
+
+ +

Konvertierung zwischen Arrays und Sets

+ +

Man kann ein {{jsxref("Array")}} von einem Set erstellen, indem {{jsxref("Array.from")}} oder der spread Operator eingesetzt wird. Zudem akzeptiert der Set Konstruktor ein Array, um es in die andere Richtung zu konvertieren. Wichtig ist aber, dass Set Objekte Werte nur einmalig Speichern, so dass jedes Elementduplikat aus dem Array beim Konvertieren gelöscht wird.

+ +
Array.from(mySet);
+[...mySet2];
+
+mySet2 = new Set([1, 2, 3, 4]);
+
+ +

Array und Set im Vergleich

+ +

Traditionell wird eine Menge von Objekten in vielen Situationen in JavaScript in Arrays gespeichert. Das neue Set Objekt hat aber einige Vorteile:

+ + + +

WeakSet Objekte

+ +

{{jsxref("WeakSet")}} Objekte sind Collections von Objekten. Ein Objekt in einer WeakSet gibt es nur einmal; es ist einzigartig in der WeakSet Collection und Objekte sind nicht aufzählbar.

+ +

Die Hauptunterschiede zu einem {{jsxref("Set")}} Objekt sind:

+ + + +

Die Einsatzgebiete von WeakSet Objekten sind begrenzt. Sie erzeugen keine Speicherlecks, so dass sie sicher DOM Elemente enthalten können, um sie zum Beispiel zu verfolgen.

+ +

Schlüssel- und Wertegleichheit von Map und Set

+ +

Beide, die Schlüsselgleichheit von Map Objekten und die Wertegleichheit von Set Objekten basieren auf dem "same-value-zero Algorithmus":

+ + + +

{{PreviousNext("Web/JavaScript/Guide/Indexed_Collections", "Web/JavaScript/Guide/Working_with_Objects")}}

diff --git a/files/de/web/javascript/guide/kontrollfluss_und_fehlerbehandlung/index.html b/files/de/web/javascript/guide/kontrollfluss_und_fehlerbehandlung/index.html new file mode 100644 index 0000000000..97dbba8b3e --- /dev/null +++ b/files/de/web/javascript/guide/kontrollfluss_und_fehlerbehandlung/index.html @@ -0,0 +1,430 @@ +--- +title: Kontrollfluss und Fehlerbehandlung +slug: Web/JavaScript/Guide/Kontrollfluss_und_Fehlerbehandlung +tags: + - Beginner + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Grammatik_und_Typen", "Web/JavaScript/Guide/Schleifen_und_Iterationen")}}
+ +

JavaScript unterstützt eine Menge von Anweisungen, speziell um Verlaufs-Anweisungen zu kontrollieren, welches eine großartige Methode ist um Interaktivität in deine Anwendung einzuarbeiten. Dieses Kapitel liefert dir ein Überblick über diese Anweisungen.

+ +

Die JavaScript Referenzen beinhalten umfassende Details über die Anweisungen in diesem Kapitel. Das Semikolon (;) als Zeichen wird genutzt um Anweisungen im JavaScript Code einzuteilen.

+ +

Jeder JavaScript Ausdruck ist auch eine Anweisung. Schau ebenfalls in Ausdrücke und Operatoren, um komplette Informationen über Ausdrücke zu erhalten.

+ +

Block-Anweisungen

+ +

Das einfachste Statement ist das Block-Statement, welches genutzt wird um Anweisungen zu gruppieren. Dieser Block wird von einem Paar geschweiften Klammer umschlossen:

+ +
{
+  statement_1;
+  statement_2;
+  .
+  .
+  .
+  statement_n;
+}
+
+ +

Beispiele

+ +

Block-Statements werden meistens mit Kontrollfluss-Statements genutzt (z. B. if, for, while).

+ +
while (x < 10) {
+  x++;
+}
+
+ +

Hier ist, { x++; } das Block-Statement.

+ +

Wichtig: JavaScript hat vor ECMAScript2015 keine Block-Scopes. Variablen, die in einem Block deklariert werden, gehören zu der Funktion oder dem Skript und das Beschreiben der Variablen führt dazu, dass diese über den Block hinaus verfügbar ist. In anderen Worten, Block-Statements definieren keinen Scope. Alleinstehende Blöcke in JavaScript können komplett andere Ergebnisse erzeugen als in C oder Java. Zum Beispiel:

+ +
var x = 1;
+{
+  var x = 2;
+}
+console.log(x); // outputs 2
+
+ +

Hier wird 2 ausgegeben, weil var x innerhalb des Blocks im gleichen Scope ist wie das var x vor dem Block. In C oder Java hätte der selbe Code 1 ausgegeben.

+ +

Seit ECMAScript2015 sind let und const Variablendeklarationen, die an den Block gebunden sind. Siehe dazu auch die Referenzseiten {{jsxref("Statements/let", "let")}} und {{jsxref("Statements/const", "const")}} an.

+ +

Bedingte Statements

+ +

Ein bedingtes Statement ist eine Menge von Befehlen, die ausgeführt werden, wenn eine Bedingung wahr ist. JavaScript unterstützt zwei bedingte Statements: if...else und switch.

+ +

if...else Anweisungen

+ +

if wird eingesetzt um Statements auszuführen, wenn eine logische Bedingung wahr wird. Mit der optionalen else-Klausel werden Statements ausgeführt, wenn die Bedingung falsch ist. Ein if-Block sieht folgendermaßen aus:

+ +
if (bedingung) {
+  statement_1;
+} else {
+  statement_2;
+}
+ +

Hier kann die Bedingung ein Ausdruck sein, der zu true oder false ausgewertet wird. Siehe Boolean nach, um zu erfahren, was zu true und was zu false ausgewertet wird. Wenn bedingung zu true ausgewertet wird, wird statement_1 ausgeführt. Andernfalls wird statement_2 ausgeführt. statement_1 und statement_2 können beliebige Statements sein, auch weitere if-Statements.

+ +

Man kann zudem Statements mit else if konstruieren, um mehrere Bedingungen sequentiell zu testen:

+ +
if (bedingung_1) {
+  statement_1;
+} else if (bedingung_2) {
+  statement_2;
+} else if (bedingung_n) {
+  statement_n;
+} else {
+  statement_last;
+}
+
+ +

Um mehrere Statements auszuführen, werden diese in Blockstatements gruppiert ({ ... }). Generell ist es guter Stil immer Block-Statements zu benutzen, besonders bei verschachtelten if-Statements.

+ +
if (bedingung) {
+  statement_1_runs_if_condition_is_true;
+  statement_2_runs_if_condition_is_true;
+} else {
+  statement_3_runs_if_condition_is_false;
+  statement_4_runs_if_condition_is_false;
+}
+
+ +

Es ist ratsam, keine einfachen Zuweisungen in Bedingungen zu verwenden, da die Zuordnung mit der Prüfung auf Gleichheit verwechselt werden kann, wenn man über den Code schaut. Verwenden Sie zum Beispiel den folgenden Code nicht:

+ +
if (x = y) {
+  /* statements here */
+}
+
+ +

Wenn eine Zuweisung in einer Bedingung benötigt wird, ist es verbreitet diese in weitere runde Klammeren zu schreiben. Zum Beispiel:

+ +
if ((x = y)) {
+  /* statements here */
+}
+
+ +

Falsy Werte

+ +

Die folgenden Werte werden zu false ausgewertet (auch bekannt als {{Glossary("Falsy")}} Werte):

+ + + +

Alle anderen Werte, auch alle Objekte, werden zu true ausgewertet, wenn sie als Bedingung eingesetzt werden.

+ +

Es ist jedoch etwas verwirrend mit den primitiven boolean Werten true und false und den Werten des {{jsxref("Boolean")}}-Objektes, wie folgendes Beispiel zeigt:

+ +
var b = new Boolean(false);
+if (b)          // Die Bedingung wird zu true ausgewertet.
+if (b == true)  // Die Bedingung wird zu false ausgewertet.
+ +

Beispiel

+ +

Im folgenden Beispiel gibt die Funktion checkData true zurück, wenn die Anzahl der Zeichen in einem Text Objekt drei ist. Andernfalls wird ein Alert angezeigt, und false zurückgegeben.

+ +
function checkData() {
+  if (document.form1.threeChar.value.length == 3) {
+    return true;
+  } else {
+    alert("Enter exactly three characters. " +
+    document.form1.threeChar.value + " is not valid.");
+    return false;
+  }
+}
+
+ +

switch Statement

+ +

Ein switch Statement erlaubt es einen Ausdruck auszuwerten und das Resultat zu einem passenden Fall-Label (case-Label ) zuzuordnen. Wenn ein passendes Fall-Label gefunden wird, werden die zugehörigen Statements ausgeführt. Ein switch Statement sieht wie folgt aus:

+ +
switch (ausdruck) {
+  case label_1:
+    statements_1
+    [break;]
+  case label_2:
+    statements_2
+    [break;]
+    ...
+  default:
+    statements_def
+    [break;]
+}
+
+ +

Das Programm sucht als erstes nach eine case-Klausel mit einem Label, welches mit dem Wert des Ausgewerteten Ausdrucks übereinstimmt und gibt die Kontrolle zu dieser Klausel, was bedeutet, dass die zugehörigen Statements ausgeführt werden. Wenn kein passendes Label gefunden wird, sucht das Programm nach der optionalen default-Klausel und gibt die Kontrolle an diese, was bedeutet, dass die zugehörigen Statements ausgeführt werden. Wenn keine default-Klausel vorhanden ist, wird das switch beendet und das nächste Statement wird ausgeführt. Laut Konventionen ist die default-Klausel die letzte Klausel, das muss aber nicht immer so sein.

+ +

Das optionale break Statement, welches in jeder case-Klausel eingesetzt ist, sorgt daführ, dass nach der Klausel das switch Statement beendet wird und das Programm mit dem nachfolgenden Statement weiter macht. Wenn break weggelassen wird, wird das Programm mit dem nächsten Statement im switch weitermachen, was dazu führt, dass alle nachlogenden case-Klauseln und die optionale default-Klausel mit ausgeführt werden.

+ +

Beispiel

+ +

Im folgenden Beispiel wird der case "Bananas" ausgeführt, wenn fruittype zu "Bananas" ausgewertet wird. Die break Statements bewirken, dass das switch beendet wird und das nach switch stehende Statement ausgeführt wird. Wird break im case "Bananas" weggelassen, so wird der case "Cherries" mit ausgeführt.

+ +
switch (fruittype) {
+  case 'Oranges':
+    console.log('Oranges are $0.59 a pound.');
+    break;
+  case 'Apples':
+    console.log('Apples are $0.32 a pound.');
+    break;
+  case 'Bananas':
+    console.log('Bananas are $0.48 a pound.');
+    break;
+  case 'Cherries':
+    console.log('Cherries are $3.00 a pound.');
+    break;
+  case 'Mangoes':
+    console.log('Mangoes are $0.56 a pound.');
+    break;
+  case 'Papayas':
+    console.log('Mangoes and papayas are $2.79 a pound.');
+    break;
+  default:
+   console.log('Sorry, we are out of ' + fruittype + '.');
+}
+console.log("Is there anything else you'd like?");
+ +

Statements zur Fehler- bzw. Ausnahmebehandlung

+ +

Man kann mit dem throw Statement Fehler werfen (erzeugen) und diese mit dem Einsatz des try...catch Statements auffangen und verarbeiten.

+ + + +

Ausnahmetypen

+ +

Jedes Objekt in JavaScript kann als Fehler bzw. Ausnahme geworfen werden. Nicht alle Fehlerobjekte müssen auf die gleiche Art und Weise erstellt worden sein. Trotz des häufig Einsatzes von Zahlen oder Strings als Ausnahmen ist es deutlich effektiver die speziell für Ausnahmen erstellten Typen zu benutzen:

+ + + +

throw Statement

+ +

Das throw Statement wird benutzt, um eine Exception (Ausnahme / Fehler) zu werfen. Wenn eine Exception geworfen wird, so wird ein Ausdruck spezifiziert, welcher den Wert, welcher geworfen wird, spezifiziert:

+ +
throw ausdruck;
+
+ +

Man kann jeden Ausdruck werfen, nicht nur Ausdrücke eines bestimmten Typs. Der folgende Code wirft mehrere Ausnahmen verschiedenen Typs:

+ +
throw "Error2";   // String type
+throw 42;         // Number type
+throw true;       // Boolean type
+throw {toString: function() { return "I'm an object!"; } };
+
+ +
Notiz: Man kann ein Objekt beim Werfen einer Exception spezifizieren. Im catch Block können die Eigenschaften des Objektes referenziert werden.
+ +
// Erstellt ein Objekt vom Typ UserException
+function UserException (message){
+  this.message=message;
+  this.name="UserException";
+}
+
+// Macht die Konvertierung der Exception in einen schönen String, wenn die Exception
+// als String genutzt werden soll.
+// (z. B. in der Fehlerconsole)
+UserException.prototype.toString = function () {
+  return this.name + ': "' + this.message + '"';
+}
+
+// Erstellt eine Instanz der UserException und wirft diese
+throw new UserException("Value too high");
+ +

try...catch Statement

+ +

Das try...catch Statement markiert einen Block von Statements, welcher versucht wird auszuführen, und einen oder mehrere Blöcke welche auf geworfene Exceptions abfangen. Wenn eine Exception geworfen wird, fängt das try...catch Statements diese ab.

+ +

Das try...catch Statement besteht aus einem try Block, welcher ein oder mehrere Statements enthält, und null oder mehr catch Blöcken, welche Statements spezifizieren, welche eine im try Block geworfene Exception abfangen und behandeln. Das Statement versucht den try Block erfolgreich abzuarbeiten und wenn dieser nicht erfolgreich ist, wird die Kontrolle an den catch Block gegeben. Wenn ein Statement in dem try Block (oder eine im try Block aufgerufene Funktion) eine Exception wirft, wird der Kontrollfluss sofort an den catch Block übergeben. Wenn keine Exception im try Block geworfen wird, wird der catch Block übersprungen. Der optionale finally Block wird nach dem try und nach dem catch Block ausgeführt, bevor das auf das try...catch Statement folgenden Statement ausgeführt wird.

+ +

Das Folgende Beispiel benutzt ein try...catch Statement. Das Beispiel ruft eine Funktion auf, welche einen Monatsnamen aus einen Array zurückgibt, je nachdem, welcher Wert übergeben wurde. Wenn der übergebene Wert keine korrekte Monatsnummer ist (1 - 12), dann wird eine Exception mit dem Wert "InvalidMonthNo" geworfen und die Statements im catch Block setzen die monthName Variable auf unknown.

+ +
function getMonthName (mo) {
+  mo = mo-1; // Justiert Monatsnummer zu Arrayindex (1=Jan, 12=Dec)
+  var months = ["Jan","Feb","Mar","Apr","May","Jun","Jul",
+                "Aug","Sep","Oct","Nov","Dec"];
+  if (months[mo] != null) {
+    return months[mo];
+  } else {
+    throw "InvalidMonthNo"; // throw Schlüsselwort wird hier benutzt
+  }
+}
+
+try { // statements to try
+  monthName = getMonthName(myMonth); // Funktion die Exceptions werfen kann
+}
+catch (e) {
+  monthName = "unknown";
+  logMyErrors(e); // Gibt Exception Objekt weiter für Fehlerbehandlung
+}
+
+ +

Der catch Block

+ +

Man kann einen catch Block einsetzen, um alle Exceptions, die im try Block generiert werden, zu verarbeiten.

+ +
catch (catchID) {
+  statements
+}
+
+ +

Der catch Block spezifiziert einen Variable (catchID im voranstehenden Syntaxbeispiel), welcher den Wert des throw Statements enthält. Man kann über diese Variable Informationen über die geworfene Exception abfragen. JavaScript erstellt diese Variable, wenn der Programmfluss in den catch Block geht. Die Variable existiert nur in dem catch Block. Nach dem beenden des catch Blocks ist die Variable nicht mehr verfügbar.

+ +

Im nächsten Beispeil wird eine Exception geworfen. Wenn die Exception geworfen wird, wird der Programmfluss in den catch Block gegeben.

+ +
try {
+  throw "myException" // Erstellt eine Exception
+}
+catch (e) {
+  // Statements, die die Exception verarbeiten
+  logMyErrors(e) // Verarbeitet Exception Objekt zur Fehlerbehandlung
+}
+
+ +

Der finally Block

+ +

Der finally Block enthält Statements, welche nach dem try und catch Block ausgeführt werden, bevor das Statement nach dem try...catch Statement ausgeführt wird. Der finally Block wird ausgeführt, egal ob eine Exception geworfen wird oder nicht. Wenn eine Exception geworfen wird, wird der finally auch ausgeführt, wenn kein catch die Exception abfängt.

+ +

Man kann den finally Block benutzen, um Skripte fehlertoleranter zu gestalten. Zum Beispiel kann eine Ressource im finally Block geschlossen werden. Das Folgende Beispiel öffnet eine Datei und führt Statements aus, um die Datei zu benutzen (Serverseitiges JavaScript erlaubt Zugriffe auf Dateien). Wenn eine Exception geworfen wird, während die Datei geöffnet ist, sorgt der finally Block dafür, dass die Datei wieder geschlossen wird.

+ +
openMyFile();
+try {
+  writeMyFile(theData); //Das kann Exceptions werfen
+} catch(e) {
+  handleError(e); // Wenn eine Exception geworfen wird, wird sie hier verarbeitet
+} finally {
+  closeMyFile(); // Schließt immer die Ressource
+}
+
+ +

Wenn der finally Block einen Rückgabewert definiert, ist dieser der Rückgabewert des try-catch-finally Prozedur, unabhängig davon, ob return Statements im try und catch Block verwendet werden.

+ +
function f() {
+  try {
+    console.log(0);
+    throw "bogus";
+  } catch(e) {
+    console.log(1);
+    return true; // Dieses return Statement is überflüssig
+                 // weil im finally Block ebenfalls eins vorhanden ist
+    console.log(2); // wird niemals erreicht
+  } finally {
+    console.log(3);
+    return false; // überschreibt früheres return Statements
+    console.log(4); // wird niemals erreicht
+  }
+  // false wird jetzt zurückgegeben
+  console.log(5); // wird niemals erreicht
+}
+f(); // alerts 0, 1, 3; returns false
+
+ +

Das Überschreiben des Rückgabewertes durch den finally Block überschreibt auch geworfene Exceptions, wenn diese im catch geworfen werden.

+ +
function f() {
+  try {
+    throw "bogus";
+  } catch(e) {
+    console.log('caught inner "bogus"');
+    throw e; // Dieses throw Statement is überflüssig
+             // weil im finally Block ein return vorkommt
+  } finally {
+    return false; // Überschreibt das vorherige "throw"
+  }
+  // false wird zurückgegeben
+}
+
+try {
+  f();
+} catch(e) {
+  // Dieser bereich wird nie erreicht, weil
+  // die Exception durch das return im
+  // finally block überschrieben wird.
+  console.log('caught outer "bogus"');
+}
+
+// OUTPUT
+// caught inner "bogus"
+ +

Verschachtelte try...catch Statements

+ +

Man kann mehrere try...catch Statements ineinander verschachteln. Wenn ein inneres try...catch Statements keinen catch Block hat, wird ein äußeres try...catch Statement mit einem catch Block eine Exception auffangen. Mehr Informationen gibt es im Kapitel Verschachtelte try-Blöcke auf der try...catch Seite.

+ +

Nützliche Verwendung des Error Objekts

+ +

Abhängig vom der Art des Fehlers, möchte man die Möglichkeit haben einen Namen und eine Fehlernachricht zu vergeben. 'name' und 'message' Eigenschaften sind generell durch die Klasse Error (z. B. DOMException oder Error) unterstützt. Die 'message' Eigenschaft ist dabei eine String-Repräsentation des Fehlers, so wie sie bei der Konvertierung des Objektes zu einem String benötigt wird.

+ +

Wenn man beim Werfen von eigenen Exceptions die Vorteile dieser Eigenschaften nutzen möchte (wenn zum Beipsiel der catch Block nicht zwischen eigenen und System Exceptions unterscheidet), kann der Konstruktor von Error benutzt werden. Zum Beispiel:

+ +
function doSomethingErrorProne () {
+  if (ourCodeMakesAMistake()) {
+    throw (new Error('The message'));
+  } else {
+    doSomethingToGetAJavascriptError();
+  }
+}
+....
+try {
+  doSomethingErrorProne();
+}
+catch (e) {
+  console.log(e.name); // logs 'Error'
+  console.log(e.message); // logs 'The message' or a JavaScript error message)
+}
+ +

Promises

+ +

Mit ECMAScript 6 hat JavaScript die Unterstützung für {{jsxref("Promise")}} Objekte bekommen, welche zum Steuern von asynchronen Operationen genutzt wird.

+ +

Ein Promise ist in einem der folgenen Status:

+ + + +

+ +

Ein Bild mit XHR laden

+ +

Ein einfaches Beispiel für den Einsatz von Promise und XMLHttpRequest ist das Laden eines Bildes (Siehe MDN GitHub js-examples Repository; man kann es hier auch in Aktion sehen). Jeder Schritt ist Kommentiert und erlaubt es der Architektur des Promise und XHR zu folgen. Hier ist die unkommentierte Version, welche den Promise Ablauf zeigt, zu sehen, so dass man eine Idee davon bekommt.

+ +
function imgLoad(url) {
+  return new Promise(function(resolve, reject) {
+    var request = new XMLHttpRequest();
+    request.open('GET', url);
+    request.responseType = 'blob';
+    request.onload = function() {
+      if (request.status === 200) {
+        resolve(request.response);
+      } else {
+        reject(Error('Image didn\'t load successfully; error code:'
+                     + request.statusText));
+      }
+    };
+    request.onerror = function() {
+      reject(Error('There was a network error.'));
+    };
+    request.send();
+  });
+}
+ +

Für deteiliertere Informationen, kann man sich die {{jsxref("Promise")}} Referenz Seite und den Using Promises Guide anschauen.

+ +
{{PreviousNext("Web/JavaScript/Guide/Grammatik_und_Typen", "Web/JavaScript/Guide/Schleifen_und_Iterationen")}}
diff --git a/files/de/web/javascript/guide/meta_programming/index.html b/files/de/web/javascript/guide/meta_programming/index.html new file mode 100644 index 0000000000..691f5b05a6 --- /dev/null +++ b/files/de/web/javascript/guide/meta_programming/index.html @@ -0,0 +1,265 @@ +--- +title: Meta programming +slug: Web/JavaScript/Guide/Meta_programming +tags: + - Guide + - JavaScript + - Proxy + - Reflect + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Meta_programming +--- +
{{jsSidebar("JavaScript Guide")}} {{Previous("Web/JavaScript/Guide/Iterators_and_Generators")}}
+ +

Beginnend mit ECMAScript 2015 hat JavaScript Unterstützung für {{jsxref("Proxy")}} and {{jsxref("Reflect")}} Objekte erhalten, welche das Abfangen und Definieren von benutzerdefinierten Verhaltens für grundlegenden Sprachoperation erlaubt (z. B. Eigenschaftensuche, Zuweisung, Aufzählung, Funktionsaufruf usw.). Mit der Hilfe dieser beiden Objekte ist es möglich auf der Metaebene von JavaScript zu programmieren.

+ +

Proxies

+ +

Eingeführt in ECMAScript 6 erlaubt das {{jsxref("Proxy")}} Objekt das Abfangen und Definieren von benutzerdefinierten Verhaltens für bestimmte Operationen. Zum Beispiel um die Eigenschaft eines Objektes zu erhalten:

+ +
var handler = {
+  get: function(target, name) {
+    return name in target ? target[name] : 42;
+  }
+};
+
+var p = new Proxy({}, handler);
+p.a = 1;
+console.log(p.a, p.b); // 1, 42
+
+ +

Das Proxy Objekt definiert einen Ziel (target) (hier ein leeres Objekt) und einen handler (Verhaltens) Objekt in dem ein get Trap implementiert ist. In diesem Beispiel wird kein undefined zurückgegeben, wenn Eigenschaften nicht definiert sind. Stattdessen wird die Zahl 42 zurückgegeben.

+ +

Weitere Beispiele sind auf der {{jsxref("Proxy")}} Referenzseite verfügbar.

+ +

Terminologie

+ +

Die folgenden Terme werden im Zusammenhang mit der Funktionalität von Proxies verwendet.

+ +
+
{{jsxref("Global_Objects/Proxy/handler","Handler","","true")}}
+
Platzhalterobjekt, welches Traps enthält.
+
Traps
+
Die Methoden, die Zugriff auf Eigenschaften unterstützen. Diese sind analog zu Traps in Betriebssystemen.
+
Ziel
+
Objekt, welches vom Proxy virtualisiert wird. Es wird häufig als Speicher-Backend für den Proxy benutzt. Invarianten (Semantik, die unverändert bleiben) bezüglich nicht erweiterbarer Objekteigenschaften oder nicht konfigurierbarer Eigenschaften werden gegen das Ziel verifiziert.
+
Invarianten
+
Semantiken, die bei der Implementierung von benutzerdefinierten Operationen unverändert bleiben, werden als Invarianten bezeichnet. Wenn Sie gegen die Invarianten eines Handlers verstoßen, wird ein {{jsxref("TypeError")}} erzeugt.
+
+ +

Handlers und Traps

+ +

Die Folgende Tabelle fasst die verfügbaren Traps von Proxy Objekten zusammen. Siehe auf der Referenzseite für detailliertere Erklärungen und Beispiele.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Handler / TrapInterceptionsInvarianten
{{jsxref("Global_Objects/Proxy/handler/getPrototypeOf", "handler.getPrototypeOf()")}}{{jsxref("Object.getPrototypeOf()")}}
+ {{jsxref("Reflect.getPrototypeOf()")}}
+ {{jsxref("Object/proto", "__proto__")}}
+ {{jsxref("Object.prototype.isPrototypeOf()")}}
+ {{jsxref("Operators/instanceof", "instanceof")}}
+
    +
  • Die getPrototypeOf Methode muss ein Objekt or null zurückgeben.
  • +
  • Wenn target nicht erweiterbar ist, muss die Object.getPrototypeOf(proxy) Methode das gleiche zurückgeben wie Object.getPrototypeOf(target).
  • +
+
{{jsxref("Global_Objects/Proxy/handler/setPrototypeOf", "handler.setPrototypeOf()")}}{{jsxref("Object.setPrototypeOf()")}}
+ {{jsxref("Reflect.setPrototypeOf()")}}
Wenn target nicht erweiterbar ist, muss der prototype Parameter der gleiche Wert sein wie Object.getPrototypeOf(target).
{{jsxref("Global_Objects/Proxy/handler/isExtensible", "handler.isExtensible()")}}{{jsxref("Object.isExtensible()")}}
+ {{jsxref("Reflect.isExtensible()")}}
Object.isExtensible(proxy) muss den gleichen Wert wie Object.isExtensible(target) zurückgeben.
{{jsxref("Global_Objects/Proxy/handler/preventExtensions", "handler.preventExtensions()")}}{{jsxref("Object.preventExtensions()")}}
+ {{jsxref("Reflect.preventExtensions()")}}
Object.preventExtensions(proxy) gibt nur true zurück, wenn Object.isExtensible(proxy) false ist.
{{jsxref("Global_Objects/Proxy/handler/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}{{jsxref("Object.getOwnPropertyDescriptor()")}}
+ {{jsxref("Reflect.getOwnPropertyDescriptor()")}}
+
    +
  • getOwnPropertyDescriptor muss ein Objekt oder undefined zurückgeben.
  • +
  • Eine Eigenschaft kann nicht als nichtexistent erkannt werden, wenn sie als nicht konfigurierbare Eigenschaft des Zielobjektes existiert.
  • +
  • Eine Eigenschaft kann nicht als nichtexistent erkannt werden, wenn sie als Eigenschaft des Zielobjektes existiert und das Zielobjekt nicht erweiterbar ist.
  • +
  • Eine Eigenschaft kann nicht als existent erkannt werden, wenn sie nicht als Eigenschaft des Zielobjektes existiert und das Zielobjekt nicht erweiterbar ist.
  • +
  • Eine Eigenschaft kann nicht als nicht konfigurierbar erkannt werden, wenn sie nicht als Eigenschaft des Zielobjektes existiert oder wenn sie als konfigurierbare Eigenschaft des Zielobjekt existiert.
  • +
  • Das Ergebnis von Object.getOwnPropertyDescriptor(target) kann dem Zielobjekt mit Object.defineProperty übergeben werden ohne, dass ein Fehler erzeugt wird.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty()")}}{{jsxref("Object.defineProperty()")}}
+ {{jsxref("Reflect.defineProperty()")}}
+
    +
  • Eine Eigenschaft kann nicht hinzugefügt werden, wenn das Zielobjekt nicht erweiterbar ist.
  • +
  • Eine Eigenschaft kann nicht hinzugefügt werden oder zu nicht konfigurierbar geändert werden, wenn es nicht als nicht konfigurierbares Eigenschaft im Zielobjekt existiert.
  • +
  • Eine Eigenschaft darf nicht nicht konfigurierbar sein, wenn die zugehörige konfigurierbare Eigenschaft im Zielobjekt existiert.
  • +
  • Wenn eine Eigenschaft eine zugehörige Eigenschaft im Zielobjekt hat, so wird Object.defineProperty(target, prop, descriptor) keinen Fehler erzeugen.
  • +
  • Im Strict Mode, wird ein falscher Rückgabewert des defineProperty Handler einen {{jsxref("TypeError")}} Erzeugen.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/has", "handler.has()")}}Eigenschaftsabfrage: foo in proxy
+ Vererbte Eigenschaftsabfrage: foo in Object.create(proxy)
+ {{jsxref("Reflect.has()")}}
+
    +
  • Eine Eigenschaft kan nicht als nichtexistent erkannt werden, wenn sie als nicht konfigurierbare Eigenschaft im Zielobjekt existiert.
  • +
  • Eine Eigenschaft kan nicht als nichtexistent erkannt werden, wenn sie als Eigenschaft im Zielobjekt existiert und das Zielobjekt nicht erweiterbar ist.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/get", "handler.get()")}}Eigenschaftszugriff: proxy[foo]and proxy.bar
+ Vererbter Eigenschaftszugriff: Object.create(proxy)[foo]
+ {{jsxref("Reflect.get()")}}
+
    +
  • Der Wert, der für eine Eigenschaft zurückgegeben wird, muss der gleiche sein wie der in der zugehörigen Eigenschaft des Zielobjekts, wenn die Eigenschaft im Zielobjekt nicht überschreibbar und nicht konfigurierbar ist.
  • +
  • Der Wert, der für eine Eigenschaft zurückgegeben wird, muss undefined sein, wenn die zugehörige Eigenschaft im Zielobjekt einen nicht konfigurierbare Zugriffseigenschaft hat, dessen [[Get]] Attribut undefined ist.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/set", "handler.set()")}}Eigenschaftszuweisung: proxy[foo] = bar and proxy.foo = bar
+ Vererbte Eigenschaftszuweisung: Object.create(proxy)[foo] = bar
+ {{jsxref("Reflect.set()")}}
+
    +
  • Der Wert kann nicht zu einem geändert werden, der anders als dem Wert im Zielobjekt ist, wenn die zugehörige Eigenschaft im Zielobjekt eine nicht überschreibbare, nicht konfigurierbare Dateneigenschaft ist.
  • +
  • Der Wert der Eigenschaft kann nicht geändert werden, wenn die zugehörige Eigenschaft im Zielobjekt nicht konfigurierbar ist und das [[Set]] Attribut den Wert undefined hat.
  • +
  • Im Strict Mode, wird ein falscher Rückgabewert des set Handlers einen {{jsxref("TypeError")}} erzeugen.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/deleteProperty", "handler.deleteProperty()")}}Eigenschaft löschen: delete proxy[foo] und delete proxy.foo
+ {{jsxref("Reflect.deleteProperty()")}}
Eine Eigenschaft kann nicht gelöscht werden, Wenn sie als nicht konfigurierbare Eigenschaft im Zielobjekt existiert.
{{jsxref("Global_Objects/Proxy/handler/enumerate", "handler.enumerate()")}}Eigenschaft aufzählen (enumeration) / for...in: for (var name in proxy) {...}
+ {{jsxref("Reflect.enumerate()")}}
Die enumerate Methode muss ein Objekt zurückgeben.
{{jsxref("Global_Objects/Proxy/handler/ownKeys", "handler.ownKeys()")}}{{jsxref("Object.getOwnPropertyNames()")}}
+ {{jsxref("Object.getOwnPropertySymbols()")}}
+ {{jsxref("Object.keys()")}}
+ {{jsxref("Reflect.ownKeys()")}}
+
    +
  • Das Ergebnis von ownKeys ist eine Liste.
  • +
  • Der Typ jedes Elements in der Ergebnisliste ist entweder {{jsxref("String")}} oder {{jsxref("Symbol")}}.
  • +
  • Die Ergebnisliste muss alle Schlüssel von nicht konfigurierbaren Eigenschaften des Zielobjektes enthalten.
  • +
  • Wenn das Zielobjekt nicht erweiterbar ist, muss die Ergebnisliste alle Schlüssel des Zielobjektes enthalten und keine anderen Werte.
  • +
+
{{jsxref("Global_Objects/Proxy/handler/apply", "handler.apply()")}}proxy(..args)
+ {{jsxref("Function.prototype.apply()")}} and {{jsxref("Function.prototype.call()")}}
+ {{jsxref("Reflect.apply()")}}
Es gibt keine Invarianten für die handler.apply Methode.
{{jsxref("Global_Objects/Proxy/handler/construct", "handler.construct()")}}new proxy(...args)
+ {{jsxref("Reflect.construct()")}}
Das Ergebnis muss ein Object sein.
+ +

Widerrufbarer Proxy

+ +

Die {{jsxref("Proxy.revocable()")}} Methode wird benutzt, um ein widerrufbares Proxy Objekt zu erstellen. Das bedeutet, dass der Proxy mit der Funktion revoke widerrufen werden kann und der Proxy ausgeschaltet wird. Danach wird jede Operation auf dem Proxy zu einem {{jsxref("TypeError")}} führen.

+ +
var revocable = Proxy.revocable({}, {
+  get: function(target, name) {
+    return '[[' + name + ']]';
+  }
+});
+var proxy = revocable.proxy;
+console.log(proxy.foo); // "[[foo]]"
+
+revocable.revoke();
+
+console.log(proxy.foo);  // TypeError is thrown
+proxy.foo = 1;           // TypeError again
+delete proxy.foo;        // still TypeError
+typeof proxy;            // "object", typeof doesn't trigger any trap
+ +

Reflection

+ +

{{jsxref("Reflect")}} ist ein Standardobjekt welches Methoden unterstützt, welche das Abfragen von JavaScript Operationen erlauben. Die Methoden sind die gleichen wie die eines {{jsxref("Global_Objects/Proxy/handler","Proxy Handlers","","true")}}. Reflect ist kein Funktionsobjekt.

+ +

Reflect hilft beim Weiterleiten von Standardoperationen des Handlers zu dem Zielobjekt.

+ +

Mit bekommt man {{jsxref("Reflect.has()")}} zum Beispiel den in Operator als Funktion:

+ +
Reflect.has(Object, 'assign'); // true
+
+ +

Eine bessere apply Funktion

+ +

In ES5 wird typischerweise die {{jsxref("Function.prototype.apply()")}} Methode genutzt, um eine Funktion mit einem gegebenen this Wert und arguments als Array (oder ein Array-ähnliches Objekt) benutzt.

+ +
Function.prototype.apply.call(Math.floor, undefined, [1.75]);
+ +

Mit {{jsxref("Reflect.apply")}} wird dieses weniger Langatmig und leichter verständlich:

+ +
Reflect.apply(Math.floor, undefined, [1.75]);
+// 1;
+
+Reflect.apply(String.fromCharCode, undefined, [104, 101, 108, 108, 111]);
+// "hello"
+
+Reflect.apply(RegExp.prototype.exec, /ab/, ['confabulation']).index;
+// 4
+
+Reflect.apply(''.charAt, 'ponies', [3]);
+// "i"
+
+ +

Prüfen ob Eigenschaftsdefinitionen erfolgreich waren

+ +

Mit {{jsxref("Object.defineProperty")}}, welche ein Objekt zurück gibt, wenn es erfolgreich war, oder andernfalls ein {{jsxref("TypeError")}} erzeugt, muss man ein {{jsxref("Statements/try...catch","try...catch")}} Block benutzen, um einen Fehler bei der Definition einer Eigenschaft abzufangen. Weil {{jsxref("Reflect.defineProperty")}} einen Boolean als Status zurück gibt, kann man einfach einen {{jsxref("Statements/if...else","if...else")}} Block benutzen:

+ +
if (Reflect.defineProperty(target, property, attributes)) {
+  // success
+} else {
+  // failure
+}
+ +

{{Previous("Web/JavaScript/Guide/Iterators_and_Generators")}}

diff --git a/files/de/web/javascript/guide/mit_objekten_arbeiten/index.html b/files/de/web/javascript/guide/mit_objekten_arbeiten/index.html new file mode 100644 index 0000000000..2448621a4a --- /dev/null +++ b/files/de/web/javascript/guide/mit_objekten_arbeiten/index.html @@ -0,0 +1,506 @@ +--- +title: Mit Objekten arbeiten +slug: Web/JavaScript/Guide/Mit_Objekten_arbeiten +tags: + - Beginner + - Comparing object + - Constructor + - Document + - Guide + - JavaScript + - Object + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Working_with_Objects +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Feinheiten_des_Objektmodells")}}
+ +

JavaScript ist nach einem einfachen objekt-basierten Muster entworfen. Ein Objekt ist eine Sammlung von Eigenschaften und eine Eigenschaft ist eine Verbindung von einem Namen und einem Wert. Der Wert einer Eigenschaft kann eine Funktion sein. In diesem Fall wird die Eigenschaft Methode genannt. Zusätzlich zu Objekten, die vom Browser vordefiniert sind, können auch eigene Objekte definiert werden. Dieses Kapitel beschreibt, wie Objekte, Eigenschaften, Funktionen und Methoden benutzt und eigene Objekte erzeugt werden können.

+ +

Objekte Übersicht

+ +

Objekte in JavaScript, wie in vielen anderen Programmiersprachen, können mit Objekten aus dem realen Leben verglichen werden. Das Konzept der Objekte in JavaScript kann mit greifbaren Objekten aus der realen Welt verstanden werden.

+ +

In JavaScript ist ein Objekt eine für sich stehende Einheit mit Eigenschaften und Typ. Vergleichbar mit einer Tasse zum Beispiel. Eine Tasse ist ein Objekt mit Eigenschaften. Eine Tasse hat eine Farbe, ein Design, ein Gewicht, ein Material, aus dem sie erstellt wurde, usw. Ebenso können JavaScript Objekte Eigenschaften besitzen, die Ihre Besonderheiten definieren.

+ +

Objekte und Eigenschaften

+ +

Ein JavaScript Objekt besitzt mit ihm verbundene Eigenschaften. Eine Eigenschaft eines Objekts kann als Variable erklärt werden, die dem Objekt angeheftet ist. Objekteigenschaften sind grundsätzlich das Gleiche wie übliche Variablen ausser der Verknüpfung mit Objekten. Die Eigenschaften eines Objekts definieren seine Charakteristik. Auf die Eigenschaften eines Objekt kann mit einer einfachen Punkt-Notation zugegriffen werden:

+ +
objectName.propertyName
+
+ +

Wie bei allen JavaScript-Variablen sind Objektname (eine normale Variable) und Attribute groß-, und kleinschreibungsabhängig. Ein Attribut wird definiert, indem es einen Wert zugewiesen bekommt. Zum Beispiel: Ein Objekt namens myCar mit den Attributen make, model, und year:

+ +
var myCar = new Object();
+myCar.make = "Ford";
+myCar.model = "Mustang";
+myCar.year = 1969;
+
+ +

Nicht initialisierte Eigenschaften eines Objektes haben den Wert {{jsxref("undefined")}} (nicht {{jsxref("null")}}).

+ +
myCar.color; // undefined
+ +

Eigenschaften von JavaScript-Objekten können auch mit der Klammernotation (für weitere Informationen siehe property accessors). Objekte werden manchmal assoziative Arrays genannt da jede Eigenschaft mit einer Zeichenkette assoziiert ist mit der man auf die Eigenschaft zugreifen kann. Zum Beispiel kann man auf die Eigenschaften des Objekts myCar folgendermassen zugreifen:

+ +
myCar["make"] = "Ford";
+myCar["model"] = "Mustang";
+myCar["year"] = 1969;
+
+ +

Der Name einer Objekteigenschaft kann ein valider JavaScript String sein. Dies kann auch alles sein, was in einen String convertiert werden kann, inklusive eines leeren Strings. Immer, wenn der Name einer Eigenschaft kein valider JavaScript Bezeichner ist (zum Beispiel ein Name mit einem Leerzeichen oder einem minus oder ein Name der mit einer Ziffer beginnt), kann dieses nur über die Klammernotation erreicht werden. Diese Notation ist zusätzlich sehr hilfreich, wenn Namen von Eigenschaften dynamisch ermittelt werden (Wenn die Namen nicht bis zur Laufzeit ermittelt werden können). Im folgenden ein Beispiel:

+ +
// four variables are created and assigned in a single go,
+// separated by commas
+var myObj = new Object(),
+    str = 'myString',
+    rand = Math.random(),
+    obj = new Object();
+
+myObj.type              = 'Dot syntax';
+myObj['date created']   = 'String with space';
+myObj[str]              = 'String value';
+myObj[rand]             = 'Random Number';
+myObj[obj]              = 'Object';
+myObj['']               = 'Even an empty string';
+
+console.log(myObj);
+
+ +

Zu bemerken ist, dass alle Schlüssel in der Klammernotation zum Typ Strings konvertiert werden, weil in JavaScript nur Strings als Schlüssel bei Objekte erlaubt sind. Zum Beispiel wird im orberen Beispiel obj konvertiert wenn es in myObj benutzt wird. JavaScript ruft die obj.toString() Methode auf und benutzt den resultierenden String als neuen Schlüssel.

+ +

Man kann eine Eigenschaft auch erreichen, indem eine Variable vom Typ String benutzt wird:

+ +
var propertyName = 'make';
+myCar[propertyName] = 'Ford';
+
+propertyName = 'model';
+myCar[propertyName] = 'Mustang';
+
+ +

Man kann die Klammernotation mit for...in nutzen, um über alle enumerable (aufzählbaren) Eigenschaften eines Objektes zu iterieren. Um dieses zu zeigen wie das funktioniert, zeigt die folgende Funktion die Eigenschaften eines Objektes, wenn eine Objekt und der Name des Objektes der Funktion als Parameter übergeben werden:

+ +
function showProps(obj, objName) {
+  var result = '';
+  for (var i in obj) {
+    // obj.hasOwnProperty() wird benutzt um Eigenschaften aus der Prototypen-Kette herauszufiltern
+    if (obj.hasOwnProperty(i)) {
+      result += objName + '.' + i + ' = ' + obj[i] + '\n';
+    }
+  }
+  return result;
+}
+
+ +

So gibt der Aufruf showProps(myCar, "myCar") folgenden Rückgabewert zurück:

+ +
myCar.make = Ford
+myCar.model = Mustang
+myCar.year = 1969
+ +

Enumerate the properties of an object

+ +

Starting with ECMAScript 5, there are three native ways to list/traverse object properties:

+ + + +

Before ECMAScript 5, there was no native way to list all properties of an object. However, this can be achieved with the following function:

+ +
function listAllProperties(o) {
+	var objectToInspect;
+	var result = [];
+
+	for(objectToInspect = o; objectToInspect !== null; objectToInspect = Object.getPrototypeOf(objectToInspect)) {
+      result = result.concat(Object.getOwnPropertyNames(objectToInspect));
+	}
+
+	return result;
+}
+
+ +

This can be useful to reveal "hidden" properties (properties in the prototype chain which are not accessible through the object, because another property has the same name earlier in the prototype chain). Listing accessible properties only can easily be done by removing duplicates in the array.

+ +

Creating new objects

+ +

JavaScript has a number of predefined objects. In addition, you can create your own objects. You can create an object using an object initializer. Alternatively, you can first create a constructor function and then instantiate an object invoking that function in conjunction with the new operator.

+ +

Using object initializers

+ +

In addition to creating objects using a constructor function, you can create objects using an object initializer. Using object initializers is sometimes referred to as creating objects with literal notation. "Object initializer" is consistent with the terminology used by C++.

+ +

The syntax for an object using an object initializer is:

+ +
var obj = { property_1:   value_1,   // property_# may be an identifier...
+            2:            value_2,   // or a number...
+            // ...,
+            'property n': value_n }; // or a string
+
+ +

where obj is the name of the new object, each property_i is an identifier (either a name, a number, or a string literal), and each value_i is an expression whose value is assigned to the property_i. The obj and assignment is optional; if you do not need to refer to this object elsewhere, you do not need to assign it to a variable. (Note that you may need to wrap the object literal in parentheses if the object appears where a statement is expected, so as not to have the literal be confused with a block statement.)

+ +

Object initializers are expressions, and each object initializer results in a new object being created whenever the statement in which it appears is executed. Identical object initializers create distinct objects that will not compare to each other as equal. Objects are created as if a call to new Object() were made; that is, objects made from object literal expressions are instances of Object.

+ +

The following statement creates an object and assigns it to the variable x if and only if the expression cond is true:

+ +
if (cond) var x = {greeting: 'hi there'};
+
+ +

The following example creates myHonda with three properties. Note that the engine property is also an object with its own properties.

+ +
var myHonda = {color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}};
+
+ +

You can also use object initializers to create arrays. See array literals.

+ +

Using a constructor function

+ +

Alternatively, you can create an object with these two steps:

+ +
    +
  1. Define the object type by writing a constructor function. There is a strong convention, with good reason, to use a capital initial letter.
  2. +
  3. Create an instance of the object with new.
  4. +
+ +

To define an object type, create a function for the object type that specifies its name, properties, and methods. For example, suppose you want to create an object type for cars. You want this type of object to be called Car, and you want it to have properties for make, model, and year. To do this, you would write the following function:

+ +
function Car(make, model, year) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+}
+
+ +

Notice the use of this to assign values to the object's properties based on the values passed to the function.

+ +

Now you can create an object called mycar as follows:

+ +
var mycar = new Car('Eagle', 'Talon TSi', 1993);
+
+ +

This statement creates mycar and assigns it the specified values for its properties. Then the value of mycar.make is the string "Eagle", mycar.year is the integer 1993, and so on.

+ +

You can create any number of Car objects by calls to new. For example,

+ +
var kenscar = new Car('Nissan', '300ZX', 1992);
+var vpgscar = new Car('Mazda', 'Miata', 1990);
+
+ +

An object can have a property that is itself another object. For example, suppose you define an object called person as follows:

+ +
function Person(name, age, sex) {
+  this.name = name;
+  this.age = age;
+  this.sex = sex;
+}
+
+ +

and then instantiate two new person objects as follows:

+ +
var rand = new Person('Rand McKinnon', 33, 'M');
+var ken = new Person('Ken Jones', 39, 'M');
+
+ +

Then, you can rewrite the definition of Car to include an owner property that takes a person object, as follows:

+ +
function Car(make, model, year, owner) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+  this.owner = owner;
+}
+
+ +

To instantiate the new objects, you then use the following:

+ +
var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
+var car2 = new Car('Nissan', '300ZX', 1992, ken);
+
+ +

Notice that instead of passing a literal string or integer value when creating the new objects, the above statements pass the objects rand and ken as the arguments for the owners. Then if you want to find out the name of the owner of car2, you can access the following property:

+ +
car2.owner.name
+
+ +

Note that you can always add a property to a previously defined object. For example, the statement

+ +
car1.color = 'black';
+
+ +

adds a property color to car1, and assigns it a value of "black." However, this does not affect any other objects. To add the new property to all objects of the same type, you have to add the property to the definition of the Car object type.

+ +

Using the Object.create method

+ +

Objects can also be created using the {{jsxref("Object.create()")}} method. This method can be very useful, because it allows you to choose the prototype object for the object you want to create, without having to define a constructor function.

+ +
// Animal properties and method encapsulation
+var Animal = {
+  type: 'Invertebrates', // Default value of properties
+  displayType: function() {  // Method which will display type of Animal
+    console.log(this.type);
+  }
+};
+
+// Create new animal type called animal1
+var animal1 = Object.create(Animal);
+animal1.displayType(); // Output:Invertebrates
+
+// Create new animal type called Fishes
+var fish = Object.create(Animal);
+fish.type = 'Fishes';
+fish.displayType(); // Output:Fishes
+ +

Inheritance

+ +

All objects in JavaScript inherit from at least one other object. The object being inherited from is known as the prototype, and the inherited properties can be found in the prototype object of the constructor. See Inheritance and the prototype chain for more information.

+ +

Indexing object properties

+ +

You can refer to a property of an object either by its property name or by its ordinal index. If you initially define a property by its name, you must always refer to it by its name, and if you initially define a property by an index, you must always refer to it by its index.

+ +

This restriction applies when you create an object and its properties with a constructor function (as we did previously with the Car object type) and when you define individual properties explicitly (for example, myCar.color = "red"). If you initially define an object property with an index, such as myCar[5] = "25 mpg", you subsequently refer to the property only as myCar[5].

+ +

The exception to this rule is objects reflected from HTML, such as the forms array. You can always refer to objects in these arrays by either their ordinal number (based on where they appear in the document) or their name (if defined). For example, if the second <FORM> tag in a document has a NAME attribute of "myForm", you can refer to the form as document.forms[1] or document.forms["myForm"] or document.forms.myForm.

+ +

Defining properties for an object type

+ +

You can add a property to a previously defined object type by using the prototype property. This defines a property that is shared by all objects of the specified type, rather than by just one instance of the object. The following code adds a color property to all objects of type Car, and then assigns a value to the color property of the object car1.

+ +
Car.prototype.color = null;
+car1.color = 'black';
+
+ +

See the prototype property of the Function object in the JavaScript reference for more information.

+ +

Defining methods

+ +

A method is a function associated with an object, or, simply put, a method is a property of an object that is a function. Methods are defined the way normal functions are defined, except that they have to be assigned as the property of an object. See also method definitions for more details. An example is:

+ +
objectName.methodname = functionName;
+
+var myObj = {
+  myMethod: function(params) {
+    // ...do something
+  }
+
+  // OR THIS WORKS TOO
+
+  myOtherMethod(params) {
+    // ...do something else
+  }
+};
+
+ +

where objectName is an existing object, methodname is the name you are assigning to the method, and functionName is the name of the function.

+ +

You can then call the method in the context of the object as follows:

+ +
object.methodname(params);
+
+ +

You can define methods for an object type by including a method definition in the object constructor function. You could define a function that would format and display the properties of the previously-defined Car objects; for example,

+ +
function displayCar() {
+  var result = 'A Beautiful ' + this.year + ' ' + this.make
+    + ' ' + this.model;
+  pretty_print(result);
+}
+
+ +

where pretty_print is a function to display a horizontal rule and a string. Notice the use of this to refer to the object to which the method belongs.

+ +

You can make this function a method of Car by adding the statement

+ +
this.displayCar = displayCar;
+
+ +

to the object definition. So, the full definition of Car would now look like

+ +
function Car(make, model, year, owner) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+  this.owner = owner;
+  this.displayCar = displayCar;
+}
+
+ +

Then you can call the displayCar method for each of the objects as follows:

+ +
car1.displayCar();
+car2.displayCar();
+
+ +

Using this for object references

+ +

JavaScript has a special keyword, this, that you can use within a method to refer to the current object. For example, suppose you have a function called validate that validates an object's value property, given the object and the high and low values:

+ +
function validate(obj, lowval, hival) {
+  if ((obj.value < lowval) || (obj.value > hival)) {
+    alert('Invalid Value!');
+  }
+}
+
+ +

Then, you could call validate in each form element's onchange event handler, using this to pass it the element, as in the following example:

+ +
<input type="text" name="age" size="3"
+  onChange="validate(this, 18, 99)">
+
+ +

In general, this refers to the calling object in a method.

+ +

When combined with the form property, this can refer to the current object's parent form. In the following example, the form myForm contains a Text object and a button. When the user clicks the button, the value of the Text object is set to the form's name. The button's onclick event handler uses this.form to refer to the parent form, myForm.

+ +
<form name="myForm">
+<p><label>Form name:<input type="text" name="text1" value="Beluga"></label>
+<p><input name="button1" type="button" value="Show Form Name"
+     onclick="this.form.text1.value = this.form.name">
+</p>
+</form>
+ +

Defining getters and setters

+ +

A getter is a method that gets the value of a specific property. A setter is a method that sets the value of a specific property. You can define getters and setters on any predefined core object or user-defined object that supports the addition of new properties. The syntax for defining getters and setters uses the object literal syntax.

+ +

The following illustrates how getters and setters could work for a user-defined object o.

+ +
var o = {
+  a: 7,
+  get b() {
+    return this.a + 1;
+  },
+  set c(x) {
+    this.a = x / 2;
+  }
+};
+
+console.log(o.a); // 7
+console.log(o.b); // 8
+o.c = 50;
+console.log(o.a); // 25
+
+ +

The o object's properties are:

+ + + +

Please note that function names of getters and setters defined in an object literal using "[gs]et property()" (as opposed to __define[GS]etter__ ) are not the names of the getters themselves, even though the [gs]et propertyName(){ } syntax may mislead you to think otherwise. To name a function in a getter or setter using the "[gs]et property()" syntax, define an explicitly named function programmatically using Object.defineProperty (or the Object.prototype.__defineGetter__ legacy fallback).

+ +

The following code illustrates how getters and setters can extend the {{jsxref("Date")}} prototype to add a year property to all instances of the predefined Date class. It uses the Date class's existing getFullYear and setFullYear methods to support the year property's getter and setter.

+ +

These statements define a getter and setter for the year property:

+ +
var d = Date.prototype;
+Object.defineProperty(d, 'year', {
+  get: function() { return this.getFullYear(); },
+  set: function(y) { this.setFullYear(y); }
+});
+
+ +

These statements use the getter and setter in a Date object:

+ +
var now = new Date();
+console.log(now.year); // 2000
+now.year = 2001; // 987617605170
+console.log(now);
+// Wed Apr 18 11:13:25 GMT-0700 (Pacific Daylight Time) 2001
+
+ +

In principle, getters and setters can be either

+ + + +

When defining getters and setters using object initializers all you need to do is to prefix a getter method with get and a setter method with set. Of course, the getter method must not expect a parameter, while the setter method expects exactly one parameter (the new value to set). For instance:

+ +
var o = {
+  a: 7,
+  get b() { return this.a + 1; },
+  set c(x) { this.a = x / 2; }
+};
+
+ +

Getters and setters can also be added to an object at any time after creation using the Object.defineProperties method. This method's first parameter is the object on which you want to define the getter or setter. The second parameter is an object whose property names are the getter or setter names, and whose property values are objects for defining the getter or setter functions. Here's an example that defines the same getter and setter used in the previous example:

+ +
var o = { a: 0 };
+
+Object.defineProperties(o, {
+    'b': { get: function() { return this.a + 1; } },
+    'c': { set: function(x) { this.a = x / 2; } }
+});
+
+o.c = 10; // Runs the setter, which assigns 10 / 2 (5) to the 'a' property
+console.log(o.b); // Runs the getter, which yields a + 1 or 6
+
+ +

Which of the two forms to choose depends on your programming style and task at hand. If you already go for the object initializer when defining a prototype you will probably most of the time choose the first form. This form is more compact and natural. However, if you need to add getters and setters later — because you did not write the prototype or particular object — then the second form is the only possible form. The second form probably best represents the dynamic nature of JavaScript — but it can make the code hard to read and understand.

+ +

Deleting properties

+ +

You can remove a non-inherited property by using the delete operator. The following code shows how to remove a property.

+ +
// Creates a new object, myobj, with two properties, a and b.
+var myobj = new Object;
+myobj.a = 5;
+myobj.b = 12;
+
+// Removes the a property, leaving myobj with only the b property.
+delete myobj.a;
+console.log ('a' in myobj); // yields "false"
+
+ +

You can also use delete to delete a global variable if the var keyword was not used to declare the variable:

+ +
g = 17;
+delete g;
+
+ +

Comparing Objects

+ +

In JavaScript objects are a reference type. Two distinct objects are never equal, even if they have the same properties. Only comparing the same object reference with itself yields true.

+ +
// Two variables, two distinct objects with the same properties
+var fruit = {name: 'apple'};
+var fruitbear = {name: 'apple'};
+
+fruit == fruitbear; // return false
+fruit === fruitbear; // return false
+ +
// Two variables, a single object
+var fruit = {name: 'apple'};
+var fruitbear = fruit;  // assign fruit object reference to fruitbear
+
+// here fruit and fruitbear are pointing to same object
+fruit == fruitbear; // return true
+fruit === fruitbear; // return true
+
+ +
fruit.name = 'grape';
+console.log(fruitbear);    // yields { name: "grape" } instead of { name: "apple" }
+
+ +

For more information about comparison operators, see Comparison operators.

+ +

See also

+ + + +

{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Feinheiten_des_Objektmodells")}}

diff --git a/files/de/web/javascript/guide/modules/index.html b/files/de/web/javascript/guide/modules/index.html new file mode 100644 index 0000000000..25dfa9cadb --- /dev/null +++ b/files/de/web/javascript/guide/modules/index.html @@ -0,0 +1,446 @@ +--- +title: JavaScript modules +slug: Web/JavaScript/Guide/Modules +translation_of: Web/JavaScript/Guide/Modules +--- +
+

Ein Hintergrund zu den Modulen

+ +


+ JavaScript-Programme haben ziemlich klein angefangen - in der Anfangszeit wurde es hauptsächlich für isolierte Skripting-Aufgaben verwendet, um Ihren Webseiten bei Bedarf ein wenig Interaktivität zu verleihen, so dass große Skripte im Allgemeinen nicht erforderlich waren. Spätestens nach ein paar Jahren haben wir nun komplette Anwendungen, die in Browsern mit viel JavaScript ausgeführt werden, sowie JavaScript, das auch in anderen Kontexten verwendet wird (z.B. Node.js).

+ +

Daher war es in den letzten Jahren sinnvoll, darüber nachzudenken, Mechanismen zur Aufteilung von JavaScript-Programmen in separate Module bereitzustellen, die bei Bedarf importiert werden können. Node.js besitzt diese Fähigkeit schon seit langem, und es gibt eine Reihe von JavaScript-Bibliotheken und Frameworks, die die Verwendung von Modulen ermöglichen (z.B. andere CommonJS- und AMD-basierte Modulsysteme wie RequireJS und seit kurzem auch Webpack und Babel).

+ +

Die gute Nachricht ist, dass moderne Browser begonnen haben, die Modulfunktionalität nativ zu unterstützen, und genau darum geht es in diesem Artikel. Das kann nur eine gute Sache sein - Browser können das Laden von Modulen optimieren und damit effizienter machen, als wenn man eine Bibliothek verwenden müsste und all diese zusätzlichen clientseitigen Verarbeitungen und zusätzlichen Roundtrips durchführen müsste.

+ +

Übersetzt mit www.DeepL.com/Translator (kostenlose Version)

+
+ +

Browser support

+ +

Die Verwendung von nativen JavaScript-Modulen ist abhängig von den Import- und Export-Anweisungen {{JSxRef("Statements/import", "import")}} und{{JSxRef("Statements/export", "export")}} , deren Browserkompatibilität wie folgt ist (die Zahlen in den grünen Kästen sind wahrscheinlich die Release-Version der jeweiligen Plattform, die die Funktion unterstützt):

+ +

import

+ +

{{Compat("javascript.statements.import")}}

+ +

export

+ +

{{Compat("javascript.statements.export")}}

+ +

Introducing an example

+ +

To demonstrate usage of modules, we've created a simple set of examples that you can find on GitHub. These examples demonstrate a simple set of modules that create a <canvas> element on a webpage, and then draw (and report information about) different shapes on the canvas.

+ +

These are fairly trivial, but have been kept deliberately simple to demonstrate modules clearly.

+ +
+

Note: If you want to download the examples and run them locally, you'll need to run them through a local web server.

+
+ +

Basic example structure

+ +

In our first example (see basic-modules) we have a file structure as follows:

+ +
index.html
+main.js
+modules/
+    canvas.js
+    square.js
+ +
+

Note: All of the examples in this guide have basically the same structure; the above should start getting pretty familiar.

+
+ +

The modules directory's two modules are described below:

+ + + +

Aside — .mjs versus .js

+ +

Throughout this article, we've used .js extensions for our module files, but in other resources you may see the .mjs extension used instead. V8's documentation recommends this, for example. The reasons given are:

+ + + +

However, we decided to keep to using .js, at least for the moment. To get modules to work correctly in a browser, you need to make sure that your server is serving them with a Content-Type header that contains a JavaScript MIME type such as text/javascript. If you don't, you'll get a strict MIME type checking error along the lines of "The server responded with a non-JavaScript MIME type" and the browser won't run your JavaScript. Most servers already set the correct type for .js files, but not yet for .mjs files. Servers that already serve .mjs files correctly include GitHub Pages and http-server for Node.js.

+ +

This is OK if you are using such an environment already, or if you aren't but you know what you are doing and have access (i.e. you can configure your server to set the correct Content-Type for .mjs files). It could however cause confusion if you don't control the server you are serving files from, or are publishing files for public use, as we are here.

+ +

For learning and portability purposes, we decided to keep to .js.

+ +

If you really value the clarity of using .mjs for modules versus using .js for "normal" JavaScript files, but don't want to run into the problem described above, you could always use .mjs during development and convert them to .js during your build step.

+ +

It is also worth noting that:

+ + + +

Exporting module features

+ +

The first thing you do to get access to module features is export them. This is done using the {{JSxRef("Statements/export", "export")}} statement.

+ +

The easiest way to use it is to place it in front of any items you want exported out of the module, for example:

+ +
export const name = 'square';
+
+export function draw(ctx, length, x, y, color) {
+  ctx.fillStyle = color;
+  ctx.fillRect(x, y, length, length);
+
+  return {
+    length: length,
+    x: x,
+    y: y,
+    color: color
+  };
+}
+ +

You can export functions, var, let, const, and — as we'll see later — classes. They need to be top-level items; you can't use export inside a function, for example.

+ +

A more convenient way of exporting all the items you want to export is to use a single export statement at the end of your module file, followed by a comma-separated list of the features you want to export wrapped in curly braces. For example:

+ +
export { name, draw, reportArea, reportPerimeter };
+ +

Importing features into your script

+ +

Once you've exported some features out of your module, you need to import them into your script to be able to use them. The simplest way to do this is as follows:

+ +
import { name, draw, reportArea, reportPerimeter } from './modules/square.js';
+ +

You use the {{JSxRef("Statements/import", "import")}} statement, followed by a comma-separated list of the features you want to import wrapped in curly braces, followed by the keyword from, followed by the path to the module file — a path relative to the site root, which for our basic-modules example would be /js-examples/modules/basic-modules.

+ +

However, we've written the path a bit differently — we are using the dot (.) syntax to mean "the current location", followed by the path beyond that to the file we are trying to find. This is much better than writing out the entire relative path each time, as it is shorter, and it makes the URL portable — the example will still work if you move it to a different location in the site hierarchy.

+ +

So for example:

+ +
/js-examples/modules/basic-modules/modules/square.js
+ +

becomes

+ +
./modules/square.js
+ +

You can see such lines in action in main.js.

+ +
+

Note: In some module systems, you can omit the file extension and the dot (e.g. '/modules/square'). This doesn't work in native JavaScript modules.

+
+ +

Once you've imported the features into your script, you can use them just like they were defined inside the same file. The following is found in main.js, below the import lines:

+ +
let myCanvas = create('myCanvas', document.body, 480, 320);
+let reportList = createReportList(myCanvas.id);
+
+let square1 = draw(myCanvas.ctx, 50, 50, 100, 'blue');
+reportArea(square1.length, reportList);
+reportPerimeter(square1.length, reportList);
+
+ +

Applying the module to your HTML

+ +

Now we just need to apply the main.js module to our HTML page. This is very similar to how we apply a regular script to a page, with a few notable differences.

+ +

First of all, you need to include type="module" in the <script> element, to declare this script as a module:

+ +
<script type="module" src="main.js"></script>
+ +

The script into which you import the module features basically acts as the top-level module. If you omit it, Firefox for example gives you an error of "SyntaxError: import declarations may only appear at top level of a module".

+ +

You can only use import and export statements inside modules; not regular scripts.

+ +
+

Note: You can also import modules into internal scripts, as long as you include type="module", for example <script type="module"> //include script here </script>.

+
+ +

Other differences between modules and standard scripts

+ + + +

Default exports versus named exports

+ +

The functionality we've exported so far has been comprised of named exports — each item (be it a function, const, etc.) has been referred to by its name upon export, and that name has been used to refer to it on import as well.

+ +

There is also a type of export called the default export — this is designed to make it easy to have a default function provided by a module, and also helps JavaScript modules to interoperate with existing CommonJS and AMD module systems (as explained nicely in ES6 In Depth: Modules by Jason Orendorff; search for "Default exports").

+ +

Let's look at an example as we explain how it works. In our basic-modules square.js you can find a function called randomSquare() that creates a square with a random color, size, and position. We want to export this as our default, so at the bottom of the file we write this:

+ +
export default randomSquare;
+ +

Note the lack of curly braces.

+ +

We could instead prepend export default onto the function and define it as an anonymous function, like this:

+ +
export default function(ctx) {
+  ...
+}
+ +

Over in our main.js file, we import the default function using this line:

+ +
import randomSquare from './modules/square.js';
+ +

Again, note the lack of curly braces. This is because there is only one default export allowed per module, and we know that randomSquare is it. The above line is basically shorthand for:

+ +
import {default as randomSquare} from './modules/square.js';
+ +
+

Note: The as syntax for renaming exported items is explained below in the Renaming imports and exports section.

+
+ +

Avoiding naming conflicts

+ +

So far, our canvas shape drawing modules seem to be working OK. But what happens if we try to add a module that deals with drawing another shape, like a circle or triangle? These shapes would probably have associated functions like draw(), reportArea(), etc. too; if we tried to import different functions of the same name into the same top-level module file, we'd end up with conflicts and errors.

+ +

Fortunately there are a number of ways to get around this. We'll look at these in the following sections.

+ +

Renaming imports and exports

+ +

Inside your import and export statement's curly braces, you can use the keyword as along with a new feature name, to change the identifying name you will use for a feature inside the top-level module.

+ +

So for example, both of the following would do the same job, albeit in a slightly different way:

+ +
// inside module.js
+export {
+  function1 as newFunctionName,
+  function2 as anotherNewFunctionName
+};
+
+// inside main.js
+import { newFunctionName, anotherNewFunctionName } from './modules/module.js';
+ +
// inside module.js
+export { function1, function2 };
+
+// inside main.js
+import { function1 as newFunctionName,
+         function2 as anotherNewFunctionName } from './modules/module.js';
+ +

Let's look at a real example. In our renaming directory you'll see the same module system as in the previous example, except that we've added circle.js and triangle.js modules to draw and report on circles and triangles.

+ +

Inside each of these modules, we've got features with the same names being exported, and therefore each has the same export statement at the bottom:

+ +
export { name, draw, reportArea, reportPerimeter };
+ +

When importing these into main.js, if we tried to use

+ +
import { name, draw, reportArea, reportPerimeter } from './modules/square.js';
+import { name, draw, reportArea, reportPerimeter } from './modules/circle.js';
+import { name, draw, reportArea, reportPerimeter } from './modules/triangle.js';
+ +

The browser would throw an error such as "SyntaxError: redeclaration of import name" (Firefox).

+ +

Instead we need to rename the imports so that they are unique:

+ +
import { name as squareName,
+         draw as drawSquare,
+         reportArea as reportSquareArea,
+         reportPerimeter as reportSquarePerimeter } from './modules/square.js';
+
+import { name as circleName,
+         draw as drawCircle,
+         reportArea as reportCircleArea,
+         reportPerimeter as reportCirclePerimeter } from './modules/circle.js';
+
+import { name as triangleName,
+        draw as drawTriangle,
+        reportArea as reportTriangleArea,
+        reportPerimeter as reportTrianglePerimeter } from './modules/triangle.js';
+ +

Note that you could solve the problem in the module files instead, e.g.

+ +
// in square.js
+export { name as squareName,
+         draw as drawSquare,
+         reportArea as reportSquareArea,
+         reportPerimeter as reportSquarePerimeter };
+ +
// in main.js
+import { squareName, drawSquare, reportSquareArea, reportSquarePerimeter } from './modules/square.js';
+ +

And it would work just the same. What style you use is up to you, however it arguably makes more sense to leave your module code alone, and make the changes in the imports. This especially makes sense when you are importing from third party modules that you don't have any control over.

+ +

Creating a module object

+ +

The above method works OK, but it's a little messy and longwinded. An even better solution is to import each module's features inside a module object. The following syntax form does that:

+ +
import * as Module from './modules/module.js';
+ +

This grabs all the exports available inside module.js, and makes them available as members of an object Module, effectively giving it its own namespace. So for example:

+ +
Module.function1()
+Module.function2()
+etc.
+ +

Again, let's look at a real example. If you go to our module-objects directory, you'll see the same example again, but rewritten to take advantage of this new syntax. In the modules, the exports are all in the following simple form:

+ +
export { name, draw, reportArea, reportPerimeter };
+ +

The imports on the other hand look like this:

+ +
import * as Canvas from './modules/canvas.js';
+
+import * as Square from './modules/square.js';
+import * as Circle from './modules/circle.js';
+import * as Triangle from './modules/triangle.js';
+ +

In each case, you can now access the module's imports underneath the specified object name, for example:

+ +
let square1 = Square.draw(myCanvas.ctx, 50, 50, 100, 'blue');
+Square.reportArea(square1.length, reportList);
+Square.reportPerimeter(square1.length, reportList);
+ +

So you can now write the code just the same as before (as long as you include the object names where needed), and the imports are much neater.

+ +

Modules and classes

+ +

As we hinted at earlier, you can also export and import classes; this is another option for avoiding conflicts in your code, and is especially useful if you've already got your module code written in an object-oriented style.

+ +

You can see an example of our shape drawing module rewritten with ES classes in our classes directory. As an example, the square.js file now contains all its functionality in a single class:

+ +
class Square {
+  constructor(ctx, listId, length, x, y, color) {
+    ...
+  }
+
+  draw() {
+    ...
+  }
+
+  ...
+}
+ +

which we then export:

+ +
export { Square };
+ +

Over in main.js, we import it like this:

+ +
import { Square } from './modules/square.js';
+ +

And then use the class to draw our square:

+ +
let square1 = new Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
+square1.draw();
+square1.reportArea();
+square1.reportPerimeter();
+ +

Aggregating modules

+ +

There will be times where you'll want to aggregate modules together. You might have multiple levels of dependencies, where you want to simplify things, combining several submodules into one parent module. This is possible using export syntax of the following forms in the parent module:

+ +
export * from 'x.js'
+export { name } from 'x.js'
+ +

For an example, see our module-aggregation directory. In this example (based on our earlier classes example) we've got an extra module called shapes.js, which aggregates all the functionality from circle.js, square.js, and triangle.js together. We've also moved our submodules inside a subdirectory inside the modules directory called shapes. So the module structure in this example is:

+ +
modules/
+  canvas.js
+  shapes.js
+  shapes/
+    circle.js
+    square.js
+    triangle.js
+ +

In each of the submodules, the export is of the same form, e.g.

+ +
export { Square };
+ +

Next up comes the aggregation part. Inside shapes.js, we include the following lines:

+ +
export { Square } from './shapes/square.js';
+export { Triangle } from './shapes/triangle.js';
+export { Circle } from './shapes/circle.js';
+ +

These grab the exports from the individual submodules and effectively make them available from the shapes.js module.

+ +
+

Note: The exports referenced in shapes.js basically get redirected through the file and don't really exist there, so you won't be able to write any useful related code inside the same file.

+
+ +

So now in the main.js file, we can get access to all three module classes by replacing

+ +
import { Square } from './modules/square.js';
+import { Circle } from './modules/circle.js';
+import { Triangle } from './modules/triangle.js';
+ +

with the following single line:

+ +
import { Square, Circle, Triangle } from './modules/shapes.js';
+ +

Dynamic module loading

+ +

The newest part of the JavaScript modules functionality to be available in browsers is dynamic module loading. This allows you to dynamically load modules only when they are needed, rather than having to load everything up front. This has some obvious performance advantages; let's read on and see how it works.

+ +

This new functionality allows you to call {{JSxRef("Statements/import", "import()", "#Dynamic_Imports")}} as a function, passing it the path to the module as a parameter. It returns a {{JSxRef("Promise")}}, which fulfills with a module object (see Creating a module object) giving you access to that object's exports, e.g.

+ +
import('./modules/myModule.js')
+  .then((module) => {
+    // Do something with the module.
+  });
+ +

Let's look at an example. In the dynamic-module-imports directory we've got another example based on our classes example. This time however we are not drawing anything on the canvas when the example loads. Instead, we include three buttons — "Circle", "Square", and "Triangle" — that, when pressed, dynamically load the required module and then use it to draw the associated shape.

+ +

In this example we've only made changes to our index.html and main.js files — the module exports remain the same as before.

+ +

Over in main.js we've grabbed a reference to each button using a Document.querySelector() call, for example:

+ +
let squareBtn = document.querySelector('.square');
+ +

We then attach an event listener to each button so that when pressed, the relevant module is dynamically loaded and used to draw the shape:

+ +
squareBtn.addEventListener('click', () => {
+  import('./modules/square.js').then((Module) => {
+    let square1 = new Module.Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
+    square1.draw();
+    square1.reportArea();
+    square1.reportPerimeter();
+  })
+});
+ +

Note that, because the promise fulfillment returns a module object, the class is then made a subfeature of the object, hence we now need to access the constructor with Module. prepended to it, e.g. Module.Square( ... ).

+ +

Troubleshooting

+ +

Here are a few tips that may help you if you are having trouble getting your modules to work. Feel free to add to the list if you discover more!

+ + + +

See also

+ + + +

{{Previous("Web/JavaScript/Guide/Meta_programming")}}

diff --git a/files/de/web/javascript/guide/numbers_and_dates/index.html b/files/de/web/javascript/guide/numbers_and_dates/index.html new file mode 100644 index 0000000000..b38881bb07 --- /dev/null +++ b/files/de/web/javascript/guide/numbers_and_dates/index.html @@ -0,0 +1,378 @@ +--- +title: Numbers and dates +slug: Web/JavaScript/Guide/Numbers_and_dates +tags: + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Numbers_and_dates +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Ausdruecke_und_Operatoren", "Web/JavaScript/Guide/Text_formatting")}}
+ +

Dieses Kapitel ist eine Einleitung in die Nutzung von Nummern und Daten in JavaScript.

+ +

Nummern

+ +

In JavaScript sind alle Nummern als double-precision 64-Bit Binärformat IEEE 754 umgesetzt (z.b. eine Zahl zwischen -(253 -1) und 253 -1). Es gibt keinen extra Datentypen für ganze Zahlen (z. B. Integer in anderen Programmiersprachen). Neben der Repräsentation von Gleitkommazahlen hat der Nummern Typ noch drei symbolische Werte: +{{jsxref("Infinity")}}, -{{jsxref("Infinity")}}, und {{jsxref("NaN")}} (not-a-number; keine Nummer). Siehe auch in das Kapitel JavaScript Datentypen und Strukturen für den Umgang mit anderen primitiven Typen in JavaScript.

+ +

Es gibt vier verschiedene Nummernliterale: Dezimal-, Binär-, Oktal- und Hexadezimalzahlen.

+ +

Dezimalzahlen

+ +
1234567890
+42
+
+// Vorsichtig mit führenden Nullen in der Darstellung:
+
+0888 // wird zu 888 Dezimal
+0777 // wird im non-strict Modus zu 511 in Dezimal
+
+ +

Zu beachten ist, dass das Dezimalliteral mit einer 0 beginnen kann, jedoch wird die Zahl als Oktalzahl interpretiert, wenn die nächste Zahl nach der 0 kleiner als 8 ist.

+ +

Binärzahlen

+ +

Die Syntax von Binärzahlen schreibt vor, dass die Zahl mit einer 0 gefolgt von einem "B" (0b oder 0B) beginnen muss. Wenn die Ziffern nach dem 0b nicht 0 oder 1 sind, wird der folgenden SyntaxError erzeugt: "Missing binary digits after 0b".

+ +
var FLT_SIGNBIT  = 0b10000000000000000000000000000000; // 2147483648
+var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040
+var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607
+ +

Oktalzahlen

+ +

Die Syntax von Oktalzahlen schreibt vor, dass die Nummern mit einer 0 beginnen. Dahinter sind Ziffern mit den Werten 0 bis 7 möglich. Wenn die Ziffern größer als 7 sind, wird die Zahl als Dezimalzahl interpretiert.

+ +
var n = 0755; // 493
+var m = 0644; // 420
+
+ +

Der Strict mode in ECMAScript 5 verbietet Oktalzahlen. Die Syntax der Oktalzahlen ist in ECMAScript 5 nicht vorhanden, jedoch wird es von allen Browser, durch eine führende 0, unterstützt: 0644 === 420 und "\045" === "%". In ECMAScript 2015 sind Oktalzahlen mit dem Präfix 0o unterstützt:

+ +
var a = 0o10; // ES2015: 8
+
+ +

Hexadezimalzahlen

+ +

Hexadezimalzahlen können geschrieben werden, indem der Präfix 0x oder 0X genutzt wird. Wenn die Ziffern nach 0x nicht eines der Zeichen 0123456789ABCDEF entspricht, wird folgender SyntaxError  erzeugt: "Identifier starts immediately after numeric literal".

+ +
0xFFFFFFFFFFFFFFFFF // 295147905179352830000
+0x123456789ABCDEF   // 81985529216486900
+0XA                 // 10
+
+ +

Potenzierung

+ +
1E3   // 1000
+2e6   // 2000000
+0.1e2 // 10
+ +

Number Objekt

+ +

Das vordefinierte {{jsxref("Number")}} Objekt enthält Eigenschaften für nummerische Konstanten, wie zum Beispiel Maximalwerte, not-a-number (keine Nummer) und Unendlich. Man kann die Werte dieser Eigenschaften nicht ändern. Die Eigenschaften werden folgendermaßen eingesetzt:

+ +
var biggestNum = Number.MAX_VALUE;
+var smallestNum = Number.MIN_VALUE;
+var infiniteNum = Number.POSITIVE_INFINITY;
+var negInfiniteNum = Number.NEGATIVE_INFINITY;
+var notANum = Number.NaN;
+
+ +

Man verweist immer auf die Eigenschaften des vordefinierten Number Objekt (wie oben gezeigt) und nicht auf die Eigenschaft eines selbst erstellten Number Objektes.

+ +

Die folgende Tabelle fasst du Eigenschaften des Number Objektes zusammen:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Eigenschaften von Number
EigenschaftBeschreibung
{{jsxref("Number.MAX_VALUE")}}Die größte repräsentierbare Zahl
{{jsxref("Number.MIN_VALUE")}}Die kleinste repräsentierbare Zahl
{{jsxref("Number.NaN")}}Spezieller Wert für "keine Zahl" ("not a number")
{{jsxref("Number.NEGATIVE_INFINITY")}}Spezieller Wert für negativ Unendlich; wird bei einem Overflow zurückgegeben.
{{jsxref("Number.POSITIVE_INFINITY")}}Spezieller Wert für positiv Unendlich; wird bei einem Overflow zurückgegeben.
{{jsxref("Number.EPSILON")}}Der Unterschied zwischen eins und der kleinsten Zahl größer als eins, die als {{jsxref("Number")}} repräsentiert werden kann.
{{jsxref("Number.MIN_SAFE_INTEGER")}}Kleinste sichere ganze Zahl in JavaScript.
{{jsxref("Number.MAX_SAFE_INTEGER")}}Größte sichere ganze Zahl in JavaScript.
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Methoden von Number
MethodeBeschreibung
{{jsxref("Number.parseFloat()")}}Liest eine String-Argument ein und gibt eine Floating-Point Zahl zurück.
+ Macht das gleiche wie die globale {{jsxref("parseFloat", "parseFloat()")}} Funktion.
{{jsxref("Number.parseInt()")}}Liest eine String-Argument ein und gibt eine ganze Zahl in der spezifizierten Basis zurück.
+ Macht das gleiche wie die globale {{jsxref("parseInt", "parseInt()")}} Funktion.
{{jsxref("Number.isFinite()")}}Erkennt, ob ein übergebener Wert eine endliche Zahl ist.
{{jsxref("Number.isInteger()")}}Erkennt, ob ein übergebener Wert eine ganze Zahl ist.
{{jsxref("Number.isNaN()")}}Erkennt, ob ein übergebener Wert {{jsxref("Global_Objects/NaN", "NaN")}} ist. Diese Funktion ist eine robustere Version der globalen {{jsxref("Global_Objects/isNaN", "isNaN()")}} Funktion
{{jsxref("Number.isSafeInteger()")}}Erkennt, ob ein übergebener Wert eine sichere ganze Zahl ist.
+ +

Der Number Prototyp enthält Methoden zum Zurückgeben von Informationen eines Number Objekts in verschiedenen Formaten. Die folgende Tabelle fasst die Methoden von Number.prototype zusammen:

+ + + + + + + + + + + + + + + + + + + + + + + +
Methoden von Number.prototype
MethodeBeschreibung
{{jsxref("Number.toExponential", "toExponential()")}}Gibt eine String-Repräsentation der Zahl in Exponential-Notation zurück.
{{jsxref("Number.toFixed", "toFixed()")}}Gibt eine String-Repräsentation der Zahl in Festkomma-Notation zurück.
{{jsxref("Number.toPrecision", "toPrecision()")}}Gibt eine String-Repräsentation der Zahl in einer spezifizierten Präzision in der Festkomma-Notation zurück.
+ +

Math Objekt

+ +

Das eingebaute {{jsxref("Math")}} Objekt hat Eigenschaften und Methoden für mathematische Konstanten und Funktionen. Zum Beispiel enthält die Eigenschaft PI des Math Objektes den Wert von Pi (3,141...), welche wie folgt in einer Anwendung eingesetzt wird:

+ +
Math.PI
+
+ +

Genauso sind mathematische Standardfunktionen Methoden von Math. Dabei sind trigonometrische, logarithmische, exponentielle und ander Funktionen enthalten. Zum Beispiel wird eine trigonometrische Funktion wie folgt eingesetzt:

+ +
Math.sin(1.56)
+
+ +

Alle trigonometrischen Funktionen von Math erwarten Argumente im Radiantenmaß.

+ +

Die folgende Tabelle fasst die Methoden des Math Objektes zusammen:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Methoden von Math
MethodeBeschreibung
{{jsxref("Math.abs", "abs()")}}Absoluter Wert.
{{jsxref("Math.sin", "sin()")}}, {{jsxref("Math.cos", "cos()")}}, {{jsxref("Math.tan", "tan()")}}Trigonometrische Standardfunktionen; Argumente im Radiantenmaß.
{{jsxref("Math.asin", "asin()")}}, {{jsxref("Math.acos", "acos()")}}, {{jsxref("Math.atan", "atan()")}}, {{jsxref("Math.atan2", "atan2()")}}Inverse trigonometrische Standardfunktionen; Rückgabewert im Radiantenmaß.
{{jsxref("Math.sinh", "sinh()")}}, {{jsxref("Math.cosh", "cosh()")}}, {{jsxref("Math.tanh", "tanh()")}}Hyperbolische trigonometrische Standardfunktionen; Rückgabewert im Radiantenmaß.
{{jsxref("Math.asinh", "asinh()")}}, {{jsxref("Math.acosh", "acosh()")}}, {{jsxref("Math.atanh", "atanh()")}}Inverse hyperbolische trigonometrische Standardfunktionen; Rückgabewert im Radiantenmaß.
+

{{jsxref("Math.pow", "pow()")}}, {{jsxref("Math.exp", "exp()")}}, {{jsxref("Math.expm1", "expm1()")}}, {{jsxref("Math.log10", "log10()")}}, {{jsxref("Math.log1p", "log1p()")}}, {{jsxref("Math.log2", "log2()")}}

+
Exponential- und Logarithmus-Funktionen.
{{jsxref("Math.floor", "floor()")}}, {{jsxref("Math.ceil", "ceil()")}}Gibt die größte/kleinste ganze Zahl kleiner/größer oder gleich dem Argument zurück.
{{jsxref("Math.min", "min()")}}, {{jsxref("Math.max", "max()")}}Gibt den kleinsten oder den größten Wert aus einer mit Komma getrennten Liste von Zahlen.
{{jsxref("Math.random", "random()")}}Gibt eine Zufallszahl zwischen 0 und 1 zurück.
{{jsxref("Math.round", "round()")}}, {{jsxref("Math.fround", "fround()")}}, {{jsxref("Math.trunc", "trunc()")}},Rundungs- und Abschnittsfunktionen.
{{jsxref("Math.sqrt", "sqrt()")}}, {{jsxref("Math.cbrt", "cbrt()")}}, {{jsxref("Math.hypot", "hypot()")}}Quadratwurzel, kubische Wurzel, Quadratwurzel von der Summe von Quadrierten Argumenten.
{{jsxref("Math.sign", "sign()")}}Das Vorzeichen einer Zahl, welches Angibt, ob eine Zahl positiv, negativ oder null ist.
{{jsxref("Math.clz32", "clz32()")}},
+ {{jsxref("Math.imul", "imul()")}}
Anzahl der führenden 0-Bits in der 32-Bit Binärrepräsentation.
+ Das Resultat der C-Ähnlichen 32-Bit Multiplikation von 2 Argumenten.
+ +

Im Gegensatz zu vielen Anderen Objekten, erzeigt man nie selber ein neues Math Objekt. Man benutzt immer das globale Objekt.

+ +

Date Objekt

+ +

JavaScript hat keinen Datums-Datentypen. Allerdings kann das {{jsxref("Date")}} Objekt und seine Methoden genutzt werden, um mit Daten und Zeiten in einer Applikation zu arbeiten. Das Date-Objekt hat sehr viele Methoden für das Einstellen, Abfragen und Manipulieren von Daten. Es hat keine Eigenschaften.

+ +

JavaScript verarbeitet Daten ähnlich wie es in Java gemacht wird. In beiden Sprachen sind viele Methoden gleich und beide Sprachen speichern das Datum als Unix Zeitstempel, also die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00, ab.

+ +

Der Wertebereich eines Date Objektes ist zwischen -100.000.000 und 100.000.000 Tagen relativ zum 1. Januar 1970 UTC.

+ +

Das erstellen eines Date Objektes:

+ +
var dateObjectName = new Date([parameters]);
+
+ +

Dabei ist dateObjectName der Name der Variablen, in der das erstellte Date Objekt gespeichert wird.

+ +

Unter parameters können folgenden Werte eingesetzt werden:

+ + + +

Methoden des Date Objektes

+ +

Das Methoden des Date Objektes für die Behandlung von Daten und Zeiten werden in folgende Kategorien eingeteilt:

+ + + +

Mit den "get"- und "set"-Methoden können Sekunden, Minuten, Stunden, Tag des Monats, Wochentag, Monat und Jahr separat eingestellt und abgefragt werden. Es gibt eine getDay-Methode, welche den Wochentag zurückgibt, es gibt aber keine vergleichbare setDay-Methode, weil der Wochentag automatisch eingestellt wird. Diese Methoden benutzen ganze Zahlen um folgende Werte darzustellen:

+ + + +

Angenommen, man erstellt folgendes Datum:

+ +
var Xmas95 = new Date("December 25, 1995");
+
+ +

Dann gibt Xmas95.getMonth() 11 zurück und Xmas95.getFullYear() gibt 1995 zurück.

+ +

Die getTime und setTime Methoden sind nützlich für das Vergleichen von Daten. Die getTime Methode gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 eines Date-Objektes zurück.

+ +

Der folgende Quelltext zeigt, wie die Anzahl der vergangenen Tage des aktuellen Jahres ermittelt werden kann:

+ +
var today = new Date();
+var endYear = new Date(1995, 11, 31, 23, 59, 59, 999); // Stellt den Tag und den Monat ein
+endYear.setFullYear(today.getFullYear()); // Stellt das Jahr auf das aktuelle Jahr
+var msPerDay = 24 * 60 * 60 * 1000; // Anzahl der Millisekunden pro Tag
+var daysLeft = (endYear.getTime() - today.getTime()) / msPerDay;
+var daysLeft = Math.round(daysLeft); //gibt die vergangenen Tage des aktuellen Jahres zurück
+
+ +

Diese Beispiel erstellt ein Date-Objekt namens today, welches das aktuelle Datum und die aktuelle Zeit enthält. Danach wird ein das Date-Objekt endYear erstellt und das Jahr wird auf das aktuelle Jahr eingestellt. Zum Schluss wird, mithilfe der Millisekunden pro Tag, die Anzahl der Tage zwischen today und endYear berechnet. Dafür wird die getTime Methode eingesetzt und es wird auf eine ganze Zahl von Tagen gerundet.

+ +

Die parse Methode ist nützlich, um ein Date-Objekt aus einem String zu erstellen. Zum Beispiel verwendet der folgende Quelltext parse und setTime um das IPOdate einzustellen:

+ +
var IPOdate = new Date();
+IPOdate.setTime(Date.parse("Aug 9, 1995"));
+
+ +

Beispiel

+ +

Im folgenden Beispiel, gibt die JSClock() Funktion die Zeit in dem Format einer digitalen Uhr zurück.

+ +
function JSClock() {
+  var time = new Date();
+  var hour = time.getHours();
+  var minute = time.getMinutes();
+  var second = time.getSeconds();
+  var temp = "" + ((hour > 12) ? hour - 12 : hour);
+  if (hour == 0)
+    temp = "12";
+  temp += ((minute < 10) ? ":0" : ":") + minute;
+  temp += ((second < 10) ? ":0" : ":") + second;
+  temp += (hour >= 12) ? " P.M." : " A.M.";
+  return temp;
+}
+
+ +

Die JSClock Funktion erstellt als erstes ein neues Date Objekt mit dem Namen time. Weil dabei keine Argumente angegeben werden, wird time mit dem aktuellen Datum und der aktuellen Zeit erstellt. Danach werden die Methoden getHours, getMinutes, und getSeconds eingesetzt, um den Wert der aktuellen Stunde, Minute und Sekunde in den Variablen  hour, minute, und second zu speichern.

+ +

Die nächsten vier Statements bauen einen String-Wert mit der Zeit zusammen. Das erste Statement erstellt eine Variable temp und weist dieser einen Wert mit einem bedingten Ausdruck zu; wenn hour größer als 12 ist wird hour - 12 zugewiesen, andernfalls nur hour. Wenn hour dann 0 ist, wird hour auf 12 gesetzt.

+ +

Die nächsten Statement hängt einen den minute-Wert an temp heran. Wenn der Wert von minute kleiner als 10 ist, fügt der Bedingte Ausdruck einen String mit einer Null und einem Doppelpunkt an; andernfalls wird nur ein Doppelpunkt angehängt. Danach werden die Sekunden auf die gleiche weise angehängt.

+ +

Zum Schluss fügt ein bedingter Ausdruck "P.M." an temp an, wenn die hour größer oder gleich 12 ist. Andernfalls wird "A.M." an temp angefügt.

+ +

{{PreviousNext("Web/JavaScript/Guide/Ausdruecke_und_Operatoren", "Web/JavaScript/Guide/Text_formatting")}}

diff --git a/files/de/web/javascript/guide/regular_expressions/index.html b/files/de/web/javascript/guide/regular_expressions/index.html new file mode 100644 index 0000000000..4710e4e352 --- /dev/null +++ b/files/de/web/javascript/guide/regular_expressions/index.html @@ -0,0 +1,625 @@ +--- +title: Reguläre Ausdrücke +slug: Web/JavaScript/Guide/Regular_Expressions +tags: + - JavaScript + - ausdrücke + - regex + - reguläre +translation_of: Web/JavaScript/Guide/Regular_Expressions +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Textformatierung", "Web/JavaScript/Guide/Indexed_collections")}}
+ +

Reguläre Ausdrücke sind Muster, die eingesetzt werden, um Text auf bestimmte Zeichenkombinationen zu überprüfen. Auch reguläre Ausdrücke sind Objekte bei JavaScript. Die Muster werden mit den Methoden exec und test von RegExp und den Methoden match, replace, search und split von String verwendet. Dieses Kapitel beschreibt reguläre Ausdrücke in JavaScript.

+ +

Erstellen von regulären Ausdrücken

+ +

Ein regulärer Ausdruck kann auf zwei verschiedene Arten erstellt werden.

+ +

Zum einen kann ein Literal verwendet werden:

+ +
var re = /ab+c/;
+ +

Hierbei findet die Kompilierung des regulären Ausdrucks während der Auswertung des Skripts statt. Wenn der reguläre Ausdruck konstant bleibt, ist diese Vorgehensweise aufgrund der schnelleren Ausführungsgeschwindigkeit empfehlenswert.

+ +

Zum anderen kann wie folgt die Konstruktorfunktion des Objekts RegExp zum Einsatz kommen:

+ +
var re = new RegExp("ab+c");
+ +

Bei der Benutzung der Konstruktorfunktion wird der reguläre Ausdruck während der Laufzeit kompiliert. Sie sollte verwendet werden, wenn man weiß, dass sich das Muster während der Laufzeit ändert oder man das Muster noch nicht kennt und von einer anderen Quelle, wie z. B. der Benutzereingabe, bezieht.

+ +

Schreiben von Mustern für reguläre Ausdrücke

+ +

Ein Muster eines regulären Ausdrucks wird aus einfachen Zeichen, wie z. B. /abc/ oder einer Kombination von einfachen und speziellen Zeichen, wie z. B. /ab*c/ oder /Kapitel (\d+)\.\d*/ erstellt. Das letzte Beispiel enthält Klammern, die zur Speicherung verwendet werden. Die Übereinstimmung im Text, welche auf das eingeklammerte Muster passt, wird hierbei für die spätere Verwendung hinterlegt, wie unter Benutzung von geklammerten Mustern beschrieben.

+ +

Verwendung von einfachen Mustern

+ +

Einfache Muster werden aus Zeichen konstruiert, für die man eine direkte Übereinstimmung finden möchte. Zum Beispiel passt das Muster /abc/ nur dann für eine Zeichenkette, wenn exakt die Zeichen "abc" aufeinanderfolgend in dieser Reihenfolge vorkommen. Solch eine Übereinstimmung kommt z. B. in der Zeichenkette "Hallo, kennst du das abc?" und "Das müssen wir noch abchecken." vor. In beiden Fällen enthält die Zeichenkette die Zeichenfolge "abc". In der Zeichenkette "Stab" gibt es keine Übereinstimmung, weil die Zeichenfolge "abc" darin nicht vorkommt.

+ +

Verwendung von speziellen Zeichen

+ +

Wenn bei der Suche nicht nur nach einer direkten Übereinstimmung, sondern z. B. nach einem oder mehreren aufeinanderfolgenden Vorkommen des Buchstabens "b" oder nach Leerräumen (sowohl Tabulator, Leerzeichen als auch Steuerzeichen) gesucht wird, kommen spezielle Zeichen zum Einsatz. Zum Beispiel stimmt das Muster /ab*c/ mit allen Zeichenkombinationen überein, die ein "a", dann sofort nachfolgend 0 oder mehrere "b" (Das Sternchen bedeutet: 0 oder mehr Vorkommen des vorherigen Zeichens) und anschließend sofort ein "c" enthalten. Demnach wird in der Zeichenfolge "cbbabbbbcdebc" eine Übereinstimmung gefunden, weil das Muster auf die Zeichenfolge "abbbbc" passt.

+ +

Die folgende Tabelle zeigt eine komplette Liste der speziellen Zeichen, die in regulären Ausdrücken verwendet werden, mit einer Beschreibung zu deren Bedeutung.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Tabelle 4.1 Spezielle Zeichen in regulären Ausdrücken
ZeichenBedeutung
\Eine der folgenden Bedeutungen: +
    +
  • Für Zeichen, die normalerweise buchstäblich interpretiert werden, wird mit der Voranstellung des Rückstrichs dafür gesorgt, dass das Zeichen als speziell und nicht als normales Zeichen interpretiert wird. Zum Beispiel stimmt /b/ mit dem Zeichen "b" überein. Stellt man dem "b" einen Rückstrich voran, also /\b/, wird das Zeichen als spezielles Zeichen - in diesem Fall als Wortgrenze - gedeutet.
  • +
  • Bei Zeichen, die normalerweise sofort als spezielle Zeichen interpretiert werden, bewirkt der Rückstrich genau das Gegenteil, d.h. dem Zeichen wird die spezielle Bedeutung genommen und es wird als einfaches Zeichen interpretiert. Zum Beispiel ist das Zeichen * (Sternchen) ein spezielles Zeichen mit der Bedeutung: 0 oder mehr Vorkommen des vorherigen Zeichens. Der Ausdruck /a*/ steht demnach für 0 oder mehr a's. Um dem Zeichen * (Sternchen) die spezielle Bedeutung zu nehmen, stellt man ihm einen Rückstrich voran, z. B. stimmt /a\*/ mit "a*" überein - der Stern wird nun als einfaches Zeichen interpretiert.
  • +
  • Das Maskieren eines Zeichens durch die Voranstellung eines Rückstrichs wird auch als escapen bezeichnet. Außerdem sollte man sich merken, dass bei Verwendung der new RegExp("pattern")-Notation auch der Rückstrich selbst eine spezielle Bedeutung hat und maskiert werden muss, wenn er als normales Zeichen interpretiert werden soll.
  • +
+
^ +

Das Zirkumflex-Zeichen steht für den Anfang der Eingabe. Wenn das Flag für mehrere Zeilen (multiline flag) gesetzt ist, wird auch eine Übereinstimmung direkt hinter dem Zeichen für einen Zeilenumbruch (\n) gefunden.

+ +

Der Ausdruck /^A/ passt zwar auf das "A" in "Apfel", nicht jedoch auf das "A" in "Ein Apfel", weil das "A" bei dieser Zeichenkette nicht am Anfang steht.

+ +

Achtung: Wenn das Zeichen innerhalb von eckigen Klammern (einer Zeichenauswahl) steht, hat es eine andere Bedeutung (siehe [^xyz] in dieser Tabelle).

+ +

Zum Beispiel stimmt /[^a-zA-Z\s]/ mit der "3" in "Ich habe 3 Schwestern" überein. Die eckigen Klammern kennzeichnen die Zeichenauswahl. Das Zirkumflex innerhalb dieser Klammern negiert die aufgezählten Zeichen: nicht a bis z, nicht A bis Z und keine Leerräume wie das Leerzeichen oder die Steuerzeichen; übrig bleibt allein die "3".

+
$ +

Das Dollarzeichen steht für das Ende der Eingabe. Wenn das Flag für mehrere Zeilen (multiline flag) gesetzt ist, wird auch eine Übereinstimmung direkt hinter dem Zeichen für einen Zeilenumbruch (\n) gefunden.

+ +

Zum Beispiel wird mit /t$/ bei "Butter" keine Übereinstimmung gefunden, jedoch bei "Brot", weil das "t" am Ende steht.

+
* +

Das Sternchen steht für eine beliebige Anzahl des vorangestellten Zeichens, also 0-mal oder öfter. Das Zeichen muss also nicht unbedingt vorkommen, sondern darf auch einfach nicht vorhanden sein. Das Sternchen wird gerne in Kombination mit dem . (Punkt) als Platzhalter für "ein beliebiges Zeichen beliebig oft" verwendet.

+ +

Der Ausdruck /bu*/ passt auf "buuuuu" in "Ein Geist buuuuuht" als auch auf "b"  in "Ein Blauwal blubbert", jedoch nicht auf "Eine Katze kratzt".

+
+ +

Steht für das vorangestellte Zeichen einmal oder öfter und ist äquivalent zu {1,}. Das Zeichen muss für einen Treffer also mindestens einmal vorkommen.

+ +

Zum Beispiel passt /a+/ auf "a" in "Schokolade" und alle a's in "Schokolaaaade".

+
? +

Steht für das vorangestellte Zeichen 0 oder einmal und ist äquivalent zu {0,1}.

+ +

Zum Beispiel passt /e?le?/ sowohl auf "el" in "Engel", als auch auf "le" in "Kapelle" und auch "l" in "Oslo".

+ +

Wenn es sofort hinter einen der Quantoren *, +, ?, oder {} gestellt wird, deaktiviert es die standardmäßige "Gierigkeit" (eine möglichst hohe Anzahl von passende Zeichen einschließend) dieser Quantoren und macht sie "genügsam" (eine möglichst geringe Anzahl von passende Zeichen einschließend).

+ +

Zum Beispiel passt der Ausdruck /\d+/ auf die Zeichenkette "123abc" angewendet auf "123", weil der Quantor + (Pluszeichen) "gierig" ist. Der Ausdruck /\d+?/ steht hingegen nur für "1", weil der Quantor + (Pluszeichen) aufgrund der Beeinflussung durch das hintangestellte ? (Fragezeichen) "genügsam" ist.

+ +

Das Fragezeichen wird auch bei sogenannten lookahead assertions (vorausschauenden Annahmen/Behauptungen) eingesetzt, die in dieser Tabelle unter x(?=y) und x(?!y) beschrieben sind.

+
. +

Der Punkt steht für ein einzelnes beliebiges Zeichen mit Ausnahme des Zeichens für den Zeilenumbruch.

+ +

Zum Beispiel passt /.n/ auf "in" und "än" in der Zeichenkette "nur ein Apfel hängt am Baum", jedoch nicht auf das "n" ganz am Anfang, weil vor dem "n" ein beliebiges Zeichen stehen muss.

+
(x) +

Steht für die Zeichen "x", also die eingeklammerten Zeichen. Außerdem werden die Zeichen gespeichert, die mit dem einklammerten Muster übereinstimmen, damit sie an anderer Stelle wieder eingesetzt werden können. Die Klammern werden auch capturing parentheses (aufnehmende Klammern) genannt.

+ +

Zum Beispiel steht /(foo)/ für "foo" in "foobar" und "foo" wird hinterlegt. Die Zeichen innerhalb der Klammern können durch Array-Elemente wieder eingesetzt werden. Dabei steht [1] für die Zeichen des ersten Klammerpaars, [2] für die Zeichen des zweiten Paars usw.

+
(?:x)Steht für die Zeichen "x", aber die Übereinstimmung wird nicht hinterlegt. Diese Klammern werden auch als non-capturing parentheses bezeichnet. Die übereinstimmenden Zeichen können nicht wieder eingesetzt werden und die Array-Elemente [1], ..., [n] finden keine Anwendung.
x(?=y) +

Steht für die Zeichen "x", jedoch nur wenn "x" vor "y" steht. Dies wird als lookahead (vorausschauen) bezeichnet.

+ +

Zum Beispiel passt /Mustermann(?=Max)/ auf "Mustermann" nur dann, wenn "Max" dahinter steht. Der Ausdruck /Mustermann(?=Max|Erika)/ passt auf "Mustermann" nur dann, wenn dahinter "Max" oder "Erika" steht. Doch weder "Max" noch "Erika" ist Teil des übereinstimmenden Ergebnisses.

+
x(?!y) +

Passt nur dann auf die Zeichen "x", wenn "x" nicht vor den Zeichen "y" steht. Dies wird auch als negated lookahead (negierte vorausschauende Annahme) bezeichnet.

+ +

Zum Beispiel passt /\d+(?!\.)/ nur dann auf eine Zahl, wenn diese nicht vor einem Dezimalpunkt steht. Der reguläre Ausdruck /\d+(?!\.)/.exec("3.141")  passt auf "141", jedoch nicht auf "3.141".

+
x|y +

Passt auf entweder die Zeichen "x" oder die Zeichen "y".

+ +

Zum Beispiel passt der Ausdruck /grüner|roter/  auf "grüner" in "grüner Apfel" und "roter" in "roter Apfel".

+
{n} +

Das n steht für eine positive ganze Zahl. Das Muster passt exakt auf die Anzahl n des vorangestellten Zeichens.

+ +

Zum Beispiel passt /a{2}/ nicht auf das "a" in "Schokolade",  jedoch auf alle beide a's in "Schokolaade" und die ersten beiden a's in "Schokolaaade".

+
{n,m} +

Wobei n und m positive ganze Zahlen sind. Passt auf mindestes n und höchstens m Vorkommen des vorangestellten Zeichens. Wenn für n oder m eine 0 stehen soll, kann diese auch weggelassen werden.

+ +

Zum Beispiel passt /a{1,3}/ auf nichts in "cndy", jedoch auf das "a" in "candy", die beiden a's in "caandy," und die ersten drei a's in "caaaaaaandy".  Merke: Wenn der Ausdruck auf "caaaaaaandy" angewendet wird, ist die Übereinstimmung "aaa", auch wenn in der Zeichenkette mehr a's enthalten sind.

+
[xyz] +

Die eckigen Klammern kennzeichnen eine Zeichenauswahl. Der Ausdruck stimmt mit allen in den Klammern stehenden Zeichen überein. Mit Hilfe eines Bindestrichs kann ein Bereich (z. B. von a bis z) festgelegt werden. Spezielle Zeichen (wie der Punkt oder das Sternchen) haben keine spezielle Bedeutung innerhalb der eckigen Klammern. Sie müssen nicht "escaped" werden. Escape-Sequenzen funktionieren ebenfalls.

+ +

Zum Beispiel ist [abcd] dasselbe wie [a-d]. Beides passt auf das "b" in "biegen" und das "d" in "denken". Die Ausdrücke /[a-z.]+/ und /[\w.]+/ passen beide auf "test.e.n". Der Punkt ist in diesem Fall kein spezielles Zeichen, weil er innerhalb der eckigen Klammern (Zeichenauswahl) steht.

+
[^xyz] +

Eine negierte oder komplementäre Zeichenauswahl. Das Zirkumflex-Zeichen an erster Stelle innerhalb der Klammern negiert die Zeichenauswahl. Der Ausdruck passt also auf alle Zeichen, die nicht in den Klammern stehen. Es kann mit Hilfe eines Bindestrichs auch ein Bereich von Zeichen (z. B. von a bis z) festgelegt werden. Alle Zeichen, die bei einer normalen Zeichenauswahl funktionieren, funktionieren hier ebenso.

+ +

Zum Beispiel ist [^abc] dasselbe wie [^a-c]. Beide Ausdrücke passen auf das "r" in "brechen" und das "m" in "campen".

+
[\b]Passt auf das Steuerzeichen für die Backspace-Tastet (U+0008), welche den Cursor um eine Position nach links verschiebt und das dort stehende Zeichen entfernt. (Sollte nicht mit \b verwechselt werden.)
\b +

Steht für eine Wortgrenze. Wortgrenzen sind an den Stellen, wo kein anderes Wortzeichen vor oder hinter einem Wortzeichen steht. Eine Wortgrenze wird nicht in die Übereinstimmung aufgenommen. Mit anderen Worten ist die Länge einer Wortgrenze gleich 0 - die Wortgrenze ist der Zwischenraum zwischen einem Wortzeichen und einem Zeichen, das kein Wortzeichen ist oder zwischen einem Wortzeichen und dem Anfang oder Ende der Eingabe. (Sollte nicht mit [\b] verwechselt werden.)

+ +

Beispiele:
+ /\bMon/ passt auf das "Mon" in "Mond" ;
+ /ll\b/ passt nicht auf "ll" in "Falle", weil "ll" nicht vor einer Wortgrenze steht, sondern vor dem Zeichen "e", wobei es sich um ein Wortzeichen handelt.
+ /ond\b/ passt auf das "ond" in "Mond", weil "ond"  das Ende der Zeichenkette ist, also nicht vor einem Wortzeichen steht.
+ Bei /\w\b\w/ wird niemals eine Übereinstimmung gefunden, weil eine Wortgrenze niemals gleichzeitig vor einem Wortzeichen und keinem Wortzeichen stehen kann.

+
\B +

Steht für alle Zeichen, die keine Wortgrenze sind. Dies trifft auf Positionen zu, wo zwei nebeneinanderstehende Zeichen vom selben Typ sind: Entweder sind beide Wortzeichen oder keine Wortzeichen. Der Anfang und das Ende einer Zeichenkette werden nicht als Wortzeichen angesehen, gelten also als Wortgrenzen.

+ +

For example, /\B../ matches 'oo' in "noonday" (, and /y\B./ matches 'ye' in "possibly yesterday."

+ +

Zum Beispiel passt /\B../ auf "at" in "Katze" und /e\B./ auf "ei" in "schlafe ein".

+
\cX +

X ist ein Zeichenbereich von A bis Z. Passt auf ein Steuerzeichen in einer Zeichenkette.

+ +

Zum Beispiel steht /\cM/ für das Steuerzeichen control-M (U+000D) in einer Zeichenkette.

+
\d +

Steht für Ziffern und ist äquivalent zu [0-9].

+ +

Zum Beispiel passt /\d/ oder /[0-9]/ auf "2" in "B2 ist die Zimmernummer."

+
\D +

Steht für alle nicht-Ziffern und ist äquivalent zu [^0-9].

+ +

Zum Beispiel passt /\D/ oder /[^0-9]/ auf "B" in "B2 ist die Zimmernummer."

+
\fSteht für einen Seitenvorschub (engl. form feed (U+000C)).
\nSteht für einen Zeilenbruch (engl. line feed bzw. new line U+000A).
\rSteht für einen Wagenrücklauf (engl. carriage return (U+000D).
\s +

Steht für ein einzelnes Leerraum-Zeichen, einschließlich Leertaste, Tabulator, Seitenvorschub und Zeilenumbruch und ist äquivalent zu [ \f\n\r\t\v​\u00A0\u1680​\u180e\u2000​\u2001\u2002​\u2003\u2004​ \u2005\u2006​\u2007\u2008​\u2009\u200a​\u2028\u2029​\u2028\u2029​ \u202f\u205f​\u3000].

+ +

Zum Beispiel passt /\s\w*/ auf "bar" in "foo bar".

+
\S +

Steht für ein einzelnes Zeichen, das kein Leerraum-Zeichen ist. Äquivalent zu [^ \f\n\r\t\v​\u00A0\u1680​\u180e\u2000​\u2001\u2002​\u2003\u2004​ \u2005\u2006​\u2007\u2008​\u2009\u200a​\u2028\u2029​\u2028\u2029​ \u202f\u205f​\u3000].

+ +

Zum Beispiel passt /\S\w*/ auf "foo" in "foo bar".

+
\tSteht für einen Tabulator (engl. horizontal tab U+0009).
\vSteht für einen vertikalen Tabulator (engl. vertical tabulator (U+000B).
\w +

Steht für ein alphanumerisches Zeichen (Wortzeichen), einschließlich Unterstrich. Äquivalent zu [A-Za-z0-9_].

+ +

Zum Beispiel passt /\w/ auf "a" in "apple" als auch auf "5" in "$5.28" und "3" in "3D".

+
\W +

Steht für ein nicht-alphanumerisches Zeichen (nicht-Wortzeichen). Äquivalent zu [^A-Za-z0-9_].

+ +

Zum Beispiel passt /\W/ oder /[^A-Za-z0-9_]/ auf "%" in "50%".

+
\n +

Stellt einen Rückgriff auf die passenden Zeichen eines eingeklammerten Teilausdrucks dar, wobei n eine positive ganze Zahl ist. Die Zahl steht hierbei für das jeweilige Teilmuster innerhalb eines Klammerpaars an entsprechender Stelle (öffnende Klammern werden gezählt).

+ +

Zum Beispiel passt /Apfel(,)\sOrange\1/ auf "Apfel, Orange," in "Apfel, Orange, Kirsche, Pfirsich".

+
\0Steht für ein NULL-Zeichen (U+0000). Es sollte kein Ziffer dahinter stehen, weil \0<Ziffer> eine Escape-Sequenz für oktale Zahlen ist.
\xhhSteht für das Zeichen mit dem Code hh (zweistellige hexadezimale Zahl).
\uhhhhSteht für das Zeichen mit dem Code hhhh (vierstellige hexadezimale Zahl).
+ +

Das Escapen von Benutzereingaben in einem Stringliteral eines regulären Ausdrucks kann durch folgende Ersetzung getan werden:

+ +
function escapeRegExp (string) {
+    return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); // $& meint den komplett erkannten String
+}
+ +

Benutzung von Klammern

+ +

Klammern werden verwendet, um den eingeklammerten Teil des regulären Ausdrucks zu speichern. Einmal gespeichert kann dieser Teil an anderer Stelle wieder eingesetzt werden, wie unter Benutzung von geklammerten Mustern beschrieben.

+ +

Zum Beispiel beinhaltet der Ausdruck /Kapitel (\d+)\.\d*/ einige maskierte und spezielle Zeichen. Mit den Klammern wird bewirkt, dass die Zeichen, welche mit dem eingeklammerten Muster übereinstimmen, gespeichert werden. Der Ausdruck stimmt genau mit der Zeichenkette "Kapitel " gefolgt von einer oder mehreren Ziffern (\d steht für eine Ziffer und das + (Pluszeichen) bedeutet 1 oder mehr Vorkommen), einem Punkt (der Punkt selbst ist standardmäßig ein spezielles Zeichen, weshalb er maskiert werden muss) und nochmal beliebig vielen Ziffern (\d steht für eine Ziffer und der Stern bedeutet 0 oder mehr Vorkommen) überein. Zusätzlich werden die Klammern eingesetzt, um die erste Ziffer zu speichern.

+ +

Eine Übereinstimmung wird z. B. in "Offenes Kapitel 4.3, Absatz 6" gefunden und dabei wird "4" gespeichert. Auf die Zeichenkette "Kapitel 3 und 4" passt der Ausdruck nicht, weil hinter der ersten Ziffer "3" kein Punkt steht.

+ +

Möchte man einen zusammenhängenden Teil einer Zeichenkette suchen, jedoch nicht speichern, setzt man ?: an den Anfang innerhalb der Klammern. Zum Beispiel stimmt (?:\d+) mit einer oder mehr Ziffern überein, aber diese Ziffern werden nicht gespeichert.

+ +

Arbeiten mit regulären Ausdrücken

+ +

Reguläre Ausdrücke werden mit den Methoden exec und test von RegExp und den Methoden match, replace, search und split von String verwendet. Diese Methoden sind in der JavaScript Referenz beschrieben.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Tabelle 4.2 Methoden die reguläre Ausdrücke verwenden
MethodDescription
{{jsxref("RegExp.exec", "exec")}}Eine Methode von RegExp, die eine Suche nach einer Übereinstimmung in einer Zeichenkette durchführt. Sie gibt ein Array mit den Übereinstimmungen zurück.
{{jsxref("RegExp.test", "test")}}Eine Methode von RegExp, die eine Zeichenkette auf eine Übereinstimmung überprüft. Sie gibt true oder false zurück.
{{jsxref("String.match", "match")}}Eine Methode von String, die eine Suche nach einer Übereinstimmung in einer Zeichenkette durchführt. Sie gibt ein Array zurück oder null bei keinem Treffer.
{{jsxref("String.search", "search")}}Eine Methode von String, die eine Zeichenkette auf eine Übereinstimmung überprüft. Sie gibt den Index der Übereinstimmung zurück oder -1 bei keinem Treffer.
{{jsxref("String.replace", "replace")}}Eine Methode von String, die eine Suche nach einer Übereinstimmung in einer Zeichenkette durchführt und die Übereinstimmungen durch eine andere Zeichenkette ersetzt.
{{jsxref("String.split", "split")}}Eine Methode von String, die anhand eines regulären Ausdrucks oder einer festen Zeichenkette eine Zeichenkette trennt und die Teile als Array zurückgibt.
+ +

Wenn man nur wissen möchte, ob ein regulärer Ausdruck auf eine Zeichenkette passt, sollten die Methoden test oder search zum Einsatz kommen. Möchte man mehr erfahren, sollte man auf die Methoden exec oder match zurückgreifen (langsamere Ausführungsgeschwindigkeit). Die Methoden exec und match geben ein Array zurück falls Übereinstimmungen gefunden werden und updaten die Eigenschaften des zugehörigen RegExp-Objekts und des vordefinierten RegExp-Objekts. Wenn keine Übereinstimmungen gefunden werden, geben die Methoden null (konvertiert: false) zurück.

+ +

Bei folgendem Beispiel kommt die Methode exec zum Einsatz, um eine Übereinstimmung in einer Zeichenkette zu finden.  

+ +
var myRe = /d(b+)d/g;
+var myArray = myRe.exec("cdbbdbsbz");
+
+ +

Wenn man auf die Eingenschaften des Objekts für den regulären Ausdruck nicht zugreifen möchte, kann man myArray auch direkt wie folgt erzeugen:

+ +
var myArray = /d(b+)d/g.exec("cdbbdbsbz");  // äquivalent zu "cdbbdbsbz".match(/d(b+)d/g);
+
+ +

Möchte man den regulären Ausdruck aus einem String erzeugen, besteht folgende Möglichkeit:

+ +
var myRe = new RegExp("d(b+)d", "g");
+var myArray = myRe.exec("cdbbdbsbz");
+
+ +

Bei diesen Skripten werden Übereinstimmungen gefunden. Es wird ein Array zurückgegeben und die Eigenschaften geupdatet, welche in der nachstehenden Tabelle aufgelistet sind.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Tabelle 4.3 Ergebnisse von regulären Ausdrücken
ObjektEigenschaft oder IndexBeschreibungBei diesem Beispiel
myArray Die übereinstimmende Zeichenfolge und alle gespeicherten Teile.["dbbd", "bb"]
indexDer mit 0 beginnende Index der Übereinstimmung in der Eingabe-Zeichenkette.1
inputDie ursprüngliche Eingabe-Zeichenkette."cdbbdbsbz"
[0]Die zuletzt übereinstimmenden Zeichen."dbbd"
myRelastIndexDer Index bei dem die nächste Suche nach einer Übereinstimmung gestartet wird.  (Diese Eigenschaft wird nur gesetzt, wenn im regulären Ausdruck die Option "g" verwendet wird, wie unter Erweiterte Suche mit Optionen (Flags) beschrieben).5
sourceDer Text des Musters - wird geupdatet wenn der reguläre Ausdruck erstellt wird, nicht bei der Ausführung."d(b+)d"
+ +

Wie das zweite Beispiel zeigt, kann man einen regulären Ausdruck einsetzen, der über einen Objekt-Intializer erstellt wurde, ohne die Zuweisung einer Variablen. Bei dieser Vorgehensweise ist jede Übereinstimmung ein neuer Ausdruck. Aus diesem Grund kann nicht auf die Eigenschaften dieses regulären Ausdrucks zugegriffen werden. Angenommen man hat z. B. dieses Skript:

+ +
var myRe = /d(b+)d/g;
+var myArray = myRe.exec("cdbbdbsbz");
+console.log("Der Wert von lastIndex ist " + myRe.lastIndex);
+
+ +

Dann ist die Ausgabe:

+ +
Der Wert von lastIndex ist 5
+
+ +

Hat man nun aber dieses Skript:

+ +
var myArray = /d(b+)d/g.exec("cdbbdbsbz");
+console.log("Der Wert von lastIndex ist " + /d(b+)d/g.lastIndex);
+
+ +

Dann ist die Ausgabe:

+ +
Der Wert von lastIndex ist 0
+
+ +

Die einzelnen Vorkommen der Zeichenfolgen, die mit /d(b+)d/g übereinstimmen sind bei den beiden Anweisungen verschiedene Objekte und haben dementsprechend auch verschiedene Werte bei der jeweiligen Eigenschaft lastIndex. Falls man auf die Eigenschaften eines Objekts eines regulären Ausdrucks zugreifen möchte, sollte man diesen vorher einer Variablen zuweisen.

+ +

Benutzung von geklammerten Mustern

+ +

Klammern werden verwendet, um einen Teil der Zeichen, die mit dem regulären Ausdruck übereinstimmen, zu speichern. Zum Beispiel stimmt /a(b)c/ mit der Zeichenfolge "abc" überein und "b" wird gespeichert. Um die gespeicherten Zeichen wieder abzurufen, verwendet man die Array-Elemente [1], ..., [n].

+ +

Die Anzahl der möglichen speicherbaren Teile ist nicht limitiert. Das Array, welches zurückgegeben wird, enthält alle gespeicherten Übereinstimmungen. Die folgenden Beispiele zeigen auf, wie man geklammerte Muster einsetzt.

+ +

Beispiel 1

+ +

Das folgende Skript benutzt die Methode replace(), um Wörter in einer Zeichenkette auszutauschen. Die beiden Muster für die Wörter (\w+) wurden geklammert, damit die Wörter gespeichert werden. Anschließend werden im Ersetzungstext diese gespeicherten Wörter mit $1 und $2 wieder eingesetzt.

+ +
var re = /(\w+)\s(\w+)/;
+var str = "Jonas Schmidt";
+var newstr = str.replace(re, "$2, $1");
+console.log(newstr);
+
+ +

Die Ausgabe ist "Schmidt, Jonas".

+ +

Erweiterte Suche mit Optionen (Flags)

+ +

Reguläre Ausdrücke kennen vier verschiedene Optionen (Flags), die es z. B. erlauben global nach Übereinstimmungen zu suchen oder die Berücksichtigung der Groß- und Kleinschreibweise zu deaktivieren. Zur Aktivierung der globalen Suche wird das Flag g eingesetzt. Die Berücksichtigung der Groß- und Kleinschreibweise (engl. case-insensitive ) wird mit dem Flag i abgeschaltet. Die mehrzeilige Suche (engl. multiline) wird mit dem Flag m aktiviert und eine "sticky" Suche, wobei die Übereinstimmung an der aktuellen Postion im Eingabe-Zeichenkette zutreffen muss, wird mit dem Flag y aktiviert. Diese Optionen können getrennt oder gemeinsam verwendet und in beliebiger Reihenfolge angegeben werden. Die Buchstaben werden einfach an den regulären Ausdruck angehängt.

+ +

{{ Fx_minversion_note(3, "Die Unterstützung für das Flag y wurde bei Firefox 3 hinzugefügt. Wenn y aktiviert ist, schlägt die Suche fehl, wenn es keine Übereinstimmung an der aktuellen Position innerhalb der Eingabe-Zeichenkette gibt.") }}

+ +

Syntax für die Verwendung von Optionen:

+ +
var re = /Muster/Optionen;
+
+ +

oder

+ +
var re = new RegExp("Muster", "Optionen");
+
+ +

Die Optionen sind ein integraler Bestandteil des regulären Ausdrucks. Sie können nicht im Nachhinein entfernt oder hinzugefügt werden.

+ +

Zum Beispiel wird mit re = /\w+\s/g ein regulärer Ausdruck erstellt, der auf ein oder mehr Zeichen, gefolgt von einem Leerraum, passt. Nach diesem Muster wird über die ganze Zeichenkette hinweg gesucht.

+ +
var re = /\w+\s/g;
+var str = "fee fi fo fum";
+var myArray = str.match(re);
+console.log(myArray);
+
+ +

Hier ist die Ausgabe: ["fee ", "fi ", "fo "]. Bei diesem Beispiel könnte man die Zeile:

+ +
var re = /\w+\s/g;
+
+ +

mit folgender austauschen:

+ +
var re = new RegExp("\\w+\\s", "g");
+
+ +

und würde dasselbe Ergebnis erhalten.

+ +

Die Option m sorgt dafür, dass eine mehrzeilige Eingabe auch als solche interpretiert wird. Wird die Option m angegeben, passen die speziellen Zeichen ^ und $ auf den Anfang oder das Ende jeder Zeile der Eingabe, anstatt nur auf den Anfang und das Ende der gesamten Eingabe.

+ +

Beispiele

+ +

Das folgende Beispiel zeigt einige Einsatzmöglichkeiten von regulären Ausdrücken.

+ +

Ändern der Reihenfolge in einer Zeichenkette

+ +

Das folgende Beispiel veranschaulicht die Anordnung von regulären Ausdrücken und die Verwendung der Methoden string.split() und string.replace(). Im Beispiel wird eine schlecht formatierte Eingabe mit Personennamen (Vorname zuerst), die durch Leerzeichen, Tabulatoren und exakt ein Semikolon getrennt sind, bereinigt. Außerdem wird die Reihenfolge des jeweiligen Namens herumgedreht (Nachname zuerst) und die Liste nach Nachnamen sortiert.

+ +
// Die Zeichenkette beinhaltet mehrere Leerzeichen und Tabulatoren
+// und könnte mehrere Leerzeichen zwischen vor und Nachnamen enthalten.
+
+var names = "Lieschen Müller ;Erika Mustermann; Michel Deutscher ; Otto Normalverbraucher ; ";
+
+var output = ["---------- Original String\n", names + "\n"];
+
+// Erstellen von zwei regulären Ausdrücken und eines Arrays.
+// Die Eingabe-Zeichenkette wird in Array-Elemente zerlegt.
+
+// Muster: Möglicherweise ein Leerraum, dann ein Semikolon
+// und möglicherweise nochmal ein Leerraum (0 oder mehr).
+var pattern = /\s*;\s*/;
+
+// Splitten der Zeichenkette in einzelne Teile anhand des Musters und
+// speichern der Teile in einem Array mit Namen nameList.
+var nameList = names.split(pattern);
+
+// Neuer regulärer Ausdruck: ein oder mehr alphanumerische Zeichen,
+// dann mindestens ein Leerraum und nochmal mindestens ein Wortzeichen.
+// Klammern zum Speichern; Rückgriff auf gespeicherte Teile später.
+pattern = /(\w+)\s+(\w+)/;
+
+// Neues Array zum Speichern der bearbeiteten Namen.
+var bySurnameList = [];
+
+// Anzeigen des Arrays und befüllen des neuen Arrays
+// mit durch Komma getrennten Namen (Nachname zuerst).
+// Die Methode replace() entfernt alles, was mit dem Muster übereinstimmt
+// und ersetzt es durch den an zweiter Stelle angegebenen String,
+// bestehend aus den gespeicherten Teilen.
+// Zuerst wird der zweite Teil ($2) eingesetzt und anschließend durch Komma
+// und Leerzeichen getrennt der erste Teil ($1).
+
+output.push("---------- Nach Teilung durch regulären Ausdruck");
+
+var i, len;
+for (i = 0, len = nameList.length; i < len; i++){
+  output.push(nameList[i]);
+  bySurnameList[i] = nameList[i].replace(pattern, "$2, $1");
+}
+
+// Anzeigen des neuen Arrays.
+output.push("---------- Namen reserviert");
+for (i = 0, len = bySurnameList.length; i < len; i++){
+  output.push(bySurnameList[i]);
+}
+
+// Sortieren anhand des Nachnamens und anzeigen des neuen Arrays.
+bySurnameList.sort();
+output.push("---------- Sortiert");
+for (i = 0, len = bySurnameList.length; i < len; i++){
+  output.push(bySurnameList[i]);
+}
+
+output.push("---------- End");
+
+console.log(output.join("\n"));
+
+ +

Benutzung von speziellen Zeichen zur Verifizierung von Eingaben

+ +

Beim nachstehenden Beispiel wird der Benutzer aufgefordert, eine Telefonnummer einzugeben. Wenn der Benutzer den "Prüfen"-Button drückt, überprüft das Skript die Validität der Nummer. Sofern dann sichergestellt ist, dass es sich um eine Telefonnummer handelt (die Eingabe stimmt mit dem Muster des regulären Ausdrucks überein), zeigt das Skript eine Nachricht, um dem Benutzer zu danken und die Nummer zu bestätigen. Wenn die Nummer nicht valide ist (nicht mit dem Muster des regulären Ausdrucks übereinstimmt), wird der Benutzer ebenfalls mit einer Nachricht darüber informiert.

+ +

Das Muster des reguläre Ausdruck setzt sich folgendermaßen zusammen: Keine oder eine öffnende Klammer, \(?, gefolgt von drei Ziffern \d{3}, gefolgt von keiner oder einer schließenden Klammer \)?, gefolgt von einem Bindestrich, Schrägstrich, oder Punkt (falls vorhanden wird das Zeichen gespeichert) ([-\/\.]), gefolgt von drei Ziffern \d{3}, gefolgt (falls vorhanden) von dem gespeicherten Zeichen (Bindestrich, Schrägstrich oder Punkt) \1, gefolgt von vier Ziffern \d{4}.

+ +

Das Event Change wird ausgelöst, wenn der Benutzer die Enter-Taste drückt, um die Eingabe (den Wert für RegExp.input) zu bestätigen.

+ +
<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
+    <meta http-equiv="Content-Script-Type" content="text/javascript">
+    <script type="text/javascript">
+      var re = /\(?\d{3}\)?([-\/\.])\d{3}\1\d{4}/;
+      function testInfo(phoneInput){
+        var OK = re.exec(phoneInput.value);
+        if (!OK)
+          window.alert(RegExp.input + " ist keine Telefonnummer mit Vorwahl!");
+        else
+          window.alert("Danke! Ihre Telefonnummer ist " + OK[0]);
+      }
+    </script>
+  </head>
+  <body>
+    <p>Bitte ihre Telefonnummer (mit Vorwahl) eingeben und den "Prüfen"-Button anklicken.
+        <br>Das Format ist z.B. ###-###-####.</p>
+    <form action="#">
+      <input id="phone"><button onclick="testInfo(document.getElementById('phone'));">Prüfen</button>
+    </form>
+  </body>
+</html>
+
+ +

{{PreviousNext("Web/JavaScript/Guide/Textformatierung", "Web/JavaScript/Guide/Indexed_collections")}}

diff --git a/files/de/web/javascript/guide/schleifen_und_iterationen/index.html b/files/de/web/javascript/guide/schleifen_und_iterationen/index.html new file mode 100644 index 0000000000..9f351abcd9 --- /dev/null +++ b/files/de/web/javascript/guide/schleifen_und_iterationen/index.html @@ -0,0 +1,337 @@ +--- +title: Schleifen und Iterationen +slug: Web/JavaScript/Guide/schleifen_und_iterationen +tags: + - Guide + - JavaScript + - Loop + - Syntax + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Loops_and_iteration +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}
+ +

Schleifen sind ein einfaches Werkzeug, um einzelne Schritte wiederholt auszuführen. Dieses Kapitel des JavaScript Guide stellt die verschiedenen Statements für Iterationen vor, welche in JavaScript zur Verfügung stehen.

+ +

Man kann sich Schleifen wie eine Computerversion des Spiels vorstellen, bei dem man jemandem sagt, er soll x Schritte in eine Richtung und dann y Schritte in eine andere Richtung gehen. So kann zum Beispiel die Aussage "Gehe fünf Schritte nach Osten" mit Hilfe von Schleifen so ausgedrückt werden:

+ +
var schritt;
+for (schritt = 0; schritt < 5; schritt++) {
+  // Laufe 5 mal, mit den Werten von Schritt 0 bis 4
+  console.log('Gehe einen Schritt nach Osten');
+}
+
+ +

Es gibt viele verschiedene Arten von Schleifen, doch im Wesentlichen verrichten alle die gleiche Aufgabe: sie führen eine Aktion für eine bestimmte Anzahl an Wiederholungen aus (diese Anzahl kann auch 0 sein). Dabei ermöglichen die verschiedenen Arten von Schleifen unterschiedliche Anfangs- und Endpunkte festzulegen. Es gibt zahlreiche Situationen in denen eine Art von Schleifen einfacher zum Ergebnis führt, als eine andere.

+ +

JavaScript stellt folgende Statements für Schleifen zur Verfügung:

+ + + +

for Statement

+ +

Eine  {{jsxref("statements/for","for Schleife")}} wird so lange durchlaufen, bis eine bestimmte Bedingung den Wert false liefert. Die for Schleife in JavaScript ist vergleichbar mit der in Java und C. Ein for Statement sieht wie folgt aus:

+ +
for ([initialerAusruck]; [Bedingung]; [erhöhenderAusdruck])
+  Anweisung
+
+ +

Bei der Ausführung einer for Schleife geschieht folgendes:

+ +
    +
  1. Der Ausdruck zur Initialisierung der Schleife initialerAsudruck, wird ausgeführt, sofern dieser existiert. Dieser Ausdruck initialisiert einen oder mehrere Schleifenzähler, wobei die Syntax beliebig komplexe Ausdrücke zulässt. In diesem Ausdruck können auch Variablen deklariert werden.
  2. +
  3. Die Bedingung Bedingung wird geprüft. Wenn die Auswertung von Bedingung den Wert true ergibt, werden die Anweisungen innerhalb der Schleife ausgeführt. Ergibt die Prüfung hingegen false, wird die Schleife verlassen. Bleibt die Bedingung leer, wird immer der Wert true angenommen.
  4. +
  5. Die Anweisung wird ausgeführt. Um mehrere Anweisungen auszuführen, werden Block-Anweisungen ({ ... }) verwendet, um diese zu gruppieren.
  6. +
  7. Wenn vorhanden, wird der Ausdruck erhöhenderAusdruck ausgeführt.
  8. +
  9. Geht zu Schritt 2 zurück.
  10. +
+ +

Beispiel

+ +

Die folgende Funktion enthält ein for Statement, welche die Anzahl der ausgewählten Optionen aus einer Auswahlliste (ein {{HTMLElement("select")}}, welches eine Mehrfachauswahl erlaubt) ermittelt. Das for Statement deklariert eine Variable i und initialisiert diese mit dem Wert 0. Sie prüft ob i kleiner als die Anzahl der verfügbarer Optionen des <select> Elements ist, führt das nachfolgende if Statement aus und erhöht i bei jedem Schleifendurchlauf um 1.

+ +
<form name="selectForm">
+  <p>
+    <label for="musicTypes">Choose some music types, then click the button below:</label>
+    <select id="musicTypes" name="musicTypes" multiple="multiple">
+      <option selected="selected">R&B</option>
+      <option>Jazz</option>
+      <option>Blues</option>
+      <option>New Age</option>
+      <option>Classical</option>
+      <option>Opera</option>
+    </select>
+  </p>
+  <p><input id="btn" type="button" value="How many are selected?" /></p>
+</form>
+
+<script>
+function howMany(selectObject) {
+  var numberSelected = 0;
+  for (var i = 0; i < selectObject.options.length; i++) {
+    if (selectObject.options[i].selected) {
+      numberSelected++;
+    }
+  }
+  return numberSelected;
+}
+
+var btn = document.getElementById('btn');
+btn.addEventListener('click', function(){
+  alert('Number of options selected: ' + howMany(document.selectForm.musicTypes))
+});
+</script>
+
+
+ +

do...while Statement

+ +

Das {{jsxref("statements/do...while", "do...while")}} Statement wiederholt eine bestimmte Anweisung, bis eine Bedingung false ergibt. Ein do...while Statement sieht wie folgt aus:

+ +
do
+  anweisung
+while (bedingung);
+
+ +

amweisung wird dabei einmal ausgeführt, bevor die Bedingung geprüft wird. Um mehrere Anweisungen auszuführen, werden diese als Block Statement ({ ... }) gruppiert. Wenn bedingung true ist, wird die Anweisung erneut ausgeführt. Nach jeder Ausführung der Anweisungen, wird die Bedingung erneut geprüft. Sobald bedingung false ergibt, endet die Ausführung der Schleife und die nächste Anweisung nach der do...while Schleife aus wird ausgeführt.

+ +

Beispiel

+ +

Im folgenden Beispiel wird die Schleife mindestens einmal ausgeführt. Anschliessend wird die Schleife so oft durchlaufen, bis i nicht mehr kleiner als 5 ist.

+ +
var i = 0;
+do {
+  i += 1;
+  console.log(i);
+} while (i < 5);
+ +

while Statement

+ +

Ein {{jsxref("statements/while","while")}} Statement wird solange ausgeführt, wie eine bestimmte Bedingung true ergibt. Ein while Statement sieht wie folgt aus:

+ +
while (bedingung)
+  anweisung
+
+ +

Wenn die Bedingung false ist, wird die Schleife nicht weiter durchlaufen und die nächste Anweisung nach der while Schleife wird ausgeführt.

+ +

Die Prüfung der Bedingung erfolgt, bevor die Anweisungen innerhalb der Schleife ausgeführt werden. Nur wenn die Bedingung true ist, wird die Schleife ausgeführt, wobei anschliessend eine erneute Prüfung der Bedingung erfolgt. Ergibt die Bedingung false, wir mit der Anweisungen nach der while Schleife fortgefahren.

+ +

Um mehrere Anweisungen auszuführen, werden diese in einer block Anweisung ({ ... }) gruppiert.

+ +

Beispiel 1

+ +

Die folgende while Schleife wird so lange ausgeführt, wie n kleiner als 3 ist.

+ +
var n = 0;
+var x = 0;
+while (n < 3) {
+  n++;
+  x += n;
+}
+
+ +

Mit jedem Schleifendurchlauf wird n um 1 erhöht. Der Wert von n wird dann zum Wert von x addiert. Dadurch nehmen x und n die folgenden Werte an:

+ + + +

Nach dem dritten Durchlauf ist die Bedingung n < 3 nicht mehr true und die Schleife wird verlassen.

+ +

Beispiel 2

+ +

Endlosschleifen müssen vermieden werden. Es ist immer sicherzustellen, dass die Bedingung irgendwann false ergibt, da die Schleife ansonsten nie endet. Die Anweisung in der folgenden while Schleife wird für immer ausgeführt, weil die Bedingung nie false ergibt:

+ +
while (true) {
+  console.log('Hello, world!');
+}
+ +

Label Statement

+ +

Ein {{jsxref("statements/label","label")}} stellt ein Statement mit einem Bezeichner bereit, welches es ermöglicht auf eine bestimmte stelle im Programm zu verweisen. So kann ein Label zum Beispiel dafür verwendet werden eine Schleife zu identifizieren und dann mit break oder continue festzulegen ob diese beendet oder weiter durchlaufen werden soll.

+ +

Die Syntax des Label Statement sieht wie folgt aus:

+ +
label :
+   anweisung
+
+ +

Der Wert von label kann jede Bezeichnung sein, der kein reserviertes JavaScript Schlüsselwort ist. Die anweisung die mit dem Label identifiziert wird, kann jede beliebige Anweisung sein.

+ +

Beispiel

+ +

In diesem Beispiel identifiziert das Label markLoop eine while Schleife.

+ +
markLoop:
+while (theMark == true) {
+   doSomething();
+}
+ +

break Statement

+ +

Um eine Schleife oder ein switch Statement zu beenden, verwendet man das {{jsxref("statements/break","break")}} Statement in Verbindung mit dem Label Statement.

+ + + +

Die Syntax von break sieht wie folgt aus:

+ +
break [label];
+
+ +

Die erste Variante der Syntax beendet die innerste Schleife oder das innerste switch Statement. Die zweite Variante beendet eine bestimmte Anweisung.

+ +

Beispiel 1

+ +

Das folgende Beispiel durchläuft die Elemente in einem Array, bis ein Element mit dem Wert von theValue gefunden wird:

+ +
for (var i = 0; i < a.length; i++) {
+  if (a[i] == theValue) {
+    break;
+  }
+}
+ +

Beispiel 2: break mit einem Label

+ +
var x = 0;
+var z = 0;
+labelCancelLoops: while (true) {
+  console.log('Outer loops: ' + x);
+  x += 1;
+  z = 1;
+  while (true) {
+    console.log('Inner loops: ' + z);
+    z += 1;
+    if (z === 10 && x === 10) {
+      break labelCancelLoops;
+    } else if (z === 10) {
+      break;
+    }
+  }
+}
+
+ +

continue Statement

+ +

Das {{jsxref("statements/continue","continue")}} Statement kann eingesetzt werden, um eine while, do-while, for Schleife oder ein Statement mit einem Label erneut auszuführen.

+ + + +

Die Syntax des continue Statement sieht wie folgt aus:

+ +
continue [label];
+
+ +

Beispiel 1

+ +

Das folgende Beispiel zeigt eine while Schleife, mit einem continue Statement, die weiter ausgeführt wird, wenn i den Wert 3 hat. Dadurch erhält n die Werte 1, 3, 7 und 12.

+ +
var i = 0;
+var n = 0;
+while (i < 5) {
+  i++;
+  if (i == 3) {
+    continue;
+  }
+  n += i;
+}
+
+ +

Beispiel 2

+ +

Eine Anweisung mit dem Label checkiandj enthält eine Anweisung mit dem Label checkj. Wenn continue erreicht wird, bricht das Programm den aktuellen Schleifendurchlauf von checkj ab und setzt die Ausführung beim nächsten Durchlauf fort. Immer wenn continue erreicht wird, wird checkj erneut ausgeführt, bis dessen Bedingung false zurückliefert. Wird false zurückgeliefert, wird der Rest der checkiandj Anweisung vollendet und checkiandj wird wiederholt, bis dessen Bedingung false zurückgibt. Wird false zurückgegeben, wird das Programm bei der Anweisung nach checkiandj fortgesetzt.

+ +

Wenn continue ein Label checkiandj hätte, würde das Programm am Anfang der checkiandj Anweisung fortgesetzt werden.

+ +
var i = 0;
+var j = 10;
+checkiandj:
+  while (i < 4) {
+    console.log(i);
+    i += 1;
+    checkj:
+      while (j > 4) {
+        console.log(j);
+        j -= 1;
+        if ((j % 2) == 0) {
+          continue checkj;
+        }
+        console.log(j + ' is odd.');
+      }
+      console.log('i = ' + i);
+      console.log('j = ' + j);
+  }
+ +

for...in Statement

+ +

Das {{jsxref("statements/for...in","for...in")}} Statement durchläuft eine bestimmte Variable über alle aufzählbaren Eigenschaften eines Objekts. Für jede einzelne Eigenschaft führt JavaScript die entsprechende Anweisung aus. Ein for...in Statement sieht wie folgt aus:

+ +
for (variable in object) {
+  statements
+}
+
+ +

Beispiel

+ +

Die folgende Funktion nimmt als Argument ein Objekt und dessen Namen entgegen. Anschliessend durchläuft sie alle Eigenschaften des Objekts und liefert einen String zurück, der alle Namen und Werte der Eigenschaften des Objekts enthält.

+ +
function dump_props(obj, obj_name) {
+  var result = '';
+  for (var i in obj) {
+    result += obj_name + '.' + i + ' = ' + obj[i] + '<br>';
+  }
+  result += '<hr>';
+  return result;
+}
+
+ +

Für ein Objekt car mit den Eigenschaften make und model, sieht das Ergebnis wie folgt aus:

+ +
car.make = Ford
+car.model = Mustang
+
+ +

Arrays

+ +

Auch wenn es nahe liegt diesen Weg zu verwenden, um die Elemente eines {{jsxref("Array")}}s zu durchlaufen, würde das for...in Statement die Namen der definierten Werte und den numerischen Index zurückliefern. Daher ist es besser eine normale {{jsxref("statements/for","for")}} Schleifen mit einem numerischen Index zu verwenden, wenn Arrays durchlaufen werden sollen, da das for...in Statement neben den benutzerdefinierten Elementen auch die Eigenschaften des Arrays durchläuft, wenn man Methoden oder Eigenschaften hinzufügt oder ändert.

+ +

for...of Statement

+ +

Das {{jsxref("statements/for...of","for...of")}} Statement erstellt eine Schleife, die alle iterable objects (inklusive {{jsxref("Array")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, {{jsxref("functions/arguments","arguments")}} Objekt, etc.) durchläuft und die Anweisungen ausführt, die mit dem Wert des Durchlaufes für jede Eigenschaft übereinstimmt.

+ +
for (variable of object) {
+  statement
+}
+ +

Das folgende Beispiel zeigt den Unterschied zwischen der for...of Schleife und der {{jsxref("statements/for...in","for...in")}} Schleife. Während for...in die Namen der Eigenschaften durchläuft, durchläuft for...of die Werte der Eigenschaft:

+ +
var arr = [3, 5, 7];
+arr.foo = 'hello';
+
+for (var i in arr) {
+   console.log(i); // logs "0", "1", "2", "foo"
+}
+
+for (var i of arr) {
+   console.log(i); // logs 3, 5, 7
+}
+
+ +

{{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}

diff --git a/files/de/web/javascript/guide/textformatierung/index.html b/files/de/web/javascript/guide/textformatierung/index.html new file mode 100644 index 0000000000..48c45c9871 --- /dev/null +++ b/files/de/web/javascript/guide/textformatierung/index.html @@ -0,0 +1,257 @@ +--- +title: Textformatierung +slug: Web/JavaScript/Guide/Textformatierung +tags: + - Guide + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Guide/Text_formatting +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Numbers_and_dates", "Web/JavaScript/Guide/Regular_Expressions")}}
+ +

Dieses Kapitel gibt eine Einführung darüber, wie in JavaScript mit Strings (Zeichenfolgen) und Texten gearbeitet wird.

+ +

Strings

+ +

JavaScript's Datentyp {{Glossary("String")}} wird verwendet, um textuelle Daten zu repräsentieren. Es handelt sich um eine Reihe von Elementen, die ganzzahlige 16-Bit-Werte ohne Vorzeichen (UTF-16 Code Units) sind. Jedes Element belegt eine Position im String. Das erste Element befindet hat den Index 0, das nächste den Index 1 usw. Die Länge des Strings ist die Anzahl der Elemente, die darin enthalten sind. Strings können über String-Literale oder String-Objekte erzeugt werden.

+ +

ACHTUNG: Beim Bearbeiten dieser Seite keine Zeichen mit Zeichencode größer als U+FFFF einfügen, bis MDN bug 857438 behoben wurde ( https://bugzilla.mozilla.org/show_bug.cgi?id=857438 ).

+ +

String Literale

+ +

Einfache Strings können mittels einfacher oder doppelter Anführungszeichen erzeugt werden:

+ +
'foo'
+"bar"
+ +

Anspruchsvollere Strings können mit Escape-Sequenzen erstellt werden:

+ +

Hexadezimale Escape-Sequenzen

+ +

Die Zahl nach \x wird als hexadecimale Zahl interpretiert.

+ +
'\xA9' // "©"
+
+ +

Unicode Escape-Sequenzen

+ +

Unicode Escape-Sequenzen erfordern mindestens vier hexadezimale Ziffern nach \u.

+ +
'\u00A9' // "©"
+ +

Unicode Code Point Escapes

+ +

Diese sind neu in ECMAScript 2015. Mit Unicode Code Point Maskierung können beliebige Zeichen durch Maskierungssequenzen mit hexadezimalen Zahlen erzeugt werden, sodass die Verwendung von Unicode Code Points bis zu 0x10FFFF möglich ist. Mit einfachen Unicode Maskierungssequenz ist es oft notwendig, Surrogate-Hälften als zwei getrennte Maskierungssequenzen zu schreiben, um dasselbe Ergebnis zu erhalten.

+ +

Siehe auch {{jsxref("String.fromCodePoint()")}} oder {{jsxref("String.prototype.codePointAt()")}}.

+ +
'\u{2F804}'
+
+// das gleiche mit einfachen Unicode Escape-Sequenzen
+'\uD87E\uDC04'
+ +

String Objekte

+ +

Das {{jsxref("String")}} Objekt ist ein Wrapper für den primitiven Datentyp String.

+ +
var s = new String('foo'); // Erstellt ein String object
+console.log(s); // Ausgabe: {'0': 'f', '1': 'o', '2': 'o'}
+typeof s; // Gibt 'object' zurück
+
+ +

Beliebige Methoden des String Objekts können als Methoden eines String-Literals aufgerufen werden – JavaScript wandelt das String-Literal automatisch in ein temporäres String Objekt um, ruft die Methode auf und verwirft das temporäre String Objekt anschließend. Außerdem kann die String.length Eigenschaft mit einem String-Literal verwendet werden.

+ +

String-Literale sollten verwendet werden, außer es wird tatsächlich ein String Objekt benötigt, da String Objekte unerwartetes Verhalten aufweisen können. Beispielsweise:

+ +
var s1 = '2 + 2'; // Erzeugt ein String-Literal
+var s2 = new String('2 + 2'); // Erzeugt ein String Objekt
+eval(s1); // Gibt die Zahl 4 zurück
+eval(s2); // Gibt den String "2 + 2" zurück
+ +

Ein String Objekt hat eine Eigenschaft length, die die Anzahl von der UTF-16 Code Units im String angibt. Der folgende Code beispielsweise weist der Variable x den Wert 13 zu, da "Hello, World!" aus 13 Zeichen besteht. Jedes dieser Zeichen wird durch eine UTF-16 Code Unit dargestellt. Auf jede dieser Code Units kann durch eckige Klammern zugegriffen werden. Es können jedoch keine Zeichen geändert werden, da Strings unveränderbare Array-ähnliche Objekte sind:

+ +
var mystring = 'Hello, World!';
+var x = mystring.length;
+mystring[0] = 'L'; // hat keinen Effekt
+mystring[0]; // gibt "H" zurück
+
+ +

Zeichen mit einem Unicode-Wert größer als U+FFFF (wie z.B. manche seltene chinesiche/japanische/koreanische/vietnamesische Zeichen und einige Emoji) werden in UTF-16 als zwei Surrogate Code Units gespeichert. Ein String, der nur aus einem Zeichen, U+1F600 ("Emoji grinning face"), besteht, hätte die Länge 2. Der Zugriff auf einzelne Code Units in einem solchen String kann zu unerwünschten Effekten führen, wie z.B. die Entstehung von String mit unvollständigen Surrogate Code Units, was gegen den Unicode Standard verstößt. (Beispiele dafür sollten zu dieser Seite hinzugefügt werden, sobald MDN bug 857438 behoben wurde.) Siehe auch {{jsxref("String.fromCodePoint()")}} oder {{jsxref("String.prototype.codePointAt()")}}.

+ +

Ein String Objekt verschiedenste Methoden, unter anderem auch welche, die den String in abgewandelter Form zurückgeben, wie z.B. substring und toUpperCase.

+ +

Die folgende Tabelle gibt eine Zusammenfassung der Methoden von {{jsxref("String")}} Objekten.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Methoden von String

+
MethodeBeschreibung
{{jsxref("String.charAt", "charAt")}}, {{jsxref("String.charCodeAt", "charCodeAt")}}, {{jsxref("String.codePointAt", "codePointAt")}}Gibt das Zeichen oder den Zeichencode an der angegebenen Stelle im String zurück.
{{jsxref("String.indexOf", "indexOf")}}, {{jsxref("String.lastIndexOf", "lastIndexOf")}}Gibt die erste bzw. letzte Position des angegebenen Teilstrings im String zurück.
{{jsxref("String.startsWith", "startsWith")}}, {{jsxref("String.endsWith", "endsWith")}}, {{jsxref("String.includes", "includes")}}Gibt zurück, ob ein String mit dem angegebenen Teilstring beginnt, endet oder den Teilstring enthält.
{{jsxref("String.concat", "concat")}}Fügt die beiden Strings zusammen und gibt diesen neuen String zurück.
{{jsxref("String.fromCharCode", "fromCharCode")}}, {{jsxref("String.fromCodePoint", "fromCodePoint")}}Erstellt einen String aus den angegebenen Unicode Codes. Es handelt sich um eine Methode der Klasse String, nicht die einer String Instanz.
{{jsxref("String.split", "split")}}Teilt ein String Objekt in ein Array von Teilstrings.
{{jsxref("String.slice", "slice")}}Gibt einen Ausschnitt des Strings als neuen String zurück.
{{jsxref("String.substring", "substring")}}, {{jsxref("String.substr", "substr")}}Gibt einen Ausschnitt des Strings zurück, der entweder durch Angabe der Start- und Endindizes oder durch Angabe des Startindex und einer Länge gebildet wird.
{{jsxref("String.match", "match")}}, {{jsxref("String.replace", "replace")}}, {{jsxref("String.search", "search")}}Verwendet Regular Expressions um Übereinstimmungen mit einem Suchmuster zu finden oder Teile des Strings zu ersetzen.
{{jsxref("String.toUpperCase", "toUpperCase")}}, {{jsxref("String.toLowerCase", "toLowerCase")}} +

Wandelt einen String in Groß- bzw Kleinschreibung um und gibt das Ergebnis als neuen String zurück.

+
{{jsxref("String.normalize", "normalize")}}Gibt die Unicode Normalization Form des Strings zurück.
{{jsxref("String.repeat", "repeat")}}Gibt einen String zurück, in dem der ursprüngliche String mehrfach aneinandergereiht wurde.
{{jsxref("String.trim", "trim")}}Entfernt Leerzeichen vom Anfang und vom Ende des Strings.
+ +

Mehrzeilige Template-Strings

+ +

Template-Strings sind String-Symbole, die eingebettete Ausdrücke erlauben. Mit diesen Ausdrücken können mehrzeilige Strings und String-Interpolation genutzt werden.

+ +

Template-Strings sind anstelle von doppelten bzw. einfachen Anführungszeichen in Back-Ticks (` `) (grave accent) eingeschlossen. Template-Strings können Platzhalter beinhalten, die durch das Dollarsymbol gefolgt von geschweiften Klammern gekennzeichnet sind (${expression}).

+ +

Mehrzeilige Strings

+ +

Alle Zeichen, die einen Zeilenumbruch einleiten und sich zwischen Back-Ticks befinden, werden als Teil des Template Strings verwendet. Bei normalen Strings muss die folgende Syntax genutzt werden, um Strings mit Zeilenumbrücken über mehrere Codezeilen zu definieren:

+ +
console.log('string text line 1\n\
+string text line 2');
+// "string text line 1
+// string text line 2"
+ +

Um dasselbe Ergebnis mit Template-Strings zu erreichen, kann die folgende Schreibweise genutzt werden:

+ +
console.log(`string text line 1
+string text line 2`);
+// "string text line 1
+// string text line 2"
+ +

Erweiterung von Ausdrücken

+ +

Um Ausdrücke in normale Strings einzufügen, müsste die folgende Syntax genutzt werden:

+ +
var a = 5;
+var b = 10;
+console.log('Fifteen is ' + (a + b) + ' and\nnot ' + (2 * a + b) + '.');
+// "Fifteen is 15 and
+// not 20."
+ +

Mit Template-Strings können nun die syntaktischen Vorteile genutzt werden um solche Ersetzungen leserlicher zu machen:

+ +
var a = 5;
+var b = 10;
+console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`);
+// "Fifteen is 15 and
+// not 20."
+ +

Mehr Informationen sind unter Template-Strings in der JavaScript-Referenz nachzulesen. 

+ +

Internationalization

+ +

Das {{jsxref("Intl")}} Objekt ist der Namespace für das ECMAScript Internationalization API, welches sprachabhängige String-Vergleiche, Zahlen-, Datums- und Uhrzeitformate bereitstellt. Die Konstruktoren für {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} und {{jsxref("DateTimeFormat")}} Objekte sind Eigenschaften des Intl Objekts.

+ +

Datums- und Uhrzeitformatierung

+ +

Das {{jsxref("DateTimeFormat")}} Objekt hilft bei der Datums- oder Uhrzeitformatierung. Im folgenden Beispiel wird ein Datum für amerikanisches Englisch formatiert. (Das Ergebnis variiert je nach eingestellter Zeitzone.)

+ +
var msPerDay = 24 * 60 * 60 * 1000;
+
+// July 17, 2014 00:00:00 UTC.
+var july172014 = new Date(msPerDay * (44 * 365 + 11 + 197));
+
+var options = { year: '2-digit', month: '2-digit', day: '2-digit',
+                hour: '2-digit', minute: '2-digit', timeZoneName: 'short' };
+var americanDateTime = new Intl.DateTimeFormat('en-US', options).format;
+
+console.log(americanDateTime(july172014)); // 07/16/14, 5:00 PM PDT
+
+ +

Zahlenformatierung

+ +

Das {{jsxref("NumberFormat")}} Objekt hilft bei der Formatierung von Zahlen, wie z.B. Währungen.

+ +
var gasPrice = new Intl.NumberFormat('en-US',
+                        { style: 'currency', currency: 'USD',
+                          minimumFractionDigits: 3 });
+
+console.log(gasPrice.format(5.259)); // $5.259
+
+var hanDecimalRMBInChina = new Intl.NumberFormat('zh-CN-u-nu-hanidec',
+                        { style: 'currency', currency: 'CNY' });
+
+console.log(hanDecimalRMBInChina.format(1314.25)); // ¥ 一,三一四.二五
+
+ +

Sortierung

+ +

Das {{jsxref("Collator")}} Objekt hilft beim Vergleichen und Sortieren von Strings.

+ +

Zum Beispiel gibt es im Deutschen zwei unterschiedliche Sortierreihenfolgen: Telefonbuchsortierung und Wörterbuchsortierung. Bei der Telefonbuchsortierung werden "ä", "ö" etc. so sortiert, als ob es sich um "ae", "oe" etc. handeln würde.

+ +
var names = ['Hochberg', 'Hönigswald', 'Holzman'];
+
+var germanPhonebook = new Intl.Collator('de-DE-u-co-phonebk');
+
+// as if sorting ["Hochberg", "Hoenigswald", "Holzman"]:
+console.log(names.sort(germanPhonebook.compare).join(', '));
+// logs "Hochberg, Hönigswald, Holzman"
+
+ +

Bei manchen Beugungsformen wird ein Vokal zu einem Umlaut, daher ist es sinnvoll, Wörterbücher so zu sortieren, dass Vokale und Umlaute gleich sortiert werden. Bei der Sortierung wird dann also "ä" wie "a" und "ö" wie "o" sortiert. Eine Ausnahme stellen Wörter dar, die sich nur im Umlaut unterscheiden. In solchen Fällen wird der Vokal vor dem Umlaut gereiht (z.B. schon vor schön). 

+ +
var germanDictionary = new Intl.Collator('de-DE-u-co-dict');
+
+// as if sorting ["Hochberg", "Honigswald", "Holzman"]:
+console.log(names.sort(germanDictionary.compare).join(', '));
+// logs "Hochberg, Holzman, Hönigswald"
+
+ +

Mehr Informationen über das {{jsxref("Intl")}} API können unter Introducing the JavaScript Internationalization API (in Englisch) nachgelesen werden.

+ +
{{PreviousNext("Web/JavaScript/Guide/Numbers_and_dates", "Web/JavaScript/Guide/Regular_Expressions")}}
diff --git a/files/de/web/javascript/guide/using_promises/index.html b/files/de/web/javascript/guide/using_promises/index.html new file mode 100644 index 0000000000..0aad2a4071 --- /dev/null +++ b/files/de/web/javascript/guide/using_promises/index.html @@ -0,0 +1,341 @@ +--- +title: Promises benutzen +slug: Web/JavaScript/Guide/Using_promises +translation_of: Web/JavaScript/Guide/Using_promises +--- +
{{jsSidebar("JavaScript Guide")}}{{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Iterators_and_Generators")}}
+ +

Ein {{jsxref("Promise")}} ist ein Objekt, das die finale Beendigung einer asynchronen Operation repräsentiert. Je nachdem, ob die Operation erfolgreich oder fehlerhaft beendet wurde, wird das Promise entsprechend gekennzeichnet.

+ +

Da in den meisten Fällen bereits existierende Promises benutzt werden, wird diese Anleitung zuerst die Benutzung von zurückgegebenen Promises erklären, und dann darauf eingehen, wie diese erzeugt werden.

+ +

Grob gesagt ist ein Promise ein zurückgegebenes Objekt, an welches Callback-Funktionen angehängt werden können, anstatt dass diese einer Funktion übergeben werden.

+ +

Betrachten wir z.B. folgende Funktion createAudioFileAsync(), welche asynchron eine Audio-Datei generiert; an diese werden Audio-Einstellungen sowie zwei Callback-Funktionen übergeben - eine für das erfolgreiche Erzeugen der Audio-Datei, und die andere für auftretende Fehler.

+ +

Ein beispielhafter Code, den createAudioFileAsync() nutzen würde, sieht in etwa so aus:

+ +
function successCallback(result) {
+  console.log("Audio-Datei bereit unter URL: " + result);
+}
+
+function failureCallback(error) {
+  console.error("Fehlerhafte Generierung der Audio-Datei: " + error);
+}
+
+createAudioFileAsync(audioSettings, successCallback, failureCallback);
+
+ +

In modernen Funktionen, welche Promises zurückgeben, kann man die Callbacks stattdessen direkt anhängen:

+ +

Würde createAudioFileAsync() so umgeschrieben, dass es als Rückgabewert ein Promise hätte, wäre die Nutzung davon einfach so:

+ +
createAudioFileAsync(audiosettings).then(successCallback, failureCallback);
+ +

Das ist die Kurzform von:

+ +
const promise = createAudioFileAsync(audioSettings);
+promise.then(successCallback, failureCallback);
+
+ +

Dies nennt man einen asynchronen Funktionsaufruf. Diese Vorgehensweise hat mehrere Vorteile, von denen in diesem Artikel jeder einzeln geschildert wird.

+ +

Garantien

+ +

Anders als bei Callback-Übergabe nach dem alten Verfahren, können Promise-Objekte folgendes sicherstellen:

+ + + +

Allerdings ist der wohl kurzfristigste Nutzen von Promises das Chaining.

+ +

Chaining

+ +

Eine häufige Aufgabenstellung ist der Aufruf von zwei oder mehr asynchronen Funktionen nacheinander in Sequenz, wobei Ergebnisse aus der vorangegangenen Funktion in die folgende Funktion übernommen werden. Dies ist realisierbar mittels einer Promise chain.

+ +

Hier steckt der Zauber drin: Die Funktion .then() gibt stets ein neues Promise-Objekt zurück:

+ +
const promise = doSomething();
+const promise2 = promise.then(successCallback, failureCallback);
+
+ +

oder auch

+ +
const promise2 = doSomething().then(successCallback, failureCallback);
+
+ +

Hierbei repräsentiert promise2 nicht nur den vollständigen Aufruf von doSomething(), sondern auch die Ergebnisse der beiden angehängten Funktionen successCallback oder failureCallback - diese können ebenfalls asynchrone Funktionen sein, die Promises zurückgeben. In diesem Fall werden jegliche Callback-Funktionen, die an promise2 angehängt würden, jeweils auch eingereiht in den jeweiligen Promise-Rückgabewerten von successCallback oder failureCallback.

+ +

Grundsätzlich repräsentiert jedes Promise-Objekt die Vervollständigung eines asynchronen Schritts in der Kette.

+ +

Nach dem alten Verfahren führte das Aneinanderreihen von mehreren asynchronen Operationen zur klassischen Callback pyramid of doom:

+ +
doSomething(function(result) {
+  doSomethingElse(result, function(newResult) {
+    doThirdThing(newResult, function(finalResult) {
+      console.log('Got the final result: ' + finalResult);
+    }, failureCallback);
+  }, failureCallback);
+}, failureCallback);
+
+ +

Mit moderenen Funktionen können diese Callback-Funktionen stattdessen an die zurückgegebenen Promise-Objekte angehängt werden, womit die Promise chain geformt wird:

+ +
doSomething().then(function(result) {
+  return doSomethingElse(result);
+})
+.then(function(newResult) {
+  return doThirdThing(newResult);
+})
+.then(function(finalResult) {
+  console.log('Got the final result: ' + finalResult);
+})
+.catch(failureCallback);
+
+ +

Die Argumente für .then() sind optional, und .catch(failureCallback) ist die Kurzschreibform von .then(null, failureCallback). Dies kann stattdessen auch mit Pfeil-Funktionen ausgedrückt werden:

+ +
doSomething()
+.then(result => doSomethingElse(result))
+.then(newResult => doThirdThing(newResult))
+.then(finalResult => {
+  console.log(`Got the final result: ${finalResult}`);
+})
+.catch(failureCallback);
+
+ +

Wichtig: Immer Rückgabewerte angeben; sonst können die Callback das Ergebnis eines vorherigen Promise nicht abfangen.

+ +

Chaining nach einem .catch()

+ +

Es ist auch möglich, nach einem Fehler, sprich .catch(), weiter zu verkettern. Dies ist nützlich um neue Operationen auszuführen, auch nachdem es einen Fehler in der Kette gab.

+ +
new Promise((resolve, reject) => {
+    console.log('Initial');
+
+    resolve();
+})
+.then(() => {
+    throw new Error('Something failed');
+
+    console.log('Do this');
+})
+.catch(() => {
+    console.log('Do that');
+})
+.then(() => {
+    console.log('Do this, no matter what happened before');
+});
+
+ +

Das obige Beispiel hat die nachfolgenden Ausgaben:

+ +
Initial
+Do that
+Do this, no matter what happened before
+
+ +

Zu beachten ist hier, dass der Text "Do this" nicht ausgegeben wird, weil der Fehler "Something failed" einen Abbruch ausgelöst hat.

+ +

Fehlerübertragung

+ +

Schaut man sich weiter oben die Callback pyramid of doom an, wird sichtbar, dass failureCallback dort mehrmals angegeben werden muss, anders als nur einmal beim Beispiel unten:

+ +
doSomething()
+.then(result => doSomethingElse(result))
+.then(newResult => doThirdThing(newResult))
+.then(finalResult => console.log(`Got the final result: ${finalResult}`))
+.catch(failureCallback);
+
+ +

Grundsätzlich hält eine Promise chain bei einer Exception an und erlaubt nur noch Zugriffe von .catch()-Handlern. Dies ist modelliert nach der Funktionsweise von synchronem Code:

+ +
try {
+  const result = syncDoSomething();
+  const newResult = syncDoSomethingElse(result);
+  const finalResult = syncDoThirdThing(newResult);
+  console.log(`Got the final result: ${finalResult}`);
+} catch(error) {
+  failureCallback(error);
+}
+
+ +

Diese Symmetrie mit synchronem Code erreichte ihren Höhepunkt in der async/await-Komfortschreibweise in ECMAScript 2017:

+ +
async function foo() {
+  try {
+    const result = await doSomething();
+    const newResult = await doSomethingElse(result);
+    const finalResult = await doThirdThing(newResult);
+    console.log(`Got the final result: ${finalResult}`);
+  } catch(error) {
+    failureCallback(error);
+  }
+}
+
+ +

Diese Schreibweise baut auf Promises auf; so ist doSomething() die selbe Funktion wie vorher. Hier kann man mehr über diese Syntax erfahren.

+ +

Promise-Objekte lösen mit der Callback pyramid of doom ein fundamentales Designproblem, indem sie alle Fehler, auch geworfene Exceptions und Programmierfehler, abfangen. Diese Eigenschaft ist essentiell für die funktionale Komposition von asynchronen Operationen.

+ +

Promise rejection-Events

+ +

Immer, wenn ein Promise abgelehnt ("rejected") wird, wird eines von zwei Events zum globalen Scope (grundsätzlich entweder window, oder, falls in einem Web-Worker gearbeitet wird, der Worker selbst oder ein anderes, Worker-basiertes Interface) geschickt. Diese beiden Events sind:

+ +
+
rejectionHandled
+
Wird bei der Ablehnung eines Promise gesendet, nachdem die Ablehnung von der reject-Funktion des Ausführenden verarbeitet wurde.
+
unhandledRejection
+
Wird bei der Ablehnung eines Promise gesendet, wenn es keinen Rejection-Handler gibt.
+
+ +

In beiden Fällen hat das Event (vom Typ PromiseRejectionEvent) als Member das Attribut promise welches auf das abgelehnte Promise zeigt, sowie ein Attribut reason welches eine Begründung für die Ablehnung des Promise enthält.

+ +

Diese Events bilden ein Fallback für die Fehlerbehandlung bei Promises sowie eine Hilfestellung beim Debugging des eigenen Promise-Managements. Da die Händler im Kontext global sind, werden alle Fehler unabhängig von der Quelle zu ihnen geschickt.

+ +

Ein Fall der besonderen Nützlichkeit: Wenn man Code in Node.js schreibt, kann es oft passieren, dass im Projekt hinzugefügte Module unverarbeitete abgelehnte Promises haben. Diese werden von der Node-Laufzeitumgebung in die Konsole geloggt. Zu Analysezwecken, zur Verarbeitung durch den eigenen Code, oder auch einfach zur Verhinderung von übermäßigem Output, kann man diese abgelehnten Promises einfangen, indem man für das unhandledrejection event einen Handler hinzufügen:

+ +
window.addEventListener('unhandledrejection', event => {
+  /* Hier lässt sich Code einfügen, um die Attribute des Events
+     zu untersuchen */
+  event.preventDefault();
+}, false);
+ +

Indem die preventDefault()-Methode des Events aufgerufen wird, wird die standardmäßige Operation bei unverarbeiteten abgelehnten Promises verhindert. Üblicherweise beinhaltet dies das Loggen des Fehlers in der Konsole; im Fall von Node ist das tatsächlich der Fall.

+ +

Idealerweise sollte man abgelehnte Promises immer untersuchen, um sicher zu gehen, dass es sich nicht um Code-Fehler handelt.

+ +

Ein Promise-Objekt in einer alten Callback-API erzeugen

+ +

Ein einfaches {{jsxref("Promise")}} kann durch dessen Konstruktor-Methode erzeugt werden. Diese Art und Weise sollte nur genutzt werden, um alte APIs damit zu umschließen.

+ +

Idealerweise würden alle asynchronen Funktionen bereits Promises zurückgeben. In der Realität erwarten einige APIs immer Callback-Funktionen für Erfolg und Fehlerfall, die nach dem alten Prinzip übergeben werden müssen. Ein eindeutiges Beispiel hierfür ist die Funktion {{domxref("WindowTimers.setTimeout", "setTimeout()")}}:

+ +
setTimeout(() => saySomething("10 seconds passed"), 10000);
+
+ +

Callback-Funktionen nach dem alten Verfahren und Promises zu vermischen, bringt Probleme mit sich. Wenn saySomething() fehlschlägt oder Programmierfehler enthält, wird dies durch nichts abgefangen.

+ +

Glücklicherweise kann man solche Fälle mit einem Promise umschließen. Ein Best Practice besteht darin, problematische Funktionen auf der niedrigstmöglichen Ebene zu umschließen, und sie nie wieder direkt aufzurufen:

+ +
const wait = (ms) => new Promise(resolve => setTimeout(resolve, ms));
+
+wait(10000).then(() => saySomething("10 seconds")).catch(failureCallback);
+
+ +

Der Promise-Konstruktor empfängt grundsätzlich eine Ausführenden-Funktion, die es möglich macht, ein Promise manuell aufzulösen oder abzulehnen. Da setTimeout() nicht wirklich fehlschlägt, wurde im oberen Beispiel die Ablehnung ausgelassen.

+ +

Komposition

+ +

{{jsxref("Promise.resolve()")}} und {{jsxref("Promise.reject()")}} sind Abkürzungen für das manuelle Erzeugen von jeweils bereits aufgelösten oder abgelehnten Promises. In bestimmten Fällen kann dies nützlich sein.

+ +

{{jsxref("Promise.all()")}} und {{jsxref("Promise.race()")}} sind zwei Kompositionswerkzeuge für das parallele Durchführen von asynchronen Operationen.

+ +

Sequenzielle Komposition ist möglich durch cleveres Javascript:

+ +
[func1, func2].reduce((p, f) => p.then(f), Promise.resolve());
+ +

Im oberen Beispiel wird ein Array von asynchronen Funktionen auf eine Promise chain reduziert. Somit ist es das gleiche, wie Promise.resolve().then(func1).then(func2);.

+ +

Auch ist es möglich, dies mit einer wiederverwendbaren Kompositionsfunktion umzusetzen, die häufig in der funktionalen Programmierung vorkommt:

+ +
const applyAsync = (acc,val) => acc.then(val);
+const composeAsync = (...funcs) => x => funcs.reduce(applyAsync, Promise.resolve(x));
+ +

Die Funktion composeAsync() akzeptiert eine dynamische Anzahl von Funktionen als Parameter, und hat als Rückgabewert eine Funktion, die einen Initialwert akzeptiert, welcher durch die Kompositions-Pipeline durchgereicht wird. Der Nutzen besteht darin, dass einige oder alle übergebenen Funktionen entweder synchron oder asynchron sein können, und garantiert wird, dass sie in der richtigen Reihenfolge ausgeführt werden.

+ +
const transformData = composeAsync(func1, asyncFunc1, asyncFunc2, func2);
+transformData(data);
+
+ +

In ECMAScript 2017 kann sequenzielle Komposition mittels async/await noch einfacher durchgeführt werden:

+ +
for (const f of [func1, func2]) {
+  await f();
+}
+
+ +

Timing

+ +

Um Überraschungen vorzubeugen, werden Funktionen die an .then() übergeben werden niemals synchron aufgerufen, auch wenn das Promise bereits aufgelöst wurde:

+ +
Promise.resolve().then(() => console.log(2));
+console.log(1); // 1, 2
+
+ +

Anstatt sofort ausgeführt zu werden, wird die übergebene Funktion in eine Microtask-Warteschlange eingereiht; das bedeutet, sie wird erst ausgeführt, wenn die Warteschlange am ende des aktuellen Durchlaufs des Javascript event loops geleert wird, sprich zeitnah:

+ +
const wait = ms => new Promise(resolve => setTimeout(resolve, ms));
+
+wait().then(() => console.log(4));
+Promise.resolve().then(() => console.log(2)).then(() => console.log(3));
+console.log(1); // 1, 2, 3, 4
+
+ +

Nesting

+ +

Einfache Promise chains sollten möglichst flach und ohne Nesting implementiert werden, da Nesting auch das Ergebnis von undurchdachter Komposition sein kann. Siehe auch bei typischen Fehlern.

+ +

Als Nesting wird eine Kontrollstruktur bezeichnet, um den Scope von catch-Statements zu begrenzen. Ein nested catch fängt nur Fehler in seinem Scope und niedriger ab, nicht außerhalb. Korrekt genutzt führt dies zu höherer Präzision in der Fehlerbehandlung:

+ +
doSomethingCritical()
+.then(result => doSomethingOptional(result)
+  .then(optionalResult => doSomethingExtraNice(optionalResult))
+  .catch(e => {})) // Ignorieren, wenn optionale Operation fehlschlägt
+.then(() => moreCriticalStuff())
+.catch(e => console.error("Critical failure: " + e.message));
+ +

Typische Fehler

+ +

In diesem Abschnitt werden übliche Programmierfehler thematisiert, auf die man achten sollte, um Promise chains nicht zu kompromittieren. Im unteren Beispiel wurden drei der am häufigsten vorkommenden Fehler untergebracht:

+ +
eineFunktion().then(function (ergebnis) {
+  eineZweiteFunktion(ergebnis) // Kein Promise-Rückgabewert für innere Chain + unnötiges Nesting
+  .then(neuesErgebnis => eineDritteFunktion(neuesErgebnis));
+}).then(() => eineVierteFunktion());
+// Keine Chain-Terminierung mit einem catch!
+ +

Der erste Programmierfehler ist, dass die Promise chain nicht ordentlich geknüpft wurde. Passieren tut dies, wenn ein neues Promise erzeugt, aber nicht zurückgegeben wird. Das führt dazu, dass die Promise chain reisst, oder aber, dass zwei chains entstehen, die sich in einer Race condition befinden. Im Klartext heisst das, dass eineVierteFunktion() nicht darauf wartet, dass eineZweiteFunktion() oder eineDritteFunktion() abgeschlossen sind, und, wahrscheinlich unbeabsichtigt, parallel mit ihnen ausgeführt wird. Einzelne Promise chains haben zusätzlich eigene Fehlerbehandlungen, was in diesem Fall zu nicht abgefangenen Fehlern führt.

+ +

Der zweite Programmierfehler ist das unnötige Nesting, welches den ersten Fehler mitverursachen kann. Da Nesting auch den Scope der inneren Fehler-Handler begrenzt, kann dies zu nicht abgefangenen Fehlern führen. Eine Variante hiervon ist das Promise-Konstruktor-Antipattern, welches Nesting mit der redundanten Nutzung eines Promise-Konstruktors, um Code, der bereits Promises nutzt, zu umschließen, kombiniert.

+ +

Der dritte Programmierfehler ist, die Terminierung der Promise chain mit einem .catch() wegzulassen. Unterminierte chains führen in den meisten Browsern zu nicht abgefangenen Promise-Ablehnungen.

+ +

Als Faustregel sei genannt, dass Promise chains immer entweder zurückgegeben oder terminiert werden sollen, und neue Promises sofort zurückgegeben werden sollten, um die Hierarchie flach zu halten:

+ +
eineFunktion()
+.then(function(ergebnis) {
+  return eineZweiteFunktion(ergennis);
+})
+.then(neuesErgebnis => eineDritteFunktion(neuesErgebnis))
+.then(() => eineVierteFunktion())
+.catch(fehler => console.error(fehler));
+ +

Zu beachten ist, dass () => x die Kurzschreibform für () => { return x; } ist.

+ +

Im oberen Beispiel steht jetzt eine einzelne, deterministische Promise chain mit ordentlicher Fehlerbehandlung.

+ +

Das Verwenden von async/await adressiert die meisten, wenn nicht alle dieser Fehlerquellen; stattdessen kann dann der typische Fehler entstehen, dass man await-Keyword vergisst.

+ +

Wenn Promises auf Tasks treffen

+ +

In einer Situation, in der es Promises und Tasks (z.B. Events oder Callbacks) gibt, die in einer unvorhergesehenen Reihenfolge ausgeführt werden / feuern können, ist es möglich, sich einen Microtask zunutze zu machen, um den Status von Promises zu prüfen oder diese auszubalancieren, wenn diese unter bestimmten Bedingungen erzeugt werden.

+ +

Für weitere Informationen über Microtasks und das Einreihen einer Funktion als Microtask mittels queueMicrotask(), kann im Microtask-Guide nachlesen.

+ +

Siehe auch

+ + + +

{{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Iterators_and_Generators")}}

diff --git a/files/de/web/javascript/index.html b/files/de/web/javascript/index.html new file mode 100644 index 0000000000..25a6710806 --- /dev/null +++ b/files/de/web/javascript/index.html @@ -0,0 +1,120 @@ +--- +title: JavaScript +slug: Web/JavaScript +tags: + - JavaScript + - Landing + - Learn + - 'l10n:priority' +translation_of: Web/JavaScript +--- +
{{JsSidebar}}
+ +

JavaScript (JS) ist eine leichtgewichtige, interpretierte oder JIT-übersetzte Sprache mit {{Glossary("First-class_Function", "First-Class-Funktion")}}. Bekannt ist sie hauptsächlich als Skriptsprache für Webseiten geworden, jedoch wird sie auch in vielen Umgebungen außerhalb des Browsers wie zum Beispiel Node.js, Apache CouchDB und Adobe Acrobat eingesetzt. JavaScript ist eine {{Glossary("Prototype-based_programming", "prototypbasierte")}} Sprache, die mehreren Paradigmen folgt, dynamisch ist und sowohl objektorientierte, imperative als auch deklarative Programmierung (z. B. funktionales Programmieren) ermöglicht. Weitere Informationen über JavaScript.

+ +

Dieser Bereich dient zur Beschreibung der Sprache JavaScript selbst, also allgemeinen Inhalten, die nicht nur speziell für Webseiten oder andere Umgebungen gelten. Für weitere Informationen zu bestimmten {{Glossary("API","APIs")}} für Webseiten, siehe auf den Seiten für Web APIs und DOM.

+ +

Der Standard für JavaScript ist ECMAScript. Stand 2012 unterstützen alle modernen Browser ECMAScript 5.1 vollständig. Ältere Browser unterstützen mindestens ECMAScript 3. Am 17. Juni 2015 veröffentlichte ECMA International die sechste Version von ECMAScript, welche offiziell ECMAScript 2015 genannt wird und initial mit ECMAScript 6 oder ES6 referenziert wurde. Seitdem gibt es jedes Jahr eine neue Version von ECMAScript-Standards. Diese Dokumentation referenziert den letzen Entwurfsstand, welcher aktuell ECMAScript 2019 ist.

+ +

Man sollte JavaScript nicht mit der Programmiersprache Java verwechseln. Beide, "Java" und "JavaScript" sind Handelsmarken und/oder registrierte Handelsmarken von Oracle in den USA oder anderen Ländern. Die beiden Programmiersprachen haben eine sehr unterschiedliche Syntax, Semantik und Verwendung.

+ +
+
+

Tutorials

+Lernen Sie, wie man mit JavaScript programmiert, mit Guides und Tutorials. + +

Für komplette Einsteiger

+ +

Besuchen Sie unseren Lernbereich zu JavaScript-Themen, wenn Sie noch keine Erfahrungen mit JavaScript oder Programmierung haben. Die folgenden Module sind dort verfügbar:

+ +
+
Erste Schritte mit JavaScript
+
Beantwortet einige fundamentale Fragen, wie "Was ist JavaScript?", "Wie sieht es aus?" und "Was kann es machen?", und diskutiert Schlüsselfunktionen von JavaScript, wie Variablen, Strings, Zahlen und Arrays.
+
JavaScript Bausteine
+
Erweitert die Kenntnisse über JavaScripts fundamentale Schlüsselfunktionen und lenkt die Aufmerksamkeit auf häufig eingesetzte Arten von Codeblöcken, wie Bedingte Statements, Schleifen, Funktionen und Events.
+
Einführung in JavaScript Objekte
+
Die objektorientierte Natur von JavaScript ist wichtig zu verstehen, wenn man die Sprache weiter lernen möchte und effizienteren Code schreiben möchte. Deswegen ist dieses Modul hier, um Ihnen zu dabei zu helfen.
+
+ +

JavaScript Guide

+ +
+
JavaScript Guide
+
Ein deutlich detaillierterer Guide für die Sprache JavaScript, der für Leute gedacht ist, die schon Programmiererfahrung mit JavaScript oder anderen Sprachen gesammelt haben.
+
+ +

Fortgeschritten

+ +
+
Clientseitige Web APIs
+
Wenn Clientseitige JavaScript für Webseiten oder Applikationen geschrieben werden, kommt man nicht weit ohne den Einsatz von APIs — Schnittstellen für das Manipulieren von verschiedenen Aspekten des Browsers und des Operationssystem, auf dem die Seite läuft oder einfach Daten für andere Webseiten oder Services. Dieses Modul gibt einen Überblick über die APIs und zeigt, wie die am häufigsten eingesetzten APIs oft in der Entwicklungsarbeit benutzt werden.
+
Eine Wiedereinführung in JavaScript
+
Ein Überblick für diejenigen, die meinen, dass sie JavaScript bereits kennen.
+
+ +
+
JavaScript-Datenstrukturen
+
Überblick über vorhandene Datenstrukturen in JavaScript.
+
Vergleiche auf Gleichheit und deren Verwendung
+
JavaScript stellt drei verschieden Vergleichsoperatoren bereit: Strikte Gleichheit mit ===, lose Gleichheit mit == und die {{jsxref("Global_Objects/Object/is", "Object.is()")}} Methode.
+
+ +
+
+ +

Erweitert

+ +
+
Vererbung und die Prototyp-Kette
+
Erläuterung der vielfach missverstandenen und unterschätzten prototypbasierte Vererbung.
+
Strict mode
+
Der Strict mode definiert, dass man keine Variable vor der Initialisierung benutzen kann. Es ist eine eingeschränkte Variante von ECMAScript 5 für bessere Performance und einfacheres Debuggen.
+
JavaScripts typisierte Arrays
+
JavaScript typisierte Arrays ermöglichen es, auf binäre Rohdaten zuzugreifen.
+
Speicherverwaltung
+
Speicherzyklen und Garbage Collection in JavaScript.
+
Parallelitätsmodell und Ereignisschleife
+
JavaScript hat ein Parallelitätsmodell basierend auf einer Ereignisschleife.
+
+
+ +
+

Referenz

+ +

In der kompletten JavaScript Referenz Dokumentation nachschlagen.

+ +
+
Standardobjekte
+
Eingebaute Objekte der Standardbibliothek wie {{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Error")}}, {{jsxref("Function")}}, {{jsxref("JSON")}}, {{jsxref("Math")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("RegExp")}}, {{jsxref("String")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, {{jsxref("WeakMap")}}, {{jsxref("WeakSet")}} und weitere.
+
Ausdrücke & Operatoren
+
Mehr lernen über die Bedeutung von JavaScript Operatoren {{jsxref("Operators/instanceof", "instanceof")}}, {{jsxref("Operators/typeof", "typeof")}}, {{jsxref("Operators/new", "new")}}, {{jsxref("Operators/this", "this")}}, die Operationsreihenfolge und mehr.
+
Statements & Deklarationen
+
Lernen wie {{jsxref("Statements/do...while", "do-while")}}, {{jsxref("Statements/for...in", "for-in")}}, {{jsxref("Statements/for...of", "for-of")}}, {{jsxref("Statements/try...catch", "try-catch")}}, {{jsxref("Statements/let", "let")}}, {{jsxref("Statements/var", "var")}}, {{jsxref("Statements/const", "const")}}, {{jsxref("Statements/if...else", "if-else")}}, {{jsxref("Statements/switch", "switch")}} und weitere JavaScript Statements und Schlüsselwörter funktionieren.
+
Funktionen
+
Lernen, wie man mit JavaScripts Funktionen Erarbeitet, um eine Applikation zu entwickeln.
+
+ +

Werkzeuge & Hilfen

+ +

Hilfreiche Werkzeuge zum Schreiben und Debuggen von JavaScript Code.

+ +
+
Firefox Developer Tools
+
Scratchpad, Web-Konsole, JavaScript Profiler, Debugger und weitere.
+
JavaScript Shells
+
Mit einer JavaScript-Shell ermöglicht es schnell und einfach Code-Schnipsel auszuprobieren.
+
TogetherJS
+
+

Zusammenarbeit einfach gemacht. Wenn TogetherJS auf einer Seite hinzugefügt wurde, können sich die Benutzer der Seit in Echtzeit helfen!

+
+
Stack Overflow
+
Stack Overflow Fragen, die mit "JavaScript" markiert sind.
+
JavaScript Versionen und Release Notes
+
Geschichte und Status der Implementierungen von JavaScript Funktionen.
+
JSFiddle
+
Bearbeiten von JavaScript, CSS und HTML und live Ergebnisse sehen. Man kann zudem externe Ressourcen benutzen und mit seinem Team online miteinander arbeiten.
+
Plunker
+
Plunker ist eine online Community zum erstellen, zusammenarbeiten und teilen von Ideen in der Webentwicklung. Man kann JavaScript CSS und HTML Dateien bearbeiten und live Resultate und Dateistrukturen sehen.
+
+
+
diff --git a/files/de/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/de/web/javascript/inheritance_and_the_prototype_chain/index.html new file mode 100644 index 0000000000..bf1ae998ee --- /dev/null +++ b/files/de/web/javascript/inheritance_and_the_prototype_chain/index.html @@ -0,0 +1,300 @@ +--- +title: Vererbung und die Prototypenkette +slug: Web/JavaScript/Inheritance_and_the_prototype_chain +tags: + - Advanced + - Guide + - Inheritance + - JavaScript + - OOP +translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain +--- +
{{jsSidebar("Advanced")}}
+ +

JavaScript mag für Entwickler, die in klassenbasierten Sprachen (wie etwa Java oder C++) Erfahrung haben, etwas verwirrend erscheinen. Der Grund dafür ist, dass JavaScript per se keine class-Implementierung bereitstellt (das class-Schlüsselwort wurde erst mit ES2015 eingeführt. Es ist jedoch syntaktischer Zucker, JavaScript bleibt Prototyp-basiert).

+ +

Wenn es um Vererbung geht, hat JavaScript nur ein Konstrukt anzubieten: Objekte. Jedes Objekt hat eine interne Verbindung zu einem anderen ("älteren") Objekt, welches als sein Prototyp bezeichnet wird. Dieses Prototypobjekt hat selbst einen Prototyp, der wiederum selbst einen Prototyp hat. Dies setzt sich fort, bis ein Objekt erreicht wird, dessen Prototyp null ist. null hat per Definition keinen Prototyp und bildet somit den Abschluß dieser Prototypenkette.

+ +

Dies wird oft als eine der Schwächen von JavaScript betrachtet, jedoch ist das Prototypmodell tatsächlich mächtiger als das klassische OO Modell. Es ist zum Beispiel relativ trivial, ein klassisches OO Modell auf einem Prototypmodell zu realisieren.

+ +

Vererbung mit der Prototypenkette

+ +

Vererbung von Eigenschaften

+ +

Objekte in JavaScript sind dynamische "Behälter" von Eigenschaften, welche auch seine "eigenen Eigenschaften" (own properties) genannt werden. JavaScript-Objekte haben eine Verknüpfung zu einem Prototypobjekt. Beim Versuch auf eine Objekteigenschaft zuzugreifen, wird die Eigenschaft nicht nur in dem Objekt selbst, sondern auch in seinem Prototyp, dem Prototyp des Prototyps, usw. gesucht. Dies wird so lange fortgesetzt, bis eine Eigenschaft mit entsprechendem Namen gefunden wurde oder das Ende der Prototypenkette erreicht ist.

+ +
+

Gemäß des ECMAScript-Standards, wird die Notation someObject.[[Prototype]] verwendet, um den Prototyp von someObject zu bezeichnen. Das ist äquivalent zu der JavaScript-Eigenschaft __proto__ (jetzt veraltet). Dies sollte nicht mit der func.prototype Eigenschaft von Funktionen verwechselt werden, welche stattdessen den [[Prototype]] von allen Instanzen der entsprechenden Funktion spezifiziert. Seit ECMAScript 6 wird auf den [[Prototype]] mit Hilfe der Methoden {{jsxref("Object.getPrototypeOf()")}} und {{jsxref("Object.setPrototypeOf()")}} zugegriffen.

+
+ +

Folgendes passiert bei dem Versuch auf eine Eigenschaft zuzugreifen:

+ +
// Angenommen, wir haben ein Objekt o, mit eigenen Eigenschaften a und b:
+// {a: 1, b: 2}
+// o.[[Prototype]] hat die Eigenschaften b und c:
+// {b: 3, c: 4}
+// Letztendlich ist o.[[Prototype]].[[Prototype]] null.
+// Das ist das Ende der Prototypenkette, wobei null selbst
+// keinen Prototyp mehr besitzt
+// Daher sieht die gesamte Prototypenkette wie folgt aus:
+// {a:1, b:2} ---> {b:3, c:4} ---> null
+
+console.log(o.a); // 1
+// Gibt es eine eigen Eigenschaft 'a' im Objekt o? Ja, und ihr Wert ist 1.
+
+console.log(o.b); // 2
+// Gibt es eine eigene Eigenschaft 'b' im Objekt o? Ja, und ihr Wert ist 2.
+// Sein Prototyp hat auch eine 'b'-Eigenschaft, sie wird jedoch nicht
+// berücksichtigt. Das nennt man "property shadowing"
+
+console.log(o.c); // 4
+// Gibt es eine eigene Eigenschaft 'c' im Objekt o?
+// Nein, schaue im Prototyp.
+// Gibt es eine eigene Eigenschaft 'c' in o.[[Prototype]]? Ja, ihr Wert ist 4.
+
+console.log(o.d); // undefined
+// Gibt es eine eigene Eigenschaft 'd' im Objekt o? Nein, schaue im Prototyp!
+// Gibt es eine eigene Eigenschaft 'd' in o.[[Prototype]]? Nein, schaue im Prototyp!
+// o.[[Prototype]].[[Prototype]] ist null, Ende der Suche.
+// Keine Eigenschaft gefunden. Es wird undefined zurückgegeben.
+
+
+ +

Das Hinzufügen einer Eigenschaft zu einem Objekt erzeugt eine dem Objekt eigene Eigenschaft. Die einzige Ausnahme zu den beschriebenen Regeln beim Setzen und Abrufen von Eigenschaften besteht, wenn eine geerbte Eigenschaft mit einem Getter oder Setter existiert.

+ +

Vererben von "Methoden"

+ +

JavaScript hat keine "Methoden" wie diese bei Klassen-basierten Sprachen definiert werden. In JavaScript kann jede Funktion als eine normale Eigenschaft zu einem Objekt hinzugefügt werden. Eine vererbte Funktion verhält sich demnach genau wie jede andere Eigenschaft, inklusive "property shadowing" wie oben gezeigt (in diesem Fall ist das eine Art der Überschreibung von Methoden).

+ +

Wenn eine vererbte Funktion ausgeführt wird, zeigt der Wert von this zum erbenden Objekt und nicht zu dessen Prototyp, in dem diese Funktion eine eigene Eigenschaft (own property) ist.

+ +
var o = {
+  a: 2,
+  m: function(b){
+    return this.a + 1;
+  }
+};
+
+console.log(o.m()); // 3
+// Beim Aufruf von o.m referenziert 'this' hier das Objekt o.
+
+var p = Object.create(o);
+// p ist ein Objekt, welches von o erbt.
+
+p.a = 4; // erzeugt ein Eigenschaft 'a' in p
+console.log(p.m()); // 5
+// Wird p.m aufgerufen, referenziert 'this' hier das Objekt p.
+// Wenn also p die Funktion m von o erbt,
+// 'this.a' referenziert p.a, der Eigenschaft 'a' in p.
+
+ +

Verschiedene Wege, Objekte zu erzeugen und die resultierende Prototypenkette

+ +

Objekte mit Syntax Konstrukten erzeugen

+ +
var o = {a: 1};
+
+// Das erzeugte Objekt o hat Object.prototype als seinen [[Prototype]]
+// o hat keine eigene Eigenschaft namens 'hasOwnProperty'.
+// hasOwnProperty ist eine eigene Eigenschaft von Object.prototype.
+// Objekt o erbt hasOwnProperty von Object.prototype,
+// Object.prototype wiederum hat null als Prototyp:
+// o ---> Object.prototype ---> null
+
+var a = ["yo", "whadup", "?"];
+
+// Arrays erben von Array.prototype
+// (der Methoden wie indexOf, forEach, etc. hat)
+// Die Prototypenkette sieht also so aus:
+// a ---> Array.prototype ---> Object.prototype ---> null
+
+function f(){
+  return 2;
+}
+
+// Functionen erben von Function.prototype
+// (der Methoden wie call, bind, etc. enthält):
+// f ---> Function.prototype ---> Object.prototype ---> null
+
+ +

Mittels Constructor

+ +

Ein "constructor" ist in JavaScript lediglich eine Funktion, die mit dem new Operator aufgerufen wird.

+ +
function Graph() {
+  this.vertices = [];
+  this.edges = [];
+}
+
+Graph.prototype = {
+  addVertex: function(v){
+    this.vertices.push(v);
+  }
+};
+
+var g = new Graph();
+// g ist ein Objekt mit eigenen Eigenschaften 'vertices' und 'edges'.
+// g.[[Prototype]] ist der Wert von Graph.prototype, wenn new Graph() ausgeführt wird.
+
+ +

Mit Object.create

+ +

ECMAScript 5 führte eine neue Methode ein: {{jsxref("Object.create()")}}. Der Aufruf dieser Methode erzeugt ein neues Objekt. Der erste Parameter dieser Methode ist der Prototyp des neu erzeugten Objekts:

+ +
var a = {a: 1};
+// a ---> Object.prototype ---> null
+
+var b = Object.create(a);
+// b ---> a ---> Object.prototype ---> null
+console.log(b.a); // 1 (vererbt)
+
+var c = Object.create(b);
+// c ---> b ---> a ---> Object.prototype ---> null
+
+var d = Object.create(null);
+// d ---> null
+console.log(d.hasOwnProperty);
+// undefined, denn d erbte nicht von Object.prototype
+
+ +
+

Mit dem class Schlüsselwort

+ +

ECMAScript 6 führt einige neue Schlüsselwörter ein, um Klassen zu implementieren. Obwohl diese Konstrukte aussehen wie die, die Entwicklern aus Klassen-basierten Sprachen bekannt sind, verhalten sie sich doch anders. JavaScript bleibt Prototyp-basiert. Zu den neuen Schlüsselwörtern gehören {{jsxref("Statements/class", "class")}}, {{jsxref("Classes/constructor", "constructor")}}, {{jsxref("Classes/static", "static")}}, {{jsxref("Classes/extends", "extends")}}, und {{jsxref("Operators/super", "super")}}.

+ +
"use strict";
+
+class Polygon {
+  constructor(height, width) {
+    this.height = height;
+    this.width = width;
+  }
+}
+
+class Square extends Polygon {
+  constructor(sideLength) {
+    super(sideLength, sideLength);
+  }
+  get area() {
+    return this.height * this.width;
+  }
+  set sideLength(newLength) {
+    this.height = newLength;
+    this.width = newLength;
+  }
+}
+
+var square = new Square(2);
+
+ +

Performance

+ +

Der Zugriff auf Eigenschaften, die sich weit oben in der Prototypenkette befinden, kann negativen Einfluss auf die Performance haben. Dies kann in Performance-kritischen Situationen zu Problemen führen. Hinzu kommt, dass beim Versuch, auf nicht existierende Eigenschaften zuzugreifen, immer die gesamte Prototypenkette durchlaufen wird.

+ +

Beim Iterieren über die Eigenschaften von Objekten wird über jede aufzählbare Eigenschaft iteriert, die auf der Prototypenkette vorkommt.

+ +

Um zu prüfen, ob ein Objekt eine Eigenschaft an sich selbst definiert hat (own property) und nicht von der Prototypenkette geerbt hat, muss die Funktion hasOwnProperty benutzt werden, die alle Objekte vom Object.prototype erben.

+ +

hasOwnProperty ist das einzige Konstrukt in JavaScript das beim Umgang mit Eigenschaften von Objekten nicht die Prototypenkette durchläuft.

+ +

Hinweis: Es reicht nicht aus, zu prüfen, ob eine Eigenschaft undefined ist, um deren Existenz zu pfüfen. Die Eigenschaft könnte durchaus existieren, aber ihr aktueller Wert könnte aktuell explizit auf undefined gesetzt worden sein.

+
+ +

Bad practice: Erweiterung von nativen Prototypen

+ +

Ein oft anzutreffendes "Feature" ist es, den Object.prototype oder einen anderen eingebauten Prototypen zu erweitern.

+ +

Diese Technik, die als "monkey patching" bezeichnet wird, zerstört die Kapselung. Auch wenn diese Technik in populären Frameworks wie Prototype.js benutzt wird, gibt es dennoch keinen guten Grund dafür, die eingebauten Prototypen mit zuätzlicher, nicht-standard Funktionalität anzureichern.

+ +

Der einzige gute Grund für die Erweiterung von eingebauten Prototypen ist es, Features neuerer JavaScript Engines zurück zu portieren, beipielsweise Array.forEach, etc.

+ +

Beispiel

+ +

B soll erben von A:

+ +
function A(a){
+  this.varA = a;
+}
+
+// Was ist der Sinn darin, varA in den Prototyp aufzunehmen, wenn A.prototype.varA immer überschrieben wird von
+// this.varA, vorausgesetzt Funktion A wird wie oben gezeigt definiert?
+A.prototype = {
+  varA : null,  // Sollte varA nicht vom Prototyp entfernt werden, da nicht benötigt wird?
+      // Vielleicht ist es eine Optimierung, um den Platz in versteckten Klassen zu allozieren?
+      // https://developers.google.com/speed/articles/optimizing-javascript#initializing-instance-variables
+      // wäre ein valides Argument, wenn varA nicht individuell für jede Instanz initialisiert würde
+  doSomething : function(){
+    // ...
+  }
+}
+
+function B(a, b){
+  A.call(this, a);
+  this.varB = b;
+}
+B.prototype = Object.create(A.prototype, {
+  varB : {
+    value: null,
+    enumerable: true,
+    configurable: true,
+    writable: true
+  },
+  doSomething : {
+    value: function(){ // override
+      A.prototype.doSomething.apply(this, arguments); // call super
+      // ...
+    },
+    enumerable: true,
+    configurable: true,
+    writable: true
+  }
+});
+B.prototype.constructor = B;
+
+var b = new B();
+b.doSomething();
+
+ +

Die wichtigsten Stellen hier sind:

+ + + +

prototype und Object.getPrototypeOf

+ +

JavaScript kann etwas verwirrend sein für Entwickler, die aus der Java- oder C++ Welt kommen, da es komplett dynamisch ist, alles zur Laufzeit passiert und es keine Klassen hat. Alles dreht sich um Instanzen (Objekte). Sogar die "Klassen", die wir simulieren sind nur Funktions-Objekte.

+ +

Wahrscheinlich hast Du bereits erkannt, dass unsere function A eine spezielle Eigenschaft namens prototype hat. Diese spezielle Eigenschaft agiert mit dem JavaScript new operator. Die Referenz des Prototypobjektes wird dabei in die interne [[Prototype]] Eigenschaft der neu erzeugten Instanz kopiert. Wenn man beispielsweise var a1 = new A() ausführt, setzt JavaScript (nachdem das Objekt im Speicher erzeugt und ehe function A() - mit this auf das neue Objekt definiert - ausgeführt wurde) a1.[[Prototype]] = A.prototype. Wenn dann auf Eigenschaften der Instanz zugegriffen wird, prüft JavaScript zuerst, ob diese an der Instanz existieren ehe es in [[Prototype]] danach schaut. Das heisst, das alles, was an der prototype Eigenschaft definiert wird, in allen Instanzen verfügbar ist. Die Eigenschaften in prototype könnten sogar später geändert werden und wären somit in allen existierenden Instanzen geändert.

+ +

Wenn man im Beispiel von oben also var a1 = new A(); var a2 = new A(); schreibt, dann würde a1.doSomething eigentlich auf Object.getPrototypeOf(a1).doSomething referenzieren, welches identisch ist mit A.prototype.doSomething, das am Anfang definiert wurde. Somit ist: Object.getPrototypeOf(a1).doSomething == Object.getPrototypeOf(a2).doSomething == A.prototype.doSomething.

+ +

Kurz gesagt ist prototype für Typen gedacht, während Object.getPrototypeOf() für alle Instanzen das Gleiche ist.

+ +

[[Prototype]] wird rekursiv durchlaufen, das heisst:
+ a1.doSomething,
+ Object.getPrototypeOf(a1).doSomething, Object.getPrototypeOf(Object.getPrototypeOf(a1)).doSomething
+ etc., bis es gefunden wurde oder Object.getPrototypeOf null zurück gibt.

+ +

Wenn man also folgendes aufruft:

+ +
var o = new Foo();
+ +

... macht JavaScript eigentlich dies:

+ +
var o = new Object();
+o.[[Prototype]] = Foo.prototype;
+Foo.call(o);
+ +

(oder ähnlich) und wenn man danach Folgendes aufruft:

+ +
o.someProp;
+ +

wird geprüft, ob o eine Eigenschaft namens someProp hat. Falls nicht, wird nach Object.getPrototypeOf(o).someProp gesucht und wenn dies auch nicht existiert, dann in Object.getPrototypeOf(Object.getPrototypeOf(o)).someProp und so weiter.

+ +
+

Zusammenfassung

+ +

Es ist essentiell das Modell der Prototypischen Vererbung zu verstehen ehe man komplexen Code schreibt, der darauf aufbaut. Man sollte sich außerdem über die Länge der Prototypenkette im Klaren sein und diese ggf. stückeln, um Performance-Problemen vorzubeugen. Außerdem sollten die eingebauten Prototypen niemals erweitert werden, außer es dient der Kompatibilitär mit neueren JavaScript-Features.

+
diff --git a/files/de/web/javascript/introduction_to_object-oriented_javascript/index.html b/files/de/web/javascript/introduction_to_object-oriented_javascript/index.html new file mode 100644 index 0000000000..c59918ea22 --- /dev/null +++ b/files/de/web/javascript/introduction_to_object-oriented_javascript/index.html @@ -0,0 +1,389 @@ +--- +title: Einführung in objektorientiertes JavaScript +slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript +tags: + - Constructor + - Encapsulation + - Inheritance + - Intermediate + - JavaScript + - Members + - Namespace + - OOP + - Object + - Object-Oriented +translation_of: Learn/JavaScript/Objects +--- +
{{jsSidebar("Introductory")}}
+ +

Im Kern ist JavaScript eine objektorientierte Programmiersprache mit mächtigen und flexiblen Fähigkeiten der {{Glossary("OOP")}}. Dieser Artikel beginnt mit einer Einführung in die objektorientierte Programmierung. Im zweiten Teil wird das Objektmodel von JavaScript erläutert. Danach folgt eine praktische Vorstellung der objektorientierten Programmierung in JavaScript. Dieser Artikel beschreibt nicht die neuere Syntax für {{jsxref("Classes", "objektorientierte Programmierung in ECMAScript 6", "", 1)}}.

+ +

JavaScript Review

+ +

Wenn Sie nicht mit den Konzepten in JavaScript, wie zum Beispiel Variablen, Typen, Funktionen und Geltungsbereich, vertraut sind, lesen Sie bitte zuerst den Artikel Eine Wiedereinführung in JavaScript. Sie können ebenfalls auf den JavaScript Guide zurückgreifen.

+ +

Objektorientierte Programmierung

+ +

Die objektorientierte Programmierung ist ein Paradigma, in dem über Abstraktion Modelle basierend auf der realen Welt erstellt werden. Es verwendet Techniken, die von zuvor etablierten Paradigmen eingeführt wurden. Darunter befinden sich Modularität, Polymorphismus und Datenkapselung. Heutzutage unterstützen viele populäre Programmiersprachen (z.B.: Java, JavaScript, C#, C++, Python, PHP, Ruby und Objective-C) die objektorientierte Programmierung (OOP).

+ +

Objektorientierte Programmierung kann als das Design einer Software unter der Verwendung von kooperierenden Objekten angesehen werden. Die traditionelle Ansicht dagegen sieht ein Programm als eine Menge von Funktionen oder noch einfacher als eine Abfolge von Instruktionen an den Computer. In der OOP kann jedes Objekt Nachrichten empfangen, Daten verarbeiten und Nachrichten an andere Objekte senden. Jedes Objekt kann als eine unabhängige kleine Maschine mit einer bestimmten Rolle oder Verantwortlichkeit angesehen werden.

+ +

Die Objektorientierte Programmierung versucht höhere Flexibilität und Wartbarkeit in Programmen zu ermöglichen und wird deshalb oft beim Software Engineering von hochskalierenden Programmen eingesetzt. Durch die starke Konzentration auf Modularität hat objektorientierter Code den Vorteil, dass er einfacher zu entwickeln und zu verstehen ist. Sie konzentriert sich direkter auf die Analyse, die Codierung und das Verstehen von komplexen Situationen und Prozeduren als weniger modulare Programmiermethoden.1

+ +

Begriffsdefinitionen

+ +
+
{{Glossary("Namespace")}}
+
Ein Container, der Entwicklern die Bündelung von Funktionalität unter einem eindeutigen, applikationsspezifischen Namen ermöglicht.
+
{{Glossary("Klasse")}}
+
Definiert die Eigenschaften eines Objekts. Sie ist die Definition einer Vorlage von Variablen und Methoden eines Objekts.
+
{{Glossary("Objekt")}}
+
Eine Instanz einer Klasse.
+
{{Glossary("Eigenschaft")}}
+
Eine Eigenschaft eines Objekts, wie zum Beispiel eine Farbe.
+
{{Glossary("Methode")}}
+
Eine Fähigkeit eines Objekts, wie zum Beispiel laufen. Sie ist eine Unterroutine oder Funktion, die mit der Klasse assoziiert ist.
+
{{Glossary("Konstruktor")}}
+
Eine spezielle Methode, die zur Instanziierung eines Objekts aufgerufen wird. Sie hat gewöhnlicherweise denselben Namen wie die Klasse, zu der sie gehört.
+
{{Glossary("Vererbung")}}
+
Eine Klasse kann die Eigenschaften und Fähigkeiten von anderen Klassen erben und somit für sich verwenden.
+
{{Glossary("Datenkapselung")}}
+
Die Datenkapselung ist eine Technik, um die Daten und die Methoden, die diese Daten verwenden, miteinander zu bündeln.
+
{{Glossary("Abstraktion")}}
+
Die Verknüpfung von komplexer Vererbung, Methoden und Eigenschaften eines Objekts müssen ein Modell der Realität simulieren können.
+
{{Glossary("Polymorphismus")}}
+
Poly bedeute "viele"  und Morphismus bedeutet "Formen". Verschiedene Klassen können dieselbe Methode oder dieselbe Eigenschaft definieren.
+
+ +

Lesen Sie bitte den Artikel {{interwiki("wikipedia", "Objektorientierte Programmierung")}} auf Wikipedia für eine umfassendere Beschreibung der objektorientierten Programmierung.

+ +

Prototypenbasierte Programmierung

+ +

Prototypenbasierte Programmierung ist eine Art der objektorientierten Programmierung bei der keine Klassen gegenwärtig sind. Die Wiederverwendung von Verhalten (bekannt als Vererbung in klassenbasierten Programmiersprachen) wird über das Dekorieren von existierenden Objekten erreicht, die als Prototyp dienen. Dieses Modell wird als klassenlose, prototyporientierte oder instanzorientierte Programmierung bezeichnet.

+ +

Das ursprüngliche (und am meisten kanonische) Beispiel einer prototypenbasierten Programmiersprache ist {{interwiki("wikipedia", "Self (Programmiersprache)")}}, welche von David Ungar and Randall Smith entwickelt wurde. Seitdem wurde die klassenlose Programmierung immer mehr populär und wurde für andere Programmiersprachen wie JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (wenn das Viewer Framework zur Manipulation von Morphic Komponenten verwendet wird) und einige andere adoptiert.2

+ +

Objektorientierte Programmierung mit JavaScript

+ +

Namespace

+ +

Ein Namespace ist ein Container in dem Entwickler Funktionalitäten unter einem eindeutigen, applikationsspezifischen Namen zusammenfassen können. In JavaScript ist ein Namespace ein gewöhnliches Objekt, welches Methoden, Eigenschaften und Objekte enthält.

+ +
+

Im Gegensatz zu manchen anderen objektorientierten Programmiersprachen gibt es in der Sprachebene von JavaScript keinen Unterschied zwischen einem regulären Objekt und einem Namespace.

+
+ +

Die Idee hinter der Erstellung eines Namespaces in JavaScript ist simpel: es wird ein globales Objekt erstellt, welches alle Variablen, Methoden und Funktionen als Eigenschaften besitzt. Zusätzlich kann die Verwendung von Namespaces Namenskonflikten in der Applikation vorbeugen.

+ +

Es wird ein globales Objekt names MYAPP erstellt:

+ +
// global namespace
+var MYAPP = MYAPP || {};
+ +

Im obigen Code wird zuerst geprüft, ob MYAPP bereits definiert wurde (entweder in derselben oder einer anderen Datei). Wenn MYAPP bereits definiert wurde, wird das globale Objekt MYAPP verwendet. Anderenfalls wird ein leeres Objekt names MYAPP erstellt, welches später Methoden, Funktionen, Variablen und andere Objekte kapseln kann.

+ +

Innerhalb eines Namespaces können weitere Namespaces erstellt werden:

+ +
// sub namespace
+MYAPP.event = {};
+ +

Der folgende Code erstellt einen Namespace und fügt diesem Variablen, Funktionen und Methoden hinzu:

+ +
// Create container called MYAPP.commonMethod for common method and properties
+MYAPP.commonMethod = {
+  regExForName: "", // define regex for name validation
+  regExForPhone: "", // define regex for phone no validation
+  validateName: function(name){
+    // Do something with name, you can access regExForName variable
+    // using "this.regExForName"
+  },
+
+  validatePhoneNo: function(phoneNo){
+    // do something with phone number
+  }
+}
+
+// Object together with the method declarations
+MYAPP.event = {
+    addListener: function(el, type, fn) {
+    //  code stuff
+    },
+   removeListener: function(el, type, fn) {
+    // code stuff
+   },
+   getEvent: function(e) {
+   // code stuff
+   }
+
+   // Can add another method and properties
+}
+
+//Syntax for Using addListner method:
+MYAPP.event.addListener("yourel", "type", callback);
+ +

Standardmäßig eingebaute Objekte

+ +

JavaScript besitzt verschiedene Objekte im Kern. Darunter befinden sich zum Beispiel die Objekte Math, Object, Array, und String. Das folgende Beispiel zeigt, wie das Math Objekt mit der random() Methode eine Zufallszahl generiert.

+ +
console.log(Math.random());
+
+ +
Hinweis: Dieses und folgende Beispiele setzen voraus, dass {{domxref("console.log()")}} global definiert wurde. Die console.log Funktion ist kein eigentlicher Sprachteil von JavaScript, jedoch implementieren viele Browser diese zum Debuggen.
+ +

Siehe JavaScript Reference: Standard built-in objects für eine List aller Objekte im Kern von JavaScript.

+ +

Jedes Objekt in JavaScript ist eine Instanz des Objekts Object und erbt somit alle Eigenschaften und Methoden von diesem.

+ +

Eigene Objekte

+ +

Die Klasse

+ +

JavaScript ist eine prototypenbasierte Programmiersprache, welche im Gegensatz zu C++ oder Java keine class Anweisung enthält. Dies kann für Programmierer manchmal verwirrend sein, wenn sie normalerweise Programmiersprachen mit einer class Anweisung verwenden. JavaScript verwendet stattdessen Funktionen als Klassen. Die Definition einer Klasse erfolgt analog zu der einer Funktion. Im folgenden Beispiel wird eine neue Klasse namens Person definiert.

+ +
var Person = function(){ }
+
+ +

Das Objekt (Instanz einer Klasse)

+ +

Um eine neue Instanz eines Objekts obj zu erstellen, wird die Anweisung new obj ausgeführt. Das Ergebnis der Anweisung (welches den Typ obj hat) wird für eine spätere Verwendung einer Variablen zugewiesen.

+ +

Im folgenden Beispiel wird eine Klasse mit dem Namen Person definiert und zwei Objekte (person1 and person2) instanziiert.

+ +
var person1 = new Person();
+var person2 = new Person();
+
+ +
Lesen Sie bitte {{jsxref("Object.create()")}} für eine neue, alternative Methode zur Objektinstanziierung.
+ +

Der Konstruktor

+ +

Der Konstruktor wird zum Zeitpunkt der Instanziierung (wenn eine Objektinstanz erstellt wird) aufgerufen. Er ist als eine Methode der Klasse definiert. In JavaScript agiert die Funktion als Konstruktor für das Objekt. Somit muss keine Methode explizit für den Konstruktor definiert werden. Jede deklarierte Anweisung in der Klasse wird zum Zeitpunkt der Instanziierung ausgeführt.

+ +

Der Konstruktor wird zur Initialisierung der Eigenschaften oder vorbereitende Methodenaufrufe zur Verwendung des Objekts verwendet. Das Hinzufügen von Klassenmethoden und deren Definitionen verwendet eine andere Syntax, welche später im Artikel erläutert wird.

+ +

Im folgenden Beispiel loggt der Konstruktor der Klasse Person eine Nachricht, wenn ein Person Objekt instanziiert wird.

+ +
function Person() {
+  console.log('Instanz erstellt');
+}
+
+var person1 = new Person();
+var person2 = new Person();
+
+ +

Die Eigenschaft (Objektattribut)

+ +

Eigenschaften sind Variablen innerhalb einer Klasse. Jede Instanz des Objekts besitzt diese Eigenschaften. Eigenschaften sollten im Prototyp der Eigenschaft in der Klasse (Funktion) gesetzt werden, damit die Vererbung korrekt funktioniert.

+ +

Eigenschaften können innerhalb eines Objekts mit dem Schlüsselwort this, welches das aktuelle Objekt referenziert, verwendet werden. Der Zugriff (lesen oder schreiben) auf eine Eigenschaft von außerhalb der Klasse wird durch die Syntax InstanceName.Property ermöglicht. Diese Syntax ist analog zu C++, Java und zahlreichen anderen Programmiersprachen. Innerhalb der Klasse wird die Syntax this.Property zum Lesen oder Schreiben des Werts verwendet.

+ +

Im folgenden Beispiel wird die Eigenschaft firstName für die Person Klasse definiert. Bei der Instanziierung wird ihr ein Wert zugewiesen.

+ +
function Person(firstName) {
+  this.firstName = firstName;
+  console.log('Person instantiated');
+}
+
+var person1 = new Person('Alice');
+var person2 = new Person('Bob');
+
+// Zeigt die Eigenschaft firstName des Objektes
+console.log('person1 is ' + person1.firstName); // logs "person1 is Alice"
+console.log('person2 is ' + person2.firstName); // logs "person2 is Bob"
+
+ +

Die Methoden

+ +

Methoden befolgen beinahe dieselbe Logik wie Eigenschaften mit dem Unterschied, dass sie Funktionen sind und deshalb als Funktionen definiert werden. Der Aufruf einer Funktion erfolgt analog zu Eigenschaften gefolgt von () am Ende des Methodennames. Innerhalb der Klammern können der Methode Argumente übergeben werden. Um eine Methode zu definieren, muss eine Funktion einer benannten Eigenschaft der prototype Eigenschaft der Klasse zugewiesen werden. Der Name der benannten Eigenschaft dient nun als Methodenname über den die Methode auf dem Objekt aufgerufen werden kann.

+ +

Im folgenden Beispiel wird die Methode sayHello() für die Person Klasse definiert.

+ +
function Person(firstName) {
+  this.firstName = firstName;
+}
+
+Person.prototype.sayHello = function() {
+  console.log("Hello, I'm " + this.firstName);
+};
+
+var person1 = new Person("Alice");
+var person2 = new Person("Bob");
+
+// Aufrufen der Methode sayHello der Person.
+person1.sayHello(); // logs "Hello, I'm Alice"
+person2.sayHello(); // logs "Hello, I'm Bob"
+
+ +

Methoden in JavaScript sind gewöhnliche Funktionsobjekte, die als eine Eigenschaft an ein Objekt gebunden werden. Dadurch können Methoden auch "außerhalb des Kontexts" aufgerufen werden. Das folgende Beispiel veranschaulicht dies:

+ +
function Person(firstName) {
+  this.firstName = firstName;
+}
+
+Person.prototype.sayHello = function() {
+  console.log("Hello, I'm " + this.firstName);
+};
+
+var person1 = new Person("Alice");
+var person2 = new Person("Bob");
+var helloFunction = person1.sayHello;
+
+// logs "Hello, I'm Alice"
+person1.sayHello();
+
+// logs "Hello, I'm Bob"
+person2.sayHello();
+
+// logs "Hello, I'm undefined" (oder schlägt
+// mit einem TypeError im strict mode fehl)
+helloFunction();
+
+// logs true
+console.log(helloFunction === person1.sayHello);
+
+// logs true
+console.log(helloFunction === Person.prototype.sayHello);
+
+// logs "Hello, I'm Alice"
+helloFunction.call(person1);
+ +

Das Beispiel zeigt, dass alle Referenzen zur sayHello Funktion — die auf person1, auf Person.prototype, in der helloFunction Variable, etc. — dieselbe Funktion referenzieren. Der Wert von this während eines Funktionsaufrufs hängt von der Art ab, wie die Funktion aufgerufen wird. In allgemeinen Fällen, wenn die Funktion in einem Ausdruck  über die Eigenschaft aufgerufen wird — person1.sayHello() — referenziert this das Objekt, auf der die Funktion aufgerufen wird (person1). Deshalb verwendet person1.sayHello() den Namen "Alice" und person2.sayHello() den Namen "Bob". Wenn die Funktion über andere Arten aufgerufen wird, ist this unterschiedlich definiert: Der Aufruf von der Variablen aus — helloFunction() — setzt this auf das globale Objekt (window, in Webbbrowsern). Da dieses Objekt (wahrscheinlich) keine firstName Eigenschaft besitzt, gitb die Funktion "Hello, I'm undefined" aus. (Dieses Ergebnis wird im Loose Mode produziert. Im Strict Mode verhält sich die Funktion anders und es könnte ein Fehler ausgelöst werden. Um Verwirrungen zu vermeiden wird dies nicht weiter im Detail besprochen) this kann auch explizit über Function#call (oder Function#apply) definiert werden. Die geschieht in der letzten Zeile des obigen Beispiels.

+ +
Hinweis: Mehr über this können Sie unter Function#call und Function#apply finden.
+ +

Vererbung

+ +

Vererbung ist eine Methode, um eine Klasse zu erstellen, die eine spezialisierte Version von einer (Einfachvererbung) oder mehrerer (Mehrfachvererbung) Klassen ist (JavaScript unterstützt nur Einfachvererbung). Die spezialisierte Klasse wird normalerweise als child bezeichnet. Die Klasse, von der geerbt wird, wird als parent bezeichnet. Vererbung in JavaScript funktioniert indem eine Instanz der parent Klasse der child Klasse zugewiesen und dann spezialisiert wird. In modernen Webbrowsern kann die Vererbung auch mittels der Verwendung von Object.create implementiert werden.

+ +
Hinweis: JavaScript erkennt den Konstruktor prototype.constructor (siehe Object.prototype) der child Klasse nicht. Er muss manuell angegeben werden. Sehe dazu zusätzlich den Beitrag "Why is it necessary to set the prototype constructor?" (englisch) auf Stackoverflow an.
+ +

Im folgenden Beispiel wird die Klasse Student als child Klasse von Person definiert. Dann wird die Methode sayHello() neu definiert und die Methode sayGoodBye() zur Klasse Person hinzugefügt.

+ +
// Definiert den Person Konstruktor
+function Person(firstName) {
+  this.firstName = firstName;
+}
+
+// Fügt Methoden zum Person.prototype hinzu
+Person.prototype.walk = function(){
+  console.log("I am walking!");
+};
+Person.prototype.sayHello = function(){
+  console.log("Hello, I'm " + this.firstName);
+};
+
+// Definiert den Student Konstruktor
+function Student(firstName, subject) {
+  // Call the parent constructor, making sure (using Function#call)
+  // that "this" is set correctly during the call
+  Person.call(this, firstName);
+
+  // Initialize our Student-specific properties
+  this.subject = subject;
+};
+
+// Erstellt ein Student.prototype Objekt das von Person.prototype erbt.
+// Hinweis: Ein häufiger Fehler ist der Einsatz von "new Person()" beim erstellen vomeines
+// Student.prototype. Das ist falsch aus einigen Gründen, nicht nur
+// das wir keinen Parameter der Person für "firstName" mitgeben können.
+// Der korrekte Ort für den Aufruf von Person ist oben, wo wir es
+// von Student aufrufen.
+Student.prototype = Object.create(Person.prototype); // See note below
+
+// Setzt die "constructor" Eigenschaft um auf Student zu referenzieren.
+Student.prototype.constructor = Student;
+
+// Ersetzt die "sayHello" Methode
+Student.prototype.sayHello = function(){
+  console.log("Hello, I'm " + this.firstName + ". I'm studying "
+              + this.subject + ".");
+};
+
+// Fügt die "sayGoodBye" Methode hinzu
+Student.prototype.sayGoodBye = function(){
+  console.log("Goodbye!");
+};
+
+// Beispieleinsatz:
+var student1 = new Student("Janet", "Applied Physics");
+student1.sayHello();   // "Hello, I'm Janet. I'm studying Applied Physics."
+student1.walk();       // "I am walking!"
+student1.sayGoodBye(); // "Goodbye!"
+
+// Check that instanceof works correctly
+console.log(student1 instanceof Person);  // true
+console.log(student1 instanceof Student); // true
+
+ +

Unter Betrachtung der Zeile Student.prototype = Object.create(Person.prototype);: In älteren JavaScript Engines ohne Object.create, kann ein "polyfill" (auch "shim", siehe den verlinkten Artikel) oder eine Funktion, die dasselbe Ergebnis erzielt, verwendet werden:

+ +
function createObject(proto) {
+    function ctor() { }
+    ctor.prototype = proto;
+    return new ctor();
+}
+
+// Einsatz:
+Student.prototype = createObject(Person.prototype);
+
+ +
Lesen Sie Object.create, um mehr zum obigen Beispiel zu erfahren.
+ +

Stellen sie sicher, dass this zum richtigen Objekt referenziert unabhängig davon, wie das Objekt erstellt wird. Es gibt eine einfache Methode dieses sicherzustellen:

+ +
var Person = function(firstName) {
+  if (this instanceof Person) {
+    this.firstName = firstName
+  } else {
+    return new Person(firstName)
+  }
+}
+ +

Datenkapselung

+ +

Im obigen Beispiel muss die Student Klasse nicht wissen, wie die Methode walk() der Person Klasse implementiert ist, um sie verwenden zu können. Die Student Klasse muss die Methode nicht explizit definierten, solange Sie unverändert übernommen werden soll. Dabei handelt es sich um Datenkapselung, bei der jede Klasse ihre Daten und Methoden in einer Einheit bündeln.

+ +

Information Hiding ist ein gängiges Feature in anderen Programmiersprachen, bei dem Methoden und Eigenschaften als privat oder geschützt definierten werden können. Obwohl Information Hiding mit JavaScript realisiert werden kann, ist es keine Voraussetzung für objektorientierte Programmierung.3

+ +

Abstraktion

+ +

Abstraktion ist ein Mechanismus, der die Modellierung eines Teils der Problemstellung erlaubt. Dazu kann Vererbung (Spezialisierung) oder Komposition eingesetzt werden. JavaScript ermöglicht die Spezialisierung mit Vererbung. Komposition wird realiseirt, indem Instanzen einer Klasse als Werte von Eigenschaften eines Objekts gesetzt werden.

+ +

Die Function Klasse in JavaScript erbt von der Object Klasse (Spezialisierung). Die Function.prototype Eigenschaft ist eine Instanz der Object Klasse (Komposition).

+ +
var foo = function(){};
+
+// logs "foo is a Function: true"
+console.log('foo is a Function: ' + (foo instanceof Function));
+
+// logs "foo.prototype is an Object: true"
+console.log('foo.prototype is an Object: ' + (foo.prototype instanceof Object));
+ +

Polymorphismus

+ +

Wie alle Methoden und Eigenschaften innerhalb der prototype Eigenschaft definiert werden, können unterschiedliche Klassen Methoden mit demselben Namen definieren. Methoden sind im Scope der Klasse, in der sie definiert sind, verfügbar. Das gilt solange die Klassen keine parent-child Beziehung besitzen (wenn die eine Klasse nicht innerhalb einer Kette von der anderen Klasse erbt).

+ +

Anmerkungen

+ +

Die im Artikel präsentierten Techniken umfassen nicht alle Möglichkeiten der objektorientierten Programmierung in JavaScript, da JavaScript sehr flexibel in der Umsetzung der objektorientierten Programmierung ist.

+ +

Die vorgestellten Techniken zeigen nicht alle verfügbaren Hacks in JavaScript und mimen nicht die Implementierung der Objektorientiertheit in anderen Programmiersprachen.

+ +

Es gibt weitere Techniken, welche eine fortgeschrittenere objektorientierte Programmierung in JavaScript ermöglichen. Diese gehen aber über den Umfang dieses einführenden Artikels hinaus.

+ +

Referenzen

+ +
    +
  1. Wikipedia. "Object-oriented programming" und "Objektorientierte Programmierung"
  2. +
  3. Wikipedia. "Prototype-based programming" und "Prototypenbasierte Programmierung"
  4. +
  5. Wikipedia. "Encapsulation (object-oriented programming)" und "Datenkapselung (Programmierung)"
  6. +
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/javascript_technologieuebersicht/index.html b/files/de/web/javascript/javascript_technologieuebersicht/index.html new file mode 100644 index 0000000000..ae24cb1ca3 --- /dev/null +++ b/files/de/web/javascript/javascript_technologieuebersicht/index.html @@ -0,0 +1,87 @@ +--- +title: JavaScript Technologieübersicht +slug: Web/JavaScript/JavaScript_technologieuebersicht +translation_of: Web/JavaScript/JavaScript_technologies_overview +--- +
{{JsSidebar("Introductory")}}
+ +

Einleitung

+ +

Während HTML die Struktur einer Webseite definiert und CSS den Style angibt, mit dem der Inhalt der Webseite dargestellt wird, ermöglicht JavaScript das Erstellen von interaktiven Webseiten und Rich Web Applications.

+ +

Der Begriff "JavaScript" umfasst im Kontext von Web-Browsern mehrere Elemente. Darunter befinden sich der Sprachkern (ECMAScript) und einige Web APIs, die auch das DOM (Document Object Model) enthalten.

+ +

Sprachkern von JavaScript (ECMAScript)

+ +

Der Sprachkern von JavaScript wurde vom ECMA TC39 Kommittee als die Sprache ECMAScript standardisiert. Die aktuellste Version der Spezifikation ist ECMAScript 5.1.

+ +

Der Sprachkern wird auch in Umgebungen außerhalb von Webbrowsern eingesetzt, wie zum Beispiel in node.js.

+ +

Was gehört alles zu ECMAScript?

+ +

Neben anderen Dingen definiert ECMAScript folgende Punkte:

+ + + +

Webbrowserunterstützung

+ +

Im August 2014 implementierten die aktuellen Versionen der verbreitesten Webbrowser ECMAScript 5.1. Es sind aber noch ältere Versionen in Verwendung, welche ECMAScript 3 und nur Teile von ECMAScript 5 implementieren. Moderne Webbrowsers implementieren bereits große Teile von ECMAScript 6.

+ +

Zukunft

+ +

Die vorgeschlagene vierte Version von ECMA-262 (ECMAScript 4 oder ES4) hätte das erste große Update von ECMAScript seit der dritten Version, welche in 1999 veröffentlicht wurde, sein sollen. Im August 2008 wurde der Vorschlag zur vierten Version von ECMAScript  unter dem Projekt ECMAScript Harmony reduziert, welches zum Beispiel Proxies oder das const Schlüsselwort definiert. Der Fortschirtt kann hier verfolgt werden. Die Veröffentlichung der sechsten Hauptversion des Standards wird im Jahr 2015 erwartet.

+ +

Internationalization API

+ +

Die ECMAScript Internationalization API Specification ist eine Erweiterung zur ECMAScript Sprachspezifikation, welche vom Ecma TC39 Kommittee standardisiert wird. Die Internationalization API bietet Textvergleiche (string Vergleiche), Formatierung von Zahlen, Datum und Zeit für JavaScript Applikationen, und lässt Applikationen die Sprache wählen, um die Funktionalität für die eigenen Bedürfnisse anpassen zu können. Der Standard wurde im Dezember 2012 freigegeben. Der Status über die Implementierung in Webbrowsern ist in der Documentation von Intl object aufgezeichnet.

+ +

Die Web APIs und der DOM

+ +

WebIDL

+ +

Die WebIDL specification verbindet die DOM Technologien und ECMAScript miteinander.

+ +

Der Kern des DOM

+ +

Das Document Object Model (DOM) ist eine plattform- und sprachunabhängige Konvention zur Repräsentation und Interaktion mit Objekten in HTML, XHTML und XML Dokumenten. Objekte im DOM Baum können über Methoden angesprochen und durch Aufrufen ihrer Methoden verändert werden. Das Core Document Object Model ist von der W3C standardisiert worden. Es definiert sprachspezifische Schnittstellen, welche HTML und XML Dokuments als Objekte abstrahieren und Mechanismen zur Manipulation dieser Abstraktion. Zusätzlich definiert der DOM auch:

+ + + +

Aus der Sicht von ECMAScript werden Objekte, die in der DOM Spezifikation definiert sind,  "host objects" genannt.

+ +

HTML DOM

+ +

HTML, die Markup-Sprache im Web, ist mit Bezug auf den DOM definiert. HTML liegt eine Schicht über den abstrakten Konzepten vom DOM Kern und definiert zusätzlich die Bedeutung von Elementen. Der HTML DOM beinhaltet zum Beispiel die className Eigenschaft von HTML Elementen oder APIs wie {{ domxref("document.body") }}.

+ +

Die HTML Spezifikation definiert auch Einschränkungen auf Documenten. So müssen zum Beispiel die direkten Kindelemente der ungeordneten Liste ul alle li Elemente sein, welche die Listeneinträge repräsentieren. Im Allgemeinen verbietet die Spezifikation auch die Verwendung von Elementen und Attributen, die nicht im Standard definiert sind.

+ +

Suchen Sie nach dem Document Objekt, Window Objekt, oder anderen DOM Elementen? Besuchen Sie die DOM Dokumentation.

+ +

Andere APIs

+ + + +

Webbrowserunterstützung

+ +

Jeder Webbrowser muss erfahren, dass der DOM ein Chaos ist. Die Einheitlichkeit der Webbrowserunterstützung variiert teilweise stark von Feature zu Feature. Die Ursache dafür ist, dass viele der wichtigen DOM Features kaum oder unklare Spezifikationen hatten. Zusätzlich implementieren verschiedene Webbrowser eigene inkompatible Features für überlappende Einsatzszenarien (wie das Event Model vom Internet Explorer). Der aktuelle Trend (Stand Juni 2011) ist, das die W3C und teilweise die WHATWG ältere Features detaillierter definieren, damit die Interoperabilität verbessert werden kann. Diesem Trend folgend verbessern Webbbrowser ihre Implementierungen basierend auf den detaillierten Spezifikationen.

+ +

Eine allgemeine aber möglicherweise nicht vollkommen zuverlässiger Ansatz für cross-browser Kompatibilität ist der Einsatz einer JavaScript Bibliothek. Diese Bibliotheken abstrahieren DOM Features und gewährleisten den APIs, dass sie in verschiedenen Webbrowsern einheitlich funktionieren. Einige der meistverbreitesten Frameworks sind jQuery, prototype, und YUI.

diff --git a/files/de/web/javascript/language_resources/index.html b/files/de/web/javascript/language_resources/index.html new file mode 100644 index 0000000000..9e5ef20b13 --- /dev/null +++ b/files/de/web/javascript/language_resources/index.html @@ -0,0 +1,142 @@ +--- +title: JavaScript Sprachressourcen +slug: Web/JavaScript/Language_Resources +tags: + - Advanced + - JavaScript +translation_of: Web/JavaScript/Language_Resources +--- +
{{JsSidebar()}}
+ +

ECMAScript ist eine Skriptsprache, auf dessen Form JavaScript basiert. ECMAScript ist durch die Ecma International standarisiert und entspricht den ECMA-262 und ECMA-402 Spezifikationen. Die folgende ECMAScript Standards wurden genehmigt oder werden gerade bearbeitet:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameLinksDatumBeschreibung
Aktuelle Editionen
ECMA-262 9. EditionArbeitsentwurf, Repository2018ECMAScript 2018 Sprachspezifikation
ECMA-402 5. EditionArbeitsentwurf, Repository2018ECMAScript 2018 Internationalisierungs API Spezifikation
Veraltete/Historische Editionen
ECMA-262PDFJuni 1997ECMAScript: Eine universelle plattformübergreifende Programmiersprache. Das war die erste Version des ECMAScript Standards
ECMA-262 2. EditionPDFAugust 1998ECMAScript Sprachspezifikation. Dieses ist die zweite die zweite Überarbeitung des ECMAScript Standards; auch ISO Standard 16262.
ECMA-262 3. EditionPDFDezember 1999ECMAScript Sprachspezifikation. Dieses ist die dritte Überarbeitung des ECMAScript Standards; entspricht JavaScript 1.5. Siehe auch die Fehlerkorrekturen
ECMA-262 5. EditionPDFDezember 2009ECMAScript Sprachspezifikation. Dieses ist die fünfte Überarbeitung des ECMAScript Standards; Siehe auch die ES5 Fehlerkorrekturen und ECMAScript 5 Unterstützung in Mozilla
ECMA-357PDFJuni 2004ECMAScript für XML (E4X).
+ Siehe auch die E4X Fehlerkorrekturen.
ECMA-262 5.1 EditionPDF, HTMLJuni 2011Diese Version ist voll auf den 3. Edition Internationalen Standard ISO/IEC 16262:2011 ausgerichtet.
+ Sie enthält ES5 Fehlerkorrekturen, keine neuen Funktionen.
ECMA-402 1. EditionPDF, HTMLDezember 2012ECMAScript Internationalisierungs API Spezifikation
ECMA-262 6. EditionPDF, HTMLJuni 2015ECMAScript 2015 Sprachspezifikation
ECMA-402 2. EditionPDFJuni 2015ECMAScript 2015 Internationalisierungs API Spezifikation
ECMA-262 7. EditionHTMLJuni 2016ECMAScript 2016 Sprachspezifikation
ECMA-402 3. EditionHTMLJuni 2016ECMAScript 2016 Internationalisierungs API Spezifikation
ECMA-262 8. EditionHTMLJuni 2017ECMAScript 2017 Sprachspezifikation
ECMA-402 4. EditionHTMLJuni 2017ECMAScript 2017 Internationalisierungs API Spezifikation
+ +

ES.Next ist ein dynamischer Name für alles, was in der nächsten Version geschrieben werden soll. ES.Next Funktionen sind normalerweise Vorschläge, weil, laut Definition, die Spezifikation noch nicht fertig ist.

+ +

Siehe Wikipedia ECMAScript Eintrag für weitere Informationen zur ECMAScript Geschichte.

+ +

Man kann an den nächsten Überarbeitungen der ECMAScript Sprachspezifikation, mit dem Codenamen "Harmony", teilnehmen oder verfolgen und die Internationalisierungs API Spezifikation via öffentlichem wiki und der es-discuss mailing Liste verknüpft mit ecmascript.org.

+ +

Implementierungen

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/about/index.html b/files/de/web/javascript/reference/about/index.html new file mode 100644 index 0000000000..bda8422bb1 --- /dev/null +++ b/files/de/web/javascript/reference/about/index.html @@ -0,0 +1,52 @@ +--- +title: Über diese Referenz +slug: Web/JavaScript/Reference/About +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/About +--- +
{{JsSidebar}}
+ +

Die JavaScript Referenz dient als Faktensammlung über die JavaScript Sprache. Hier wird die gesamte Sprache im Detail beschrieben. Wenn Sie JavaScript verwenden, werden Sie diese Seiten häufig nutzen (daher der Titel "JavaScript Referenz). Wenn Sie JavaScript gerade erlernen oder Hilfe beim Verstehen von einigen JavaScript Merkmalen brauchen, schauen Sie sich mal den JavaScript Guide an.

+ +

JavaScript ist für den Einsatz innerhalb größerer Umgebungen bestimmt, sei es ein Browser, Server seitige Skripte oder ähnliches. In den meisten Fällen versucht diese Referenz neutral bezüglich der Umgebung zu sein und bezieht sich nicht auf eine Web-Browser Umgebung.

+ +

Wo sind die JavaScript Informationen zu finden

+ +

Dokumentation der JavaScript Core Sprachmerkmale (meistens reines ECMAScript) findet sich auf folgenden Seiten:

+ + + +

Wenn ihnen JavaScript neu ist, fangen Sie mit dem Guide an. Sobald sie die Grundlagen sicher beherrschen, können Sie die Referenz benutzen um tiefer in die Details der Sprache und ihrer Konstrukte einzusteigen.

+ +

Die Struktur der Referenz

+ +

Folgende Kapitel sind in der JavaScript Referenz zu finden:

+ +
+
Standard "built-in" Objekte
+
Dieses Kapitel dokumentiert alle JavaScript standard "built-in" Objekte, zusammen mit ihren Methoden und Eigenschaften.
+
Anweisungen
+
JavaScript Anwendungen bestehen aus Anweisungen mit bestimmter Syntax. Eine Anweisung kann mehrere Zeilen umfassen und mehrere Anweisungen können in einer einzigen Zeile stehen, wenn sie mittels Semikolon voneinander getrennt sind.
+
Ausdrücke und Operatoren
+
Dieses Kapitel dokumentiert alle JavaScript Ausdrücke, Operatoren und Schlüsselworte.
+
Funktionen
+
Dieses Kapitel befasst sich mit Funktionen.
+
Klassen
+
Dieses Kapitel befasst sich mit Klassen in JavaScript. Klassen wurden in ECMAScript 2015 eingeführt.
+
Errors
+
Dieses Kapitel befasst sich mit Fehlern und Warnungen und deren Behandlung in JavaScript.
+
Neues in JavaScript
+
JavaScript Versionsgeschichte.
+
+ +

Sonstige Referenzseiten

+ + diff --git a/files/de/web/javascript/reference/fehler/already_has_pragma/index.html b/files/de/web/javascript/reference/fehler/already_has_pragma/index.html new file mode 100644 index 0000000000..d297d3fea9 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/already_has_pragma/index.html @@ -0,0 +1,42 @@ +--- +title: 'Warning: -file- is being assigned a //# sourceMappingURL, but already has one' +slug: Web/JavaScript/Reference/Fehler/Already_has_pragma +tags: + - Error + - JavaScript + - Source maps + - Warning +translation_of: Web/JavaScript/Reference/Errors/Already_has_pragma +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: -file- is being assigned a //# sourceMappingURL, but already has one.
+ +

Fehlertyp

+ +

Warnung. Die Ausführung von JavaScript wird nicht unterbrochen.

+ +

Was ist falsch gelaufen?

+ +

Eine Source Map wurde mehrere Male für eine JavaScript Quelle spezifiziert.

+ +

JavaScript Quellen sind oft kombiniert und minimiert, um diesen auf einem Server effizienter zu gestalten. Mit Source Maps ist es möglich den Quelltext, beim Debuggen, zu den originalen Quelldateien zu verfolgen. Es gibt zwei Möglichkeiten Source Maps zuzuweisen, einerseits mit einem Kommentar und andererseits mit dem setzen eines Headers in der JavaScriptdatei.

+ +

Beispiele

+ +

Setzen einer Source Map mit einem Kommentar in einer Datei:

+ +
//# sourceMappingURL=http://example.com/path/to/your/sourcemap.map
+ +

Oder alternativ mit dem setzen eines Headers in einer JavaScriptdatei:

+ +
X-SourceMap: /path/to/file.js.map
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/array_sort_argument/index.html b/files/de/web/javascript/reference/fehler/array_sort_argument/index.html new file mode 100644 index 0000000000..2826cbe4c0 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/array_sort_argument/index.html @@ -0,0 +1,47 @@ +--- +title: 'TypeError: invalid Array.prototype.sort argument' +slug: Web/JavaScript/Reference/Fehler/Array_sort_argument +tags: + - Error + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Array_sort_argument +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: invalid Array.prototype.sort argument (Firefox)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Das Argument von {{jsxref("Array.prototype.sort()")}} erwartet entweder {{jsxref("undefined")}} oder eine Funktion, welche die Operanden vergleicht.

+ +

Beispiele

+ +

Nicht valide Fälle

+ +
[1, 3, 2].sort(5);  // TypeError
+
+var cmp = { asc: (x, y) => x >= y, dsc: (x, y) => x <= y };
+[1, 3, 2].sort(cmp[this.key] || 'asc');  // TypeError
+
+ +

Valide Fälle

+ +
[1, 3, 2].sort();   // [1, 2, 3]
+
+
+var cmp = { asc: (x, y) => x >= y, dsc: (x, y) => x <= y };
+[1, 3, 2].sort(cmp[this.key || 'asc']); // [1, 2, 3]
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/bad_octal/index.html b/files/de/web/javascript/reference/fehler/bad_octal/index.html new file mode 100644 index 0000000000..d021c0daa4 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/bad_octal/index.html @@ -0,0 +1,54 @@ +--- +title: 'Warning: 08/09 is not a legal ECMA-262 octal constant' +slug: Web/JavaScript/Reference/Fehler/Bad_octal +tags: + - Errors + - JavaScript + - SyntaxError + - Warning +translation_of: Web/JavaScript/Reference/Errors/Bad_octal +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: SyntaxError: 08 is not a legal ECMA-262 octal constant.
+Warning: SyntaxError: 09 is not a legal ECMA-262 octal constant.
+
+ +

Fehlertyp

+ +

Warnung. Die Ausführung von JavaScript wird nicht gestoppt.

+ +

Was ist falsch gelaufen?

+ +

Dezimalliterale können mit einer Null (0) beginnen, gefolgt von anderen Dezimalziffern. en alle Ziffern nach der führenden 0 kleiner als 8 sind, wird die Zal als Oktalzahl interpretiert. Weil das nicht der Fall ist mit 08 und 09, warnt JavaScript.

+ +

Zu beachten ist, dass Oktalliterale und oktal maskierte Sequenzen veraltet sind und eine zusätzliche Veraltungswarnung enthalten. Mit ECMAScript 6 und später wird diese Syntak mit einer führenden Null gefolgt von einem großen oder kleinen lateinischen Buschstaben "O" (0o or 0O) benutzt. Sie dazu die Seite lexical grammar für mehr Informationen.

+ +

Beispiele

+ +

Ungültige Oktalzahlen

+ +
08;
+09;
+// SyntaxError: 08 is not a legal ECMA-262 octal constant
+// SyntaxError: "0"-prefixed octal literals and octal escape sequences
+// are deprecated
+ +

Gültige Oktalzahlen

+ +

Einsatz von einer führenden Null gefolgt von dem Buchstaben "o";

+ +
0O755;
+0o644;
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/bad_radix/index.html b/files/de/web/javascript/reference/fehler/bad_radix/index.html new file mode 100644 index 0000000000..25c473eb93 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/bad_radix/index.html @@ -0,0 +1,61 @@ +--- +title: 'RangeError: radix must be an integer' +slug: Web/JavaScript/Reference/Fehler/Bad_radix +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Bad_radix +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: radix must be an integer at least 2 and no greater than 36 (Firefox)
+RangeError: toString() radix argument must be between 2 and 36 (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

Der optionale radix Parameter der {{jsxref("Number.prototype.toString()")}} Methode wurde spezifiziert. Dieser Wert muss eine ganze Zahl zwischen 2 und 36 sein, welche die Basis des Zahlensystems des repräsentierten Zahlwertes angibt. Zum Beispiel wird die Dezimalzahl (Basis 10) 169 im Hexadezimalsystem (Basis 16) als A9 repräsentiert.

+ +

Warum ist der Parameterwert auf 36 limitiert? Eine Basis größer als 10 nutzt als Ziffern Buchstaben; deswegen kann der Parameter nicht größer als 36 sein, weil das Lateinische Alphabet (welches im Englischen und vielen anderen Sprachen verwendet wird) nur 26 Buchstaben hat.

+ +

Die am meisten eingesetzten Basen sind:

+ + + +

Beispiele

+ +

Nicht valide Fälle

+ +
(42).toString(0);
+(42).toString(1);
+(42).toString(37);
+(42).toString(150);
+// You cannot use a string like this for formatting:
+(12071989).toString('MM-dd-yyyy');
+
+ +

Valide Fälle

+ +
(42).toString(2);     // "101010" (binary)
+(13).toString(8);     // "15"     (octal)
+(0x42).toString(10);  // "66"     (decimal)
+(100000).toString(16) // "186a0"  (hexadecimal)
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/bad_regexp_flag/index.html b/files/de/web/javascript/reference/fehler/bad_regexp_flag/index.html new file mode 100644 index 0000000000..5bf381da53 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/bad_regexp_flag/index.html @@ -0,0 +1,105 @@ +--- +title: 'SyntaxError: invalid regular expression flag "x"' +slug: Web/JavaScript/Reference/Fehler/Bad_regexp_flag +tags: + - Error + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Bad_regexp_flag +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: invalid regular expression flag "x" (Firefox)
+SyntaxError: Invalid regular expression flags (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt nicht valide Flags in regulären Ausdrücken im Code. In einem regulärem Ausdrucksliteral, welches aus eine Muster umschlossen von Schrägstrichen ist, kommen die Flags nach dem zweiten Schrägstrich. Sie können auch in der Konstruktorfunktion des {{jsxref("RegExp")}} Objektes angegeben werden (zweiter Parameter). Flags für reguläre Ausdrücke können einfach oder zusammen in beliebiger Reihenfolge benutzt werden, jedoch gibt es in ECMAScript nur fünf.

+ +

Um ein Flag in regulären Ausdrücken einzufügen kann folgende Syntax benutzt werden:

+ +
var re = /pattern/flags;
+
+ +

oder

+ +
var re = new RegExp('pattern', 'flags');
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Flags von regulären Ausdrücken
FlagBeschreibung
gGlobale Suche.
iGroß- und Kleinschreibung nicht unterscheiden.
mSuche über mehrere Zeilen.
uUnicode; nimmt das Muster als eine Sequenz von Unicode Codepoints an.
yFührt eine "sticky" Suche durch, welche zutrifft, wenn der String von der Startposition aus auf das Muster zutrifft. Siehe {{jsxref("RegExp.sticky", "sticky")}}.
+ +

Beispiele

+ +

Es gibt nur fünf valide Flags für reguläre Ausdrücke.

+ +
/foo/bar;
+
+// SyntaxError: invalid regular expression flag "b"
+
+ +

Ist eine regulärer Ausdruck gewollt? Ein Ausdruck, der zwei Schrägstriche enthält wird als Literal für reguläre Ausdrücke interpretiert.

+ +
let obj = {
+  url: /docs/Web
+};
+
+// SyntaxError: invalid regular expression flag "W"
+
+ +

Oder war stattdessen ein String gemeint? Füge einfache oder doppelte Anführungszeichen hinzu, um ein Stringliteral zu erstellen.

+ +
let obj = {
+  url: '/docs/Web'
+};
+ +

Valide Flags für reguläre Ausdrücke

+ +

Siehe in der Tabelle oben für die fünf in JavaScript erlaubten validen Flags für reguläre Ausdrücke

+ +
/foo/g;
+/foo/gim;
+/foo/uy;
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/bad_return_or_yield/index.html b/files/de/web/javascript/reference/fehler/bad_return_or_yield/index.html new file mode 100644 index 0000000000..e850455615 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/bad_return_or_yield/index.html @@ -0,0 +1,55 @@ +--- +title: 'SyntaxError: return not in function' +slug: Web/JavaScript/Reference/Fehler/Bad_return_or_yield +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Bad_return_or_yield +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: return not in function
+SyntaxError: yield not in function
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}.

+ +

Was ist falsch gelaufen?

+ +

Ein return oder yield Statement wird außerhalb einer Funktion aufgerufen. Es kann sein, dass geschweifte Klammern fehlen. Die Statements return und yield müssen in einer Funktion sein, weil sie die Ausführung der Funktion beenden (oder pausieren und wieder starten) und dem Funktionsaufrufer einen spezifizierten Wert zurückgeben.

+ +

Beispiele

+ +
var cheer = function(score) {
+  if (score === 147)
+    return 'Maximum!';
+  };
+  if (score > 100) {
+    return 'Century!';
+  }
+}
+
+// SyntaxError: return not in function
+ +

Die geschweiften Klammern sehen auf den ersten Blick richtig aus, jedoch fehlt in dem Code eine { nach dem ersten if Statement. Korrekt währe es wir folgt:

+ +
var cheer = function(score) {
+  if (score === 147) {
+    return 'Maximum!';
+  }
+  if (score > 100) {
+    return 'Century!';
+  }
+};
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/called_on_incompatible_type/index.html b/files/de/web/javascript/reference/fehler/called_on_incompatible_type/index.html new file mode 100644 index 0000000000..1915e1b829 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/called_on_incompatible_type/index.html @@ -0,0 +1,64 @@ +--- +title: X.prototype.y called on incompatible type +slug: Web/JavaScript/Reference/Fehler/Called_on_incompatible_type +tags: + - Error + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Called_on_incompatible_type +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: Function.prototype.toString called on incompatible object (Firefox)
+TypeError: Function.prototype.bind called on incompatible target (Firefox)
+TypeError: Method Set.prototype.add called on incompatible receiver undefined (Chrome)
+TypeError: Bind must be called on a function (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Wenn dieser Fehler auftritt, wird eine Funktion (auf eineem gegebenen Objekt) aufgerufen, wobei this nicht vom erwarteten Typ ist.

+ +

Dieser Fehler kann auftreten, wenn die {{jsxref("Function.prototype.call()")}} oder {{jsxref("Function.prototype.apply()")}} Methode mit einem this Argument genutzt werden, welches nicht dem erwarteten Typ entspricht.

+ +

Dieser Fehler kann auch auftreten, wenn eine Funktion (in einem Objekt gespeichert) als Argument in einer anderen Funktion genutzt wird. In diesem Fall ist das Objekt nicht this der Funktion. Um diesen Dall zu umgehen muss eine Lambda-Funktion unterstützt werden, welche den Aufruf markiert, oder die {{jsxref("Function.prototype.bind()")}} Funktion eingesetzt werden, um das richtige this Objekt zu nutzen.

+ +

Beispiele

+ +

Fehlerfälle

+ +
var mySet = new Set;
+['bar', 'baz'].forEach(mySet.add);
+// mySet.add ist eine Funktion, aber "mySet" wird so nicht erfasst.
+
+var myFun = function () {};
+['bar', 'baz'].forEach(myFun.bind);
+// myFun.bind ist eine Funktion, aber "myFun" wird nicht so erfasst.
+
+
+ +

Gültiger Fälle

+ +
var mySet = new Set;
+['bar', 'baz'].forEach(mySet.add.bind(mySet));
+// Das funktioniert, weil "mySet" als this an die Funktion gebunden wird.
+
+var myFun = function () {};
+['bar', 'baz'].forEach(x => myFun.bind(x));
+// Das funktioniert durch die "bind" Funktion. Es wird eine Lambda-Funktion erstellt, die die Argumente weiterleitet..
+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cant_access_lexical_declaration_before_init/index.html b/files/de/web/javascript/reference/fehler/cant_access_lexical_declaration_before_init/index.html new file mode 100644 index 0000000000..16b976aef6 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cant_access_lexical_declaration_before_init/index.html @@ -0,0 +1,60 @@ +--- +title: 'ReferenceError: can''t access lexical declaration`X'' before initialization' +slug: Web/JavaScript/Reference/Fehler/Cant_access_lexical_declaration_before_init +tags: + - Errors + - JavaScript + - ReferenceError +translation_of: Web/JavaScript/Reference/Errors/Cant_access_lexical_declaration_before_init +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
ReferenceError: can't access lexical declaration `X' before initialization (Firefox)
+ReferenceError: 'x' is not defined (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("ReferenceError")}}

+ +

Was ist falsch gelaufen?

+ +

Auf eine lexikalische Variable wurde zugegriffen bevor sie deklariert wurde. Das passiert in Blockstatements, in denen auf let oder const Variablen zugegriffen wird, bevor sie definiert wurden.

+ +

Beispiele

+ +

Falsche Fälle

+ +

In diesem Fall wird die Variable "foo" in einem Blockstatement mit let neu deklariert.

+ +
function test() {
+  let foo = 33;
+  if (true) {
+    let foo = (foo + 55);
+    // ReferenceError: can't access lexical
+    // declaration `foo' before initialization
+  }
+}
+test();
+
+ +

Richtige Fälle

+ +

Um "foo" im if-Statement zu ändern, muss  let entfernt werden, welche die Neudeklaration verursacht.

+ +
function test(){
+   let foo = 33;
+   if (true) {
+      foo = (foo + 55);
+   }
+}
+test();
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cant_access_property/index.html b/files/de/web/javascript/reference/fehler/cant_access_property/index.html new file mode 100644 index 0000000000..98471eb28e --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cant_access_property/index.html @@ -0,0 +1,59 @@ +--- +title: 'TypeError: can''t access property "x" of "y"' +slug: Web/JavaScript/Reference/Fehler/Cant_access_property +tags: + - Fehler + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Cant_access_property +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: Unable to get property {x} of undefined or null reference (Edge)
+TypeError: can't access property {x} of {y} (Firefox)
+TypeError: {y} is undefined, can't access property {x} of it (Firefox)
+TypeError: {y} is null, can't access property {x} of it (Firefox)
+
+Beispiele:
+TypeError: x is undefined, can't access property "prop" of it
+TypeError: x is null, can't access property "prop" of it
+TypeError: can't access property "prop" of undefined
+TypeError: can't access property "prop" of null
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}.

+ +

Was ist falsch gelaufen?

+ +

The Attributzugriff erfolgte über einen {{jsxref("undefined")}} oder {{jsxref("null")}} Wert

+ +

Beispiele

+ +

Invalide Fälle

+ +
// undefined und null sind Fälle auf denen die Methode substring nicht aufgerufen werden kann
+var foo = undefined;
+foo.substring(1); // TypeError: x is undefined, can't access property "substring" of it
+
+var foo = null;
+foo.substring(1); // TypeError: x is null, can't access property "substring" of it
+
+ +

Fehlerbehebung

+ +

Um den null pointer auf undefined oder null Werte zu beheben, kann beispielsweise der typeof Operator verwendet werden.

+ +
if (typeof foo !== 'undefined') {
+  // Hier wissen wir, dass foo definiert ist
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cant_define_property_object_not_extensible/index.html b/files/de/web/javascript/reference/fehler/cant_define_property_object_not_extensible/index.html new file mode 100644 index 0000000000..691924f427 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cant_define_property_object_not_extensible/index.html @@ -0,0 +1,64 @@ +--- +title: 'TypeError: can''t define property "x": "obj" is not extensible' +slug: Web/JavaScript/Reference/Fehler/Cant_define_property_object_not_extensible +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Cant_define_property_object_not_extensible +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: can't define property "x": "obj" is not extensible (Firefox)
+TypeError: Cannot define property: "x", object is not extensible. (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Normalerweise ist ein Objekt erweiterbar und neue Eigenschaften können hinzugefügt werden. In diesem Fall markiert {{jsxref("Object.preventExtensions()")}} ein Objekt als nicht mehr erweiterbar, so dass ein Objekt nur noch die Eigenschaften haben kann, die es vor dem Aufruf hatte.

+ +

Beispiele

+ +

Im strict mode wird ein TypeError erzeugt, wenn versucht wird eine Eigenschaft zu einem nicht erweiterbaren Objekt hinzuzufügen. Im normalen Modus wird das Hinzufügen einfach ignoriert.

+ +
'use strict';
+
+var obj = {};
+Object.preventExtensions(obj);
+
+obj.x = 'foo';
+// TypeError: can't define property "x": "obj" is not extensible
+
+ +

Im strict mode und normalen Modus wird ein Fehler erzeugt, wenn {{jsxref("Object.defineProperty()")}} benutzt wird, um eine Eigenschaft zu einem nicht erweiterbaren Objekt hinzuzufügen.

+ +
var obj = { };
+Object.preventExtensions(obj);
+
+Object.defineProperty(obj,
+  'x', { value: "foo" }
+);
+// TypeError: can't define property "x": "obj" is not extensible
+
+ +

Um diesen Fehler zu vermeiden muss entweder der Aufruf von {{jsxref("Object.preventExtensions()")}} entfernt werden oder die Position des Aufrufes so verschoben werden, dass das Hinzufügen von Eigenschaften davor passiert und das Objekt erst danach als nicht erweiterbar markiert wird. Natürlich kann auch die neue Eigenschaft entfernt werden, wenn sie nicht benötigt wird.

+ +
'use strict';
+
+var obj = {};
+obj.x = 'foo'; // add property first and only then prevent extensions
+
+Object.preventExtensions(obj);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cant_delete/index.html b/files/de/web/javascript/reference/fehler/cant_delete/index.html new file mode 100644 index 0000000000..fe09735071 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cant_delete/index.html @@ -0,0 +1,58 @@ +--- +title: 'TypeError: property "x" is non-configurable and can''t be deleted' +slug: Web/JavaScript/Reference/Fehler/Cant_delete +tags: + - Errors + - JavaScript + - Strict Mode + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Cant_delete +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: property "x" is non-configurable and can't be deleted. (Firefox)
+TypeError: Cannot delete property 'x' of #<Object> (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}} nur im strict mode.

+ +

Was ist falsch gelaufen?

+ +

Es wurde versucht eine EIgenschaft zu löschen, obwohl die Eigenschaft nicht Konfigurierbar (non-configurable) ist. Das configurable Attribut gibt an, ob ein Eigenschaft von einem Objekt gelöscht werden kann und ob ein Attribut (anders als writable) geändert werden kann.

+ +

Dieser Fehler ist nur tritt nur im strict mode auf. In non-strict Quelltext, gibt die Operation false zurück.

+ +

Beispiele

+ +

Nicht Konfigurierbare Eigenschaften sind nicht sehr häufig, aber sie können mit {{jsxref("Object.defineProperty()")}} oder {{jsxref("Object.freeze()")}} erstellt werden.

+ +
'use strict';
+var obj = Object.freeze({name: 'Elsa', score: 157});
+delete obj.score;  // TypeError
+
+'use strict';
+var obj = {};
+Object.defineProperty(obj, 'foo', {value: 2, configurable: false});
+delete obj.foo;  // TypeError
+
+'use strict';
+var frozenArray = Object.freeze([0, 1, 2]);
+frozenArray.pop();  // TypeError
+
+ +

Es gibt auch einige nicht Konfigurierbare Eigenschaften, die in JavaScript eingebaut sind. Dazu zählen zum Beispiel die mathematischen Konstanten.

+ +
'use strict';
+delete Math.PI;  // TypeError
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cant_redefine_property/index.html b/files/de/web/javascript/reference/fehler/cant_redefine_property/index.html new file mode 100644 index 0000000000..80ef1e384b --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cant_redefine_property/index.html @@ -0,0 +1,51 @@ +--- +title: 'TypeError: can''t redefine non-configurable property "x"' +slug: Web/JavaScript/Reference/Fehler/Cant_redefine_property +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Cant_redefine_property +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: can't redefine non-configurable property "x" (Firefox)
+TypeError: Cannot redefine property: "x" (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Es wurde versucht eine Eigenschaft erneut zu definieren, aber die Eigenschaft ist nicht konfigurierbar (non-configurable). Das configurable Attribut kontrolliert, ob eine Eigenschaft von einem Objekt gelöscht werden kann und seine Attribute (anders als writable) geändert werden können. Eigenschaften von einem Objekt, dass von einem Objekt-Initialisierer erstellt wurden, sind konfigurierbar. Immer, wenn zum Beispiel {{jsxref("Object.defineProperty()")}} eingesetzt wird, ist die Eigenschaft nicht ohne weiteres konfigurierbar.

+ +

Beispiele

+ +

Nicht konfigurierbare Eigenschaften mit Object.defineProperty erstellen

+ +

Die {{jsxref("Object.defineProperty()")}} Funktion erstellt nicht konfiguriertbare Eigenschaften wenn sie nicht extra als konfigurierbar spezifiziert sind.

+ +
var obj = Object.create({});
+Object.defineProperty(obj, "foo", {value: "bar"});
+
+Object.defineProperty(obj, "foo", {value: "baz"});
+// TypeError: can't redefine non-configurable property "foo"
+
+ +

Die "foo" Eigenschaft muss als Konfigurierbar eingestellt werden, wenn diese später im Quelltext erneut definiert bzw. überschrieben werden soll.

+ +
var obj = Object.create({});
+Object.defineProperty(obj, "foo", {value: "bar", configurable: true});
+Object.defineProperty(obj, "foo", {value: "baz", configurable: true});
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/cyclic_object_value/index.html b/files/de/web/javascript/reference/fehler/cyclic_object_value/index.html new file mode 100644 index 0000000000..33bf4d508a --- /dev/null +++ b/files/de/web/javascript/reference/fehler/cyclic_object_value/index.html @@ -0,0 +1,67 @@ +--- +title: 'TypeError: cyclic object value' +slug: Web/JavaScript/Reference/Fehler/Cyclic_object_value +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Cyclic_object_value +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: cyclic object value (Firefox)
+TypeError: Converting circular structure to JSON (Chrome and Opera)
+TypeError: Circular reference in value argument not supported (Microsoft Edge)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Wenn {{jsxref("JSON.stringify()")}} aufgerufen wird, kann eine zyklische Objektreferenzstruktur nicht zu eine String konvertiert werden.

+ +

Beispiele

+ +

In eine zyklischen Struktur wie folgender

+ +
var circularReference = {otherData: 123};
+circularReference.myself = circularReference;
+
+ +

wird {{jsxref("JSON.stringify()")}} nicht funktionieren

+ +
JSON.stringify(a);
+// TypeError: cyclic object value
+
+ +

Um zyklische Referenzen zu serialisieren, kann man eine Bibliotheken benutzen (z. B. cycle.js von Douglas Crockford) oder eine eigene Lösung implementieren, welche zyklische Referenzen findet und mit serialisierbaren Werten ersetzt (oder diese entfernt).

+ +

Das folgende Codebeispiel zeigt, wie man eine zyklische Referenz mit dem Einsatz des  replacer Parameters von {{jsxref("JSON.stringify()")}} findet und filtert (das bedeutet, es gehen Daten verloren):

+ +
const getCircularReplacer = () => {
+  const seen = new WeakSet;
+  return (key, value) => {
+    if (typeof value === "object" && value !== null) {
+      if (seen.has(value)) {
+        return;
+      }
+      seen.add(value);
+    }
+    return value;
+  };
+};
+
+JSON.stringify(circularReference, getCircularReplacer());
+// {"otherData":123}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/dead_object/index.html b/files/de/web/javascript/reference/fehler/dead_object/index.html new file mode 100644 index 0000000000..036e637ef4 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/dead_object/index.html @@ -0,0 +1,50 @@ +--- +title: 'TypeError: can''t access dead object' +slug: Web/JavaScript/Reference/Fehler/Dead_object +tags: + - Addon + - Error + - Errors + - JavaScript +translation_of: Web/JavaScript/Reference/Errors/Dead_object +--- +
{{JSSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: can't access dead object
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Um die Speichernutzung zu verbessern und Speicherlücken zu vermeiden, verbietet Firefox Add-Ons Referenzen in das DOM Objekt zu speichern, nachdem das Elterndokument zerstört wurde. Ein totes Objekt hält eine starke Referenz zu einem DOM-Element, welche nach nach dem Zerstören in DOM existiert. Um dieses Problem zu vermeiden, sollte statt der Referenz zu einem DOM-Knoten im fremden Dokument die Referenz in einem Objekt, welches im Dokument selbst spezifiziert ist gespeichert werden und gesäubert werden, wenn das Dokument nicht mehr geladen ist, oder als weak Referenz gespeichert werden.

+ +

Prüfen, ob ein Objekt tot ist

+ +

Components.utils hat ein isDeadWrapper() Methode, welche in privilegiertem Quelltext verwendet werden sollte.

+ +
if (Components.utils.isDeadWrapper(window)) {
+  // dead
+}
+ +

Nicht privilegierter Quelltext hat keinen Zugriff auf Component.utils und sollt deswegen einfach den Fehler abfangen.

+ +
try {
+  String(window);
+}
+catch (e) {
+  console.log("window is likely dead");
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/delete_in_strict_mode/index.html b/files/de/web/javascript/reference/fehler/delete_in_strict_mode/index.html new file mode 100644 index 0000000000..042505e066 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/delete_in_strict_mode/index.html @@ -0,0 +1,70 @@ +--- +title: >- + SyntaxError: applying the 'delete' operator to an unqualified name is + deprecated +slug: Web/JavaScript/Reference/Fehler/Delete_in_strict_mode +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Delete_in_strict_mode +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: applying the 'delete' operator to an unqualified name is deprecated (Firefox)
+SyntaxError: Delete of an unqualified identifier in strict mode. (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}} nur im Strict Mode.

+ +

Was ist falsch gelaufen?

+ +

Normale Variablen können in JavaScript nicht mit dem delete Operator gelöscht werden. Im Strict Mode führt der Versuch des Löschens zu einem Fehler, weil es nicht erlaubt ist.

+ +

Der delete Operator kann nur Eigenschaften eines Objektes löschen. Objekteigenschaften müssen dafür Konfigurierbar sein.

+ +

Wie oft fälschlicherweise angenommen, hat die delete Operation nichts mit dem direkten freimachen von Speicher zu tun. Speicherverwaltung wird indirekt gemacht, mehr Informationen darüber auf den Seiten Speicherverwaltung und delete.

+ +

Der Fehler tritt nur im Strict Mode auf. In normalem Code gibt die Operation einfach false zurück.

+ +

Beispiele

+ +

Der Versuch eine einfache Variable zu Löschen funktioniert in JavaScript nicht unf führt im Strict Mode zu einem Fehler:

+ +
'use strict';
+
+var x;
+
+// ...
+
+delete x;
+
+// SyntaxError: applying the 'delete' operator to an unqualified name
+// is deprecated
+
+ +

Um den Inhalt einer Variable zu leeren, kann man sie auf {{jsxref("null")}} setzen:

+ +
'use strict';
+
+var x;
+
+// ...
+
+x = null;
+
+// x can be garbage collected
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_caller_or_arguments_usage/index.html b/files/de/web/javascript/reference/fehler/deprecated_caller_or_arguments_usage/index.html new file mode 100644 index 0000000000..15bb0e68b6 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_caller_or_arguments_usage/index.html @@ -0,0 +1,75 @@ +--- +title: 'ReferenceError: deprecated caller or arguments usage' +slug: Web/JavaScript/Reference/Fehler/Deprecated_caller_or_arguments_usage +tags: + - Errors + - JavaScript + - Strict Mode + - Warning +translation_of: Web/JavaScript/Reference/Errors/Deprecated_caller_or_arguments_usage +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: ReferenceError: deprecated caller usage (Firefox)
+Warning: ReferenceError: deprecated arguments usage (Firefox)
+TypeError: 'callee' and 'caller' cannot be accessed in strict mode. (Safari)
+
+ +

Fehlertyp

+ +

Eine {{jsxref("ReferenceError")}} Warnung, die nur im Strict Mode auftaucht. Die JavaScript-Ausführung wird dadurch nicht angehalten.

+ +

Was ist falsch gelaufen?

+ +

Im Strict Mode wurden die Eigenschaften {{jsxref("Function.caller")}} oder {{jsxref("Function.arguments")}} benutzt, was nicht getan werden sollte. Sie sind veraltet, da sie den Funktionsaufruf verlieren, nicht standardisiert sind, schwer zu optimieren sind und möglicherweise leistungsschädigend sein können.

+ +

Beispiele

+ +

Veraltete function.caller oder arguments.callee.caller Eigenschaft

+ +

{{jsxref("Function.caller")}} und arguments.callee.caller sind veraltet (in den Referenzartikeln sind mehr Informationen dazu enthalten).

+ +
'use strict';
+
+function myFunc() {
+  if (myFunc.caller == null) {
+    return 'The function was called from the top!';
+  } else {
+    return 'This function\'s caller was ' + myFunc.caller;
+  }
+}
+
+myFunc();
+// Warning: ReferenceError: deprecated caller usage
+// "The function was called from the top!"
+ +

Function.arguments

+ +

{{jsxref("Function.arguments")}} ist veraltet (im Referenzartikel sind mehr Informationen dazu enthalten).

+ +
'use strict';
+
+function f(n) { g(n - 1); }
+
+function g(n) {
+  console.log('before: ' + g.arguments[0]);
+  if (n > 0) { f(n); }
+  console.log('after: ' + g.arguments[0]);
+}
+
+f(2);
+
+console.log('returned: ' + g.arguments);
+// Warning: ReferenceError: deprecated arguments usage
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_expression_closures/index.html b/files/de/web/javascript/reference/fehler/deprecated_expression_closures/index.html new file mode 100644 index 0000000000..b8c6e7ced8 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_expression_closures/index.html @@ -0,0 +1,78 @@ +--- +title: 'Warning: expression closures are deprecated' +slug: Web/JavaScript/Reference/Fehler/Deprecated_expression_closures +tags: + - JavaScript + - Warning +translation_of: Web/JavaScript/Reference/Errors/Deprecated_expression_closures +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: expression closures are deprecated
+
+ +

Fehlertyp

+ +

Warnung. Die Ausführung von JavaScript wird nicht angehalten.

+ +

Was ist falsch gelaufen?

+ +

Die nicht standardisierte Ausdrucks Closure Syntax (Kurzform der Funktionssyntax) ist veraltetet und sollte nicht mehr verwendet werden. Diese Syntax wird komplett entfernt ({{bug(1083458)}}) und Skripte die diese Benutzen erzeugen dann einen {{jsxref("SyntaxError")}}.

+ +

Beispiele

+ +

Veraltete Syntax

+ +

Ausdrucks Closures vermeiden geschweifte Klammern oder return Anweisungen in Funktionsdeklarationen oder in Methodendefinitionen in Objekten.

+ +
var x = function() 1;
+
+var obj = {
+  count: function() 1
+};
+
+ +

Standardsyntax

+ +

Um die nicht standardisierte Ausdrucks Closures Syntax zu Standard-ECMAScript Syntax zu konvertieren müssen geschweifte Klammern und ein return Statement hinzugefügt werden.

+ +
var x = function() { return 1; }
+
+var obj = {
+  count: function() { return 1; }
+};
+
+ +

Standardsyntax mit Arrowfunktionen

+ +

Alternativ können Arrow-Funktionen genutzt werden:

+ +
var x = () => 1;
+ +

Standardsyntax mit Kurzformmethodensyntax

+ +

Anweisungs Closures können auch in Gettern und Settern gefunden werden:

+ +
var obj = {
+  get x() 1,
+  set x(v) this.v = v
+};
+
+ +

Mit ES2015 Methodendefinitionen können diese folgendermaßen konvertiert werden :

+ +
var obj = {
+  get x() { return 1 },
+  set x(v) { this.v = v }
+};
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_octal/index.html b/files/de/web/javascript/reference/fehler/deprecated_octal/index.html new file mode 100644 index 0000000000..e153038950 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_octal/index.html @@ -0,0 +1,67 @@ +--- +title: 'SyntaxError: "0"-prefixed octal literals and octal escape seq. are deprecated' +slug: Web/JavaScript/Reference/Fehler/Deprecated_octal +tags: + - Error + - JavaScript + - Strict Mode + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Deprecated_octal +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError:
+"0"-prefixed octal literals and octal escape sequences are deprecated;
+for octal literals use the "0o" prefix instead
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}} nur im Strict Mode.

+ +

Was ist falsch gelaufen?

+ +

Oktalliterale und oktal maskierte Sequenzen sind veraltet und führen zu einem {{jsxref("SyntaxError")}} im Strict Mode. Ab ECMAScript 2015 wird in der standardisierten Syntax eine führende null gefolgt von einem kleinen oder großen lateinischen Buchstaben "O" verwendet (0o oder 0O).

+ +

Beispiele

+ +

Oktalliteral mit führender 0

+ +
"use strict";
+
+03;
+
+// SyntaxError: "0"-prefixed octal literals and octal escape sequences
+// are deprecated
+ +

Oktal maskierte Sequenz

+ +
"use strict";
+
+"\251";
+
+// SyntaxError: "0"-prefixed octal literals and octal escape sequences
+// are deprecated
+
+ +

Valide Oktalzahlen

+ +

Einsatz einer führenden null gefolgt von "o" oder "O":

+ +
0o3;
+
+ +

Statt oktal maskierte Sequenzen können hexadezimal maskierte Sequenzen benutzt werden:

+ +
'\xA9';
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_source_map_pragma/index.html b/files/de/web/javascript/reference/fehler/deprecated_source_map_pragma/index.html new file mode 100644 index 0000000000..1f87b2bd2d --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_source_map_pragma/index.html @@ -0,0 +1,58 @@ +--- +title: >- + SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# + instead +slug: Web/JavaScript/Reference/Fehler/Deprecated_source_map_pragma +tags: + - Errors + - JavaScript + - Source maps +translation_of: Web/JavaScript/Reference/Errors/Deprecated_source_map_pragma +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead
+
+Warning: SyntaxError: Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead
+
+ +

Fehlertyp

+ +

Eine Warnung die als {{jsxref("SyntaxError")}} auftritt. Die Ausführung von JavaScript wird nicht unterbrochen.

+ +

Was ist falsch gelaufen?

+ +

Es gibt eine veraltete Source-Map-Syntax im JavaScript Code.

+ +

JavaScript Code wird oft zusammengefügt und minimiert, um die Auslieferung durch einen Server effizienter zu machen. Mit Source-Maps kann beim Debuggen der ausgeführte Code auf die Original Codedateien übertragen werden.

+ +

Die Source-Map Spezifikation änderte die Syntax wegen eines Konflikts mit dem IE immer wenn die Seite nach //@cc_on war, interpretierte dieser es als bedingte Kompilierung in der IE JScript Umgebung. Der bedingte Kompilations Kommentar im IE ist eine relativ unbekannte Funktion, aber dieses machte Source-Maps von jQuery und anderen Bibliotheken kaputt.

+ +

Beispiele

+ +

Veraltete Syntax

+ +

Syntax mit dem veralteten "@" Zeichen.

+ +
//@ sourceMappingURL=http://example.com/path/to/your/sourcemap.map
+
+ +

Standard Syntax

+ +

Benutzt stattdessen ein "#" Zeichen.

+ +
//# sourceMappingURL=http://example.com/path/to/your/sourcemap.map
+ +

Alternativ kann ein {{HTTPHeader("SourceMap")}} Header zu der JavaScript Datei gesetzt werden, um einen solchen Kommentar zu vermeiden:

+ +
SourceMap: /path/to/file.js.map
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_string_generics/index.html b/files/de/web/javascript/reference/fehler/deprecated_string_generics/index.html new file mode 100644 index 0000000000..d495448759 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_string_generics/index.html @@ -0,0 +1,104 @@ +--- +title: 'Warning: String.x is deprecated; use String.prototype.x instead' +slug: Web/JavaScript/Reference/Fehler/Deprecated_String_generics +tags: + - JavaScript + - Warning +translation_of: Web/JavaScript/Reference/Errors/Deprecated_String_generics +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: String.charAt            is deprecated; use String.prototype.charAt            instead
+Warning: String.charCodeAt        is deprecated; use String.prototype.charCodeAt        instead
+Warning: String.concat            is deprecated; use String.prototype.concat            instead
+Warning: String.contains          is deprecated; use String.prototype.contains          instead
+Warning: String.endsWith          is deprecated; use String.prototype.endsWith          instead
+Warning: String.includes          is deprecated; use String.prototype.includes          instead
+Warning: String.indexOf           is deprecated; use String.prototype.indexOf           instead
+Warning: String.lastIndexOf       is deprecated; use String.prototype.lastIndexOf       instead
+Warning: String.localeCompare     is deprecated; use String.prototype.localeCompare     instead
+Warning: String.match             is deprecated; use String.prototype.match             instead
+Warning: String.normalize         is deprecated; use String.prototype.normalize         instead
+Warning: String.replace           is deprecated; use String.prototype.replace           instead
+Warning: String.search            is deprecated; use String.prototype.search            instead
+Warning: String.slice             is deprecated; use String.prototype.slice             instead
+Warning: String.split             is deprecated; use String.prototype.split             instead
+Warning: String.startsWith        is deprecated; use String.prototype.startsWith        instead
+Warning: String.substr            is deprecated; use String.prototype.substr            instead
+Warning: String.substring         is deprecated; use String.prototype.substring         instead
+Warning: String.toLocaleLowerCase is deprecated; use String.prototype.toLocaleLowerCase instead
+Warning: String.toLocaleUpperCase is deprecated; use String.prototype.toLocaleUpperCase instead
+Warning: String.toLowerCase       is deprecated; use String.prototype.toLowerCase       instead
+Warning: String.toUpperCase       is deprecated; use String.prototype.toUpperCase       instead
+Warning: String.trim              is deprecated; use String.prototype.trim              instead
+Warning: String.trimLeft          is deprecated; use String.prototype.trimLeft          instead
+Warning: String.trimRight         is deprecated; use String.prototype.trimRight         instead
+
+ +

Fehlertyp

+ +

Warnung. JavaScript unterbricht die Ausführung nicht.

+ +

Was ist falsch gelaufen?

+ +

Die nicht standardisierten generischen {{jsxref("String")}} Methoden sind veraltet und werden in Zukunft gelöscht (keine Browserübergreifende Unterstützung, nur in Firefox verfügbar). String-Generics stellen String-Instanzmethoden für das String-Objekt bereit, wodurch String-Methoden auf jedes Objekt angewendet werden können.

+ +

Firefox {{bug(1222552)}} dokumentiert das Entfernen von generischen String Methoden.

+ +

Beispiele

+ +

Fehlerfälle

+ +
var num = 15;
+String.replace(num, /5/, '2');
+ +

Gültige Fälle

+ +
var num = 15;
+String(num).replace(/5/, '2');
+
+ +

Shim

+ +

Das Folgende ist ein Shim zur Unterstützung nicht unterstützender Browser:

+ +
/*globals define*/
+// Assumes all supplied String instance methods already present
+// (one may use shims for these if not available)
+(function() {
+  'use strict';
+
+  var i,
+    // We could also build the array of methods with the following, but the
+    //   getOwnPropertyNames() method is non-shimable:
+    // Object.getOwnPropertyNames(String).filter(function(methodName) {
+    //   return typeof String[methodName] === 'function';
+    // });
+    methods = [
+      'contains', 'substring', 'toLowerCase', 'toUpperCase', 'charAt',
+      'charCodeAt', 'indexOf', 'lastIndexOf', 'startsWith', 'endsWith',
+      'trim', 'trimLeft', 'trimRight', 'toLocaleLowerCase', 'normalize',
+      'toLocaleUpperCase', 'localeCompare', 'match', 'search', 'slice',
+      'replace', 'split', 'substr', 'concat', 'localeCompare'
+    ],
+    methodCount = methods.length,
+    assignStringGeneric = function(methodName) {
+      var method = String.prototype[methodName];
+      String[methodName] = function(arg1) {
+        return method.apply(arg1, Array.prototype.slice.call(arguments, 1));
+      };
+    };
+
+  for (i = 0; i < methodCount; i++) {
+    assignStringGeneric(methods[i]);
+  }
+}());
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/deprecated_tolocaleformat/index.html b/files/de/web/javascript/reference/fehler/deprecated_tolocaleformat/index.html new file mode 100644 index 0000000000..31cc81d9cc --- /dev/null +++ b/files/de/web/javascript/reference/fehler/deprecated_tolocaleformat/index.html @@ -0,0 +1,90 @@ +--- +title: 'Warning: Date.prototype.toLocaleFormat is deprecated' +slug: Web/JavaScript/Reference/Fehler/Deprecated_toLocaleFormat +tags: + - JavaScript + - Warning +translation_of: Web/JavaScript/Reference/Errors/Deprecated_toLocaleFormat +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: Date.prototype.toLocaleFormat is deprecated; consider using Intl.DateTimeFormat instead
+
+ +

Fehlertyp

+ +

Warnung. JavaScript stoppt die ausführung nicht an.

+ +

Was ist falsch gelaufen?

+ +

Die nicht standardisierte Methode {{jsxref("Date.prototype.toLocaleFormat")}} ist veraltet und sollte nicht mehr benutzt werden. Sie benutzt einen Formatstring mit dem selben Format, wie dei der C Funktion strftime(). Diese Funktion ist seit Firefox 58+ nicht mehr vorhanden.

+ +

Beispiele

+ +

Veraltete Syntax

+ +

Die {{jsxref("Date.prototype.toLocaleFormat")}} Methode ist veraltet und wird entfernt werden (keine browserübergreifende Unterstützung, nur in Firefox verfügbar).

+ +
var today = new Date();
+var date = today.toLocaleFormat('%A, %e. %B %Y');
+
+console.log(date);
+// In German locale
+// "Freitag, 10. März 2017"
+ +

Alternative Standardsyntax mit der ECMAScript Intl API

+ +

Der ECMA-402 Standard spezifiziert Standardobjekte und Methoden (ECMAScript Intl API), die sprachabhängige Datums- und Zeitformatierung erlauben (verfügbar in Chrome 24+, Firefox 29+, IE11+, Safari10+).

+ +

Man kan jetzt die {{jsxref("Date.prototype.toLocaleDateString")}} Methode einsetzen, um einen Zeitpunkt zu formatieren.

+ +
var today = new Date();
+var options = { weekday: 'long', year: 'numeric',
+                month: 'long', day: 'numeric' };
+var date = today.toLocaleDateString('de-DE', options);
+
+console.log(date);
+// "Freitag, 10. März 2017"
+
+ +

Oder man kann das {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekt einsetzen, welches die meisten Berechnungen zwischenspeichert, so dass das Formatieren schneller ist. Dieses ist nützlich, wenn Zeitpunkte in einer Schleife formatiert werden.

+ +
var options = { weekday: 'long', year: 'numeric',
+                month: 'long', day: 'numeric' };
+var dateFormatter = new Intl.DateTimeFormat('de-DE', options)
+
+var dates = [Date.UTC(2012, 11, 20, 3, 0, 0),
+             Date.UTC(2014, 04, 12, 8, 0, 0)];
+
+dates.forEach(date => console.log(dateFormatter.format(date)));
+
+// "Donnerstag, 20. Dezember 2012"
+// "Montag, 12. Mai 2014"
+
+ +

Alternative Standardsyntax mit Date Methoden

+ +

Das {{jsxref("Date")}} Objekt enthält einige Methoden, um einen Benutzerdefinierten Datumsstring zu erhalten.

+ +
(new Date()).toLocaleFormat("%Y%m%d");
+// "20170310"
+
+ +

Dieses kan konvertiert werde:

+ +
let now = new Date();
+let date = now.getFullYear() * 10000 +
+          (now.getMonth() + 1) * 100 + now.getDate();
+
+console.log(date);
+// "20170310"
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/equal_as_assign/index.html b/files/de/web/javascript/reference/fehler/equal_as_assign/index.html new file mode 100644 index 0000000000..dbe5e55b02 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/equal_as_assign/index.html @@ -0,0 +1,54 @@ +--- +title: 'SyntaxError: test for equality (==) mistyped as assignment (=)?' +slug: Web/JavaScript/Reference/Fehler/Equal_as_assign +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Equal_as_assign +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: SyntaxError: test for equality (==) mistyped as assignment (=)?
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}} Warnung nur im strict mode.

+ +

Was ist falsch gelaufen?

+ +

Es gibt eine Zuweisung (=) an der eigentlich ein Gleichheitsprüfung (==) erwartet wird. Um das Debuggen zu unterstützen, warnt JavaScript diesen Fakt (im strict mode).

+ +

Beispiele

+ +

Zuweisung in bedingten Ausdrücken

+ +

Es ist ratsam in bedingten Ausdrücken (wie z. B. if...else) keine einfachen Zuweisungen zu verwenden, weil beim lesen des Codes eine Zuweisung mit einer Gleichheitsprüfung verwechselt werden kann. Zum Beispiel sollte folgender Code nicht verwendet werden:

+ +
if (x = y) {
+  // do the right thing
+}
+
+ +

Wenn es notwendig ist eine Zuweisung in einem bedingten Ausdruck einzusetzen, ist es verbreitet, diese mit runden Klammern einzuklammern. Zum Beispiel:

+ +
if ((x = y)) {
+  // do the right thing
+}
+ +

Andernfalls kann es sein, dass eigentliche eine Vergleichsoperation gemeint war (z. B. == oder ===):

+ +
if (x == y) {
+  // do the right thing
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/for-each-in_loops_are_deprecated/index.html b/files/de/web/javascript/reference/fehler/for-each-in_loops_are_deprecated/index.html new file mode 100644 index 0000000000..2651ea45ba --- /dev/null +++ b/files/de/web/javascript/reference/fehler/for-each-in_loops_are_deprecated/index.html @@ -0,0 +1,168 @@ +--- +title: 'Warning: JavaScript 1.6''s for-each-in loops are deprecated' +slug: Web/JavaScript/Reference/Fehler/For-each-in_loops_are_deprecated +tags: + - JavaScript + - Warning +translation_of: Web/JavaScript/Reference/Errors/For-each-in_loops_are_deprecated +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: JavaScript 1.6's for-each-in loops are deprecated; consider using ES6 for-of instead
+
+ +

Fehlertyp

+ +

Warnung

+ +

Was ist falsch gelaufen?

+ +

Das {{jsxref("Statements/for_each...in", "for each (variable in obj)")}} Statement aus JavaScript 1.6 ist veraltet und wird in naher Zukunft entfernt.

+ +

Beispiele

+ +

Objektiteration

+ +

{{jsxref("Statements/for_each...in", "for each...in")}} wurde eingesetzt, um über spezifizierte Objektwerte zu iterieren.

+ +

Veraltete Syntax

+ +
var object = { a: 10, b: 20 };
+
+for each (var x in object) {
+  console.log(x);        // 10
+                         // 20
+}
+
+ +

Alternative Standardsyntax

+ +

Man kann die Standardschleife {{jsxref("Statements/for...in", "for...in")}} benutzen, um über spezifizierte Objektschlüssel zu iterieren und jeden Wert in der Schleife auszulesen:

+ +
var object = { a: 10, b: 20 };
+
+for (var key in object) {
+  var x = object[key];
+  console.log(x);        // 10
+                         // 20
+}
+
+ +

Oder man benutzt {{jsxref("Statements/for...of", "for...of")}} (ES2015) und {{jsxref("Object.values")}} (ES2017), um ein Array von spezifizerten Werten zu bekommen und über diese zu iterieren:

+ +
var object = { a: 10, b: 20 };
+
+for (var x of Object.values(object)) {
+  console.log(x);        // 10
+                         // 20
+}
+
+ +

Arrayiteration

+ +

{{jsxref("Statements/for_each...in", "for each...in")}} wurde eingesetzt, um über spezifizierte Arrayelemente zu iterieren.

+ +

Veraltete Syntax

+ +
var array = [10, 20, 30];
+
+for each (var x in array) {
+  console.log(x);        // 10
+                         // 20
+                         // 30
+}
+
+ +

Alternative Standardsyntax

+ +

Dieses ist mit der {{jsxref("Statements/for...of", "for...of Schleife")}} (ES2015) möglich.

+ +
var array = [10, 20, 30];
+
+for (var x of array) {
+  console.log(x);        // 10
+                         // 20
+                         // 30
+}
+
+ +

Iterieren über ein Arrays oder null

+ +

{{jsxref("Statements/for_each...in", "for each...in")}} tut nichts, wenn der übergebene Wert null oder undefined ist. {{jsxref("Statements/for...of", "for...of")}} erzeugt in diesem Fall einen Fehler.

+ +

Veraltete Syntax

+ +
function func(array) {
+  for each (var x in array) {
+    console.log(x);
+  }
+}
+func([10, 20]);        // 10
+                       // 20
+func(null);            // prints nothing
+func(undefined);       // prints nothing
+
+ +

Alternative Standardsyntax

+ +

Um das {{jsxref("Statements/for_each...in", "for each...in")}} Statement neu zu schreibe, so dass null oder undefined mit {{jsxref("Statements/for...of", "for...of")}} funktionieren, muss eine Bedingung um {{jsxref("Statements/for...of", "for...of")}} verfasst werden.

+ +
function func(array) {
+  if (array) {
+    for (var x of array) {
+      console.log(x);
+    }
+  }
+}
+func([10, 20]);        // 10
+                       // 20
+func(null);            // prints nothing
+func(undefined);       // prints nothing
+
+ +

Über Objekt-Schlüssel-Werte-Paare iterieren

+ +

Veraltete Syntax

+ +

Es gibt eine veraltete Dialekt, der das Iterieren über Objekt-Schlüssel-Werte-Paare mit {{jsxref("Statements/for_each...in", "for each...in")}} und mit dem veralteten {{jsxref("Iterator")}} Objekt erlaubt.

+ +
var object = { a: 10, b: 20 };
+
+for each (var [key, value] in Iterator(object)) {
+  console.log(key, value);  // "a", 10
+                            // "b", 20
+}
+
+ +

Alternative Standardsyntax

+ +

Man kann die Standardschleife {{jsxref("Statements/for...in", "for...in")}} benutzen, um über spezifizierte Objektschlüssel zu iterieren und jeden Wert in der Schleife auszulesen:

+ +
var object = { a: 10, b: 20 };
+
+for (var key in object) {
+  var value = object[key];
+  console.log(key, value);  // "a", 10
+                            // "b", 20
+}
+
+ +

Oder man benutzt {{jsxref("Statements/for...of", "for...of")}} (ES2015) und {{jsxref("Object.values")}} (ES2017), um ein Array von spezifizerten Werten zu bekommen und über diese zu iterieren:

+ +
var object = { a: 10, b: 20 };
+
+for (var [key, value] of Object.entries(object)) {
+  console.log(key, value);  // "a", 10
+                            // "b", 20
+}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/getter_only/index.html b/files/de/web/javascript/reference/fehler/getter_only/index.html new file mode 100644 index 0000000000..268ee0cbf1 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/getter_only/index.html @@ -0,0 +1,83 @@ +--- +title: 'TypeError: setting getter-only property "x"' +slug: Web/JavaScript/Reference/Fehler/Getter_only +tags: + - Error + - Errors + - JavaScript + - Strict Mode + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Getter_only +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: setting getter-only property "x" (Firefox)
+TypeError: Cannot set property "prop" of #<Object> which has only a getter (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}} nur im strict mode.

+ +

Was ist falsch gelaufen?

+ +

Wenn versucht wird einen neuen Wert einer Wichenschaft zuzuweisen, welche nur als Getter spezifiziert wurde. Wenn kein strict mode verwendet wird, wird dieses stillschweigend ignoriert, während im strict mode ein {{jsxref("TypeError")}} erzeugt wird.

+ +

Beispiele

+ +

Das folgende Beispiel zeigt, wie eine Eigenschaft als Getter eingestellt wird. Es wird kein Setter definiert, so dass ein TypeError erzeugt wird, wenn die temperature Eigenschaft mit dem Wert 30 beschrieben werden soll. Für mehr Details siehe auf der {{jsxref("Object.defineProperty()")}} Seite.

+ +
"use strict";
+
+function Archiver() {
+  var temperature = null;
+  Object.defineProperty(this, 'temperature', {
+    get: function() {
+      console.log('get!');
+      return temperature;
+    }
+  });
+}
+
+var arc = new Archiver();
+arc.temperature; // 'get!'
+
+arc.temperature = 30;
+// TypeError: setting getter-only property "temperature"
+ +

Um den Fehler zu beheben, muss einefach die Zeile 16 entfernt werden, weil dort der Versuch ist die temperature Eigenschaft zu beschreiben, oder es muss ein Setter definiert werden, wie zum Beispiel dieser:

+ +
"use strict";
+
+function Archiver() {
+  var temperature = null;
+  var archive = [];
+
+  Object.defineProperty(this, 'temperature', {
+    get: function() {
+      console.log('get!');
+      return temperature;
+    },
+    set: function(value) {
+      temperature = value;
+      archive.push({ val: temperature });
+    }
+  });
+
+  this.getArchive = function() { return archive; };
+}
+
+var arc = new Archiver();
+arc.temperature; // 'get!'
+arc.temperature = 11;
+arc.temperature = 13;
+arc.getArchive(); // [{ val: 11 }, { val: 13 }]
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/identifier_after_number/index.html b/files/de/web/javascript/reference/fehler/identifier_after_number/index.html new file mode 100644 index 0000000000..64cb9cdfe3 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/identifier_after_number/index.html @@ -0,0 +1,53 @@ +--- +title: 'SyntaxError: identifier starts immediately after numeric literal' +slug: Web/JavaScript/Reference/Fehler/Identifier_after_number +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Identifier_after_number +--- +
{{JSSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: identifier starts immediately after numeric literal (Firefox)
+SyntaxError: Unexpected number (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Die Namen von Variablen, {{Glossary("Identifier", "Bezeichner")}} genannt, haben einige Regeln, die der Code erfüllen muss.

+ +

Ein Bezeichner in JavaScript muss mit einem Buchstaben, einem Unterstrich (_) oder einem Dollarzeichen ($) starten. Er kann nicht mit einer Ziffer beginnen. Nur nachfolgende Zeichen sind Ziffern (0-9).

+ +

Beispiele

+ +

Variablenname der mit einer Ziffer beginnt

+ +

Variablennamen dürfen in JavaScript nicht mit einer Zahl beginnen. Das folgende wird nciht funktionieren:

+ +
var 1life = 'foo';
+// SyntaxError: identifier starts immediately after numeric literal
+
+var foo = 1life;
+// SyntaxError: identifier starts immediately after numeric literal
+
+ +

Man muss die Variable neu benenne, um die führende Zahl im Namen zu vermeiden.

+ +
var life1 = 'foo';
+var foo = life1;
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/illegal_character/index.html b/files/de/web/javascript/reference/fehler/illegal_character/index.html new file mode 100644 index 0000000000..e0c083022c --- /dev/null +++ b/files/de/web/javascript/reference/fehler/illegal_character/index.html @@ -0,0 +1,80 @@ +--- +title: 'SyntaxError: illegal character' +slug: Web/JavaScript/Reference/Fehler/Illegal_character +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Illegal_character +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: illegal character (Firefox)
+SyntaxError: Invalid or unexpected token (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt ein nicht valides oder nicht erwartetes Token, welches nicht an eine Position im Code passt. Man sollte einen Editor mit Syntaxhighlighting benutzten und vorsichtig nach Verwechselungen suchen, wie einem Minuszeichen ( - ) und einem Dashzeichen () oder einfachen Anführungszeichen ( " ) und anderen Anführungszeichen ().

+ +

Beispiele

+ +

Verwechseltes Zeichen

+ +

Einige Zeichen sehen sehr ähnlich aus, aber führen dazu, dass der Code nicht interpretiert werden kann. Bekannte Beispiele dafür sind Anführungszeichen, das Minus oder das Semikolon (griechisches Fragezeichen (U+37e) sieht genauso aus)

+ +
“This looks like a string”;  // SyntaxError: illegal character
+                             // “ und ” sind nicht ", aber sehen so aus
+
+42 – 13;                     // SyntaxError: illegal character
+                             // – sind nicht -, aber sieht so aus
+
+var foo = 'bar';             // SyntaxError: illegal character
+                             // <37e> sind nicht ;, aber sieht so aus
+
+ +

Das funktioniert:

+ +
"This is actually a string";
+42 - 13;
+var foo = 'bar';
+
+ +

Einige Editoren und IDEs werden darauf hinweisen oder dieses anderes hervorheben, aber nicht alle. Wenn manchmal so etwas im Code passiert und man in der Lage ist das Problem zu finden, ist es oft das beste die Zeile zu löschen und sie neu einzutippen.

+ +

Vergessene Zeichen

+ +

Es passiert schnell, dass man ein Zeichen vergisst.

+ +
var colors = ['#000', #333', '#666'];
+// SyntaxError: illegal character
+
+ +

Man muss das fehlende Anführungszeichen ergänzen '#333'.

+ +
var colors = ['#000', '#333', '#666'];
+ +

Nicht sichtbare Zeichen

+ +

Beim Kopieren und Einfügen von Code aus externen Quellen kann es nicht valide Zeichen geben. Zum Beispiel:

+ +
var foo = 'bar';​
+// SyntaxError: illegal character
+
+ +

Wenn man den Code in einem Editor wie Vim anschaut, bemerkt man, dass ein breitenloses Leerzeichen (ZWSP) (U+200B) benutzt wird.

+ +
var foo = 'bar';​<200b>
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/in_operator_no_object/index.html b/files/de/web/javascript/reference/fehler/in_operator_no_object/index.html new file mode 100644 index 0000000000..6bace66437 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/in_operator_no_object/index.html @@ -0,0 +1,72 @@ +--- +title: 'TypeError: cannot use ''in'' operator to search for ''x'' in ''y''' +slug: Web/JavaScript/Reference/Fehler/in_operator_no_object +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/in_operator_no_object +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: right-hand side of 'in' should be an object, got 'x' (Firefox)
+TypeError: cannot use 'in' operator to search for 'x' in 'y' (Firefox, Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Der in Operator kan nur für das Prüfen von Eigenschaften in Objekten genutzt werden. Man kann nicht in Strings, Nummern oder anderen primitiven Typen suchen.

+ +

Beispiele

+ +

Suchen in Strings

+ +

Im Vergleich zu anderen Programmiersprachen (z. B. Python) kann in Strings nicht mit dem in Operator gesucht werden.

+ +
"Hello" in "Hello World";
+// TypeError: cannot use 'in' operator to search for 'Hello' in 'Hello World'
+ +

Stattdessen kann zum Beispiel {{jsxref("String.prototype.indexOf()")}} eingesetzt werden.

+ +
"Hello World".indexOf("Hello") !== -1;
+// true
+ +

Der Operand kann nicht null oder undefined sein

+ +

Man muss sicherstellen, dass der Operand nicht {{jsxref("null")}} oder {{jsxref("undefined")}} ist.

+ +
var foo = null;
+"bar" in foo;
+// TypeError: cannot use 'in' operator to search for 'bar' in 'foo' (Chrome)
+// TypeError: right-hand side of 'in' should be an object, got null (Firefox)
+
+ +

Der in Operator erwartet immer ein Objekt.

+ +
var foo = { baz: "bar" };
+"bar" in foo; // false
+
+"PI" in Math; // true
+"pi" in Math; // false
+
+ +

Suchen in Arrays

+ +

Man muss vorsichtig sein, wenn der in Operator in {{jsxref("Array")}} Objekten genutzt wird. Der in Operator prüft die Indexnummern, aber nicht die Werte des Indizes.

+ +
var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
+3 in trees; // true
+"oak" in trees; // false
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/index.html b/files/de/web/javascript/reference/fehler/index.html new file mode 100644 index 0000000000..67809031e7 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/index.html @@ -0,0 +1,29 @@ +--- +title: JavaScript Fehler Referenz +slug: Web/JavaScript/Reference/Fehler +tags: + - Debugging + - Error + - Errors + - Exception + - JavaScript + - exceptions +translation_of: Web/JavaScript/Reference/Errors +--- +

{{jsSidebar("Errors")}}

+ +

Unten ist eine Liste von Fehlern, die in JavaScript auftauchen können. Diese Fehler können beim Debuggen hilfreich sein, jedoch sind die Probleme nicht immer so klar. Die untenstehenden Seiten enthalten Details zu diesen Fehlern. Jeder Fehler ist ein Objekt, welches auf dem {{jsxref("Error")}} Objekt basieren und haben einen name und eine Fehlermeldung (message).

+ +

Fehler die in der Webconsole angezeigt werden enthalten manchmal einen Link zu einer der untenstehenden Seiten, um die Lösung von Problemen zu beschleunigen.

+ +

Liste von Fehlern

+ +

In dieser Liste ist jede Seite mit einem Namen (der Typ des Fehlers) und einer Fehlermeldung (eine detailliertere, verständlichere Meldung) aufgeführt. Diese beiden Eigenschaften eines Fehlers sind ein Einstiegspunkt für das Verständnis und das Lösen des Fehlers. Für mehr Informationen folge den folgenden Links!

+ +

{{ListSubPages("/en-US/docs/Web/JavaScript/Reference/Errors")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_array_length/index.html b/files/de/web/javascript/reference/fehler/invalid_array_length/index.html new file mode 100644 index 0000000000..34edeb2969 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_array_length/index.html @@ -0,0 +1,77 @@ +--- +title: 'RangeError: invalid array length' +slug: Web/JavaScript/Reference/Fehler/Invalid_array_length +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Invalid_array_length +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: invalid array length (Firefox)
+RangeError: Invalid array length (Chrome)
+RangeError: Invalid array buffer length (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

entweder:

+ + + +

Warum ist die Länge von Array and ArrayBuffer limitiert? Die length Eigenschaft von Array und ArrayBuffer ist mit einem vorzeichenlosen 32-bit Integer definiert, sodass nur Werte von 0 bis 232-1 gültig sind.

+ +

Wenn man ein Array mit dem Konstruktor erzeugen möchte, statt mit der Literalnotation, sollte man aufpassem, dass das erste Argument als Länge des Arrays interpretiert wird.

+ +

Man sollte die Länge festlegen, bevor man die length Eigenschaft setzt, oder mit dem ersten Argument im Konstruktor.

+ +

Beispiele

+ +

Ungültige Fälle

+ +
new Array(Math.pow(2, 40))
+new Array(-1)
+new ArrayBuffer(Math.pow(2, 32))
+new ArrayBuffer(-1)
+
+let a = [];
+a.length = a.length - 1;         // length Eigenschaft auf -1 gesetzt
+
+let b = new Array(Math.pow(2, 32) - 1);
+b.length = b.length + 1;         // length Eigenschaft auf 2^32 gesetzt
+
+ +

Gültige Fälle

+ +
[ Math.pow(2, 40) ]                     // [ 1099511627776 ]
+[ -1 ]                                  // [ -1 ]
+new ArrayBuffer(Math.pow(2, 32) - 1)
+new ArrayBuffer(0)
+
+let a = [];
+a.length = Math.max(0, a.length - 1);
+
+let b = new Array(Math.pow(2, 32) - 1);
+b.length = Math.min(0xffffffff, b.length + 1);
+
+// 0xffffffff ist die hexadecimal Notation für 2^32 - 1
+// kann auch als (-1 >>> 0) geschrieben werden
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_assignment_left-hand_side/index.html b/files/de/web/javascript/reference/fehler/invalid_assignment_left-hand_side/index.html new file mode 100644 index 0000000000..6e727fb9a2 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_assignment_left-hand_side/index.html @@ -0,0 +1,53 @@ +--- +title: 'ReferenceError: invalid assignment left-hand side' +slug: Web/JavaScript/Reference/Fehler/Invalid_assignment_left-hand_side +tags: + - Errors + - JavaScript + - ReferenceError +translation_of: Web/JavaScript/Reference/Errors/Invalid_assignment_left-hand_side +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
ReferenceError: invalid assignment left-hand side
+
+ +

Fehlertyp

+ +

{{jsxref("ReferenceError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es gibt irgendwo eine unerwartete Zuweisung. Das kann zum Beispiel durch eine nicht Übereinstimmung des Zuweisungsoperators und eines Vergleichsoperators hervorgerufen werden. Während ein einzelnes "=" Zeichen einer Variable einen Wert zuweist, vergleichen  "==" und "===" zwei Werte.

+ +

Beispiele

+ +
if (Math.PI = 3 || Math.PI = 4) {
+  console.log('no way!');
+}
+// ReferenceError: invalid assignment left-hand side
+
+var str = 'Hello, '
++= 'is it me '
++= 'you\'re looking for?';
+// ReferenceError: invalid assignment left-hand side
+ +

In dem if Statement wird ein Vergleichsoperator ("==") und für die Stringverkettung ein plus ("+") Operator benötigt.

+ +
if (Math.PI == 3 || Math.PI == 4) {
+  console.log('no way!');
+}
+
+var str = 'Hello, '
++ 'from the '
++ 'other side!';
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_const_assignment/index.html b/files/de/web/javascript/reference/fehler/invalid_const_assignment/index.html new file mode 100644 index 0000000000..812577360a --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_const_assignment/index.html @@ -0,0 +1,90 @@ +--- +title: 'TypeError: invalid assignment to const "x"' +slug: Web/JavaScript/Reference/Fehler/Invalid_const_assignment +tags: + - Error + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Invalid_const_assignment +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: invalid assignment to const "x" (Firefox)
+TypeError: Assignment to constant variable. (Chrome)
+TypeError: Redeclaration of const 'x' (IE/Edge)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Eine Konstante ist ein Wert, der nicht von einem Programm während der normalen Ausführung, geändert werden kann. Sie kann nicht durch erneutes Zuweisen und Neudeklarationen geändert werden. In JavaScript werden Konstanten mit dem const Schlüsselwort deklariert.

+ +

Beispiel

+ +

Nicht valide Neudeklaration

+ +

Weist eine Konstanten erneut einen Wert zu. Führt zu einem Fehler.

+ +
const COLUMNS = 80;
+
+// ...
+
+COLUMNS = 120; // TypeError: invalid assignment to const `COLUMNS'
+ +

Den Fehler auflösen

+ +

Es gibt mehrere Optionen, um den Fehler zu vermeiden. Überprüfen Sie, was mit der betreffenden Konstante erreicht werden sollte.

+ +

Umbenennen

+ +

Wenn Sie eine andere Konstante deklarieren möchten, wählen Sie einen anderen Namen und benennen Sie ihn um. Dieser konstante Name ist dann in diesem Bereich vergeben.

+ +
const COLUMNS = 80;
+const WIDE_COLUMNS = 120;
+ +

const, let or var?

+ +

Verwenden Sie nicht const, wenn Sie keine Konstante deklarieren wollten. Vielleicht soll eine Blockvariable mit let oder eine globale Variable mit var deklariert werden.

+ +
let columns = 80;
+
+// ...
+
+let columns = 120;
+
+ +

Gültigkeitsbereich

+ +

Prüfen Sie, ob Sie im richtigen Gültigkeitsbereich sind. Sollte diese Konstante in diesen Gültigkeitsbereich oder sollte diese zum Beispiel in eine Funktion.

+ +
const COLUMNS = 80;
+
+function setupBigScreenEnvironment() {
+  const COLUMNS = 120;
+}
+ +

const und Unveränderlichkeit

+ +

Die const Deklaration erstellt eine nur lesbare Referenz zu einem Wert. Das bedeutet nicht, dass der enthaltene Wert Unveränderbar ist, sondern nur, dass der Bezeichner nicht neu definiert werden kann. Wenn die Konstante zum Beispiel ein Objekt ist, kann das Objekt selbst verändert werden. Es bedeutet nur, dass der Wert in der Variable nicht verändert werden kann.

+ +
const obj = {foo: 'bar'};
+obj = {foo: 'baz'}; // TypeError: invalid assignment to const `obj'
+
+ +

Aber man kann die Eigenschaften der Variable verändern:

+ +
obj.foo = 'baz';
+obj; // Object { foo: "baz" }
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_date/index.html b/files/de/web/javascript/reference/fehler/invalid_date/index.html new file mode 100644 index 0000000000..04954fe28f --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_date/index.html @@ -0,0 +1,54 @@ +--- +title: 'RangeError: invalid date' +slug: Web/JavaScript/Reference/Fehler/Invalid_date +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Invalid_date +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: invalid date (Firefox)
+RangeError: invalid time value (Chrome)
+RangeError: Provided date is not in valid range (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist schief gelaufen?

+ +

Eine Zeichenfolge, die ein ungültiges Datum enthält, wurde  {{jsxref("Date")}} oder {{jsxref("Date.parse()")}} übergeben.

+ +

Beispiele

+ +

Nicht valide Fälle

+ +

Nicht erkennbare Strings oder Daten, welche nicht erlaubte Elementewerte im ISO formatierten String enthalten, geben gewöhnlich {{jsxref("NaN")}} zurück. Abhängig von der Implementierung kann es auch sein, dass nicht valide ISO Formate, einen RangeError: invalid date erzeugen, wie die folgenden Fällen in Firefox:

+ +
new Date('foo-bar 2014');
+new Date('2014-25-23').toISOString();
+new Date('foo-bar 2014').toString();
+
+ +

Das folgende gibt in Firefox {{jsxref("NaN")}} zurück.

+ +
Date.parse('foo-bar 2014'); // NaN
+ +

Für mehr Details, sollte die {{jsxref("Date.parse()")}} Dokumentation angesehen werden.

+ +

Valide Fälle

+ +
new Date('05 October 2011 14:48 UTC');
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_for-in_initializer/index.html b/files/de/web/javascript/reference/fehler/invalid_for-in_initializer/index.html new file mode 100644 index 0000000000..bc4bf80c70 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_for-in_initializer/index.html @@ -0,0 +1,74 @@ +--- +title: 'SyntaxError: for-in loop head declarations may not have initializers' +slug: Web/JavaScript/Reference/Fehler/Invalid_for-in_initializer +tags: + - Error + - JavaScript + - Strict Mode + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Invalid_for-in_initializer +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: for-in loop head declarations may not have initializers (Firefox)
+
+SyntaxError: for-in loop variable declaration may not have an initializer. (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}} nur im Strict Mode.

+ +

Was ist falsch gelaufen?

+ +

Der Kopf einer for...in Schleife enthält einen Initialisierungsausdruck. Das ist, wenn eine Variable deklariert und mit einem Wert initialisiert wird (for(var i = 0 in obj)). Ohne Strict Mode wird die Initialisierung still ignoriert und verhält sich wie for(var i in obj). Im Strict Mode wird ein SyntaxError erzeugt.

+ +

Beispiele

+ +

Das Beispiel erzeugt einen SyntaxError:

+ +
"use strict";
+
+var obj = {a: 1, b: 2, c: 3 };
+
+for (var i = 0 in obj) {
+  console.log(obj[i]);
+}
+
+// SyntaxError: for-in loop head declarations may not have initializers
+
+ +

Valide for-in Schleife

+ +

Man kann die Initialisierung (i = 0) im Kopf der for-in Schleife entfernen.

+ +
"use strict";
+
+var obj = {a: 1, b: 2, c: 3 };
+
+for (var i in obj) {
+  console.log(obj[i]);
+}
+
+ +

Array Iteration

+ +

Die for...in Schleife sollte nicht für Array Iterationen benutzt werden. Zum Iterieren von durch ein {{jsxref("Array")}} sollte eine for Schleife statt einer for-in Schleife benutzt werden. Die for Schleife erlaubt es dann auch eine Initialisierung vorzunehmen:

+ +
var arr = [ "a", "b", "c" ]
+
+for (var i = 2; i < arr.length; i++) {
+  console.log(arr[i]);
+}
+
+// "c"
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_for-of_initializer/index.html b/files/de/web/javascript/reference/fehler/invalid_for-of_initializer/index.html new file mode 100644 index 0000000000..3270387357 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_for-of_initializer/index.html @@ -0,0 +1,63 @@ +--- +title: >- + SyntaxError: a declaration in the head of a for-of loop can't have an + initializer +slug: Web/JavaScript/Reference/Fehler/Invalid_for-of_initializer +tags: + - Error + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Invalid_for-of_initializer +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: a declaration in the head of a for-of loop can't have an initializer (Firefox)
+
+SyntaxError: for-of loop variable declaration may not have an initializer. (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was falsch gelaufen ist?

+ +

Der Kopf einer for...of Schleife enthält einen Initialisierungsausdruck. Das ist eine Variable die deklariert und initialisiert wird |for (var i = 0 of iterable)|. Dieses ist nicht erlaubt in for...of Schleifen. Manchmal ist eine for Schleife gemeint, die eine Initialisierung erlaubt.

+ +

Beispiele

+ +

Nicht valide for...of Schleife

+ +
let iterable = [10, 20, 30];
+
+for (let value = 50 of iterable) {
+  console.log(value);
+}
+
+// SyntaxError: a declaration in the head of a for-of loop can't
+// have an initializer
+ +

Valide for...of Schleife

+ +

Man muss die Initialisierung (value = 50) im Kopf der for...of Schleife entfernen. Wenn 50 als Offset gedacht ist, kann man eine Addition in den Körper der Schleife verschieben, wie im folgenden Beispiel:

+ +
let iterable = [10, 20, 30];
+
+for (let value of iterable) {
+  value += 50;
+  console.log(value);
+}
+// 60
+// 70
+// 80
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/invalid_right_hand_side_instanceof_operand/index.html b/files/de/web/javascript/reference/fehler/invalid_right_hand_side_instanceof_operand/index.html new file mode 100644 index 0000000000..771838b428 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/invalid_right_hand_side_instanceof_operand/index.html @@ -0,0 +1,62 @@ +--- +title: 'TypeError: invalid ''instanceof'' operand ''x''' +slug: Web/JavaScript/Reference/Fehler/invalid_right_hand_side_instanceof_operand +tags: + - Error + - Errors + - JavaScript + - Reference + - TypeError +translation_of: Web/JavaScript/Reference/Errors/invalid_right_hand_side_instanceof_operand +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: invalid 'instanceof' operand "x" (Firefox)
+TypeError: "x" is not a function (Firefox)
+TypeError: Right-hand side of 'instanceof' is not an object (Chrome)
+TypeError: Right-hand side of 'instanceof' is not callable (Chrome)
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Der instanceof Operator erwartet als rechten Operand einen Konstruktorobjekt, z. B. ein Objekt, welches eine prototype Eigenschaft hat und aufrufbar ist.

+ +

Beispiele

+ +
"test" instanceof ""; // TypeError: invalid 'instanceof' operand ""
+42 instanceof 0;      // TypeError: invalid 'instanceof' operand 0
+
+function Foo() {}
+var f = Foo();        // Foo() is called and returns undefined
+var x = new Foo();
+
+x instanceof f;       // TypeError: invalid 'instanceof' operand f
+x instanceof x;       // TypeError: x is not a function
+
+ +

Um diesen Fehler zu beheben, kann entweder der instanceof Operator durch einen typeof Operator ersetzt werden, oder man muss sicher stellen, dass ein Funktionsname statt einem Resultat seines Aufrufes benutzt werden.

+ +
typeof "test" == "string"; // true
+typeof 42 == "number"      // true
+
+function Foo() {}
+var f = Foo;               // Do not call Foo.
+var x = new Foo();
+
+x instanceof f;            // true
+x instanceof Foo;          // true
+
+ +

Siehe auch

+ + + +

 

diff --git a/files/de/web/javascript/reference/fehler/is_not_iterable/index.html b/files/de/web/javascript/reference/fehler/is_not_iterable/index.html new file mode 100644 index 0000000000..21460882c7 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/is_not_iterable/index.html @@ -0,0 +1,103 @@ +--- +title: 'TypeError: ''x'' is not iterable' +slug: Web/JavaScript/Reference/Fehler/is_not_iterable +tags: + - Error + - JavaScript + - Reference + - TypeError +translation_of: Web/JavaScript/Reference/Errors/is_not_iterable +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: 'x' is not iterable (Firefox, Chrome)
+TypeError: 'x' is not a function or its return value is not iterable (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Der Wert, welcher auf der rechten Seite von for…of oder als Argument einer Funktion wie {{jsxref("Promise.all")}} oder {{jsxref("TypedArray.from")}} ist kein iterierbares Objekt. Ein iterierbares Objekt kann vom Standardtypen wie {{jsxref("Array")}}, {{jsxref("String")}} oder {{jsxref("Map")}} sein oder ein Objekt, welches das iterable Protokoll implementiert.

+ +

Beispiele

+ +

Über Objekteigenschaften iterieren

+ +

In JavaScript sind {{jsxref("Object", "Objekte")}} nicht iterierbar, außer sie implementieren das iterable Protokoll. Demnach kann man for…of nicht für das Iterieren von Objekteigenschaften benutzen.

+ +
var obj = { 'France': 'Paris', 'England': 'London' };
+for (let p of obj) { // TypeError: obj is not iterable
+    // …
+}
+
+ +

Stattdessen kann man {{jsxref("Object.keys")}} oder {{jsxref("Object.entries")}} benutzen, um über die Eigenschaften oder Einträge zu iterieren.

+ +
var obj = { 'France': 'Paris', 'England': 'London' };
+// Iterate over the property names:
+for (let country of obj.keys()) {
+    var capital = obj[country];
+    console.log(country, capital);
+}
+
+for (const [country, capital] of obj.entries())
+    console.log(country, capital);
+
+ +

Eine andere Option ist in diesem Fall der Einsatz einer {{jsxref("Map")}}:

+ +
var map = new Map;
+map.set('France', 'Paris');
+map.set('England', 'London');
+// Iterate over the property names:
+for (let country of map.keys()) {
+    let capital = map[country];
+    console.log(country, capital);
+}
+
+for (let capital of map.values())
+    console.log(capital);
+
+for (const [country, capital] of map.entries())
+    console.log(country, capital);
+
+ +

Über einen Generator iterieren

+ +

Generatoren sind Funktionen welche aufgerufen werden, um ein iterierbares Objekt zu produzieren.

+ +
function* generate(a, b) {
+  yield a;
+  yield b;
+}
+
+for (let x of generate) // TypeError: generate is not iterable
+    console.log(x);
+
+ +

Wenn dieser nicht aufgerufen wird, ist das korrespondierende {{jsxref("Function")}} Objekt des Generators aufrufbar, aber nicht iterierbar. Aufrufen des Generators Produziert ein iterierbares Objekt, welche über die Werte iteriert, die während der Ausführung des Generators zurückgegeben werden.

+ +
function* generate(a, b) {
+    yield a;
+    yield b;
+}
+
+for (let x of generate(1,2))
+    console.log(x);
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/json_bad_parse/index.html b/files/de/web/javascript/reference/fehler/json_bad_parse/index.html new file mode 100644 index 0000000000..0aa5e6bdae --- /dev/null +++ b/files/de/web/javascript/reference/fehler/json_bad_parse/index.html @@ -0,0 +1,112 @@ +--- +title: 'SyntaxError: JSON.parse: bad parsing' +slug: Web/JavaScript/Reference/Fehler/JSON_bad_parse +tags: + - Errors + - JSON + - JavaScript + - Method + - Property + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/JSON_bad_parse +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: JSON.parse: unterminated string literal
+SyntaxError: JSON.parse: bad control character in string literal
+SyntaxError: JSON.parse: bad character in string literal
+SyntaxError: JSON.parse: bad Unicode escape
+SyntaxError: JSON.parse: bad escape character
+SyntaxError: JSON.parse: unterminated string
+SyntaxError: JSON.parse: no number after minus sign
+SyntaxError: JSON.parse: unexpected non-digit
+SyntaxError: JSON.parse: missing digits after decimal point
+SyntaxError: JSON.parse: unterminated fractional number
+SyntaxError: JSON.parse: missing digits after exponent indicator
+SyntaxError: JSON.parse: missing digits after exponent sign
+SyntaxError: JSON.parse: exponent part is missing a number
+SyntaxError: JSON.parse: unexpected end of data
+SyntaxError: JSON.parse: unexpected keyword
+SyntaxError: JSON.parse: unexpected character
+SyntaxError: JSON.parse: end of data while reading object contents
+SyntaxError: JSON.parse: expected property name or '}'
+SyntaxError: JSON.parse: end of data when ',' or ']' was expected
+SyntaxError: JSON.parse: expected ',' or ']' after array element
+SyntaxError: JSON.parse: end of data when property name was expected
+SyntaxError: JSON.parse: expected double-quoted property name
+SyntaxError: JSON.parse: end of data after property name when ':' was expected
+SyntaxError: JSON.parse: expected ':' after property name in object
+SyntaxError: JSON.parse: end of data after property value in object
+SyntaxError: JSON.parse: expected ',' or '}' after property value in object
+SyntaxError: JSON.parse: expected ',' or '}' after property-value pair in object literal
+SyntaxError: JSON.parse: property names must be double-quoted strings
+SyntaxError: JSON.parse: expected property name or '}'
+SyntaxError: JSON.parse: unexpected character
+SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

{{jsxref("JSON.parse()")}} übersetzt einen String zu JSON. Dieser String muss eine gültiges JSON enthalten. Ist die Syntax fehlerhaft, wird dieser Error ausgegeben.

+ +

Beispiele

+ +

JSON.parse() erlaubt keine angehängten Kommata

+ +

Beide Zeilen werden einen SyntaxError erzeugen:

+ +
JSON.parse('[1, 2, 3, 4,]');
+JSON.parse('{"foo": 1,}');
+// SyntaxError JSON.parse: unexpected character
+// at line 1 column 14 of the JSON data
+
+ +

Das letzte trennende Komma muss in JSON vermieden werden:

+ +
JSON.parse('[1, 2, 3, 4]');
+JSON.parse('{"foo": 1}');
+ +

Eigenschaftsnamen müssen Strings mit doppelten Anführungszeichen sein

+ +

Man kann keine einfachen Anführungszeichen für Eigenschaften benutzen (wie 'foo').

+ +
JSON.parse("{'foo': 1}");
+// SyntaxError: JSON.parse: expected property name or '}'
+// at line 1 column 2 of the JSON data
+ +

Stattdessen muss "foo" benutzt werden:

+ +
JSON.parse('{"foo": 1}');
+ +

Führende Nullen und Dezimalpunkte

+ +

Man kann keine führenden Nullen (wie 01) benutzen. Nach Dezimalpunkten muss mindestens eine Stelle stehen.

+ +
JSON.parse('{"foo": 01}');
+// SyntaxError: JSON.parse: expected ',' or '}' after property value
+// in object at line 1 column 2 of the JSON data
+
+JSON.parse('{"foo": 1.}');
+// SyntaxError: JSON.parse: unterminated fractional number
+// at line 1 column 2 of the JSON data
+
+ +

Stattdessen schreibe man nur 1, ohne eine Null (also 1, statt 01) und nutze mindestens eine Ziffer nach dem Dezimalpunkt:

+ +
JSON.parse('{"foo": 1}');
+JSON.parse('{"foo": 1.0}');
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/malformed_formal_parameter/index.html b/files/de/web/javascript/reference/fehler/malformed_formal_parameter/index.html new file mode 100644 index 0000000000..65a89bb84a --- /dev/null +++ b/files/de/web/javascript/reference/fehler/malformed_formal_parameter/index.html @@ -0,0 +1,61 @@ +--- +title: 'SyntaxError: Malformed formal parameter' +slug: Web/JavaScript/Reference/Fehler/Malformed_formal_parameter +tags: + - Error + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Malformed_formal_parameter +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: malformed formal parameter (Firefox)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es existiert ein Function() Konstruktor mit mindestend zwei übergebenen Parametern im Quelltext. Der letzte Parameter ist der Quelltext für die neu zu erstellende Funktion. Der ganze Rest bildet die liste der Parameter der neu zu erstellenden Funktion.

+ +

Die Liste der Parameter ist manchmal nicht valide. Das kann passieren, wenn versehendlich ein Schlüsselword, wie if oder var, für die namen der Parameter verwendet werden. Ein andere Grund kann eine falsche Interpunktion in der Argumentenliste verwendet wird. Auch ein falscher Wert wie eine Zahl oder ein Objekt kann die Ursache sein.

+ +

OK, das löst mein Problem. Aber warum hast du das nicht sofort gesagt?

+ +

Zugegeben, die Formulierung in der Fehlermeldung ist etwas seltsam. "formal parameter" ist eine andere Art "Funktionsargument oder "Funktionsparameter" zu sagen. Und wir verwenden das Wort "malformed", weil alle Firefox-Ingenieure sehr große Fans des Romans Gothic Horror sind.

+ +

Beispiele

+ +

Invalide Fälle

+ +
var f = Function('x y', 'return x + y;');
+// SyntaxError (missing a comma)
+
+var f = Function('x,', 'return x;');
+// SyntaxError (extraneous comma)
+
+var f = Function(37, "alert('OK')");
+// SyntaxError (numbers can't be argument names)
+
+ +

Valide Fälle

+ +
var f = Function('x, y', 'return x + y;');  // correctly punctuated
+
+var f = Function('x', "return x;');
+
+// if you can, avoid using Function - this is much faster
+var f = function(x) { return x; };
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/malformed_uri/index.html b/files/de/web/javascript/reference/fehler/malformed_uri/index.html new file mode 100644 index 0000000000..cf831aa4a6 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/malformed_uri/index.html @@ -0,0 +1,66 @@ +--- +title: 'URIError: malformed URI sequence' +slug: Web/JavaScript/Reference/Fehler/Malformed_URI +tags: + - Error + - Errors + - JavaScript + - URIError +translation_of: Web/JavaScript/Reference/Errors/Malformed_URI +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
URIError: malformed URI sequence (Firefox)
+URIError: URI malformed (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("URIError")}}

+ +

Was ist falsch gelaufen?

+ +

Das URI-Kodieren oder -Dekodieren war nicht erfolgreich. Ein gegebenenes Argument der {{jsxref("decodeURI")}}-, {{jsxref("encodeURI")}}-, {{jsxref("encodeURIComponent")}}-, oder {{jsxref("decodeURIComponent")}}-Funktion ist nicht valide, wodurch die Funktion nicht richtig Kodieren oder Dekodieren kann.

+ +

Beispiele

+ +

Kodieren

+ +

Kodieren ersetzt bestimmte Zeichen durch eine Sequenz von einem, zwei, drei oder vier maskierten Zeichen, welche der UTF-8 Kodierung des Zeichens entsprechen. Ein {{jsxref("URIError")}} wird erzeugt, wenn versucht wird ein Zeichen zu kodieren, welches kein Teil des high-low-Paares ist, zum Beispiel:

+ +
encodeURI('\uD800');
+// "URIError: malformed URI sequence"
+
+encodeURI('\uDFFF');
+// "URIError: malformed URI sequence"
+
+ +

Ein high-low Paar ist ok. Zum Beispiel:

+ +
encodeURI('\uD800\uDFFF');
+// "%F0%90%8F%BF"
+ +

Dekodieren

+ +

Dekodieren ersetzt eine Sequenz maskierter Zeichen in einer URI-Komponente mit einem Zeichen, welches dieses repräsentiert. Wenn es kein solches Zeichen gibt, wird ein Fehler erzeugt:

+ +
decodeURIComponent('%E0%A4%A');
+// "URIError: malformed URI sequence"
+
+ +

Mit richiger Eingabe sollte es wie folgendermaßen aussehen:

+ +
decodeURIComponent('JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B');
+// "JavaScript_шеллы"
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_bracket_after_list/index.html b/files/de/web/javascript/reference/fehler/missing_bracket_after_list/index.html new file mode 100644 index 0000000000..b5fe14ae14 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_bracket_after_list/index.html @@ -0,0 +1,56 @@ +--- +title: 'SyntaxError: missing ] after element list' +slug: Web/JavaScript/Reference/Fehler/Missing_bracket_after_list +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_bracket_after_list +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing ] after element list
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}.

+ +

Was ist falsch gelaufen?

+ +

Der Syntax der Array-Initialisierung enthält einen Fehler. Wahrscheinlich fehlt eine schließende eckige Klammer ("]") oder ein Komma (",").

+ +

Beispiele

+ +

Unvollständige Arrayinitialisierung

+ +
var list = [1, 2,
+
+var instruments = [
+  'Ukulele',
+  'Guitar',
+  'Piano'
+};
+
+var data = [{foo: 'bar'} {bar: 'foo'}];
+
+ +

Richtig wäre:

+ +
var list = [1, 2];
+
+var instruments = [
+ 'Ukulele',
+ 'Guitar',
+ 'Piano'
+];
+
+var data = [{foo: 'bar'}, {bar: 'foo'}];
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_colon_after_property_id/index.html b/files/de/web/javascript/reference/fehler/missing_colon_after_property_id/index.html new file mode 100644 index 0000000000..26d515a018 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_colon_after_property_id/index.html @@ -0,0 +1,77 @@ +--- +title: 'SyntaxError: missing : after property id' +slug: Web/JavaScript/Reference/Fehler/Missing_colon_after_property_id +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_colon_after_property_id +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing : after property id
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Wenn Objekte mit der Objektinitialisierungs-Syntax erstellt werden, wird ein (:) eingesetzt, um bei Eiegenschaften Schlüssel und Werte zu trennen.

+ +
var obj = { propertyKey: 'value' };
+
+ +

Examples

+ +

Doppelpunkt vs. Gleichzeichen

+ +

Der Code funktioniert nicht, weil das Gleichzeichen nicht in dieser Form in der Objektinitialisierungs-Syntax genutzt werden kann.

+ +
var obj = { propertyKey = 'value' };
+// SyntaxError: missing : after property id
+
+ +

Richtig währe der Einsatz eines Doppelpunktes oder der Einsatz von eckigen Klammern, um eine Eigenschaft nach dem erstellen des Objektes zuzuweisen.

+ +
var obj = { propertyKey: 'value' };
+
+// or alternatively
+
+var obj = { };
+obj['propertyKey'] = 'value';
+
+ +

Leere Eigenschaften

+ +

Man kann nicht wie im Beispiel leere Eigenschaften erzeugen:

+ +
var obj = { propertyKey; };
+// SyntaxError: missing : after property id
+
+ +

Wenn eine Eigenschaft ohne Wert definiert werden soll, muss {{jsxref("null")}} als Wert genutzt werden.

+ +
var obj = { propertyKey: null };
+ +

Berechnete Eigenschaften

+ +

Wenn ein Eigenschaftsname aus einem Ausdruck berechnet wird, müssen eckige Klammern genutzt werden. Anderfalls kann der Eigenschaftname nicht errechnet werden:

+ +
var obj = { 'b'+'ar': 'foo' };
+// SyntaxError: missing : after property id
+
+ +

Man muss den Ausdruck in [] setzen:

+ +
var obj = { ['b'+'ar']: 'foo' };
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_curly_after_function_body/index.html b/files/de/web/javascript/reference/fehler/missing_curly_after_function_body/index.html new file mode 100644 index 0000000000..b5e0239a2f --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_curly_after_function_body/index.html @@ -0,0 +1,67 @@ +--- +title: 'SyntaxError: missing } after function body' +slug: Web/JavaScript/Reference/Fehler/Missing_curly_after_function_body +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_curly_after_function_body +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing } after function body
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt einen Syntaxfehler irgendwo beim erstellen von Funktionen. Man sollte prüfen, ob alle runden und geschweiften Klammern in der richtigen Reihenfolge sind. Einrückung und Formatierung des Codes hilft dabei den Fehler zu erkennen.

+ +

Beispiele

+ +

Schließende geschweifte Klammer vergessen

+ +

Oftmals fehlt eine geschweifte Klammer im Funktionsocde:

+ +
var charge = function() {
+  if (sunny) {
+    useSolarCells();
+  } else {
+    promptBikeRide();
+};
+
+ +

Richtig wäre:

+ +
var charge = function() {
+  if (sunny) {
+    useSolarCells();
+  } else {
+    promptBikeRide();
+  }
+};
+ +

Es kann deutlich verwirrender sein, wenn {{Glossary("IIFE")}}, Closures, oder andere Konstrukte, die viele verschiedene Klammern benutzt, eingesetzt werden, wie zum Beispiel:

+ +
(function() { if (true) { return false; } );
+
+ +

Oftmals hilft verschiedenes Einrücken oder doppeltes Prüfen der Einrückung, um den Fehler zu finden.

+ +
(function() {
+  if (true) {
+    return false;
+  }
+});
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_curly_after_property_list/index.html b/files/de/web/javascript/reference/fehler/missing_curly_after_property_list/index.html new file mode 100644 index 0000000000..41a82a9158 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_curly_after_property_list/index.html @@ -0,0 +1,51 @@ +--- +title: 'SyntaxError: missing } after property list' +slug: Web/JavaScript/Reference/Fehler/Missing_curly_after_property_list +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_curly_after_property_list +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing } after property list
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt irgendwo in der Objektinitialisierungs-Syntax einen Fehler. Es könnte ein vergessenes Komma sein oder eine vergessene geschweifte Klammer. Es muss auch geprüft werden, die Reihenfolge der schließenden runden und geschweiften Klammern richtig ist. Den Code richtig einzurücken und zu formatieren hilft bei der Suche nach dem Fehler.

+ +

Beispiele

+ +

Vergessenes Komma

+ +

Häufig wird ein Komma bei der Objektinitialisierung vergessen:

+ +
var obj = {
+  a: 1,
+  b: { myProp: 2 }
+  c: 3
+};
+
+ +

Richtig wäre:

+ +
var obj = {
+  a: 1,
+  b: { myProp: 2 },
+  c: 3
+};
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_formal_parameter/index.html b/files/de/web/javascript/reference/fehler/missing_formal_parameter/index.html new file mode 100644 index 0000000000..19813f9c47 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_formal_parameter/index.html @@ -0,0 +1,80 @@ +--- +title: 'SyntaxError: missing formal parameter' +slug: Web/JavaScript/Reference/Fehler/Missing_formal_parameter +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_formal_parameter +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing formal parameter (Firefox)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

"Formaler Parameter" ist eine andere Bezeichnung für Funktionsparameter. Einer Funktion fehlen valide Parameter. In der Deklaration einer Funktion müssen die Parameternamen {{Glossary("Identifier", "Bezeichner")}}, kein Wert einer Nummer, eines Strings oder eines Objektes. Deklarieren und Aufrufen von Funktionen sind zwei verschiedene Schritte. Deklarieren setzt Bezeichner als Parametername voraus und beim Ausführen (Aufrufen) der Funktion müssen Werte für die Funktion benutzt werden.

+ +

In {{glossary("JavaScript")}} können Bezeichner nur alphanumerische Zeichen (und "$" und "_") enthalten und können nicht mit einer Zahl beginnen. Ein Bezeichner unterscheidet sich von einem String, weil der String Daten sind und der Bezeichner teil des Codes.

+ +

Beispiele

+ +

Funktionsparameter müssen Bezeichner beim erstellen der Funktion sein. Alle diese Funktionsdeklarationen schlagen fehl, wenn ein Wert als Parameter benutzt wird:

+ +
function square(3) {
+  return number * number;
+};
+// SyntaxError: missing formal parameter
+
+function greet("Howdy") {
+  return greeting;
+};
+// SyntaxError: missing formal parameter
+
+function log({ obj: "value"}) {
+  console.log(arg)
+};
+// SyntaxError: missing formal parameter
+
+ +

Man muss einen Bezeichner für die Funktionsdeklarationen benutzen:

+ +
function square(number) {
+  return number * number;
+};
+
+function greet(greeting) {
+  return greeting;
+};
+
+function log(arg) {
+  console.log(arg)
+};
+ +

Danach kann man die Funktionen mit beliebigen Argumentwerten aufrufen:

+ +
square(2); // 4
+
+greet("Howdy"); // "Howdy"
+
+log({obj: "value"}); // Object { obj: "value" }
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_initializer_in_const/index.html b/files/de/web/javascript/reference/fehler/missing_initializer_in_const/index.html new file mode 100644 index 0000000000..49db779546 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_initializer_in_const/index.html @@ -0,0 +1,58 @@ +--- +title: 'SyntaxError: missing = in const declaration' +slug: Web/JavaScript/Reference/Fehler/Missing_initializer_in_const +tags: + - Error + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_initializer_in_const +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing = in const declaration (Firefox)
+SyntaxError: Missing initializer in const declaration (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Eine Konstante ist ein Wert, der während der normalen Ausführung des Programmes nicht geändert werden kann. Ihr kann kein neuer Wert zugewiesen werden und can nicht neu deklariert werden. In JavaScript werden Konstanten mit dem const Schlüsselwort deklariert. Ein Initialwert für eine Konstante wird benötigt, was bedeutet, dass der Wert im gleichen Statement wie bei der Deklaration zugewiesen werden muss (was Sinn ergibt, weil der Wert später nicht mehr geändert werden kann).

+ +

Beispiele

+ +

Fehlender Initialwert bei const

+ +

Anders wie bei var or let, muss man bei const Deklarationen einen Initialwert angeben. Folgendes erzeugt einen Fehler:

+ +
const COLUMNS;
+// SyntaxError: missing = in const declaration
+ +

Den Fehler beheben

+ +

Es gibt mehrere Möglichkeiten den Fehler zu beheben. Es muss geprüft werden, was mit der Konstanten erreicht werden soll.

+ +

Hinzufügen eines konstanten Wertes

+ +

Der Wert muss im gleichen Statement wie die Deklaration spezifiziert werden:

+ +
const COLUMNS = 80;
+ +

const, let oder var?

+ +

Es sollte kein const verwendet werden, wenn keine Konstante gemeint ist. Vielleicht ist eine Variable für den Block (let) oder eine global Variable (var) gemeint. Beide benötigen keinen Initialwert.

+ +
let columns;
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_name_after_dot_operator/index.html b/files/de/web/javascript/reference/fehler/missing_name_after_dot_operator/index.html new file mode 100644 index 0000000000..cb79bdcc03 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_name_after_dot_operator/index.html @@ -0,0 +1,68 @@ +--- +title: 'SyntaxError: missing name after . operator' +slug: Web/JavaScript/Reference/Fehler/Missing_name_after_dot_operator +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_name_after_dot_operator +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing name after . operator
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Der Punktoperator (.) wird für den Zugriff auf Eigenschaften genutzt. Man muss den Namen der Eigenschaft spezifizieren, auf den man zugreifen möchte. Um berechnete Eigenschaftsnamen zu benutzen muss statt dem Punkt eckige Klammern genutzt werden. Das erlaubt es einen Ausdruck zu berechnen. Manchmal möchte man Konkatenation stattdessen erreichen. Dafür wird ein Plusoperator (+) genutzt werden.

+ +

Beispiele

+ +

Zugriff auf Eigenschaften

+ +

Zugriff auf Eigenschaften wird in JavaScript entweder mit einem Punkt oder eckigen Klammern erreicht, aber nicht beides. Eckige Klammern erlauben es auch Eigenschaftsnamen zu berechnen.

+ +
var obj = { foo: { bar: "baz", bar2: "baz2" } };
+var i = 2;
+
+obj.[foo].[bar]
+// SyntaxError: missing name after . operator
+
+obj.foo."bar"+i;
+// SyntaxError: missing name after . operator
+
+ +

Um das Problem zu lösen, muss auf das Objekt wie folgt zugegriffen werden:

+ +
obj.foo.bar; // "baz"
+// or alternatively
+obj["foo"]["bar"]; // "baz"
+
+// computed properties require square brackets
+obj.foo["bar" + i]; // "baz2"
+
+ +

Zugriff auf Eigenschaften vs. Konkatenation

+ +

Wenn man aus einer anderen Programmiersprache kommt (z. B. {{Glossary("PHP")}}), ist es einfach den Punktoperator (.) und den Konkatenationsoperator (+) zu vermischen.

+ +
console.log("Hello" . "world");
+
+// SyntaxError: missing name after . operator
+ +

Stattdessen muss man das Pluszeichen für Konkatenation benutzen:

+ +
console.log("Hello" + "World");
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_parenthesis_after_argument_list/index.html b/files/de/web/javascript/reference/fehler/missing_parenthesis_after_argument_list/index.html new file mode 100644 index 0000000000..a3da4b9edf --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_parenthesis_after_argument_list/index.html @@ -0,0 +1,42 @@ +--- +title: 'SyntaxError: missing ) after argument list' +slug: Web/JavaScript/Reference/Fehler/Missing_parenthesis_after_argument_list +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argument_list +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing ) after argument list
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es gibt einen Fehler mit der Art wie die Funktion aufgerufen wird. Es kann sich hier zum Beispiel um einen Tippfehler, einem fehlenden Operator oder einen nicht richtig abgeschlossenen String handeln. 

+ +

Beispiele

+ +

Bei einem fehlenden "+" Operator,  um zwei Strings zu konkatinieren,erwartet JavaScript , dass nur "PI: " der Parameter für die "log" Funktion ist. Darum sollte danach die Funktion mit einer abschliessenden Klammer abgeschlossen werden. 

+ +
console.log("PI: " Math.PI);
+// SyntaxError: missing ) after argument list
+
+ +

Man kann den Fehler korrigieren, indem man den "+" Operator hinzufügt:

+ +
console.log("PI: " + Math.PI);
+// "PI: 3.141592653589793"
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_parenthesis_after_condition/index.html b/files/de/web/javascript/reference/fehler/missing_parenthesis_after_condition/index.html new file mode 100644 index 0000000000..295428a5b9 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_parenthesis_after_condition/index.html @@ -0,0 +1,70 @@ +--- +title: 'SyntaxError: missing ) after condition' +slug: Web/JavaScript/Reference/Fehler/Missing_parenthesis_after_condition +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_parenthesis_after_condition +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing ) after condition
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt einen Fehler beim schreiben einer if Bedingung. In jeder Programmiersprache benötigt man Fallunterscheidungen abhängig von Eingaben. Das if Statement führt ein Statement auf, wenn eine Bedingung true wird. In JavaScript muss diese Bedingung in runden Klammern nach dem if Schlüsselwort geschrieben werden, wie dieses:

+ +
if (condition) {
+  // do something if the condition is true
+}
+ +

Beispiele

+ +

Es könnte nur ein Versehen sein, weshalb man alle runden Klammern im Code gründlich überprüfen sollte.

+ +
if (3 > Math.PI {
+  console.log("wait what?");
+}
+
+// SyntaxError: missing ) after condition
+
+ +

Um das Problem zu beheben, muss eine schließende runde Klammer nach der Bedingung geschrieben werden.

+ +
if (3 > Math.PI) {
+  console.log("wait what?");
+}
+ +

Wenn man aus einer anderen Programmiersprache kommt, passiert es schnell, dass Schlüsselwörter benutzt werden, die in JavaScript eine andere oder garkeine Bedeutung haben.

+ +
if (done is true) {
+ console.log("we are done!");
+}
+
+// SyntaxError: missing ) after condition
+
+ +

Stattdessen muss die richtige Vergleichsoperation benutzt werden. Zum Beispiel:

+ +
if (done === true) {
+ console.log("we are done!");
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/missing_semicolon_before_statement/index.html b/files/de/web/javascript/reference/fehler/missing_semicolon_before_statement/index.html new file mode 100644 index 0000000000..dcdf35ed94 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/missing_semicolon_before_statement/index.html @@ -0,0 +1,67 @@ +--- +title: 'SyntaxError: missing ; before statement' +slug: Web/JavaScript/Reference/Fehler/Missing_semicolon_before_statement +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing ; before statement
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es fehlt irgendwo ein Semikolon (;). JavaScript Statements müssen durch ein Semikolon beendet werden. Einige Statements sind von der automatischen Semikolon Einfügung (ASI) betroffen, aber in diesem Fall muss man ein Semikolon geliefert werden, damit JavaScript den Quelltext korrekt lesen kann.

+ +

Meistens ist dieser Fehler eine Folge aus einem anderen Fehler, wie ein nicht escaptes Zeichen in einem String oder der falsche Einsatz von var.  Es kann auch sein, dass man zu viele runde Klammern benutzt. Wenn dieser Fehler auftritt, sollte die Syntax gründlich geprüft werden.

+ +

Beispiele

+ +

Nicht escapte Strings

+ +

Dieser Fehler kann leicht auftreten, wenn ein String nicht richtig escapt wird und die JavaScript-Umgebung schon das Ende eines Strings erwartet. Zum Beispiel:

+ +
var foo = 'Tom's bar';
+// SyntaxError: missing ; before statement
+ +

Man kann doppelte Anführungszeichen benutzen oder das Apostroph escapen:

+ +
var foo = "Tom's bar";
+var foo = 'Tom\'s bar';
+
+ +

Eigenschaften mit var deklarieren

+ +

Man kann Eigenschaften eines Objektes oder Arrays nicht mit einem var deklarieren.

+ +
var obj = {};
+var obj.foo = 'hi'; // SyntaxError missing ; before statement
+
+var array = [];
+var array[0] = 'there'; // SyntaxError missing ; before statement
+
+ +

Stattdessen muss das var Schlüsselwort vermieden werden:

+ +
var obj = {};
+obj.foo = 'hi';
+
+var array = [];
+array[0] = 'there';
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/more_arguments_needed/index.html b/files/de/web/javascript/reference/fehler/more_arguments_needed/index.html new file mode 100644 index 0000000000..3707c5446f --- /dev/null +++ b/files/de/web/javascript/reference/fehler/more_arguments_needed/index.html @@ -0,0 +1,48 @@ +--- +title: 'TypeError: More arguments needed' +slug: Web/JavaScript/Reference/Fehler/More_arguments_needed +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/More_arguments_needed +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: Object.create requires more than 0 arguments
+TypeError: Object.setPrototypeOf requires more than 1 argument
+TypeError: Object.defineProperties requires more than 0 arguments
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es ist ein Fehler beim Aufrufen einer Funktion aufgetaucht. Es müssen mehr Argumente übergeben werden.

+ +

Beispiele

+ +

Die {{jsxref("Object.create()")}} Methode benötigt mindestens ein Argument und die {{jsxref("Object.setPrototypeOf()")}} Methode benötigt mindestens zwei Argumente:

+ +
var obj = Object.create();
+// TypeError: Object.create requires more than 0 arguments
+
+var obj = Object.setPrototypeOf({});
+// TypeError: Object.setPrototypeOf requires more than 1 argument
+
+ +

Dieser Fehler kann behoben werden, indem {{jsxref("null")}} als Eigenschaft gesetzt wird:

+ +
var obj = Object.create(null);
+
+var obj = Object.setPrototypeOf({}, null);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/negative_repetition_count/index.html b/files/de/web/javascript/reference/fehler/negative_repetition_count/index.html new file mode 100644 index 0000000000..53c153453f --- /dev/null +++ b/files/de/web/javascript/reference/fehler/negative_repetition_count/index.html @@ -0,0 +1,44 @@ +--- +title: 'RangeError: repeat count must be non-negative' +slug: Web/JavaScript/Reference/Fehler/Negative_repetition_count +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Negative_repetition_count +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: repeat count must be non-negative (Firefox)
+RangeError: Invalid count value (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

Die {{jsxref("String.prototype.repeat()")}} Methode wurde benutzt. Sie hat einen count Parameter welche die Anzahl der Wiederholungen des Strings angibt. Dieser muss zwischen 0 und kleiner positiv {{jsxref("Infinity")}} sein und kann nicht negativ sein. Das erlaubte Intervall kann wie folgt beschrieben werden: [0, +∞).

+ +

Beispiele

+ +

Falsche Fälle

+ +
'abc'.repeat(-1); // RangeError 
+ +

Richtige Fälle

+ +
'abc'.repeat(0);    // ''
+'abc'.repeat(1);    // 'abc'
+'abc'.repeat(2);    // 'abcabc'
+'abc'.repeat(3.5);  // 'abcabcabc' (count will be converted to integer)
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/no_non-null_object/index.html b/files/de/web/javascript/reference/fehler/no_non-null_object/index.html new file mode 100644 index 0000000000..a2c897c5cd --- /dev/null +++ b/files/de/web/javascript/reference/fehler/no_non-null_object/index.html @@ -0,0 +1,66 @@ +--- +title: 'TypeError: "x" is not a non-null object' +slug: Web/JavaScript/Reference/Fehler/No_non-null_object +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/No_non-null_object +--- +
{{JSSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: "x" is not a non-null object (Firefox)
+TypeError: Property description must be an object: "x" (Chrome)
+TypeError: Invalid value used in weak set (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Ein Objekt wird erwartete aber nicht übergeben. {{jsxref("null")}} ist kein Objekt und funktioniert nicht. In dieser Situation wird ein normales Objekt erwartet.

+ +

Beispiele

+ +

Eigehscgaftsbeschreibung erwartet

+ +

Wenn Methoden wie {{jsxref("Object.create()")}} oder {{jsxref("Object.defineProperty()")}} und {{jsxref("Object.defineProperties()")}} eingesetzt werden, wird als optionale Beschreibung ein Beschreibungsobjekt erwartet. Wenn kein Objekt übergeben wird (z. B. eine Zahl), wird ein Fehler erzeugt:

+ +
Object.defineProperty({}, 'key', 1);
+// TypeError: 1 is not a non-null object
+
+Object.defineProperty({}, 'key', null);
+// TypeError: null is not a non-null object
+
+ +

Ein valides Beschreibungsobjekt kann wie folgendes aussehen:

+ +
Object.defineProperty({}, 'key', { value: 'foo', writable: false });
+
+ +

WeakMap und WeakSet Objekte benötigen Objektschlüssel

+ +

{{jsxref("WeakMap")}} und {{jsxref("WeakSet")}} Objekte speichern Objektschlüssel. Man kann keine anderen Schlüssel verwenden.

+ +
var ws = new WeakSet();
+ws.add('foo');
+// TypeError: "foo" is not a non-null object
+ +

Stattdessen sollte folgendes verwendet werden:

+ +
ws.add({foo: 'bar'});
+ws.add(window);
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/no_properties/index.html b/files/de/web/javascript/reference/fehler/no_properties/index.html new file mode 100644 index 0000000000..d5dc0328b6 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/no_properties/index.html @@ -0,0 +1,40 @@ +--- +title: 'TypeError: "x" has no properties' +slug: Web/JavaScript/Reference/Fehler/No_properties +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/No_properties +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: null has no properties
+TypeError: undefined has no properties
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}.

+ +

Was ist falsch gelaufen?

+ +

Weder {{jsxref("null")}} noch {{jsxref("undefined")}} besitzen Eigenschaften auf die man zugreifen könnte.

+ +

Beispiele

+ +
null.foo;
+// TypeError: null has no properties
+
+undefined.bar;
+// TypeError: undefined has no properties
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/no_variable_name/index.html b/files/de/web/javascript/reference/fehler/no_variable_name/index.html new file mode 100644 index 0000000000..a3b63df55d --- /dev/null +++ b/files/de/web/javascript/reference/fehler/no_variable_name/index.html @@ -0,0 +1,84 @@ +--- +title: 'SyntaxError: missing variable name' +slug: Web/JavaScript/Reference/Fehler/No_variable_name +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/No_variable_name +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: missing variable name (Firefox)
+SyntaxError: Unexpected token = (Chrome)
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Einer Variablen fehlt ein Name. Das wird zu einem {{jsxref("SyntaxError")}} im Code führen. Vermutlich ist ein Komma irgendwo falsch oder man kämpft mit einem Namen. Völlig verständlich! Dinge zu benennen ist so schwer.

+ +

Beispiele

+ +

Ein Variablenname fehlt

+ +
var = "foo";
+
+ +

Es ist schwer gute Variablennamen zu vergeben. Das geht allen so.

+ +
var ohGodWhy = "foo";
+ +

Reservierte Schlüsselwörter können kein Variablenname sein

+ +

Es gibt ein paar Namen, die reservierte Schlüsselwörter sind. Diese kann man nicht benutzen.

+ +
var debugger = "whoop";
+// SyntaxError: missing variable name
+
+ +

Deklarieren von mehreren Variablen

+ +

Man muss beim Deklarieren von mehreren Variablen besonders auf Kommas aufpassen. Gibt es ein überflüssiges Komma? Wurde aus Versehen ein Komma statt eines Semikolons verwendet?

+ +
var x, y = "foo",
+var x, = "foo"
+
+var first = document.getElementById('one'),
+var second = document.getElementById('two'),
+
+// SyntaxError: missing variable name
+
+ +

Die korrigierte Version:

+ +
var x, y = "foo";
+var x = "foo";
+
+var first = document.getElementById('one');
+var second = document.getElementById('two');
+ +

Arrays

+ +

{{jsxref("Array")}}-Literale in JavaScript benötigen eckige Klammern um die Werte. Folgendes funktioniert nicht:

+ +
var arr = 1,2,3,4,5;
+// SyntaxError: missing variable name
+
+ +

Richtig ist:

+ +
var arr = [1,2,3,4,5];
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/non_configurable_array_element/index.html b/files/de/web/javascript/reference/fehler/non_configurable_array_element/index.html new file mode 100644 index 0000000000..771f480dda --- /dev/null +++ b/files/de/web/javascript/reference/fehler/non_configurable_array_element/index.html @@ -0,0 +1,83 @@ +--- +title: 'TypeError: can''t delete non-configurable array element' +slug: Web/JavaScript/Reference/Fehler/Non_configurable_array_element +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Non_configurable_array_element +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: can't delete non-configurable array element (Firefox)
+TypeError: Cannot delete property '2' of [object Array] (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Es wurde versucht die Länge eines Arrays zu kürzen obwohl eines der Arrayelemente nicht Konfigurierbar(non-configurable) ist. Beim Kürzen eines Arrays werden die Elemente hinter der neuen Länge gelöscht, was in dieser Situation nicht funktioniert.

+ +

Das configurable Attribut kontrolliert, ob eine Eigenschaft von einem Objekt gelöscht werden kann und seine Attribute (anders als writable) geändert werden können.

+ +

Eigenschaften von einem Objekt, dass von einem Array-Initialisierer erstellt wurden, sind konfigurierbar. Immer, wenn zum Beispiel {{jsxref("Object.defineProperty()")}} eingesetzt wird, ist die Eigenschaft nicht ohne weiteres konfigurierbar.

+ +

Beispiele

+ +

Nicht konfigurierbare Eigenschaften mit Object.defineProperty erstellen

+ +

Die {{jsxref("Object.defineProperty()")}} Funktion erstellt nicht konfiguriertbare Eigenschaften wenn sie nicht extra als konfigurierbar spezifiziert sind.

+ +
var arr = [];
+Object.defineProperty(arr, 0, {value: 0});
+Object.defineProperty(arr, 1, {value: "1"});
+
+arr.length = 1;
+// TypeError: can't delete non-configurable array element
+
+ +

Die Elemente müssen als Konfigurierbar eingestellt werden, wenn das Array später im Quelltext gekürzt werden soll.

+ +
var arr = [];
+Object.defineProperty(arr, 0, {value: 0, configurable: true});
+Object.defineProperty(arr, 1, {value: "1", configurable: true});
+
+arr.length = 1;
+
+ +

Ein Array versiegeln (seal)

+ +

Die {{jsxref("Object.seal()")}} Funktion markiert alle existirenden Elements als nicht Konfugurierbar.

+ +
var arr = [1,2,3];
+Object.seal(arr);
+
+arr.length = 1;
+// TypeError: can't delete non-configurable array element
+
+ +

Man muss den Aufruf von {{jsxref("Object.seal()")}} entfernen oder ein Kopie des Arrays machen. Im fall einer Kopie führt das Kürzen des kopierten Arrays zu keiner Änderung des Original Arrays.

+ +
var arr = [1,2,3];
+Object.seal(arr);
+
+// Copy the initial array to shorten the copy
+var copy = Array.from(arr);
+copy.length = 1;
+// arr.length == 3
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/not_a_codepoint/index.html b/files/de/web/javascript/reference/fehler/not_a_codepoint/index.html new file mode 100644 index 0000000000..8d72c3be4b --- /dev/null +++ b/files/de/web/javascript/reference/fehler/not_a_codepoint/index.html @@ -0,0 +1,55 @@ +--- +title: 'RangeError: argument is not a valid code point' +slug: Web/JavaScript/Reference/Fehler/Not_a_codepoint +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Not_a_codepoint +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: {0} is not a valid code point (Firefox)
+RangeError: Invalid code point {0} (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

Die {{jsxref("String.fromCodePoint()")}} Methode erwartet gültige Codepoint.

+ +

Ein Codepoint  ist ein Wert im Unicode Coderaum, der als Integer im Wertebereich zwischen 0 und 0x10FFFF liegt.

+ +

Die Verwendung von {{jsxref("NaN")}} , negativen Integern (-1), nicht Integern (3.14) und Werten die größer als 0x10FFFF (1114111) sind, werden einen Fehler bei dieser Methode produzieren.

+ +

Beispiele

+ +

Ungültige Fälle

+ +
String.fromCodePoint('_');      // RangeError
+String.fromCodePoint(Infinity); // RangeError
+String.fromCodePoint(-1);       // RangeError
+String.fromCodePoint(3.14);     // RangeError
+String.fromCodePoint(3e-2);     // RangeError
+String.fromCodePoint(NaN);      // RangeError
+ +

Gültige Fälle

+ +
String.fromCodePoint(42);       // "*"
+String.fromCodePoint(65, 90);   // "AZ"
+String.fromCodePoint(0x404);    // "\u0404"
+String.fromCodePoint(0x2F804);  // "\uD87E\uDC04"
+String.fromCodePoint(194564);   // "\uD87E\uDC04"
+String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07"
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/not_a_constructor/index.html b/files/de/web/javascript/reference/fehler/not_a_constructor/index.html new file mode 100644 index 0000000000..42858cf706 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/not_a_constructor/index.html @@ -0,0 +1,97 @@ +--- +title: 'TypeError: "x" is not a constructor' +slug: Web/JavaScript/Reference/Fehler/Not_a_constructor +tags: + - Fehler + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Not_a_constructor +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: "x" is not a constructor
+
+TypeError: Math is not a constructor
+TypeError: JSON is not a constructor
+TypeError: Symbol is not a constructor
+TypeError: Reflect is not a constructor
+TypeError: Intl is not a constructor
+TypeError: SIMD is not a constructor
+TypeError: Atomics is not a constructor
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Es wurde versucht auf ein Objekt oder eine Variable zuzugreifen welche kein Konstruktor ist. Mehr darüber, was ein Konstruktur ist, finden Sie unter {{Glossary("constructor")}} oder in der Beschreibung des new Operators.

+ +

Es gibt viele globale Objekte, wie {{jsxref("String")}} oder {{jsxref("Array")}}, welche mittels new erstellt werden können. Jedoch funktioniert das bei einigen Objekten nicht und deren Eigenschaften und Methoden sind statisch.

+ +

Die folgenden Standard build-in Objekte sind keine Konstruktoren: {{jsxref("Math")}}, {{jsxref("JSON")}}, {{jsxref("Symbol")}}, {{jsxref("Reflect")}}, {{jsxref("Intl")}}, {{jsxref("SIMD")}}, {{jsxref("Atomics")}}.

+ +

Generelle Funktionen können ebenso nicht als Konstruktor verwendet werden.

+ +

Beispiele

+ +

Ungültige Fälle

+ +
var Car = 1;
+new Car();
+// TypeError: Car is not a constructor
+
+new Math();
+// TypeError: Math is not a constructor
+
+new Symbol();
+// TypeError: Symbol is not a constructor
+
+function* f() {};
+var obj = new f;
+// TypeError: f is not a constructor
+
+ +

Ein car Konstruktor

+ +

Stellen Sie sich vor, Sie erstellen ein Objekt vom Typ vars. Sie wollen dieses Objekt als Car bezeichen und es soll Eigenschaften für make, model und year besitzt. Um dies zu erreichen, schreiben Sie die folgende Funktion:

+ +
function Car(make, model, year) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+}
+
+ +

Jetzt können Sie wie folgt ein Objekt mit dem Namen mycar erstellen:

+ +
var mycar = new Car('Eagle', 'Talon TSi', 1993);
+ +

Promises

+ +

Bei Rückgabe eines Promises, welches sofort im Status resolved oder rejected ist, brauchen Sie kein neues Promise mit new Promise(...) erstellen und damit zu arbeiten. 

+ +

Folgendes ist nicht erlaubt (der Promise Konstruktor wird nicht korrekt aufgerufen) und wirft eine TypeError: this is not a constructor Exception.

+ +
return new Promise.resolve(true);
+
+ +

Verwenden Sie stattdessen Promise.resolve() oder die statische Methode Promise.reject():

+ +
// Das ist erlaubt, aber unnötig lang:
+return new Promise((resolve, reject) => { resolve(true); })
+
+// Alternative Verwendung der statische Methoden:
+return Promise.resolve(true);
+return Promise.reject(false);
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/not_a_function/index.html b/files/de/web/javascript/reference/fehler/not_a_function/index.html new file mode 100644 index 0000000000..a8b66dff17 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/not_a_function/index.html @@ -0,0 +1,124 @@ +--- +title: 'TypeError: "x" is not a function' +slug: Web/JavaScript/Reference/Fehler/Not_a_function +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Not_a_function +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: "x" is not a function
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es wird versucht, ein Wert wie eine Funktion aufzurufen, da aber der Wert eigentlich keine Funktion ist, kommt es zu diesem Fehler. Manchmal erwartet das Programm, dass eine Funktion erstellt wird, was aber nicht der Fall ist.

+ +

Vielleicht ist ein Tippfehler im Funktionsnamen. Manchmal besitzt das aufgerufene Objekt eine Funktion aber auch nicht. Zum Beispiel besitzen JavaScript Objekte keine map Funktion, aber JavaScript Arrays haben diese Funktion.

+ +

Es gibt viele eingebaute Funktionen, die eine (Callback-) Funktion benötigen. Es muss eine Funktion bereitgestellt werden, damit diese Methoden normal funktionieren:

+ + + +

Beispiele

+ +

Ein Schreibfehler im Funktionsnamen

+ +

In diesem Fall passiert es viel zu oft, dass im Name ein Schreibfehler enthält:

+ +
var x = document.getElementByID('foo');
+// TypeError: document.getElementByID is not a function
+
+ +

Der korrekte Funktionsname ist getElementById:

+ +
var x = document.getElementById('foo');
+
+ +

Funktion wird auf dem falschen Objekt aufgerufen

+ +

Für bestimmte Methoden musst eine (callback) Funktion benutzt werden, die nur bei spezifizierten Objekten funktionieren. In diesem Beispiel wird {{jsxref("Array.prototype.map()")}} verwendet, welche nur mit {{jsxref("Array")}} Objekten funktioniert.

+ +
var obj = {a: 13, b: 37, c: 42};
+
+obj.map(function(num) {
+  return num * 2;
+});
+
+// TypeError: "x" is not a function
+ +

Stattdessen muss ein Array verwendet werden:

+ +
var numbers = [1, 4, 9];
+
+numbers.map(function(num) {
+  return num * 2;
+});
+
+// Array [2, 8, 18]
+
+ +

Funktionen teilen einen Namen mit einer existierenden Eigenschaft

+ +

Manchmal, wenn eine Klasse geschrieben wird, haben eine Eigenschaft und eine Funktion den gleichen Namen. Nach dem Aufruf der Funktion denkt der Compiler, dass die Funktion nicht mehr existiert.

+ +
var Dog = function () {
+ this.age = 11;
+ this.color = "black";
+ this.name = "Ralph";
+ return this;
+}
+
+Dog.prototype.name = function(name) {
+ this.name = name;
+ return this;
+}
+
+
+var myNewDog = new Dog();
+myNewDog.name("Cassidy"); //Uncaught TypeError: myNewDog.name is not a function
+
+ +

Stattdessen kann ein anderer Eigenschaftsname benutzt werden:

+ +
var Dog = function () {
+ this.age = 11;
+ this.color = "black";
+ this.dogName = "Ralph"; //Using this.dogName instead of .name
+ return this;
+}
+
+Dog.prototype.name = function(name) {
+ this.dogName = name;
+ return this;
+}
+
+
+var myNewDog = new Dog();
+myNewDog.name("Cassidy"); //Dog { age: 11, color: 'black', dogName: 'Cassidy' }
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/not_defined/index.html b/files/de/web/javascript/reference/fehler/not_defined/index.html new file mode 100644 index 0000000000..030c47536b --- /dev/null +++ b/files/de/web/javascript/reference/fehler/not_defined/index.html @@ -0,0 +1,70 @@ +--- +title: 'ReferenceError: "x" is not defined' +slug: Web/JavaScript/Reference/Fehler/Not_defined +tags: + - Error + - JavaScript + - ReferenceError +translation_of: Web/JavaScript/Reference/Errors/Not_defined +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
ReferenceError: "x" is not defined
+
+ +

Fehlertyp

+ +

{{jsxref("ReferenceError")}}.

+ +

Was ist falsch gelaufen?

+ +

Es gibt eine Referenz auf eine Variable, die nicht existiert. Diese Variable muss deklariert werden; oder man muss sicherstellen, dass sie im Skript zugänglich ist; oder sich im aktuellen {{Glossary("scope")}} befindet.

+ +
+

Hinweis: Wenn Sie eine Bibliothek nutzen (wie z.B. jQuery), stellen Sie sicher, dass diese tatsächlich geladen ist, bevor Sie auf dessen Variablen (z. B. "$") zugreifen. Schreiben Sie das {{HTMLElement("script")}} Element, welches die Bibliothek lädt vor den Code, der die Bibliothek verwendet.

+
+ +

Beispiele

+ +

Variable nicht deklariert

+ +
foo.substring(1); // ReferenceError: foo is not defined
+
+ +

Die "foo" Variable ist nirgends deklariert. Die Variable muss ein String sein, damit die Methode {{jsxref("String.prototype.substring()")}} funktioniert.

+ +
var foo = "bar";
+foo.substring(1); // "ar"
+ +

Falscher Gültigkeitsbereich

+ +

Eine Variable muss im aktuellem Kontext verfügbar sein. Variablen, die innerhalb einer Funktion definiert sind, können nicht von außerhalb erreicht werden, da diese nur im Gültigkeitsbereich der Funktion existieren.

+ +
function numbers() {
+  var num1 = 2,
+      num2 = 3;
+  return num1 + num2;
+}
+
+console.log(num1); // ReferenceError "num1" is not defined.
+ +

Wobei aus einer Methode kann man auf alle Variablen und Methoden zugreifen, die im gleichen Gültigkeitsbereich definiert worden sind. Kurz gesagt, eine Methode, die im globalen Gültigkeitsbereich definiert worden ist, kann auf alle Variablen zugreifen, die im globalen Gültigkeitsbereich definiert wurden.

+ +
var num1 = 2,
+    num2 = 3;
+
+function numbers() {
+  return num1 + num2;
+}
+
+console.log(numbers()); // 5
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/precision_range/index.html b/files/de/web/javascript/reference/fehler/precision_range/index.html new file mode 100644 index 0000000000..d03b4203c5 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/precision_range/index.html @@ -0,0 +1,96 @@ +--- +title: 'RangeError: precision is out of range' +slug: Web/JavaScript/Reference/Fehler/Precision_range +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Precision_range +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: precision {0} out of range (Firefox)
+RangeError: toExponential() argument must be between 0 and 20 (Chrome)
+RangeError: toFixed() digits argument must be between 0 and 20 (Chrome)
+RangeError: toPrecision() argument must be between 1 and 21 (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

Das übergebene Argument für die Genauigkeit ist, für einer der folgenden Funktionen, ausserhalb des gültigen Bereiches:

+ + + +

Der gülitge Bereich für diese Methoden liegt im normal Fall zwischen 0 und 20 (oder 21). Wobei die ECMAScript Spezifikation erlaubt eine Erweiterung de Bereiches.

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodFirefox (SpiderMonkey)Chrome, Opera (V8)
{{jsxref("Number.prototype.toExponential()")}}0 bis 1000 bis 20
{{jsxref("Number.prototype.toFixed()")}}-20 bis1000 bis 20
{{jsxref("Number.prototype.toPrecision()")}}1 bis 1001 bis 21
+ +

Beispiele

+ +

Ungültige Fälle

+ +
77.1234.toExponential(-1);  // RangeError
+77.1234.toExponential(101); // RangeError
+
+2.34.toFixed(-100);         // RangeError
+2.34.toFixed(1001);         // RangeError
+
+1234.5.toPrecision(-1);     // RangeError
+1234.5.toPrecision(101);    // RangeError
+
+ +

Gültige Fälle

+ +
77.1234.toExponential(4); // 7.7123e+1
+77.1234.toExponential(2); // 7.71e+1
+
+2.34.toFixed(1); // 2.3
+2.35.toFixed(1); // 2.4 (zu beachten ist, das in diesem Fall aufgerundet wird)
+
+5.123456.toPrecision(5); // 5.1235
+5.123456.toPrecision(2); // 5.1
+5.123456.toPrecision(1); // 5
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/property_access_denied/index.html b/files/de/web/javascript/reference/fehler/property_access_denied/index.html new file mode 100644 index 0000000000..d4feb4feb7 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/property_access_denied/index.html @@ -0,0 +1,47 @@ +--- +title: 'Error: Permission denied to access property "x"' +slug: Web/JavaScript/Reference/Fehler/Property_access_denied +tags: + - Error + - Errors + - JavaScript + - Security +translation_of: Web/JavaScript/Reference/Errors/Property_access_denied +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Error: Permission denied to access property "x"
+
+ +

Fehlertyp

+ +

{{jsxref("Error")}}.

+ +

Was ist falsch gelaufen?

+ +

Es wurde versucht auf ein Objekt zuzugreifen, wofür man nicht ausreichend berechtig ist. In den meisten Fällen handelt es sich um ein {{HTMLElement("iframe")}} Element, das von einer anderen Domäne geladen wurde und die Same-Origin Policy verletzt.

+ +

Beispiele

+ +
<!DOCTYPE html>
+<html>
+  <head>
+    <iframe id="myframe" src="http://www1.w3c-test.org/common/blank.html"></iframe>
+    <script>
+      onload = function() {
+        console.log(frames[0].document);
+        // Error: Permission denied to access property "document"
+      }
+    </script>
+  </head>
+  <body></body>
+</html>
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/read-only/index.html b/files/de/web/javascript/reference/fehler/read-only/index.html new file mode 100644 index 0000000000..bb56305880 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/read-only/index.html @@ -0,0 +1,78 @@ +--- +title: 'TypeError: "x" is read-only' +slug: Web/JavaScript/Reference/Fehler/Read-only +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Read-only +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: "x" is read-only (Firefox)
+TypeError: 0 is read-only (Firefox)
+TypeError: Cannot assign to read only property 'x' of #<Object> (Chrome)
+TypeError: Cannot assign to read only property '0' of [object Array] (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Die globale Variable oder Objekteigenschaften werden als nur lesbare Eigenschaften definiert (technisch wird das mit der writable Eigenschaft erreicht).

+ +

Der Fehler tritt nur im strict mode auf. Im normalen Modus wird eine Zuweisung still ignoriert.

+ +

Beispiele

+ +

Nicht valide Fälle

+ +

Nur lesbare Eigenschaften sind nicht sehr weit verbreitet, aber sie können mit {{jsxref("Object.defineProperty()")}} oder {{jsxref("Object.freeze()")}} erstellt werden.

+ +
'use strict';
+var obj = Object.freeze({name: 'Elsa', score: 157});
+obj.score = 0;  // TypeError
+
+'use strict';
+Object.defineProperty(this, 'LUNG_COUNT', {value: 2, writable: false});
+LUNG_COUNT = 3;  // TypeError
+
+'use strict';
+var frozenArray = Object.freeze([0, 1, 2]);
+frozenArray[0]++;  // TypeError
+
+ +

Zudem gibt es ein paar standard Eigenschaft in JavaScript, die nicht überschrieben werden können. Da währen zum Beispiel mathematische Konstanten.

+ +
'use strict';
+Math.PI = 4;  // TypeError
+
+ +

Die globale Variable undefined ist auch nur lesbar, sodass der berüchtigte Fehler "undefined is not a function" nicht wie folgt umgangen werden kann:

+ +
'use strict';
+undefined = function() {};  // TypeError: "undefined" is read-only
+
+ +

Valide Fälle

+ +
'use strict';
+var obj = Object.freeze({name: 'Score', points: 157});
+obj = {name: obj.name, points: 0};   // replacing it with a new object works
+
+'use strict';
+var LUNG_COUNT = 2;  // a `var` works, because it's not read-only
+LUNG_COUNT = 3;  // ok (anatomically unlikely, though)
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/redeclared_parameter/index.html b/files/de/web/javascript/reference/fehler/redeclared_parameter/index.html new file mode 100644 index 0000000000..e80836e50f --- /dev/null +++ b/files/de/web/javascript/reference/fehler/redeclared_parameter/index.html @@ -0,0 +1,61 @@ +--- +title: 'SyntaxError: redeclaration of formal parameter "x"' +slug: Web/JavaScript/Reference/Fehler/Redeclared_parameter +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Redeclared_parameter +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: redeclaration of formal parameter "x" (Firefox)
+SyntaxError: Identifier "x" has already been declared (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Der selbe Variablenname wird für einen Funktionsparameter benutzt und dann in einer let Zuweisung im Funktionskörper wieder neu deklariert. Das Neudeklarieren der gleichen Variablen in der selben Funktion oder im selben Block mit let ist in JavaScript nicht erlaubt.

+ +

Beispiele

+ +

In diesem Fall wird der Parameter "arg" neu deklariert.

+ +
function f(arg) {
+  let arg = 'foo';
+}
+
+// SyntaxError: redeclaration of formal parameter "arg"
+
+ +

Wenn der Wert von "arg" im Funktionskörper geändert werden soll, kann das getan werden, aber ohne die selbe Variable neu zu deklarieren. Oder anders gesagt, man kann das let Schlüsselwort weg lassen. Wenn eine neue Variable erstellt werden soll, muss sie umbenannt werden, damit es keine Konflikte mit dem Funktionsparameter mehr gibt.

+ +
function f(arg) {
+  arg = 'foo';
+}
+
+function f(arg) {
+  let bar = 'foo';
+}
+
+ +

Kompatibilitätshinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/reduce_of_empty_array_with_no_initial_value/index.html b/files/de/web/javascript/reference/fehler/reduce_of_empty_array_with_no_initial_value/index.html new file mode 100644 index 0000000000..a1a9a43748 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/reduce_of_empty_array_with_no_initial_value/index.html @@ -0,0 +1,88 @@ +--- +title: 'TypeError: Reduce of empty array with no initial value' +slug: Web/JavaScript/Reference/Fehler/Reduce_of_empty_array_with_no_initial_value +tags: + - Error + - JavaScript + - Reference + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Reduce_of_empty_array_with_no_initial_value +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: reduce of empty array with no initial value
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

In JavaScript gibt es einige Reduktionsfunktionen:

+ + + +

Diese Funktionen haben den optionalen initialValue Parameter (welcher als erster Parameter beim ersten Aufruf der callback Funktion benutzt wird). Immer, wenn dieser Wert nicht angegeben wird, wird das erste Element des {{jsxref("Array", "Arrays")}} oder {{jsxref("TypedArray", "TypedArrays")}} als Initialwert benutzt. Dieser Fehler tritt auf, wenn das Array leer ist, weil es in diesem Fall keinen Initialwert gibt.

+ +

Beispiele

+ +

Nicht valide Fälle

+ +

Dieses Problem tritt öfter bei einer Kombination mit einem Filter ({{jsxref("Array.prototype.filter()")}}, {{jsxref("TypedArray.prototype.filter()")}}), welcher Elemente aus der Liste entfernt. Dieser lässt kein Element als Initialwert in der Liste zurück.

+ +
var ints = [0, -1, -2, -3, -4, -5];
+ints.filter(x => x > 0)         // Entfernt alle Elemente
+    .reduce((x, y) => x + y)    // no more elements to use for the initial value.
+ +

Der gleiche Fehler kann bei einem Tippfehler passieren oder, bei einer unerwarteten Anzahl von Elementen in einer Liste.

+ +
var names = document.getElementsByClassName("names");
+var name_list = Array.prototype.reduce.call(names, (acc, name) => acc + ", " + name);
+
+ +

Valide Fälle

+ +

Diese Problem kann mit zwei Wegen gelöst werden.

+ +

Ein Weg ist es, einen initialValue als neutrales Element des Operators anzugeben, so wie 0 bei der Addition, 1 bei der Multiplikation oder ein leerer String bei einer Konkatination.

+ +
var ints = [0, -1, -2, -3, -4, -5];
+ints.filter(x => x < 0)         // removes all elements
+    .reduce((x, y) => x + y, 0) // the initial value is the neutral element of the addition
+
+ +

Ein anderer Weg ist es den Fall eines leeren Arrays schon vor dem Aufruf von reduce zu behandeln oder einen Dummywert als Initialwert in der callback-Funktion zu benutzen.

+ +
var names = document.getElementsByClassName("names");
+
+var name_list1 = "";
+if (names1.length >= 1)
+  name_list1 = Array.prototype.reduce.call(names, (acc, name) => acc + ", " + name);
+// name_list1 == "" when names is empty.
+
+var name_list2 = Array.prototype.reduce.call(names, (acc, name) => {
+  if (acc == "") // initial value
+    return name;
+  return acc + ", " + name;
+}, "");
+// name_list2 == "" when names is empty.
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/reserved_identifier/index.html b/files/de/web/javascript/reference/fehler/reserved_identifier/index.html new file mode 100644 index 0000000000..a483f4cd1a --- /dev/null +++ b/files/de/web/javascript/reference/fehler/reserved_identifier/index.html @@ -0,0 +1,80 @@ +--- +title: 'SyntaxError: "x" is a reserved identifier' +slug: Web/JavaScript/Reference/Fehler/Reserved_identifier +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Reserved_identifier +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: "x" is a reserved identifier (Firefox)
+SyntaxError: Unexpected reserved word (Chrome)
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Reservierte Schlüsselwörter führen zu einem Fehler, wenn sie als Bezeichner verwendet werden. Im Strict Mode und im Normalen Mode führen folgende Schlüsselwörter zu einem Fehler:

+ + + +

Die folgenden Schlüsselwörter führen nur im Strict Mode zu einem Fehler:

+ + + +

Beispiele

+ +

Reservierte Schlüsselwörter im Strict und Normalen Mode

+ +

Derenum Bezeichner ist generell reserviert.

+ +
var enum = { RED: 0, GREEN: 1, BLUE: 2 };
+// SyntaxError: enum is a reserved identifier
+
+ +

Im Strict Mode sind weitere Bezeichner reserviert.

+ +
"use strict";
+var package = ["potatoes", "rice", "fries"];
+// SyntaxError: package is a reserved identifier
+
+ +

Man muss die Variablen umbenennen.

+ +
var colorEnum = { RED: 0, GREEN: 1, BLUE: 2 };
+var list = ["potatoes", "rice", "fries"];
+ +

Ältere Browser aktualisieren

+ +

Wenn ein alter Browser eingesetzt wird, der zum Beispiel noch nicht let oder class implementiert, muss der Browser aktualisiert werden, so dass er diese neuen Sprachfunktionen unterstützt.

+ +
"use strict";
+class DocArchiver {}
+
+// SyntaxError: class is a reserved identifier
+// (throws in older browsers only, e.g. Firefox 44 and older)
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/resulting_string_too_large/index.html b/files/de/web/javascript/reference/fehler/resulting_string_too_large/index.html new file mode 100644 index 0000000000..e3f0246d13 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/resulting_string_too_large/index.html @@ -0,0 +1,49 @@ +--- +title: 'RangeError: repeat count must be less than infinity' +slug: Web/JavaScript/Reference/Fehler/Resulting_string_too_large +tags: + - Errors + - JavaScript + - RangeError +translation_of: Web/JavaScript/Reference/Errors/Resulting_string_too_large +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
RangeError: repeat count must be less than infinity and not overflow maximum string size (Firefox)
+
+RangeError: Invalid count value (Chrome)
+
+ +

Fehlertyp

+ +

{{jsxref("RangeError")}}

+ +

Was ist falsch gelaufen?

+ +

Die {{jsxref("String.prototype.repeat()")}} Methode wurde benutzt. Sie hat einen count Parameter welche die Anzahl der Wiederholungen des Strings angibt. Dieser muss zwischen 0 und kleiner positiv {{jsxref("Infinity")}} sein und kann nicht negativ sein. Das erlaubte Intervall kann wie folgt beschrieben werden: [0, +∞).

+ +

Der Ergebnisstring kann zudem nicht länger als die maximale Stringlänge sein, welche sich je nach JavaScript-Umgebung unterscheiden kann. In Firefox (SpiderMonkey) ist die maximale Stringlänge 228 -1 (0xFFFFFFF).

+ +

Beispiele

+ +

Falsche Fälle

+ +
'abc'.repeat(Infinity); // RangeError
+'a'.repeat(2**28);      // RangeError
+
+ +

Richtige Fälle

+ +
'abc'.repeat(0);    // ''
+'abc'.repeat(1);    // 'abc'
+'abc'.repeat(2);    // 'abcabc'
+'abc'.repeat(3.5);  // 'abcabcabc' (count will be converted to integer)
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/stmt_after_return/index.html b/files/de/web/javascript/reference/fehler/stmt_after_return/index.html new file mode 100644 index 0000000000..be395c3b83 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/stmt_after_return/index.html @@ -0,0 +1,77 @@ +--- +title: 'Warning: unreachable code after return statement' +slug: Web/JavaScript/Reference/Fehler/Stmt_after_return +tags: + - JavaScript + - Warning +translation_of: Web/JavaScript/Reference/Errors/Stmt_after_return +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Warning: unreachable code after return statement (Firefox)
+
+ +

Fehlertyp

+ +

Warnung

+ +

Was ist falsch gelaufen?

+ +

Nicht erreichbarer Code nach einem return Statement tritt in folgenden Fällen auf:

+ + + +

Wenn eine Anweisung nach einer gültigen return Anweisung existiert, dann wird diese Warnmeldung ausgegeben, um aufzuzeigen, das der nachfolgende Quellcode nie ausgeführt wird.

+ +

Warum sollte man Semikolons am Ende einer return Anweisung verwenden? Da im Falle einer return Anweisung ohne Semikolon, die Absicht des Entwicklers nicht klar ist. Es stellt sich die Frage, ob die Anweisung nach dem return als Rückgabewert der Methode zu sehen ist, oder sollte die Ausführung gleich beim return beendet werden. Hier zeigt die Warnung an, dass es sich um einen uneindeutige Situation handelt.

+ +

Warnungen werden nicht erzeugt wenn nach einem semikolonlosen return folgende Anweisungen folgen:

+ + + +

Beispiele

+ +

Fehlerfälle

+ +
function f() {
+  var x = 3;
+  x += 4;
+  return x;   // die return Anweisung beendet die Methode sofort.
+  x -= 3;     // somit ist dieser Code nicht erreichbar und wird nie ausgeführt
+}
+
+function f() {
+  return     // diese Zeile ist äquivalent zu `return;`
+    3 + 4;   // somit kann diese Code-Zeile nie erreicht werden
+}
+
+ +

Gültige Fälle

+ +
function f() {
+  var x = 3;
+  x += 4;
+  x -= 3;
+  return x;  // OK: return ist die letzte Anweisung in der Methode
+}
+
+function f() {
+  return 3 + 4  // OK: return ohne Semikolon, aber mit einem Ausdruck auf der gleiche Zeile
+}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/strict_non_simple_params/index.html b/files/de/web/javascript/reference/fehler/strict_non_simple_params/index.html new file mode 100644 index 0000000000..a288a81a10 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/strict_non_simple_params/index.html @@ -0,0 +1,111 @@ +--- +title: 'SyntaxError: "use strict" not allowed in function with non-simple parameters' +slug: Web/JavaScript/Reference/Fehler/Strict_Non_Simple_Params +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
Firefox:
+SyntaxError: "use strict" not allowed in function with default parameter
+SyntaxError: "use strict" not allowed in function with rest parameter
+SyntaxError: "use strict" not allowed in function with destructuring parameter
+
+Chrome:
+SyntaxError: Illegal 'use strict' directive in function with non-simple parameter list
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}.

+ +

Was ist falsch gelaufen?

+ +

Eine "use strict" Direktive steht am Anfang einer Funktion, die einen der folgende Parameter hat:

+ + + +

Eine "use strict" Direktive ist am Anfang solcher Funktionen durch die ECMAScript Spezifikation nicht erlaubt.

+ +

Beispiele

+ +

Funktionsstatement

+ +

In diesem Fall hat die Funktion sum zwei Standardparameter a=1 und b=2:

+ +
function sum(a = 1, b = 2) {
+  // SyntaxError: "use strict" not allowed in function with default parameter
+  'use strict';
+  return a + b;
+}
+
+ +

Wenn die Funktion im Strict Mode sein soll und das Skript oder die umschließende FUnktion auch für den Strict Mode in Ordnung ist, kann man die "use strict" Direktive nach außen verschieben:

+ +
'use strict';
+function sum(a = 1, b = 2) {
+  return a + b;
+}
+
+ +

Funktionsausdruck

+ +

Bei eine Funktionsausdruck kann ein andere Workaround genutzt werden:

+ +
var sum = function sum([a, b]) {
+  // SyntaxError: "use strict" not allowed in function with destructuring parameter
+  'use strict';
+  return a + b;
+};
+
+ +

Dieses kann zu folgendem Ausdruck konvertiert werden:

+ +
var sum = (function() {
+  'use strict';
+  return function sum([a, b]) {
+    return a + b;
+  };
+})();
+
+ +

Pfeilfunktionen

+ +

Wenn eine Pfeilfunktion auf die this Variable zugreift, so kann eine umschließende Pfeilfunktion benutzt werden:

+ +
var callback = (...args) => {
+  // SyntaxError: "use strict" not allowed in function with rest parameter
+  'use strict';
+  return this.run(args);
+};
+
+ +

Dieses kann zu folgendem Ausdruck konvertiert werden:

+ +
var callback = (() => {
+  'use strict';
+  return (...args) => {
+    return this.run(args);
+  };
+})();
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/too_much_recursion/index.html b/files/de/web/javascript/reference/fehler/too_much_recursion/index.html new file mode 100644 index 0000000000..0010afd90a --- /dev/null +++ b/files/de/web/javascript/reference/fehler/too_much_recursion/index.html @@ -0,0 +1,54 @@ +--- +title: 'InternalError: too much recursion' +slug: Web/JavaScript/Reference/Fehler/Too_much_recursion +tags: + - Errors + - InternalError + - JavaScript +translation_of: Web/JavaScript/Reference/Errors/Too_much_recursion +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
InternalError: too much recursion
+
+ +

Fehlertyp

+ +

{{jsxref("InternalError")}}.

+ +

Was ist falsch gelaufen?

+ +

Eine Funktion, die sich selbst aufruft, wird rekursive Funktion genannt. In manchen Fällen ist Rekursion mit einer Schleife vergleichbar. Beide führen den gleichen Code mehrfach aus und beide brauchen eine Abbruchbedingung (um Endlosschleifen bzw. Endlosrekursion zu vermeiden). Wenn zu tiefe Rekursion oder Endlosrekursion auftritt, erzeugt JavaScript diesen Fehler.

+ +

Beispiele

+ +

Diese rekursive Methode wird bis zur Abbruchbedingung 10 mal durchlaufen.

+ +
function schleife(x) {
+  if (x >= 10) // "x >= 10" ist die Abbruchsbedingung
+    return;
+  // zu wiederholende Codezeilen
+  schleife(x + 1); // rekursiver Methodenaufruf
+}
+schleife(0);
+ +

Wird die Abbruchsbedingung auf eine zu hohe Wert gesetzt, ist die Rekursionstiefe zu hoch und es wird einen Fehler erzeugt:

+ +
function boeseSchleife(x) {
+  if (x >= 1000000000000)
+    return;
+  // zu wiederholende Codezeilen
+  boeseSchleife(x + 1);
+}
+boeseSchleife(0);
+
+// InternalError: too much recursion
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/typed_array_invalid_arguments/index.html b/files/de/web/javascript/reference/fehler/typed_array_invalid_arguments/index.html new file mode 100644 index 0000000000..2e7fa8f0b3 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/typed_array_invalid_arguments/index.html @@ -0,0 +1,77 @@ +--- +title: 'TypeError: invalid arguments' +slug: Web/JavaScript/Reference/Fehler/Typed_array_invalid_arguments +tags: + - Error + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Typed_array_invalid_arguments +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: invalid arguments (Firefox)
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}

+ +

Was ist falsch gelaufen?

+ +

Der Typed Array Konstruktor erwartet entweder

+ + + +

um ein neues Typed Array zu erstelltn. Andere Argumente im Konstruktor erstellen kein valides Typed Array.

+ +

Beispiele

+ +

Typed Arrays, zum Beispiel ein {{jsxref("Uint8Array")}}, können nicht von einem String erstellt werden. Tatsächlich können String nicht in typisierten Arrays enthalten sein.

+ +
var ta = new Uint8Array("nope");
+// TypeError: invalid arguments
+
+ +

Verschiedene Wege um ein valides {{jsxref("Uint8Array")}} Objekt zu erstellen:

+ +
// From a length
+var uint8 = new Uint8Array(2);
+uint8[0] = 42;
+console.log(uint8[0]); // 42
+console.log(uint8.length); // 2
+console.log(uint8.BYTES_PER_ELEMENT); // 1
+
+// From an array
+var arr = new Uint8Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Uint8Array([21, 31]);
+var y = new Uint8Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(8);
+var z = new Uint8Array(buffer, 1, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var uint8 = new Uint8Array(iterable);
+// Uint8Array[1, 2, 3]
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/undeclared_var/index.html b/files/de/web/javascript/reference/fehler/undeclared_var/index.html new file mode 100644 index 0000000000..b7c8b09165 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/undeclared_var/index.html @@ -0,0 +1,67 @@ +--- +title: 'ReferenceError: assignment to undeclared variable "x"' +slug: Web/JavaScript/Reference/Fehler/Undeclared_var +tags: + - Errors + - JavaScript + - ReferenceError + - Strict Mode +translation_of: Web/JavaScript/Reference/Errors/Undeclared_var +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
ReferenceError: assignment to undeclared variable "x" (Firefox)
+ReferenceError: "x" is not defined (Chrome)
+ReferenceError: Variable undefined in strict mode (Edge)
+
+ +

Fehlertyp

+ +

{{jsxref("ReferenceError")}} Warnung nur im Strict mode.

+ +

Was ist falsch gelaufen?

+ +

Ein Wert wurde zu einer nicht deklarierten Variablen hinzugefügt. Oder mit anderen Worten, es gibt eine Zuweisung ohne das Schlüsselwort var. Es gibt einige Unterschiede zwischen deklarierten und nicht deklarierten Variablen, die zu unerwarteten Ergebnissen führen kann und weshalb der Fehler im Strict Mode erscheint.

+ +

Drei Dinge über deklarierte und nicht deklarierte Variablen:

+ + + +

Mehr Details und Beispiele findet man auf der var Referenzseite.

+ +

Fehler mit nicht deklarierten Variablenzuweisungen gibt es nur im Strict Mode Code. Außerhalb davon wird die Warnung einfach Ignoriert.

+ +

Beispiele

+ +

Falsche Fälle

+ +

In diesem Fall ist die "bar" eine nicht deklarierte Variable.

+ +
function foo() {
+  'use strict';
+  bar = true;
+}
+foo(); // ReferenceError: assignment to undeclared variable bar
+
+ +

Richtige Fälle

+ +

Um "bar" zu einer deklarierten Variable zu machen, kann das Schlüsselwort var eingesetzt werden.

+ +
function foo() {
+  'use strict';
+  var bar = true;
+}
+foo();
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/undefined_prop/index.html b/files/de/web/javascript/reference/fehler/undefined_prop/index.html new file mode 100644 index 0000000000..fe83564f59 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/undefined_prop/index.html @@ -0,0 +1,63 @@ +--- +title: 'ReferenceError: reference to undefined property "x"' +slug: Web/JavaScript/Reference/Fehler/Undefined_prop +tags: + - Errors + - JavaScript + - ReferenceError + - Strict Mode +translation_of: Web/JavaScript/Reference/Errors/Undefined_prop +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
ReferenceError: reference to undefined property "x" (Firefox)
+
+ +

Fehlertyp

+ +

{{jsxref("ReferenceError")}} Fehlermeldung tritt nur im  strikten Modus auf.

+ +

Was ist falsch gelaufen?

+ +

Es wird versucht auf eine Eigenschaft zuzugreifen, die nicht existiert. Es gibt zwei Arten um auf Eigenschaften zuzugreifen, siehe Eigenschaften Zugriffsfunktionen auf den Referenzseiten für weitere Details.

+ +

Fehler aufgrund von leeren Eigenschaftsreferenzen treten nur im Quellcode auf, der im strikten Modus geschrieben ist. Im Quellcode der nicht im strikten Modus geschrieben ist, wird der Fehler ohne Meldung ignoriert.

+ +

Beispiele

+ +

Ungültige Fälle

+ +

In diesem Fall ist die Eigenschaft "bar" undefiniert.

+ +
"use strict";
+
+var foo = {};
+foo.bar; // ReferenceError: reference to undefined property "bar"
+
+ +

Gültige Fälle

+ +

Um Fehler zu vermeiden muss man eine Eigenschaft "bar" definieren oder überprüfen, ob die Eigenschaft "bar" existiert, bevor man auf diese zugreift. (z.B.: mit Hilfe der Funktion {{jsxref("Object.prototype.hasOwnProperty()")}}).

+ +
"use strict";
+
+var foo = {};
+
+// Definiert die bar Eigenschaft
+
+foo.bar = "Mond";
+console.log(foo.bar); // "Mond"
+
+// Testet vor dem Zugriff, ob bar existiert.
+
+if (foo.hasOwnProperty("bar")) {
+  console.log(foo.bar);
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/unexpected_token/index.html b/files/de/web/javascript/reference/fehler/unexpected_token/index.html new file mode 100644 index 0000000000..3aff253bfd --- /dev/null +++ b/files/de/web/javascript/reference/fehler/unexpected_token/index.html @@ -0,0 +1,47 @@ +--- +title: 'SyntaxError: Unexpected token' +slug: Web/JavaScript/Reference/Fehler/Unexpected_token +tags: + - Fehler + - JavaScript + - Syntaxfehler +translation_of: Web/JavaScript/Reference/Errors/Unexpected_token +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: expected expression, got "x"
+SyntaxError: expected property name, got "x"
+SyntaxError: expected target, got "x"
+SyntaxError: expected rest argument name, got "x"
+SyntaxError: expected closing parenthesis, got "x"
+SyntaxError: expected '=>' after argument list, got "x"
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es wurde eine bestimmte Sprachenstruktur erwartet, aber etwas anderes wurde übermittelt. Es kann sich dabei um einen einfachen Tippfehler handeln.

+ +

Beispiele

+ +

Expression expected (Ausdruck erwartet)

+ +

Zum Beispiel sind Kommas am Ende eines Befehls nicht erlaubt.

+ +
for (let i = 0; i < 5,; i++) {
+  console.log(i);
+}
+// SyntaxError: expected expression, got ')'
+
+ +

Richtig wäre das Komma auszulassen oder ein weiteren Ausdruck hinzuzufügen:

+ +
for (let i = 0; i < 5; i++) {
+  console.log(i);
+}
+
diff --git a/files/de/web/javascript/reference/fehler/unexpected_type/index.html b/files/de/web/javascript/reference/fehler/unexpected_type/index.html new file mode 100644 index 0000000000..601ec21d43 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/unexpected_type/index.html @@ -0,0 +1,67 @@ +--- +title: 'TypeError: "x" is (not) "y"' +slug: Web/JavaScript/Reference/Fehler/Unexpected_type +tags: + - Errors + - JavaScript + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Unexpected_type +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: "x" is (not) "y"
+
+Examples:
+TypeError: "x" is undefined
+TypeError: "x" is null
+TypeError: "undefined" is not an object
+TypeError: "x" is not an object or null
+TypeError: "x" is not a symbol
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}}.

+ +

Was ist falsch gelaufen?

+ +

Der Typ einer Variable ist unpassend. Dieser Fall tritt oft bei {{jsxref("undefined")}}- oder {{jsxref("null")}}-Werten auf.

+ +

Außerdem benötigen bestimmte Metodhen wie {{jsxref("Object.create()")}} oder {{jsxref("Symbol.keyFor()")}} einen bestimmten Typ, der bereitgestellt werden muss.

+ +

Beispiele

+ +

Ungültige Fälle

+ +
// Undefinierte und null-Fälle, bei denen die Substring-Methode nicht funktioniert
+var foo = ;
+foo.substring(1); // TypeError: foo is undefined
+
+var foo = null;
+foo.substring(1); // TypeError: foo is null
+
+
+// Bestimmte Methoden erfordern einen bestimmten Typ
+var foo = {}
+Symbol.keyFor(foo); // TypeError: foo is not a symbol
+
+var foo = 'bar'
+Object.create(foo); // TypeError: "foo" is not an object or null
+
+ +

Den Fehler beheben?

+ +

Um den Nullzeiger auf undefined- oder null-Werte zu beheben, kann z. B. der "typeof"-Operator verwendt werden.

+ +
if (typeof foo !== 'undefined') {
+  // Nun wissen wir, dass foo definiert ist, und können weitermachen.
+}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/unnamed_function_statement/index.html b/files/de/web/javascript/reference/fehler/unnamed_function_statement/index.html new file mode 100644 index 0000000000..6c148b6ff0 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/unnamed_function_statement/index.html @@ -0,0 +1,115 @@ +--- +title: 'SyntaxError: function statement requires a name' +slug: Web/JavaScript/Reference/Fehler/Unnamed_function_statement +tags: + - Error + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Unnamed_function_statement +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: function statement requires a name [Firefox]
+SyntaxError: Unexpected token ( [Chrome]
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt eine Funktionsstatement im Code, welches einen Namen benötigt. Man muss überprüfen, wie Funktionen definiert sind und ob diese einen Namen benötigen oder ob diese Funktion ein Funktionsausdruck ist (eine {{Glossary("IIFE")}}) oder ob die Funktion im richtigen Kontext geschrieben ist.

+ +

Beispiele

+ +

Statements vs Ausdrücke

+ +

Ein Funktionsstatement (oder Funktionsdeklaration) benötigt einen Namen. Folgendes funktioniert nicht:

+ +
function () {
+  return 'Hello world';
+}
+// SyntaxError: function statement requires a name
+
+ +

Man kann stattdessen ein Funktionsausdruck (Zuweisung) nutzen:

+ +
var greet = function() {
+  return 'Hello world';
+};
+ +

Manchmal soll auch eine auch eine IIFE (Immediately Invoked Function Expression) sein, welche eine Funktion ist, die nach der Definition direkt ausgeführt wird. Dafür müssen ein paar mehr Klammern benutzt werden:

+ +
(function () {
+
+})();
+ +

Funktionen mit Labeln

+ +

Wenn man ein Funktionslabel benutzt, muss ein Funktionsnamen nach dem function Schlüsselwort stehen. Folgendes funktioniert nicht:

+ +
function Greeter() {
+  german: function () {
+    return "Moin";
+  }
+}
+// SyntaxError: function statement requires a name
+
+ +

Das folgende funktioniert:

+ +
function Greeter() {
+  german: function g() {
+    return "Moin";
+  }
+}
+ +

Objektmethoden

+ +

Wenn man eine Methode für ein Objekt erstellen möchte, muss ein Objekt erstellt werden. Die folgende Syntax ohne einen Namen nach dem function Schlüsselwort ist zulässig.

+ +
var greeter = {
+  german: function () {
+    return "Moin";
+  }
+};
+ +

Callback Syntax

+ +

Zudem sollte die Syntax bei Callbackfunktionen geprüft werden. Komma- und Klammersetzung kann schnell schwierig werden.

+ +
promise.then(
+  function() {
+    console.log("success");
+  });
+  function() {
+    console.log("error");
+}
+// SyntaxError: function statement requires a name
+
+ +

Richtig ist folgendes:

+ +
promise.then(
+  function() {
+    console.log("success");
+  },
+  function() {
+    console.log("error");
+  }
+);
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/unterminated_string_literal/index.html b/files/de/web/javascript/reference/fehler/unterminated_string_literal/index.html new file mode 100644 index 0000000000..3d60240b51 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/unterminated_string_literal/index.html @@ -0,0 +1,67 @@ +--- +title: 'SyntaxError: unterminated string literal' +slug: Web/JavaScript/Reference/Fehler/Unterminated_string_literal +tags: + - Errors + - JavaScript + - SyntaxError +translation_of: Web/JavaScript/Reference/Errors/Unterminated_string_literal +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
SyntaxError: unterminated string literal
+
+ +

Fehlertyp

+ +

{{jsxref("SyntaxError")}}

+ +

Was ist falsch gelaufen?

+ +

Es gibt irgendwo einen nicht beendeten {{jsxref("String")}}. Stringliterale müssen mit einfachen (') oder doppelten (") Anführungszeichen umschlossen sein. JavaScript unterscheidet nicht zwischen Strings, die mit einfachen oder doppelten Anführungszeichen umschlossen sind. Maskierte Sequenzen funktionieren in Strings mit einfachen und doppelten Anführungszeichen. Um den Fehler zu beheben, sollte folgendes überprüft werden:

+ + + +

Beispiele

+ +

MehrereZeilen

+ +

Man kann Strings nicht über mehrere Zeilen in JavaScript schreiben:

+ +
var longString = 'This is a very long string which needs
+                  to wrap across multiple lines because
+                  otherwise my code is unreadable.';
+// SyntaxError: unterminated string literal
+ +

Stattdessen muss ein + Operator, ein Backslask oder ein Templateliteral eingesetzt werden. Die + Operator Variante sieht wie folgt aus:

+ +
var longString = 'This is a very long string which needs ' +
+                 'to wrap across multiple lines because ' +
+                 'otherwise my code is unreadable.';
+
+ +

Oder man benutzt ein Backslash Zeichen ("\") am ende jeder Zeile, um anzudeuten, dass der String in der nächsten Zeile weiter geht. Man muss sicherstellen, dass keine Leerzeichen oder andere Zeichen nach dem Backslash stehen (ausgenommen der Zeilenumbruch) oder als Einrückung, ansonsten wird es nicht funktionieren. Diese Form sieht wie folgt aus:

+ +
var longString = 'This is a very long string which needs \
+to wrap across multiple lines because \
+otherwise my code is unreadable.';
+
+ +

Eine andere Möglichkeit ist der Einsatz von Templateliteralen, welche in ECMAScript 2015 Umgebungen unterstützt werden:

+ +
var longString = `This is a very long string which needs
+                  to wrap across multiple lines because
+                  otherwise my code is unreadable.`;
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/fehler/var_hides_argument/index.html b/files/de/web/javascript/reference/fehler/var_hides_argument/index.html new file mode 100644 index 0000000000..f06a1d5220 --- /dev/null +++ b/files/de/web/javascript/reference/fehler/var_hides_argument/index.html @@ -0,0 +1,56 @@ +--- +title: 'TypeError: variable "x" redeclares argument' +slug: Web/JavaScript/Reference/Fehler/Var_hides_argument +tags: + - Errors + - JavaScript + - Strict Mode + - TypeError +translation_of: Web/JavaScript/Reference/Errors/Var_hides_argument +--- +
{{jsSidebar("Errors")}}
+ +

Fehlermeldung

+ +
TypeError: variable "x" redeclares argument (Firefox)
+
+ +

Fehlertyp

+ +

{{jsxref("TypeError")}} Warnung nur im strict mode.

+ +

Was ist falsch gelaufen?

+ +

Der selbe Variablenname für einen Funktionsparameter und einer Neudeklaration mit einer var Zuweisung im Funktionskörper ist vorhanden. Dieses ist ein Namenskonflikt, weshalb JavaScript eine Warnung erzeugt.

+ +

Dieser Fehler ist eine Warnung, die nur im strict mode auftaucht. Ist man nicht im strict mode, so wird die Neudeklaration still ignoriert.

+ +

Beispiele

+ +

Nicht balider Fall

+ +

In diesem Fall wird die Variable "arg" neu deklariert.

+ +
'use strict';
+
+function f(arg) {
+  var arg = 'foo';
+}
+
+ +

Valider Fall

+ +

Um diese Warnung zu vermeiden kann das var Statement weggelassen werden, weil die Variable schon existiert. In anderen Fällen kann der Funktionsparameter oder die Variable umbenannt werden.

+ +
'use strict';
+
+function f(arg) {
+  arg = 'foo';
+}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/arguments/@@iterator/index.html b/files/de/web/javascript/reference/functions/arguments/@@iterator/index.html new file mode 100644 index 0000000000..5625ee01df --- /dev/null +++ b/files/de/web/javascript/reference/functions/arguments/@@iterator/index.html @@ -0,0 +1,78 @@ +--- +title: 'arguments[@@iterator]()' +slug: Web/JavaScript/Reference/Functions/arguments/@@iterator +tags: + - Deprecated + - Functions + - JavaScript + - Property + - arguments +translation_of: Web/JavaScript/Reference/Functions/arguments/@@iterator +--- +
{{jsSidebar("Functions")}}
+ +

Der Initialwert der @@iterator Eigenschaft ist das selbe Funktionsobjekt wie der Initialwert der {{jsxref("Array.prototype.values")}} Eigenschaft.

+ +

Syntax

+ +
arguments[Symbol.iterator]()
+ +

Beispiele

+ +

Iterieren mit einer for...of Schleife

+ +
function f() {
+  // der Browser muss for..of Schleifen und
+  // let-Variablen in for Schleifen unterstützen
+  for (let letter of arguments) {
+    console.log(letter);
+  }
+}
+f('w', 'y', 'k', 'o', 'p');
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-createunmappedargumentsobject', ' CreateUnmappedArgumentsObject')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ES6', '#sec-createmappedargumentsobject', ' CreateMappedArgumentsObject')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-createunmappedargumentsobject', 'CreateUnmappedArgumentsObject')}}{{Spec2('ESDraft')}} 
{{SpecName('ESDraft', '#sec-createmappedargumentsobject', 'CreateMappedArgumentsObject')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.functions.arguments.@@iterator")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/arguments/callee/index.html b/files/de/web/javascript/reference/functions/arguments/callee/index.html new file mode 100644 index 0000000000..704813b7a6 --- /dev/null +++ b/files/de/web/javascript/reference/functions/arguments/callee/index.html @@ -0,0 +1,157 @@ +--- +title: arguments.callee +slug: Web/JavaScript/Reference/Functions/arguments/callee +tags: + - Deprecated + - Functions + - JavaScript + - Property + - arguments +translation_of: Web/JavaScript/Reference/Functions/arguments/callee +--- +
{{jsSidebar("Functions")}}
+ +

Die arguments.callee-Eigenschaft enthält die Referenz der aktuell ausgeführten Funktion.

+ +

Beschreibung

+ +

callee ist eine Eigenschaft des arguments-Objektes. Sie kann eingesetzt werden, um aus dem Körper einer Funktion auf die aktuell ausgeführte Funktion zu referenzieren. Dieses ist sinnvoll, wenn der Name der Funktion unbekannt ist. Auch in einer anonymen Funktion (ohne Namen) funktioniert dieses.

+ +
Warnung: Die Version 5 von ECMAScript (ES5) verbietet die nutzung von arguments.callee() im {{jsxref("Strict_mode", "strict mode")}}. Der Einsatz von arguments.callee() soll vermieden werden, wenn function-Ausdrücke einen Namen haben oder Funktionen deklariert werden, die sich selbst aufrufen müssen.
+ +

Warum wurde arguments.callee vom ES5 strict mode entfernt?

+ +

(angepasst von einer Stack Overflow-Antwort von olliej)

+ +

Frühe Versionen von JavaScript erlauben keine benamten Funktions-Anweisungen. Aus diesem Grund ist es nicht möglich rekursive Funktions-Anweisungen zu schreiben.

+ +

Diese Syntax funktioniert, zum Beispiel:

+ +
function factorial (n) {
+    return !(n > 1) ? 1 : factorial(n - 1) * n;
+}
+
+[1, 2, 3, 4, 5].map(factorial);
+ +

aber:

+ +
[1, 2, 3, 4, 5].map(function (n) {
+    return !(n > 1) ? 1 : /* what goes here? */ (n - 1) * n;
+});
+ +

funktioniert nicht. Um dieses problem zu lösen wurde arguments.callee hinzugefügt.

+ +
[1, 2, 3, 4, 5].map(function (n) {
+    return !(n > 1) ? 1 : arguments.callee(n - 1) * n;
+});
+ +

Allerdings ist dieses eine schlechte Lösung , weil diese (in Verbindung mit anderen arguments, callee, and caller-Problemen) inlining und Endrekursion unmöglich macht (man kann es benutzen um Tracing zu realisieren, jedoch ist der beste Code immer suboptimal). Ein weiteres Problem liegt darin, dass rekursive Aufrufe ein unterschiedliches this bekommen können (siehe folgendes Beispiel):

+ +
var global = this;
+
+var sillyFunction = function(recursed) {
+    if (!recursed) { return arguments.callee(true); }
+    if (this !== global) {
+        alert('This is: ' + this);
+    } else {
+        alert('This is the global');
+    }
+}
+
+sillyFunction();
+ +

ECMAScript 3 löste das Problem indem benamte Funktions-Ausdrücke erlaubt wurden:

+ +
[1, 2, 3, 4, 5].map(function factorial (n) {
+    return !(n > 1) ? 1 : factorial(n - 1)*n;
+});
+ +

Dieses hat zahlreiche Vorteile:

+ + + +

Eine andere Funktion die verboten wurde ist arguments.callee.caller oder spezifischer Function.caller. Warum ist das so? Zu jedem Zeitpunkt ist es möglich, den tiefsten Aufrufer von jeder Funktion auf dem Stack herauszufinden und weil das herausfinden des Aufrufer-Stacks hat einen hauptsächlichen Effekt: Es macht das Optimieren unmöglich oder sehr viel schwerer. Zum Beispiel ist es nicht Möglich f zu inlinen, wenn nicht sichergestellt ist, dass eine Funktion f nicht eine unbekannte Funktion aufruft. Das bedeutet, dass jeder Aufruf eine große Anzahl an Sicherheitsabfragen durchführen müsste um inlinen zu können.

+ +
function f(a, b, c, d, e) { return a ? b * c : d * e; }
+ +

Wenn der JavaScript-Interpreter nicht garantieren kann, dass alle der unterstützten Argumente Nummern beim Aufruf sind, muss dieser Prüfungen für alle Argumente einfügen bevor der Code geinlinet werden kann oder die Funktion kann nicht geinlinet werden. In dieser Situation sollte ein guter Interpreter die Prüfungen neu anordnen, damit diese Optimal abgefragt werden und nur die Werte, die benutzt werden geprüft werden. Weil dieses in vielen Fällen nicht möglich ist, wird es in diesen unmöglich zu inlinen.

+ +

Beispiele

+ +

Einsatz von arguments.callee in einer anonymen rekursiven Funktion

+ +

Eine rekursive Funktion muss sich selber aufrufen können. Normalerweise referenziert eine Funktion sich selbst mit dem Namen. Weil eine anonyme Funktion (welche von einem Funktionsausdruck oder dem Function Konstruktor erstellt werden kann) hat keinen Namen. Wenn also keine Variable diese Funktion referenziert, ist der einzige Weg die Funktion über arguments.callee aufzurufen.

+ +

Das folgende Beispiel definiert eine Funktion, welche wiederum eine Fakultätsfunktion Definiert und sie zurückgibt. Dieses Beispiel ist nicht sehr praktisch und es gibt fast keine Fälle, in denen dasselbe Ergebnis nicht mit Funktionsausdrücken mit Namen erreicht werden kann.

+ +
function create() {
+   return function(n) {
+      if (n <= 1)
+         return 1;
+      return n * arguments.callee(n - 1);
+   };
+}
+
+var result = create()(5); // returns 120 (5 * 4 * 3 * 2 * 1)
+ +

Der einsatz von arguments.callee mit keinen guten Alternativen

+ +

In einem Fall wie dem Folgenden gibt es jedoch keine Alternativen zu arguments.callee, so dass seine Veraltung ein Fehler sein könnte (siehe {{Bug("725398")}}):

+ +
function createPerson(sIdentity) {
+    var oPerson = new Function('alert(arguments.callee.identity);');
+    oPerson.identity = sIdentity;
+    return oPerson;
+}
+
+var john = createPerson('John Smith');
+
+john();
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.2
{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.arguments.callee")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/arguments/index.html b/files/de/web/javascript/reference/functions/arguments/index.html new file mode 100644 index 0000000000..180a53dc5f --- /dev/null +++ b/files/de/web/javascript/reference/functions/arguments/index.html @@ -0,0 +1,223 @@ +--- +title: Arguments object +slug: Web/JavaScript/Reference/Functions/arguments +tags: + - Functions + - JavaScript + - Reference + - arguments +translation_of: Web/JavaScript/Reference/Functions/arguments +--- +
+
+
{{jsSidebar("Functions")}}
+
+
+ +

Das arguments-Objekt ist ein Array-ähnliches Objekt, das auf die übergebenen Parameter einer Funktion verweist.

+ +
{{EmbedInteractiveExample("pages/js/functions-arguments.html")}}
+ + + +

Syntax

+ +
arguments
+ +

Beschreibung

+ +

Das arguments-Objekt ist eine lokal verfügbare Variable in allen (Nicht-Pfeil-) Funktionen. Man kann auf die Parameter einer Funktion referenzieren, wenn man in einer Funktion das arguments-Objekt benutzt. Dieses Objekt enthält einen Eintrag für jeden übergebenen Parameter der Funktion. Der erste Eintrag beginnt beim Index 0. Wenn einer Funktion drei Parameter übergeben werden, kann wie folgt auf diese zugegriffen werden;

+ +
arguments[0]
+arguments[1]
+arguments[2]
+
+ +

Die Parameter können auch überschrieben werden:

+ +
arguments[1] = 'new value';
+ +

Das arguments-Objekt ist kein {{jsxref("Array")}}. Es ist ähnlich wie ein Array, hat aber keine Eigenschaften eines Arrays mit Ausnahme von {{jsxref("Functions/arguments/length", "length")}}. Zum Beispiel ist die {{jsxref("Global_Objects/Array/pop", "pop")}}-Methode nicht vorhanden. Jedoch kann arguments zu einem echten Array konvertiert werden:

+ +
var args = Array.prototype.slice.call(arguments);
+var args = [].slice.call(arguments);
+
+// ES2015
+const args = Array.from(arguments);
+ +
+

Der Einsatz von slice auf arguments kann Optimierungen bei einigen JavaScript-Engines (z. B. bei V8 — mehr Informationen) verhindern. Wenn man sich darum kümmert, sollte ein neues Array erstellt werden, indem über das arguments-Objekt iteriert wird. Eine Alternative ist der Einsatz von Array.apply wie folgt:

+ +
var args = (arguments.length === 1 ? [arguments[0]] : Array.apply(null, arguments));)
+
+ +

Man kann das arguments-Objekt nutzen, um eine Funktion mit mehr übergebenen Parametern, als die der formalen Definition, zu verarbeiten. Diese Technik ist hilfreich für Funktionen mit variabler Parameteranzahl. Man kann {{jsxref("Functions/arguments/length", "arguments.length")}} nutzen, um die Anzahl der übergebenen Parameter festzustellen und dann jeden Parameter über das arguments-Objekt zu verarbeiten. (Um die Anzahl der deklarierten Parameter festzustellen, kann die {{jsxref("Functions/length", "Funktion.length")}} Eigenschaft genutzt werden.)

+ +

Einsatz von typeof bei arguments

+ +

Der Typ von arguments ist 'object'

+ +
console.log(typeof arguments); // 'object'
+ +

Der Typ von individuellen Argumenten kann über den Index ermittelt werden.

+ +
console.log(typeof arguments[0]); // Gibt den Typ des individuellen Arguments zurück
+ +

Einsatz der Spread Syntax mit arguments

+ +

Man kann die {{jsxref("Array.from()")}} Methode oder den spread operator nutzen, um arguments zu einem echten Array zu konvertieren:

+ +
var args = Array.from(arguments);
+var args = [...arguments];
+ +

Eigenschaften

+ +
+
{{jsxref("Functions/arguments/callee", "arguments.callee")}}
+
Referenz zur aktuell ausgeführten Funktion.
+
{{jsxref("Functions/arguments/caller", "arguments.caller")}} {{ Obsolete_inline() }}
+
Referenz zur Funktion, die die aktuelle Funktion ausführt hat.
+
{{jsxref("Functions/arguments/length", "arguments.length")}}
+
Anzahl der übergebenen Funktionsparameter.
+
{{jsxref("Functions/arguments/@@iterator", "arguments[@@iterator]")}}
+
Gibt ein Array-Iterator-Objekt zurück, welches die Werte an allen Indizes von arguments enthält.
+
+ +

Beispiele

+ +

Definition einer Funktion, die mehrere Strings konkateniert

+ +

Dieses Beispiel definiert eine Funktion, die mehrere Strings konkateniert. Der einzige formale Parameter der Funktion ist ein String, der die Zeichen enthält, die die einzelnen Elemente trennt. Die Funktion ist wie folgt definiert:

+ +
function myConcat(separator) {
+  var args = Array.prototype.slice.call(arguments, 1);
+  return args.join(separator);
+}
+ +

Man kann eine beliebige Anzahl von Parametern der Funktion übergeben und es wird jedes Argument für den String eingesetzt.

+ +
// returns "red, orange, blue"
+myConcat(", ", "red", "orange", "blue");
+
+// returns "elephant; giraffe; lion; cheetah"
+myConcat("; ", "elephant", "giraffe", "lion", "cheetah");
+
+// returns "sage. basil. oregano. pepper. parsley"
+myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");
+ +

Definition einer Funktion, die HTML-Listen erstellt

+ +

Im Beispiel wird eine Funktion definiert, die einen String mit HTML für eine Liste zurückgibt. Der einzige formale Parameter der Funktion ist ein String, der "u" für eine ungeordnete Liste oder "o" für eine geordnete Liste enthält. Die Funktion ist wie folgt definiert:

+ +
function list(type) {
+  var result = "<" + type + "l><li>";
+  var args = Array.prototype.slice.call(arguments, 1);
+  result += args.join("</li><li>");
+  result += "</li></" + type + "l>"; // end list
+
+  return result;
+}
+ +

Der Funktion kann eine variable Anzahl an Parametern übergeben werden und es wird jeder Parameter als Listeneintrag einer Liste hinzugefügt. Zum Beispiel:

+ +
var listHTML = list("u", "One", "Two", "Three");
+
+/* listHTML is:
+
+"<ul><li>One</li><li>Two</li><li>Three</li></ul>"
+
+*/
+ +

Rest, default und Destrukturierende Parameter

+ +

Das arguments-Objekt kann in Verbindung mit rest, default, und destrukturierenden Parametern eingesetzt werden.

+ +
function foo (...args) {
+  return args;
+}
+foo(1, 2, 3); // [1,2,3]
+ +

Wenn der Einsatz von rest, default, und destrukturierenden Parametern nicht die die Eigenschaften des arguments Objekts verändert, gibt es eine Unterschied zwischen dem strict mode und dem nicht strict mode.

+ +

Wenn eine nicht-strikte (non-strict) Funktion nicht  rest, default, oder destrukturierende Parameter enthält, referenzieren die Werte des arguments Objektes direkt auf die deklarierten Parameter und umgekehrt. Siehe dazu folgenden Quelltext:

+ +
function func (a) {
+  arguments[0] = 99; // Aktualisert auch arguments[0] und a
+  console.log(a);
+}
+func(10); // 99
+ +

und

+ +
function func (a) {
+  a = 99; // Aktualisert auch arguments[0] und a
+  console.log(arguments[0]);
+}
+func(10); // 99
+ +

Wenn eine nicht-strikte (non-strict) Funktion rest, default, oder destrukturierende Parameter enthält, referenzieren die Werte des arguments Objektes nicht direkt auf die deklarierten Parameter und umgekehrt. Die Werte in arguments sind die Werte, die der Funktion beim Aufruf übergeben werden:

+ +
function func(a = 55) {
+  arguments[0] = 99; // aktualisert arguments[0] aber nicht a
+  console.log(a);
+}
+func(10); // 10
+ +

und

+ +
function func(a = 55) {
+  a = 99; // aktualisert a aber nicht arguments[0]
+  console.log(arguments[0]);
+}
+func(10); // 10;
+ +

und

+ +
function func(a = 55) {
+  console.log(arguments[0]);
+}
+func(); // undefined;
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1
{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}{{Spec2('ES5.1')}}
{{SpecName('ES2015', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ES2015')}}
{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.arguments")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/arguments/length/index.html b/files/de/web/javascript/reference/functions/arguments/length/index.html new file mode 100644 index 0000000000..a2da4718b4 --- /dev/null +++ b/files/de/web/javascript/reference/functions/arguments/length/index.html @@ -0,0 +1,87 @@ +--- +title: arguments.length +slug: Web/JavaScript/Reference/Functions/arguments/length +tags: + - Functions + - JavaScript + - Property + - arguments +translation_of: Web/JavaScript/Reference/Functions/arguments/length +--- +
+
{{jsSidebar("Functions")}}
+
+ +

Die arguments.length-Eigenschaft enthält die Anzahl der übergebenen Parameter einer Funktion.

+ +

Syntax

+ +
arguments.length
+ +

Beschreibung

+ +

Die arguments.length-Eigenschaft enthält die Anzahl der Parameter, die der aktuellen Funktion übergeben wurden. Diese Anzahl kann größer oder kleiner der Anzahl der definierten Parameter sein (siehe {{jsxref("Function.length")}}).

+ +

Beispiele

+ +

Beispiel: arguments.length nutzen

+ +

In diesem Beispiel wird eine Funktion definiert, die zwei oder mehr Nummern addieren kann.

+ +
function adder(base /*, n2, ... */) {
+  base = Number(base);
+  for (var i = 1; i < arguments.length; i++) {
+    base += Number(arguments[i]);
+  }
+  return base;
+}
+
+ +
+

Zu beachten ist der Unterschied zwischen {{jsxref("Function.length")}} und arguments.length

+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definietion. Implementiert in JavaScript 1.1
{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.arguments.length")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/default_parameters/index.html b/files/de/web/javascript/reference/functions/default_parameters/index.html new file mode 100644 index 0000000000..6e88aaa134 --- /dev/null +++ b/files/de/web/javascript/reference/functions/default_parameters/index.html @@ -0,0 +1,223 @@ +--- +title: Default parameters +slug: Web/JavaScript/Reference/Functions/Default_parameters +tags: + - ECMAScript 2015 + - Functions + - JavaScript +translation_of: Web/JavaScript/Reference/Functions/Default_parameters +--- +
{{jsSidebar("Functions")}}
+ +

Standard Funktionsparameter erlaubt es formale Parameter mit vorgegebenen Werten zu initialisieren, wenn beim Funktionsaufruf kein Wert oder undefined übergeben wird.

+ +
{{EmbedInteractiveExample("pages/js/functions-default.html")}}
+ + + +

Syntax

+ +
function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
+   statements
+}
+
+ +

Beschreibung

+ +

In JavaScript haben Funktionsparameter standardmäßig den Default-Wert {{jsxref("undefined")}}. Manchmal ist es jedoch sinnvoll einen anderen Default-Wert zu setzen. Hier helfen Default-Parameter weiter.

+ +

In der Vergangenheit war die allgemeine Strategie für das Setzen von Default-Werten das Testen von Parameterwerten im Body der Funktion und dem Zuordnen eines Default-Wertes, wenn dieser undefined ist. Wenn in dem folgenden Beispiel bei dem Aufruf kein Wert für b mitgegeben wird, würde der Wert undefined sein. Bei der Auswertung von a*b und dem Aufruf von multiply wird als Rückgabewert NaN zurückgegeben. Im Beispiel wird deshalb dieser Rückgabewert in der zweiten Zeile der Funktion aufgefangen:

+ +
function multiply(a, b) {
+  b = (typeof b !== 'undefined') ?  b : 1;
+  return a * b;
+}
+
+multiply(5, 2); // 10
+multiply(5, 1); // 5
+multiply(5);    // 5
+
+ +

Mit dem Default-Parameter in ES2015 ist die Prüfung im Funktionskörper nicht mehr nötig. Jetzt kann man einfach 1 als den Standardwert für b in dem Funktionskopf definieren: 

+ +
function multiply(a, b = 1) {
+  return a * b;
+}
+
+multiply(5, 2); // 10
+multiply(5, 1); // 5
+multiply(5);    // 5
+
+ +

Beispiele

+ +

Übergeben von undefined und anderen falsy Werten

+ +

In dem zweiten Aufruf, auch wenn das erste Argument explizit auf undefined gesetzt ist (jedoch nicht null oder andere {{Glossary("Falsy", "Falsy-Werte")}}, ist der Wert des Arguments num beim Aufruf der Default-Wert.

+ +
function test(num = 1) {
+  console.log(typeof num);
+}
+
+test();          // 'number' (num wird auf 1 gesetzt)
+test(undefined); // 'number' (num wird auf 1 gesetzt)
+
+// test with other falsy values:
+test('');        // 'string' (num wird auf '' gesetzt)
+test(null);      // 'object' (num wird auf null gesetzt)
+
+ +

Auswerten beim Aufruf

+ +

Das Standard-Argument wird zum Zeitpunkt des Aufrufs ausgewertet. Somit wird - anders als z.B. in Python - ein neues Objekt bei jedem Funktionsaufruf erzeugt.

+ +
function append(value, array = []) {
+  array.push(value);
+  return array;
+}
+
+append(1); //[1]
+append(2); //[2], nicht [1, 2]
+
+ +

Das Gleiche gilt für Funktionen und Variablen:

+ +
function callSomething(thing = something()) {
+ return thing;
+}
+
+function something(){
+  return "sth";
+}
+
+callSomething();  //sth
+ +

Default-Parameter stehen nachfolgenden Default-Parametern zur Verfügung

+ +

Die bereits angetroffenen Parameter stehen den späteren Standardparametern zur Verfügung:

+ +
function singularAutoPlural(singular, plural = singular+"s",
+                            rallyingCry = plural + " ATTACK!!!") {
+  return [singular, plural, rallyingCry ];
+}
+
+//["Gecko","Geckos", "Geckos ATTACK!!!"]
+singularAutoPlural("Gecko");
+
+//["Fox","Foxes", "Foxes ATTACK!!!"]
+singularAutoPlural("Fox","Foxes");
+
+//["Deer", "Deer", "Deer ... change."]
+singularAutoPlural("Deer", "Deer", "Deer peaceably and respectfully
+   petition the government for positive change.")
+
+ +

Diese Funktionalität wird in einer geradlinigen Weise angenähert und zeigt, wie viele Randfälle behandelt werden:

+ +
function go() {
+  return ":P"
+}
+
+function withDefaults(a, b = 5, c = b, d = go(), e = this,
+                      f = arguments, g = this.value) {
+  return [a,b,c,d,e,f,g];
+}
+
+function withoutDefaults(a, b, c, d, e, f, g){
+  switch(arguments.length){
+    case 0:
+      a
+    case 1:
+      b = 5
+    case 2:
+      c = b
+    case 3:
+      d = go();
+    case 4:
+      e = this
+    case 5:
+      f = arguments
+    case 6:
+      g = this.value;
+    default:
+  }
+  return [a,b,c,d,e,f,g];
+}
+
+withDefaults.call({value:"=^_^="});
+// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
+
+
+withoutDefaults.call({value:"=^_^="});
+// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
+
+ +

Funktionen definiert innerhalb des Funktionskörpers

+ +

Eingeführt in Gecko 33 {{geckoRelease(33)}}. Funktionen die innerhalb eines Funktionskörper deklariert werden, können nicht von Default-Parametern referenziert werden und führen zu einem {{jsxref("ReferenceError")}} (aktuell wird ein {{jsxref("TypeError")}} erzeugt, siehe {{bug(1022967)}}). Default-Parameter werden stets zuerst ausgewertet, Funktionsdeklarationen innerhalb von Funktionskörpern erst hinterher.

+ +
// Funktioniert nicht! Wirft einen ReferenceError.
+function f(a = go()) {
+  function go(){return ":P"}
+}
+
+ +

Paramater ohne Default nach Default-Parameter

+ +

Vor Gecko 26 {{geckoRelease(26)}} erzeugte der folgende Code einen {{jsxref("SyntaxError")}}. Dieses wurde in {{bug(777060)}} behoben und funktioniert wie erwartet in späteren Versionen. Bei Aufruf werden Parameter noch immer von links nach rechts angegeben. Default-Parameter werden überschrieben, auch wenn spätere Parameter keinen Default haben:

+ +
function f(x=1, y) {
+  return [x, y];
+}
+
+f(); // [1, undefined]
+f(2); // [2, undefined]
+
+ +

Zerstörter Parameter mit Standardwertzuordnung

+ +

Sie können die Standardwertzuordnung mit der destrukturierende Zuordnung Schreibweise verwenden:

+ +
function f([x, y] = [1, 2], {z: z} = {z: 3}) {
+  return x + y + z;
+}
+
+f(); // 6
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-function-definitions', 'Function Definitions')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + +

{{Compat("javascript.functions.default_parameters")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/get/index.html b/files/de/web/javascript/reference/functions/get/index.html new file mode 100644 index 0000000000..b36b0f50e8 --- /dev/null +++ b/files/de/web/javascript/reference/functions/get/index.html @@ -0,0 +1,174 @@ +--- +title: Getter +slug: Web/JavaScript/Reference/Functions/get +tags: + - ECMAScript 2015 + - ECMAScript 5 + - Functions + - JavaScript + - Language feature +translation_of: Web/JavaScript/Reference/Functions/get +--- +
{{jsSidebar("Functions")}}
+ +

Die get Syntax bindet eine Objekteigenschaft an eine Funktion welche aufgerufen wird, wenn die Eigenschaft abgefragt wird.

+ +
{{EmbedInteractiveExample("pages/js/functions-getter.html")}}
+ + + +

Syntax

+ +
{get prop() { ... } }
+{get [expression]() { ... } }
+ +

Parameter

+ +
+
prop
+
Der Name der Eigenschaft, die an die gegebene Funktion gebunden wird.
+
expression
+
Beginnend mit ECMAScript 2015, kann auch ein Ausdruck für einen berechneten Eigenschaftsnamen genutzt werden, der an die Funktion gebunden wird.
+
+ +

Beschreibung

+ +

Manchmal ist es wünschenswert, den Zugriff auf eine Eigenschaft zuzulassen, die einen dynamisch berechneten Wert zurückgibt oder man möchten den Status einer internen Variablen widerspiegeln, ohne dass explizite Methodenaufrufe erforderlich sind. In JavaScript kann dieses mit einem getter erreicht werden.

+ +

Es ist nicht möglich, dass ein Getter gleichzeitig an eine Eigenschaft gebunden ist und diese Eigenschaft tatsächlich einen Wert enthält, obwohl es möglich ist, einen Getter und einen Setter in Verbindung zu verwenden, um einen Pseudoeigenschaftstyp zu erstellen.

+ +

Folgendes ist zu beachten, wenn die get Syntax verwendet wird:

+ + + +

Beispiele

+ +

Definition eines Getters in einem neuen Objekt in der Objektinitialisierung

+ +

Folgendes erstellt eine Pseudoeigenschaft latest für das Objekt obj, welche dan letzte Arrayeintrag von log zurückgibt.

+ +
const obj = {
+  log: ['example','test'],
+  get latest() {
+    if (this.log.length === 0) return undefined;
+    return this.log[this.log.length - 1];
+  }
+}
+console.log(obj.latest); // "test".
+
+ +

Zu beachten ist, dass die Zuweisung eines Wertes auf latest keine Änderung bewirkt.

+ +

Löschen eines Getters mit dem delete Operator

+ +

Wenn ein Getter gelöscht werden soll, kann einfach {{jsxref("Operators/delete", "delete")}} benutzt werden:

+ +
delete obj.latest;
+
+ +

Definition eines Getter auf einem existierenden Objektes mit defineProperty

+ +

Um einem Getter später zu einem existierenden Objekt hinzuzufügen, kann jederzeit {{jsxref("Object.defineProperty()")}} benutzt werden.

+ +
const o = {a: 0};
+
+Object.defineProperty(o, 'b', { get: function() { return this.a + 1; } });
+
+console.log(o.b) // Runs the getter, which yields a + 1 (which is 1)
+ +

Einen berechneten Eigenschaftnamen benutzen

+ +
const expr = 'foo';
+
+const obj = {
+  get [expr]() { return 'bar'; }
+};
+
+console.log(obj.foo); // "bar"
+ +

Intelligente / Selbstüberschreibende / Lazy Getter

+ +

Mit Gettern kann eine Eigenschaft eines Objekts definiert werden, wobei der Wert der Eigenschaft nicht berechnen wird, bis auf die Eigenschaft zugegriffen wird. Ein Getter verschiebt die Kosten für die Berechnung des Werts auf den Zeitpunkt des Zugriffs. Wenn der der Getter nie benötigt wird, fallen nie Kosten an.

+ +

Eine weitere Optimierungstechnik, um die Berechnung eines Eigenschaftswerts zu verzögern und ihn für einen späteren Zugriff zwischenzuspeichern, sind intelligente (oder "memoisierte") Getter. Der Wert wird berechnet, wenn der Getter das erste Mal aufgerufen wird und wird dann zwischengespeichert, damit nachfolgende Zugriffe den zwischengespeicherten Wert zurückgeben, ohne ihn neu zu berechnen. Dies ist in den folgenden Situationen nützlich:

+ + + +
+

Das bedeutet, dass keine verzögerten Getter für eine Eigenschaft verwenden werden sollten, deren Wert sich voraussichtlich ändern wird, weil der Getter den Wert nicht neu berechnet.

+
+ +

Im folgenden Beispiel hat das Objekt einen Getter als eigene Eigenschaft. Beim Abrufen der Eigenschaft wird die Eigenschaft aus dem Objekt entfernt und erneut hinzugefügt, diesmal jedoch implizit als Dateneigenschaft. Abschließend wird der Wert zurückgegeben.

+ +
get notifier() {
+  delete this.notifier;
+  return this.notifier = document.getElementById('bookmarked-notification-anchor');
+},
+ +

Für Firefox Code sollte zusätzlich das XPCOMUtils.jsm Code Modul angeschaut werden, welches die defineLazyGetter() Funktion definiert.

+ +

get vs. defineProperty

+ +

Das get Schlüsselwort und {{jsxref("Object.defineProperty()")}} haben ähnliche Ergebnisse. Es gibt einen kleinen Unterschied zwischen beiden, wenn {{jsxref("classes")}} eingesetzt werden.

+ +

Wenn get eingesetzt wird, wird die Eigenschaft im Instnaz-Prototyp definiert, während beim Einsatz von {{jsxref("Object.defineProperty()")}} die Eigenschaft auf der Instanz definiert wird.

+ +
class Example {
+  get hello() {
+    return 'world';
+  }
+}
+
+const obj = new Example();
+console.log(obj.hello);
+// "world"
+
+console.log(Object.getOwnPropertyDescriptor(obj, 'hello'));
+// undefined
+
+console.log(
+  Object.getOwnPropertyDescriptor(
+    Object.getPrototypeOf(obj), 'hello'
+  )
+);
+// { configurable: true, enumerable: false, get: function get hello() { return 'world'; }, set: undefined }
+ +

Spezifikationen

+ + + + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.get")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/index.html b/files/de/web/javascript/reference/functions/index.html new file mode 100644 index 0000000000..278d3e997d --- /dev/null +++ b/files/de/web/javascript/reference/functions/index.html @@ -0,0 +1,594 @@ +--- +title: Funktionen +slug: Web/JavaScript/Reference/Functions +tags: + - Constructor + - Function + - Functions + - JavaScript + - Parameter + - parameters +translation_of: Web/JavaScript/Reference/Functions +--- +
{{jsSidebar("Functions")}}
+ +

Allgemein gesagt, ist eine Funktion ein "Unterprogramm", welches von Code außerhalb der Funktion (oder innerhalb der Funktion, im Fall von Rekursion) aufgerufen wird. Wie Programme selbst auch, ist eine Funktion eine Sequenz von ausgewählten Statements, die als Funktionskörper bezeichnet wird. Der Funktion können der Werte übergeben werden und die Funktion wird einen Wert zurückgeben.

+ +

In JavaScript sind Funktionen First-Class Objekte, weil sie Eigenschaften und Methoden genau wie jedes andere Objekt haben können. Was sie von anderen Objekten unterscheidet ist, dass sie aufgerufen werden können. Kurz gesagt sind es Function Objekte.

+ +

Für mehr Beispiele und Erklärungen, siehe auch im JavaScript Guide über Funktionen.

+ +

Beschreibung

+ +

Jede Funktion in JavaScript ist ein Function Objekt. Siehe {{jsxref("Function")}} für mehr Informationen zu Eigenschaften und Methoden von Function Objekten.

+ +

Um einen Wert abweichend vom Standard zurückzugeben, muss eine Funktion ein return Statement haben, welches den Rückgabewert spezifiziert. Eine Funktion ohne ein return Statement wird den Standardwert zurückgeben. Im Fall eines Konstruktoraufrufes mit dem Schlüsselwort new, wird der als Standardwert der Wert vom this Parameter zurückgegeben. Für alle anderen Funktionen wird als Standardwert {{jsxref("undefined")}} zurückgegeben.

+ +

Die Parameter eines Funktionsaufrufes sind die Argumente der Funktion. Argumente werden als Werte der Funktion übergeben. Wenn die Funktion den Wert eines Argumentes ändert, wirkt sich die Änderung nicht global oder in der aufrufenden Funktion aus. Jedoch sind auch Objektreferenzen Werte, welche speziell sind: Wenn die Funktion die Eigenschaften eines referenzierte Objekts ändern, ist die Änderung außerhalb der Funktion sichtbar, wie im folgenden Beispiel gezeigt wird:

+ +
/* Deklariert die Funktion 'myFunc' */
+function myFunc(theObject) {
+  theObject.brand = "Toyota";
+}
+
+/*
+ * Deklariert die Variable 'mycar';
+ * Erstellt und initialisiert ein neues Objekt;
+ * Weist Referenz 'mycar' zu
+ */
+var mycar = {
+  brand: "Honda",
+  model: "Accord",
+  year: 1998
+};
+
+/* gibt 'Honda' aus */
+console.log(mycar.brand);
+
+/* Übergibt Objektreferenz der Funktion */
+myFunc(mycar);
+
+/*
+ * gibt 'Toyota' als Wert der 'brand' Eigenschaft
+ * des Objektes aus, so wie er von der Funktion geändert wurde.
+ */
+console.log(mycar.brand);
+
+ +

Das this Schlüsselwort referenziert nicht zum aktuell ausgeführten Funktion, so, dass man das Function Objekt über den Namen referenzierten muss, auch im Funktionskörper.

+ +

Funktionen definieren

+ +

Es gibt verschiedenen Möglichkeiten Funktionen zu definieren:

+ +

Die Funktionsdeklaration (function Statement)

+ +

Es gibt eine spezielle Syntax für das Deklarieren von Funktionen (siehe Funktionsstatement für mehr Details):

+ +
function name([param[, param[, ... param]]]) {
+   statements
+}
+
+ +
+
name
+
Der Funktionsname.
+
+ +
+
param
+
Der Name eines Arguments, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
+ +
+
statements
+
Die Statements, welche den Funktionskörper der Funktion bilden.
+
+ +

Der Funktionsausdruck (function Ausdruck)

+ +

Ein Funktionsausdruck ist ähnlich wie eine Funktionsdeklaration und hat die selbe Syntax (siehe Funktionsausdruck für Details). Ein Funktionsausdruck ist manchmal ein Teil eines größeren Ausdrucks. Man kann benannte Funktionsausdrücke (in denen der Name des Ausdrucks zum Beispiel im Aufrufstack benutzt wird) oder anonyme Funktionsausdrücke definieren. Funktionsausdrücke werden nicht an den Anfang des Gültigkeitsbereiches verschoben (hoisted), was bedeutet, dass sie nicht vor der Definition im Code benutzt werden können.

+ +
function [name]([param[, param[, ... param]]]) {
+   statements
+}
+
+ +
+
name
+
Der Funktionsname. Kann weggelassen werden, wodurch die Funktion eine sogenannte anonyme Funktion ist.
+
+ +
+
param
+
Der Name eines Arguments, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
statements
+
Die Statements, welche den Funktionskörper der Funktion bilden.
+
+ +

Hier ist ein Beispiel für einen anonymen Funktionsausdruck (name wird nicht benutzt):

+ +
var myFunction = function() {
+    statements
+}
+ +

Es ist auch möglich den Namen in der Funktionsdefinition erreichbar zu machen, indem eine benannter Funktionsausdruck erstellt wird:

+ +
var myFunction = function namedFunction(){
+    statements
+}
+
+ +

Ein Vorteil beim Erstellen eines benannten Funktionsausdrucks ist, dass im Fall eines auftretenden Fehlers, der Name der Funktion im Stack Trace enthalten ist, was es einfacher macht den Ursprung des Fehlers zu finden.

+ +

Wie gezeigt, beginnen beide Beispiele nicht mit dem function Schlüsselwort. Statements die Funktionen enthalten aber nicht mit function beginnen, sind Funktionsausdrücke.

+ +

Wenn eine Funktion nur einmal benutzt wird, wird ein Pattern namens IIFE (Immediately Invokable Function Expression) genutzt.

+ +
(function() {
+    statements
+})();
+ +

IIFE sind Funktionsausdrücke, die direkt nach dem Definieren ausgeführt werden.

+ +

Die Generatorfunktionendeklaration (function* Statement)

+ +

Es gibt eine spezielle Syntax für die Deklaration von Generatorfunktionen (siehe {{jsxref('Statements/function*', 'function* Statement')}} für Details):

+ +
function* name([param[, param[, ... param]]]) {
+   statements
+}
+
+ +
+
name
+
Der Funktionsname.
+
+ +
+
param
+
Der Name eines Arguments, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
+ +
+
statements
+
Die Statements, welche den Funktionskörper der Funktion bilden.
+
+ +

Der Generatorfunktionsausdruck (function* Ausdruck)

+ +

Ein Generatorfunktionsausdruck ist ähnlich wie eine Generatorfunktionsdeklaration und hat die selbe Syntax (siehe {{jsxref('Operators/function*', 'function* expression')}} für Details):

+ +
function* [name]([param[, param[, ... param]]]) {
+   statements
+}
+
+ +
+
name
+
Der Funktionsname. Kann weggelassen werden, wodurch die Funktion eine sogenannte anonyme Funktion ist.
+
+ +
+
param
+
Der Name eines Arguments, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
statements
+
Die Statements, welche den Funktionskörper der Funktion bilden.
+
+ +

Der Pfeilfunktionsausdruck (=>)

+ +

Eine Pfeilfunktionsausdruck hat eine kürzere Syntax und der this Wert ist lexikalisch gebunden (siehe Pfeilfunktionen für Details):

+ +
([param[, param]]) => {
+   statements
+}
+
+param => expression
+
+ +
+
param
+
Der Name eines Arguments. Keine Argumente müssen mit () angegeben werden. Für nur ein Argument sind die Klammern nicht notwendig (z. B. foo => 1).
+
statements or expression
+
Mehrere Statements müssen in Klammern geschrieben werden. Ein einziger Ausdruck benötigt keine Klammern. Dieser Ausdruck ist implizit der Rückgabewert der Funktion.
+
+ +

Der Function Konstruktor

+ +
+

Hinweis: Der Einsatz des Function Konstruktors, um eine Funktion zu erstellen wird nicht empfohlen, weil der Funktionskörper als String übergeben wird, welcher von einigen JS Engines nicht optimiert werden kann und zu Problemen führen kann.

+
+ +

Wie alle anderen Objekte, können {{jsxref("Function")}} Objekte mit dem new Operator erstellt werden:

+ +
new Function (arg1, arg2, ... argN, functionBody)
+
+ +
+
arg1, arg2, ... argN
+
Null oder mehr Namen, welche von der Funktion als formale Parameter benutzt werden. Jeder muss ein valider JavaScript Bezeichner sein.
+
+ +
+
functionBody
+
Ein String, der die JavaScript Statements enthält, die den Funktionskörper formen.
+
+ +

Das Ausführen des Function Konstruktors als Funktion (ohne den Einsatz des new Operators) hat den selben Effekt wie das Aufrufen als Konstruktor.

+ +

Der GeneratorFunction Konstruktor

+ +
+

Hinweis: GeneratorFunction ist kein globales Objekt, kann aber von Generatorfunktionsinstanzen erhalten werden (siehe {{jsxref("GeneratorFunction")}} für mehr Details).

+
+ +
+

Hinweis: Der Einsatz des GeneratorFunction Konstruktors, um eine Funktion zu erstellen wird nicht empfohlen, weil der Funktionskörper als String übergeben wird, welcher von einigen JS Engines nicht optimiert werden kann und zu Problemen führen kann.

+
+ +

Wie alle anderen Objekte, können {{jsxref("GeneratorFunction")}} Objekte mit dem new Operator erstellt werden:

+ +
new GeneratorFunction (arg1, arg2, ... argN, functionBody)
+
+ +
+
arg1, arg2, ... argN
+
Null oder mehr Namen, welche von der Funktion als formale Parameter benutzt werden. Jeder muss ein valider JavaScript Bezeichner sein oder eine Liste solcher Strings mit Komma getrennt. Zum Beispiel "x", "theValue", or "a,b".
+
+ +
+
functionBody
+
Ein String, der die JavaScript Statements enthält, die den Funktionskörper formen.
+
+ +

Das Ausführen des GeneratorFunction Konstruktors als Funktion (ohne den Einsatz des new Operators) hat den selben Effekt wie das Aufrufen als Konstruktor.

+ +

Funktionsparameter

+ +

Standardparameter

+ +

Standard Funktionsparameter erlauben es formale Parameter mit einem Standardwert zu initialisieren, wenn kein Wert oder undefined übergeben wird. Für mehr Details siehe Standardparameter.

+ +

Rest Parameter

+ +

Die Rest Parameter Syntax erlaubt die Repräsentation von beliebig fielen Argumenten als ein Array. Für mehr Details siehe Rest Parameter.

+ +

Das arguments Objekt

+ +

Man kann die Funktionsargumente in einer Funktion referenzieren, indem das arguments Objekt benutzt wird. Siehe arguments.

+ + + +

Methodenfunktionen definieren

+ +

Getter und Setter Funktionen

+ +

Man kann Getter (Zugriffsmethoden) und Setter (Änderungsmethoden) bei jedem Standardobjekt oder benutzerdefinierten Objekt, welches das Hinzufügen von neuen Eigenschaften unterstützt. Die Syntax für das Definieren von Gettern und Settern beim Einsatz der Objektliteralsyntax.

+ +
+
get
+
+

Bindet eine Objekteigenschaft an eine Funktion, welche aufgerufen wird, wenn der Wert der Eigenschaft abgefragt wird.

+
+
set
+
Bindet eine Objekteigenschaft an eine Funktion, welche aufgerufen wird, wenn der Wert der Eigenschaft geändert wird.
+
+ +

Methodendefinitionssyntax

+ +

Angefangen mit ECMAScript 2015 kann man eigene Methoden in einer kürzeren Syntax, ähnlich wie Getter und Setter, definieren. Siehe Methodendefinition für mehr Details.

+ +
var obj = {
+  foo() {},
+  bar() {}
+};
+ +

Konstruktor vs. Deklaration vs. Ausdruck

+ +

Das folgende wird verglichen:

+ +

Eine Funktion, die mit dem Function Konstruktor definiert wird und der Variablen multiply zugewiesen wird:

+ +
var multiply = new Function('x', 'y', 'return x * y');
+ +

Eine Funktionsdeklaration mit dem Namen multiply:

+ +
function multiply(x, y) {
+   return x * y;
+} // there is no semicolon here
+
+ +

Ein Funktionsausdruck einer anonymen Funktion, die der Variablen multiply zugewiesen wird:

+ +
var multiply = function(x, y) {
+   return x * y;
+};
+
+ +

Ein Funktionsausdruck der Funktion func_name, die der Variablen multiply zugewiesen wird:

+ +
var multiply = function func_name(x, y) {
+   return x * y;
+};
+
+ +

Unterschiede

+ +

Alle machen annähernd die selben Dinge, jedoch mit kleinen subtilen Unterschieden:

+ +

Es gibt einen Unterschied zwischen dem Funktionsnamen und der Variable, der die Funktion zugewiesen wird. Der Funktionsnamen kann nicht geändert werden, während die Variable, die mit der Funktion zugewiesen ist, überschrieben werden kann. Der Funktionsname kann nur innerhalb des Funktionskörpers benutzt werden. Der Versuch diesen außerhalb des Funktionskörpers zu benutzen resultiert in einem Fehler (oder undefined, wenn der Funktionsname vorher mit einem var Statement deklariert wurde). Zum Beispiel:

+ +
var y = function x() {};
+alert(x); // Führt zu einem Error
+
+ +

Der Funktionsname taucht auch auf, wenn die Funktion mit der toString Methode serialisiert wird.

+ +

Auf der anderen Seite ist die Variable, der die Funktion zugewiesen ist, nur durch ihren Gültigkeitsbereich begrenzt, der garantiert den Geltungsbereich einschließt, in dem die Funktion deklariert ist.

+ +

Wie das 4. Beispiel zeigt, kann sich der Funktionsname von dem Namen der Variablen, der die Funktion zugewiesen ist, unterscheiden. Diese sind nicht voneinander abhängig. Eine Funktionsdeklaration erstellt ebenfalls eine Variable mit dem selben Namen wie die Funktion. Im Gegensatz zu den durch Funktionsausdrücke definierten Funktionen können Funktionen, die durch Funktionsdeklarationen definiert sind, über ihren Namen in dem Bereich aufgerufen werden, in dem sie definiert wurden:

+ +

Eine Funktionsdefinition mit 'new Function' hat keinen Funktionsnamen. In der SpiderMonkey JavaScript Engine haben solche Funktionen in serialisierter Form immer den Namen "anonymous". Zum Beispiel gibt alert(new Function()) folgendes aus:

+ +
function anonymous() {
+}
+
+ +

Weil die Funktion aktuell keinen Namen hat, ist anonymous keine Variable, die in der Funktion erreicht werden kann. Zum Beispiel führt folgendes zu einem Fehler:

+ +
var foo = new Function("alert(anonymous);");
+foo();
+
+ +

Anders als Funktionsdefinitionen mit Funktionsausdrücken oder dem Function Konstruktor, kann eine Funktionsdefinition mit Funktionsdeklaration genutzt werden, bevor bevor sie deklariert wird. Zum Beispiel:

+ +
foo(); // alerts FOO!
+function foo() {
+   alert('FOO!');
+}
+
+ +

Eine Funktionsdefinition mit einem Funktionsausdruck oder einer Funktionsdeklaration erbt den aktuellen Gültigkeitsbereich. Das bedeutet, die Funktion bildet eine Closure. Auf der anderen Seite erbt eine Funktion, die mit dem Function Konstruktor definiert wird, keinen anderen Gültigkeitsbereich außer dem globalen (welchen alle Funktionen erben).

+ +
/*
+ * Declare and initialize a variable 'p' (global)
+ * and a function 'myFunc' (to change the scope) inside which
+ * declare a varible with same name 'p' (current) and
+ * define three functions using three different ways:-
+ *     1. function declaration
+ *     2. function expression
+ *     3. function constructor
+ * each of which will log 'p'
+ */
+var p = 5;
+function myFunc() {
+    var p = 9;
+
+    function decl() {
+        console.log(p);
+    }
+    var expr = function() {
+        console.log(p);
+    };
+    var cons = new Function('\tconsole.log(p);');
+
+    decl();
+    expr();
+    cons();
+}
+myFunc();
+
+/*
+ * Logs:-
+ * 9  - for 'decl' by function declaration (current scope)
+ * 9  - for 'expr' by function expression (current scope)
+ * 5  - for 'cons' by Function constructor (global scope)
+ */
+
+ +

Funktionsdefinitionen als Funktionsausdrücke und Funktionsdeklarationen werden nur einmal übersetzt, während das bei Function Konstruktoren nicht so ist. Das bedeutet, dass der Funktionskörper, der dem Function Konstruktor übergeben wird, mit jedem Aufruf des Konstruktors erneut übersetzt wird. Weil ein Funktionsausdruck jedes mal eine Closure erstellt und der Funktionskörper aber nicht erneut übersetzt wird, sind Funktionsausdrücke um einiges schneller als "new Function(...)". Deshalb sollte der Function Konstruktor überall vermieden werden, wo es geht.

+ +

Es sollte bemerkt werden, dass immer wenn Funktionsausdrücke und Funktionsdeklarationen verschachtelt in einer Funktion generiert vom Function Konstruktor erstellt werden, sie nicht mehrfach übersetzt werden. Zum Beispiel:

+ +
var foo = (new Function("var bar = \'FOO!\';\nreturn(function() {\n\talert(bar);\n});"))();
+foo(); // The segment "function() {\n\talert(bar);\n}" of the function body string is not re-parsed.
+ +

Eine Funktionsdeklaration wird sehr einfach (und oft unabsichtlich) in einen Funktionsausdruck geändert. Eine Funktionsdeklaration hört auf eine zu sein, wenn:

+ + + +
var x = 0;               // source element
+if (x === 0) {           // source element
+   x = 10;               // not a source element
+   function boo() {}     // not a source element
+}
+function foo() {         // source element
+   var y = 20;           // source element
+   function bar() {}     // source element
+   while (y === 10) {    // source element
+      function blah() {} // not a source element
+      y++;               // not a source element
+   }
+}
+
+ +

Beispiele

+ +
// Funktionsdeklaration
+function foo() {}
+
+// Funktionsausdruck
+(function bar() {})
+
+// Funktionsausdruck
+x = function hello() {}
+
+
+if (x) {
+   // Funktionsausdruck
+   function world() {}
+}
+
+
+// Funktionsdeklaration
+function a() {
+   // Funktionsdeklaration
+   function b() {}
+   if (0) {
+      // Funktionsausdruck
+      function c() {}
+   }
+}
+
+ +

Funktionen als Block-Level-Element

+ +

Beginnend mit ES2015 sind Funktionen im strict Modus an den Block gebunden. Vor ES2015 waren Funktionen auf Blockebene im strikten Modus verboten.

+ +
'use strict';
+
+function f() {
+  return 1;
+}
+
+{
+  function f() {
+    return 2;
+  }
+}
+
+f() === 1; // true
+
+// f() === 2 nicht im strict Modus
+
+ +

Block-level Funktionen im nicht-strict Code

+ +

Kurz gesagt: nicht machen.

+ +

Im nicht strict Code verhalten sich Funktionsdeklarationen innerhalb von Blöcken merkwürdig. Zum Beispiel:

+ +
if (shouldDefineZero) {
+   function zero() {     // DANGER: compatibility risk
+      console.log("This is zero.");
+   }
+}
+
+ +

ES2015 besagt, dass wenn shouldDefineZero false ist, zero niemals definiert wird, weil der Block nie ausgeführt wird. Jedoch ist das ein neuer Teil des Standards. Historisch war dieser Teil unspezifiziert und einigen Browser definierten zero egal, ob der Block ausgeführt wurde oder nicht.

+ +

Im strict Modus verhalten sich alle Browser, die ES2015 unterstützen, gleich. zero wird nur Definiert wenn shouldDefineZero true ist und nur in dem Gültigkeitsbereich des if-Blocks.

+ +

Ein sicherer Weg eine Funktion bedingt zu definieren ist es einen Funktionsausdruck einer Variablen zuzuweisen:

+ +
var zero;
+if (shouldDefineZero) {
+   zero = function() {
+      console.log("This is zero.");
+   };
+}
+
+ +

Beispiele

+ +

Zurückgeben einer formatierten Zahl

+ +

Die folgende Funktion gibt einen String zurück, der eine formatierte Zahlenrepräsentation mit führenden Nullen enthält.

+ +
// This function returns a string padded with leading zeros
+function padZeros(num, totalLen) {
+   var numStr = num.toString();             // Initialize return value as string
+   var numZeros = totalLen - numStr.length; // Calculate no. of zeros
+   for (var i = 1; i <= numZeros; i++) {
+      numStr = "0" + numStr;
+   }
+   return numStr;
+}
+
+ +

Die folgende Statements rufen die padZeros Funktion auf.

+ +
var result;
+result = padZeros(42,4); // returns "0042"
+result = padZeros(42,2); // returns "42"
+result = padZeros(5,4);  // returns "0005"
+
+ +

Prüfen, ob eine Funktoin vorhanden ist

+ +

Man kann prüfen, ob eine Funktion existiert, indem man den typeof Operator benutzt wird. Im folgenden Beispiel wird getestet, ob das Objekt window eine Eigenschaft mit dem Namen noFunc hat, die eine Funktion ist. Wenn das so ist, wird sie benutzt, andernfalls wird etwas anderes gemacht.

+ +
 if ('function' === typeof window.noFunc) {
+   // use noFunc()
+ } else {
+   // do something else
+ }
+
+ +

Zu beachten ist, dass im if Test eine Referenz zu noFunc benutzt wird — es stehen keine Klammern () nach dem Funktionsnamen, so dass die Funktion nicht aufgerufen wird.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0
{{SpecName('ES5.1', '#sec-13', 'Function Definition')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-function-definitions', 'Function definitions')}}{{Spec2('ES6')}}Neu: Pfeilfunktionen, Generatorfunktionen, Standardparameter, Rest Parameter.
{{SpecName('ESDraft', '#sec-function-definitions', 'Function definitions')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/methoden_definitionen/index.html b/files/de/web/javascript/reference/functions/methoden_definitionen/index.html new file mode 100644 index 0000000000..bf4d432627 --- /dev/null +++ b/files/de/web/javascript/reference/functions/methoden_definitionen/index.html @@ -0,0 +1,230 @@ +--- +title: Methoden Definitionen +slug: Web/JavaScript/Reference/Functions/Methoden_Definitionen +tags: + - ECMAScript 2015 + - Funktionen + - JavaScript + - Objekte + - Syntax +translation_of: Web/JavaScript/Reference/Functions/Method_definitions +--- +
{{JsSidebar("Functions")}}
+ +

Beginnend mit ECMAScript 2015 wurde eine kürzere Syntax für Methodendefinitionen in Objekt Initialisierungen eingeführt. Es ist eine Abkürzung für die Zuweisung einer Funktion an einen Methodennamen.

+ +

Syntax

+ +
var obj = {
+  property( parameters… ) {},
+  *generator( parameters… ) {},
+// also with computed keys:
+  [property]( parameters… ) {},
+  *[generator]( parameters… ) {},
+// compare ES5 getter/setter syntax:
+  get property() {},
+  set property(value) {}
+};
+
+ +

Beschreibung

+ +

Die Syntax der Kurzschreibweise ähnelt der in ECMAScript 2015 eingeführten Syntax der getter und setter.

+ +

Gegeben sei der folgende Quellcode:

+ +
var obj = {
+  foo: function() {},
+  bar: function() {}
+};
+ +

Jetzt können Sie das abkürzen zu:

+ +
var obj = {
+  foo() {},
+  bar() {}
+};
+ +
+

Hinweis: Die kurze Syntax benutzt benamte Funktionen statt anonymen Funktionen (wie in ...foo: function() {}...). Benamte Funktionen können sich vom Funktionskörper aus aufrufen (für anonyme Funktionen ist das unmöglich, weil sie keinen Bezeichner haben). Für mehr Details, siehe {{jsxref("Operators/function","function","#Beispiele")}}.

+
+ +

Kurze Generatormethoden

+ +

Generatormethoden können mit der kurzen Syntax ebenfalls definiert werden. Zu beachten ist, dass der Stern (*) in der kurzen Syntax nur vor dem Namen der Generatoreigenschaft geschrieben werden kann. * g(){} funktioniert, g *(){} funktioniert nicht.

+ +
// Using a named property (pre-ES2015)
+var obj2 = {
+  g: function*() {
+    var index = 0;
+    while(true)
+      yield index++;
+  }
+};
+
+// The same object using shorthand syntax
+var obj2 = {
+  * g() {
+    var index = 0;
+    while(true)
+      yield index++;
+  }
+};
+
+var it = obj2.g();
+console.log(it.next().value); // 0
+console.log(it.next().value); // 1
+ +

Methodendefinitionen die nicht konstruiert werden können

+ +

Alle Methodendefinitionen die keine Konstruktoren sind werden einen {{jsxref("TypeError")}} erzeugen,  wenn man versucht sie zu instantieren.

+ +
var obj = {
+  method() {},
+};
+new obj.method; // TypeError: obj.method is not a constructor
+
+var obj = {
+  * g() {}
+};
+new obj.g; // TypeError: obj.g is not a constructor (changed in ES2016)
+
+ +

Beispiele

+ +

Ein einfacher Testfall

+ +
var obj = {
+  a : "foo",
+  b(){ return this.a; }
+};
+console.log(obj.b()); // "foo"
+
+ +

Berechnete Eigenschaftsnamen

+ +

Die Kurzschreib-Syntax unterstützt auch berechnete Eigenschaftsnamen.

+ +
var bar = {
+  foo0 : function (){return 0;},
+  foo1(){return 1;},
+  ["foo" + 2](){return 2;},
+};
+
+console.log(bar.foo0()); // 0
+console.log(bar.foo1()); // 1
+console.log(bar.foo2()); // 2
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-method-definitions', 'Method definitions')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ES7', '#sec-method-definitions', 'Method definitions')}}{{Spec2('ES7')}}Geändert, dass Generatormethoden ebenfalls nicht initialisierbar sind und einen Fehler schmeißen, wenn sie mit new eingesetzt werden.
{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Method definition shorthand{{CompatChrome("39")}}{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatOpera("26")}}{{CompatNo}}
Generator methods are not constructable (ES2016){{CompatUnknown}}{{CompatGeckoDesktop("43")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Method definition shorthand{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Generator methods are not constructable (ES2016){{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile("43")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

SpiderMonkey spezifische Hinweise

+ + + +

See also

+ + diff --git a/files/de/web/javascript/reference/functions/pfeilfunktionen/index.html b/files/de/web/javascript/reference/functions/pfeilfunktionen/index.html new file mode 100644 index 0000000000..a29b5ea3cf --- /dev/null +++ b/files/de/web/javascript/reference/functions/pfeilfunktionen/index.html @@ -0,0 +1,360 @@ +--- +title: Pfeilfunktionen +slug: Web/JavaScript/Reference/Functions/Pfeilfunktionen +tags: + - ECMAScript 2015 + - Functions + - Intermediate + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Functions/Arrow_functions +--- +
{{jsSidebar("Functions")}}
+ +

Der Ausdruck einer Pfeilfunktion hat eine kürzere Syntax als ein Funktionsausdruck und hat kein eigenes this, arguments, super, oder new.target. Solche Funktionsausdrücke sind am besten für Funktionen, die nicht als Methode genutzt werden, geeignet und können nicht als Konstruktoren verwendet werden.

+ +
{{EmbedInteractiveExample("pages/js/functions-arrow.html")}}
+ +

Syntax

+ +

Basis Syntax

+ +
(param1, param2, …, paramN) => { statements }
+(param1, param2, …, paramN) => expression
+// gleich zu: => { return expression; }
+
+// Klammern sind optional, wenn nur ein Parametername vorhanden ist:
+(singleParam) => { statements }
+singleParam => { statements }
+
+// Die Parameterliste für eine parameterlose Funktion muss mit einem Klammernpaar geschrieben werden
+() => { statements }
+
+ +

Fortgeschrittene Syntax

+ +
// Der Body kann eingeklammert werden, um ein Objektliteral Ausdruck zurück zu geben:
+params => ({foo: bar})
+
+// Rest Parameter und Default Parameter werden unterstützt
+(param1, param2, ...rest) => { statements }
+(param1 = defaultValue1, param2, …, paramN = defaultValueN) => {
+statements }
+
+// Destrukturierung in der Parameterliste ist ebenfalls unterstützt
+var f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;
+f(); // 6
+
+ +

Beschreibung

+ +

Siehe auch "ES6 In Depth: Arrow functions" on hacks.mozilla.org.

+ +

Zwei Faktoren haben die Einführung von Pfeilfunktionen beeinflusst: kürzere Funktionen und dass this nicht gebunden ist.

+ +

Kürzere Funktionen

+ +
var elements = [
+  "Hydrogen",
+  "Helium",
+  "Lithium",
+  "Beryllium"
+];
+
+elements.map(function(element) {
+  return element.length
+}); // [8, 6, 7, 9]
+
+elements.map(element => {
+  return element.length
+}); // [8, 6, 7, 9]
+
+elements.map(({length}) => length); // [8, 6, 7, 9]
+ +

Keine Bindung von this

+ +

Vor (der Einführung von) Pfeilfunktionen definierte jede Funktion ihren eigenen this-Wert (d.h. ein neues Objekt im Falle eines Konstruktors; in strict mode Funktionsaufrufen nicht definiert; bzw. das kontextuelle Objekt, wenn die Funktion als eine "Objekt-Methode" aufgerufen wurde, usw.). Dies stellte sich innerhalb eines objektorientierten Programmierstils als lästig heraus.

+ +
function Person() {
+  // Der Person() Konstruktor definiert `this` als Instanz von sich selbst.
+  this.age = 0;
+
+  setInterval(function growUp() {
+    // Im nicht Strict Modus, definiert die growUp() Funktion `this`
+    // als das globale Objekt (weil das der Ort ist, an dem growUp() ausgeführt wird),
+    // das sich von dem `this`, welches vom Person() Konstruktor definiert wurde unterscheidet.
+    this.age++;
+  }, 1000);
+}
+
+var p = new Person();
+ +

In ECMAScript 3/5 konnte dies durch Zuweisung des Wertes von this an eine Variable, welche umschlossen werden konnte, behoben werden.

+ +
function Person() {
+  var that = this;
+  that.age = 0;
+
+  setInterval(function growUp() {
+    // Der Rückruf bezieht sich auf jene `that`-Variable,
+    // deren Wert das zu erwartende Objekt ist.
+    that.age++;
+  }, 1000);
+}
+ +

Alternativ könnte eine gebundene Funktion erstellt werden, sodass der passende this-Wert an die growUp()-Funktion übergeben würde.

+ +

Eine Pfeilfunktion erstellt keinen eigenen this Kontext, wodurch this die ursprüngliche Bedeutung des umschließenden Kontextes trägt. Somit funktioniert der folgende Code wie erwartet.

+ +
function Person(){
+  this.age = 0;
+
+  setInterval(() => {
+    this.age++; // |this| bezieht sich entsprechend auf das Person-Objekt
+  }, 1000);
+}
+
+var p = new Person();
+ +

Zusammenhang mit dem Strict Mode

+ +

Vorausgesetzt, dass this aus dem umschließenden lexikalischen Kontext kommt, werden Strict Mode Regeln bezüglich this einfach ignoriert.

+ +
var f = () => {'use strict'; return this};
+f() === window; // oder das globale Objekt
+ +

Die restlichen strict mode Regeln verhalten sich normal.

+ +

Aufruf durch call oder apply

+ +

Da this in Pfeilfunktionen nicht gebunden ist, können call() oder apply() Methoden nur Argumente übergeben; this wird ignoriert:

+ +
var adder = {
+  base : 1,
+
+  add : function(a) {
+    var f = v => v + this.base;
+    return f(a);
+  },
+
+  addThruCall: function(a) {
+    var f = v => v + this.base;
+    var b = {
+      base : 2
+    };
+
+    return f.call(b, a);
+  }
+};
+
+console.log(adder.add(1));         // Dies würde 2 ausgeben
+console.log(adder.addThruCall(1)); // Dies würde nach wie vor 2 ausgeben
+ +

Keine Bindung von Argumenten

+ +

Pfeilfunktionen haben kein eigenes arguments Objekt. Somit ist arguments einfach eine Referenz auf den Namen innerhalb des umschließenden Geltungsbereichs (scope).

+ +
var arguments = [1, 2, 3];
+var arr = () => arguments[0];
+
+arr(); // 1
+
+function foo(n) {
+  var f = () => arguments[0] + n; // implizite Argumenten-Bindung von foo
+  return f();
+}
+
+foo(1); // 2
+ +

In den meisten Fällen sind Rest Parameters eine gute Alternative zum Einsatz des arguments Objektes:

+ +
function foo(n) {
+  var f = (...args) => args[0] + n;
+  return f(10);
+}
+
+foo(1); // 11
+ +

Pfeilfunktionen als Methoden

+ +

Wie angegeben, sind Ausdrücke von Pfeilfunktionen am besten geeignet für nicht-methodische Funktionen. Man sehe, was geschieht, wenn versucht wird, sie als Methoden zu verwenden.

+ +
'use strict';
+
+var obj = {
+  i: 10,
+  b: () => console.log(this.i, this),
+  c: function() {
+    console.log( this.i, this)
+  }
+}
+obj.b(); // gibt undefined, Window {...} aus (oder das globale Objekt)
+obj.c(); // gibt 10, Object {...} aus
+ +

Pfeilfunktionen definieren (binden sozusagen) kein eigenes this. Ein anderes Beispiel, das {{jsxref("Object.defineProperty()")}} betrifft:

+ +
'use strict';
+
+var obj = {
+  a: 10
+};
+
+Object.defineProperty(obj, "b", {
+  get: () => {
+    console.log(this.a, typeof this.a, this);
+    return this.a+10; // stellt das globale Objekt 'Window' dar, 'this.a' gibt daher 'undefined' zurück
+  }
+});
+
+ +

Verwendung des new Operators

+ +

Pfeilfunktionen können nicht als Konstruktoren verwendet werden. Sie führen zu einem Fehler, wenn auf ihnen ein new angewendet wird.

+ +
var Foo = () => {};
+var foo = new Foo(); // TypeError: Foo is not a constructor
+
+ +

Einsatz der prototype Eigenschaft

+ +

Pfeilfunktionen haben keine prototype Eigenschaft.

+ +
var Foo = () => {};
+console.log(Foo.prototype); // undefined
+
+ +

Verwendung des Schlüsselwortes yield

+ +

Das yield-Schlüsselwort sollte im Körper einer Pfeilfunktion nicht verwendet werden (außer wenn dies innerhalb von darin weiter verschachtelten Funktionen erlaubt ist). Als Folge können Pfeilfunktionen nicht als Generatoren verwendet werden.

+ +

Funktionskörper

+ +

Pfeilfunktionen können entweder einen "knappen" oder einen gewöhnlichen "Blockkörper" haben.

+ +

In einem knappen Körper ist lediglich ein Ausdruck nötig und eine implizite Rückgabe wird angehängt. In einem Blockkörper muss eine explizite Rückgabe-Anweisung verwendet werden.

+ +
var func = x => x * x;
+// knappe Syntax, implizierte Rückgabe
+
+var func = (x, y) => { return x + y; };
+// mit Blockkörper, explizite Rückgabe wird benötigt
+
+ +

Rückgabe von Objekt-Literalen

+ +

Man bedenke, dass die Rückgabe von Objekt-Literalen unter Verwendung der knappen Syntax params => {object:literal} nicht so ausgeführt wird, wie man es erwarten würde:

+ +
var func = () => {  foo: 1  };
+// Der Aufruf von func() gibt undefined zurück!
+
+var func = () => {  foo: function() {}  };
+// SyntaxError: function-Anweisung erfordert einen Namen
+ +

Der Grund dafür ist, dass der Code in geschweiften Klammern ({}) als eine Sequenz von Anweisungen übersetzt wird (d.h. foo wird als Bezeichner behandelt und nicht als Schlüssel eines Objekt-Literals).

+ +

Man bedenke, das Objekt-Literal in Klammern zu setzen:

+ +
var func = () => ({ foo: 1 });
+ +

Zeilenumbruch

+ +

Pfeilfunktionen können keinen Zeilenumbruch zwischen Parametern und dem Pfeil haben.

+ +
var func = ()
+           => 1;
+// SyntaxError: Ausdruck erwartet, '=>' erhalten
+ +

Übersetzungsreihenfolge

+ +

Der Pfeil innerhalb einer Pfeilfunktion ist kein Operator. Allerdings haben Pfeilfunktionen im Vergleich zu gewöhnlichen Funktionen besondere Übersetzungsregeln, welche mit der Priorität von Operatoren (operator precedence) anders interagieren.

+ +
let callback;
+
+callback = callback || function() {}; // ok
+
+callback = callback || () => {};
+// SyntaxError: invalid arrow-function arguments
+
+callback = callback || (() => {});    // ok
+
+ +

Weitere Beispiele

+ +
// Eine leere Pfeilfunktion gibt undefined zurück
+let empty = () => {};
+
+(() => "foobar")()
+// Gibt "foobar" zurück
+// (Das ist eine Immediately Invoked Function Expression
+// siehe IIFE im Glossar
+
+var simple = a => a > 15 ? 15 : a;
+simple(16); // 15
+simple(10); // 10
+
+let max = (a, b) => a > b ? a : b;
+
+// Einfaches filtering, mapping, ... von Arrays
+
+var arr = [5, 6, 13, 0, 1, 18, 23];
+
+var sum = arr.reduce((a, b) => a + b);
+// 66
+
+var even = arr.filter(v => v % 2 == 0);
+// [6, 0, 18]
+
+var double = arr.map(v => v * 2);
+// [10, 12, 26, 0, 2, 36, 46]
+
+// Weitere knappe Zusicherungsketten (promise chains)
+promise.then(a => {
+  // ...
+}).then(b => {
+   // ...
+});
+
+// Parameterlose Pfeilfunktionen, welche visuell einfacher zu verstehen sind
+setTimeout( _ => {
+  console.log("I happen sooner");
+  setTimeout( _ => {
+    // deeper code
+    console.log("I happen later");
+  }, 1);
+}, 1);
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-arrow-function-definitions', 'Arrow Function Definitions')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-arrow-function-definitions', 'Arrow Function Definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.functions.arrow_functions")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/rest_parameter/index.html b/files/de/web/javascript/reference/functions/rest_parameter/index.html new file mode 100644 index 0000000000..a529c7b1d6 --- /dev/null +++ b/files/de/web/javascript/reference/functions/rest_parameter/index.html @@ -0,0 +1,167 @@ +--- +title: Rest Parameter +slug: Web/JavaScript/Reference/Functions/rest_parameter +tags: + - Functions + - JavaScript + - Rest + - Rest Parameter +translation_of: Web/JavaScript/Reference/Functions/rest_parameters +--- +
{{jsSidebar("Functions")}}
+ +

Mit der Rest Parameter Syntax kann man beliebig viele Parameter als Array empfangen.

+ +
{{EmbedInteractiveExample("pages/js/functions-restparameters.html")}}
+ + + +

Syntax

+ +
function f(a, b, ...restArgs) {
+  // ...
+}
+
+ +

Beschreibung

+ +

Wenn vor dem letzten Parameter einer Funktion ... steht wird aus diesem Parameter ein Array von 0 (inklusiv) bis zu restArgs.length (exklusiv), welches weitere der Funktion übergebene Parameter enthält.

+ +

Im oberen Beispiel enthält das restArgs alle weiteren Argumente außer die ersten beiden, da diese bereits von den Variablen a und b erfasst werden.

+ +

Unterschiede zwischen Rest Parametern und dem arguments Objekt

+ +

Es gibt drei Hauptunterschiede zwischen Rest Parametern und dem arguments Objekt:

+ + + +

Von arguments zu einem Array

+ +

Rest Parameter wurden eingeführt, um Standardcode zu reduzieren, welche beim Einsatz von arguments anfällt

+ +
// Before rest parameters, the following could be found:
+function f(a, b) {
+  var args = Array.prototype.slice.call(arguments, f.length);
+
+  // …
+}
+
+// to be equivalent of
+
+function f(a, b, ...args) {
+
+}
+
+ +

Destrukturierte Rest Parameter

+ +

Rest Parameter können destrukturiert werden, was bedeutet, dass sie in einzelne Variablen entpackt werden können. Siehe destrukturierende Zuweisung.

+ +
function f(...[a, b, c]) {
+  return a + b + c;
+}
+
+f(1)          // NaN (b and c are undefined)
+f(1, 2, 3)    // 6
+f(1, 2, 3, 4) // 6 (the fourth parameter is not destructured)
+ +

Beispiele

+ +

Weil theArgs ein Array ist, ist die Anzahl der Argumente mit der length Eigenschaft gegeben:

+ +
function fun1(...theArgs) {
+  console.log(theArgs.length);
+}
+
+fun1();  // 0
+fun1(5); // 1
+fun1(5, 6, 7); // 3
+
+ +

Im nächsten Beispiel wird ein Rest Parameter eingesetzt, um alle Argumente außer dem ersten in einem Array zu sammeln. Jedes wird dann mit dem ersten Argument multipliziert und als Array zurückgegeben:

+ +
function multiply(multiplier, ...theArgs) {
+  return theArgs.map(function(element) {
+    return multiplier * element;
+  });
+}
+
+var arr = multiply(2, 1, 2, 3);
+console.log(arr); // [2, 4, 6]
+
+ +

Das folgende Beispiel zeigt, dass Array Methoden auf Rest Parameter jedoch nicht auf arguments Objekten eingesetzt werden können:

+ +
function sortRestArgs(...theArgs) {
+  var sortedArgs = theArgs.sort();
+  return sortedArgs;
+}
+
+console.log(sortRestArgs(5, 3, 7, 1)); // shows 1, 3, 5, 7
+
+function sortArguments() {
+  var sortedArgs = arguments.sort();
+  return sortedArgs; // this will never happen
+}
+
+// throws a TypeError: arguments.sort is not a function
+console.log(sortArguments(5, 3, 7, 1));
+
+ +

Um Array Methoden auf einem arguments Objekt zu benutzen, muss dieses in ein echtes Array konvertiert werden.

+ +
function sortArguments() {
+  var args = Array.from(arguments);
+  var sortedArgs = args.sort();
+  return sortedArgs;
+}
+console.log(sortArguments(5, 3, 7, 1)); // 1, 3, 5, 7
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-function-definitions', 'Function Definitions')}}{{Spec2('ES6')}}Initiale Definition
{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+
+ + +

{{Compat("javascript.functions.rest_parameters")}}

+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/functions/set/index.html b/files/de/web/javascript/reference/functions/set/index.html new file mode 100644 index 0000000000..7b0e5fcd83 --- /dev/null +++ b/files/de/web/javascript/reference/functions/set/index.html @@ -0,0 +1,149 @@ +--- +title: Setter +slug: Web/JavaScript/Reference/Functions/set +tags: + - ECMAScript 5 + - Functions + - JavaScript +translation_of: Web/JavaScript/Reference/Functions/set +--- +
{{jsSidebar("Functions")}}
+ +

Die set Syntax bindet eine Objekteigenschaft an eine Funktion welche aufgerufen wird, wenn die Eigenschaft neu beschrieben wird.

+ +
{{EmbedInteractiveExample("pages/js/functions-setter.html")}}
+ + + +

Syntax

+ +
{set prop(val) { . . . }}
+{set [expression](val) { . . . }}
+ +

Parameter

+ +
+
prop
+
Der Name der Eigenschaft, die an die gegebene Funktion gebunden wird.
+
+ +
+
val
+
Ein Alias für die Variable, die den Wert enthält, der der Eigenschaft prop zugewiesen wird.
+
expression
+
Beginnend mit ECMAScript 2015, kann auch ein Ausdruck für einen berechneten Eigenschaftsnamen genutzt werden, der an die Funktion gebunden wird.
+
+ +

Beschreibung

+ +

In JavaScript kann ein Setter benutzt werden, um eine Funktion aufzurufen, wenn eine Eigenschaft geändert werden soll. Setter werden oft in Verbindung mit Gettern als Pseudoeigenschaft benutzt. Es ist nicht möglich gleichzeitig einen Setter auf einer Eigenschaft zu haben, die eine tatsächlichen Wert hält.

+ +

Das folgende ist zu beachten, wenn mit der set Syntax gearbeitet wird:

+ +
+ +
+ +

Ein Setter kann mit dem delete Operator gelöscht werden.

+ +

Beispiele

+ +

Definieren eines Setters in einem neuen Objekt in der Objektinitialisierung

+ +

Das folgende definiert eine Pseudoeigenschaft current im Objekt language, die bei einer Zuweisung einen Wert in das log Array hinzufügt:

+ +
var language = {
+  set current(name) {
+    this.log.push(name);
+  },
+  log: []
+}
+
+language.current = 'EN';
+console.log(language.log); // ['EN']
+
+language.current = 'FA';
+console.log(language.log); // ['EN', 'FA']
+
+ +

Zu beachten ist, dass current nicht definiert ist und der Zugriff auf diese undefined als Ergebnis liefert.

+ +

Löschen eines Setter mit dem delete Operator

+ +

Wenn ein Setter gelöscht werden soll, muss man einfach delete benutzen:

+ +
delete o.current;
+
+ +

Definieren eines Setters auf einem existierenden Objekts mit defineProperty

+ +

Um einen Setter später zu einem existierenden Objekt hinzuzufügen, benutzt man {{jsxref("Object.defineProperty()")}}.

+ +
var o = {a: 0};
+
+Object.defineProperty(o, 'b', { set: function(x) { this.a = x / 2; } });
+
+o.b = 10; // Runs the setter, which assigns 10 / 2 (5) to the 'a' property
+console.log(o.a) // 5
+ +

Einsatz eines berechneten Eigenschaftsnamen

+ +
var expr = 'foo';
+
+var obj = {
+  baz: 'bar',
+  set [expr](v) { this.baz = v; }
+};
+
+console.log(obj.baz); // "bar"
+obj.foo = 'baz';      // run the setter
+console.log(obj.baz); // "baz"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}{{Spec2('ES5.1')}}Initiale Definition.
{{SpecName('ES6', '#sec-method-definitions', 'Method definitions')}}{{Spec2('ES6')}}Berechnete Eigenschaftsnamen hinzugefügt.
{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.functions.set")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html b/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html new file mode 100644 index 0000000000..790a7abcff --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html @@ -0,0 +1,89 @@ +--- +title: 'Array.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +--- +
{{JSRef}}
+ +
Der Initialwert der @@iterator Eigenschaft ist das selbe Funktionsobjekt wie der Initialwert der {{jsxref("Array.prototype.values()", "values()")}} Eigenschaft.
+ +

Syntax

+ +
arr[Symbol.iterator]()
+ +

Rückgabewert

+ +

Der Initialwert für den {{jsxref("Array.prototype.values()", "values()")}} Iterator. Im Standardfall gibt arr[Symbol.iterator] die Funktion von {{jsxref("Array.prototype.values()", "values()")}}  zurück.

+ +

Beispiele

+ +

Iterieren mit einer for...of Schleife

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+// your browser must support for..of loop
+// and let-scoped variables in for loops
+for (let letter of eArr) {
+  console.log(letter);
+}
+
+ +

Alternative Iteration

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+console.log(eArr.next().value); // w
+console.log(eArr.next().value); // y
+console.log(eArr.next().value); // k
+console.log(eArr.next().value); // o
+console.log(eArr.next().value); // p
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@iterator")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/@@species/index.html b/files/de/web/javascript/reference/global_objects/array/@@species/index.html new file mode 100644 index 0000000000..c4de8a7978 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@species/index.html @@ -0,0 +1,76 @@ +--- +title: 'get Array[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@species +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@species +--- +
{{JSRef}}
+ +

Die Array[@@species] Zugriffseigenschaft gibt den Array Konstruktor zurück.

+ +

Syntax

+ +
Array[Symbol.species]
+
+ +

Rückgabewert

+ +

Der {{jsxref("Array")}} Konstruktor.

+ +

Beschreibung

+ +

Die species Zugriffseigenschaft gibt den Standard-Konstruktor des Array Objekts zurück. Unterklassen können die Zuweisung Überschreiben, um die Konstruktorzuweisung ändern.

+ +

Beispiele

+ +

Die species Eigenschaft gibt die Standard-Konstruktor-Funktion, welches der Array Konstruktor für Array Objekte ist.

+ +
Array[Symbol.species]; // function Array()
+ +

In einem abgeleiteten Collection Objekt (z. B. ein benutzerdefiniertes Array MyArray), ist der MyArray der species des MyArray Konstruktors. Manchmal möchte man in abgeleiteten Klassenden Oberklassenkonstruktor zurückgeben. Dieses kann mit Überschreiben erreicht werden:

+ +
class MyArray extends Array {
+  // Overwrite MyArray species to the parent Array constructor
+  static get [Symbol.species]() { return Array; }
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-array-@@species', 'get Array [ @@species ]')}}{{Spec2('ES6')}}Initial Definition.
{{SpecName('ESDraft', '#sec-get-array-@@species', 'get Array [ @@species ]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@species")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html b/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html new file mode 100644 index 0000000000..2cb4b51b11 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html @@ -0,0 +1,76 @@ +--- +title: 'Array.prototype[@@unscopables]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +--- +
{{JSRef}}
+ +

Die @@unscopable Symbol Eigenschaft enthält Namen von Eigenschaften, welche vor der ES2015 Version nicht im ECMAScript Standard waren. Diese Eigenschaften werden bei with Statement Bindungen ignoriert.

+ +

Syntax

+ +
arr[Symbol.unscopables]
+ +

Beschreibung

+ +

Der Standard Array Eigenschaften, die von den with Bindungen ausgenommen werden, sind: copyWithin, entries, fill, find, findIndex, includes, keys, und values.

+ +

Siehe {{jsxref("Symbol.unscopables")}} für das setzten von unscopables für eigene Objekte

+ +

{{js_property_attributes(0,0,1)}}

+ +

Beispiele

+ +

Der Folgende Quelltext funktioniert in ES5 und niedriger. Jedoch wurde in ECMAScript 2015 und Später die {{jsxref("Array.prototype.keys()")}} eingeführt. Das bedeutet, dass in with Umgebungen "keys" jetzt eine Methode und keine Variable ist. Hier kommt die eingebaute @@unscopables Array.prototype[@@unscopables] Symboleigenschaft ins Spiel und verhindert, dass einige der Array Methoden in einer with Anweisung gescoped werden.

+ +
var keys = [];
+
+with (Array.prototype) {
+  keys.push('something');
+}
+
+Object.keys(Array.prototype[Symbol.unscopables]);
+// ["copyWithin", "entries", "fill", "find", "findIndex",
+//  "includes", "keys", "values"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES2015', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@unscopables")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/concat/index.html b/files/de/web/javascript/reference/global_objects/array/concat/index.html new file mode 100644 index 0000000000..6bd46675da --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/concat/index.html @@ -0,0 +1,156 @@ +--- +title: Array.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/Array/concat +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat +--- +
{{JSRef}}
+ +

Die Methode concat() führt zwei oder mehr Arrays zu einem zusammen. Die Methode ändert nicht die existierenden Arrays, sondern gibt stattdessen ein neues zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-concat.html")}}
+ + + +

Syntax

+ +
var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])
+ +

Parameter

+ +
+
valueN
+
Arrays und/oder Werte, die mit dem aktuellen zu einem neuen Array zusammenführt werden sollen.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

concat generiert ein neues Array. Dieses besteht aus den Elementen des Arrays, auf dem diese Methode aufgerufen wurde, gefolgt von dem Element oder den Elementen, die als Argument übergeben wurden.

+ +

Die concat Methode verändert nicht das this Objekt oder eines der übergebenen Argumente, sondern gibt eine flache Kopie (shallow copy) zurück, die Kopien der Elemente in den ursprünglichen Arrays enthält. Elemente der ursprünglichen Arrays werden folgendermaßen in das neue Array kopiert:

+ + + +
+

Anmerkung: Die Zusammenführung von Arrays und Werten verändert die Ausgangswerte und -objekte nicht. Etwaige weitere Operationen auf dem neuen Array (nur wenn Elemente keine Objekt-Referenz sind) haben keine Auswirkungen auf die Ausgangsarrays und umgekehrt.

+
+ +

Beispiele

+ +

Zusammenführen zweier Arrays

+ +

Der folgende Quellcode führt zwei Arrays zusammen:

+ +
var alpha = ['a', 'b', 'c'],;
+var numeric = [1, 2, 3];
+
+alpha.concat(numeric);
+// Result: ['a', 'b', 'c', 1, 2, 3]
+
+ +

Zusammenführen von drei Arrays

+ +

Der folgende Quellcode führt drei Arrays zusammen:

+ +
var num1 = [1, 2, 3],
+    num2 = [4, 5, 6],
+    num3 = [7, 8, 9];
+
+var nums = num1.concat(num2, num3);
+
+console.log(nums);
+// Result: [1, 2, 3, 4, 5, 6, 7, 8, 9]
+
+ +

Zusammenführen von Werten in ein Array

+ +

Der folgende Quellcode führt drei Werte in ein Array zusammen:

+ +
var alpha = ['a', 'b', 'c'];
+
+var alphaNumeric = alpha.concat(1, [2, 3]);
+
+console.log(alphaNumeric);
+// Result: ['a', 'b', 'c', 1, 2, 3]
+
+ +

Zusammenführen von geschachtelten Arrays

+ +

Der folgende Quellcode führt inneinander geschachtelte Array zusammen und demonstriert die Erhaltung der Referenzen:

+ +
var num1 = [[1]];
+var num2 = [2, [3]];
+
+var nums = num1.concat(num2);
+
+console.log(nums);
+// result in [[1], 2, [3]]
+
+// modify the first element of num1
+num1[0].push(4);
+
+console.log(nums);
+// results in [[1, 4], 2, [3]];
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.4', 'Array.prototype.concat')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.concat', 'Array.prototype.concat')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.concat")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/copywithin/index.html b/files/de/web/javascript/reference/global_objects/array/copywithin/index.html new file mode 100644 index 0000000000..6a7e9391d6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/copywithin/index.html @@ -0,0 +1,187 @@ +--- +title: Array.prototype.copyWithin() +slug: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +--- +
{{JSRef}}
+ +

Die copyWithin() Methode kopiert einen Teil eines Arrays in eine andere Stelle des gleichen Arrays und gibt das Array zurück, ohne die Länge des Arrays zu verändern.

+ +
{{EmbedInteractiveExample("pages/js/array-copywithin.html")}}
+ + + +

Syntax

+ +
arr.copyWithin(target)
+arr.copyWithin(target, start)
+arr.copyWithin(target, start, end)
+ +

Parameter

+ +
+
target
+
Null-Basierter Index an dem die kopierte Sequenz kopiert wird. Wenn target negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn target glößer oder gleich arr.length ist, wird nicht kopiert. Wenn target nach start positioniert ist, wird die kopierte Sequenz gekürzt, um in die Länge des Arrays zu passen.
+
start {{optional_inline}}
+
Null-Basierter Index an dem das Kopieren begonnen werden soll. Wenn start negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn start nicht angegeben wird, nutzt copyWithin den Standardwert 0.
+
end {{optional_inline}}
+
Null-Basierter Index an dem das Kopieren beendet werden soll. end ist exklusiv und wird deswegen nicht mitkopiert. Wenn end negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn end nicht angegeben wird, nutzt copyWithin den Standardwert arr.length.
+
+ +

Rückgabewert

+ +

Das geänderte Array

+ +

Beschreibung

+ +

copyWithin arbeitet wie die memcpy Funktion in C und C++ und ist eine hoch perfomante Methode zum Verschieben von Daten in einem {{jsxref("Array")}} oder {{jsxref("TypedArray")}}. Die Sequenz wird in einer Operation kopiert und eingefügt; Die eingefügte Sequenz wird den kopierten Wert haben, auch wenn sich die Regionen im Array überschneiden.

+ +

Die copyWithin Funktion ist absichtlich generisch. Es wird nicht vorausgesetzt, dass this ein {{jsxref("Array")}} Objekt ist.

+ +

Die copyWithin Methode ist eine veränderbare Methode. Sie ändert nichts an der Länge von this, aber sie ändert den Inhalt von this und erstellt neue Eigenschaften, wenn es notwendig ist.

+ +

Beispiele

+ +
[1, 2, 3, 4, 5].copyWithin(-2);
+// [1, 2, 3, 1, 2]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3);
+// [4, 5, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
+// [4, 2, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);
+// [1, 2, 3, 3, 5]
+
+[].copyWithin.call({length: 5, 3: 1}, 0, 3);
+// {0: 1, 3: 1, length: 5}
+
+// ES2015 Typed-Arrays sind Unterklassen von Array
+var i32a = new Int32Array([1, 2, 3, 4, 5]);
+
+i32a.copyWithin(0, 2);
+// Int32Array [3, 4, 5, 4, 5]
+
+// Für Plattformen die noch nicht ES6 unterstützen:
+[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
+// Int32Array [4, 2, 3, 4, 5]
+
+ +

Polyfill

+ +
if (!Array.prototype.copyWithin) {
+  Array.prototype.copyWithin = function(target, start/*, end*/) {
+    // Steps 1-2.
+    if (this == null) {
+      throw new TypeError('this is null or not defined');
+    }
+
+    var O = Object(this);
+
+    // Steps 3-5.
+    var len = O.length >>> 0;
+
+    // Steps 6-8.
+    var relativeTarget = target >> 0;
+
+    var to = relativeTarget < 0 ?
+      Math.max(len + relativeTarget, 0) :
+      Math.min(relativeTarget, len);
+
+    // Steps 9-11.
+    var relativeStart = start >> 0;
+
+    var from = relativeStart < 0 ?
+      Math.max(len + relativeStart, 0) :
+      Math.min(relativeStart, len);
+
+    // Steps 12-14.
+    var end = arguments[2];
+    var relativeEnd = end === undefined ? len : end >> 0;
+
+    var final = relativeEnd < 0 ?
+      Math.max(len + relativeEnd, 0) :
+      Math.min(relativeEnd, len);
+
+    // Step 15.
+    var count = Math.min(final - from, len - to);
+
+    // Steps 16-17.
+    var direction = 1;
+
+    if (from < to && to < (from + count)) {
+      direction = -1;
+      from += count - 1;
+      to += count - 1;
+    }
+
+    // Step 18.
+    while (count > 0) {
+      if (from in O) {
+        O[to] = O[from];
+      } else {
+        delete O[to];
+      }
+
+      from += direction;
+      to += direction;
+      count--;
+    }
+
+    // Step 19.
+    return O;
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ES2016', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ES2016')}} 
{{SpecName('ESDraft', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.copyWithin")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/entries/index.html b/files/de/web/javascript/reference/global_objects/array/entries/index.html new file mode 100644 index 0000000000..2bd4fb9942 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/entries/index.html @@ -0,0 +1,84 @@ +--- +title: Array.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Array/entries +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries +--- +
{{JSRef}}
+ +

Die entries() Methode gibt ein neues Array Iterator Objekt zurück, das Schlüssel-Wert-Paare für jeden Index im Array enthält.

+ +
{{EmbedInteractiveExample("pages/js/array-entries.html")}}
+ + + +

Syntax

+ +
arr.entries()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Array")}}-iterator Objekt.

+ +

Beispiele

+ +

Einsatz einer for…of Schleife

+ +
var a = ['a', 'b', 'c'];
+var iterator = a.entries();
+
+for (let e of iterator) {
+  console.log(e);
+}
+// [0, 'a']
+// [1, 'b']
+// [2, 'c']
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.entries', 'Array.prototype.entries')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.entries")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/every/index.html b/files/de/web/javascript/reference/global_objects/array/every/index.html new file mode 100644 index 0000000000..a29a0e4e0c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/every/index.html @@ -0,0 +1,195 @@ +--- +title: Array.prototype.every() +slug: Web/JavaScript/Reference/Global_Objects/Array/every +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/every +--- +
{{JSRef}}
+ +

Die every() Methode testet ob alle Elemente in einem Array einen Test bestehen, welcher mittels einer implementierten Funktion bereitgestellt wird.

+ +
+

Hinweis: Diese Methode gibt true für jede Bedingung bei einem leeren Array zurück.

+
+ +
{{EmbedInteractiveExample("pages/js/array-every.html")}}
+ + + +

Syntax

+ +
arr.every(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion welche jedes Element testet, mit drei Argumenten: +
+
currentValue (required)
+
Der aktuelle Wert des Arrays.
+
index{{Optional_inline}}
+
Der Index des aktuellen Elementes im Array.
+
array{{Optional_inline}}
+
Das Array auf welchem every aufgerufen wurde.
+
+
+
thisArg{{Optional_inline}}
+
Optional. Wert welcher als this in der callback Funktion benutzt wird.
+
+ +

Rückgabewert

+ +

true wenn die callback-Funktion einen {{Glossary("truthy")}} Wert für jedes Array-Element zurückgibt, andernfalls false.

+ +

Beschreibung

+ +

Die every Methode führt die übergebene callback Funktion für jedes Element in dem Array aus, solange die callback Funktion keinen {{Glossary("falsy")}} Wert zurückgibt. Wenn ein solches Element gefunden wird gibt die every Methode false zurück. Anderfalls, wenn callback für jedes Element einen {{Glossary("truthy")}} Wert zurück gibt, gibt die Funktion every true zurück. Die callback Funktion wird nur für Indizes im Array aufgerufen, denen ein Wert zugewiesen wurde; sie wird nicht aufgerufen für Indizes, die gelöscht wurden, oder welche, die nie beschrieben wurden.

+ +

Die callback Funktion wird mit drei Argumenten aufgerufen: Der Wert eines Elements, der Index des Elements und Array auf dem every aufgerufen wurde.

+ +

Wenn der thisArg Parameter von every angegeben wird, wird auf diesem Objekt die callback Funktion aufgerufen und dieses Objekt kann mit this aufgerufen werden. Anderfalls wird der Wert undefined für den Einsatz von this übergeben. Der this Wert ist nur in der callback Funktion verfügbar und wird nach den normalen Regeln für das ermitteln von this für die Funktion ermittelt.

+ +

Die every Funktion verändert nicht die Werte des Arrays, auf dem sie aufgerufen wird.

+ +

Die Anzahl der von every abzuarbeitenden Elemente wird vor dem ersten Aufruf von callback ermittelt. Elemente welche nach dem Aufruf von every angehängt werden, werden nicht von der callback Funktion besucht. Wenn existierende Element eines Arrays geändert werden, wird der callback Funktion der Wert übergeben, der zu dem Zeitpunkt des Aufrufens von callback im Array steht. Werte die gelöscht werden, werden nicht besucht.

+ +

every Arbeitet wie ein Allquantor in der Mathematik. Wenn das Array leer ist, gibt er true zurück. (Es ist wahr, dass alle Elemente einer leeren Menge immer alle Bedingungen erfüllen.)

+ +

Beispiele

+ +

Größe aller Arrayelemente abprüfen

+ +

Das folgende Beispiel testet, ob alle Elemente in einem Array größer oder gleich 10 sind.

+ +
function isBigEnough(element, index, array) {
+  return element >= 10;
+}
+[12, 5, 8, 130, 44].every(isBigEnough);   // false
+[12, 54, 18, 130, 44].every(isBigEnough); // true
+
+ +

Einsatz von arrow Funktionen

+ +

Arrow Funktionen unterstützen eine kürzere Syntax für den gleichen Test.

+ +
[12, 5, 8, 130, 44].every(elem => elem >= 10); // false
+[12, 54, 18, 130, 44].every(elem => elem >= 10); // true
+ +

Polyfill

+ +

every wurde im ECMA-262 Standard in der 5. Auflage hinzugefügt. Es kann sein, dass diese Funktion in anderer Implementierungen des Standards nicht vorkommt. Man dieses beheben, indem man den folgenden Quelltext an den Anfang eines Programms hinzufügt. Dadurch wird die every Funktion dort hinzugefügt, wo sie nicht nativ unterstützt wird. Der Algorithmus ist exakt der aus der 5. Auflage des ECMA-262 Standards, mit der Voraussetzung, dass Object und TypeError ihre originalen Werte haben und dass callbackfn.call die originale Funktion {{jsxref("Function.prototype.call")}} aufrufen kann.

+ +
if (!Array.prototype.every) {
+  Array.prototype.every = function(callbackfn, thisArg) {
+    'use strict';
+    var T, k;
+
+    if (this == null) {
+      throw new TypeError('this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the this
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal method
+    //    of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callbackfn) is false, throw a TypeError exception.
+    if (typeof callbackfn !== 'function') {
+      throw new TypeError();
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0.
+    k = 0;
+
+    // 7. Repeat, while k < len
+    while (k < len) {
+
+      var kValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method
+        //    of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let testResult be the result of calling the Call internal method
+        //     of callbackfn with T as the this value and argument list
+        //     containing kValue, k, and O.
+        var testResult = callbackfn.call(T, kValue, k, O);
+
+        // iii. If ToBoolean(testResult) is false, return false.
+        if (!testResult) {
+          return false;
+        }
+      }
+      k++;
+    }
+    return true;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.16', 'Array.prototype.every')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.every', 'Array.prototype.every')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.every', 'Array.prototype.every')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.every")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/fill/index.html b/files/de/web/javascript/reference/global_objects/array/fill/index.html new file mode 100644 index 0000000000..5f4821e986 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/fill/index.html @@ -0,0 +1,155 @@ +--- +title: Array.prototype.fill() +slug: Web/JavaScript/Reference/Global_Objects/Array/fill +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/fill +--- +
{{JSRef}}
+ +

Die fill() Methode befüllt ein Array mit einem statischen Wert von einem Startindex bis zu einem Endindex. Der Endindex wird nicht mit eingeschlossen.

+ +
{{EmbedInteractiveExample("pages/js/array-fill.html")}}
+ + + +

Syntax

+ +
arr.fill(value[, start[, end]])
+ +

Parameter

+ +
+
value
+
Wert, mit dem ein Array gefüllt werden soll.
+
start {{optional_inline}}
+
Startindex, Standardwert ist 0.
+
end {{optional_inline}}
+
Endindex, Standardwert ist this.length.
+
+ +

Rückgabewert

+ +

Das geänderte Array.

+ +

Beschreibung

+ +

Die fill Methode nimmt bis zu drei Argumente entgegen: value, start und end. Die Argumente start und end sind optional und haben als Standardwert 0 und length des this Objektes.

+ +

Wenn start negativ ist, wird stattdessen length+start benutzt, wobei length die Länge des Arrays ist. Wenn end negativ ist, wird stattdessen length+end benutzt.

+ +

Die fill Funktion ist absichtlich generisch. Es ist nicht nötig, dass der this Wert ein Array Objekt ist.

+ +

Die fill Methode ist eine verändernde Methode. Sie verändert das this Objekt selbst und gibt dieses zurück. Sie erstellt keine Kopie des Objektes.

+ +

Wenn der fill Methode ein Objekt übergeben wird, wird das Objekt kopiert und die Referenz der Kopie wird im Array eingesetzt.

+ +

Beispiele

+ +
[1, 2, 3].fill(4);               // [4, 4, 4]
+[1, 2, 3].fill(4, 1);            // [1, 4, 4]
+[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
+[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
+[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
+[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
+Array(3).fill(4);                // [4, 4, 4]
+[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}
+
+// Objects by reference.
+var arr = Array(3).fill({}) // [{}, {}, {}];
+arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]
+
+ +

Polyfill

+ +
if (!Array.prototype.fill) {
+  Object.defineProperty(Array.prototype, 'fill', {
+    value: function(value) {
+
+      // Steps 1-2.
+      if (this == null) {
+        throw new TypeError('this is null or not defined');
+      }
+
+      var O = Object(this);
+
+      // Steps 3-5.
+      var len = O.length >>> 0;
+
+      // Steps 6-7.
+      var start = arguments[1];
+      var relativeStart = start >> 0;
+
+      // Step 8.
+      var k = relativeStart < 0 ?
+        Math.max(len + relativeStart, 0) :
+        Math.min(relativeStart, len);
+
+      // Steps 9-10.
+      var end = arguments[2];
+      var relativeEnd = end === undefined ?
+        len : end >> 0;
+
+      // Step 11.
+      var final = relativeEnd < 0 ?
+        Math.max(len + relativeEnd, 0) :
+        Math.min(relativeEnd, len);
+
+      // Step 12.
+      while (k < final) {
+        O[k] = value;
+        k++;
+      }
+
+      // Step 13.
+      return O;
+    }
+  });
+}
+
+ +

Wenn es wirklich notwendig ist veraltete JavaScript-Umgebungen zu unterstützen, die Object.defineProperty nicht unterstützen, ist es meistens besser Methoden von Array.prototype nicht mit einem Polyfill zu unterstützen, weil sie nicht als nicht-aufzählbar eingestellt werden können.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.fill', 'Array.prototype.fill')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.fill', 'Array.prototype.fill')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.fill")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/filter/index.html b/files/de/web/javascript/reference/global_objects/array/filter/index.html new file mode 100644 index 0000000000..6f1ee08498 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/filter/index.html @@ -0,0 +1,235 @@ +--- +title: Array.prototype.filter() +slug: Web/JavaScript/Reference/Global_Objects/Array/filter +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - filter + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/filter +--- +
{{JSRef}}
+ +

filter() erstellt ein neues Array mit allen Elementen, die den von der bereitgestellten Funktion implementierten Test bestehen.

+ +
{{EmbedInteractiveExample("pages/js/array-filter.html")}}
+ + + +

Syntax

+ +
let newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
+ +

Parameter

+ +
+
callback
+
Eine Funktion, um jedes Element des Arrays zu testen. Die Funktion gibt true zurück, um das Element zu behalten, ansonsten false.
+
+
+
element
+
Das aktuell zu testende Element aus dem Array.
+
index {{optional_inline}}
+
Der Index des aktuell zu testenden Elements aus dem Array.
+
array {{optional_inline}}
+
Das Array auf welchem filter aufgerufen wurde.
+
+
+
thisArg {{optional_inline}}
+
Wert, der als this innerhalb der Funktion genutzt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array mit den Elementen, die den Test bestanden haben. Wenn kein Element den Test besteht, wird ein leeres Array zurückgegeben.

+ +

Beschreibung

+ +

filter() ruft eine bereitgestellte callback-Funktion einmal für jedes Element in einem Array auf und erstellt ein neues Array aller Werte, für die callback einen Wert zurückgibt der umgewandelt true ergibt. callback wird nur für Indizes des Arrays aufgerufen, denen Werte zugewiesen wurden. Es wird nicht für Indizes aufgerufen, die gelöscht oder denen nie Werte zugewiesen wurden. Array-Elemente, die den Test in callback nicht bestehen, werden einfach übersprungen und sind im neuen Array nicht enthalten.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
  2. +
  3. Der Index des Elements
  4. +
  5. Das Array-Objekt, das durchlaufen wird
  6. +
+ +

Falls der Parameter thisArg an filter übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

filter() selbst verändert das Array nicht, auf dem es aufgerufen wird.

+ +

Der Bereich der von filter() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von filter() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den filter() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von filter() gelöscht werden, bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt.

+ +

Beispiele

+ +

Alle kleinen Werte herausfiltern

+ +

Das folgende Beispiel nutzt filter(), um ein gefiltertes Array zu erstellen, aus dem alle Element mit Werten kleiner als 10 entfernt werden.

+ +
function isBigEnough(value) {
+  return value >= 10;
+}
+
+let filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
+// filtered is [12, 130, 44]
+
+ +

Filtern von ungültigen Werten aus JSON

+ +

Das folgende Beispiel nutzt filter(), um ein gefiltertes JSON zu erstellen, in welchem alle Elemente mit numerischer id ungleich null sind.

+ +
let arr = [
+  { id: 15 },
+  { id: -1 },
+  { id: 0 },
+  { id: 3 },
+  { id: 12.2 },
+  { },
+  { id: null },
+  { id: NaN },
+  { id: 'undefined' }
+];
+
+let invalidEntries = 0;
+
+function isNumber(obj) {
+  return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);
+}
+
+function filterByID(obj) {
+  if (isNumber(obj.id) && obj.id !== 0) {
+    return true;
+  }
+  invalidEntries++;
+  return false;
+}
+
+let arrByID = arr.filter(filterByID);
+
+console.log('Filtered Array\n', arrByID);
+// Filtered Array
+// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]
+
+console.log('Number of Invalid Entries = ', invalidEntries);
+// Number of Invalid Entries = 5
+
+ +

Suchen in Arrays

+ +

Das folgende Beispiel nutzt filter(), um ein Array gemäß eines Suchkriterius zu filtern.

+ +
let fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filter array items based on search criteria (query)
+ */
+function filterItems(arr, query) {
+  return arr.filter(function(el) {
+      return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
+  })
+}
+
+console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
+console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']
+ +

ES2015 Implementierung

+ +
const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filter array items based on search criteria (query)
+ */
+const filterItems = (arr, query) => {
+  return arr.filter(el => el.toLowerCase().indexOf(query.toLowerCase()) > -1);
+};
+
+console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
+console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']
+ +

Polyfill

+ +

filter() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von filter() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt dass callback.call() mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call()")}} auswertet wird und {{jsxref("Array.prototype.push()")}} seinen ursprünglichen Wert hat.

+ +
if (!Array.prototype.filter) {
+  Array.prototype.filter = function(func, thisArg) {
+    'use strict';
+    if ( ! ((typeof func === 'Function' || typeof func === 'function') && this) )
+        throw new TypeError();
+
+    let len = this.length >>> 0,
+        res = new Array(len), // preallocate array
+        t = this, c = 0, i = -1;
+    if (thisArg === undefined) {
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          if (func(t[i], i, t)){
+            res[c++] = t[i];
+          }
+        }
+      }
+    }
+    else{
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          if (func.call(thisArg, t[i], i, t)){
+            res[c++] = t[i];
+          }
+        }
+      }
+    }
+
+    res.length = c; // shrink down array to proper size
+    return res;
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.20', 'Array.prototype.filter')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES2015', '#sec-array.prototype.filter', 'Array.prototype.filter')}}{{Spec2('ES2015')}}
{{SpecName('ESDraft', '#sec-array.prototype.filter', 'Array.prototype.filter')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.filter")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/find/index.html b/files/de/web/javascript/reference/global_objects/array/find/index.html new file mode 100644 index 0000000000..2741360a67 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/find/index.html @@ -0,0 +1,243 @@ +--- +title: Array.prototype.find() +slug: Web/JavaScript/Reference/Global_Objects/Array/find +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/find +--- +
{{JSRef}}
+ +

Die Methode find() gibt den Wert des Elements eines Arrays zurück, welches als erstes die Bedingung einer bereitgestellten Testfunktion erfüllt. Andernfalls wird {{jsxref("undefined")}} zurückgegeben.

+ +
{{EmbedInteractiveExample("pages/js/array-find.html")}}
+ + + +

Siehe auch die Methode {{jsxref("Array.prototype.findIndex()", "findIndex()")}}, die den Index eines gefundenen Elements im Array anstelle seines Werts zurückgibt.

+ +

Wenn Sie die Position eines Elements ermitteln oder feststellen müssen, ob ein Element in einem Array vorhanden ist, verwenden Sie {{jsxref("Array.prototype.indexOf()", "indexOf()")}} oder {{jsxref("Array.prototype.includes()", "includes()")}}.

+ +

Syntax

+ +
arr.find(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die auf jedes Element angewendet wird mit drei Argumenten: +
+
element
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements im Array.
+
array {{optional_inline}}
+
Das Array, welches mit find() durlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird.
+
+ +

Rückgabewert

+ +

Der Wert des Elements, welches als erstes die Bedingung der bereitgestellten Testfunktion erfüllt. Andernfalls wird {{jsxref("undefined")}} zurückgegeben.

+ +

Beschreibung

+ +

find() führt die callback-Funktion einmal für jeden Index des Arrays aus, bis ein Index gefunden wird, in dem callback einen {{Glossary("truthy")}}-Wert zurückgibt. Wenn ein solches Element gefunden wird, gibt find() sofort den Wert dieses Elements zurück, {{jsxref("undefined")}}. callback wird für jeden Index des Arrays von 0 bis length - 1 aufgerufen und nicht nur für Indizes, denen Werte zugewiesen wurden. Dies kann bedeuten, dass es für Arrays mit Leerstellen weniger effizient ist als andere Methoden, die nur Indizes durchlaufen, denen ein Wert zugewiesen wurde.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
  2. +
  3. Der Index des Elements
  4. +
  5. Das Array-Objekt, das durchlaufen wird
  6. +
+ +

 

+ +

Falls der Parameter thisArg an find() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

find() selbst verändert das Array nicht, auf dem es aufgerufen wird.

+ +

Der Bereich der von find() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von find() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den find() beim Erreichen eines Elements antrifft und dann an callback übergibt. Gelöschte Elemente werden weiterhin verarbeitet.

+ +

Beispiele

+ +

Ermitteln eines Objekts innerhalb eines Arrays anhand eines seiner Eigenschaften

+ +
var inventory = [
+    {name: 'apples', quantity: 2},
+    {name: 'bananas', quantity: 0},
+    {name: 'cherries', quantity: 5}
+];
+
+function isCherries(fruit) {
+    return fruit.name === 'cherries';
+}
+
+console.log(inventory.find(isCherries));
+// { name: 'cherries', quantity: 5 }
+ +

Benutzung einer ES2015 Pfeilfunktion

+ +
const inventory = [
+    {name: 'apples', quantity: 2},
+    {name: 'bananas', quantity: 0},
+    {name: 'cherries', quantity: 5}
+];
+
+const result = inventory.find( fruit => fruit.name === 'cherries' );
+
+console.log(result) // { name: 'cherries', quantity: 5 }
+ +

Ermitteln einer Primzahl innerhalb eines Arrays

+ +

Im folgenden Beispiel wird ein Element im Array ermittelt, das eine Primzahl ist (oder {{jsxref("undefined")}} zurückgibt, wenn keine Primzahl vorhanden ist).

+ +
function isPrime(element, index, array) {
+  var start = 2;
+  while (start <= Math.sqrt(element)) {
+    if (element % start++ < 1) {
+      return false;
+    }
+  }
+  return element > 1;
+}
+
+console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
+console.log([4, 5, 8, 12].find(isPrime)); // 5
+
+ +

Das folgende Beispiel zeigt, dass nicht vorhandene und gelöschte Elemente durchlaufen werden und der Wert maßgeblich ist, der beim Erreichen des Elements angetroffen und an callback übergeben wird.

+ +
// Array deklarieren, das an Index 2, 3 und 4 keine Elemente hat
+var array = [0,1,,,,5,6];
+
+// Zeige alle Indizes, nicht nur die denen Werte zugewiesen wurden
+array.find(function(value, index) {
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+
+// Zeige alle Indizes, inklusive gelöschter
+array.find(function(value, index) {
+
+  // Lösche Element 5 in erstem Durchlauf
+  if (index == 0) {
+    console.log('Deleting array[5] with value ' + array[5]);
+    delete array[5];
+  }
+  // Element 5 wird weiterhin durchlaufen, obwohl es gelöscht wurde
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+// Erwartete Ausgaben:
+// Deleting array[5] with value 5
+// Visited index 0 with value 0
+// Visited index 1 with value 1
+// Visited index 2 with value undefined
+// Visited index 3 with value undefined
+// Visited index 4 with value undefined
+// Visited index 5 with value undefined
+// Visited index 6 with value 6
+
+ +

Polyfill

+ +

Diese Methode wurde der ECMAScript 2015-Spezifikation hinzugefügt und ist möglicherweise noch nicht in allen JavaScript-Implementierungen verfügbar. Sie können Array.prototype.find() jedoch mit dem folgenden Snippet nachrüsten:

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.find
+if (!Array.prototype.find) {
+  Object.defineProperty(Array.prototype, 'find', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return kValue.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return kValue;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return undefined.
+      return undefined;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+
+ +

Wenn Sie stark veraltete JavaScript-Engines unterstützen müssen, die {{jsxref("Object.defineProperty()")}} nicht unterstützen, empfiehlt es sich Methoden aus Array.prototype gar nicht mit Polyfills nachzubauen, da es nicht möglich ist sie als nicht-enumerierbar zu kennzeichnen.

+ +

Specifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-array.prototype.find', 'Array.prototype.find')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.find")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/findindex/index.html b/files/de/web/javascript/reference/global_objects/array/findindex/index.html new file mode 100644 index 0000000000..904ff025fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/findindex/index.html @@ -0,0 +1,189 @@ +--- +title: Array.prototype.findIndex() +slug: Web/JavaScript/Reference/Global_Objects/Array/findIndex +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex +--- +
{{JSRef}}
+ +

Die Methode findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird -1 zurückgegeben, um anzuzeigen, dass kein Element den Test bestanden hat.

+ +
{{EmbedInteractiveExample("pages/js/array-findindex.html")}}
+ + + +

Siehe auch die Methode {{jsxref("Array.find", "find()")}}, die den Wert eines Arrayelements anstelle dessen Index zurückgibt.

+ +

Syntax

+ +
arr.findIndex(callback(element[, index[, array]])[, thisArg])
+ +

Parameter

+ +
+
callback
+
Eine Funktion, die für jeden Wert im Array ausgeführt wird, bis sie true zurückgibt, um anzuzeigen, dass das gewünschte Element gefunden wurde. Sie akzeptiert 3 Argumente: +
+
element
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements, das im Array verarbeitet wird.
+
array {{optional_inline}}
+
Das Array, welches mit findIndex() durchlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird
+
+ +

Rückgabewert

+ +

Ein Index im Array, wenn ein Element den Test besteht, ansonsten -1.

+ +

Beschreibung

+ +

findIndex() ruft eine bereitgestellte callback-Funktion einmal für jeden Array-Index 0..length-1 (inklusive) im Array auf bis callback einen {{Glossary("truthy")}}-Wert findet.

+ +

Wird ein solches Element gefunden gibt findIndex() sofort den Index des gefundenen Elements zurück. Gibt callback nie einen {{Glossary("truthy")}}-Wert zurück oder ist length gleich 0 gibt findIndex() -1 zurück. Im Gegensatz zu einigen anderen Array-Methoden wie {{jsxref("Array.prototype.some()", "some()")}} wird in Arrays mit Leerstellen callback auch für Indizes aufgerufen, die keinen Inhalt haben.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
  2. +
  3. Der Index des Elements
  4. +
  5. Das Array-Objekt, das durchlaufen wird
  6. +
+ +

Falls der Parameter thisArg an findIndex() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

Der Bereich der von findIndex() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von findIndex() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den findIndex() beim Erreichen eines Elements antrifft und dann an callback übergibt. Gelöschte Elemente werden weiterhin verarbeitet.

+ +

Beispiele

+ +

Index einer Primzahl in einem Array finden

+ +

Das folgende Beispiel gibt den Index eines Elements im Array zurück, das eine Primzahl ist, oder -1, wenn keine Primzahl vorhanden ist.

+ +
function isPrime(element, index, array) {
+  var start = 2;
+  while (start <= Math.sqrt(element)) {
+    if (element % start < 1) {
+      return false;
+    } else {
+      start++;
+    }
+  }
+  return element > 1;
+}
+
+console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, not found
+console.log([4, 6, 7, 12].findIndex(isPrime)); // 2 (array[2] is 7)
+
+ +

Index mithilfe einer Pfeilfunktion ermitteln

+ +

Im folgenden Beispiel wird der Index einer Frucht mithilfe einer Pfeilfunktion ermittelt:

+ +
const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"];
+
+const index = fruits.findIndex(fruit => fruit === "blueberries");
+
+console.log(index); // 3
+console.log(fruits[index]); // blueberries
+
+ +

Polyfill

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.findindex
+if (!Array.prototype.findIndex) {
+  Object.defineProperty(Array.prototype, 'findIndex', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return k.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return k;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return -1.
+      return -1;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+
+ +

Wenn Sie stark veraltete JavaScript-Engines unterstützen müssen, die {{jsxref("Object.defineProperty()")}} nicht unterstützen, empfiehlt es sich Methoden aus Array.prototype gar nicht mit Polyfills nachzubauen, da es nicht möglich ist sie als nicht-enumerierbar zu kennzeichnen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-array.prototype.findindex', 'Array.prototype.findIndex')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.findIndex', 'Array.prototype.findIndex')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.findIndex")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/flat/index.html b/files/de/web/javascript/reference/global_objects/array/flat/index.html new file mode 100644 index 0000000000..4e18ff7649 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/flat/index.html @@ -0,0 +1,116 @@ +--- +title: Array.prototype.flat() +slug: Web/JavaScript/Reference/Global_Objects/Array/flat +tags: + - Array + - Experimental + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die flat() Methode erstellt rekursiv ein neues Array mit allen Elementen von Unterarrays bis zu einer spezifizierten Tiefe.

+ + + + + +

Syntax

+ +
var newArray = arr.flat(depth);
+ +

Parameter

+ +
+
depth {{optional_inline}}
+
Das Tiefenlevel, welches angibt, bis zu welcher Tiefe die Arraystruktur abgeflacht werden soll. Der Standardwert ist 1.
+
+ +

Rückgabewert

+ +

Ein neues Array, welches die Elemente der Unterarrays enthält.

+ +

Beispiele

+ +

Abflachen von geschachtelten Arrays

+ +
var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+// [1, 2, 3, 4]
+
+var arr2 = [1, 2, [3, 4, [5, 6]]];
+arr2.flat();
+// [1, 2, 3, 4, [5, 6]]
+
+var arr3 = [1, 2, [3, 4, [5, 6]]];
+arr3.flat(2);
+// [1, 2, 3, 4, 5, 6]
+
+ +

Abflachen und Löcher in Arrays

+ +

Die flat Methode entfernt leere Plätze in Arrays:

+ +
var arr4 = [1, 2, , 4, 5];
+arr4.flat();
+// [1, 2, 4, 5]
+ +

Alternative

+ +

reduce und concat

+ +
var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+
+// Um ein Array um eine Ebene zu glätten.
+arr1.reduce((acc, val) => acc.concat(val), []);
+// [1, 2, 3, 4]
+
+// Um mehrere Ebenen zu glätten muss reduce und concat rekursiv eingesetzt werden.
+
+var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
+
+function flattenDeep(arr1) {
+   return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
+}
+flattenDeep(arr1);
+
+// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Array.prototype.flat proposalCandidate (3) 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.flat")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/flatmap/index.html b/files/de/web/javascript/reference/global_objects/array/flatmap/index.html new file mode 100644 index 0000000000..2840429333 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/flatmap/index.html @@ -0,0 +1,117 @@ +--- +title: Array.prototype.flatMap() +slug: Web/JavaScript/Reference/Global_Objects/Array/flatMap +tags: + - Array + - Experimental + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flatMap +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die flatMap() Methode bildet jedes Element über eine Funktion ab und flacht das Ergebnis in ein Array ab. Sie ist identisch zu einem map gefolgt von einem flat der Tiefe 1, aber flatMap ist oft nützlich und beide in einer Methode zusammenführen ist etwas effizienter.

+ + + + + +

Syntax

+ +
var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
+    // return element for new_array
+}[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die ein Element für das neue Array erzeugt, welche drei Argumente hat: +
+
 
+
currentValue
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index{{optional_inline}}
+
Der Index des aktuell zu verarbeitende Elements in dem Array.
+
array{{optional_inline}}
+
Das Array, auf dem flatMap aufgerufen wurde.
+
+
+
thisArg{{optional_inline}}
+
Wert, der bei der Ausführung von callback für this genutzt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array mit jedem Element, dass aus dem Resultat der callback Funktion hervorgeht und auf die Tiefe 1 abgeflacht wurde.

+ +

Beschreibung

+ +

Siehe auf der Seite {{jsxref("Array.prototype.map()")}} für eine detaillierte Beschreibung der callback Funktion. Die flatMap Methode ist identisch zu map gefolgt von flat mit der Tiefe 1.

+ +

Beispiele

+ +

map und flatMap

+ +
var arr1 = [1, 2, 3, 4];
+
+arr1.map(x => [x * 2]);
+// [[2], [4], [6], [8]]
+
+arr1.flatMap(x => [x * 2]);
+// [2, 4, 6, 8]
+
+// only one level is flattened
+arr1.flatMap(x => [[x * 2]]);
+// [[2], [4], [6], [8]]
+
+ +

Alternative

+ +

reduce und concat

+ +
var arr1 = [1, 2, 3, 4];
+
+arr1.flatMap(x => [x * 2]);
+// ist equivalent zu
+arr1.reduce((acc, x) => acc.concat([x * 2]), []);
+// [2, 4, 6, 8]
+
+ +
//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Array.prototype.flatMap proposalCandidate (3) 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.flatMap")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/foreach/index.html b/files/de/web/javascript/reference/global_objects/array/foreach/index.html new file mode 100644 index 0000000000..faba9795cb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/foreach/index.html @@ -0,0 +1,303 @@ +--- +title: Array.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Array/forEach +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach +--- +
{{JSRef}}
+ +

Die forEach() Methode führt eine übergebene Funktion für jedes Element eines Arrays aus.

+ +
{{EmbedInteractiveExample("pages/js/array-foreach.html")}}
+ + + +

// a // b // c

+ +

Syntax

+ +
arr.forEach(function callback(currentValue [, index [, array]]) {
+    // Ihr Iterator
+}[, thisArg]);
+ +

Parameter

+ +
+
callback
+
Funktion, die auf jedes Element angewendet wird mit drei Argumenten:
+
+
+
currentValue
+
Der Wert des aktuellen Elements im Array.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements im Array.
+
array {{optional_inline}}
+
Das Array, welches mit forEach() durlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird.
+
 
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Beschreibung

+ +

forEach() ruft eine bereitgestellte callback-Funktion einmal für jedes Element in einem Array in aufsteigender Reihenfolge auf. Sie wird nicht für Elemente aufgerufen, die gelöscht oder nicht initialisiert wurden (d. h. Arrays mit leeren Elementen).

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
  2. +
  3. Der Index des Elements
  4. +
  5. Das Array-Objekt, das durchlaufen wird
  6. +
+ +

Falls der Parameter thisArg an forEach() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

forEach() selbst verändert das Array nicht, auf dem es aufgerufen wird (das aufgerufene callback kann jedoch Änderungen vornehmen).

+ +

Der Bereich der von forEach() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von forEach() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den forEach() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von forEach() gelöscht werden (z. B. durch {{jsxref("Array.prototype.shift()", "shift()")}}), bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt (siehe Beispiel unten).

+ +

forEach() führt callback einmal für jedes Element im Array aus; im Gegensatz zu {{jsxref("Array.prototype.map()", "map()")}} oder {{jsxref("Array.prototype.reduce()", "reduce()")}} gibt es immer den Wert {{jsxref("undefined")}} zurück und ist nicht verknüpfbar. Der typische Anwendungsfall ist das Ausführen von Nebenwirkungen am Ende einer einer solchen Kette.

+ +
+

Es gibt keine Möglichkeit eine forEach()-Schleife zu unterbrechen oder zu verlassen, außer durch das erzeugen einer Exception. Wird eine solche Möglichkeit jedoch benötigt, stellt forEach() das falsche Mittel dar.

+ +

Vorzeitiges Verlassen ist verfügbar in:

+ + + +

Die anderen Array Methoden {{jsxref("Array.prototype.every()", "every()")}}, {{jsxref("Array.prototype.some()", "some()")}}, {{jsxref("Array.prototype.find()", "find()")}} und {{jsxref("Array.prototype.findIndex()", "findIndex()")}} prüfen die Elemente im Array auf eine Bedingung, die einen {{Glossary("Truthy")}}-Wert zurückgibt mit dem bestimmt wird, ob weitere Durchläufe nötig sind.

+
+ +

Beispiele

+ +

forEach() statt einer for-Schleife

+ +
const items = ['item1', 'item2', 'item3'];
+const copy = [];
+
+// Vorher
+for (let i=0; i<items.length; i++) {
+  copy.push(items[i]);
+}
+
+// Nachher
+items.forEach(function(item){
+  copy.push(item);
+});
+ +

Inhalte eines Arrays ausgeben

+ +
+

Hinweis: Um den Inhalt eines Arrays vorformatiert auf der Konsole auszugeben können Sie auch {{jsxref("console.table()")}} verwenden. Dieses Beispiel zeigt eine weitere Möglichkeit mittels forEach().

+
+ +

Der folgende Code gibt eine Zeile pro Element des Arrays aus:

+ +
function logArrayElements(element, index, array) {
+  console.log('a[' + index + '] = ' + element);
+}
+
+// Hinweis zur Auslassung: Es gibt keinen Eintrag mit dem Index 2
+// somit wird dieser übersprungen
+[2, 5, , 9].forEach(logArrayElements);
+// Ausgabe:
+// a[0] = 2
+// a[1] = 5
+// a[3] = 9
+
+ +

Verwendung von thisArg

+ +

Das folgende (fingierte) Beispiel aktualisiert die Eigenschaften eines Objekts eines jeden Eintrags im Array:

+ +
function Counter() {
+  this.sum = 0;
+  this.count = 0;
+}
+Counter.prototype.add = function(array) {
+  array.forEach(function(entry) {
+    this.sum += entry;
+    ++this.count;
+  }, this);
+  // ^---- Beachten
+};
+
+var obj = new Counter();
+obj.add([2, 5, 9]);
+obj.count;
+// 3 
+obj.sum;
+// 16
+ +

Da forEach() der Parameter thisArg (this) zur Verfügung steht, wird er bei jedem Aufruf an callback weitergegeben, um es als seinen this-Wert zu benutzen.

+ +
+

Wenn das Funktionsargument durch die Pfeilnotation angegeben wird, kann der Parameter thisArg weggelassen werden, da Pfeilfunktionen den {{jsxref("Operators/this", "this")}}-Wert lexikalisch vermerken.

+
+ +

Funktion zum Kopieren eines Objekts

+ +

Der folgende Code erzeugt eine Kopie des übergebenen Objekts. Es gibt verschiedene Möglichkeiten, ein Objekt zu kopieren. Die Folgende ist nur eine davon und dient zur Veranschaulichung, wie Array.prototype.forEach() funktioniert, indem ECMAScript 5 Object.* Meta-Funktionen genutzt werden.

+ +
function copy(o) {
+  var copy = Object.create(Object.getPrototypeOf(o));
+  var propNames = Object.getOwnPropertyNames(o);
+
+  propNames.forEach(function(name) {
+    var desc = Object.getOwnPropertyDescriptor(o, name);
+    Object.defineProperty(copy, name, desc);
+  });
+
+  return copy;
+}
+
+var o1 = { a: 1, b: 2 };
+var o2 = copy(o1); // o2 sieht jetzt aus wie o1
+ +

Wird das Array während des Durchlaufes modifiziert, könnten andere Elemente übersprungen werden.

+ +

Das folgende Beispiel protokolliert "eins", "zwei", "vier". Wenn der Eintrag mit dem Wert "zwei" erreicht ist, wird der erste Eintrag des Arrays mit {{jsxref("Array.prototype.shift()", "shift()")}} entfernt, was dazu führt, dass alle übrigen Einträge um eine Position aufrücken. Weil Element "vier" jetzt an einer früheren Position im Array ist, wird "drei" übersprungen. forEach() erzeugt keine Kopie des Arrays vor dem Durchlauf.

+ +
var words = ['eins', 'zwei', 'drei', 'vier'];
+words.forEach(function(word) {
+  console.log(word);
+  if (word === 'zwei') {
+    words.shift();
+  }
+});
+// eins
+// zwei
+// vier
+ +

Polyfill

+ +

forEach() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von forEach() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("Object")}} und {{jsxref("TypeError")}} haben ihre ursprünglichen Werte und callback.call() wird mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call")}} ausgewertet.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.18
+// Reference: http://es5.github.io/#x15.4.4.18
+if (!Array.prototype.forEach) {
+
+  Array.prototype.forEach = function(callback, thisArg) {
+
+    var T, k;
+
+    if (this === null) {
+      throw new TypeError(' this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if (typeof callback !== "function") {
+      throw new TypeError(callback + ' is not a function');
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0
+    k = 0;
+
+    // 7. Repeat, while k < len
+    while (k < len) {
+
+      var kValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Call the Call internal method of callback with T as the this value and
+        // argument list containing kValue, k, and O.
+        callback.call(T, kValue, k, O);
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+    // 8. return undefined
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.forEach")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/from/index.html b/files/de/web/javascript/reference/global_objects/array/from/index.html new file mode 100644 index 0000000000..dd254fec88 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/from/index.html @@ -0,0 +1,227 @@ +--- +title: Array.from() +slug: Web/JavaScript/Reference/Global_Objects/Array/from +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/from +--- +
{{JSRef}}
+ +

Die Array.from() Methode erstellt eine neue, oberflächlich kopierte Array Instanz von einem Array-ähnlichen oder iterierbaren Objekt.

+ +
{{EmbedInteractiveExample("pages/js/array-from.html")}}
+ + + +

Syntax

+ +
Array.from(arrayLike[, mapFn[, thisArg]])
+ +

Parameter

+ +
+
arrayLike
+
Ein Array-ähnliches oder iterierbares Objekt, welches zu einem Array konvertiert wird.
+
mapFn{{Optional_inline}}
+
Map Funktion, welche auf jedes Element des Arrays angewendet wird.
+
thisArg{{Optional_inline}}
+
Wert, welcher als this beim Ausführen von mapFn genutzt wird.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

Array.from() erstellt ein Array aus:

+ + + +

Array.from() hat einen optionalen Parameter mapFn, welcher es erlaubt eine {{jsxref("Array.prototype.map", "map")}} Funktion auf jedem Element des Arrays (oder Subklassen) das erstellt wird, auszuführen. Genauer gesagt, ist Array.from(obj, mapFn, thisArg) dasselbe wie Array.from(obj).map(mapFn, thisArg), mit dem Unterschied, dass kein Array als Zwischenergebnis produziert wird. Das ist besonders wichtig für Array Subklassen, wie typed Arrays. Das Array des Zwischenergebnisses
+ würde sonst Werte kürzen, um dem zutreffenden Typ zu entsprechen.

+ +

Die length Eigenschaft der from() Methode ist 1.

+ +

In ES2015 erlaubt die class Syntax, Subklassen für eingebaute und benutzerdefinierte Klassen. Klassenseitige statische Methoden wie Array.from() sind von der Subklasse Array vererbt und erzeugen eine neue Instanz der Subklasse und nicht von Array.

+ +

Beispiele

+ +

Array von einem String

+ +
Array.from('foo');
+// ["f", "o", "o"];
+ +

Array von einem Set

+ +
var s = new Set(["foo", window]);
+Array.from(s);
+// ["foo", window]
+ +

Array von einem Map

+ +
var m = new Map([[1, 2], [2, 4], [4, 8]]);
+Array.from(m);
+// [[1, 2], [2, 4], [4, 8]]
+
+var mapper = new Map([['1', 'a'], ['2', 'b']]);
+Array.from(mapper.values());
+// ['a', 'b'];
+
+Array.from(mapper.keys());
+// ['1', '2'];
+ +

Array von einem Array ähnlichen Objekt (arguments)

+ +
function f() {
+  return Array.from(arguments);
+}
+
+f(1, 2, 3);
+
+// [1, 2, 3]
+ +

Einsatz von Arrow-Funktionen und Array.from

+ +
// Using an arrow function as the map function to
+// manipulate the elements
+Array.from([1, 2, 3], x => x + x);
+// [2, 4, 6]
+
+
+// Generate a sequence of numbers
+// Since the array is initialized with `undefined` on each position,
+// the value of `v` below will be `undefined`
+Array.from({length: 5}, (v, i) => i);
+// [0, 1, 2, 3, 4]
+
+ +

Polyfill

+ +

Array.from() wurde zum ECMA-262 Standard in der 6ten Version hinzugefügt. Es kann sein, dass diese in anderen Implementationen des Standards nicht verfügbar ist. Man kann das mit folgendem Code am Anfang eines Skriptes umgehen. Das Skript erlaubt das Benutzen von Array.from() in Implementationen, welche Array.from() nicht nativ unterstützen. Dieser Algorithmus ist genau derselbe, welcher in EMCA-262, 6te Version implementiert ist, angenommen Object und TypeError haben ihre originalen Werte und callback.call evaluiert den Original Wert von {{jsxref("Function.prototype.call")}}. Außerdem können echte iterierbare Elemente nicht mit einem Polyfill implementiert werden. Diese Implementation unterstützt keine generischen iterierbaren Elemente so wie sie definiert sind in der 6ten Version von ECMA-262.

+ +
// Production steps of ECMA-262, Edition 6, 22.1.2.1
+if (!Array.from) {
+  Array.from = (function () {
+    var toStr = Object.prototype.toString;
+    var isCallable = function (fn) {
+      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
+    };
+    var toInteger = function (value) {
+      var number = Number(value);
+      if (isNaN(number)) { return 0; }
+      if (number === 0 || !isFinite(number)) { return number; }
+      return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));
+    };
+    var maxSafeInteger = Math.pow(2, 53) - 1;
+    var toLength = function (value) {
+      var len = toInteger(value);
+      return Math.min(Math.max(len, 0), maxSafeInteger);
+    };
+
+    // The length property of the from method is 1.
+    return function from(arrayLike/*, mapFn, thisArg */) {
+      // 1. Let C be the this value.
+      var C = this;
+
+      // 2. Let items be ToObject(arrayLike).
+      var items = Object(arrayLike);
+
+      // 3. ReturnIfAbrupt(items).
+      if (arrayLike == null) {
+        throw new TypeError('Array.from requires an array-like object - not null or undefined');
+      }
+
+      // 4. If mapfn is undefined, then let mapping be false.
+      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
+      var T;
+      if (typeof mapFn !== 'undefined') {
+        // 5. else
+        // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.
+        if (!isCallable(mapFn)) {
+          throw new TypeError('Array.from: when provided, the second argument must be a function');
+        }
+
+        // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.
+        if (arguments.length > 2) {
+          T = arguments[2];
+        }
+      }
+
+      // 10. Let lenValue be Get(items, "length").
+      // 11. Let len be ToLength(lenValue).
+      var len = toLength(items.length);
+
+      // 13. If IsConstructor(C) is true, then
+      // 13. a. Let A be the result of calling the [[Construct]] internal method
+      // of C with an argument list containing the single item len.
+      // 14. a. Else, Let A be ArrayCreate(len).
+      var A = isCallable(C) ? Object(new C(len)) : new Array(len);
+
+      // 16. Let k be 0.
+      var k = 0;
+      // 17. Repeat, while k < len… (also steps a - h)
+      var kValue;
+      while (k < len) {
+        kValue = items[k];
+        if (mapFn) {
+          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
+        } else {
+          A[k] = kValue;
+        }
+        k += 1;
+      }
+      // 18. Let putStatus be Put(A, "length", len, true).
+      A.length = len;
+      // 20. Return A.
+      return A;
+    };
+  }());
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.from', 'Array.from')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.from")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/includes/index.html b/files/de/web/javascript/reference/global_objects/array/includes/index.html new file mode 100644 index 0000000000..64a51dfb73 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/includes/index.html @@ -0,0 +1,181 @@ +--- +title: Array.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/Array/includes +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/includes +--- +
{{JSRef}}
+ +

Die includes() Methode prüft, ob ein Array ein bestimmtes Element enthält, und gibt entsprechend true oder false aus. Es wird der selbe sameValueZero-Algorithmus benutzt, um ein gegebenes Element zu finden.

+ +
{{EmbedInteractiveExample("pages/js/array-includes.html")}}
+ + + +

Syntax

+ +
arr.includes(searchElement[, fromIndex])
+ +

Parameter

+ +
+
searchElement
+
Das zu suchende Element.
+
fromIndex {{optional_inline}}
+
Die Position im Array, ab welcher die Suche nach searchElement beginnt. Bei einem negativen Wert fängt die Suche beim Index array.length - fromIndex an. Default ist 0.
+
+ +

Rückgabewert

+ +
+
+

Ein {{jsxref("Boolean")}}.

+
+
+ +

Beispiele

+ +
[1, 2, 3].includes(2);     // true
+[1, 2, 3].includes(4);     // false
+[1, 2, 3].includes(3, 3);  // false
+[1, 2, 3].includes(3, -1); // true
+[1, 2, NaN].includes(NaN); // true
+
+ +

fromIndex ist größer oder gleich der Arraylänge

+ +

Wenn fromIndex größer oder gleich der Arraylänge ist, wird false zurückgegeben. Das Array wird nicht durchsucht.

+ +
var arr = ['a', 'b', 'c'];
+
+arr.includes('c', 3);   // false
+arr.includes('c', 100); // false
+
+ +

Berechneter Index ist kleiner als 0

+ +

Wenn fromIndex negativ ist, wird der Index berechnet, an dem die Suche im Array nach searchElement beginnen soll. Wenn diese Berechnung einen Index kleiner als 0 ergibt, wird das ganze Array durchsucht.

+ +
// Arraylänge ist 3
+// fromIndex ist -100
+// Der berechnete Index ist 3 + (-100) = -97
+
+var arr = ['a', 'b', 'c'];
+
+arr.includes('a', -100); // true
+arr.includes('b', -100); // true
+arr.includes('c', -100); // true
+
+ +

Einsatz von includes() als generische Methode

+ +

Die includes()-Methode is absichtlich generisch. Die this-Referenz muss nicht auf ein Array-Objekt zeigen, so dass auch andere Objekte (z. B. Array-ähnliche Objekte) genutzt werden können. Das Beispiel zeigt, wie includes() auf den Parametern (arguments) einer Funktion aufgerufen wird.

+ +
(function() {
+  console.log([].includes.call(arguments, 'a')); // true
+  console.log([].includes.call(arguments, 'd')); // false
+})('a', 'b', 'c')
+
+ +

Polyfill

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.includes
+if (!Array.prototype.includes) {
+  Object.defineProperty(Array.prototype, 'includes', {
+    value: function(searchElement, fromIndex) {
+
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      // 1. Let O be ? ToObject(this value).
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If len is 0, return false.
+      if (len === 0) {
+        return false;
+      }
+
+      // 4. Let n be ? ToInteger(fromIndex).
+      //    (If fromIndex is undefined, this step produces the value 0.)
+      var n = fromIndex | 0;
+
+      // 5. If n ≥ 0, then
+      //  a. Let k be n.
+      // 6. Else n < 0,
+      //  a. Let k be len + n.
+      //  b. If k < 0, let k be 0.
+      var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
+
+      function sameValueZero(x, y) {
+        return x === y || (typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y));
+      }
+
+      // 7. Repeat, while k < len
+      while (k < len) {
+        // a. Let elementK be the result of ? Get(O, ! ToString(k)).
+        // b. If SameValueZero(searchElement, elementK) is true, return true.
+        if (sameValueZero(o[k], searchElement)) {
+          return true;
+        }
+        // c. Increase k by 1.
+        k++;
+      }
+
+      // 8. Return false
+      return false;
+    }
+  });
+}
+
+ +

Sollten Sie wirklich veraltete JavaScript-Engines unterstützen müssen, die ihrerseits {{jsxref("Object.defineProperty", "Object.defineProperty")}} nicht unterstützen, ist es ratsam, die Array.prototype-Methode nicht mit dem Polyfill zu erweitern, da man diese nicht unabzählbar (non-enumerable) machen kann.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES7', '#sec-array.prototype.includes', 'Array.prototype.includes')}}{{Spec2('ES7')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.includes', 'Array.prototype.includes')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.includes")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/index.html b/files/de/web/javascript/reference/global_objects/array/index.html new file mode 100644 index 0000000000..d60c037b82 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/index.html @@ -0,0 +1,460 @@ +--- +title: Array +slug: Web/JavaScript/Reference/Global_Objects/Array +tags: + - Array + - Example + - Global Objects + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array +--- +
{{JSRef}}
+ +

Das JavaScript-Array ist ein globales Objekt und Konstruktor für das Erstellen von Arrays, welche listenähnliche Objekte sind.

+ +

Ein Array erstellen

+ +
var fruits = ['Apple', 'Banana'];
+
+console.log(fruits.length);
+// 2
+
+ +

Zugriff auf ein Arrayelement (mit Index)

+ +
var first = fruits[0];
+// Apple
+
+var last = fruits[fruits.length - 1];
+// Banana
+
+ +

Über ein Array Iterieren

+ +
fruits.forEach(function(item, index, array) {
+  console.log(item, index);
+});
+// Apple 0
+// Banana 1
+
+ +

Ein Element am Ende des Arrays einfügen

+ +
var newLength = fruits.push('Orange');
+// ["Apple", "Banana", "Orange"]
+
+ +

Ein Element am Ende des Arrays löschen

+ +
var last = fruits.pop(); // remove Orange (from the end)
+// ["Apple", "Banana"];
+
+ +

Ein Element am Anfang des Arrays löschen

+ +
var first = fruits.shift(); // remove Apple from the front
+// ["Banana"];
+
+ +

Ein Element am Anfang des Arrays einfügen

+ +
var newLength = fruits.unshift('Strawberry') // add to the front
+// ["Strawberry", "Banana"];
+
+ +

Den Index eines Elements im Array ermitteln

+ +
fruits.push('Mango');
+// ["Strawberry", "Banana", "Mango"]
+
+var pos = fruits.indexOf('Banana');
+// 1
+
+ +

Ein Element mithilfe eines Index aus dem Array löschen

+ +
var removedItem = fruits.splice(pos, 1); // this is how to remove an item
+
+// ["Strawberry", "Mango"]
+ +

Elemente von einer Indexposition aus löschen

+ +
var vegetables = ['Cabbage', 'Turnip', 'Radish', 'Carrot'];
+console.log(vegetables);
+// ["Cabbage", "Turnip", "Radish", "Carrot"]
+
+var pos = 1, n = 2;
+
+var removedItems = vegetables.splice(pos, n);
+// this is how to remove items, n defines the number of items to be removed,
+// from that position(pos) onward to the end of array.
+
+console.log(vegetables);
+// ["Cabbage", "Carrot"] (the original array is changed)
+
+console.log(removedItems);
+// ["Turnip", "Radish"]
+ +

Ein Array kopieren

+ +
var shallowCopy = fruits.slice(); // this is how to make a copy
+// ["Strawberry", "Mango"]
+
+ +

Syntax

+ +
[element0, element1, ..., elementN]
+new Array(element0, element1[, ...[, elementN]])
+new Array(arrayLength)
+ +

Parameter

+ +
+
elementN
+
Ein JavaScript-Array wird mit den angegebenen Elementen initialisiert, es sei denn, an den Array-Konstruktor wird eine einzelne Zahl übergeben (siehe arrayLength-Parameter unten). Beachte, dass dieser Sonderfall nur für JavaScript-Arrays gilt, die mit dem Array-Konstruktor erstellt wurden, nicht für Array-Literale, die mit der Klammer-Syntax erstellt wurden.
+
arrayLength
+
Wenn lediglich eine Ganzzahl zwischen 0 und 232-1 (inklusive) als Argument an den Array-Konstruktor übergeben wird, ist der Rückgabewert ein JavaScript Array, dessen length-Eigenschaft dieser Zahl entspricht. (Hinweis: Dies impliziert ein Array mit leeren Elementen einer Anzahl von arrayLength, nicht Elementen mit Wert undefined). Handelt es sich bei dem Argument um irgendeine andere Zah,l wird eine {{jsxref("Global_Objects/RangeError", "RangeError")}} Exception ausgelöst.
+
+ +

Beschreibung

+ +

Arrays sind listenähnliche Objekte, dessen Prototyp Methoden für Durchlauf- und Mutationsoperationen besitzt. Weder die Länge eines JavaScript-Arrays noch die Typen seiner Elemente sind fix. Da sich die Länge eines Arrays jederzeit ändern kann und Daten an nicht zusammenhängenden Positionen im Array gespeichert werden können, ist nicht garantiert, dass JavaScript-Arrays verdichtet sind; dies hängt davon ab, wie der Programmierer sie benutzt. Im Allgemeinen sind dies praktische Merkmale; falls jedoch diese Funktionalität für Ihren Anwendungsfall nicht wünschenswert ist, sollten Sie in Betracht ziehen, typisierte Arrays zu verwenden.

+ +

Arrays können keine Strings als Index benutzen (wie bei assoziativen Arrays), sondern müssen Ganzzahlen verwenden. Der Zugriff mit nicht-ganzzahligen Werten über die Klammernotation (oder Punktnotation) bezieht sich nicht auf ein Element im Array, sondern legt eine Eigenschaft des Array-Objekts fest oder greift darauf zu. Die Eigenschaften des Array-Objekts und die Liste der Array-Elemente sind voneinander getrennt. Die Durchlauf- und Mutationsoperationen des Arrays können nicht auf diese benannten Eigenschaften angewendet werden.

+ +

Auf Elemente des Arrays zugreifen

+ +

JavaScript-Arrays sind nullindiziert: Das erste Element eines Arrays befindet sich am Index 0, das letzte Element befindet sich an demjenigen Index, der dem Wert der Eigenschaft {{jsxref ("Array.length", "length")}} des Arrays minus 1 entspricht. Die Verwendung einer ungültigen Indexnummer gibt undefined zurück.

+ +
var arr = ['Das erste Element', 'Das zweite Element', 'Das letzte Element'];
+console.log(arr[0]);              // Ausgabe: 'Das erste Element'
+console.log(arr[1]);              // Ausgabe: 'Das zweite Element'
+console.log(arr[arr.length - 1]); // Ausgabe: 'Das letzte Element'
+
+ +

Array-Elemente sind Objekteigenschaften genau so wie toString. Wenn man jedoch wie folgt auf ein Element eines Arrays versucht zuzugreifen, wird ein Syntaxfehler ausgegeben, da der Name der Eigenschaft ungültig ist:

+ +
console.log(arr.0); // Syntaxfehler
+
+ +

Es gibt nichts Besonderes an JavaScript-Arrays und den Eigenschaften, die dies verursachen. JavaScript-Eigenschaften, die mit einer Ziffer beginnen, können nicht mit Punktnotation referenziert werden und müssen über Klammernotation aufgerufen werden. Wenn man beispielsweise ein Objekt mit einer Eigenschaft namens '3d' hat, kann es nur in Klammern angegeben werden, z. B.:

+ +
var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
+console.log(years.0);   // ein Syntaxfehler
+console.log(years[0]);  // funktioniert
+
+ +
renderer.3d.setTexture(model, 'character.png');     // ein Syntaxfehler
+renderer['3d'].setTexture(model, 'character.png');  // works funktioniert
+
+ +

Beachten Sie, dass im obigen Beispiel '3d' in Anführungszeichen gesetzt werden musste. Es ist auch möglich, die JavaScript-Array-Indizes in Anführungszeichen zu setzen (z. B. years['2'] statt years[2]), obwohl dies nicht erforderlich ist. Die 2 in years[2] wird von der JavaScript-Engine durch eine implizite Konvertierung mittels toString zwingend in eine Zeichenfolge umgewandelt. Aus diesem Grund beziehen sich '2' und '02' auf zwei unterschiedliche Elemente des years-Objekts und das folgende Beispiel würde true ergeben:

+ +
console.log(years['2'] != years['02']);
+
+ +

Ebenso kann auf Objekteigenschaften, die zufällig reservierte Wörter(!) sind, nur als Stringliterale in Klammern zugegriffen werden:

+ +
var promise = {
+  'var'  : 'text',
+  'array': [1, 2, 3, 4]
+};
+
+console.log(promise['var']);
+
+ +

Beziehung zwischen length und numerischen Eigenschaften

+ +

Die Eigenschaft {{jsxref("Array.length", "length")}} eines JavaScript-Arrays und numerische Eigenschaften sind miteinander verbunden. Etliche der eingebauten Array-Methoden (z. B. {{jsxref("Array.join", "join()")}}, {{jsxref("Array.slice", "slice()")}}, {{jsxref("Array.indexOf", "indexOf()")}}, etc.) berücksichtigen den Wert der {{jsxref("Array.length", "length")}} Eigenschaft eines Arrays, wenn diese aufgerufen werden. Andere Methoden (z. B. {{jsxref("Array.push", "push()")}}, {{jsxref("Array.splice", "splice()")}}, etc.) bewirken ebenfalls eine Veränderung der Eigenschaft {{jsxref("Array.length", "length")}} eines Arrays.

+ +
var fruits = [];
+fruits.push('banana', 'apple', 'peach');
+
+console.log(fruits.length); // 3
+
+ +

Wird einem JavaScript-Array eine Eigenschaft zugewiesen, bei der es sich um einen gültigen Array-Index handelt und dieser Index außerhalb der aktuellen Grenzen des Arrays liegt, aktualisiert die Engine die Eigenschaft {{jsxref("Array.length", "length")}} des Arrays entsprechend:

+ +
fruits[5] = 'mango';
+console.log(fruits[5]); // 'mango'
+console.log(Object.keys(fruits));  // ['0', '1', '2', '5']
+console.log(fruits.length); // 6
+
+ +

Beim Erhöhen von {{jsxref("Array.length", "length")}}.

+ +
fruits.length = 10;
+console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
+console.log(fruits.length); // 10
+
+ +
+

Beim Verringern von {{jsxref("Array.length", "length")}} werden jedoch Elemente gelöscht.

+ +
fruits.length = 2;
+console.log(Object.keys(fruits)); // ['0', '1']
+console.log(fruits.length); // 2
+
+ +

Der Artikel zu {{jsxref("Array.length")}} geht genauer darauf ein.

+
+ +

Erstellen eines Arrays als Ergebnis einer Übereinstimmung

+ +

Das Ergebnis einer Übereinstimmung eines regulären Ausdrucks und einem String kann ein JavaScript-Array erstellen. Dieses Array verfügt über Eigenschaften und Elemente, die Informationen zur Übereinstimmung beinhalten. Solch ein Array wird von {{jsxref("RegExp.exec")}}, {{jsxref("String.match")}} und {{jsxref("String.replace")}} zurückgegeben. Am folgenden Beispiel sollen diese Eigenschaften und Elemente erläutert werden, die Tabelle darunter enthält; weitere Informationen hierzu:

+ +
// Übereinstimmung eines d, gefolgt von einem oder mehreren b, gefolgt von einem d
+// Übereinstimmende b's und die darauf folgenden d's merken
+// Groß-/Kleinschreibung ignorieren
+
+var myRegEx = /d(b+)(d)/i;
+var myArray = myRegEx.exec('cdbBdbsbz');
+ +

Die Eigenschaften und Elemente werden wie folgt zurückgegeben:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Eigenschaft/ElementBeschreibungBeispiel
input +

Eine schreibgeschützte Eigenschaft, die die ursprüngliche Zeichenfolge widerspiegelt, mit der der reguläre Ausdruck abgeglichen wurde.

+
cdbBdbsbz
indexEine schreibgeschützte Eigenschaft, bei der es sich um den nullbasierten Index der Übereinstimmung in der Zeichenfolge handelt.1
[0]Ein schreibgeschütztes Element, das die zuletzt übereinstimmenden Zeichen angibt.dbBd
[1], ...[n]Schreibgeschützte Elemente, die die in Klammern gesetzten Unterzeichenfolgen angeben, sofern sie im regulären Ausdruck enthalten sind. Die Anzahl der möglichen geklammerten Teilzeichenfolgen ist unbegrenzt.[1]: bB
+ [2]: d
+ +

Eigenschaften

+ +
+
Array.length
+
Die Eigenschaft length des Array-Konstruktors, deren Wert 1 ist.
+
{{jsxref("Array.@@species", "get Array[@@species]")}}
+
Die Konstruktorfunktion zum Erstellen abgeleiteter Objekte.
+
{{jsxref("Array.prototype")}}
+
Ermöglicht das Hinzufügen von Eigenschaften zu allen Array-Objekten.
+
+ +

Methoden

+ +
+
{{jsxref("Array.from()")}}
+
Erstellt eine neue Array-Instanz aus einem Array-ähnlichen oder iterierbaren Objekt.
+
{{jsxref("Array.isArray()")}}
+
Gibt true zurück, wenn eine Variable ein Array ist, andernfalls false.
+
{{jsxref("Array.of()")}}
+
Erstellt eine neue Array-Instanz mit einer variablen Anzahl von Argumenten, unabhängig von Anzahl oder Typ der Argumente.
+
+ +

Array Instanzen

+ +

Alle Array-Instanzen erben von {{jsxref("Array.prototype")}}. Das Prototypobjekt des Array-Konstruktors kann geändert werden, um alle Array-Instanzen zu beeinflussen.

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +

Mutationsmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Mutationsmethoden')}}
+ +

Zugriffsmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Zugriffsmethoden')}}
+ +

Zählmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Zählmethoden')}}
+ +

Generische Array-Methoden

+ +
+

Generische Array Methoden sind nicht standardisiert, veraltet und werden in naher Zukunft entfernt.

+
+ +

Manchmal möchte man Array-Methoden auf Strings oder andere Array-ähnliche Objekte anwenden (z. B. auf {{jsxref("Functions/arguments", "Argumente", "", 1)}} von Funktionen). Auf diese Weise behandelt man eine Zeichenfolge wie ein Array von Zeichen (oder ein nicht-Array wie ein Array). Um beispielsweise zu prüfen, ob jedes Zeichen in der Variablen str ein Buchstabe ist, würde man Folgendes schreiben:

+ +
function isLetter(character) {
+  return character >= 'a' && character <= 'z';
+}
+
+if (Array.prototype.every.call(str, isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+ +

Diese Schreibweise wurde in JavaScript 1.6 von einer kürzeren abgelöst:

+ +
if (Array.every(str, isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+
+ +

{{jsxref("Global_Objects/String", "Generische Methoden", "#Generische_String-Methoden", 1)}} gibt es ebenfalls für {{jsxref("Global_Objects/String", "Strings")}}.

+ +

Diese sind nicht Teil der ECMAScript-Standards und werden von nicht-Gecko-Browsern nicht unterstützt. Als Standardvariante können Sie Ihr Objekt mit {{jsxref("Array.from()")}} in ein richtiges Array konvertieren. Diese Methode wird in alten Browsern möglicherweise nicht unterstützt:

+ +
if (Array.from(str).every(isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+
+ +

Beispiele

+ +

Erstellen eines Arrays

+ +

Das folgende Beispiel erzeugt ein Array msgArray mit der Länge 0, weist dann msgArray[0] und msgArray[99] Werte zu und ändert somit die Länge des Arrays auf 100.

+ +
var msgArray = [];
+msgArray[0] = 'Hello';
+msgArray[99] = 'world';
+
+if (msgArray.length === 100) {
+  console.log('Die Länge ist 100.');
+}
+
+ +

Erstellen eines zweidimensionalen Arrays

+ +

Im Folgenden wird ein Schachbrett als zweidimensionales Array von Strings erzeugt. Der erste Zug erfolgt durch Kopieren des 'p' in (6,4) nach (4,4). Die alte Position (6,4) wird als leer markiert.

+ +
var board = [
+  ['R','N','B','Q','K','B','N','R'],
+  ['P','P','P','P','P','P','P','P'],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  ['p','p','p','p','p','p','p','p'],
+  ['r','n','b','q','k','b','n','r'] ];
+
+console.log(board.join('\n') + '\n\n');
+
+// Ziehe Bauern 2 Felder vorwärts
+board[4][4] = board[6][4];
+board[6][4] = ' ';
+console.log(board.join('\n'));
+
+ +

Das ist die Ausgabe:

+ +
R,N,B,Q,K,B,N,R
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+p,p,p,p,p,p,p,p
+r,n,b,q,k,b,n,r
+
+R,N,B,Q,K,B,N,R
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , ,p, , ,
+ , , , , , , ,
+p,p,p,p, ,p,p,p
+r,n,b,q,k,b,n,r
+
+ +

Einsatz eines Arrays, um Werte tabellarisch auszugeben

+ +
values = [];
+for (var x = 0; x < 10; x++){
+ values.push([
+  2 ** x,
+  2 * x ** 2
+ ])
+};
+console.table(values)
+ +

Das Resultat ist:

+ +
0   1   0
+1   2   2
+2   4   8
+3   8   18
+4   16  32
+5   32  50
+6   64  72
+7   128 98
+8   256 128
+9   512 162
+ +

(Die erste Spalte ist der Index)

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4', 'Array')}}{{Spec2('ES5.1')}}Neue Methoden hinzugefügt: {{jsxref("Array.isArray")}}, {{jsxref("Array.prototype.indexOf", "indexOf")}}, {{jsxref("Array.prototype.lastIndexOf", "lastIndexOf")}}, {{jsxref("Array.prototype.every", "every")}}, {{jsxref("Array.prototype.some", "some")}}, {{jsxref("Array.prototype.forEach", "forEach")}}, {{jsxref("Array.prototype.map", "map")}}, {{jsxref("Array.prototype.filter", "filter")}}, {{jsxref("Array.prototype.reduce", "reduce")}}, {{jsxref("Array.prototype.reduceRight", "reduceRight")}}
{{SpecName('ES6', '#sec-array-objects', 'Array')}}{{Spec2('ES6')}}Neue Methoden hinzugefügt: {{jsxref("Array.from")}}, {{jsxref("Array.of")}}, {{jsxref("Array.prototype.find", "find")}}, {{jsxref("Array.prototype.findIndex", "findIndex")}}, {{jsxref("Array.prototype.fill", "fill")}}, {{jsxref("Array.prototype.copyWithin", "copyWithin")}}
{{SpecName('ES7', '#sec-array-objects', 'Array')}}{{Spec2('ES7')}}Neue Methode hinzugefügt: {{jsxref("Array.prototype.includes()")}}
{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Array")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/indexof/index.html b/files/de/web/javascript/reference/global_objects/array/indexof/index.html new file mode 100644 index 0000000000..1768427494 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/indexof/index.html @@ -0,0 +1,226 @@ +--- +title: Array.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/indexOf +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf +--- +
{{JSRef}}
+ +

Die Methode indexOf() gibt den Index zurück, an dem ein bestimmtes Element im Array zum ersten Mal auftritt oder -1 wenn es nicht vorhanden ist.

+ +
+

Hinweis: Für die String Methode, siehe {{jsxref("String.prototype.indexOf()")}}.

+
+ +
{{EmbedInteractiveExample("pages/js/array-indexof.html")}}
+ + + +

Syntax

+ +
arr.indexOf(searchElement[, fromIndex])
+ +

Parameter

+ +
+
searchElement
+
Element, das im Array gefunden werden soll.
+
fromIndex {{optional_inline}}
+
Der Index, an dem die Suche beginnen soll. Wenn dieser Index größer oder gleich der Länge des Arrays ist, wird -1 zurückgegeben, d. h. das Array wird nicht durchsucht. Ist der Startindex negativ, wird er als Versatz vom Ende des Arrays verstanden. Das Array wird dann immer noch von vorne nach hinten durchsucht.
+
+ +

Rückgabewert

+ +

Der Index, an dem das gefundene Element das erste Mal angetroffen wurde, andernfalls -1 wenn nichts gefunden wurde.

+ +

Beschreibung

+ +

indexOf() vergleicht searchElement mit Elementen des Arrays mittels strikter Gleichheit (dieselbe Methode, die bei === angewendet wird).

+ +

Beispiele

+ +

Verwendung von indexOf()

+ +

Das folgende Beispiel nutzt indexOf() um Werte in einem Array zu ermitteln.

+ +
var array = [2, 9, 9];
+array.indexOf(2);     // 0
+array.indexOf(7);     // -1
+array.indexOf(9, 2);  // 2
+array.indexOf(2, -1); // -1
+array.indexOf(2, -3); // 0
+
+ +

Alle Vorkommnisse eines Elements ermitteln

+ +
var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.indexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = array.indexOf(element, idx + 1);
+}
+console.log(indices);
+// [0, 2, 4]
+
+ +

Ermitteln, ob ein Element in einem Array existiert und das Array aktualisieren

+ +
function updateVegetablesCollection (veggies, veggie) {
+    if (veggies.indexOf(veggie) === -1) {
+        veggies.push(veggie);
+        console.log('New veggies collection is : ' + veggies);
+    } else if (veggies.indexOf(veggie) > -1) {
+        console.log(veggie + ' already exists in the veggies collection.');
+    }
+}
+
+var veggies = ['potato', 'tomato', 'chillies', 'green-pepper'];
+
+updateVegetablesCollection(veggies, 'spinach');
+// New veggies collection is : potato,tomato,chillies,green-pepper,spinach
+updateVegetablesCollection(veggies, 'spinach');
+// spinach already exists in the veggies collection.
+
+ +

Polyfill

+ +

indexOf() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von indexOf() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("TypeError")}} und {{jsxref("Math.abs()")}} haben ihre ursprünglichen Werte.

+ +
if (!Array.prototype.indexOf)  Array.prototype.indexOf = (function(Object, max, min){
+  "use strict";
+  return function indexOf(member, fromIndex) {
+    if(this===null||this===undefined)throw TypeError("Array.prototype.indexOf called on null or undefined");
+
+    var that = Object(this), Len = that.length >>> 0, i = min(fromIndex | 0, Len);
+    if (i < 0) i = max(0, Len+i); else if (i >= Len) return -1;
+
+    if(member===void 0){ for(; i !== Len; ++i) if(that[i]===void 0 && i in that) return i; // undefined
+    }else if(member !== member){   for(; i !== Len; ++i) if(that[i] !== that[i]) return i; // NaN
+    }else                           for(; i !== Len; ++i) if(that[i] === member) return i; // all else
+
+    return -1; // if the value was not found, then return -1
+  };
+})(Object, Math.max, Math.min);
+
+ +

Wenn Sie sich jedoch mehr für all die kleinen technischen Elemente interessieren, die durch den ECMA-Standard definiert werden, und Leistung oder Prägnanz weniger von Belang sind, dann könnte diese erklärende Polyfill-Lösung nützlicher für Sie sein.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.14
+// Reference: http://es5.github.io/#x15.4.4.14
+if (!Array.prototype.indexOf) {
+  Array.prototype.indexOf = function(searchElement, fromIndex) {
+
+    var k;
+
+    // 1. Let o be the result of calling ToObject passing
+    //    the this value as the argument.
+    if (this == null) {
+      throw new TypeError('"this" is null or not defined');
+    }
+
+    var o = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get
+    //    internal method of o with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = o.length >>> 0;
+
+    // 4. If len is 0, return -1.
+    if (len === 0) {
+      return -1;
+    }
+
+    // 5. If argument fromIndex was passed let n be
+    //    ToInteger(fromIndex); else let n be 0.
+    var n = fromIndex | 0;
+
+    // 6. If n >= len, return -1.
+    if (n >= len) {
+      return -1;
+    }
+
+    // 7. If n >= 0, then Let k be n.
+    // 8. Else, n<0, Let k be len - abs(n).
+    //    If k is less than 0, then let k be 0.
+    k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
+
+    // 9. Repeat, while k < len
+    while (k < len) {
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the
+      //    HasProperty internal method of o with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      //    i.  Let elementK be the result of calling the Get
+      //        internal method of o with the argument ToString(k).
+      //   ii.  Let same be the result of applying the
+      //        Strict Equality Comparison Algorithm to
+      //        searchElement and elementK.
+      //  iii.  If same is true, return k.
+      if (k in o && o[k] === searchElement) {
+        return k;
+      }
+      k++;
+    }
+    return -1;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.indexOf")}}

+
+ +

Kompatibilitätshinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/isarray/index.html b/files/de/web/javascript/reference/global_objects/array/isarray/index.html new file mode 100644 index 0000000000..2bdca7596a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/isarray/index.html @@ -0,0 +1,121 @@ +--- +title: Array.isArray() +slug: Web/JavaScript/Reference/Global_Objects/Array/isArray +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/isArray +--- +
{{JSRef}}
+ +

Die Array.isArray() Funktion prüft, ob das übergebene Objekt ein {{jsxref("Array")}} ist.

+ +
Array.isArray([1, 2, 3]);  // true
+Array.isArray({foo: 123}); // false
+Array.isArray('foobar');   // false
+Array.isArray(undefined);  // false
+
+ +

Syntax

+ +
Array.isArray(obj)
+ +

Parameter

+ +
+
value
+
Der zu überprüfende Wert.
+
+ +

Rückgabewert

+ +

Wenn der Wert ein {{jsxref("Array")}} ist wird true zurückgegeben, andernfalls false.

+ +

Beschreibung

+ +

Wenn der Wert ein {{jsxref("Array")}} ist, wir true zurückzugeben, andernfalls false.

+ +

Eine detailliertere Beschreibung ist im Artikel Determining with absolute accuracy whether or not a JavaScript object is an array enthalten (auf Englisch). Wird eine {{jsxref("TypedArray")}}-Instanz geprüft, wird immer false zurückgegeben.

+ +

Beispiele

+ +

Einsatz von Array.isArray

+ +
// die folgenden Ausdrücke geben true zurück
+Array.isArray([]);
+Array.isArray([1]);
+Array.isArray(new Array());
+Array.isArray(new Array('a', 'b', 'c', 'd'));
+Array.isArray(new Array(3));
+// wenig bekannt: Array.prototype ist selbst ein Array.
+Array.isArray(Array.prototype);
+
+// die folgenden Ausdrücke geben alle false zurück
+Array.isArray();
+Array.isArray({});
+Array.isArray(null);
+Array.isArray(undefined);
+Array.isArray(17);
+Array.isArray("Array");
+Array.isArray(true);
+Array.isArray(false);
+Array.isArray(new Uint8Array(32));
+Array.isArray({ __proto__ : Array.prototype });
+
+ +

instanceof vs isArray

+ +

Wenn auf eine Array Instanz geprüft wird, ist Array.isArray besser geeignet als instanceof, weil es auch mit iframes funktioniert.

+ +
var iframe = document.createElement('iframe');
+document.body.appendChild(iframe);
+xArray = window.frames[window.frames.length-1].Array;
+var arr = new xArray(1,2,3); // [1,2,3]
+
+// Richtiges Prüfen für Arrays
+Array.isArray(arr);   // true
+// Als nicht richtig angesehen, weil es nicht mit iframes funktioniert
+arr instanceof Array; // false
+
+ +

Polyfill

+ +

Der folgende Code implementiert die Methode, wenn Array.isArray() nicht nativ unterstützt wird.

+ +
if(!Array.isArray) {
+  Array.isArray = function (vArg) {
+    return Object.prototype.toString.call(vArg) === "[object Array]";
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-array.isarray', 'Array.isArray')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.isArray")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/join/index.html b/files/de/web/javascript/reference/global_objects/array/join/index.html new file mode 100644 index 0000000000..4e986bebda --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/join/index.html @@ -0,0 +1,114 @@ +--- +title: Array.prototype.join() +slug: Web/JavaScript/Reference/Global_Objects/Array/join +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/join +--- +
{{JSRef}}
+ +

Die join() Methode verkettet alle Elemente eines Arrays (oder Array-ähnlicher Objekte) durch Kommata getrennt oder einem angegebenen Trennzeichen in einem String und gibt diesen zurück. Enthält das Array nur ein Element wird nur dieses ohne Trennzeichen zurückgegeben.

+ +
{{EmbedInteractiveExample("pages/js/array-join.html")}}
+ + + +

Syntax

+ +
arr.join([separator])
+ +

Parameter

+ +
+
separator {{optional_inline}}
+
Gibt einen String an, um jedes Paar benachbarter Elemente des Arrays voneinander zu trennen. Das Trennzeichen wird bei Bedarf in einen String umgewandelt. Wenn nicht angegeben, werden die Array-Elemente durch ein Komma (",") getrennt. Wenn separator ein leerer String ist, werden alle Elemente ohne Trennzeichen miteinander verbunden.
+
+ +

Rückgabewert

+ +

Ein String in dem alle Arrayelemente verkettet sind. Wenn arr.length gleich 0 ist, wird der leere String zurückgegeben.

+ +

Beschreibung

+ +

Alle Elemente des Arrays werden in Strings umgewandelt und in einem String miteinander verkettet

+ +
+

Falls ein Element undefined oder null ist, wird es in einen leeren String umgewandelt.

+
+ +

Beispiele

+ +

Einen Array auf vier verschiedene Arten zusammenführen

+ +

Im folgenden Beispiel wird ein Array a mit drei Elementen erstellt, das dann viermal mit miteinander verbunden wird: mit dem Standardtrennzeichen, einem Komma mit Leerzeichen, einem Pluszeichen und einem leeren String.

+ +
var a = ['Wind', 'Rain', 'Fire'];
+a.join();       // 'Wind,Rain,Fire'
+a.join(', ');   // 'Wind, Rain, Fire'
+a.join(' + ');  // 'Wind + Rain + Fire'
+a.join('');     // 'WindRainFire'
+
+ +

Zusammenführen eines Array-ähnlichen Objekts

+ +

Das Folgende Beispiel fügt ein Array-ähnliches Objekt ({{jsxref("Functions/arguments", "arguments")}}) zusammen, indem {{jsxref("Function.prototype.call", "call()")}} auf Array.prototype.join aufgerufen wird.

+ +
function f(a, b, c) {
+  var s = Array.prototype.join.call(arguments);
+  console.log(s); // '1,a,true'
+}
+f(1, 'a', true);
+// Erwartete Ausgabe: "1,a,true"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.5', 'Array.prototype.join')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.join', 'Array.prototype.join')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.join', 'Array.prototype.join')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.join")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/keys/index.html b/files/de/web/javascript/reference/global_objects/array/keys/index.html new file mode 100644 index 0000000000..e809654bcc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/keys/index.html @@ -0,0 +1,76 @@ +--- +title: Array.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Array/keys +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/keys +--- +
{{JSRef}}
+ +

Die keys() Methode gibt ein neues Array Iterator Objekt zurück, welches den Schlüssel für jeden Index des Arrays enthält.

+ +
{{EmbedInteractiveExample("pages/js/array-keys.html")}}
+ + + +

Syntax

+ +
arr.keys()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Array")}} iterator-Objekt.

+ +

Beispiele

+ +

Der Key Iterator ignoriert keine Lücken

+ +
var arr = ['a', , 'c'];
+var sparseKeys = Object.keys(arr);
+var denseKeys = [...arr.keys()];
+console.log(sparseKeys); // ['0', '2']
+console.log(denseKeys);  // [0, 1, 2]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.keys', 'Array.prototype.keys')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.keys', 'Array.prototype.keys')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.keys")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html new file mode 100644 index 0000000000..7ad2b99661 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html @@ -0,0 +1,168 @@ +--- +title: Array.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +--- +
{{JSRef}}
+ +

Die lastIndexOf() Methode gibt den letzten Index zurück, an dem ein übergebenes Element im Array gefunden wurde, oder -1, wenn es nicht vorhanden ist. Das Array wird rückwärts durchsucht beginnend beim fromIndex.

+ +
{{EmbedInteractiveExample("pages/js/array-lastindexof.html")}}
+ + + +

Syntax

+ +
arr.lastIndexOf(searchElement)
+arr.lastIndexOf(searchElement, fromIndex)
+
+ +

Parameter

+ +
+
searchElement
+
Element, nach dem im Feld gesucht wird.
+
fromIndex {{optional_inline}}
+
Der Index an dem die Suche rückwärts begonnen wird. Der Standardwert ist die Arraylänge minus eins (arr.length - 1), d. h. das gesamte Feld wird durchsucht. Wenn der Index größer oder gleich der Länge des Arrays ist, wird das gesamte Array durchsucht. Ist der Index eine negative Zahl, wird er als Offset vom Ende des Arrays behandelt. Bei Verwendung eines negativen Index wird das Array trotzdem von hinten nach vorne durchsucht. Wenn der errechnete Index kleiner als 0 ist, wird -1 zurückgegeben, d.h. das Feld wird nicht durchsucht.
+
+ +

Rückgabewert

+ +

Der letzte Index des gesuchten Elementes aus dem Feld. -1 wenn keins gefunden wurde.

+ +

Beschreibung

+ +

lastIndexOf vergleicht das searchElement mit den Elementen des Feldes und verwendet hierzu die strikte Gleichheit (Die gleiche Methode, die beim === Operator  (triple-equals) angewendet wird.

+ +

Beispiele

+ +

lastIndexOf verwenden

+ +

Das folgende Beispiel verwendet lastIndexOf, um Werte in einem Array zu finden.

+ +
var numbers = [2, 5, 9, 2];
+numbers.lastIndexOf(2);     // 3
+numbers.lastIndexOf(7);     // -1
+numbers.lastIndexOf(2, 3);  // 3
+numbers.lastIndexOf(2, 2);  // 0
+numbers.lastIndexOf(2, -2); // 0
+numbers.lastIndexOf(2, -1); // 3
+
+ +

Finde jedes Vorkommen eines Elementes

+ +

Das folgende Beispiel benutzt lastIndexOf, um alle Indizes eines Elementes in einem Array zu finden, wobei sie mit Hilfe von {{jsxref("Array.prototype.push", "push")}} zu einem anderen Array hinzugefügt werden, sobald sie gefunden werden.

+ +
var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.lastIndexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = (idx > 0 ? array.lastIndexOf(element, idx - 1) : -1);
+}
+
+console.log(indices);
+// [4, 2, 0]
+
+ +

Der Fall idx == 0 muss hier separat behandelt werden, weil das Element immer gefunden wird, unabhängig vom fromIndex Parameter, falls es das erste Element im Feld ist. Das ist der Unterschieder zur {{jsxref("Array.prototype.indexOf", "indexOf")}} Methode.

+ +

Polyfill

+ +

lastIndexOf wurde dem ECMA-262-Standard in der fünften Edition hinzugefügt;  sie könnte daher nicht in allen Browsern verfügbar sein. Der Fehler kann umgangen werden, indem der folgende Code zu Beginn eines Skriptes eingesetzt wird. Dies ermöglicht die Verwendung von lastIndexOf, auch wenn die Methode nativ nicht unterstützt wird. Dieser Algorithmus stimmt mit dem überein, was in ECMA-262 der 5. Edition, spezifiziert wurde, unter der Annahme, dass {{jsxref("Object")}}, {{jsxref("TypeError")}}, {{jsxref("Number")}}, {{jsxref("Math.floor")}}, {{jsxref("Math.abs")}}, und {{jsxref("Math.min")}} ihre originalen Werte haben.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.15
+// Reference: http://es5.github.io/#x15.4.4.15
+if (!Array.prototype.lastIndexOf) {
+  Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/) {
+    'use strict';
+
+    if (this === void 0 || this === null) {
+      throw new TypeError();
+    }
+
+    var n, k,
+      t = Object(this),
+      len = t.length >>> 0;
+    if (len === 0) {
+      return -1;
+    }
+
+    n = len - 1;
+    if (arguments.length > 1) {
+      n = Number(arguments[1]);
+      if (n != n) {
+        n = 0;
+      }
+      else if (n != 0 && n != (1 / 0) && n != -(1 / 0)) {
+        n = (n > 0 || -1) * Math.floor(Math.abs(n));
+      }
+    }
+
+    for (k = n >= 0 ? Math.min(n, len - 1) : len - Math.abs(n); k >= 0; k--) {
+      if (k in t && t[k] === searchElement) {
+        return k;
+      }
+    }
+    return -1;
+  };
+}
+
+ +

Erneute Anmerkung: Diese Implementation zielt auf eine absolute Kompatibilität von lastIndexOf mit Firefox und der SpiderMonkey JavaScript Umgebung aus, inklusive einigen Fällen, welche wohl Grenzfälle sind. Beim Vorhaben diese Funktion in eigenen Applikationen zu verwenden, ist eine Berechnung von from mit weniger komplizierten Code möglich, wenn diese Fälle ignoriert werden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.15', 'Array.prototype.lastIndexOf')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.lastIndexOf")}}

+
+ +

Kompatibilitätshinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/length/index.html b/files/de/web/javascript/reference/global_objects/array/length/index.html new file mode 100644 index 0000000000..5357719669 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/length/index.html @@ -0,0 +1,149 @@ +--- +title: Array.prototype.length +slug: Web/JavaScript/Reference/Global_Objects/Array/length +tags: + - Array + - JavaScript + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/length +--- +
{{JSRef}}
+ +

Die length Eigenschaft eines Objektes vom Typ Array setzt die Anzahl der Elemente in einem Array oder gibt diese Anzahl zurück. Der Wert ist eine vorzeichenlose, 32-Bit Ganzzahl, welche größer als der größte Index im Array ist.

+ +
{{EmbedInteractiveExample("pages/js/array-length.html")}}
+ + + +

Beschreibung

+ +

Der Wert der length Eigenschaft ist ein positive, ganze Zahl und hat einen Wert kleiner als 232.

+ +
var namelistA = new Array(4294967296); //4294967296 = 232
+var namelistC = new Array(-100) //negative sign
+
+console.log(namelistA.length); //RangeError: Invalid array length
+console.log(namelistC.length); //RangeError: Invalid array length
+
+
+
+var namelistB = [];
+namelistB.length = Math.pow(2,32)-1; //set array length less than 2 to the 32nd power
+console.log(namelistB.length);
+
+//4294967295
+
+ +

Man kann die length Eigenschaft eines Array zu jeder Zeit ändern, um das Array zu kürzen. Wenn ein Array mit dem Ändern der length Eigenschaft vergrößert wird, erhöht sich die Anzahl der der tatsächlichen Elemente. Wenn z. B. length auf 3 gesetzt wird und die aktuelle länge 2 ist, dann enthält das Array 3 Elemente, wobei das dritte Element undefined ist.

+ +
var arr = [1, 2, 3];
+printEntries(arr);
+
+arr.length = 5; // set array length to 5 while currently 3.
+printEntries(arr);
+
+function printEntries(arr) {
+  var length = arr.length;
+  for (var i = 0; i < length; i++) {
+    console.log(arr[i]);
+  }
+  console.log('=== printed ===');
+}
+
+// 1
+// 2
+// 3
+// === printed ===
+// 1
+// 2
+// 3
+// undefined
+// undefined
+// === printed ===
+ +

Jedoch sagt die length Eigenschaft nicht zwangsläufig etwas über die Anzahl der definierten Werte in einem Array aus. Mehr dazu im Artikel Beziehung zwischen Längen und nummerischen Eigenschaften.

+ +

{{js_property_attributes(1, 0, 0)}}

+ +
+ +
+ +

Beispiele

+ +

Iterieren über ein Array

+ +

Im folgenden Beispiel wird über das numbers Array iteriert. Dabei wird die length Eigenschaft verwendet, um festzustellen, wie viele Elemente das Array enthält. Der Wert jedes Elements wird dabei verdoppelt.

+ +
var numbers = [1, 2, 3, 4, 5];
+
+for (var i = 0; i < numbers.length; i++) {
+  numbers[i] *= 2;
+}
+// numbers enthält jetzt die Werte: [2, 4, 6, 8, 10]
+
+ +

Verkürzung eines Arrays

+ +

Das folgende Beispiel verkürzt das Array numbers auf eine Länge von 3, wenn die Länge größer als 3 ist.

+ +
var numbers = [1, 2, 3, 4, 5];
+
+if (numbers.length > 3) {
+  numbers.length = 3;
+}
+
+console.log(numbers);        // [1, 2, 3]
+console.log(numbers.length); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4.5.2', 'Array.length')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-properties-of-array-instances-length', 'Array.length')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-properties-of-array-instances-length', 'Array.length')}}{{Spec2('ESDraft')}}
+ +

Browserkompabilität

+ +
+ + +

{{Compat("javascript.builtins.Array.length")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/map/index.html b/files/de/web/javascript/reference/global_objects/array/map/index.html new file mode 100644 index 0000000000..8227658ca6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/map/index.html @@ -0,0 +1,337 @@ +--- +title: Array.prototype.map() +slug: Web/JavaScript/Reference/Global_Objects/Array/map +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/map +--- +
{{JSRef}}
+ +

Die map() (engl. abbilden) Methode wendet auf jedes Element des Arrays die bereitgestellte Funktion an und gibt das Ergebnis in einem neuen Array zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-map.html")}}
+ + + +

Syntax

+ +
var new_array = arr.map(function callback(currentValue[, index[, array]]) {
+    // Zurückgegebenes Element für new_array
+}[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die ein Element für das neue Array erstellt und drei Argumente entgegennimmt:
+
+
+
currentValue
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index{{optional_inline}}
+
Der Index des aktuellen Elements, das im Array verarbeitet wird.
+
array{{optional_inline}}
+
Das Array, welches mit map() durchlaufen wird.
+
+
+
thisArg{{optional_inline}}
+
Wert, der als this verwendet wird, wenn callback ausgeführt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array, von dem jedes Element das Ergebnis der Callback-Funktion ist.

+ +

Beschreibung

+ +

map() ruft eine bereitgestellte callback Funktion für jedes Element in einem Array der Reihe nach auf und erstellt aus den Ergebnissen ein neues Array. callback wird nur für Indizes des Arrays aufgerufen, denen Werte zugewiesen wurden, einschließlich {{jsxref("undefined")}}. Es wird nicht für fehlende Elemente des Arrays aufgerufen (d. h. Indizes, die noch nie festgelegt, gelöscht oder denen noch kein Wert zugewiesen wurde).

+ +

map() zu benutzen, wenn das davon neu erstellte Array nicht benutzt wird, gilt als Anti-Pattern. Verwenden Sie stattdessen {{jsxref("Array/forEach", "forEach()")}} oder {{jsxref("statements/for...of", "for...of")}}.

+ +

Sie sollten map() nicht verwenden, wenn:

+ + + +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
  2. +
  3. Der Index des Elements
  4. +
  5. Das Array-Objekt, das durchlaufen wird
  6. +
+ +

Falls der Parameter thisArg an map() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this steht, wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

map() selbst verändert das Array nicht, auf dem es aufgerufen wird (das aufgerufene callback kann jedoch Änderungen vornehmen).

+ +

Der Bereich der von map() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von map() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den map() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von map() gelöscht werden, bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt.

+ +

Aufgrund des in der Spezifikation definierten Algorithmus haben Arrays mit vielen leeren Elementen auch nach einem Aufruf von map() immer noch leere Elemente, wobei die leeren Elemente an ihren Indizes verbleiben.

+ +

Beispiele

+ +

Erstellen eines Arrays mit Quadratwurzeln aus einem Array mit Zahlen

+ +

Der folgende Code verwendet ein Array mit Zahlen und erstellt ein neues Array, das die Quadratwurzeln der Zahlen im ersten Array enthält.

+ +
var numbers = [1, 4, 9];
+var roots = numbers.map(Math.sqrt);
+// roots ist jetzt [1, 2, 3]
+// numbers ist immer noch [1, 4, 9]
+
+ +

Objekte innerhalb eines Arrays mit map() neu formatieren

+ +

Der folgende Code nimmt ein Array mit Objekten und erstellt daraus ein neues Array, in dem die Objekte neu formatiert wurden.

+ +
var kvArray = [{key: 1, value: 10},
+               {key: 2, value: 20},
+               {key: 3, value: 30}];
+
+var reformattedArray = kvArray.map(obj => {
+   var rObj = {};
+   rObj[obj.key] = obj.value;
+   return rObj;
+});
+// reformattedArray ist jetzt [{1: 10}, {2: 20}, {3: 30}],
+
+// kvArray ist immer noch:
+// [{key: 1, value: 10},
+//  {key: 2, value: 20},
+//  {key: 3, value: 30}]
+ +

Erstellen eines Arrays mit Zahlen mithilfe einer Funktion, die ein Argument entgegennimmt

+ +

Der folgende Code zeigt, wie map() im Zusammenhang mit einer Funktion arbeitet, welche ein Argument entgegennimmt. Dem Argument wird automatisch der Wert des aktuellen Elements des Arrays zugewiesen, das von map() durchlaufen wird.

+ +
var numbers = [1, 4, 9];
+var doubles = numbers.map(function(num) {
+  return num * 2;
+});
+
+// doubles ist jetzt [2, 8, 18]
+// numbers ist immer noch [1, 4, 9]
+ +

Generischer Einsatz von map()

+ +

In diesem Beispiel wird veranschaulicht, wie map() auf einen {{jsxref("Global_Objects/String", "String")}} angewendet wird, um ein Array mit Bytes zu erhalten, welche den jewiligen Zeichenwerten im ASCII-Zeichensatz entsprechen:

+ +
var map = Array.prototype.map;
+var a = map.call('Hello World', function(x) {
+  return x.charCodeAt(0);
+});
+// a now equals [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
+
+ +

Generischer Einsatz von map() zusammen mit querySelectorAll()

+ +

In diesem Beispiel wird gezeigt, wie Sie eine Sammlung von Objekten durchlaufen, die von {{domxref("document.querySelectorAll()", "querySelectorAll()")}} erfasst wurde. Dies liegt daran, dass {{domxref("document.querySelectorAll()", "querySelectorAll()")}} eine {{domxref("NodeList")}} zurückgibt, bei der es sich um eine Auflistung von Objekten handelt. In diesem Fall geben wir alle Werte der ausgewählten Optionen auf dem Bildschirm zurück:

+ +
var elems = document.querySelectorAll('select option:checked');
+var values = Array.prototype.map.call(elems, function(obj) {
+  return obj.value;
+});
+
+ +

Einfacher wäre die Methode {{jsxref("Array.from()")}}.

+ +

Verzwickter Anwendungsfall

+ +

(Inspiriert von diesem Blogpost)

+ +

Üblicherweise wird die callback Funktion mit nur einem Argument benutzt. Das trifft auch für bestimmte andere Funktionen zu obwohl diese weitere optionale Argumente akzeptieren. Dies kann jedoch zu verwirrendem Verhalten führen.

+ +

Betrachten wir folgendes Beispiel:

+ +
['1', '2', '3'].map(parseInt);
+
+// Man würde erwarten [1, 2, 3]
+// Tatsächlich ist das Ergebnis aber [1, NaN, NaN]
+
+// parseInt wird oft nur mit einem Argument aufgerufen, akzeptiert aber zwei.
+// Der erste ist ein Ausdruck und der zweite ist die Basis.
+
+// Array.prototype.map übergibt 3 Argumente an die Callback-Funktion:
+// das Element, den Index, das Array
+
+// Das dritte Argument wird von parseInt ignoriert, das zweite jedoch nicht,
+// was verwirrend sein kann. Siehe den Blogpost für weitere Details
+
+// Falls der Link nicht funktioniert:
+// ein kurzes Beispiel der Durchläufe:
+// parseInt(string, radix) -> map(parseInt(value, index))
+// erster Durchlauf  (Index ist 0): parseInt('1', 0) // führt zu parseInt('1', 0) -> 1
+// zweiter Durchlauf (Index ist 1): parseInt('2', 1) // führt zu parseInt('2', 1) -> NaN
+// dritter Durchlauf (Index ist 2): parseInt('3', 2) // führt zu parseInt('3', 2) -> NaN
+
+function returnInt(element) {
+  return parseInt(element, 10);
+}
+
+['1', '2', '3'].map(returnInt); // [1, 2, 3]
+// Tatsächliches Ergebnis ist ein Array mit Nummern (wie erwartet)
+
+// Wie oben, jedoch unter Verwendung der kurzen Funktionssyntax mit Pfeil
+['1', '2', '3'].map( str => parseInt(str) );
+
+// Eine einfachere Methode, um selbiges zu erreichen, während Fallstricke vermieden werden:
+['1', '2', '3'].map(Number); // [1, 2, 3]
+
+// Im Gegensatz zu `parseInt` werden jedoch auch Fließkommazahlen oder (aufgelöste) Exponentialnotationen zurückgegeben:
+['1.1', '2.2e2', '3e300'].map(Number); // [1.1, 220, 3e+300]
+ +

Eine alternative Ausgabe der map() Methode, welche mit {{jsxref("Global_Objects/parseInt", "parseInt()")}} als Parameter aufgerufen wird, funktioniert wie folgt:

+ +
var xs = ['10', '10', '10'];
+
+xs = xs.map(parseInt);
+
+console.log(xs);
+// Das tatsächliche Ergebnis von [ 10, NaN, 2 ] kann aufgrund der obigen Beschreibung unerwartet sein
+ +

Polyfill

+ +

map() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von map() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("Object")}}, {{jsxref("TypeError")}} und {{jsxref("Array")}} haben ihre ursprünglichen Werte und callback.call() wird mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call()")}} ausgewertet.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.19
+// Reference: http://es5.github.io/#x15.4.4.19
+if (!Array.prototype.map) {
+
+  Array.prototype.map = function(callback, thisArg) {
+
+    var T, A, k;
+
+    if (this == null) {
+      throw new TypeError(' this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the |this|
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal
+    //    method of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if (typeof callback !== 'function') {
+      throw new TypeError(callback + ' is not a function');
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let A be a new array created as if by the expression new Array(len)
+    //    where Array is the standard built-in constructor with that name and
+    //    len is the value of len.
+    A = new Array(len);
+
+    // 7. Let k be 0
+    k = 0;
+
+    // 8. Repeat, while k < len
+    while (k < len) {
+
+      var kValue, mappedValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal
+        //    method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let mappedValue be the result of calling the Call internal
+        //     method of callback with T as the this value and argument
+        //     list containing kValue, k, and O.
+        mappedValue = callback.call(T, kValue, k, O);
+
+        // iii. Call the DefineOwnProperty internal method of A with arguments
+        // Pk, Property Descriptor
+        // { Value: mappedValue,
+        //   Writable: true,
+        //   Enumerable: true,
+        //   Configurable: true },
+        // and false.
+
+        // In browsers that support Object.defineProperty, use the following:
+        // Object.defineProperty(A, k, {
+        //   value: mappedValue,
+        //   writable: true,
+        //   enumerable: true,
+        //   configurable: true
+        // });
+
+        // For best browser support, use the following:
+        A[k] = mappedValue;
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+
+    // 9. return A
+    return A;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.19', 'Array.prototype.map')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.map', 'Array.prototype.map')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.map', 'Array.prototype.map')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.map")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/observe/index.html b/files/de/web/javascript/reference/global_objects/array/observe/index.html new file mode 100644 index 0000000000..2926d777fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/observe/index.html @@ -0,0 +1,91 @@ +--- +title: Array.observe() +slug: Web/JavaScript/Reference/Global_Objects/Array/observe +tags: + - Array + - JavaScript + - Method + - Obsolete +translation_of: Archive/Web/JavaScript/Array.observe +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Array.observe() Methode wurde für das asynchrone Beobachten von Veränderungen von Arrays benutzt, ähnlich wie {{jsxref("Object.observe()")}} für Objekte. Sie stellt einen Stream von Änderungen in der Reihenfolge, in denen sie auftreten, zur Verfügung.
+ Equivalent zu  Object.observe() und wird ausgeführt mit der Liste ["add", "update", "delete", "splice"]. Diese Funktion wurde als deprecated markiert und bereits aus einigen Browsern entfernt. Man kann stattdessen das allgemeinere {{jsxref("Proxy")}} Objekt verwenden.

+ +

Syntax

+ +
Array.observe(arr, callback)
+ +

Parameter

+ +
+
arr
+
    Das Array, welches beobachtet wird.
+
callback
+
Die Funktion, welche bei jeder Änderung mit folgenden Argumenten aufgerufen wird: +
+
changes
+
Ein Array aus Objekten. Jedes repräsentiert eine Änderung. Die Eigenschaften dieser change Objekte sind: +
    +
  • name: Der Name der Eigenschaft, welche geändert wurde.
  • +
  • object: Das veränderte Array, nachdem die Änderung stattfand.
  • +
  • type: Ein String, welcher den Typ der Änderung darstellt. Er hat den Wert "add", "update", "delete", oder "splice".
  • +
  • oldValue: Nur für "update" und "delete" Typ. Der Wert vor der Änderung.
  • +
  • index: Nur für "splice" Typ. Der Index, an welchem die Änderung stattfand.
  • +
  • removed: Nur für "splice" Typ. Ein Array aus den gelöschten Elementen.
  • +
  • addedCount: Nur für "splice" Typ. Die Anzahl an Elementen, welche hinzugefügt wurden.
  • +
+
+
+
+
+ +

Beschreibung

+ +

Die callback Funktion wird jedes mal aufgerufen, wenn eine Änderung in arr stattfindet mit einem Array von allen Änderungen in der Reihenfolge in der sie auftreten

+ +
+

Änderungen über die Array Methoden, wie zum Beispiel Array.prototype.pop(), werden als "splice" "changes" dargestellt.
+ Index Änderungen, welche die Länge des Arrays nicht verändern, werden als "update" "changes" dargestellt.

+
+ +

Beispiele

+ +

Aufzeichnung verschiedener change Typen

+ +
var arr = ['a', 'b', 'c'];
+
+Array.observe(arr, function(changes) {
+  console.log(changes);
+});
+
+arr[1] = 'B';
+// [{type: 'update', object: <arr>, name: '1', oldValue: 'b'}]
+
+arr[3] = 'd';
+// [{type: 'splice', object: <arr>, index: 3, removed: [], addedCount: 1}]
+
+arr.splice(1, 2, 'beta', 'gamma', 'delta');
+// [{type: 'splice', object: <arr>, index: 1, removed: ['B', 'c', 'd'], addedCount: 3}]
+
+ +

Spezifikationen

+ +

Strawman proposal specification.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.observe")}}

+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/of/index.html b/files/de/web/javascript/reference/global_objects/array/of/index.html new file mode 100644 index 0000000000..e0e69d50f5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/of/index.html @@ -0,0 +1,102 @@ +--- +title: Array.of() +slug: Web/JavaScript/Reference/Global_Objects/Array/of +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/of +--- +
{{JSRef}}
+ +
Die Array.of() Methode erstellt eine neue {{jsxref("Array")}} Instanz aus einer variablen Anzahl an Argumenten, ohne Rücksicht auf die Anzahl oder den Typ der Argumente.
+ +
 
+ +
Der Unterschied zwischen Array.of() und dem Array Konstruktor ist die Behandlung von ganzen Zahlen als Argumente: Array.of(7) erstellt ein Array mit einem Element, 7. Array(7) hingegen erstellt ein leeres Array, bei dem die Eigenschaft length den Wert 7 gesetzt ist (Bemerkung: das impliziert ein Array mit 7 leeren Elementen, bei dem alle Elemente undefined sind).
+ +
 
+ +
Array.of(7);       // [7]
+Array.of(1, 2, 3); // [1, 2, 3]
+
+Array(7);          // [ , , , , , , ]
+Array(1, 2, 3);    // [1, 2, 3]
+
+ +

Syntax

+ +
Array.of(element0[, element1[, ...[, elementN]]])
+ +

Parameter

+ +
+
elementN
+
Elemente, welche sich im neu erzeugten Array befinden.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

Diese Funktion ist Teil des EMCAScript 2015 Standards. Für mehr Information siehe Array.of and Array.from und Array.of polyfill.

+ +

Beispiele

+ +
Array.of(1);         // [1]
+Array.of(1, 2, 3);   // [1, 2, 3]
+Array.of(undefined); // [undefined]
+
+ +

Polyfill

+ +

Wird der nachfolgende Code vor jedem anderen Code eingefügt, so wird Array.of() verfügbar, falls es nicht nativ implementiert ist.

+ +
if (!Array.of) {
+  Array.of = function() {
+    return Array.prototype.slice.call(arguments);
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-array.of', 'Array.of')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.of', 'Array.of')}}{{Spec2('ESDraft')}} 
+ +

Browser Kompabilität

+ +
+ + +

{{Compat("javascript.builtins.Array.of")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/pop/index.html b/files/de/web/javascript/reference/global_objects/array/pop/index.html new file mode 100644 index 0000000000..33274647f5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/pop/index.html @@ -0,0 +1,98 @@ +--- +title: Array.prototype.pop() +slug: Web/JavaScript/Reference/Global_Objects/Array/pop +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/pop +--- +
{{JSRef("Global_Objects", "Array")}}
+ +

Die pop() Methode entfernt das letzte Element eines Arrays und gibt dieses zurück. Diese Methode ändert die Länge des Arrays.

+ +
{{EmbedInteractiveExample("pages/js/array-pop.html")}}
+ + + +

Syntax

+ +
arr.pop()
+ +

Rückgabewert

+ +

Das entfernte Element aus dem Array; {{jsxref("undefined")}} wenn das Array leer ist.

+ +

Beschreibung

+ +

Die pop-Methode entfernt das letzte Element eines Arrays und gibt dieses zurück.

+ +

pop ist bewusst generisch gehalten. DIese Methode kann mit {{jsxref("Function.call", "called", "", 1)}} oder {{jsxref("Function.apply", "applied", "", 1)}} auf einem Objekten aufgerufen werden, welches Arrays ähneln ist. Objekte, die keine length Eigenschaft enthalten, welches das letzt Element in dem Objekt markieren oder keine nullbasierten numerischen Eigenschaften widerspiegelt, verhalten sich möglicherweise nicht in einer Weise.

+ +

Wenn pop() auf einem leeren Array aufgerufen wird, so wird undefined zurückgegeben.

+ +

Beispiele

+ +

Entfernen des letzten Elements eines Arrays

+ +

Der folgende Code erzeugt ein Array myFish, das aus vier Elementen besteht. Im Anschluss daran wird das letzte Element entfernt.

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+
+var popped = myFish.pop();
+
+console.log(myFish); // ['angel', 'clown', 'mandarin' ]
+
+console.log(popped); // 'sturgeon'
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 3rd Edition{{Spec2('ES3')}}Initiale Definition. Implementiert mit JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.6', 'Array.prototype.pop')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.pop', 'Array.prototype.pop')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.pop', 'Array.prototype.pop')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.pop")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/prototypen/index.html b/files/de/web/javascript/reference/global_objects/array/prototypen/index.html new file mode 100644 index 0000000000..dcab74024e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/prototypen/index.html @@ -0,0 +1,183 @@ +--- +title: Array.Prototypen +slug: Web/JavaScript/Reference/Global_Objects/Array/Prototypen +tags: + - Array + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Array/prototype +--- +
{{JSRef}}
+ +

Die Array.prototype (Anordnung.Muster) Eigenschaft repräsentiert eine Schablone (Prototypen) des {{jsxref("Array")}} Konstrukteurs und erlaubt dir neue Eigenschaften und Methoden zu allen Array Objekten hinzuzufügen.

+ +
// Wenn JavaScript eine first() Methode vom Grundsatz nicht unterstützt
+// füge eine neue Methode als Rückgabewert des ersten Elements als Array zurück
+
+if (!Array.prototype.first) {
+  Array.prototype.first = function() {
+    return this[0];
+  }
+}
+ +

Beschreibung

+ +

{{jsxref("Array")}} Instanzen erben vom Array.prototype. Wie mit allen Konstrukteuren kannst du das Konstrukteur Protoypen Objekt ändern, um alle {{jsxref("Array")}} Instanzen zu verändern. Ein Beispiel: du kannst neue Methoden und Eigenschaften zu allen Array-Objekten hinzufügen und diese damit erweitern. Dies wird zum Beispiel für {{Glossary("Polyfill", "polyfilling")}} genutzt.

+ +

Ganz nebenbei: ein Array-Protoyp selbst ist ein {{jsxref("Array")}}:

+ +
Array.isArray(Array.prototype); // true
+
+ +

{{js_property_attributes(0, 0, 0)}}

+ +

Eigenschaften

+ +
+
Array.prototype.constructor
+
Beschreibt die Funktion um ein Objekt-Prototypen zu erstellen.
+
{{jsxref("Array.prototype.length")}}
+
Gibt die Nummer an Elementen in einem Array wieder.
+
{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}
+
Eine Symbol-beinhaltende Eigenschaft beschreibt das ausschließen von einem mit with eingebundenden Geltungsbereich.
+
+ +

Methoden

+ +

Mutationsmethoden

+ +

Diese Methoden verändern ein Array:

+ +
+
{{jsxref("Array.prototype.copyWithin()")}}
+
Kopiert einen Teil eines Array Elements innerhalb eines Array.
+
{{jsxref("Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays von einem Start-Index zu einem Ende-Index mit einem festen Wert.
+
{{jsxref("Array.prototype.pop()")}}
+
Entfernt das letzte Element von einem Array und gibt dieses Element als Rückgabewert aus.
+
{{jsxref("Array.prototype.push()")}}
+
Fügt eins oder mehrere Elemente zu dem Ende des Arrays hinzu und gibt die neue Länge des Arrays zurück
+
{{jsxref("Array.prototype.reverse()")}}
+
Dreht die Reihenfolge der Elemente in einem Array um - das erste Element wird das letzte und das letzte Element wird das erste.
+
{{jsxref("Array.prototype.shift()")}}
+
Entfernt das erste Element innerhalb eines Array und gibt das Element als Rückgabewert aus.
+
{{jsxref("Array.prototype.sort()")}}
+
Sortiert innerhalb eines Arrays die Elemente und gibt das sortierte Array aus.
+
{{jsxref("Array.prototype.splice()")}}
+
Fügt Elemente von einem Array hinzu und/oder entfernt diese.
+
{{jsxref("Array.prototype.unshift()")}}
+
Fügt ein oder mehr Elemente an erster Stelle eines Array hinzu und gibt die Länge des neuen Arrays zurück.
+
+ +

Zugriffsmethoden

+ +

Diese Methoden verändern das Array nicht und geben als Rückgabewert eine Darstellung des Arrays an.

+ +
+
{{jsxref("Array.prototype.concat()")}}
+
Gibt ein neues Array zusammengestellt von diesem Array und verknüpft mit anderen/ mehreren Array(s) und/ oder einem/ mehreren Wert(en).
+
{{jsxref("Array.prototype.includes()")}}
+
Überprüft, ob ein Array ein bestimmtes Element enthält und gibt als Rückgabewert true oder false an.
+
{{jsxref("Array.prototype.indexOf()")}}
+
Gibt die erste Stelle (Index) eines einzelnen, dem beschriebenen, Elements innerhalb eines Array an. Wenn das Element nicht gefunden wurde gibt er -1 zurück.
+
{{jsxref("Array.prototype.join()")}}
+
Verbindet alle Elemente eines Arrays zu einem String.
+
{{jsxref("Array.prototype.lastIndexOf()")}}
+
Gibt den letzten (höchsten) Index des beschriebenen Elements innerhalb eines Arrays aus, oder -1, wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.slice()")}}
+
Extrahiert einen Teil eines Arrays und gibt diesen als neues Array aus.
+
{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt ein Array-Literal des beschriebenen Arrays zurück; du kannst diesen Wert nutzen um ein neues Array zu erstellen. Überschreibt die {{jsxref("Object.prototype.toSource()")}} Methode.
+
{{jsxref("Array.prototype.toString()")}}
+
Gibt einen String zurück, welcher das Array und seine Elemente beinhaltet. Überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
{{jsxref("Array.prototype.toLocaleString()")}}
+
Gibt einen lokalen String zurück, welcher das Array und seine Elemente beschreibt. Überschreibt die {{jsxref("Object.prototype.toLocaleString()")}} Methode.
+
+ +

Zählmethoden

+ +

Einige Methoden nehmen als Argument eine Funktion an und führen diese während des Aufrufs des Arrays aus. Wenn diese Methoden aufgerufen werden, wird die Länge (length) des Arrays abgetastet und jedes Element außerhalb der dieser Länge innerhalb eines nicht aufgerufenen Callbacks hinzugefügt. Andere Änderungen zu einem Array (setzen eines Wertes oder das Löschen eines Elements) könnten Auswirkungen auf das Ergebnis der Operation haben, wenn die Methode das veränderte Element im Nachhinein besucht. Während das spezielle Verhalten dieser Methoden in einem solchen Fall gut definiert sind, solltest du dich dennoch nicht darauf verlassen, damit du andere, die deinen möglicherweise lesen - nicht verwirrt werden. Wenn du das Array verändern musst, solltest du das veränderte Array in ein neu erstelltes Array packen.

+ +
+
{{jsxref("Array.prototype.entries()")}}
+
Gibt ein neues Array Zähl Objekt (Array Iterator Object) zurück, welches das key/value Paar für jeden Index in dem Array innehält.
+
{{jsxref("Array.prototype.every()")}}
+
Gibt true zurück, wenn alle Elemente in diesem Array die zu testende Funktion bestehen.
+
{{jsxref("Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen dieses Arrays für welches die Filter-Funktion innerhalb den Rückgabewert true benutzt.
+
{{jsxref("Array.prototype.find()")}}
+
Gibt den ersten gefundenen Wert innerhalb eines Arrays wieder, wenn ein Element innerhalb des Arrays die definierte Test-Funktion besteht oder undefined wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.findIndex()")}}
+
Gibt den gefundenen Index im Array an, wenn ein Element in dem Array die angegebene Test-Funktion besteht - oder -1, wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.forEach()")}}
+
Ruft eine Funktion für jedes Element in einem Array auf.
+
{{jsxref("Array.prototype.keys()")}}
+
+

Gibt einen neuen Array Iterator (Zeiger) aus, welcher die Schlüssel für jeden Index innerhalb des Arrays beinhaltet.

+
+
{{jsxref("Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Ergebnissen der ausgeführten definierten Funktion an jedem Element in diesem Array.
+
{{jsxref("Array.prototype.reduce()")}}
+
Reduziert das Array auf einen einzigen Wert, indem es jeweils zwei Elemente durch die angegebene Funktion ausführt. Optional: als zweiten Paramater einen Startwert angeben.
+
{{jsxref("Array.prototype.reduceRight()")}}
+
Reduziert das Array auf einen einzigen Wert, indem es jeweils zwei Elemente durch die angegebene Funktion ausführt (von rechts nach links). Optional: als zweiten Paramater einen Startwert angeben.
+
{{jsxref("Array.prototype.some()")}}
+
+
Gibt true zurück, wenn mindestens ein Element in diesem Array den Test der definierten Funktion besteht.
+
+
{{jsxref("Array.prototype.values()")}}
+
Gibt einen neues Array Iterator Objekt zurück, welches die Werte für jeden Index in dem Array beinhaltet.
+
{{jsxref("Array.prototype.@@iterator()", "Array.prototype[@@iterator]()")}}
+
Gibt einen neues Array Iterator Objekt zurück, welches die Werte für jeden Index in dem Array beinhaltet.
+
+ +

Generische Methoden (kein Standard)

+ +

Vielen Methoden von den JavaScript Array Objekten sind für die allgemeine Anwendung an allem Objekten entwickelt wurden, welche "aussehen wie" Arrays. Der Grund ist, dass sie an allen Objekten angewandt werden könne, welche eine Längen-Eigenschaft besitzen, und welche nützlicherweise eine numerische Eigenschaft benennen (wie mit der array[5] Indizierung). Einige Methoden, solche wie {{jsxref("Array.join", "join")}}, lesen nur die Länge (length) und numerische Eigenschaften von dem Objekt an welches sie angewandt werden. Andere, wie {{jsxref("Array.reverse", "reverse")}}, erfordern eine Veränderung der numerischen Objekt- und Längen-Eigenschaften; diese Methoden können deshalb nicht von Objekten wie {{jsxref("String")}} aufgerufen werden, welche das künstliche Setzen ihrer Längen- (length)  oder numerischen Eigenschaft nicht erlauben.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4.3.1', 'Array.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype', 'Array.prototype')}}{{Spec2('ES6')}}Hinzugefügt der copyWithin(), fill(), entries(), keys(), values(), find(), findIndex() Methoden.
{{SpecName('ES7', '#sec-array.prototype', 'Array.prototype')}}{{Spec2('ES7')}}Hinzugefügt der includes() Methode.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/push/index.html b/files/de/web/javascript/reference/global_objects/array/push/index.html new file mode 100644 index 0000000000..986fcf944b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/push/index.html @@ -0,0 +1,141 @@ +--- +title: Array.prototype.push() +slug: Web/JavaScript/Reference/Global_Objects/Array/push +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/push +--- +
{{JSRef}}
+ +

Die push() Methode fügt ein oder mehr Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-push.html")}}
+ + + +

Syntax

+ +
arr.push(element1 [, ... [, elementN]])
+ +

Parameter

+ +
+
elementN
+
Die Elemente, die am Ende des Arrays eingefügt werden.
+
+ +

Rückgabewert

+ +

Den neuen Wert der {{jsxref("Array.length", "length")}} Eigenschaft (Länge des Arrays), nachdem die Methode ausgeführt wurde.

+ +

Beschreibung

+ +

Die push Methode fügt Werte an das Ende eines Arrays an.

+ +

push ist absichtlich generisch gehalten. Die Methode kann mit Hilfe von {{jsxref("Function.call", "call()")}} und {{jsxref("Function.apply", "apply()")}} auch auf Array ähnliche Objekte angewendet werden. Die Methode wählt anhand der length Eigenschaft den Punkt aus, an dem die Werte eingefügt werden. Falls die length Eigenschaft nicht in eine Zahl umgewandelt werden kann, wird 0 als Index verwendet. Das gilt auch für den Fall, dass die length Eigenschaft nicht vorhanden ist. Die length Eigenschaft wird daraufhin erstellt.

+ +

Obwohl {{jsxref("Global_Objects/String", "Strings", "", 1)}} native, Array-ähnliche Objekte sind, sind sie in Anwendungen dieser Methode nicht geeignet, da Strings unveränderlich sind. Gleiches gilt für das native, Array-ähnliche Objekt {{jsxref("Functions/arguments", "arguments", "", 1)}}.

+ +

Beispiele

+ +

Elemente zu einem Array hinzufügen

+ +

Der folgende Quelltext erstellt ein sports Array mit zwei Elementen und fügt anschließend zwei weitere Elemente hinzu. Die Variable total enthält die neue Länge des Arrays.

+ +
var sports = ['soccer', 'baseball'];
+var total = sports.push('football', 'swimming');
+
+console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
+console.log(total);  // 4
+
+ +

Zwei Arrays zusammenführen

+ +

Dieses Beispiel benutzt {{jsxref("Function.apply", "apply()")}}, um alle Elemente eines zweiten Arrays hinzuzufügen.

+ +

Diese Methode sollte nicht benutzt werden, wenn das zweite Array (moreVegs in diesem Beispiel) sehr lang ist, weil die maximale Anzahl der Parametern, die eine Funktion haben kann, in der Praxis limitiert ist. Siehe {{jsxref("Function.apply", "apply()")}} für mehr Details.

+ +
var vegetables = ['parsnip', 'potato'];
+var moreVegs = ['celery', 'beetroot'];
+
+// Fügt das zweite Array an das erste Array an
+// Equivalent zu vegetables.push('celery', 'beetroot');
+Array.prototype.push.apply(vegetables, moreVegs);
+
+console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
+ +

Objekte wie ein Array behandeln

+ +

Wie oben angedeutet ist, ist push extra generisch gehalten, was man zu seinem Vorteil nutzen kann. Array.prototype.push kann gut auf ein Objekt angewendet werden, wie das Beispiel zeigt. Zu beachten ist, dass kein Array erstellt wird, um eine Menge von Objekten zu speichern. Stattdessen werden die Objekte in dem Objekt selbst gespeichern, indem wir call auf der Array.prototype.push Methode einsetzen, um die Methode glauben zu lassen, wir arbeiten mit einem Array. Es funktioniert einfach, dank der Art und Weise, wie JavaScript es uns erlaubt, den Ausführungskontext nach Belieben festzulegen.

+ +
var obj = {
+    length: 0,
+
+    addElem: function addElem(elem) {
+        // obj.length wird automatisch erhöht,
+        // wenn ein Objekt hinzugefügt wird
+        [].push.call(this, elem);
+    }
+};
+
+// ein paar leere Objekte zu Illustrationszwecken hinzufügen
+obj.addElem({});
+obj.addElem({});
+console.log(obj.length);
+// → 2
+
+ +

Zu beachten ist, dass obj kein Array ist. Die Methode push erhöht erfolgreich die length Eigenschaft von obj, so als würde sie mit einem Array arbeiten.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.push")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reduce/index.html b/files/de/web/javascript/reference/global_objects/array/reduce/index.html new file mode 100644 index 0000000000..bbb3e4d57c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reduce/index.html @@ -0,0 +1,564 @@ +--- +title: Array.prototype.reduce() +slug: Web/JavaScript/Reference/Global_Objects/Array/Reduce +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reduce + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/Reduce +--- +
{{JSRef}}
+ +

Die reduce()-Methode reduziert ein Array auf einen einzigen Wert, indem es jeweils zwei Elemente (von links nach rechts) durch eine gegebene Funktion reduziert.

+ +
{{EmbedInteractiveExample("pages/js/array-reduce.html")}}
+ + + +

Syntax

+ +
arr.reduce(callback[, initialValue])
+ +

Parameter

+ +
+
callback
+
Funktion, welche auf jeden Wert im Array angewandet wird und vier Argumente hat: +
+
accumulator
+
Der kumulierte Wert ist der Rückgabewert von callback; der in der zuvor zurückgegebene Wert des letzten Aufrufes von callback oder initialValue werden verwendet.
+
currentValue
+
Das aktuell zu verarbeitende Element des Arrays.
+
currentIndex{{optional_inline}}
+
Der Index des aktuellen Elements des Arrays. Beginnt mit dem Index 0, falls initialValue angegeben wurde, ansonsten mit Index 1.
+
array{{optional_inline}}
+
Das Array, auf dem reduce abgerufen wird.
+
+
+
initialValue{{optional_inline}}
+
Der Wert des ersten Arguments, der bei dem ersten Aufruf in callback zu benutzt wird. Wenn kein Initialwert angegeben wird, wird das erste Element des Arrays benutzt. Das Aufrufen von reduce() auf einem leeren Array ohne Initialwerts führt zu einem Fehler.
+
+ +

Rückgabewert

+ +

Der Ergebniswert der Reduzierung.

+ +

Beschreibung

+ +

reduce() führt die callback-Funktion für jedes existierende Element in dem Array aus, Ausnahme sind nicht gesetzte Werte. callback hat vier Parameter:

+ + + +

Beim ersten Aufruf von callback sind die Werte von accumulator und currentValue in Abhängigkeit vom Parameter initialValue wie folgt:

+ + + +
+

Hinweis: Wenn initialValue nicht angegeben wird, wird reduce() die callback-Funktion startend beim Index 1 aufrufen, der erste Index wird übersprungen. Wenn initialValue angegeben ist, wird bei Index 0 begonnen.

+
+ +

Wenn das Array leer ist und kein initialValue angegeben ist, wird ein {{jsxref("TypeError")}} erzeugt. Wenn das Array nur ein Element hat (die Position ist egal) und kein initialValue angegeben ist oder wenn initialValue angegeben ist und das Array leer ist, wird der einzelne Wert sofort zurückgegeben, ohne callback aufzurufen.

+ +

Es ist immer sicherer initialValue anzugeben, weil es drei mögliche Ergebnisse ohne initialValue gibt, wie es im folgenden Beispiel gezeigt ist.

+ +
var maxCallback = ( acc, cur ) => Math.max( acc.x, cur.x );
+var maxCallback2 = ( max, cur ) => Math.max( max, cur );
+
+// reduce() without initialValue
+[ { x: 22 }, { x: 42 } ].reduce( maxCallback ); // 42
+[ { x: 22 }            ].reduce( maxCallback ); // { x: 22 }
+[                      ].reduce( maxCallback ); // TypeError
+
+// map/reduce; better solution, also works for empty or larger arrays
+[ { x: 22 }, { x: 42 } ].map( el => el.x )
+                        .reduce( maxCallback2, -Infinity );
+
+ +

Wie reduce() funktioniert

+ +

Angenommen die folgende reduce() Funktion wird genutzt:

+ +
[0, 1, 2, 3, 4].reduce(function (accumulator, currentValue, currentIndex, array) {
+  return accumulator + currentValue;
+});
+
+ +

Die callback-Funktion wird viermal aufgerufen, mit den Parametern und Rückgabewert für jeden Aufruf wir folgend beschrieben:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackaccumulatorcurrentValuecurrentIndexarrayRückgabewert
1. Aufruf011[0, 1, 2, 3, 4]1
2. Aufruf122[0, 1, 2, 3, 4]3
3. Aufruf333[0, 1, 2, 3, 4]6
4. Aufruf644[0, 1, 2, 3, 4]10
+ +

Der zurückgegebene Wert von reduce() ist der Rückgabewert der letzten callback-Funktion (10).

+ +

Es ist zusätzlich möglich eine {{jsxref("Functions/Arrow_functions", "Arrow-Funktion","",1)}} statt einer ganzen Funktion zu benutzen. Der folgende Quelltext erzeugt die gleiche Ausgabe wie der Vorherige:

+ +
[0, 1, 2, 3, 4].reduce( (prev, curr) => prev + curr );
+
+ +

Wenn als zweiter Parameter von reduce() initialValue angegeben ist, wird das Ergebnis wie folgt aussehen:

+ +
[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {
+  return accumulator + currentValue;
+}, 10);
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackaccumulatorcurrentValuecurrentIndexarrayRückgabewert
1. Aufruf1000[0, 1, 2, 3, 4]10
2. Aufruf1011[0, 1, 2, 3, 4]11
3. Aufruf1122[0, 1, 2, 3, 4]13
4. Aufruf1333[0, 1, 2, 3, 4]16
5. Aufruf1644[0, 1, 2, 3, 4]20
+ +

Der von reduce() zurückgegebene Wert ist in diesem Fall 20.

+ +

Beispiele

+ +

Alle Elemente eines Arrays summieren

+ +
var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
+  return accumulator + currentValue;
+}, 0);
+// sum is 6
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var total = [ 0, 1, 2, 3 ].reduce(
+  ( accumulator, currentValue ) => accumulator + currentValue,
+  0
+);
+ +

Summe von Werten in einem Objektarray

+ +

Um in einem Array von Objekten Werte aufzusummieren, muss ein Initialwert angegeben werden, so dass jedes Element in der Funktion durchlaufen wird.

+ +
var initialValue = 0;
+var sum = [{x: 1}, {x:2}, {x:3}].reduce(function (accumulator, currentValue) {
+    return accumulator + currentValue.x;
+},initialValue)
+
+console.log(sum) // logs 6
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var initialValue = 0;
+var sum = [{x: 1}, {x:2}, {x:3}].reduce(
+    (accumulator, currentValue) => accumulator + currentValue.x
+    ,initialValue
+);
+
+console.log(sum) // logs 6
+ +

Geschachtelte Arrays zu einem flachen Array machen

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
+  function(accumulator, currentValue) {
+    return accumulator.concat(currentValue);
+  },
+  []
+);
+// flattened is [0, 1, 2, 3, 4, 5]
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
+  ( accumulator, currentValue ) => accumulator.concat(currentValue),
+  []
+);
+
+ +

Zählen von Instanzen eines Wertes in einem Objekt

+ +
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
+
+var countedNames = names.reduce(function (allNames, name) {
+  if (name in allNames) {
+    allNames[name]++;
+  }
+  else {
+    allNames[name] = 1;
+  }
+  return allNames;
+}, {});
+// countedNames is:
+// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
+
+ +

Objekte nach einer Eigenschaft gruppieren

+ +
var people = [
+  { name: 'Alice', age: 21 },
+  { name: 'Max', age: 20 },
+  { name: 'Jane', age: 20 }
+];
+
+function groupBy(objectArray, property) {
+  return objectArray.reduce(function (acc, obj) {
+    var key = obj[property];
+    if(!acc[key]) {
+      acc[key] = [];
+    }
+    acc[key].push(obj);
+    return acc;
+  }, {});
+}
+
+var groupedPeople = groupBy(people, 'age');
+// groupedPeople is:
+// {
+//   20: [
+//     { name: 'Max', age: 20 },
+//     { name: 'Jane', age: 20 }
+//   ],
+//   21: [{ name: 'Alice', age:21 }]
+// }
+
+ +

Verbinden von Arrays in einem Array von Objekten mithilfe des Spread-Operators und von initialValue

+ +
// friends - an array of objects
+// where object field "books" - list of favorite books
+var friends = [{
+  name: 'Anna',
+  books: ['Bible', 'Harry Potter'],
+  age: 21
+}, {
+  name: 'Bob',
+  books: ['War and peace', 'Romeo and Juliet'],
+  age: 26
+}, {
+  name: 'Alice',
+  books: ['The Lord of the Rings', 'The Shining'],
+  age: 18
+}];
+
+// allbooks - list which will contain all friends' books +
+// additional list contained in initialValue
+var allbooks = friends.reduce(function(accumulator, currentValue) {
+  return [...accumulator, ...currentValue.books];
+}, ['Alphabet']);
+
+// allbooks = [
+//   'Alphabet', 'Bible', 'Harry Potter', 'War and peace',
+//   'Romeo and Juliet', 'The Lord of the Rings',
+//   'The Shining'
+// ]
+ +

Duplikate in einem Array entfernen

+ +
let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4];
+let result = arr.sort().reduce((accumulator, current) => {
+    const length = accumulator.length;
+    if (length === 0 || accumulator[length - 1] !== current) {
+        accumulator.push(current);
+    }
+    return accumulator;
+}, []);
+console.log(result); //[1,2,3,4,5]
+
+ +

Sequenzielle Abarbeitung von Promises

+ +
/**
+ * Runs promises from array of functions that can return promises
+ * in chained manner
+ *
+ * @param {array} arr - promise arr
+ * @return {Object} promise object
+ */
+function runPromiseInSequence(arr, input) {
+  return arr.reduce(
+    (promiseChain, currentFunction) => promiseChain.then(currentFunction),
+    Promise.resolve(input)
+  );
+}
+
+// promise function 1
+function p1(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 5);
+  });
+}
+
+// promise function 2
+function p2(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 2);
+  });
+}
+
+// function 3 - will wrapped in a resolved promise by .then()
+function f3(a) {
+  return a * 3;
+}
+
+// promise function 4
+function p4(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 4);
+  });
+}
+
+const promiseArr = [p1, p2, f3, p4];
+runPromiseInSequence(promiseArr, 10)
+  .then(console.log);    // 1200
+
+ +

Funktionskomposition ermöglicht Pipelining

+ +
// Building-blocks to use for composition
+const double = x => x + x;
+const triple = x => 3 * x;
+const quadruple = x => 4 * x;
+
+// Function composition enabling pipe functionality
+const pipe = (...functions) => input => functions.reduce(
+    (acc, fn) => fn(acc),
+    input
+);
+
+// Composed functions for multiplication of specific values
+const multiply6 = pipe(double, triple);
+const multiply9 = pipe(triple, triple);
+const multiply16 = pipe(quadruple, quadruple);
+const multiply24 = pipe(double, triple, quadruple);
+
+// Usage
+multiply6(6); // 36
+multiply9(9); // 81
+multiply16(16); // 256
+multiply24(10); // 240
+
+ +

Mapfunktion mit reduce

+ +
if (!Array.prototype.map) {
+  Array.prototype.map = function(callback, thisArg) {
+    return this.reduce(function(mappedArray, currentValue, index, array) {
+      mappedArray[index] = callback.call(thisArg, currentValue, index, array);
+      return mappedArray;
+    }, []);
+  };
+}
+
+[1, 2, , 3].map(
+  (currentValue, index, array) => currentValue + index + array.length
+); // [5, 7, , 10]
+
+
+ +

Polyfill

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.21
+// Reference: http://es5.github.io/#x15.4.4.21
+// https://tc39.github.io/ecma262/#sec-array.prototype.reduce
+if (!Array.prototype.reduce) {
+  Object.defineProperty(Array.prototype, 'reduce', {
+    value: function(callback /*, initialValue*/) {
+      if (this === null) {
+        throw new TypeError( 'Array.prototype.reduce ' +
+          'called on null or undefined' );
+      }
+      if (typeof callback !== 'function') {
+        throw new TypeError( callback +
+          ' is not a function');
+      }
+
+      // 1. Let O be ? ToObject(this value).
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // Steps 3, 4, 5, 6, 7
+      var k = 0;
+      var value;
+
+      if (arguments.length >= 2) {
+        value = arguments[1];
+      } else {
+        while (k < len && !(k in o)) {
+          k++;
+        }
+
+        // 3. If len is 0 and initialValue is not present,
+        //    throw a TypeError exception.
+        if (k >= len) {
+          throw new TypeError( 'Reduce of empty array ' +
+            'with no initial value' );
+        }
+        value = o[k++];
+      }
+
+      // 8. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kPresent be ? HasProperty(O, Pk).
+        // c. If kPresent is true, then
+        //    i.  Let kValue be ? Get(O, Pk).
+        //    ii. Let accumulator be ? Call(
+        //          callbackfn, undefined,
+        //          « accumulator, kValue, k, O »).
+        if (k in o) {
+          value = callback(value, o[k], k, o);
+        }
+
+        // d. Increase k by 1.
+        k++;
+      }
+
+      // 9. Return accumulator.
+      return value;
+    }
+  });
+}
+
+ +

Wenn es wirklich notwendig ist veraltete JavaScript-Umgebungen zu benutzen, die Object.defineProperty() nicht unterstützen, ist es besser Array.prototype nicht komplett zu ersetzen, weil man es nicht non-enumerable machen kann.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezificationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.21', 'Array.prototype.reduce()')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.
{{SpecName('ES6', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reduce")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reduceright/index.html b/files/de/web/javascript/reference/global_objects/array/reduceright/index.html new file mode 100644 index 0000000000..dfcb7e3a0b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reduceright/index.html @@ -0,0 +1,334 @@ +--- +title: Array.prototype.reduceRight() +slug: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +--- +
{{JSRef}}
+ +

Die reduceRight() Methode wendet eine Funktion gegen einen Akkumulator auf jeden Wert des Arrays (von rechts nach links) auf und reduziert es um einen einzelnen Wert.

+ +
{{EmbedInteractiveExample("pages/js/array-reduce-right.html")}}
+ + + +

Siehe auch {{jsxref("Array.prototype.reduce()")}} für links nach rechts Reduzierung.

+ +

Syntax

+ +
arr.reduceRight(callback[, initialValue])
+ +

Parameter

+ +
+
callback
+
Funktion, welche für jeden Wert im Array aufgerufen wird und vier Argumente hat: +
+
previousValue
+
Der zuvor im letzten Aufruf des Rückrufs zurückgegebene Wert, oder initialValue, wenn unterstützt. (siehe unten)
+
currentValue
+
Das derzeitige zu verarbeitende Element in dem Array.
+
index{{optional_inline}}
+
Der Index des derzeitigen zu verarbeitenden Elements in dem Array.
+
array{{optional_inline}}
+
Das Arrayobjekt, in dem das Element enthalten ist.
+
+
+
initialValue{{optional_inline}}
+
Objekt, welches beim ersten Aufruf der callback Funktion initial benutzt wird. Wenn kein Initialwert angegeben ist wird das letzte Element aus dem Array benutzt. Der aufruf auf einem leeren Array ohne angabe von initialValue führt zu einem Fehler.
+
+ +

Rückgabewert

+ +

Der Wert, der aus der Reduktion resultiert.

+ +

Beschreibung

+ +

reduceRight Führt die Rückruffunktion einmal für jedes im Array vorhandene Element aus, ohne Löcher im Array, wobei vier Argumente empfangen werden: der Initialwert (initialValue) (oder Wert des vorherigen callback Aufrufes), der Wert des derzeitigen Elements, der derzeitige Index, und das Array auf welches der Durchlauf stattfindet.

+ +

Der Aufruf des reduceRight callback würde ungefähr so aussehen:

+ +
array.reduceRight(function(previousValue, currentValue, index, array) {
+  // ...
+});
+
+ +

Wenn die Funktion das erste Mal ausgeführt wird, kann der vorherige Wert  (previousValue)  und der derzeitige Wert (currentValue) eines von zwei Werten sein. Wenn ein Initialwert (initialValue) der Callback-Funktion zu reduceRight mitgegeben wird, dann wird der previousValue und der initialValue gleich dem initialValue in dem Array. Wenn kein initialValue  mitgegeben wird, dann ist der previousValue gleich dem Wert in dem Array und currentValue wird gleich zu dem geich dem zweiten bis letzten Wert.

+ +

Wenn das Array leer ist und kein initialValue angegeben ist wird ein {{jsxref("TypeError")}} erzeugt. Wenn das Array nur ein Element hat (die Position ist egal) und kein initialValue angegeben ist oder wenn initialValue angegeben ist und das Array leer ist, wird der einzelne Wert zurückgegeben ohne callback aufzurufen.

+ +

Einige Beispieldurchläufe der Funktion würden wie folgt aussehen:

+ +
[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) {
+  return previousValue + currentValue;
+});
+
+ +

Die callback Funktion wird vier mal aufgerufen. Die Parameter und der Rückgabewert dieser Funktion sind wie folgt:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackpreviousValuecurrentValueindexarrayRückgabewert
1. Aufruf433[0, 1, 2, 3, 4]7
2. Aufruf722[0, 1, 2, 3, 4]9
3. Aufruf911[0, 1, 2, 3, 4]10
4. Aufruf1000[0, 1, 2, 3, 4]10
+ +

Der Wert, der von reduceRight zurückgegeben wird, ist der Rückgabewert der letzen callback Funktion (10).

+ +

Wenn ein initialValue angegeben wird, sieht das Resultat folgendermaßen aus:

+ +
[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) {
+  return previousValue + currentValue;
+}, 10);
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackpreviousValuecurrentValueindexarrayRückgabewert
1. Aufruf1044[0, 1, 2, 3, 4]14
2. Aufruf1433[0, 1, 2, 3, 4]17
3. Aufruf1722[0, 1, 2, 3, 4]19
4. Aufruf1911[0, 1, 2, 3, 4]20
5. Aufruf2000[0, 1, 2, 3, 4]20
+ +

Der von reduceRight zurückgegebene Wert ist in diesem Fall 20.

+ +

Beispiele

+ +

Alle Elemente in einem Array summieren

+ +
var sum = [0, 1, 2, 3].reduceRight(function(a, b) {
+  return a + b;
+});
+// sum is 6
+
+ +

Ein Array von Arrays in ein flaches Array schreiben

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
+    return a.concat(b);
+}, []);
+// flattened is [4, 5, 2, 3, 0, 1]
+
+ +

Eine Liste von asynchronen Funktionen mit Callbacks hintereinander laufen lassen, so dass das Resultat der vorherigen der nächsten übergeben wird

+ +
const waterfall = (...functions) => (callback, ...args) =>
+  functions.reduceRight(
+    (composition, fn) => (...results) => fn(composition, ...results),
+    callback
+  )(...args);
+
+const randInt = max => Math.floor(Math.random() * max)
+
+const add5 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x + 5);
+};
+const mult3 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x * 3);
+};
+const sub2 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x - 2);
+};
+const split = (callback, x) => {
+  setTimeout(callback, randInt(1000), x, x);
+};
+const add = (callback, x, y) => {
+  setTimeout(callback, randInt(1000), x + y);
+};
+const div4 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x / 4);
+};
+
+const computation = waterfall(add5, mult3, sub2, split, add, div4);
+computation(console.log, 5) // -> 14
+
+// same as:
+
+const computation2 = (input, callback) => {
+  const f6 = x=> div4(callback, x);
+  const f5 = (x, y) => add(f6, x, y);
+  const f4 = x => split(f5, x);
+  const f3 = x => sub2(f4, x);
+  const f2 = x => mult3(f3, x);
+  add5(f2, input);
+}
+ +

Unterschied zwischen reduce und reduceRight

+ +
var a = ['1', '2', '3', '4', '5'];
+var left  = a.reduce(function(prev, cur)      { return prev + cur; });
+var right = a.reduceRight(function(prev, cur) { return prev + cur; });
+
+console.log(left);  // "12345"
+console.log(right); // "54321"
+ +

Polyfill

+ +

reduceRight wurde im ECMA-262 Standard in der 5. Edition hinzugefügt. Aus diesem Grund ist es in manchen Implementierungen nicht vorhanden. Dieses Problem kann beheben werden indem folgender Quelltext am Anfang des Skripts eingefügt werden, wodurch reduceRight auch in solchen Implementierungen unterstützt werden kann.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.22
+// Reference: http://es5.github.io/#x15.4.4.22
+if ('function' !== typeof Array.prototype.reduceRight) {
+  Array.prototype.reduceRight = function(callback /*, initialValue*/) {
+    'use strict';
+    if (null === this || 'undefined' === typeof this) {
+      throw new TypeError('Array.prototype.reduce called on null or undefined');
+    }
+    if ('function' !== typeof callback) {
+      throw new TypeError(callback + ' is not a function');
+    }
+    var t = Object(this), len = t.length >>> 0, k = len - 1, value;
+    if (arguments.length >= 2) {
+      value = arguments[1];
+    } else {
+      while (k >= 0 && !(k in t)) {
+        k--;
+      }
+      if (k < 0) {
+        throw new TypeError('Reduce of empty array with no initial value');
+      }
+      value = t[k--];
+    }
+    for (; k >= 0; k--) {
+      if (k in t) {
+        value = callback(value, t[k], k, t);
+      }
+    }
+    return value;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.22', 'Array.prototype.reduceRight')}}{{Spec2('ES5.1')}}Initial definition. Implemented in JavaScript 1.8.
{{SpecName('ES6', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reduceRight")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reverse/index.html b/files/de/web/javascript/reference/global_objects/array/reverse/index.html new file mode 100644 index 0000000000..84560faacb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reverse/index.html @@ -0,0 +1,92 @@ +--- +title: Array.prototype.reverse() +slug: Web/JavaScript/Reference/Global_Objects/Array/reverse +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse +--- +
{{JSRef}}
+ +

Die reverse() Methode kehrt die Reihenfolge der Arrayelemente in-place um. Das erste Element wird zum letzen und das letzte wird zum ersten.

+ +
{{EmbedInteractiveExample("pages/js/array-reverse.html")}}
+ + + +

Syntax

+ +
arr.reverse()
+ +

Rückgabewert

+ +

Das umgedrehte Array.

+ +

Beschreibung

+ +

Die reverse Methode kehrt die Reihenfolge der Elemente des angegebenen Arrays in-place um, ändert das Array und gibt eine Referenz zu diesem zurück.

+ +

Beispiele

+ +

Elemente in einem Array umkehren

+ +

Das folgende Beispiel erzeugt ein Array a mit 3 Elementen und kehrt die Reihenfolge des Arrays um. Der Aufruf von reverse() gibt eine Referenz zum umgekehrten Array a zurück.

+ +
var a = [1, 2, 3];
+
+console.log(a) // [1, 2, 3]
+
+a.reverse();
+
+console.log(a) // [3, 2, 1]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reverse")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/shift/index.html b/files/de/web/javascript/reference/global_objects/array/shift/index.html new file mode 100644 index 0000000000..e576e1bfec --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/shift/index.html @@ -0,0 +1,111 @@ +--- +title: Array.prototype.shift() +slug: Web/JavaScript/Reference/Global_Objects/Array/shift +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/shift +--- +
{{JSRef}}
+ +

Die Methode shift() entfernt das erste Element eines Arrays und gibt dieses Element zurück. Diese Methode verändert die Länge des Arrays.

+ +
{{EmbedInteractiveExample("pages/js/array-shift.html")}}
+ + + +

Syntax

+ +
arr.shift()
+ +

Rückgabewert

+ +

Das vom Array entfernte Element; {{jsxref("undefined")}} wenn das Array leer ist.

+ +

Beschreibung

+ +

Die Methode shift entfernt das Element an der nullten Stelle, verschiebt die übrigen Elemente um einen Index nach unten und gibt den Wert des entfernten Elementes zurück. Ist die {{jsxref("Array.length", "length")}} Eigenschaft gleich 0, wird {{jsxref("undefined")}} zurückgegeben.

+ +

shift ist absichtlich generisch; diese Methode kann auf Array ähnlichen Objekten mit {{jsxref("Function.call", "call", "", 1)}} oder {{jsxref("Function.apply", "applied", "", 1)}} genutzt werden. Objekte, die keine length Eigenschaft enthalten, die die letzte in einer Reihe von aufeinanderfolgenden, nullbasierten numerischen Eigenschaften widerspiegelt, verhalten sich möglicherweise nicht in einer sinnvollen Weise.

+ +

Beispiele

+ +

Ein Element eines Arrays entfernen

+ +

Das folgende Skript zeigt das Array myFish bevor und nachdem das erste Element dieses Arrays entfernt wurde. Anschließend wird das entfernte Element angezeigt:

+ +
var myFish = ['angel', 'clown', 'mandarin', 'surgeon'];
+
+console.log('myFish before: ' + myFish);
+// myFish before: ['angel', 'clown', 'mandarin', 'surgeon']
+
+var shifted = myFish.shift();
+
+console.log('myFish after: ' + myFish);
+// myFish after: ['clown', 'mandarin', 'surgeon']
+
+console.log('Removed this element: ' + shifted);
+// Removed this element: angel
+ +

Einsatz von shift() in einer while-Schleife

+ +

Die shift() Methode wird oft in der Bedingung in einer while Schleife verwendet. Im folgenden Beispiel wird in jeder Iteration das nächste Element vom Array entfernt, bis das Array leer ist.

+ +
var names = ["Andrew", "Edward", "Paul", "Chris" ,"John"];
+
+while( (i = names.shift()) !== undefined ) {
+    console.log(i);
+}
+// Andrew, Edward, Paul, Chris, John
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.9', 'Array.prototype.shift')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.shift', 'Array.prototype.shift')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.shift', 'Array.prototype.shift')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.shift")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/slice/index.html b/files/de/web/javascript/reference/global_objects/array/slice/index.html new file mode 100644 index 0000000000..75ad6c4a25 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/slice/index.html @@ -0,0 +1,244 @@ +--- +title: Array.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/Array/slice +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice +--- +
{{JSRef}}
+ +

Die slice() Methode schreibt eine flache Kopie von einem Teil des Arrays in ein neues Array-Objekt von begin bis end (end nicht enthalten). Das originale Array wird nicht verändert.

+ +
{{EmbedInteractiveExample("pages/js/array-slice.html")}}
+ + + +

Syntax

+ +
arr.slice([begin[, end]])
+ +

Parameter

+ +
+
begin{{optional_inline}}
+
Null-basierter Index, an welcher die Extraktion beginnt.
+
Bei einem negativen Index kennzeichnet begin einen Versatz vom Ende der Sequenz. slice(-2) extrahiert die letzten zwei Elemente der Sequenz.
+
Wenn begin undefiniert ist, beginnt slice bei Index 0.
+
Wenn begin größer als die Länge der Sequenz ist, wird ein leeres Array zurückgegeben.
+
end {{optional_inline}}
+
Null-basierter Index bevor die Extraktion endet. slice extrahiert bis zu, aber nicht inklusive end.
+
slice(1,4) extrahiert vom zweiten bis zum vierten Element (Elemente sind indexiert als 1, 2 und 3).
+
Bei einem negativen Index kennzeichnet end einen Versatz vom Ende der Sequenz. slice(2, -1) extrahiert vom dritten bis zum vorletzten Element der Sequenz.
+
Wenn auf end weggelassen wird, extrahiert slice bis zum Ende der Sequenz (arr.length).
+
Wenn end größer als die Länge der Sequenz ist, extrahiert slice bis zum Ende der Sequenz (arr.length)
+
+ +

Rückgabewert

+ +

Ein neues Array, welches die extrahierten Elemente enthält.

+ +

Beschreibung

+ +

slice verändert das originale Array nicht. Es gibt eine Schattenkopie der Elemente des Arrays zurück. Elemente des original Arrays werden folgendermaßen in das zurückgegeben Array kopiert:

+ + + +

Wenn ein neues Element zu einem Array hinzugefügt wird, hat es keine Auswirkung auf das andere Array.

+ +

Beispiel

+ +

Gibt einen Teil eines existierenden Arrays zurück.

+ +
var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
+var citrus = fruits.slice(1, 3);
+
+// fruits enthält  ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
+// citrus enthält ['Orange','Lemon']
+
+ +

Einsatz von slice

+ +

Im folgenden Beispiel erzeugt slice ein neues Array, newCar, von myCar.
+ Beide haben eine Referenz zu dem Objekt myHonda. Wenn sich die Farbe von myHonda zu lila ändert, dann ist die Änderung in beiden Arrays sichtbar.

+ +
// Using slice, create newCar from myCar.
+var myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } };
+var myCar = [myHonda, 2, 'cherry condition', 'purchased 1997'];
+var newCar = myCar.slice(0, 2);
+
+// Display the values of myCar, newCar, and the color of myHonda
+//  referenced from both arrays.
+console.log('myCar = ' + myCar.toSource());
+console.log('newCar = ' + newCar.toSource());
+console.log('myCar[0].color = ' + myCar[0].color);
+console.log('newCar[0].color = ' + newCar[0].color);
+
+// Change the color of myHonda.
+myHonda.color = 'purple';
+console.log('The new color of my Honda is ' + myHonda.color);
+
+// Display the color of myHonda referenced from both arrays.
+console.log('myCar[0].color = ' + myCar[0].color);
+console.log('newCar[0].color = ' + newCar[0].color);
+
+ +

Dieses Skript schreibt:

+ +
myCar = [{color:'red', wheels:4, engine:{cylinders:4, size:2.2}}, 2,
+         'cherry condition', 'purchased 1997']
+newCar = [{color:'red', wheels:4, engine:{cylinders:4, size:2.2}}, 2]
+myCar[0].color = red
+newCar[0].color = red
+The new color of my Honda is purple
+myCar[0].color = purple
+newCar[0].color = purple
+
+ +

Array-ähnliche Objekte

+ +

Die slice Methode kann auch verwendete werden, um Array-ähnliche Objekte bzw. Collections in Arrays zu konvertieren. Man muss nur die Methode an das Objekt binden.
+ Die {{jsxref("Functions/arguments", "arguments")}} Variable innerhalb einer Funktion ist ein Beispiel für ein Array-ähnliches Objekte.

+ +
function list() {
+  return Array.prototype.slice.call(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+ +

Das Binden von Methoden funktioniert mit der .call Funktion von {{jsxref("Function.prototype")}} und der Aufruf kann reduziert werden zu [].slice.call(arguments) anstatt Array.prototype.slice.call. Mit der {{jsxref("Function.prototype.bind", "bind")}} Funktion kann der Aufruf immer vereinfacht werden.

+ +
var unboundSlice = Array.prototype.slice;
+var slice = Function.prototype.call.bind(unboundSlice);
+
+function list() {
+  return slice(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+ +

Cross-Browser-Verhalten

+ +

Obwohl host Objekte (wie das DOM Objekt) laut Spezifikation nicht dem Mozilla Verhalten beim Konvertieren mit Array.prototype.slice folgen muss und IE < 9 dies auch nicht tut, erlauben Versionen ab IE 9 dieses. “shimming” kann eine sicheres cross-browser Verhalten ermöglichen. So lange andere moderne Browser weiterhin dieses Verhalten unterstützen, sowie zur Zeit IE, Mozilla, Chrome, Safari und Opera es tun, werden Entwickler beim Lesen von (DOM unterstützendem) slice Code, basierend auf diesem Schema, von der Semantik nicht in die Irre geführt.Sie können mit Sicherheit auf die Semantik vertrauen um das de facto Standard Verhalten sicherzustellen. (Dieser shim ermöglicht es auch, dass IE mit dem zweiten Argument von slice() ein explizites {{jsxref("null")}}/{{jsxref("undefined")}}) als Wert verwendet. Bei älteren Versionen des IE war dies nicht erlaubt, jedoch funktioniert es bei allen modernen Browsern inklusive IE >= 9.)

+ +
/**
+ * Shim for "fixing" IE's lack of support (IE < 9) for applying slice
+ * on host objects like NamedNodeMap, NodeList, and HTMLCollection
+ * (technically, since host objects have been implementation-dependent,
+ * at least before ES6, IE hasn't needed to work this way).
+ * Also works on strings, fixes IE < 9 to allow an explicit undefined
+ * for the 2nd argument (as in Firefox), and prevents errors when
+ * called on other DOM objects.
+ */
+(function () {
+  'use strict';
+  var _slice = Array.prototype.slice;
+
+  try {
+    // Can't be used with DOM elements in IE < 9
+    _slice.call(document.documentElement);
+  } catch (e) { // Fails in IE < 9
+    // This will work for genuine arrays, array-like objects,
+    // NamedNodeMap (attributes, entities, notations),
+    // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes),
+    // and will not fail on other DOM objects (as do DOM elements in IE < 9)
+    Array.prototype.slice = function(begin, end) {
+      // IE < 9 gets unhappy with an undefined end argument
+      end = (typeof end !== 'undefined') ? end : this.length;
+
+      // For native Array objects, we use the native slice function
+      if (Object.prototype.toString.call(this) === '[object Array]'){
+        return _slice.call(this, begin, end);
+      }
+
+      // For array like object we handle it ourselves.
+      var i, cloned = [],
+        size, len = this.length;
+
+      // Handle negative value for "begin"
+      var start = begin || 0;
+      start = (start >= 0) ? start : Math.max(0, len + start);
+
+      // Handle negative value for "end"
+      var upTo = (typeof end == 'number') ? Math.min(end, len) : len;
+      if (end < 0) {
+        upTo = len + end;
+      }
+
+      // Actual expected size of the slice
+      size = upTo - start;
+
+      if (size > 0) {
+        cloned = new Array(size);
+        if (this.charAt) {
+          for (i = 0; i < size; i++) {
+            cloned[i] = this.charAt(start + i);
+          }
+        } else {
+          for (i = 0; i < size; i++) {
+            cloned[i] = this[start + i];
+          }
+        }
+      }
+
+      return cloned;
+    };
+  }
+}());
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.slice', 'Array.prototype.slice')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.slice', 'Array.prototype.slice')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.slice")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/some/index.html b/files/de/web/javascript/reference/global_objects/array/some/index.html new file mode 100644 index 0000000000..0fe959b0d7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/some/index.html @@ -0,0 +1,209 @@ +--- +title: Array.prototype.some() +slug: Web/JavaScript/Reference/Global_Objects/Array/some +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/some +--- +
{{JSRef}}
+ +

Die Methode some() überprüft ob mindestens ein Element des Arrays den als Funktion übergebenen Kriterien entspricht.

+ +
+

Hinweis: Diese Methode gibt false für jede Bedingung auf einem leeren Array zurück.

+
+ +
{{EmbedInteractiveExample("pages/js/array-some.html")}}
+ + + +

Syntax

+ +
arr.some(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion die jedes Element überprüft, nimmt drei Argumente entgegen: +
+
currentValue
+
Das aktuell zu verarbeitende Element des Arrays.
+
index{{Optional_inline}}
+
Der Index des aktuell zu verarbeitenden Elementes im Array.
+
array{{Optional_inline}}
+
Die Arrayinstanz auf welcher die some() Methode aufgerufen wurde.
+
+
+
thisArg{{Optional_inline}}
+
Wert der über das this Schüsselwort innerhalb von callback verfügbar ist.
+
+ +

Rückgabewert

+ +

true wenn die callback Methode ein positives ({{Glossary("truthy")}}) Ergebnis für eines der Elemente im array ermittelt hat; Andernfalls, false.

+ +

Beschreibung

+ +

some() führt die callback Funktion einmal für jedes Element innerhalb des Arrays aus, bis ein Element gefunden wird, bei dem callback einen truthy Wert (ein Wert der durch die Konvertierung zu boolean true ergibt) zurückgibt. Wird ein solches Element gefunden, gibt some() sofort true zurück. callback wird nur für Elemente des Arrays ausgeführt, die einen zugewiesenen Wert haben; Für undefinierte oder gelöschte Elemente des Arrays wird callback nicht ausgeführt.

+ +

callback wird mit drei Argumenten aufgerufen: Dem Wert des Elementes, dem Index des Elementes und dem zugrundeliegenden Array.

+ +

WIrd ein thisArg Parameter an die some() Methode übergeben, wird dieser als this bei der callback Funtion benutzt. Andernfalls wird der Wert {{jsxref("undefined")}} als this benutzt. Der tatsächliche Wert von this wird entsprechend der generellen Regeln zur Belegung des this Schlüsselwortes innerhalb von Funktionen gesetzt.

+ +

some() verändert nicht das Array auf dem die Methode aufgerufen wurde.

+ +

Die von some() zu verarbeitenden Elemente werden vor dem ersten Aufruf von callback ermittelt. Elemente, die nach dem Aufruf von some() zum Array hinzugefügt werden, werden nicht mit callback aufgerufen. Wird ein noch nicht besuchtes Element des Arrays durch callback geändert, wird sein Wert, der an callback übermittelt wird, der Wert zu dem Zeitpunkt, zu dem some() den Index besucht, sein. Wird ein Element aus dem Array gelöscht, wird es nicht betrachtet.

+ +

Beispiele

+ +

Werte eines Arrays überprüfen

+ +

Die folgenden Beispiele prüfen ob es ein Element größer als 10 im Array gibt.

+ +
function isBiggerThan10(element, index, array) {
+  return element > 10;
+}
+
+[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
+[12, 5, 8, 1, 4].some(isBiggerThan10); // true
+
+ +

Werte eines Arrays mit arrow functions überprüfen

+ +

Arrow Funktionen ermöglichen eine kürzere Schreibweise für die gleiche Logik.

+ +
[2, 5, 8, 1, 4].some(x => x > 10);  // false
+[12, 5, 8, 1, 4].some(x => x > 10); // true
+
+ +

Prüfen ob ein Element in einem Array existiert

+ +

Um die Methode  includes() nachzuahmen, gibt  die folgende Funktion true zurück, wenn das Element im Array existiert:

+ +
var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(function(arrVal) {
+    return val === arrVal;
+  });
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true
+ +

Prüfen ob ein Element in einem Array existiert mit einer arrow function

+ +
var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(arrVal => val === arrVal);
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true
+ +

Jeden Wert in einen boolschen Wert konvertieren

+ +
var TRUTHY_VALUES = [true, 'true', 1];
+
+function getBoolean(a) {
+  'use strict';
+
+  var value = a;
+
+  if (typeof value === 'string') {
+    value = value.toLowerCase().trim();
+  }
+
+  return TRUTHY_VALUES.some(function(t) {
+    return t === value;
+  });
+}
+
+getBoolean(false);   // false
+getBoolean('false'); // false
+getBoolean(1);       // true
+getBoolean('true');  // true
+ +

Polyfill

+ +

some() wurde im Rahmen des ECMA-262 Standards in der 5. Edition hinzugefügt. Daher kann es sein, dass es nicht in allen Implementierungen des Standards enthalten ist. Diese Problem kann behoben werden, indem folgenden Quelltext vor Ihren Skripten eingefügt wird, wodurch Sie die some() Methode in Ihrem Programmcode verwenden können. Die nachfolgende Implementierung ist eine exakte Abdeckung der ECMA-262 Spezifikation in der 5. Edition, basierend auf der Annahme dass {{jsxref("Object")}} und {{jsxref("TypeError")}} Originalwerte aufweisen und dass fun.call den Originalwert von {{jsxref("Function.prototype.call()")}} liefert.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.17
+// Reference: http://es5.github.io/#x15.4.4.17
+if (!Array.prototype.some) {
+  Array.prototype.some = function(fun/*, thisArg*/) {
+    'use strict';
+
+    if (this == null) {
+      throw new TypeError('Array.prototype.some called on null or undefined');
+    }
+
+    if (typeof fun !== 'function') {
+      throw new TypeError();
+    }
+
+    var t = Object(this);
+    var len = t.length >>> 0;
+
+    var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
+    for (var i = 0; i < len; i++) {
+      if (i in t && fun.call(thisArg, t[i], i, t)) {
+        return true;
+      }
+    }
+
+    return false;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.17', 'Array.prototype.some')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.some', 'Array.prototype.some')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.some', 'Array.prototype.some')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.some")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/sort/index.html b/files/de/web/javascript/reference/global_objects/array/sort/index.html new file mode 100644 index 0000000000..a59d8ff2c6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/sort/index.html @@ -0,0 +1,264 @@ +--- +title: Array.prototype.sort() +slug: Web/JavaScript/Reference/Global_Objects/Array/sort +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort +--- +
{{JSRef}}
+ +

Die sort() Methode sortiert die Elemente eines Arrays {{interwiki("wikipedia","in-place")}} und gibt das Array zurück. Standardmäßig werden alle Elemente in Strings umgewandelt und dann anhand ihrer UTF-16 Codepoints miteinander verglichen.

+ +

Die Zeit- und Speicherkomplexität des Sortierens kann nicht garantiert werden, weil sie implementierungsabhängig ist.

+ +
{{EmbedInteractiveExample("pages/js/array-sort.html")}}
+ + + +

Syntax

+ +
arr.sort([compareFunction])
+
+ +

Parameter

+ +
+
compareFunction {{optional_inline}}
+
Gibt eine Funktion an, die die Sortierreihenfolge definiert. Wenn nicht angegeben, wird das Array nach dem Unicode-Codepoint jedes Zeichens entsprechend der Stringumwandlung jedes Elements sortiert. +
+
firstEl
+
Das erste Element zum Vergleich.
+
secondEl
+
Das zweite Element zum Vergleich.
+
+
+
+ +

Rückgabewert

+ +

Das sortierte Array. Beachten Sie, dass das Array {{interwiki("wikipedia","in-place")}} sortiert und keine Kopie angelegt wird.

+ +

Beschreibung

+ +

Wenn compareFunction nicht angegeben wird, werden alle Arrayelemente, die nicht undefined sind, sortiert indem sie in Strings konvertiert werden und in UTF-16-Code-Unit-Reihenfolge verglichen werden. Zum Beispiel steht "banana" vor "cherry". Bei einer numerischen Sortierung kommt 9 vor 80, aber weil Zahlen in Strings konvertiert werden, kommt "80" in Unicode vor "9". Alle Elemente die undefined sind werden ans Ende des Arrays sortiert.

+ +
+

Hinweis: In UTF-16 werden Unicode-Zeichen über \uFFFF als zwei Ersatzcodeeinheiten im Bereich \uD800 - \ uDFFF codiert. Der Wert jeder Codeeinheit wird für den Vergleich gesondert berücksichtigt. Daher wird das durch das Ersatzpaar \uD655 \uDE55 gebildete Zeichen vor dem Zeichen \uFF3A sortiert.

+
+ +

Wenn compareFunction angegeben wird, werden alle Arrayelemente, die nicht undefined sind, nach dem Rückgabewert der Vergleichsfunktion sortiert (alle Elemente die undefined sind werden ans Ende des Arrays sortiert, ohne Aufruf von compareFunction). Wenn a und b zwei zu vergleichende Elemente sind, gilt Folgendes:

+ + + +

Die Vergleichsfunktion hat die Form:

+ +
function compare(a, b) {
+  if (a ist kleiner als b anhand von Sortierkriterien) {
+    return -1;
+  }
+  if (a ist größer als b anhand der Sortierkriterien) {
+    return 1;
+  }
+  // a muss gleich b sein
+  return 0;
+}
+
+ +

Um Nummern anstatt Strings zu vergleichen, kann die Vergleichsfunktion einfach b von a subtrahieren. Die folgende Funktion sortiert ein Array aufsteigend (sofern kein Infinity und NaN enthalten):

+ +
function compareNumbers(a, b) {
+  return a - b;
+}
+
+ +

Die sort Methode kann bequem mit {{jsxref("Operators/function", "Funktionsausdrücken", "", 1)}} benutzt werden:

+ +
var numbers = [4, 2, 5, 1, 3];
+numbers.sort(function(a, b) {
+  return a - b;
+});
+console.log(numbers);
+
+// [1, 2, 3, 4, 5]
+
+ +

ES2015 bietet {{jsxref("Functions/Arrow_functions", "Pfeilfunktionen", "", 1)}} mit noch kürzerer Syntax.

+ +
let numbers = [4, 2, 5, 1, 3];
+numbers.sort((a, b) => a - b);
+console.log(numbers);
+
+// [1, 2, 3, 4, 5]
+ +

Objekte können anhand der Werte eines ihrer Eigenschaften sortiert werden.

+ +
var items = [
+  { name: 'Edward', value: 21 },
+  { name: 'Sharpe', value: 37 },
+  { name: 'And', value: 45 },
+  { name: 'The', value: -12 },
+  { name: 'Magnetic', value: 13 },
+  { name: 'Zeros', value: 37 }
+];
+
+// Sortieren nach Wert
+items.sort(function (a, b) {
+  return a.value - b.value;
+});
+
+// Sortieren nach Wert
+items.sort(function(a, b) {
+  var nameA = a.name.toUpperCase(); // Groß-/Kleinschreibung ignorieren
+  var nameB = b.name.toUpperCase(); // Groß-/Kleinschreibung ignorieren
+  if (nameA < nameB) {
+    return -1;
+  }
+  if (nameA > nameB) {
+    return 1;
+  }
+
+  // Namen müssen gleich sein
+  return 0;
+});
+ +

Beispiele

+ +

Erstellen, Anzeigen und Sortieren eines Arrays

+ +

Im folgenden Beispiel werden vier Arrays erstellt, das ursprüngliche Array angezeigt, danach die sortierten Arrays. Die numerischen Arrays werden erst ohne, dann mit Vergleichsfunktion sortiert.

+ +
var stringArray = ['Blue', 'Humpback', 'Beluga'];
+var numericStringArray = ['80', '9', '700'];
+var numberArray = [40, 1, 5, 200];
+var mixedNumericArray = ['80', '9', '700', 40, 1, 5, 200];
+
+function compareNumbers(a, b) {
+  return a - b;
+}
+
+console.log('stringArray:', stringArray.join());
+console.log('Sorted:', stringArray.sort());
+
+console.log('numberArray:', numberArray.join());
+console.log('Sorted without a compare function:', numberArray.sort());
+console.log('Sorted with compareNumbers:', numberArray.sort(compareNumbers));
+
+console.log('numericStringArray:', numericStringArray.join());
+console.log('Sorted without a compare function:', numericStringArray.sort());
+console.log('Sorted with compareNumbers:', numericStringArray.sort(compareNumbers));
+
+console.log('mixedNumericArray:', mixedNumericArray.join());
+console.log('Sorted without a compare function:', mixedNumericArray.sort());
+console.log('Sorted with compareNumbers:', mixedNumericArray.sort(compareNumbers));
+ +

Dieses Beispiel erzeugt die folgende Ausgabe. Wie die Ausgabe zeigt, werden Zahlen bei Verwendung einer Vergleichsfunktion korrekt sortiert, ob es sich um Zahlen oder numerische Strings handelt.

+ +
stringArray: Blue,Humpback,Beluga
+Sorted: Beluga,Blue,Humpback
+
+numberArray: 40,1,5,200
+Sorted without a compare function: 1,200,40,5
+Sorted with compareNumbers: 1,5,40,200
+
+numericStringArray: 80,9,700
+Sorted without a compare function: 700,80,9
+Sorted with compareNumbers: 9,80,700
+
+mixedNumericArray: 80,9,700,40,1,5,200
+Sorted without a compare function: 1,200,40,5,700,80,9
+Sorted with compareNumbers: 1,5,9,40,80,200,700
+ +

Sortierung von nicht-ASCII Zeichen

+ +

Zum Sortieren von Strings mit Nicht-ASCII-Zeichen, d. h. Zeichenfolgen mit Akzentzeichen (e, é, è, a, ä, etc.), Zeichenfolgen aus anderen Sprachen als Englisch: Verwenden Sie {{jsxref("String.localeCompare")}}. Diese Funktion kann diese Zeichen vergleichen, damit sie in der richtigen Reihenfolge angezeigt werden.

+ +
var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
+items.sort(function (a, b) {
+  return a.localeCompare(b);
+});
+
+// items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
+ +

Sortieren mit map()

+ +

Die compareFunction kann mehrmals pro Element innerhalb des Arrays aufgerufen werden. Abhängig von der Beschaffenheit von compareFunction kann dies zu einem hohen Overhead führen. Je mehr Arbeit eine compareFunction erledigt und je mehr Elemente zu sortieren sind, desto sinnvoller ist es die Verwendung von {{jsxref("Array.prototype.map()", "map()")}} zum Sortieren in Betracht zu ziehen. Die Idee ist, das Array einmal zu durchlaufen, um die tatsächlichen Werte für das Sortieren in ein temporäres Array zu extrahieren, das temporäre Array zu sortieren und dann das temporäre Array zu durchlaufen, um die richtige Reihenfolge zu erreichen.

+ +
// Das zu sortierende Array
+var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];
+
+// Temporäres Array enthält Objekte mit Position und Sortierwert
+var mapped = list.map(function(el, i) {
+  return { index: i, value: el.toLowerCase() };
+})
+
+// Sortieren des gemappten Arrays mit den reduzierten Werten
+mapped.sort(function(a, b) {
+  if (a.value > b.value) {
+    return 1;
+  }
+  if (a.value < b.value) {
+    return -1;
+  }
+  return 0;
+});
+
+// Behälter für die sich ergebende Reihenfolge
+var result = mapped.map(function(el){
+  return list[el.index];
+});
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition
{{SpecName('ES5.1', '#sec-15.4.4.11', 'Array.prototype.sort')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.sort', 'Array.prototype.sort')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.sort', 'Array.prototype.sort')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.sort")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/splice/index.html b/files/de/web/javascript/reference/global_objects/array/splice/index.html new file mode 100644 index 0000000000..f77aab6bb1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/splice/index.html @@ -0,0 +1,162 @@ +--- +title: Array.prototype.splice() +slug: Web/JavaScript/Reference/Global_Objects/Array/splice +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice +--- +
{{JSRef}}
+ +

Die splice() Methode ändert den Inhalt eines Arrays durch das Entfernen vorhandener Elemente und/oder Hinzufügen neuer Elemente.

+ +
{{EmbedInteractiveExample("pages/js/array-splice.html")}}
+ +

Syntax

+ +
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
+
+ +

Parameter

+ +
+
start
+
Index ab welchem das Array geändert werden soll. Falls start größer als die Länge des Arrays ist, wird start auf die Länge des Arrays gesetzt.
+
Falls start negativ ist, beginnt die Änderung entsprechend viele Stellen rückwärts vom Ende des Arrays (d.h. hat start den Wert -n ist dies gleichbedeutend mit array.length - n) und wird auf 0 gesetzt wenn der absolute Wert von start größer als die Länge des Arrays ist.
+
deleteCount {{optional_inline}}
+
Gibt die Anzahl der zu entfernenden alten Array Elemente an.
+
Wenn deleteCount weggelassen wird oder wenn der Wert größer oder gleich array.length - start ist (d. h. wenn der Wert größer oder gleich der Anzahl der von start aus verbleibenden Elemente ist), wird das ganze Array ab dem Index start gelöscht.
+
Wenn deleteCount 0 oder negativ ist, werden keine Elemente entfernt. In diesem Fall sollte man mindestens ein neues Element als weiteren Parameter übergeben, da das Array sonst nicht geändert wird.
+
item1, item2, ... {{optional_inline}}
+
Die Elemente, die dem Array ab dem Index start hinzugefügt werden sollen. Falls keine Elemente angegeben werden, entfernt splice lediglich Elemente des Arrays.
+
+ +

Rückgabewert

+ +

Ein Array, welches die entfernten Elemente enthält. Wenn nur ein Element entfernt wurde, wird ein Array mit nur einem Element zurückgegeben. Wenn kein Element entfernt wurde, wird ein leeres Array zurückgegeben.

+ +

Beschreibung

+ +

Wenn die Anzahl der neu hinzugefügten Elemente ungleich der Anzahl der entfernten Elemente ist, wird die Länge des Arrays geändert. Bei gleicher Anzahl werden vorhandene Elemente sozusagen ersetzt.

+ +

Beispiele

+ +

Entfernen von 0 (null) Elementen bei Index 2 und Einfügen von "drum"

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2, 0, 'drum');
+
+// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]
+// removed is [], no elements removed
+ +

Entfernen von o (null) Elementen bei Index 2 und Einfügen von "drum" und "guitar"

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2, 0, 'drum', 'guitar');
+
+// myFish is ["angel", "clown", "drum", "guitar", "mandarin", "sturgeon"]
+// removed is [], no elements removed
+ +

Entfernen von 1 Element bei Index 3

+ + + +
var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(3, 1);
+
+// removed is ["mandarin"]
+// myFish is ["angel", "clown", "drum", "sturgeon"]
+ + + +

Entfernen von 1 Element bei Index 2 und Einfügen von "trumpet"

+ +
var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
+var removed = myFish.splice(2, 1, 'trumpet');
+
+// myFish is ["angel", "clown", "trumpet", "sturgeon"]
+// removed is ["drum"]
+
+ +

Entfernen von 2 Elementen bei Index 0 und Einfügen von "parrot", "anemone" und "blue"

+ +
var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
+
+// myFish is ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
+// removed is ["angel", "clown"]
+ +

Entfernen von 2 Elementen vom Index 2

+ +
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(myFish.length - 3, 2);
+
+// myFish is ["parrot", "anemone", "sturgeon"]
+// removed is ["blue", "trumpet"]
+ +

Entfernen von einem Element bei Index -2

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(-2, 1);
+
+// myFish is ["angel", "clown", "sturgeon"]
+// removed is ["mandarin"]
+ +

Entfernen von allen Elementen nach Index 2 (inklusiv)

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2);
+
+// myFish is ["angel", "clown"]
+// removed is ["mandarin", "sturgeon"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommenter
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.splice")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html b/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html new file mode 100644 index 0000000000..ef5c1883b5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html @@ -0,0 +1,183 @@ +--- +title: Array.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +tags: + - Array + - Internationalization + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +--- +
{{JSRef}}
+ +

Die Methode toLocaleString() gibt als Rückgabewert einen String zurück, welcher die Elemente des Arrays darstellt. Die Array-Elemente werden mittels ihrer toLocaleString Methode in Strings umgewandelt und durch einen sprachspezifischen String (wie zum Beispiel ein Kommazeichen “,”) separiert.

+ +
{{EmbedInteractiveExample("pages/js/array-tolocalestring.html")}}
+ +

Syntax

+ +
arr.toLocaleString([locales [, options]]);
+
+ +

Parameter

+ +
+
locales {{optional_inline}}
+
Ein String mit einem Language-Tag nach BCP 47 oder ein Array solcher Strings. Für die allgemeine Art und Interpretation des locales Parameters, siehe Seite {{jsxref("Intl")}}.
+
options {{optional_inline}}
+
Ein Objekt mit konfigurierbaren Eigenschaften, für Numbers siehe {{jsxref("Number.prototype.toLocaleString()")}}, und für Datumsangaben siehe {{jsxref("Date.prototype.toLocaleString()")}}.
+
+ +

Rückgabewert

+ +

Ein einzelner String der die Elemente des Arrays darstellt.

+ +

Beispiele

+ +

Verwendung von locales und options

+ +

Die Elemente des Arrays werden mittels der toLocaleString Methode in einen String umgewandelt.

+ + + +

Jedem Strings und Numbers Element im Array prices die Währung zuordnen:

+ +
var prices = ['¥7', 500, 8123, 12];
+prices.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' });
+
+// "¥7,¥500,¥8,123,¥12"
+
+ +

Für weitere Beispiele, siehe auch {{jsxref("Global_Objects/Intl","Intl")}}, {{jsxref("Global_Objects/NumberFormat","NumberFormat")}} und {{jsxref("Global_Objects/DateTimeFormat","DateTimeFormat")}}.

+ +

Polyfill

+ +
// https://tc39.github.io/ecma402/#sup-array.prototype.tolocalestring
+if (!Array.prototype.toLocaleString) {
+  Object.defineProperty(Array.prototype, 'toLocaleString', {
+    value: function(locales, options) {
+      // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var a = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(A, "length")).
+      var len = a.length >>> 0;
+
+      // 3. Let separator be the String value for the
+      //    list-separator String appropriate for the
+      //    host environment's current locale (this is
+      //    derived in an implementation-defined way).
+      // NOTE: In this case, we will use a comma
+      var separator = ',';
+
+      // 4. If len is zero, return the empty String.
+      if (len === 0) {
+        return '';
+      }
+
+      // 5. Let firstElement be ? Get(A, "0").
+      var firstElement = a[0];
+      // 6. If firstElement is undefined or null, then
+      //  a.Let R be the empty String.
+      // 7. Else,
+      //  a. Let R be ?
+      //     ToString(?
+      //       Invoke(
+      //        firstElement,
+      //        "toLocaleString",
+      //        « locales, options »
+      //       )
+      //     )
+      var r = firstElement == null ?
+        '' : firstElement.toLocaleString(locales, options);
+
+      // 8. Let k be 1.
+      var k = 1;
+
+      // 9. Repeat, while k < len
+      while (k < len) {
+        // a. Let S be a String value produced by
+        //   concatenating R and separator.
+        var s = r + separator;
+
+        // b. Let nextElement be ? Get(A, ToString(k)).
+        var nextElement = a[k];
+
+        // c. If nextElement is undefined or null, then
+        //   i. Let R be the empty String.
+        // d. Else,
+        //   i. Let R be ?
+        //     ToString(?
+        //       Invoke(
+        //        nextElement,
+        //        "toLocaleString",
+        //        « locales, options »
+        //       )
+        //     )
+        r = nextElement == null ?
+          '' : nextElement.toLocaleString(locales, options);
+
+        // e. Let R be a String value produced by
+        //   concatenating S and R.
+        r = s + r;
+
+        // f. Increase k by 1.
+        k++;
+      }
+
+      // 10. Return R.
+      return r;
+    }
+  });
+}
+
+ +

Für die Unterstützung von veralteten JavaScript Engines, die Object.defineProperty nicht kennen, sollte kein Polyfill für Array.prototype Methoden eingesetzt werden, da sie auf diese Weise nicht mehr nicht-durchzählbar gemacht werden können.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}{{Spec2('ESDraft')}}Initiale Definition war in ECMAScript 3.
{{SpecName('ES Int Draft', '#sup-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}{{Spec2('ES Int Draft')}}Diese Definition ersetzt die Definition aus ECMA-262.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toLocaleString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tosource/index.html b/files/de/web/javascript/reference/global_objects/array/tosource/index.html new file mode 100644 index 0000000000..0e7dd02745 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tosource/index.html @@ -0,0 +1,69 @@ +--- +title: Array.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Array/toSource +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode gibt einen String zurück, welcher den Quelltext des Arrays repräsentiert.

+ +

Syntax

+ +
arr.toSource()
+ +

Rückgabewert

+ +

Ein String, der den Quelltext des Array repräsentiert.

+ +

Beschreibung

+ +

Die toSource Methode gibt folgende Werte zurück:

+ + + +

Diese Methode wird für gewöhnlich von JavaScript intern aufgerufen und nicht explizit in einem QUelltext. Man kann toSource beim Debuggen aufrufen, um den Inhalt eines Arrays abzufragen.

+ +

Beispiele

+ +

Untersuchen des Quelltextes eines Arrays

+ +

Um den Quellcode eines Arrays zu untersuchen:

+ +
var alpha = new Array('a', 'b', 'c');
+
+alpha.toSource();
+//returns ['a', 'b', 'c']
+
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toSource")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tostring/index.html b/files/de/web/javascript/reference/global_objects/array/tostring/index.html new file mode 100644 index 0000000000..0d8d1da3e6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tostring/index.html @@ -0,0 +1,80 @@ +--- +title: Array.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toString +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toString +--- +
{{JSRef}}
+ +

Die toString() Methode gibt einen String zurück, der das Array und seine Elemente repräsentiert.

+ +

{{EmbedInteractiveExample("pages/js/array-tostring.html")}}

+ +

Syntax

+ +
arr.toString()
+ +

Rückgabewert

+ +

Ein String, der die Elemente des Arrays repräsentiert.

+ +

Beschreibung

+ +

Das {{jsxref("Array")}} Objekt überschreibt die toString Methode von {{jsxref("Object")}}. Für Arrayobjekte fügt die toString Methode das Array zu einem String zusammen, der jedes Element des Arrayelemente durch Kommata getrennt enthält.

+ +

JavaScript ruft die toString Methode automatisch auf wenn ein Array als Text repräsentiert wird oder wenn ein Array in einer Stringkonkatenation verwendet wird.

+ +

ECMAScript 5 Semantik

+ +

Beginnend mt JavaScript 1.8.5 (Firefox 4), und mit der Semantik des ECMAScript der 5. Edition, ist die toString() Methode generisch und kann mit jeglichen Objekten verwendet werden. {{jsxref("Object.prototype.toString()")}} wird aufgerufen und der resultierende Wert wird zurückgegeben.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.2', 'Array.prototype.toString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/unobserve/index.html b/files/de/web/javascript/reference/global_objects/array/unobserve/index.html new file mode 100644 index 0000000000..fd31177c3a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/unobserve/index.html @@ -0,0 +1,88 @@ +--- +title: Array.unobserve() +slug: Web/JavaScript/Reference/Global_Objects/Array/unobserve +tags: + - Array + - JavaScript + - Method + - Obsolete +translation_of: Archive/Web/JavaScript/Array.unobserve +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Array.unobserve() Methode wird eingesetzt um Observers die mit {{jsxref("Array.observe()")}} eingestellt wurden zu entfernen, jedoch ist dieses veraltet und wurde schon von Browsern entfernt. Man kann einen allgemeineres {{jsxref("Proxy")}} Objekt benutzen.

+ +

Syntax

+ +
Array.unobserve(arr, callback)
+ +

Parameter

+ +
+
arr
+
Das Array, welches nicht mehr Überwacht werden soll.
+
callback
+
Die Referenz zu dem Observer, die mit der Überwachung von Änderungen auf dem Array arr aufhören soll.
+
+ +

Beschreibung

+ +

Array.unobserve() sollt nach {{jsxref("Array.observe()")}} aufgerufen werden, um einen Observer von einem Array zu entfernen.

+ +

callback sollte eine Referenz auf eine Funktion sein und nicht einen anonyme Funktion sein, weil diese Referenz genutzt wird um den Observer zu entfernen. Es ist nicht zulässig Array.unobserve() mit einer anonymen Funktion aufzurufen, weil dadurch kein Observer entfernt wird.

+ +

Beispiele

+ +

Observer von Array entfernen

+ +
var arr = [1, 2, 3];
+
+var observer = function(changes) {
+  console.log(changes);
+}
+
+Array.observe(arr, observer);
+​
+arr.push(4);
+// [{type: "splice", object: <arr>, index: 3, removed:[], addedCount: 1}]
+
+Array.unobserve(arr, observer);
+
+arr.pop();
+// The callback wasn't called
+ +

Einsatz einer anonymen Funktion

+ +
var persons = ['Khalid', 'Ahmed', 'Mohammed'];
+
+Array.observe(persons, function (changes) {
+  console.log(changes);
+});
+
+persons.shift();
+// [{type: "splice", object: <arr>, index: 0, removed: [ "Khalid" ], addedCount: 0 }]
+
+Array.unobserve(persons, function (changes) {
+  console.log(changes);
+});
+
+persons.push('Abdullah');
+// [{type: "splice", object: <arr>, index: 2, removed: [], addedCount: 1 }]
+// The callback will always be called
+
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.unobserve")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/unshift/index.html b/files/de/web/javascript/reference/global_objects/array/unshift/index.html new file mode 100644 index 0000000000..2960b03cbb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/unshift/index.html @@ -0,0 +1,99 @@ +--- +title: Array.prototype.unshift() +slug: Web/JavaScript/Reference/Global_Objects/Array/unshift +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/unshift +--- +
{{JSRef}}
+ +

Die unshift() Methode fügt ein oder mehrere Elemente am Anfang eines Array hinzu und gibt die neue Länge des Arrays zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-unshift.html")}}
+ +

Syntax

+ +
arr.unshift(element1[, ...[, elementN]])
+ +

Parameter

+ +
+
elementN
+
Die Elemente die am Anfang des Arrays hinzugefügt werden sollen.
+
+ +

Rückgabewert

+ +

Die neue {{jsxref("Array.length", "length")}} Eigenschaft des Arrays auf dem die Methode aufgerufen wurde.

+ +

Beschreibung

+ +

Die unshift Methode fügt die gegeben Elemente am Anfang eines Arrays ähnlichen Objektes hinzu.

+ +

unshift ist extra generisch gehalten. Diese Methode kann mit {{jsxref("Function.call", "call", "", 1)}} oder {{jsxref("Function.apply", "apply", "", 1)}} auf einem Array ähnlichen Objekt angewendet werden. Objekte, die nicht über die Eigenschaft length verfügen, welche nicht das letzte in einer Reihe aufeinander folgenden, null-basierenden nummerische Werten repräsentieren, können sinnlose Ergebnisse liefern.

+ +

Beispiele

+ +
var arr = [1, 2];
+
+arr.unshift(0); // result of call is 3, the new array length
+// arr is [0, 1, 2]
+
+arr.unshift(-2, -1); // = 5
+// arr is [-2, -1, 0, 1, 2]
+
+arr.unshift([-3]);
+// arr is [[-3], -2, -1, 0, 1, 2]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.13', 'Array.prototype.unshift')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.unshift")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/values/index.html b/files/de/web/javascript/reference/global_objects/array/values/index.html new file mode 100644 index 0000000000..3736af04f8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/values/index.html @@ -0,0 +1,86 @@ +--- +title: Array.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Array/values +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/values +--- +
{{JSRef}}
+ +

Die values() Methode gibt ein neues Iterator Objekt des Arrays zurück, welches die Werte für jeden Eintrag im Array enthält.

+ +

{{EmbedInteractiveExample("pages/js/array-values.html")}}

+ +
var a = ['w', 'y', 'k', 'o', 'p'];
+var iterator = a.values();
+
+console.log(iterator.next().value); // w
+console.log(iterator.next().value); // y
+console.log(iterator.next().value); // k
+console.log(iterator.next().value); // o
+console.log(iterator.next().value); // p
+ +

Syntax

+ +
arr.values()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Iterator")}} Objekt von dem Array.

+ +

Beispiele

+ +

Benutzung der for...of loop

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var iterator = arr.values();
+
+for (let letter of iterator) {
+  console.log(letter);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.values', 'Array.prototype.values')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.values', 'Array.prototype.values')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.values")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/@@species/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/@@species/index.html new file mode 100644 index 0000000000..896576bf2e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/@@species/index.html @@ -0,0 +1,72 @@ +--- +title: 'get ArrayBuffer[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species +tags: + - ArrayBuffer + - JavaScript + - Property + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species +--- +
{{JSRef}}
+ +

Die ArrayBuffer[@@species] Zugriffseigenschaft gibt den Konstruktor des ArrayBuffer zurück.

+ +

Syntax

+ +
ArrayBuffer[Symbol.species]
+
+ +

Beschreibung

+ +

Die species Zugriffseigenschaft gibt den Standard-Konstruktor für ArrayBuffer Objekte zurück. Konstruktoren von Unterklassen überschreiben dieses, um die Konstruktorzuweisung zu ändern.

+ +

Beispiele

+ +

Die species Eigenschaft gibt die Standard-Konstruktorfunktion zurück, welche der ArrayBuffer Konstruktor für ArrayBuffer Objekte ist:

+ +
ArrayBuffer[Symbol.species]; // function ArrayBuffer()
+ +

In einem abgeleiteten Collection Objket (z. B. ein benutzerdefinierter Buffer MyArrayBuffer), ist der MyArrayBuffer species der MyArrayBuffer Konstruktor. Immer, wenn dieser überschrieben werden soll, um zum Beispiel das Eltern ArrayBuffer Objekt in der abgeleiteten Klassenmethode zurückzugeben:

+ +
class MyArrayBuffer extends ArrayBuffer {
+  // Overwrite MyArrayBuffer species to the parent ArrayBuffer constructor
+  static get [Symbol.species]() { return ArrayBuffer; }
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.ArrayBuffer.@@species")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html new file mode 100644 index 0000000000..aa346bcba5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html @@ -0,0 +1,70 @@ +--- +title: ArrayBuffer.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength +tags: + - ArrayBuffer + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength +--- +
{{JSRef}}
+ +

Die byteLength Zugriffseigenschaft repräsentiert die Länge eines {{jsxref("ArrayBuffer")}} in Bytes.

+ +
{{EmbedInteractiveExample("pages/js/arraybuffer-bytelength.html")}}
+ + + +

Syntax

+ +
arraybuffer.byteLength
+ +

Beschreibung

+ +

Die byteLength Eigenschaft ist eine Zugriffseigenschaft, wessen set-Funktion undefined ist, was bedeutet, dass diese nur gelesen werden kann. Der Wert wird ermittelt, wenn das Array erstellt wird und kann nicht geändert werden. Diese Eigenschaft gibt 0 zurück, wenn der ArrayBuffer detached ist.

+ +

Beispiele

+ +
var buffer = new ArrayBuffer(8);
+buffer.byteLength; // 8
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}{{Spec2('ES2015')}}Initiale Definition im ECMA Standard.
{{SpecName('ESDraft', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer.byteLength")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/index.html new file mode 100644 index 0000000000..a8de24aac7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/index.html @@ -0,0 +1,144 @@ +--- +title: ArrayBuffer +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +tags: + - ArrayBuffer + - Constructor + - JavaScript + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +--- +
{{JSRef}}
+ +

Das ArrayBuffer Objekt repräsentiert einen generischen Buffer mit fester Länge. Der Inhalt eines ArrayBuffers kann nicht direkt bearbeitet werden; stattdessen wird eines der typisierten Array-Objekte oder ein {{jsxref("DataView")}} Objekt verwendet, welches den Buffer in einem bestimmten Format repräsentiert und von welchem aus sein Inhalt bearbeitet werden kann.

+ +
{{EmbedInteractiveExample("pages/js/arraybuffer-constructor.html")}}
+ + + +

Syntax

+ +
new ArrayBuffer(length)
+
+ +

Parameter

+ +
+
length
+
Die Größe, in Bytes, des zu erstellenden ArrayBuffer.
+
+ +

Rückgabewert

+ +

Ein neues ArrayBuffer Objekt der angegebenen Länge. Der Inhalt wird auf 0 initialisiert.

+ +

Ausnahmen

+ +

Ein {{jsxref("RangeError")}} wird erhoben wenn die Länge größer als {{jsxref("Number.MAX_SAFE_INTEGER")}} (>= 2 ** 53) oder negativ ist.

+ +

Beschreibung

+ +

Der ArrayBuffer Konstruktor erstellt einen neuen ArrayBuffer der angegebenen Länge in Bytes.

+ +

Einen ArrayBuffer von existierenden Daten erstellen

+ + + +

Eigenschaften

+ +
+
ArrayBuffer.length
+
Der Wert des ArrayBuffer Konstruktors für die Länge.
+
{{jsxref("ArrayBuffer.@@species", "get ArrayBuffer[@@species]")}}
+
Die Konstruktor-Funktion um abgeleitete Objekte zu erstellen.
+
{{jsxref("ArrayBuffer.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zu allen ArrayBuffer Objekten.
+
+ +

Methoden

+ +
+
{{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}
+
Gibt true zurück wenn arg eines der Views des ArrayBuffers ist, wie zum Beispiel die typisierten Array-Objekte oder ein {{jsxref("DataView")}}. Ansonsten wird false zurückgegeben.
+
{{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}
+
+
Gibt einen neuen ArrayBuffer zurück, dessen Inhalt von den Daten des oldBuffers genommen wird und dann entweder abgeschnitten oder mit Null auf newByteLength erweitert wird.
+
+
+ +

Instanzen

+ +

Alle ArrayBuffer Instanzen erben von {{jsxref("ArrayBuffer.prototype")}}.

+ +

Eigenschaften

+ +

{{page('de/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Eigenschaften')}}

+ +

Methoden

+ +

{{page('de/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Methoden')}}

+ +
+
{{jsxref("ArrayBuffer.slice()")}} {{non-standard_inline}}
+
Hat die selbe Funktion wie {{jsxref("ArrayBuffer.prototype.slice()")}}.
+
+ +

Beispiel

+ +

In diesem Beispiel erstellen wir einen 8-byte Puffer mit einem {{jsxref("Global_Objects/Int32Array", "Int32Array")}} View, um auf den Puffer zu verweisen:

+ +
var buffer = new ArrayBuffer(8);
+var view   = new Int32Array(buffer);
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 6.
{{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}{{Spec2('ES6')}}Initiale Definition im ECMA Standard. Spezifiziert, dass new benötigt wird.
{{SpecName('ESDraft', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer")}}

+ +

Kompatibilitätshinweis

+ +

Seit ECMAScript 2015 müssen ArrayBuffer Konstruktor mit einem {{jsxref("Operators/new", "new")}} Operator konstruiert werden. Einen ArrayBuffer Konstruktor als Funktion aufzurufen ohne new ab sofort einen {{jsxref("TypeError")}} erheben.

+ +
var dv = ArrayBuffer(10);
+// TypeError: Einen eingebauten ArrayBuffer-Konstruktor
+// ohne new aufzurufen ist nicht erlaubt.
+ +
var dv = new ArrayBuffer(10);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/isview/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/isview/index.html new file mode 100644 index 0000000000..f00f471fb3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/isview/index.html @@ -0,0 +1,89 @@ +--- +title: ArrayBuffer.isView() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/isView +tags: + - ArrayBuffer + - JavaScript + - Method + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/isView +--- +
{{JSRef}}
+ +

Die ArrayBuffer.isView() Methode gibt true zurück, wenn arg eines der ArrayBuffer Views ist, so wie getyptes Array Objekte oder eine {{jsxref("DataView")}}; andernfalls false.

+ +
{{EmbedInteractiveExample("pages/js/arraybuffer-isview.html")}}
+ + + +

Syntax

+ +
ArrayBuffer.isView(arg)
+ +

Parameter

+ +
+
arg
+
Der Parameter, der überprüft wird.
+
+ +

Rückgabewert

+ +

true, wenn der gegebene Parameter ist einer der ArrayBuffer Views; andernfalls false.

+ +

Beispiele

+ +
ArrayBuffer.isView();                    // false
+ArrayBuffer.isView([]);                  // false
+ArrayBuffer.isView({});                  // false
+ArrayBuffer.isView(null);                // false
+ArrayBuffer.isView(undefined);           // false
+ArrayBuffer.isView(new ArrayBuffer(10)); // false
+
+ArrayBuffer.isView(new Uint8Array());    // true
+ArrayBuffer.isView(new Float32Array());  // true
+ArrayBuffer.isView(new Int8Array(10).subarray(0, 3)); // true
+
+var buffer = new ArrayBuffer(2);
+var dv = new DataView(buffer);
+ArrayBuffer.isView(dv); // true
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#sec-arraybuffer.isview', 'ArrayBuffer.isView')}}{{Spec2('ES2015')}}Initiale Definition im ECMA Standard.
{{SpecName('ESDraft', '#sec-arraybuffer.isview', 'ArrayBuffer.isView')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer.isView")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/prototype/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/prototype/index.html new file mode 100644 index 0000000000..b287e0712c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/prototype/index.html @@ -0,0 +1,68 @@ +--- +title: ArrayBuffer.prototype +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +tags: + - ArrayBuffer + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +--- +
{{JSRef}}
+ +

Die ArrayBuffer.prototype Eigenschaft repräsentiert den Prototyp für das {{jsxref("ArrayBuffer")}} Objekt.

+ +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

ArrayBuffer Instanzen erben von ArrayBuffer.prototype. Wie bei allen Konstruktoren, kann der Prototype des Konstruktorobjekts geändert werden, um Änderungen für alle ArrayBuffer Instanzen zu übernehmen.

+ +

Eigenschaften

+ +
+
ArrayBuffer.prototype.constructor
+
Spezifiziert die Funktion, die das Prototypeobjekt erstellt. Der Initialwert ist der eingebaute Standard-ArrayBuffer-Konstruktor.
+
{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}
+
Die größe, in Bytes, des Arrays. Dieser wird bei der Erstellung des Arrays ermittelt und kan nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("ArrayBuffer.prototype.slice()")}}
+
Gibt einen neuen ArrayBuffer zurück, welcher eine Kopie der Bytes des eigentlichen ArrayBuffer einthält. Die Kopie geht von begin (inklusiv) bis end (exclusiv). Wenn einer der Werte negativ ist, referenziert er auf den Index vom Ende des Arrays an und nicht vom Beginn des Arrays.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpzifikationStatusKommentar
{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer.prototype")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/slice/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/slice/index.html new file mode 100644 index 0000000000..f149d2322b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/slice/index.html @@ -0,0 +1,88 @@ +--- +title: ArrayBuffer.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice +tags: + - ArrayBuffer + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice +--- +
{{JSRef}}
+ +

Die slice() Methode gibt einen neuen ArrayBuffer zurück, wessen Inhalt eine Kopie der ArrayBuffer Bytes von begin (inklusiv) bis end (exklusiv) ist.

+ +
{{EmbedInteractiveExample("pages/js/arraybuffer-slice.html")}}
+ + + +

Syntax

+ +
arraybuffer.slice(begin[, end])
+ +

Parameter

+ +
+
begin
+
0-basierter Byteindex an welchem slice slice mit dem zuschneiden beginnt.
+
+ +
+
end
+
Byteindex bevor slice das zuschneiden beendet. Wenn end nicht angegeben ist, wird der neue ArrayBuffer alle Bytes von begin des ArrayBuffer enthalten. Der durch die Anfangs- und Endwerte angegebene Bereich wird an den gültigen Indexbereich für das aktuelle Array gebunden. Wenn die berechnete Länge des neuen ArrayBuffers negativ wäre, wird er auf 0 gesetzt.
+
+ +

Rückgabewert

+ +

Ein neues ArrayBuffer Objekt.

+ +

Beschreibung

+ +

Die slice Methode kopiert bis zum Byteindex end Parameter, der nicht enthalten ist. Wenn begin oder end negativ ist, referenziert dieser zum Index vom Ende der Array, im Gegensatz zum Anfang des Arrays

+ +

Beispiele

+ +

Einen ArrayBuffer kopieren

+ +
var buf1 = new ArrayBuffer(8);
+var buf2 = buf1.slice(0);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in EMCAScript 6.
{{SpecName('ES6', '#sec-arraybuffer.prototype.slice', 'ArrayBuffer.prototype.slice')}}{{Spec2('ES6')}}Initiale Definition im ECMA Standard.
{{SpecName('ESDraft', '#sec-arraybuffer.prototype.slice', 'ArrayBuffer.prototype.slice')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer.slice")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/arraybuffer/transfer/index.html b/files/de/web/javascript/reference/global_objects/arraybuffer/transfer/index.html new file mode 100644 index 0000000000..3004da98bf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/arraybuffer/transfer/index.html @@ -0,0 +1,84 @@ +--- +title: ArrayBuffer.transfer() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/transfer +tags: + - ArrayBuffer + - Experimental + - JavaScript + - Method + - Reference + - TypedArrays +translation_of: Archive/Web/JavaScript/ArrayBuffer.transfer +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die statische ArrayBuffer.transfer() Funktion gibt einen neuen ArrayBuffer mit dem Inhalt von oldBuffer. Je nachdem, wei die newByteLength gesetzt ist, werden die Daten abgeschnitten oder erweitert. Wenn newByteLength nicht gesetzt ist, wird die byteLength von oldBuffer benutzt. Diese Operation bringt oldBuffer in einen detached Status.

+ +

Syntax

+ +
ArrayBuffer.transfer(oldBuffer [, newByteLength]);
+ +

Parameter

+ +
+
oldBuffer
+
Ein {{jsxref("ArrayBuffer")}} Objekt von dem die Daten transferiert werden.
+
newByteLength
+
Die Bytelänge des neuen ArrayBuffer Objektes.
+
+ +

Rückgabewert

+ +

Ein neues ArrayBuffer Objekt.

+ +

Beschreibung

+ +

Die ArrayBuffer.transfer() Methode erlaubt es ein ArrayBuffer zu vergrößern und zu detachen. Die Möglichkeit ein ArrayBuffer zu vergrößern ohne es zu kopieren, hat den Vorteil, dass es viel schneller für große Buffer ist (ähnlich wie bei realloc). Die Möglichkeit, dass ein ArrayBuffer detachet wird, gibt dem Entwickler die explizite Kontrolle über das freigeben des internen Speichers. Dieses vermeidet das Entfernen aller Referenzen und das Warten auf die Garbage Collection.

+ +

Beispiele

+ +
var buf1 = new ArrayBuffer(40);
+new Int32Array(buf1)[0] = 42;
+
+var buf2 = ArrayBuffer.transfer(buf1, 80);
+buf1.byteLength; // 0 but if you use the polyfill then the value is still 40
+buf2.byteLength; // 80
+new Int32Array(buf2)[0]; // 42
+
+var buf3 = ArrayBuffer.transfer(buf2, 0);
+buf2.byteLength; // 0 but if you use the polyfill then the value is still 80
+buf3.byteLength; // 0
+
+ +

Polyfill

+ +

Für Browser, die die Funktion nicht nativ unterstützen, gibt es die Möglichkeit folgenden Quelltext am Anfang eines Skriptes einzufügen, um die Funktion transfer() zu benutzen. Diese Funktion ist nicht exakt die in der API beschriebene, weil Browser, die die Funktion unterstützen, direkten Zugriff auf die C++ Funktion realloc() haben, welche die Länge des Speichers erhöht und nur eine Kopie anlegt, wenn es nötig ist. Im Gegensatz dazu kopiert der folgende Pollyfill alles immer in neuen Speicher. Diese Funktion transferiert die Daten jedoch von einem ArrayBuffer zu einem anderen.

+ +
if (!ArrayBuffer.transfer) {
+    ArrayBuffer.transfer = function(source, length) {
+        if (!(source instanceof ArrayBuffer))
+            throw new TypeError('Source must be an instance of ArrayBuffer');
+        if (length <= source.byteLength)
+            return source.slice(0, length);
+        var sourceView = new Uint8Array(source),
+            destView = new Uint8Array(new ArrayBuffer(length));
+        destView.set(sourceView);
+        return dest.buffer;
+    };
+}
+ +

Spezifikationen

+ +

Ist in keiner aktuellen Spezifikation enthalten, wird aber in der Zukunft für ECMA-262 geplant.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.ArrayBuffer.transfer")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/asyncfunction/index.html b/files/de/web/javascript/reference/global_objects/asyncfunction/index.html new file mode 100644 index 0000000000..994df6d344 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/asyncfunction/index.html @@ -0,0 +1,124 @@ +--- +title: AsyncFunction +slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction +tags: + - Constructor + - Experimental + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction +--- +
{{JSRef}}
+ +

Der AsyncFunction Konstruktor erstellt ein neues {{jsxref("Statements/async_function", "AsyncFunction")}} Objekt. In JavaScript ist jede asynchrone Funktion ein AsyncFunction Objekt.

+ +
+

Hinweis: AsyncFunction ist kein globales Objekt. Durch die ausführung des folgenden Quelltextes kann das Objekte erhalten werden.

+ +
Object.getPrototypeOf(async function(){}).constructor
+
+ +

Syntax

+ +
new AsyncFunction([arg1[, arg2[, ...argN]],] functionBody)
+ +

Parameter

+ +
+
arg1, arg2, ... argN
+
Namen, die für die Namen der formalen Parameter der Funktion verwendet werden. Jeder muss ein String mit einem validen JavaScript-Bezeichner sein oder eine Liste von Strings, welche mit einem Komma getrennt sind; zum Beispiel "x", "theValue", oder "a,b".
+
functionBody
+
Ein String, welcher die JavaScript-Anweisungen enthält, welche die Funktion definieren.
+
+ +

Beschreibung

+ +

{{jsxref("Statements/async_function", "asyncFunction")}} Objekte, die mit dem AsyncFunction Konstruktor erstellt werden, werden analysieren, wenn sie erstellt werden. Dieses ist weniger effizient als die Deklaration einer asynchronen Funktion mit einem {{jsxref("Statements/async_function", "asyncFunction Ausdruck")}} und dem Aufruf in dem Code, weil solche Funktion mit dem Rest des Quelltextes analysieren werden.

+ +

Alle an die Funktion übergebenen Argumente werden als die Namen der Bezeichner der Parameter in der zu erstellenden Funktion in der Reihenfolge behandelt, in der sie übergeben werden.

+ +
+

Hinweis: Mit dem AsyncFunction Konstruktor erstellte {{jsxref("Statements/async_function", "asyncFunctions")}} erstellen keine Closures in ihrem Erstellungskontext; Sie werden immer im globalen Scope erstellt. Wenn sie ausgeführt werden, haben sie nur Zugriff auf eigene lokale Variablen und globale Variablen, jedoch nicht auf Variablen aus dem Scope, indem der AsyncFunction Konstruktor aufgerufen wurde. Dies ist der Unterschied zum Einsatz von {{jsxref("Global_Objects/eval", "eval")}} mit Quelltext für eine asynchrone Funktionsanweisung.

+
+ +

Das Aufrufen des AsyncFunction Konstruktors als Funktion (ohne Einsatz des new Operators) hat den gleichen Effekt wie das Aufrufen als Konstruktor.

+ +

Eigenschaften

+ +
+
AsyncFunction.length
+
Die AsyncFunction Konstruktor Längeneigenschaft, welche den Wert 1 hat.
+
{{jsxref("AsyncFunction.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zu allen AsyncFunction Objekten.
+
+ +

AsyncFunction Prototype Objekt

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype', 'Eigenschaften')}}
+ +

AsyncFunction Instanzen

+ +

AsyncFunction Instanzen erben Methoden und Eigenschaften von {{jsxref("AsyncFunction.prototype")}}. Wie bei allen Konstruktoren ist es möglich die Eigenschaften des Konstruktor Objektes zu ändern, um Änderungen an allen AsyncFunction Instanzen vorzunehmen.

+ +

Beispiele

+ +

Erstellen einer asynchronen Funktion mit einem AsyncFunction Konstruktor

+ +
function resolveAfter2Seconds(x) {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve(x);
+    }, 2000);
+  });
+}
+
+var AsyncFunction = Object.getPrototypeOf(async function(){}).constructor
+
+var a = new AsyncFunction('a',
+                          'b',
+                          'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);');
+
+a(10, 20).then(v => {
+  console.log(v); // prints 30 after 4 seconds
+});
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-async-function-objects', 'AsyncFunction object')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.AsyncFunction")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/asyncfunction/prototype/index.html b/files/de/web/javascript/reference/global_objects/asyncfunction/prototype/index.html new file mode 100644 index 0000000000..2dc516ca5c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/asyncfunction/prototype/index.html @@ -0,0 +1,61 @@ +--- +title: AsyncFunction.prototype +slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +tags: + - Experimental + - JavaScript + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +--- +
{{JSRef}}
+ +

Die AsyncFunction.prototype Eigenschaft repräsentiert den Prototypen des {{jsxref("AsyncFunction")}} Objektes.

+ +

Beschreibung

+ +

{{jsxref("AsyncFunction")}} Objekte erben von AsyncFunction.prototype. AsyncFunction.prototype kann nicht verändert werden.

+ +

Eigenschaften

+ +
+
AsyncFunction.constructor
+
Der Initialwert ist {{jsxref("AsyncFunction")}}.
+
AsyncFunction.prototype[@@toStringTag]
+
Gibt "AsyncFunction" zurück.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-async-function-constructor-prototype', 'AsyncFunction.prototype')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.AsyncFunction.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/add/index.html b/files/de/web/javascript/reference/global_objects/atomics/add/index.html new file mode 100644 index 0000000000..f9b8e98b1b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/add/index.html @@ -0,0 +1,83 @@ +--- +title: Atomics.add() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/add +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add +--- +
{{JSRef}}
+ +

Die statische Atomics.add() Methode addiert eine gegebenen Wert an einer gegebenen Position im Array und gibt den alten Wert zurück. Diese atomare Operation garantiert, dass keine andere Schreiboperation während der Operation durchgeführt werden kann.

+ +
{{EmbedInteractiveExample("pages/js/atomics-add.html")}}
+ + + +

Syntax

+ +
Atomics.add(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, zu der value addiert wird.
+
value
+
Die Zahl, die addiert werden soll.
+
+ +

Return value

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+
+Atomics.add(ta, 0, 12); // returns 0, the old value
+Atomics.load(ta, 0); // 12
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.add', 'Atomics.add')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.add")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/and/index.html b/files/de/web/javascript/reference/global_objects/atomics/and/index.html new file mode 100644 index 0000000000..34093b64e7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/and/index.html @@ -0,0 +1,129 @@ +--- +title: Atomics.and() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/and +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/and +--- +
{{JSRef}}
+ +

Die statische Atomics.and() Methode berechnet eine bitweises UND mit einem gegebenen Wert auf einem Wert an einer gegebenen Position im Array und gibt den alten Wert an der Position zurück. Die atomare Operation garantiert, dass kein anderer Schreibprozess während der Operation durchgeführt wird.

+ +
{{EmbedInteractiveExample("pages/js/atomics-and.html")}}
+ + + +

Syntax

+ +
Atomics.and(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, mit der das bitweise UND berechnet wird.
+
value
+
Die Zahl, mit der das bitweise UND berechnet wird.
+
+ +

Rückgabewert

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beschreibung

+ +

Die bitweise UND Operation ergibt nur 1, wenn beide Werte, a und b, 1 sind. Die Wahrheitstabelle für die UND Operation ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba & b
000
010
100
111
+ +

Zum Beispiel resultiert ein bitweises UND auf 5 & 1 in 0001, was im Dezimalsystem 1 ist.

+ +
5  0101
+1  0001
+   ----
+1  0001
+ +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+ta[0] = 5;
+
+Atomics.and(ta, 0, 1); // returns 0, the old value
+Atomics.load(ta, 0);  // 1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.and', 'Atomics.and')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.and")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/compareexchange/index.html b/files/de/web/javascript/reference/global_objects/atomics/compareexchange/index.html new file mode 100644 index 0000000000..1c61ef7d26 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/compareexchange/index.html @@ -0,0 +1,86 @@ +--- +title: Atomics.compareExchange() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/compareExchange +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/compareExchange +--- +
{{JSRef}}
+ +

Die statische Atomics.compareExchange() Methode ersetzt einen Wert an einer gegebenen Position im einem Array mit einem gegebene Wert aus, wenn ein gegebenen Wert gleich dem alten Wert ist. Es wird der alte Wert an der Position zurückgegeben, egal ob der abzugleichende Wert gleich oder nicht ist. Die atomare Operation garantiert, dass kein anderer Schreibprozess während der Operation durchgeführt wird.

+ +
{{EmbedInteractiveExample("pages/js/atomics-compareexchange.html")}}
+ + + +

Syntax

+ +
Atomics.compareExchange(typedArray, index, expectedValue, replacementValue)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, an den ein Wert ersetzt wird.
+
expectedValue
+
Wert, auf dem die gleichheit geprüft wird.
+
replacementValue
+
Neu Zahl, die geschreiben wird.
+
+ +

Rückgabewert

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+ta[0] = 7;
+
+Atomics.compareExchange(ta, 0, 7, 12); // returns 7, the old value
+Atomics.load(ta, 0); // 12
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.compareexchange', 'Atomics.compareExchange')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.compareExchange")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/exchange/index.html b/files/de/web/javascript/reference/global_objects/atomics/exchange/index.html new file mode 100644 index 0000000000..df040868a6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/exchange/index.html @@ -0,0 +1,85 @@ +--- +title: Atomics.exchange() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/exchange +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/exchange +--- +
{{JSRef}}
+ +

Die statische Atomics.exchange() Methode ersetzt einen Wert an einer gegebenen Position im einem Array mit einem gegebene Wert aus. Die atomare Operation garantiert, dass kein anderer Schreibprozess während der Operation durchgeführt wird.

+ +
{{EmbedInteractiveExample("pages/js/atomics-exchange.html")}}
+ + + +

Syntax

+ +
Atomics.compareExchange(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, an den ein Wert ersetzt wird.
+
value
+
Neu Zahl, die geschreiben wird.
+
+ +

Rückgabewert

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+
+Atomics.compareExchange(ta, 0, 12); // returns 0, the old value
+Atomics.load(ta, 0); // 12
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.exchange', 'Atomics.exchange')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.exchange")}}

+ +

Siehe auch

+ + + +

 

diff --git a/files/de/web/javascript/reference/global_objects/atomics/index.html b/files/de/web/javascript/reference/global_objects/atomics/index.html new file mode 100644 index 0000000000..e8a945060e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/index.html @@ -0,0 +1,116 @@ +--- +title: Atomics +slug: Web/JavaScript/Reference/Global_Objects/Atomics +tags: + - JavaScript + - Shared Memory + - Specifications +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics +--- +
{{JSRef}}
+ +

Das Atomics Objekt unterstützt atomare Operationen als statische Methoden. Diese werden mit {{jsxref("SharedArrayBuffer")}} Objekte benutzt.

+ +

Die atomaren Operationen sind auf dem Atomics Modul installiert. Anders, als bei anderen globalen Objekten, ist, dass Atomics kein Konstruktor ist. Man kann Atomics nicht mit einem new Operator oder als Funktion verwenden. Alle Eigenschaften und Methoden von Atomics sind statisch (genauso wie zum Beispiel bei dem {{jsxref("Math")}} Objekt).

+ +

Eigenschaften

+ +
+
Atomics[Symbol.toStringTag]
+
Der Wert dieser Eigenschaft ist: "Atomics".
+
+ +

Methoden

+ +

Atomare Operationen

+ +

Wenn Speicher geteilt wird, können mehrere Threads auf dem gleichen Speicher lesen und schreiben. Atomare Operationen stellen sicher, dass Werte in einer Operation geschrieben und gelesen werden bevor mit der nächste Operation begonnen wird und dass eine Operation nicht unterbrochen wird.

+ +
+
{{jsxref("Atomics.add()")}}
+
Addiert den angegebenen Wert dem existierenden Wert an der gegebenen Position im Array hinzu. Gibt den alten Wert an der Position zurück.
+
{{jsxref("Atomics.and()")}}
+
Berechnet ein Bitweises UND mit dem Wert an der angegebenen Position im Array und dem angegebenen Wert. Gibt den alten Wert an der Position zurück.
+
{{jsxref("Atomics.compareExchange()")}}
+
Speichert einen angegebenen Wert an der angegebenen Position im Array, wenn dieser gleich einem angegebene Wert ist. Gibt den alten Wert zurück.
+
{{jsxref("Atomics.exchange()")}}
+
Speichert einen angegebenen Wert an einer angegebenen Position im Array. Gibt den alten Wert zurück.
+
+ +
+
{{jsxref("Atomics.load()")}}
+
Gibt den Wert an einer angegebenen Position im Array zurück.
+
{{jsxref("Atomics.or()")}}
+
Berechnet ein Bitweises ODER mit dem gegebenen Wert an der angegebenen Position im Array und dem angegebenen Wert. Gibt den alten Wert an der Position zurück.
+
{{jsxref("Atomics.store()")}}
+
Speichert einen angegebenen Wert an einer angegebenen Position im Array. Gibt den Wert zurück.
+
{{jsxref("Atomics.sub()")}}
+
Subtrahiert einen angegebenen Wert von einem Wert an einer angegebenen Position im Array. Gibt den alten Wert an der Position zurück.
+
{{jsxref("Atomics.xor()")}}
+
Berechnet ein Bitweises XOR mit dem Wert an einer angegebenen Position im Array und einem angegebenen Wert. Gibt den alten Wert an der Position zurück.
+
+ +

Wait und notify

+ +

Die wait() und notify() Methoden sind auf Linux Futexes ("fast user-space mutex") modelliert und ermöglichen es zu warten, bis eine bestimmte Bedingung true wird, und wird als blockierendes Konstrukt verwendet.

+ +
+
{{jsxref("Atomics.wait()")}}
+
Überprüft, ob an der angegebenen Position in einem Array einen angegebener Wert enthalten ist und wartet oder bekommt ein Timeout. Es wird "ok", "not-equal", oder "timed-out" zurückgegeben. Wenn Warten im ausführenden Agenten nicht erlaubt ist, wird ein Fehler geworfen (die meisten Browser erlauben kein wait() im Browser main Thread).
+
{{jsxref("Atomics.notify()")}}
+
Benachrichtigt Agenten, die auf die angegebene Arrayposition warten. Gibt die Zahl der benachrichtigten Agenten zurück.
+
{{jsxref("Atomics.isLockFree()", "Atomics.isLockFree(size)")}}
+
+

Eine primitive Optimierung, die feststellten kann, ob Locks und atomare Operationen benutzt werden können. Gibt true zurück, wenn atomare Operationen auf einem Array der gegebenen Elementgröße mit einer atomaren Hardwareoperation implementiert ist (im Gegensatz zu einem Lock). Nur für Experten.

+
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics-object', 'Atomics')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
{{SpecName('ES8', '#sec-atomics-object', 'Atomics')}}{{Spec2('ES8')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics")}}

+ +

Kompatibilitätshinweise

+ +

Vor Firefox 48 waren die neuesten API-Namen und Semantiken noch nicht implementiert. Die Unterschiede zwischen der Firefox Version 46 und der Version 48 sind:

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/islockfree/index.html b/files/de/web/javascript/reference/global_objects/atomics/islockfree/index.html new file mode 100644 index 0000000000..61bf90e0bf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/islockfree/index.html @@ -0,0 +1,73 @@ +--- +title: Atomics.isLockFree() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/isLockFree +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/isLockFree +--- +
{{JSRef}}
+ +

Die statische Atomics.isLockFree() Methode wird benutzt, um festzustellen, ob ein Lock (Sperre) oder eine atomare Operation vorhanden ist. Sie gibt true zurück, wenn die gegebene Größe eine von den in der BYTES_PER_ELEMENT Eigenschften von Integer TypedArray Typen ist.

+ +
{{EmbedInteractiveExample("pages/js/atomics-islockfree.html")}}
+ + + +

Syntax

+ +
Atomics.isLockFree(size)
+
+ +

Parameter

+ +
+
size
+
Die größe in Bytes, für die geprüft wird.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}}, der angibt, ob die Operation frei von Locks ist.

+ +

Beispiele

+ +
Atomics.isLockFree(1); // true
+Atomics.isLockFree(2); // true
+Atomics.isLockFree(3); // false
+Atomics.isLockFree(4); // true
+Atomics.isLockFree(5); // false
+Atomics.isLockFree(6); // false
+Atomics.isLockFree(7); // false
+Atomics.isLockFree(8); // false
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.islockfree', 'Atomics.isLockFree')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.isLockFree")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/load/index.html b/files/de/web/javascript/reference/global_objects/atomics/load/index.html new file mode 100644 index 0000000000..07d2c4a477 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/load/index.html @@ -0,0 +1,81 @@ +--- +title: Atomics.load() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/load +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/load +--- +
{{JSRef}}
+ +

Die statische Atomics.load() Methode gibt den Wert an einer gegebenen Position in einem Array zurück.

+ +
{{EmbedInteractiveExample("pages/js/atomics-load.html")}}
+ + + +

Syntax

+ +
Atomics.load(typedArray, index)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, von der der Wert geladen wird.
+
+ +

Rückgabewert

+ +

Der Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+
+Atomics.add(ta, 0, 12);
+Atomics.load(ta, 0); // 12
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.load', 'Atomics.load')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.load")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/or/index.html b/files/de/web/javascript/reference/global_objects/atomics/or/index.html new file mode 100644 index 0000000000..ec052cadde --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/or/index.html @@ -0,0 +1,129 @@ +--- +title: Atomics.or() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/or +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/or +--- +
{{JSRef}}
+ +

Die statische Atomics.or() Methode berechnet eine bitweises ODER mit einem gegebenen Wert auf einem Wert an einer gegebenen Position im Array und gibt den alten Wert an der Position zurück. Die atomare Operation garantiert, dass kein anderer Schreibprozess während der Operation durchgeführt wird.

+ +
{{EmbedInteractiveExample("pages/js/atomics-or.html")}}
+ + + +

Syntax

+ +
Atomics.and(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, mit der das bitweise ODER berechnet wird.
+
value
+
Die Zahl, mit der das bitweise ODER berechnet wird.
+
+ +

Rückgabewert

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beschreibung

+ +

Die bitweise ODER Operation ergibt nur 1, wenn eine Werte, a oder b, 1 ist. Die Wahrheitstabelle für die ODER Operation ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba | b
000
011
101
111
+ +

Zum Beispiel resultiert ein bitweises ODER auf 5 | 1 in 0111, was im Dezimalsystem 5 ist.

+ +
5  0101
+1  0001
+   ----
+5  0101
+ +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+ta[0] = 2;
+
+Atomics.or(ta, 0, 1); // returns 2, the old value
+Atomics.load(ta, 0);  // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.or', 'Atomics.or')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.or")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/store/index.html b/files/de/web/javascript/reference/global_objects/atomics/store/index.html new file mode 100644 index 0000000000..6112dc5f62 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/store/index.html @@ -0,0 +1,82 @@ +--- +title: Atomics.store() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/store +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/store +--- +
{{JSRef}}
+ +

Die statische Atomics.store() Methode speichert einen gegebenen Wert an einer gegebenen Position in dem Array und gibt den Wert zurück.

+ +
{{EmbedInteractiveExample("pages/js/atomics-store.html")}}
+ + + +

Syntax

+ +
Atomics.store(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, an der value gespeichert wird.
+
value
+
Die Zahl, die gespeichert wird.
+
+ +

Rückgabewert

+ +

Der Wert, der abgespeichert wurde.

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+
+Atomics.store(ta, 0, 12); // 12
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.store', 'Atomics.store')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.store")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/sub/index.html b/files/de/web/javascript/reference/global_objects/atomics/sub/index.html new file mode 100644 index 0000000000..cce9ae06c6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/sub/index.html @@ -0,0 +1,86 @@ +--- +title: Atomics.sub() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/sub +tags: + - Atomics + - Java + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub +--- +
{{JSRef}}
+ +

Die statische Atomics.sub() Methode subtrahiert eine gegebenen Wert an einer gegebenen Position im Array und gibt den alten Wert zurück. Diese atomare Operation garantiert, dass keine andere Schreiboperation während der Operation durchgeführt werden kann.

+ +
{{EmbedInteractiveExample("pages/js/atomics-sub.html")}}
+ + + +

Syntax

+ +
Atomics.add(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, zu der value subtrahiert wird.
+
value
+
Die Zahl, die subtrahiert werden soll.
+
+ +

Return value

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+ta[0] = 48;
+
+Atomics.sub(ta, 0, 12); // returns 48, the old value
+Atomics.load(ta, 0); // 36
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.sub', 'Atomics.sub')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.sub")}}

+ +

Siehe auch

+ + + +

 

diff --git a/files/de/web/javascript/reference/global_objects/atomics/wait/index.html b/files/de/web/javascript/reference/global_objects/atomics/wait/index.html new file mode 100644 index 0000000000..6af6022fc4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/wait/index.html @@ -0,0 +1,95 @@ +--- +title: Atomics.wait() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/wait +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/wait +--- +
{{JSRef}}
+ +

Die statische Atomics.wait() Methode verifiziert, dass eine gegebene Position in einem {{jsxref("Int32Array")}} ein gegebene Wert ist und dann schläft und entweder aufgeweckt wird oder ein Timeout bekommt. Die Strings "ok", "not-equal", und "timed-out" sind alle möglichen Rückgabewerte

+ +
+

Hinweis: Diese Operation funktioniert nur mit einem geteilten {{jsxref("Int32Array")}} und ist nicht im Main-Thread erlaubt.

+
+ +

Syntax

+ +
Atomics.wait(typedArray, index, value[, timeout])
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes {{jsxref("Int32Array")}}.
+
index
+
Die Position im typedArray, an der gewartet wird.
+
value
+
Der wert, mit dem getestet wird.
+
timeout {{optional_inline}}
+
Wartezeit in Millisekunden. {{jsxref("Infinity")}}, wenn keine Zeit angegeben wird.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("String")}} welcher "ok", "not-equal" oder "timed-out" ist.

+ +

Exceptions

+ + + +

Beipsiele

+ +

Gegeben ist ein Int32Array:

+ +
var sab = new SharedArrayBuffer(1024);
+var int32 = new Int32Array(sab);
+
+ +

Ein lesender Thread schläft und wartet auf Position 0, ander der Wert 0 erwartet wird. Solange diese gegeben ist, geht es nicht weiter. Immer wenn ein neuer schreibender Thread einen neuen Wert speichert, wacht der Thread. Im Anschluss ist der neue Wert an der Position 0 (123).

+ +
Atomics.wait(int32, 0, 0);
+console.log(int32[0]); // 123
+ +

Ein schreibender Thread speichert einen neuen Wert und wacht den wartenden Thread nach dem Schreiben auf.

+ +
console.log(int32[0]); // 0;
+Atomics.store(int32, 0, 123);
+Atomics.wake(int32, 0, 1);
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.wait', 'Atomics.wait')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.wait")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/wake/index.html b/files/de/web/javascript/reference/global_objects/atomics/wake/index.html new file mode 100644 index 0000000000..5ac06d7adc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/wake/index.html @@ -0,0 +1,93 @@ +--- +title: Atomics.notify() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/wake +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/notify +--- +
{{JSRef}}
+ +

Die statische Atomics.notify() Methode benachrichtigt Threads, die in einer Warteschlange schlafen.

+ +
+

Hinweis: Diese Operation funktioniert nur mit einem {{jsxref("Int32Array")}}.

+
+ +

Syntax

+ +
Atomics.notify(typedArray, index, count)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes {{jsxref("Int32Array")}}.
+
index
+
Die Position im typedArray, an der aufgewacht wird.
+
count
+
Anzahl der aufzuweckenden Threads. Standard ist {{jsxref("Infinity", "+Infinity")}}.
+
+ +

Rückgabewert

+ +

Anzahl an geweckten Threads.

+ +

Exceptions

+ + + +

Beipsiele

+ +

Gegeben ist ein Int32Array:

+ +
var sab = new SharedArrayBuffer(1024);
+var int32 = new Int32Array(sab);
+
+ +

Ein lesender Thread schläft und wartet auf Position 0, ander der Wert 0 erwartet wird. Solange diese gegeben ist, geht es nicht weiter. Immer wenn ein neuer schreibender Thread einen neuen Wert speichert, wacht der Thread. Im Anschluss ist der neue Wert an der Position 0 (123).

+ +
Atomics.wait(int32, 0, 0);
+console.log(int32[0]); // 123
+ +

Ein schreibender Thread speichert einen neuen Wert und wacht den wartenden Tread nach dem Schreiben auf.

+ +
console.log(int32[0]); // 0;
+Atomics.store(int32, 0, 123);
+Atomics.notify(int32, 0, 1);
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.notify', 'Atomics.notify')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.notify")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/atomics/xor/index.html b/files/de/web/javascript/reference/global_objects/atomics/xor/index.html new file mode 100644 index 0000000000..913fcc1298 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/atomics/xor/index.html @@ -0,0 +1,130 @@ +--- +title: Atomics.xor() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/xor +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/xor +--- +
{{JSRef}}
+ +

Die statische Atomics.xor() Methode berechnet eine bitweises XOR mit einem gegebenen Wert auf einem Wert an einer gegebenen Position im Array und gibt den alten Wert an der Position zurück. Die atomare Operation garantiert, dass kein anderer Schreibprozess während der Operation durchgeführt wird.

+ +
{{EmbedInteractiveExample("pages/js/atomics-xor.html")}}
+ + + +

Syntax

+ +
Atomics.and(typedArray, index, value)
+
+ +

Parameter

+ +
+
typedArray
+
Ein geteiltes getrypted Integer Array. Eines von {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} oder {{jsxref("Uint32Array")}}.
+
index
+
Die Position in typedArray, mit der das bitweise XOR berechnet wird.
+
value
+
Die Zahl, mit der das bitweise XOR berechnet wird.
+
+ +

Rückgabewert

+ +

Der alte Wert an der gegebenen Position (typedArray[index]).

+ +

Exceptions

+ + + +

Beschreibung

+ +

Die bitweise XOR Operation ergibt nur 1, wenn genau ein Werte, a oder b, 1 ist. Die Wahrheitstabelle für die XOR Operation ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba & b
000
011
101
110
+ +

Zum Beispiel resultiert ein bitweises XOR auf 5 & 1 in 0100, was im Dezimalsystem 4 ist.

+ +
5  0101
+1  0001
+   ----
+4  0100
+ +

Beispiele

+ +
var sab = new SharedArrayBuffer(1024);
+var ta = new Uint8Array(sab);
+ta[0] = 5;
+
+Atomics.xor(ta, 0, 1); // returns 5, the old value
+Atomics.load(ta, 0);  // 4
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-atomics.xor', 'Atomics.xor')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Atomics.xor")}}

+ +

Siehe auch

+ + + +

 

diff --git a/files/de/web/javascript/reference/global_objects/boolean/index.html b/files/de/web/javascript/reference/global_objects/boolean/index.html new file mode 100644 index 0000000000..245c2d1a8b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/boolean/index.html @@ -0,0 +1,159 @@ +--- +title: Boolean +slug: Web/JavaScript/Reference/Global_Objects/Boolean +tags: + - Boolean + - Constructor + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean +--- +
{{JSRef}}
+ +

Das Boolean Objekt ist ein Objekt-Wrapper für einen booleschen Wert.

+ +

Syntax

+ +
new Boolean([value])
+ +

Parameter

+ +
+
value
+
Optional. Der Anfangswert des Boolean-Objektes.
+
+ +

Beschreibung

+ +

Der als erster Parameter übergebene Wert wird, wenn nötig, in einen booleschen Wert umgewandelt. Wird der Wert ausgelassen oder ist 0, -0, {{jsxref("null")}}, false, {{jsxref("NaN")}}, {{jsxref("undefined")}} oder der leere String (""), so besitzt das Objekt den Initialwert false. Alle anderen Werte, einschließlich eines Objektes oder des Strings "false", erzeugen ein Objekt mit dem Initialwert true.

+ +

Die Werte true und false des Boolean-Objektes sind nicht zu verwechseln mit den primitiven Booleanwerten true und false.

+ +

Jedes Objekt, dessen Wert nicht {{jsxref("undefined")}} oder {{jsxref("null")}} entspricht, einschließlich eines Boolean-Objektes, dessen Wert false ist, wird bei der Übergabe an eine Bedingung als true gewertet. Beispielsweise wird das folgende {{jsxref("Statements/if...else", "if")}} Konstrukt als true ausgewertet:

+ +
var x = new Boolean("false");
+if (x) {
+  // this code is executed
+}
+
+ +

Dieses Verhalten trifft nicht auf primitive Boolwerte zu. Beispielsweise ergibt das folgende {{jsxref("Statements/if...else", "if")}} Konstrukt false:

+ +
x = false;
+if (x) {
+  // this code is not executed
+}
+
+ +

Ein Boolean-Objekt sollte nicht genutzt werden um einen nicht-booleschenWert in einen booleschen Wert umzuwandeln. In diesem Fall wäre es besser, den Boolean als Funktion zu verwenden:

+ +
x = Boolean(expression);     // preferred
+x = new Boolean(expression); // don't use
+
+ +

Wird ein Objekt, einschließlich eines Boolean-Objektes dessen Wert false ist, als Anfangsparameter an das Boolean-Objekt übergeben, so hat das neue Boolean-Objekt den Wert true.

+ +
myFalse = new Boolean(false);   // initialer Wert von false
+g = Boolean(myFalse);       // initialer Wert von  true
+myString = new String('Hello'); // string objekt
+s = Boolean(myString);      //  initialer Wert von true
+
+ +

Ein Boolean-Objekt darf nicht anstelle eines primitiven Boolean-wertes verwendet werden.

+ +
+

Hinweis: Wenn die nicht standardisierte Eigenschaft document.all als Argument für den Konstruktor benutzt wird, ist das Resultat ein Boolean Objekt mit dem Wert false. Diese Eigenschaft ist veraltet und nicht standardisierte und darf nicht eingesetzt werden.

+
+ +

Eigenschaften

+ +
+
Boolean.length
+
Längen-Eingeschaft, die den Wert 1 hat.
+
{{jsxref("Boolean.prototype")}}
+
Repräsentiert den Prototypen für den Boolean Konstruktor
+
+ +

Methoden

+ +

Das globale Objekt Boolean enthält zwar keine eigenen Methoden, erbt jedoch einige seiner Methoden durch die Prototypenkette:

+ +

Boolean Instanzen

+ +

Alle Instanzen von Boolean erben von {{jsxref("Boolean.prototype")}}. Wie bei allen Konstruktoren diktiert das Prototyp-Objekt die geerbten Eigenschaften und Methoden der Child-Elemente.

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Boolean/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Boolean/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Erstellung eines Boolean Objektes mit dem Anfangswert false

+ +
var bNoParam = new Boolean();
+var bZero = new Boolean(0);
+var bNull = new Boolean(null);
+var bEmptyString = new Boolean('');
+var bfalse = new Boolean(false);
+
+ +

Erstellung eines Boolean Objektes mit dem Anfangswert true

+ +
var btrue = new Boolean(true);
+var btrueString = new Boolean('true');
+var bfalseString = new Boolean('false');
+var bSuLin = new Boolean('Su Lin');
+var bArrayProto = new Boolean([]);
+var bObjProto = new Boolean({});
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Ursprüngliche Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.6', 'Boolean')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-boolean-objects', 'Boolean')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-boolean-objects', 'Boolean')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Boolean")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/boolean/prototype/index.html b/files/de/web/javascript/reference/global_objects/boolean/prototype/index.html new file mode 100644 index 0000000000..2a6dda6de7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/boolean/prototype/index.html @@ -0,0 +1,83 @@ +--- +title: Boolean.prototype +slug: Web/JavaScript/Reference/Global_Objects/Boolean/prototype +tags: + - Boolean + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean +--- +
{{JSRef}}
+ +
Die Boolean.prototype Eigenschaft repräsentiert den Prototypen des  {{jsxref("Boolean")}} Konstruktors.
+ +
 
+ +
{{js_property_attributes(0, 0, 0)}}
+ +
{{EmbedInteractiveExample("pages/js/boolean-constructor.html")}}
+ + + +

Beschreibung

+ +

{{jsxref("Boolean")}} Instanzen ergen von from Boolean.prototype. Man kann das prototype Objekt benutzen, um Eigenschaften und Methoden zu allen {{jsxref("Boolean")}} Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
Boolean.prototype.constructor
+
Gibt die Funktion, die einen Instanz des Prototypen erstellt zurück. Im Standardfall ist das die Funktion {{jsxref("Boolean")}}.
+
+ +

Methoden

+ +
+
{{jsxref("Boolean.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt den Quelltext des {{jsxref("Boolean")}} Objektes als String zurück. Man kann diesen String benutzen um ein gleiches Objekt zu erstellen. Diese Methode überschreibt die {{jsxref("Object.prototype.toSource()")}} Methode.
+
{{jsxref("Boolean.prototype.toString()")}}
+
Gibt einen String "true" oder "false" zurück, abhängig vom Wert des Objektes. Diese Methode überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
{{jsxref("Boolean.prototype.valueOf()")}}
+
Gibt einen primitiven Wert des {{jsxref("Boolean")}} Objektes zurück. Diese Methode überschreibt die {{jsxref("Object.prototype.valueOf()")}} Methode.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.6.3.1', 'Boolean.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-boolean.prototype', 'Boolean.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-boolean.prototype', 'Boolean.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Boolean.prototype")}}

+
diff --git a/files/de/web/javascript/reference/global_objects/boolean/tosource/index.html b/files/de/web/javascript/reference/global_objects/boolean/tosource/index.html new file mode 100644 index 0000000000..b37e4c226f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/boolean/tosource/index.html @@ -0,0 +1,60 @@ +--- +title: Boolean.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/toSource +tags: + - Boolean + - JavaScript + - Method + - Non-standard + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +
Die toSource() Methode gibt einen String mit dem Quelltext des Objektes zurück.
+ +
 
+ +

Syntax

+ +
booleanObj.toSource()
+Boolean.toSource()
+ +

Rückgabewert

+ +

Eine String-Repräsentation des Quelltextes des Objektes.

+ +

Beschreibung

+ +

Die toSource gibt folgende Werte zurück:

+ + + +

Die Methode wird intern von JavaScript aufgerufen und wird normalerweise nicht in Applikationen eingesetzt.

+ +

Spezifikationen

+ +

In keinem Standard enthalten. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Boolean.toSource")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/boolean/tostring/index.html b/files/de/web/javascript/reference/global_objects/boolean/tostring/index.html new file mode 100644 index 0000000000..0732aec15a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/boolean/tostring/index.html @@ -0,0 +1,89 @@ +--- +title: Boolean.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/toString +tags: + - Boolean + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toString +--- +
{{JSRef}}
+ +

Die toString() gibt einen String, der eine {{jsxref("Boolean")}} Objekt repräsentiert, zurück.

+ +
{{EmbedInteractiveExample("pages/js/boolean-tostring.html")}}
+ + + +

Syntax

+ +
bool.toString()
+ +

Rückgabewert

+ +

Eine String-Repräsentation des {{jsxref("Boolean")}} Objektes.

+ +

Beschreibung

+ +

Das {{jsxref("Boolean")}} Objekt überschreibt die toString Methode des {{jsxref("Object")}} Objektes. Es erbt nicht von {{jsxref("Object.prototype.toString()")}}. Für {{jsxref("Boolean")}} Objekte gibt die toString Methode einen String, der das Objekt repräsentiert, zurück.

+ +

JavaScript ruft die toString Methode automatisch auf, wenn ein {{jsxref("Boolean")}} Objekt als Text dargestellt wird oder wenn ein {{jsxref("Boolean")}} mit einem String konkatiniert wird.

+ +

Für {{jsxref("Boolean")}} Objekte und Werte gibt die eingebaute toString Methode die Strings "true" oder "false", abhängig vom Wert des Boolean, zurück.

+ +

Beispiele

+ +

Einsatz von toString

+ +

Im folgenden Beispiel gibt der Aufruf flag.toString() den Wert "true" zurück:

+ +
var flag = new Boolean(true);
+var myVar = flag.toString();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.6.4.2', 'Boolean.prototype.toString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-boolean.prototype.tostring', 'Boolean.prototype.toString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-boolean.prototype.tostring', 'Boolean.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Boolean.toString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/boolean/valueof/index.html b/files/de/web/javascript/reference/global_objects/boolean/valueof/index.html new file mode 100644 index 0000000000..3d21502589 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/boolean/valueof/index.html @@ -0,0 +1,85 @@ +--- +title: Boolean.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/valueOf +tags: + - Boolean + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/valueOf +--- +
{{JSRef}}
+ +

Die valueOf() Methode gibt einen primitiven Wert des {{jsxref("Boolean")}} Objektes zurück.

+ +
{{EmbedInteractiveExample("pages/js/boolean-valueof.html")}}
+ + + +

Syntax

+ +
bool.valueOf()
+ +

Rückgabewert

+ +

Den primitiven Wert des gegebenen {{jsxref("Boolean")}} Objektes.

+ +

Beschreibung

+ +

Die valueOf Methode des {{jsxref("Boolean")}} Objektes gibt einen primitiven Wert eines {{jsxref("Boolean")}} Objekts oder {{jsxref("Boolean")}} Literals als Boolean Datentyp zurück.

+ +

Diese Methode wird intern von JavaScript aufgerufen und wird nicht in normalen Anwendungen benutzt.

+ +

Beispiele

+ +

Einsatz von valueOf

+ +
x = new Boolean();
+myVar = x.valueOf(); // weist  myVar false zu
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.6.4.3', 'Boolean.prototype.valueOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-boolean.prototype.valueof', 'Boolean.prototype.valueOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-boolean.prototype.valueof', 'Boolean.prototype.valueOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Boolean.valueOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/buffer/index.html b/files/de/web/javascript/reference/global_objects/dataview/buffer/index.html new file mode 100644 index 0000000000..5cb68fd75b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/buffer/index.html @@ -0,0 +1,71 @@ +--- +title: DataView.prototype.buffer +slug: Web/JavaScript/Reference/Global_Objects/DataView/buffer +tags: + - DataView + - JavaScript + - Property + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/buffer +--- +
{{JSRef}}
+ +

Die buffer Zugriffseigenschaft repräsentiert und referenziert den {{jsxref("ArrayBuffer")}} oder {{jsxref("SharedArrayBuffer")}}, der bei der Erstellung der DataView übergeben wurde.

+ +
{{EmbedInteractiveExample("pages/js/dataview-buffer.html")}}
+ + + +

Syntax

+ +
dataview.buffer
+ +

Beschreibung

+ +

Die buffer Eigenschaft ist eine Zugriffseigenschaft, bei der die Funktion für das erneute Beschreibeiben undefined ist. Das bedeutet, dass die Eigenschaft nur gelesen werden kann. Der Wert wird bei der Erstellung der DataView festgelegt und kann nicht mehr geändert werden.

+ +

Beispiele

+ +

Einsatz der buffer Eigenschaft

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.buffer; // ArrayBuffer { byteLength: 8 }
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-dataview.prototype.buffer', 'DataView.prototype.buffer')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-dataview.prototype.buffer', 'DataView.prototype.buffer')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.buffer")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/bytelength/index.html b/files/de/web/javascript/reference/global_objects/dataview/bytelength/index.html new file mode 100644 index 0000000000..dd20867f50 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/bytelength/index.html @@ -0,0 +1,77 @@ +--- +title: DataView.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/DataView/byteLength +tags: + - DataView + - JavaScript + - Property + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/byteLength +--- +
{{JSRef}}
+ +

Die byteLength Zugriffseigenschaft repräsentiert die Länge (in Bytes) der View vom Anfang ihres {{jsxref("ArrayBuffer")}} oder {{jsxref("SharedArrayBuffer")}}.

+ +
{{EmbedInteractiveExample("pages/js/dataview-bytelength.html")}}
+ + + +

Syntax

+ +
dataview.byteLength
+ +

Beschreibung

+ +

Die byteLength Eigenschaft ist eine Zugriffseigenschaft, bei der die set Funktion undefined ist. Das bedeutet, dass diese Eigenschaften nur gelesen werden kann. Der Wert der Eigenschaft wird beim erstellen einer DataView bekannt gemacht und kann nicht mehr verändert werden. Wenn beim erstellen kein Offset oder keine byteLength angegeben sind, wird der byteLength Wert des übergebenen ArrayBuffer oder SharedArrayBuffer zurückgegeben.

+ +

Beispiele

+ +

Einsatz der byteLength Eigenschaft

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.byteLength; // 8 (gleich mit byteLength von buffer)
+
+var dataview2 = new DataView(buffer, 1, 5);
+dataview2.byteLength; // 5 (wie beim erstellen der DataView spezifiziert)
+
+var dataview3 = new DataView(buffer, 2);
+dataview3.byteLength; // 6 (passend mit dem Offset beim erstellen der DataView)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-dataview.prototype.bytelength', 'DataView.prototype.byteLength')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-dataview.prototype.bytelength', 'DataView.prototype.byteLength')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.byteLength")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/byteoffset/index.html b/files/de/web/javascript/reference/global_objects/dataview/byteoffset/index.html new file mode 100644 index 0000000000..b6889271ba --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/byteoffset/index.html @@ -0,0 +1,74 @@ +--- +title: DataView.prototype.byteOffset +slug: Web/JavaScript/Reference/Global_Objects/DataView/byteOffset +tags: + - DataView + - JavaScript + - Property + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/byteOffset +--- +
{{JSRef}}
+ +

Die byteOffset Zugriffseigenschaft repräsentiert das Offset (in Bytes) der View vom Anfang ihres {{jsxref("ArrayBuffer")}} oder {{jsxref("SharedArrayBuffer")}}.

+ +
{{EmbedInteractiveExample("pages/js/dataview-byteoffset.html")}}
+ + + +

Syntax

+ +
dataview.byteOffset
+ +

Beschreibung

+ +

Die byteOffset Eigenschaft ist eine Zugriffseigenschaft, bei der die set Funktion undefined ist. Das bedeutet, dass diese Eigenschaften nur gelesen werden kann. Der Wert der Eigenschaft wird beim erstellen einer DataView bekannt gemacht und kann nicht mehr verändert werden.

+ +

Beispiele

+ +

Einsatz der byteOffset Eigenschaft

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.byteOffset; // 0 (no offset specified)
+
+var dataview2 = new DataView(buffer, 3);
+dataview2.byteOffset; // 3 (as specified when constructing the DataView)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-dataview.prototype.byteoffset', 'DataView.prototype.byteOffset')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-dataview.prototype.byteoffset', 'DataView.prototype.byteOffset')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.byteOffset")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getfloat32/index.html b/files/de/web/javascript/reference/global_objects/dataview/getfloat32/index.html new file mode 100644 index 0000000000..b8d8fe0986 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getfloat32/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.getFloat32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getFloat32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getFloat32 +--- +
{{JSRef}}
+ +

Die getFloat32() Methode gibt eine 32-Bit Gleitkommazahl mit Vorzeichen (Float) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getfloat32.html")}}
+ + + +

Syntax

+ +
dataview.getFloat32(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine 32-Bit Gleitkommazahl mit Vorzeichen.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getFloat32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getFloat32(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getfloat32', 'DataView.prototype.getFloat32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getfloat32', 'DataView.prototype.getFloat32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getFloat32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getfloat64/index.html b/files/de/web/javascript/reference/global_objects/dataview/getfloat64/index.html new file mode 100644 index 0000000000..7537520965 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getfloat64/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.getFloat64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getFloat64 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getFloat64 +--- +
{{JSRef}}
+ +

Die getFloat64() Methode gibt eine 64-Bit Gleitkommazahl mit Vorzeichen (Double) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getfloat64.html")}}
+ + + +

Syntax

+ +
dataview.getFloat64(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 64 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine 64-Bit Gleitkommazahl mit Vorzeichen.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getFloat64 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getFloat64(0); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getfloat64', 'DataView.prototype.getFloat64')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getfloat64', 'DataView.prototype.getFloat64')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getFloat64")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getint16/index.html b/files/de/web/javascript/reference/global_objects/dataview/getint16/index.html new file mode 100644 index 0000000000..9223ab4dae --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getint16/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.getInt16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt16 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt16 +--- +
{{JSRef}}
+ +

Die getInt16() Methode gibt eine ganze 16-Bit Zahl mit Vorzeichen (Short) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getint16.html")}}
+ + + +

Syntax

+ +
dataview.getInt16(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 16 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegeben ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine ganze 16-Bit Zahl mit Vorzeichen.

+ +

Auftretende Errors

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getInt16 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getInt16(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getint16', 'DataView.prototype.getInt16')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getint16', 'DataView.prototype.getInt16')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getInt16")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getint32/index.html b/files/de/web/javascript/reference/global_objects/dataview/getint32/index.html new file mode 100644 index 0000000000..8e6bd22603 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getint32/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.getInt32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt32 +--- +
{{JSRef}}
+ +

Die getInt32() Methode gibt eine ganze 32-Bit Zahl mit Vorzeichen (Long) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getint32.html")}}
+ + + +

Syntax

+ +
dataview.getInt32(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine ganze 32-Bit Zahl mit Vorzeichen

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getInt32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getInt32(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getint32', 'DataView.prototype.getInt32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getint32', 'DataView.prototype.getInt32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getInt32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getint8/index.html b/files/de/web/javascript/reference/global_objects/dataview/getint8/index.html new file mode 100644 index 0000000000..cc550d3f86 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getint8/index.html @@ -0,0 +1,93 @@ +--- +title: DataView.prototype.getInt8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt8 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt8 +--- +
{{JSRef}}
+ +

Die getInt8() Methode gibt eine ganze 8-Bit Zahl mit Vorzeichen (Byte) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getint8.html")}}
+ + + +

Syntax

+ +
dataview.getInt8(byteOffset)
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
+ +

Rückgabewert

+ +

Eine ganze 8-Bit Zahl mit Vorzeichen

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getInt8 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getInt8(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getint8', 'DataView.prototype.getInt8')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getint8', 'DataView.prototype.getInt8')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getInt8")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getuint16/index.html b/files/de/web/javascript/reference/global_objects/dataview/getuint16/index.html new file mode 100644 index 0000000000..df82d10a69 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getuint16/index.html @@ -0,0 +1,98 @@ +--- +title: DataView.prototype.getUint16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint16 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint16 +--- +
{{JSRef}}
+ +

Die getUint16() Methode gibt eine ganze vorzeichenlose 8-Bit Zahl (Unsigned Byte) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getuint16.html")}}
+ + + +

Syntax

+ +
dataview.getUint16(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 16 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine vorzeichenlose ganze 16-Bit Zahl.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getUint16 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getUint16(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getuint16', 'DataView.prototype.getUint16')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getuint16', 'DataView.prototype.getUint16')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getUint16")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getuint32/index.html b/files/de/web/javascript/reference/global_objects/dataview/getuint32/index.html new file mode 100644 index 0000000000..b51d1d4d27 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getuint32/index.html @@ -0,0 +1,98 @@ +--- +title: DataView.prototype.getUint32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint32 +--- +
{{JSRef}}
+ +

Die getUint32() Methode gibt eine ganze vorzeichenlose 8-Bit Zahl (Unsigned Byte) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/dataview-getuint32.html")}}
+ + + +

Syntax

+ +
dataview.getUint32(byteOffset [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

Eine vorzeichenlose ganze 32-Bit Zahl.

+ +

Auftretende Errors

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getUint32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getUint32(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getuint32', 'DataView.prototype.getUint32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getuint32', 'DataView.prototype.getUint32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getUint32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/getuint8/index.html b/files/de/web/javascript/reference/global_objects/dataview/getuint8/index.html new file mode 100644 index 0000000000..568930978a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/getuint8/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.getUint8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint8 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint8 +--- +
{{JSRef}}
+ +
Die getUint8() Methode gibt eine ganze vorzeichenlose 8-Bit Zahl (Unsigned Byte) vom spezifizierten Offset der {{jsxref("DataView")}} zurück.
+ +
{{EmbedInteractiveExample("pages/js/dataview-getuint8.html")}}
+ + + +
 
+ +

Syntax

+ +
dataview.getUint8(byteOffset)
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gelesen werden sollen.
+
+ +

Rückgabewert

+ +

Eine vorzeichenlose ganze 8-Bit Zahl

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View gelesen werden müsste.
+
+ +

Beschreibung

+ +

Es gibt keine Einschränkung Orientierung. Werte mit mehrere Bytes können mit jedem Offset abgerufen werden.

+ +

Beispiele

+ +

Einsatz der getUint8 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.getUint8(1); // 0
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.getuint8', 'DataView.prototype.getUint8')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.getuint8', 'DataView.prototype.getUint8')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.getUint8")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/index.html b/files/de/web/javascript/reference/global_objects/dataview/index.html new file mode 100644 index 0000000000..1384eafe34 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/index.html @@ -0,0 +1,127 @@ +--- +title: DataView +slug: Web/JavaScript/Reference/Global_Objects/DataView +tags: + - Constructor + - DataView + - JavaScript + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView +--- +
{{JSRef}}
+ +

Die DataView Ansicht unterstützt eine Low-Level Schnittstelle für das Lesen und Schreiben von mehrere Zahlentypen in einem {{jsxref("ArrayBuffer")}}. Diese Ansicht ist unabhängig von den Plattform Byte-Reihenfolgen.

+ +
{{EmbedInteractiveExample("pages/js/dataview-constructor.html")}}
+ + + +

Syntax

+ +
new DataView(buffer [, byteOffset [, byteLength]])
+ +

Parameter

+ +
+
buffer
+
Ein existierender {{jsxref("ArrayBuffer")}} oder {{jsxref("SharedArrayBuffer")}} {{experimental_inline}}, welche als Speicher für das neue DataView Objekt dient.
+
byteOffset {{optional_inline}}
+
Das Offset in Bytes, welches auf das erste Byte in dem spezifizierten Buffer für die neue Ansicht referenziert. Wenn dieser Parameter nicht angegeben ist, wird das erste Byte des Buffers als Startpunkt benutzt.
+
byteLength {{optional_inline}}
+
Die Anzahl der Elemente in dem Byte Array. Wenn es nicht angegeben wird, wird die Länge des Buffers benutzt.
+
+ +

Rückgabewert

+ +

Ein neues DataView Objekt welches den spezifizierten Datenpuffer (Buffer) repräsentiert.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Wird erzeugt, wenn byteOffset oder byteLength Größe als der Puffer (Buffers) sind
+
+ +

Beschreibung

+ +

Byte-Reihenfolge

+ +

Zahlenformate mit mehreren Bytes werden im Speicher verschieden dargestellt, je nachdem welche Maschinenarchitektur genutzt wird (siehe {{Glossary("Endianness")}} für weitere Erklärungen). DataView bietet explizit die Kontrolle über den Zugriff auf die Zahlen unabhängig von der Plattformarchitektur-Byte-Reihenfolge.

+ +
var littleEndian = (function() {
+  var buffer = new ArrayBuffer(2);
+  new DataView(buffer).setInt16(0, 256, true /* littleEndian */);
+  // Int16Array benutzt die Plattform Byte-Reihenfolge.
+  return new Int16Array(buffer)[0] === 256;
+})();
+console.log(littleEndian); // true oder false
+
+ +

Eigenschaften

+ +

Alle DataView Instanzen erben von {{jsxref("DataView.prototype")}} und erlauben das Hinzufügen von Eigenschaften zu allen DataView Objekten

+ +

{{page('de/Web/JavaScript/Reference/Global_Objects/DataView/prototype','Eigenschaften')}}

+ +

Methoden

+ +

{{page('de/Web/JavaScript/Reference/Global_Objects/DataView/prototype','Methoden')}}

+ +

Beispiele

+ +
var buffer = new ArrayBuffer(16);
+var dv = new DataView(buffer, 0);
+
+dv.setInt16(1, 42);
+dv.getInt16(1); //42
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Abgelöst von ECMAScript 6
{{SpecName('ES6', '#sec-dataview-constructor', 'DataView')}}{{Spec2('ES6')}}Initiale Definition in einem ECMA Standard
{{SpecName('ESDraft', '#sec-dataview-constructor', 'DataView')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView")}}

+ +

Bemerkungen zur Kompatibilität

+ +

Mit dem Start von Firefox 40 wird der {{jsxref("Operators/new", "new")}} Operator benötigt um eine DataView zu erstellen. Der Aufruf von DataView() als Funktion ohne new erzeugt jetzt einen {{jsxref("TypeError")}}.

+ +
var dv = DataView(buffer, 0);
+// TypeError: Das Aufrufen des DataView-Konstruktors ohne new ist verboten
+ +
var dv = new DataView(buffer, 0);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/prototype/index.html b/files/de/web/javascript/reference/global_objects/dataview/prototype/index.html new file mode 100644 index 0000000000..ea91eb795f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/prototype/index.html @@ -0,0 +1,109 @@ +--- +title: DataView.prototype +slug: Web/JavaScript/Reference/Global_Objects/DataView/prototype +tags: + - DataView + - JavaScript + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/DataView +--- +
{{JSRef}}
+ +

Die DataView.prototype Eigenschaft repräsentiert den Prototypen für das {{jsxref("DataView")}} Objekt.

+ +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

DataView Instanzen erben von DataView.prototype. Wie bei allen Konstruktoren, können Änderungen am Prototypen Änderungen in allen DataView Instanzen zur folge haben.

+ +

Eigenschaften

+ +
+
DataView.prototype.constructor
+
Spezifiziert die Funktion, die ein Objekt des Prototypen erstellt. Der initialwert ist der Standard eingebaute DataView Konstruktor
+
{{jsxref("DataView.prototype.buffer")}} {{readonlyInline}}
+
Der {{jsxref("ArrayBuffer")}}, der von dieser Ansicht repräsentiert wird. Wird bei der Erstellung erzeugt und deswegen kann nur lesend darauf zugegriffen werden.
+
{{jsxref("DataView.prototype.byteLength")}} {{readonlyInline}}
+
Die Länge (in Bytes) von dieser Ansicht, von Beginn des {{jsxref("ArrayBuffer")}}. Wird bei der Erstellung erzeugt und deswegen kann nur lesend darauf zugegriffen werden.
+
{{jsxref("DataView.prototype.byteOffset")}} {{readonlyInline}}
+
Das Offset (in Bytes) von dieser Ansicht, von Beginn des {{jsxref("ArrayBuffer")}}. Wird bei der Erstellung erzeugt und deswegen kann nur lesend darauf zugegriffen werden.
+
+ +

Methoden

+ +

Lesend

+ +
+
{{jsxref("DataView.prototype.getInt8()")}}
+
Gibt eine 8-Bit ganze Zahl mit Vorzeichen (byte) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getUint8()")}}
+
Gibt eine 8-Bit vorzeichenlose ganze Zahl (unsigned byte) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getInt16()")}}
+
Gibt eine 16-Bit ganze Zahl mit Vorzeichen (short) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getUint16()")}}
+
Gibt eine 16-Bit vorzeichenlose ganze Zahl (unsigned short) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getInt32()")}}
+
Gibt eine 32-Bit ganze Zahl mit Vorzeichen (long) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getUint32()")}}
+
Gibt eine 32-Bit vorzeichenlose ganze Zahl (unsigned long) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück.
+
{{jsxref("DataView.prototype.getFloat32()")}}
+
Gibt eine 32-Bit Gleitkommazahl mit Vorzeichen (float) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück
+
{{jsxref("DataView.prototype.getFloat64()")}}
+
Gibt eine 64-Bit Gleitkommazahl mit Vorzeichen (double) eines spezifizierten Byte-Offsets vom Start der Ansicht zurück
+
+ +

Schreibend

+ +
+
{{jsxref("DataView.prototype.setInt8()")}}
+
Speichert eine ganze 8-Bit Zahl mit Vorzeichen (byte) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setUint8()")}}
+
Speichert eine ganze vorzeichenlose 8-Bit Zahl (unsigned byte) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setInt16()")}}
+
Speichert eine ganze 16-Bit Zahl mit Vorzeichen (short) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setUint16()")}}
+
Speichert eine ganze vorzeichenlose 16-Bit Zahl (unsigned short) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setInt32()")}}
+
Speichert eine ganze 32-Bit Zahl mit Vorzeichen (long) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setUint32()")}}
+
Speichert eine ganze vorzeichenlose 32-Bit Zahl (unsigned long) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setFloat32()")}}
+
Speichert eine 32-Bit Gleitkommazahl mit Vorzeichen (float) an einem spezifizierten Offset vom Start der Ansicht.
+
{{jsxref("DataView.prototype.setFloat64()")}}
+
Speichert eine 64-Bit Gleitkommazahl mit Vorzeichen (double) an einem spezifizierten Offset vom Start der Ansicht.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-dataview.prototype', 'DataView.prototype')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-dataview.prototype', 'DataView.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.prototype")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setfloat32/index.html b/files/de/web/javascript/reference/global_objects/dataview/setfloat32/index.html new file mode 100644 index 0000000000..a7728311fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setfloat32/index.html @@ -0,0 +1,97 @@ +--- +title: DataView.prototype.setFloat32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setFloat32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setFloat32 +--- +
{{JSRef}}
+ +

Die setFloat32() Methode speichert eine 32-Bit Gleitkommazahl mit Vorzeichen (Float) am spezifizierten Offset der {{jsxref("DataView")}}.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setfloat32.html")}}
+ + + +

Syntax

+ +
dataview.setFloat32(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setFloat32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setFloat32(1, 3);
+dataview.getFloat32(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setfloat32', 'DataView.prototype.setFloat32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setfloat32', 'DataView.prototype.setFloat32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setFloat32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setfloat64/index.html b/files/de/web/javascript/reference/global_objects/dataview/setfloat64/index.html new file mode 100644 index 0000000000..8a0d9545e3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setfloat64/index.html @@ -0,0 +1,97 @@ +--- +title: DataView.prototype.setFloat64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setFloat64 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setFloat64 +--- +
{{JSRef}}
+ +

Die setFloat64() Methode speichert eine 64-Bit Gleitkommazahl mit Vorzeichen (Float) am spezifizierten Offset der {{jsxref("DataView")}}.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setfloat64.html")}}
+ + + +

Syntax

+ +
dataview.setFloat64(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 64 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setFloat64 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setFloat64(0, 3);
+dataview.getFloat64(0); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setfloat64', 'DataView.prototype.setFloat64')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setfloat64', 'DataView.prototype.setFloat64')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setFloat64")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setint16/index.html b/files/de/web/javascript/reference/global_objects/dataview/setint16/index.html new file mode 100644 index 0000000000..acbc44f22e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setint16/index.html @@ -0,0 +1,100 @@ +--- +title: DataView.prototype.setInt16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt16 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt16 +--- +
{{JSRef}}
+ +

Die setInt16() Methode speichert eine ganze 16-Bit Zahl mit Vorzeichen (Schort) am spezifizierten Offset der {{jsxref("DataView")}} ab.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setint16.html")}}
+ + + +

Syntax

+ +
dataview.setInt16(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 16 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Auftretende Errors

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setInt16 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setInt16(1, 3);
+dataview.getInt16(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setint16', 'DataView.prototype.setInt16')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setint16', 'DataView.prototype.setInt16')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setInt16")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setint32/index.html b/files/de/web/javascript/reference/global_objects/dataview/setint32/index.html new file mode 100644 index 0000000000..740fbb678d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setint32/index.html @@ -0,0 +1,100 @@ +--- +title: DataView.prototype.setInt32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt32 +--- +
{{JSRef}}
+ +

Die setInt32() Methode speichert eine ganze 32-Bit Zahl mit Vorzeichen (Long) am spezifizierten Offset der {{jsxref("DataView")}} ab.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setint32.html")}}
+ + + +

Syntax

+ +
dataview.setInt32(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setInt32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setInt32(1, 3);
+dataview.getInt32(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setint32', 'DataView.prototype.setInt32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setint32', 'DataView.prototype.setInt32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setInt32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setint8/index.html b/files/de/web/javascript/reference/global_objects/dataview/setint8/index.html new file mode 100644 index 0000000000..cdfc7b8bd5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setint8/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.setInt8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt8 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt8 +--- +
{{JSRef}}
+ +

Die setInt8() Methode speichert eine ganze 8-Bit Zahl mit Vorzeichen (Byte) am spezifizierten Offset der {{jsxref("DataView")}} ab.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setint8.html")}}
+ + + +

Syntax

+ +
dataview.setInt8(byteOffset, value)
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setInt8 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setInt8(1, 3);
+dataview.getInt8(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setint8', 'DataView.prototype.setInt8')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setint8', 'DataView.prototype.setInt8')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setInt8")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setuint16/index.html b/files/de/web/javascript/reference/global_objects/dataview/setuint16/index.html new file mode 100644 index 0000000000..912407d086 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setuint16/index.html @@ -0,0 +1,100 @@ +--- +title: DataView.prototype.setUint16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint16 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint16 +--- +
{{JSRef}}
+ +

Die setInt16() Methode speichert eine ganze vorzeichenlose 16-Bit Zahl (Unsigned Short) am spezifizierten Offset der {{jsxref("DataView")}} ab.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setuint16.html")}}
+ + + +

Syntax

+ +
dataview.setUint16(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 16 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Auftretende Errors

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setUint16 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setUint16(1, 3);
+dataview.getUint16(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setuint16', 'DataView.prototype.setUint16')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setuint16', 'DataView.prototype.setUint16')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setUint16")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setuint32/index.html b/files/de/web/javascript/reference/global_objects/dataview/setuint32/index.html new file mode 100644 index 0000000000..5cba529880 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setuint32/index.html @@ -0,0 +1,100 @@ +--- +title: DataView.prototype.setUint32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint32 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint32 +--- +
{{JSRef}}
+ +

Die setInt32() Methode speichert eine ganze vorzeichenlose 32-Bit Zahl (Unsigned Long) am spezifizierten Offset der {{jsxref("DataView")}} ab.

+ +
{{EmbedInteractiveExample("pages/js/dataview-setuint32.html")}}
+ + + +

Syntax

+ +
dataview.setUint32(byteOffset, value [, littleEndian])
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +
+
littleEndian
+
{{optional_inline}} Gibt an, ob die 32 Bit Zahl als {{Glossary("Endianness", "little- oder big-Endian")}} abgespeichert wird. Wenn false oder undefined angegewen ist, wird ein big-Endian gelesen.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setUint32 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setUint32(1, 3);
+dataview.getUint32(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setuint32', 'DataView.prototype.setUint32')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setuint32', 'DataView.prototype.setUint32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setUint32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/dataview/setuint8/index.html b/files/de/web/javascript/reference/global_objects/dataview/setuint8/index.html new file mode 100644 index 0000000000..dc293963a1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/dataview/setuint8/index.html @@ -0,0 +1,95 @@ +--- +title: DataView.prototype.setUint8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint8 +tags: + - DataView + - JavaScript + - Method + - Prototype + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint8 +--- +
{{JSRef}}
+ +
Die setInt8() Methode speichert eine ganze vorzeichenlose 8-Bit Zahl (Unsigned Byte) am spezifizierten Offset der {{jsxref("DataView")}} ab.
+ +
{{EmbedInteractiveExample("pages/js/dataview-setuint8.html")}}
+ + + +

Syntax

+ +
dataview.setUint8(byteOffset, value)
+ +

Parameter

+ +
+
byteOffset
+
Das Offset, in Bytes, vom Start der View, an dem die Daten gespeichert werden sollen.
+
+ +
+
value
+
Der Wert, der gespeichert werden soll.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Exceptions

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn byteOffset so gesetzt ist, dass hinter dem Ende der View geschrieben werden müsste.
+
+ +

Beispiele

+ +

Einsatz der setUint8 Methode

+ +
var buffer = new ArrayBuffer(8);
+var dataview = new DataView(buffer);
+dataview.setUint8(1, 3);
+dataview.getUint8(1); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt durch ECMAScript 2015.
{{SpecName('ES2015', '#sec-dataview.prototype.setuint8', 'DataView.prototype.setUint8')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA-Standard.
{{SpecName('ESDraft', '#sec-dataview.prototype.setuint8', 'DataView.prototype.setUint8')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.DataView.setUint8")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/@@toprimitive/index.html b/files/de/web/javascript/reference/global_objects/date/@@toprimitive/index.html new file mode 100644 index 0000000000..593369fe87 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/@@toprimitive/index.html @@ -0,0 +1,69 @@ +--- +title: 'Date.prototype[@@toPrimitive]' +slug: Web/JavaScript/Reference/Global_Objects/Date/@@toPrimitive +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/@@toPrimitive +--- +
{{JSRef}}
+ +
Die [@@toPrimitive]() Methode konvertiert ein {{jsxref("date")}} Objekt in einen primitiven Wert.
+ +
 
+ +

Syntax

+ +
Date()[Symbol.toPrimitive](hint);
+
+ +

Rückgabewert

+ +

Der primitive Wert des gegebenen {{jsxref("Date")}} Objektes. Abhängig vom übergebenen Parameter kann die Methode einen String oder eine Zahl zurückgeben.

+ +

Beschreibung

+ +

[@@toPrimitive]() ist eine Methode des {{jsxref("date")}} Objektes, welche einen primitiven Wert zurück gibt, was vom Typ number oder String sein kann.

+ +

Wenn der Parameter hint die Wert "string" oder "default" enthält, wird versucht die {{jsxref("Object.prototype.toString()", "toString")}} Methode aufzurufen. Wenn diese Methode nicht existiert, wird versucht die {{jsxref("Object.prototype.valueOf()", "valueOf")}} Methode aufzurufen. Wenn diese wiederum nicht existiert wirft [@@toPrimitive]() einen {{jsxref("TypeError")}}.

+ +

Wenn der Parameter hint den Wert "number" hat, wird als erstes versucht die  valueOf Methode aufzurufen. Wenn diese nicht existiert, wird die toString Methode aufgerufen.

+ +

JavaScript ruft die [@@toPrimitive]() auf, um ein Objekt in einen primitiven Wert zu konvertieren. Explizit muss man diese Methode extrem selten aufrufen. JavaScript ruft diese Methode automatisch auf, wenn ein Objekt an Stellen verwendet wird, an denen ein primitiver Wert erwartet wird.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-date.prototype-@@toprimitive', 'Date.prototype.@@toPrimitive')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-date.prototype-@@toprimitive', 'Date.prototype.@@toPrimitive')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.@@toPrimitive")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getday/index.html b/files/de/web/javascript/reference/global_objects/date/getday/index.html new file mode 100644 index 0000000000..28c185fe16 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getday/index.html @@ -0,0 +1,69 @@ +--- +title: Date.prototype.getDay() +slug: Web/JavaScript/Reference/Global_Objects/Date/getDay +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay +--- +
{{JSRef}}
+ +

Die getDay() Methode gibt den Tag der Woche eines Datums gemäß der Ortszeit zurück, wobei Sonntag durch den Wert 0 repräsentiert wird. Für den Tag des Monats gibt es die Methode {{jsxref("Date.prototype.getDate()", "getDate()")}}

+ +
{{EmbedInteractiveExample("pages/js/date-getday.html")}}
+ + + +

Syntax

+ +
dateObj.getDay()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 6, die den Tag der Woche des gegebenden Datums repräsentiert: 0 für Sonntag, 1 für Montag, 2 für Dienstag und so weiter.

+ +

Beispiele

+ +

Einsatz von getDay()

+ +

Im zweiten Statement wird die Variable weekday mit dem Wert 1 initialisiert. Dabei wird der Wert des {{jsxref("Date")}} object Xmas95 benutzt. 25. Dezember 1995 ist ein Montag.

+ +
var Xmas95 = new Date('December 25, 1995 23:15:30');
+var weekday = Xmas95.getDay();
+
+console.log(weekday); // 1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-date.prototype.getday', 'Date.prototype.getDay')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getDay")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getfullyear/index.html b/files/de/web/javascript/reference/global_objects/date/getfullyear/index.html new file mode 100644 index 0000000000..170b9cebfa --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getfullyear/index.html @@ -0,0 +1,88 @@ +--- +title: Date.prototype.getFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getFullYear +--- +
{{JSRef}}
+ +

Die getFullYear()  Methode gibt das Jahr eines Datums bezüglich der Ortszeit zurück.

+ +

Diese Methode wird anstatt der {{jsxref("Date.prototype.getYear()", "getYear()")}} eingesetzt.

+ +
{{EmbedInteractiveExample("pages/js/date-getfullyear.html")}}
+ + + +

Syntax

+ +
dateObj.getFullYear()
+ +

Rückgabewert

+ +

Eine Zahl, die das Jahr des gegebenen Datums bezüglich der lokalen Zeit angibt.

+ +

Beschreibung

+ +

Der von getFullYear() zurückgegebene Wert ist eine absolute Zahl. Für Daten zwischen den Jahren 1000 und 9999 gibt getFullYear() eine vier ziffrige Nummer zurück (z. B. 1995). Diese Methode wird eingesetzt, um sicherzustellen, dass auch Jahre nach 2000 richtig zurückgegeben werden.

+ +

Beispiele

+ +

Einsatz von getFullYear()

+ +

Im folgenden Beispiel wird die Variable year  mit dem aktuellen Jahr (4 Ziffern) initialisiert.

+ +
var today = new Date();
+var year = today.getFullYear();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.10', 'Date.prototype.getFullYear')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getFullYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/gethours/index.html b/files/de/web/javascript/reference/global_objects/date/gethours/index.html new file mode 100644 index 0000000000..c8036ad465 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/gethours/index.html @@ -0,0 +1,83 @@ +--- +title: Date.prototype.getHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/getHours +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getHours +--- +
{{JSRef}}
+ +

Die getHours() Methode gibt die Stunde eines Datums bezüglich der Ortszeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-gethours.html")}}
+ + + +

Syntax

+ +
dateObj.getHours()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 23, welche die Stunde der gegebenen Zeit bezüglich der lokalen Zeit angibt.

+ +

Beispiele

+ +

Einsatz von getHours()

+ +

Im zweiten Statement wird die Variable hours mit dem Wert 23 initialisiert. Dieses geschied mit dem Wert des {{jsxref("Global_Objects/Date", "Date")}} Objektes Xmas95.

+ +
var Xmas95 = new Date('December 25, 1995 23:15:30');
+var hours = Xmas95.getHours();
+
+console.log(hours); // 23
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.18', 'Date.prototype.getHours')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getHours")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getmilliseconds/index.html b/files/de/web/javascript/reference/global_objects/date/getmilliseconds/index.html new file mode 100644 index 0000000000..3238d48bbc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getmilliseconds/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.getMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds +--- +
{{JSRef}}
+ +

Die getMilliseconds() Methode gibt die Millisekunden eines Datums bezüglich der Ortszeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getmilliseconds.html")}}
+ + + +

Syntax

+ +
dateObj.getMilliseconds()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 999, welche die Millisekunden der gegebenen Zeit bezüglich der lokalen Zeit angibt.

+ +

Beispiele

+ +

Einsatz von getMilliseconds()

+ +

Im folgenden Beispiel wird die Variable milliseconds mit den aktuellen Millisekunden initialisiert:

+ +
var today = new Date();
+var milliseconds = today.getMilliseconds();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.24', 'Date.prototype.getMilliseconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getMilliseconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getminutes/index.html b/files/de/web/javascript/reference/global_objects/date/getminutes/index.html new file mode 100644 index 0000000000..ec541dc8fe --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getminutes/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.getMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMinutes +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMinutes +--- +
{{JSRef}}
+ +

Die getMinutes() Methode gibt die Minuten eines Datums bezüglich der Ortszeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getminutes.html")}}
+ +

Syntax

+ +
dateObj.getMinutes()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 59, welche die Minuten der gegebenen Zeit bezüglich der lokalen Zeit angibt.

+ +

Beispiele

+ +

Einsatz von getMinutes()

+ +

Im zweiten Statement wird die Variable minutes mit dem Wert 15 initialisiert. Dieses wird mit dem Wert des {{jsxref("Global_Objects/Date", "Date")}} Objektes Xmas95 erreicht.

+ +
var Xmas95 = new Date('December 25, 1995 23:15:30');
+var minutes = Xmas95.getMinutes();
+
+console.log(minutes); // 15
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.20', 'Date.prototype.getMinutes')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getminutes', 'Date.prototype.getMinutes')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getminutes', 'Date.prototype.getMinutes')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getMinutes")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getmonth/index.html b/files/de/web/javascript/reference/global_objects/date/getmonth/index.html new file mode 100644 index 0000000000..5c5d8ceed7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getmonth/index.html @@ -0,0 +1,83 @@ +--- +title: Date.prototype.getMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMonth +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMonth +--- +
{{JSRef}}
+ +

Die getMonth() Methode gibt den Monat eines Datums bezüglich der Ortszeit zurück. Diese Monat ist ein 0 basierter Wert (wobei 0 den ersten Monat des Jahres beschreibt).

+ +
{{EmbedInteractiveExample("pages/js/date-getmonth.html")}}
+ + + +

Syntax

+ +
dateObj.getMonth()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 11, welche den Monat des gegebenen Datums bezüglich der lokalen Zeit angibt. 0 steht für Januar, 1 für Februar und so weiter.

+ +

Beispiele

+ +

Einsatz von getMonth()

+ +

Im zweiten Statement wird der Variablen month der Wert 11 zugewiesen. Dieses geschiet auf Basis des {{jsxref("Date")}} Objektes Xmas95.

+ +
var Xmas95 = new Date('December 25, 1995 23:15:30');
+var month = Xmas95.getMonth();
+
+console.log(month); // 11
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.12', 'Date.prototype.getMonth')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getMonth")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getseconds/index.html b/files/de/web/javascript/reference/global_objects/date/getseconds/index.html new file mode 100644 index 0000000000..1cd8514b1b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getseconds/index.html @@ -0,0 +1,83 @@ +--- +title: Date.prototype.getSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getSeconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getSeconds +--- +
{{JSRef}}
+ +

Die getSeconds() Methode gibt die Sekunden eines Datums (Zeit) bezüglich der Ortszeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getseconds.html")}}
+ + + +

Syntax

+ +
dateObj.getSeconds()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 59, welche die Sekunden der gegebenen Zeit bezüglich der lokalen Zeit angibt.

+ +

Beispiele

+ +

Einsatz von getSeconds()

+ +

Im zweiten Statement wird der Variablen seconds der Wert 30 zugewiesen. Dieses geschiet auf Basis des {{jsxref("Date")}} Objektes Xmas95.

+ +
var Xmas95 = new Date('December 25, 1995 23:15:30');
+var seconds = Xmas95.getSeconds();
+
+console.log(seconds); // 30
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.22', 'Date.prototype.getSeconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getSeconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/gettime/index.html b/files/de/web/javascript/reference/global_objects/date/gettime/index.html new file mode 100644 index 0000000000..8c6eb521e1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/gettime/index.html @@ -0,0 +1,126 @@ +--- +title: Date.prototype.getTime() +slug: Web/JavaScript/Reference/Global_Objects/Date/getTime +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTime +--- +
{{JSRef}}
+ +

Die getTime() Methode gibt einen nummerischen Wert zurück, der die Zeit gemäß der Weltzeit (UTC) angibt.

+ +

getTime() nutzt immer die UTC für die Zeitrepräsentation. Zum Beispiel ist der Aufruf von getTime() in einer Zeitzone der gleiche Wert wie in einer anderen Zone.

+ +

Man kann diese Methode einsetzten, um ein anderes {{jsxref("Date")}} Objekt zu initialisieren. Diese Methode hat den gleichen Funktionsumfang wie die {{jsxref("Date.valueof", "valueOf()")}} Methode.

+ +
{{EmbedInteractiveExample("pages/js/date-gettime.html")}}
+ + + +

Syntax

+ +
dateObj.getTime()
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem gegebenen Zeitpunkt.

+ +

Beispiele

+ +

Einsatz von getTime() für das Kopieren von Daten

+ +

Erstellen eines {{jsxref("Date")}} Objektes mit identischem Zeitwert.

+ +
// Seit der Monat 0-basiert ist, ist birthday der 10. Januar 1995
+var birthday = new Date(1994, 12, 10);
+var copy = new Date();
+copy.setTime(birthday.getTime());
+
+ +

Ausführzeit Messen

+ +

Das Subtrahieren zweier getTime() Aufrufe auf {{jsxref("Date")}} Objekten, ergibt die Zeitspanne zwischen den beiden Aufrufen. Das kann eingesetzt werden, um die Ausführungszeit von Operationen zu berechnen. Auch die {{jsxref("Date.now()")}} Methode kann eingesetzt werden, um unnötiges Instanziieren von {{jsxref("Date")}} Objekten zu vermeiden.

+ +
var end, start;
+
+start = new Date();
+for (var i = 0; i < 1000; i++) {
+  Math.sqrt(i);
+}
+end = new Date();
+
+console.log('Operation took ' + (end.getTime() - start.getTime()) + ' msec');
+
+ +

Reduzierte Zeitpräzision

+ +

Um den Schutz vor Timing-Angriffen und Fingerabdrücken zu gewährleisten, kann die Genauigkeit von new Date().GetTime() abhängig von den Browsereinstellungen abgerundet werden.
+ In Firefox ist die privacy.resistFingerprinting Einstellung normalerweise eingeschaltet auf 20 us in Firefox 59; in 60 wird es 2 ms sein.

+ +
// reduced time precision disabled
+new Date().getTime();
+// 1519129755973
+// 1519129769481
+// 1519129808126
+// ...
+
+
+// reduced time precision enabled
+new Date().getTime();
+// 1519129853500
+// 1519129858900
+// 1519129864400
+// ...
+
+ +

In Firefox kann man zudem die Eigenschaft privacy.resistFingerprinting einschalten, die Präzision wird 100 ms sein oder man benutzt den Wert privacy.resistFingerprinting.reduceTimerPrecision.microseconds, wenn der Wert größer sein soll.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.9', 'Date.prototype.getTime')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.gettime', 'Date.prototype.getTime')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.gettime', 'Date.prototype.getTime')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getTime")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html b/files/de/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html new file mode 100644 index 0000000000..6d7cbb8442 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html @@ -0,0 +1,102 @@ +--- +title: Date.prototype.getTimezoneOffset() +slug: Web/JavaScript/Reference/Global_Objects/Date/getTimezoneOffset +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTimezoneOffset +--- +
{{JSRef}}
+ +

Die getTimezoneOffset() Methode gibt den Unterschied zwischen der aktuellen Ortszeit (Einstellungen des Hostsystems) und der Weltzeit (UTC) in Minuten zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-gettimezoneoffset.html")}}
+ + + +

Syntax

+ +
dateObj.getTimezoneOffset()
+ +

Rückgabewert

+ +

Eine Zahl, welche den Unterschied zwischen der aktuellen Ortszeit (Einstellung des Hostsystems) und der UTC in Minuten repräsentiert.

+ +

Beschreibung

+ +

Der Zeitzonen-Offset ist der Unterschied, in Minuten, zwischen der lokalen Zeit und der Weltzeit (UTC). Das bedeutet, dass die Anzahl der Minuten eine positive Zahl ist, wenn die lokale Zeit hinterher geht, und eine negative Zahl ist, wenn die lokale Zeit voraus geht. Zum Beispiel gibt die Methode für die Zeitzone UTC+10 (Ost Australische Standardzeit) -600 zurück.

+ + + + + + + + + + + + + + + + +
Aktuelle ZeitzoneUTC-8UTCUTC+3
Rückgabewert4800-180
+ +

Das zurückgegebene Zeitzonen-Offset ist immer das zu dem Date-Objekt zugehörige Offset. Wenn das Hostsystem für die Sommerzeit konfiguriert ist, ändert sich das Offset je nach Datum und Uhrzeit des Datums und der Sommerzeit.

+ +

Beispiele

+ +

Einsatz von getTimezoneOffset()

+ +
// Gibt das aktuelle Zeitzonen-Offset für das Hostsystem zurück.
+var x = new Date();
+var currentTimeZoneOffsetInHours = x.getTimezoneOffset() / 60;
+// 1
+
+// Gibt das Zeitzonen Offset des Internationalen Tag der Arbeit (1. Mai) in 2016 zurück.
+// Vorsicht beim Einsatz des Date() Konstruktors, denn dieser Benutzt den 0-indizierten Monat
+// so dass Mai durch 4 (und nicht durch 5) repräsentiert wird.
+var labourDay = new Date(2016, 4, 1);
+var labourDayOffset = labourDay.getTimezoneOffset() / 60;
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.26', 'Date.prototype.getTimezoneOffset')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.gettimezoneoffset', 'Date.prototype.getTimezoneOffset')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.gettimezoneoffset', 'Date.prototype.getTimezoneOffset')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getTimezoneOffset")}}

diff --git a/files/de/web/javascript/reference/global_objects/date/getutcdate/index.html b/files/de/web/javascript/reference/global_objects/date/getutcdate/index.html new file mode 100644 index 0000000000..4d85c3b3b8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcdate/index.html @@ -0,0 +1,80 @@ +--- +title: Date.prototype.getUTCDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCDate +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCDate +--- +
{{JSRef}}
+ +

Die getUTCDate() Methode gibt den Tag des Monats eines Datums bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcdate.html")}}
+ +

Syntax

+ +
dateObj.getUTCDate()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 1 und 31, die den Tag des Monats des gegebenen Datums bezüglich der Weltzeit (UTC) angibt.

+ +

Beispiele

+ +

Einsatz von getUTCDate()

+ +

Das folgende Beispiel weißt der Variablen day den Tag des aktullen Datums zu.

+ +
var today = new Date();
+var day = today.getUTCDate();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.15', 'Date.prototype.getUTCDate')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcdate', 'Date.prototype.getUTCDate')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcdate', 'Date.prototype.getUTCDate')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCDate")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcday/index.html b/files/de/web/javascript/reference/global_objects/date/getutcday/index.html new file mode 100644 index 0000000000..445e09aae3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcday/index.html @@ -0,0 +1,82 @@ +--- +title: Date.prototype.getUTCDay() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCDay +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCDay +--- +
{{JSRef}}
+ +

Die getUTCDay() Methode gibt den Wochentag eines Datums bezüglich der Weltzeit zurück. 0 steht für Sonntag.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcday.html")}}
+ + + +

Syntax

+ +
dateObj.getUTCDay()
+ +

Rückgabewert

+ +

Eine ganze Zahl, die einen Wochentag des gegebenen Datums bezüglich der Weltzeit (UTC) repräsentiert. 0 steht für Sonntag, 1 für Montag, 2 für Dienstag und so weiter.

+ +

Beispiele

+ +

Einsatz von getUTCDay()

+ +

Im folgenden Beispiel wird der aktuelle Wochentag der Variablen weekday zugewiesen.

+ +
var today = new Date();
+var weekday = today.getUTCDay();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.17', 'Date.prototype.getUTCDay')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcday', 'Date.prototype.getUTCDay')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcday', 'Date.prototype.getUTCDay')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCDay")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcfullyear/index.html b/files/de/web/javascript/reference/global_objects/date/getutcfullyear/index.html new file mode 100644 index 0000000000..0c273c4af9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcfullyear/index.html @@ -0,0 +1,85 @@ +--- +title: Date.prototype.getUTCFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear +--- +
{{JSRef}}
+ +

Die getUTCFullYear() Methode gibt das Jahr eines Datums bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcfullyear.html")}}
+ + + +

Syntax

+ +
dateObj.getUTCFullYear()
+ +

Rückgabewert

+ +

Eine Zahl, die das Jahr des gegebenen Datums bezüglich der Weltzeit (UTC) angibt.

+ +

Beschreibung

+ +

Der von getUTCFullYear() zurückgegebene Wert ist eine absolute Zahl, die das Jahr (4-stellig) repräsentiert (z. B. 1995).

+ +

Beispiele

+ +

Einsatz von getUTCFullYear()

+ +

Im folgenden Beispiel wird die Variable year mit dem aktuellen Jahr (4-stellig) bezüglich der Weltzeit beschrieben.

+ +
var today = new Date();
+var year = today.getUTCFullYear();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.11', 'Date.prototype.getUTCFullYear')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCFullYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutchours/index.html b/files/de/web/javascript/reference/global_objects/date/getutchours/index.html new file mode 100644 index 0000000000..b11d3df06f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutchours/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.getUTCHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours +--- +
{{JSRef}}
+ +

Die getUTCHours() Methode gibt die Stunden eines Datums bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutchours.html")}}
+ + + +

Syntax

+ +
dateObj.getUTCHours()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 23, die die Stunde des gegebenen date Objektes bezüglich der Weltzeit (UTC) angibt.

+ +

Beispiele

+ +

Einsatz von getUTCHours()

+ +

Im folgenden Beispiel wird der Variablen hours die aktuelle Stunde der Weltzeit zugewiesen.

+ +
var today = new Date();
+var hours = today.getUTCHours();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.19', 'Date.prototype.getUTCHours')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCHours")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html b/files/de/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html new file mode 100644 index 0000000000..d44ece54d3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html @@ -0,0 +1,79 @@ +--- +title: Date.prototype.getUTCMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMilliseconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMilliseconds +--- +
{{JSRef}}
+ +

Die getUTCMilliseconds() Methode gibt die Millisekunden eines Datums bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcmilliseconds.html")}}
+ +

Syntax

+ +
dateObj.getUTCMilliseconds()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 999, die die Millisekunden des gegebenen date Objektes bezüglich der Weltzeit (UTC) angibt.

+ +

Beispiele

+ +

Einsatz von getUTCMilliseconds()

+ +

Im folgenden Beispiel wird der Variablen milliseconds die aktuellen Millisekunden der Weltzeit zugewiesen.

+ +
var today = new Date();
+var milliseconds = today.getUTCMilliseconds();
+
+ +

Spezifikationer

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.25', 'Date.prototype.getUTCMilliseconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcmilliseconds', 'Date.prototype.getUTCMilliseconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcmilliseconds', 'Date.prototype.getUTCMilliseconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCMilliseconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcminutes/index.html b/files/de/web/javascript/reference/global_objects/date/getutcminutes/index.html new file mode 100644 index 0000000000..e2f039b987 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcminutes/index.html @@ -0,0 +1,79 @@ +--- +title: Date.prototype.getUTCMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMinutes +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMinutes +--- +
{{JSRef}}
+ +

Die getUTCMinutes() Methode gibt die Minuten eines Datums bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcminutes.html")}}
+ +

Syntax

+ +
dateObj.getUTCMinutes()
+ +

Rückgabewert

+ +

Eine ganze Zahl wzischen 0 und 59, die die Minuten des gegebenen date Objektes bezüglich der Weltzeit (UTC) angibt.

+ +

Beispiele

+ +

Einsatz von getUTCMinutes()

+ +

Im Folgenden Beispiel wird der Variablen minutes die aktuelle Minute der Weltzeit zugewiesen.

+ +
var today = new Date();
+var minutes = today.getUTCMinutes();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.21', 'Date.prototype.getUTCMinutes')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcminutes', 'Date.prototype.getUTCMinutes')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcminutes', 'Date.prototype.getUTCMinutes')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCMinutes")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcmonth/index.html b/files/de/web/javascript/reference/global_objects/date/getutcmonth/index.html new file mode 100644 index 0000000000..3de532c78a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcmonth/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.getUTCMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMonth +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMonth +--- +
{{JSRef}}
+ +

Die getUTCMonth() Methode gibt den Monat eines Datums bezüglich der Weltzeit zurück. Dieser Wert ist 0-basierend (0 steht für den ersten Monat im Jahr).

+ +
{{EmbedInteractiveExample("pages/js/date-getutcmonth.html")}}
+ + + +

Syntax

+ +
dateObj.getUTCMonth()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 11, die den Monat des gegebenen Datums bezüglich der Weltzeit (UTC) angibt. 0 steht für Januar, 1 für Februar, 2 für März und so weiter.

+ +

Beispiele

+ +

Einsatz von getUTCMonth()

+ +

Das folgende Beispiel weist der month Variable den aktuellen Monat zu.

+ +
var today = new Date();
+var month = today.getUTCMonth();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.13', 'Date.prototype.getUTCMonth')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcmonth', 'Date.prototype.getUTCMonth')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcmonth', 'Date.prototype.getUTCMonth')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCMonth")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getutcseconds/index.html b/files/de/web/javascript/reference/global_objects/date/getutcseconds/index.html new file mode 100644 index 0000000000..55ca03eb8f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getutcseconds/index.html @@ -0,0 +1,79 @@ +--- +title: Date.prototype.getUTCSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCSeconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCSeconds +--- +
{{JSRef}}
+ +

Die getUTCSeconds() Methode gibt die Sekunden der Zeit bezüglich der Weltzeit zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-getutcseconds.html")}}
+ +

Syntax

+ +
dateObj.getUTCSeconds()
+ +

Rückgabewert

+ +

Eine ganze Zahl zwischen 0 und 59, die die Sekunden des gegebenen Date-Objektes bezüglich der Weltzeit (UTC) angibt.

+ +

Beispiele

+ +

Einsatz von getUTCSeconds()

+ +

Das folgende Beispiel weist der Variablen seconds die aktuelle Sekunde zu.

+ +
var today = new Date();
+var seconds = today.getUTCSeconds();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.23', 'Date.prototype.getUTCSeconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.getutcseconds', 'Date.prototype.getUTCSeconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.getutcseconds', 'Date.prototype.getUTCSeconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getUTCSeconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/getyear/index.html b/files/de/web/javascript/reference/global_objects/date/getyear/index.html new file mode 100644 index 0000000000..1c7ef8baba --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/getyear/index.html @@ -0,0 +1,127 @@ +--- +title: Date.prototype.getYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getYear +tags: + - Date + - Deprecated + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getYear +--- +
{{JSRef}} {{deprecated_header}}
+ +

Die getYear() Methode gibt das Jahr eines Datums bezüglich der Ortszeit zurück. Weil getYear() nicht das ganze Jahr zurück gibt (das "Jahr 2000 Problem"), wird es nicht weiter eingesetzt und wird von der Methode {{jsxref("Date.prototype.getFullYear", "getFullYear()")}} ersetzt.

+ +

Syntax

+ +
dateObj.getYear()
+ +

Rückgabewert

+ +

Eine Zahl, welche das Jahr minus 1900 des gegebenen Datums bezüglich der lokalen Zeit angibt.

+ +

Beschreibung

+ + + +

Um mit Jahren vor und nach 2000 umgehen zu können, sollte stattdessen die Methode {{jsxref("Date.prototype.getFullYear", "getFullYear()")}} eingesetzt werden. Diese gibt das vollständige Jahr zurück.

+ +

Rückwärtskompatibilität

+ +

Verhalten in JavaScript 1.2 und früher

+ +

Die getYear() Methode gibt entweder ein 2-stelliges oder 4-stelliges Jahr zurück.

+ + + +

Beispiele

+ +

Jahre zwischen 1900 und 1999

+ +

Das zweite Statement initialisiert die Variable year mit dem Wert 95.

+ +
var Xmas = new Date('December 25, 1995 23:15:00');
+var year = Xmas.getYear(); // returns 95
+
+ +

Jahre nach 1999

+ +

Das zweite Statement initialisiert die Variable year mit dem Wert 100.

+ +
var Xmas = new Date('December 25, 2000 23:15:00');
+var year = Xmas.getYear(); // returns 100
+
+ +

Jahre vor 1900

+ +

Das zweite Statement initialisiert die Variable year mit dem Wert -100.

+ +
var Xmas = new Date('December 25, 1800 23:15:00');
+var year = Xmas.getYear(); // returns -100
+
+ +

Setzen und bekommen von Jahren zwischen 1900 und 1999

+ +

Das zweite Statement initialisiert die Variable year mit dem Wert 95, was für das Jahr 1995 steht.

+ +
var Xmas = new Date('December 25, 2015 23:15:00');
+Xmas.setYear(95);
+var year = Xmas.getYear(); // returns 95
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-B.2.4', 'Date.prototype.getYear')}}{{Spec2('ES5.1')}} +

Definiert in dem (informativen) Kompatibilitäts-Anhang

+
{{SpecName('ES6', '#sec-date.prototype.getyear', 'Date.prototype.getYear')}}{{Spec2('ES6')}}Definiert in dem (normativ) Anhang für zusätzliche Funktionen für Web-Browser.
{{SpecName('ESDraft', '#sec-date.prototype.getyear', 'Date.prototype.getYear')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.getYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/index.html b/files/de/web/javascript/reference/global_objects/date/index.html new file mode 100644 index 0000000000..75346dfbc4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/index.html @@ -0,0 +1,230 @@ +--- +title: Date +slug: Web/JavaScript/Reference/Global_Objects/Date +tags: + - Date + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Date +--- +

{{JSRef}}

+ +

Erstellt eine JavaScript Date Instanz, die einen einzelnen Moment der Zeit repräsentiert. Date Objekte basieren auf dem Zeitwert, der der Anzahl der Millisekunden seit dem 1. Januar 1970 (UTC) entspricht.

+ +

{{EmbedInteractiveExample("pages/js/date-constructor.html")}}

+ +

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

+ +

Syntax

+ +
new Date();
+new Date(value);
+new Date(dateString);
+new Date(year, monthIndex [, day [, hour [, minutes [, seconds [, milliseconds]]]]]);
+
+ +

Anmerkung: Ein JavaScript Date Objekt kann nur instanziiert werden, wenn JavaScript Date als ein Konstruktor aufgerufen wird: Beim Aufrufen als reguläre Funktion (z. B. ohne den {{jsxref("Operators/new", "new")}} Operator) gibt die Funktion einen String zurück und kein Date Objekt. Anders als andere JavaScript-Datentypen hat das Date Objekt keine Literalsyntax.

+ +

Parameter

+ +

Anmerkung: Das Argument monthIndex ist 0-basiert. Das bedeutet, dass 0 = Januar und 11 = Dezember ist.

+ +

Anmerkung: Wenn Date als Konstruktor mit mehr als einem Argument aufgerufen wird und die übergebenen Werte größer als ihr logischer Bereich sind (z. B. 13 wird als Monat genutzt oder 70 wird als Minutenwert eingesetzt) wird der angrenzende Wert angepasst. Z. B. ist new Date(2013, 13, 1) äquivalent zu new Date(2014, 1, 1. Beide Ausdrücke erstellen das Datum 2014-02-01 (Monate fangen bei 0 an). Das gleiche gilt für folgende Werte: new Date(2013, 2, 1, 0, 70) ist äquivalent zu new Date(2013, 2, 1, 1, 10), was beides den Zeitpunkt 2013-03-01T01:10:00 erzeugt.

+ +

Anmerkung: Wenn Date als Konstruktor mit mehr als einem Argumenten aufgerufen wird, werden die Argumente als Ortszeiten interpretiert. Wenn die Weltzeit genutzt werden soll, muss new Date({{jsxref("Date.UTC()", "Date.UTC(...)")}}) mit den gleichen Argumenten genutzt werden.

+ +
+
value
+
Ganze Zahl, die die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC (Unixzeit) repräsentiert.
+
+ +
+
dateString
+
String der ein Datum repräsentiert. Der String muss in einem Format vorliegen, der von der {{jsxref("Date.parse()")}} Methode eingelesen werden kann (IETF-compliant RFC 2822 Zeitstempel und auch eine Version von ISO8601). +

Anmerkung: Von dem Einlesen eines Zeitstempel-Strings durch den Date Konstruktor (und Date.parse, denn diese Funktion ist äquivalent) wird stark abgeraten, wegen der Unterschiede in den Browsern und Inkonsistenzen. Die Unterstützung für RFC 2822 formatierte Strings ist nur eine Konvention. Unterstützung für ISO 8601 formatierte Strings unterscheidet sich in den Strings mit nur einem Datum (z. B. "1970-01-01") werden nur als UTC behandelt und nicht als lokales Daten.

+
+
+ +
+
year
+
Ganze Zahl, die die Jahre repräsentiert. Werte von 0 bis 99 werden zu den Jahren 1900 bis 1999 umgewandelt. Siehe das  {{anch("Zwei_ziffrige_Zahlen_für_die_Jahre_1900_-_1999", "Beispiel unten")}}.
+
+ +
+
monthIndex
+
Ganze Zahl, die den Monat repräsentiert. Die Zahl beginnt bei 0 für Januar und endet bei 11 für Dezember.
+
+ +
+
day
+
Ganze Zahl, die den Tag des Monats repräsentiert.
+
+ +
+
hour
+
Ganze Zahl, die die Stunde des Tages repräsentiert.
+
+ +
+
minute
+
Ganze Zahl, die die Minuten einer Stunde repräsentiert.
+
+ +
+
second
+
Ganze Zahl, die die Sekunden einer Minute repräsentiert.
+
+ +
+
millisecond
+
Ganze Zahl, die die Millisekunden einer Sekunde repräsentiert.
+
+ +

Beschreibung

+ + + +

Eigenschaften

+ +
+
{{jsxref("Date.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zum JavaScript Date Objekt.
+
Date.length
+
Der Wert von Date.length ist 7. Dieser ist die Anzahl der Argumente, die vom Konstruktor gehändelt werden.
+
+ +

Methoden

+ +
+
{{jsxref("Date.now()")}}
+
Gibt den nummerischen Wert der aktuellen Zeit an - die Anzahl der Millisekunden die seit dem 1. Januar 1970 00:00:00 UTC vergangen sind.
+
{{jsxref("Date.parse()")}}
+
Analysiert eine String-Repräsentation eines Datums und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC zurück. +

Anmerkung: Von der Nutzung der Date.parse Methode wird stark abgeraten wegen der Unterschiede und Widersprüche in verschiedenen Browsern.

+
+
{{jsxref("Date.UTC()")}}
+
Akzeptiert die gleichen Parameter wie die längste Form des Konstruktors (z. B. 2 bis 7) und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC zurück.
+
+ +

JavaScript Date Instanzen

+ +

Alle Date Instanzen erben von {{jsxref("Date.prototype")}}. Das Prototype Objekt des Date Konstruktors kann modifiziert werden, um alle Date Instanzen zu ändern.

+ +

Methoden

+ +

{{ page("/de/docs/Web/JavaScript/Reference/Global_Objects/Date/prototype", "Methoden") }}

+ +

Beispiele

+ +

Verschiedene Wege ein Date Objekt zu erstellen

+ +

Das folgende Beispiel zeigt verschiedene Wege, um JavaScript {{jsxref("Date")}} Objekte zu erstellen:

+ +

Anmerkung: Von der Nutzung des Date Konstruktors mit einem String-Argument (und der Date.parse Methode) wird wegen der Unterschiede und Widersprüche in verschiedenen Browsern abgeraten.

+ +
var today = new Date();
+var birthday = new Date("December 17, 1995 03:24:00");
+var birthday = new Date("1995-12-17T03:24:00");
+var birthday = new Date(1995,11,17);
+var birthday = new Date(1995,11,17,3,24,0);
+
+ +

Zwei ziffrige Zahlen für die Jahre 1900 - 1999

+ +

Um Daten in den Jahren 0 bis 99 zu erzeugen und abzufragen, müssen die Methoden {{jsxref("Date.prototype.setFullYear()")}} und {{jsxref("Date.prototype.getFullYear()")}} eingesetzt werden.

+ +
var date = new Date(98, 1); // Sun Feb 01 1998 00:00:00 GMT+0000 (GMT)
+
+// Deprecated Methode, 98 wird hier zu 1998
+date.setYear(98);           // Sun Feb 01 1998 00:00:00 GMT+0000 (GMT)
+
+date.setFullYear(98);       // Sat Feb 01 0098 00:00:00 GMT+0000 (BST)
+ +

Berechnen von vergangener Zeit

+ +

Die folgenden Beispiele zeigen, wie man die vergangene Zeit zwischen zwei JavaScript dates in Millisekunden berechnet.

+ +

Durch die unterschiedlichen Längen von Tagen (wegen der Sommer/Winter Zeitumstellung), Monaten und Jahren gibt es bei Zeiteinheiten größer als Stunden, Minuten und Sekunden eine Reihe von Problemen, die vorher recherchiert und abgeprüft werden sollten.

+ +
// Einsatz Date Objekts
+var start = Date.now();
+
+// Event was einige Zeit braucht:
+doSomethingForALongTime();
+var end = Date.now();
+var elapsed = end - start; // elapsed time in milliseconds
+
+ +
// Einsatz Eingebauter Methoden
+var start = new Date();
+
+// Event was einige Zeit braucht:
+doSomethingForALongTime();
+var end = new Date();
+var elapsed = end.getTime() - start.getTime(); // elapsed time in milliseconds
+
+ +
// Testen einer funktion und Rückgabe des Rückgabewertes
+function printElapsedTime (fTest) {
+	var nStartTime = Date.now(),
+            vReturn = fTest(),
+            nEndTime = Date.now();
+
+	alert("Elapsed time: " + String(nEndTime - nStartTime) + " milliseconds");
+	return vReturn;
+}
+
+yourFunctionReturn = printElapsedTime(yourFunction);
+
+ +

Anmerkung: In Browsern, die die hochauflösende Zeitfunktionen von der {{domxref("window.performance", "Web Performance API", "", 1)}} unterstützen, kann {{domxref("Performance.now()")}} bessere und präzisere Messergebnisse liefern als {{jsxref("Date.now()")}}.

+ +

Die Anzahl der Sekunden seit der Unix Epoche ermitteln

+ +
var seconds = Math.floor(Date.now() / 1000);
+ +

In diesem Fall ist es wichtig, nur eine ganze Zahl zurückzugeben (eine einfache Division würde nicht reichen) und auch nur tatsächlich verstrichene Sekunden zurückzugeben (deswegen nutzt der Quelltext die {{jsxref("Math.floor()")}} Funktion und nicht die {{jsxref("Math.round()")}} Funktion).

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.9', 'Date')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-date-objects', 'Date')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-date-objects', 'Date')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

+ +

{{Compat("javascript.builtins.Date")}}

diff --git a/files/de/web/javascript/reference/global_objects/date/now/index.html b/files/de/web/javascript/reference/global_objects/date/now/index.html new file mode 100644 index 0000000000..e275650960 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/now/index.html @@ -0,0 +1,105 @@ +--- +title: Date.now() +slug: Web/JavaScript/Reference/Global_Objects/Date/now +tags: + - Date + - JavaScript + - MakeBrowserAgnostic + - Method + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Date/now +--- +
{{JSRef}}
+ +

Die Date.now() Methode gibt die Anzahl der Millisekunden, die seit dem 01.01.1970 00:00:00 UTC vergangen sind zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-now.html")}}
+ +

Syntax

+ +
var timeInMs = Date.now();
+
+ +

Rückgabewert

+ +

Eine {{jsxref("Number", "Zahl")}}, die die vergangenen Millisekunden seit dem 1. Januar 1970 00:00:00 Weltzeit (UTC) angibt (UNIX-Zeit).

+ +

Beschreibung

+ +

Da now eine statische Methode von Date ist, kann es immer so verwendet werden: Date.now()

+ +

Reduzierte Zeitpräzision

+ +

Um den Schutz vor Timing-Angriffen und Fingerabdrücken zu gewährleisten, kann die Genauigkeit von new Date().getTime() abhängig von den Browsereinstellungen abgerundet werden.
+ In Firefox ist die privacy.resistFingerprinting Einstellung normalerweise eingeschaltet auf 20 us in Firefox 59; in 60 wird es 2 ms sein.

+ +
// reduced time precision disabled
+new Date().getTime();
+// 1519129755973
+// 1519129769481
+// 1519129808126
+// ...
+
+
+// reduced time precision enabled
+new Date().getTime();
+// 1519129853500
+// 1519129858900
+// 1519129864400
+// ...
+
+ +

In Firefox kann man zudem die Eigenschaft privacy.resistFingerprinting einschalten, die Präzision wird 100 ms sein oder man benutzt den Wert privacy.resistFingerprinting.reduceTimerPrecision.microseconds, wenn der Wert größer sein soll.

+ +

Polyfill

+ +

Diese Methode wurde in in ECMA-262 5th edition standardisiert. Engines die noch nicht hinsichtlich diesen Standards aktualisiert wurden können den folgenden shim verwenden, um die Methode verfügbar zu machen:

+ +
if (!Date.now) {
+  Date.now = function now() {
+    return new Date().getTime();
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.9.4.4', 'Date.now')}}
+ Implemented in JavaScript 1.5
{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES6', '#sec-date.now', 'Date.now')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-date.now', 'Date.now')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.now")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/parse/index.html b/files/de/web/javascript/reference/global_objects/date/parse/index.html new file mode 100644 index 0000000000..4920cdb6a8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/parse/index.html @@ -0,0 +1,173 @@ +--- +title: Date.parse() +slug: Web/JavaScript/Reference/Global_Objects/Date/parse +tags: + - Date + - JavaScript + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/parse +--- +
{{JSRef}}
+ +

Die Date.parse() Methode liest eine String-Repräsentation eines Datums ein und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC oder NaN, wenn der String kein Datum ist oder manchmal wenn einige Datums- oder Zeitwerte einen falschen Wert haben (z. B. 2015-02-31), zurück.

+ +

Es ist bis ES5 nicht empfohlen die Date.parse Methode einzusetzten, weil das Einlesen von Strings implementierungsabhängig war. Es gibt sehr viele Unterschiede wie verschiedene Implementierungen strings einlesen, weshalb Strings manuell eingelesen werden sollten (eine Bibliothek kann helfen, wenn viele Formate eingesetzt werden sollen).

+ +
{{EmbedInteractiveExample("pages/js/date-parse.html")}}
+ + + +

Syntax

+ +

Direkter Aufruf:

+ +
Date.parse(dateString)
+ +

Impliziter Aufruf:

+ +
new Date(dateString)
+ +

Parameter

+ +
+
dateString
+
Ein String, der ein RFC2822 oder (eine Variante des) ISO 8601 Datumsformat (mit Zeit) repräsentiert (andere Formate können manchmal eingesetzt werden, jedoch ist das Ergebnis manchmal unerwartet).
+
+ +

Rückgabewert

+ +

Eine Zahl, die die Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem Datum, das in dem übergebenen Parameter repräsentiert wird. Wenn der Parameter kein valides Datum repräsentiert, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Die parse() Methode bekommt ein Datumsstring (z. B. "Dec 25, 1995" ) und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC zurück. Diese Funktion ist nützlich, um Datumswerte mithilfe eines Stringswertes einzustellen, (z. B. im zusammenhang mit der {{jsxref("Date.prototype.setTime()", "setTime()")}} Methode und dem {{jsxref("Global_Objects/Date", "Date")}} Objekt).

+ +

Bei einer Stringrepräsentation mit einer Zeit, gibt die parse() Methode die Zeitwert zurück. Es wird die RFC2822 / IETF Datums Syntax (RFC2822 Section 3.3) unterstützt (z. B. "Mon, 25 Dec 1995 13:30:00 GMT"). Die Methode versteht die kontimentalen US Zeitzonenabkürzungen, jedoch sollte lieber der Zeitzonenunterschied angegeben werden, wie zum Beispiel  "Mon, 25 Dec 1995 13:30:00 +0430" (4 Stunden und 30 Minuten östlich vom Greenwich Meridian).

+ +

GMT und UTC werden gleich berücksichtigt. Die lokale Zeitzone wird eingesetzt um Argumente im RFC2822 Kapitel 3.3 Format zu interpretieren, welche keine Zeitzoneninformationen enthalten.

+ +

Wegen der Unterschiede beim einlesen von Datums Strings, ist es empfohlen das Einlesen eines Datums immer manuell durchzuführen, wenn das Ergebnisse inkonsistent sind, besonders über verschiedene ECMAScript Implementierungen hinweg, wo Strings wie "2015-10-12 12:00:00" manchmal zu NaN, UTC oder lokaler Zeitzone eingelesen werden.

+ +

ECMAScript 5 ISO-8601 Format Unterstützung

+ +

Der Datums- / Zeit-String ist manchmal im einfachen ISO 8601 Format. Zum Beispiel können "2011-10-10" (nur ein Datum) oder "2011-10-10T14:48:00" (Datum und Zeit) übergeben und eingelesen werden. Wenn der String ein ISO 8601 Datum (ohne Zeit) ist, wird die UTC Zeitzone eingesetzt, um die Argumente zu interpretieren. Wenn der String Datums- und Zeitangaben im ISO 8601 Format enthällt, wird dieses als lokale Zeit interpretiert.

+ +

Weil Zeitzonen im String enthalten sein können und interpretiert werden können, wird immer die Anzahl der Millisekunden zwischen dem repräsentierten Datum und dem 1. Januar 1970 00:00:00 UTC oder NaN zurückgegeben.

+ +

Weil parse() eine statische Methode von {{jsxref("Date")}} ist, wird diese mit Date.parse() aufgerufen und nicht als Methode einer {{jsxref("Date")}} Instanz.

+ +

Unterschiede in erwarteten Zeitzonen

+ +

Wenn der Datumsstring  "March 7, 2014" gegeben ist, nimmt parse() dabei die lokale Zeitzone an. Ist hingegen ein ISO Format wie "2014-03-07" angegeben, so wird eine UTC Zeitzone angenommen (ES5 und ECMAScript 2015). Deshalb können die so erstellten {{jsxref("Date")}} Objekte einen unterschiedlichen Zeitpunkt repräsentieren. Dieses ist von der ECMAScript Version abhängig wenn das System mit einer lokalen UTC Zeit eingestellt ist. Das bedeutet, dass zwei Strings mit einem äquivalenten Datum (Unterschied in der Formatierung) zu zwei verschiednenen Ergebnissen führen kann.

+ +

Fall-back für implementierungsspezifische Datumsformate

+ +

Die ECMAScript Spezifikation besagt: Wenn ein String nicht dem Standardformat entspricht, nutzen die Funktionen eine Fall-back-Lösung in Form einer implementierungsabhängigen Heuristik oder eines implementierungsabhängigen Algorithmus. Unkenntliche Strings oder Daten, die nicht valide Werte  von ISO formattierten Elementen haben, führen dazu, dass Date.parse() den Wert {{jsxref("NaN")}} zurückgibt.

+ +

Immer, wenn ein String nicht im einfachen ISO Format ist (ECMA-252) und nicht valide Datumswerte enthällt, ist es vom Wert und vom Browser abhängig, ob {{jsxref("NaN")}} zurückgegeben wird oder nicht. Z. B.:

+ +
// Kein-ISO String: Mit nicht validen Datumswerten
+new Date('23/25/2014');
+ +

Führt zu den Datum 25. November 2015 (Ortszeit) in Firefox 30 und zu einem nicht validen Datum in Safari 7. Immer, wenn Strings als ISO Format erkannt werden und diese nicht valider Werte enthalten, wird von allen Browsern, die mindestens ES5 unterstützen, {{jsxref("NaN")}} zurückgegeben:

+ +
// ISO String mit nicht validen Werten
+new Date('2014-25-23').toISOString();
+// returns "RangeError: invalid date" in allen es5 kompatiblen Browsern
+ +

SpiderMonkey's implementierungsabhängige Heuristik kann in der jsdate.cpp-Datei gefunden werden. Der String "10 06 2014" ist ein Beispiel für einen nicht konformen ISO formatierten String und dieses wird durch die implementierungsabhängige Heuristik abgearbeitet. Siehe zudem diese grobe Übersicht an, wie das Analysieren funktioniert.

+ +
new Date('10 06 2014');
+ +

Wird das Datum 6. Oktober 2014 (Ortszeit) erzeugen und nicht den 10 Juni 2014. Andere Beispiele:

+ +
new Date('foo-bar 2014').toString();
+// returns: "Invalid Date"
+
+Date.parse('foo-bar 2014');
+// returns: NaN
+ +

Beispiele

+ +

Einsatz von Date.parse()

+ +

Wenn IPOdate ein existierendes {{jsxref("Date")}} Objekt ist, kann es auf den 9. August 1995 (Ortszeit) gesetzt werden:

+ +
IPOdate.setTime(Date.parse('Aug 9, 1995'));
+ +

Das gleich Beispiel für das Analysieren von nicht-Standarddatumsstrings:

+ +
Date.parse('Aug 9, 1995');
+ +

Gibt den Wert 807937200000 in der Zeitzone GMT-0300 zurück und andere Werte in anderen Zeitzonen, wenn im String keine Zeitzone definiert ist und es kein ISO formatiertes Datum ist. Deswegen wird als Standardwert die Ortszeit genutzt.

+ +
Date.parse('Wed, 09 Aug 1995 00:00:00 GMT');
+ +

Gibt 807926400000 in allen Zeitzonen zurück, weil GMT (UTC) angegeben ist.

+ +
Date.parse('Wed, 09 Aug 1995 00:00:00');
+ +

Gibt den Wert 807937200000 in der Zeitzone GMT-0400 zurück und andere Werte in anderen Zeitzonen, wenn im String keine Zeitzone definiert ist und es kein ISO formatiertes Datum ist. Deswegen wird als Standardwert die Ortszeit genutzt.

+ +
Date.parse('Thu, 01 Jan 1970 00:00:00 GMT');
+ +

Gibt 0 in allen Zeitzonen zurück, weil GMT (UTC) angegeben ist.

+ +
Date.parse('Thu, 01 Jan 1970 00:00:00');
+ +

Gibt den Wert 14400000 in der Zeitzone GMT-0400 zurück und andere Werte in anderen Zeitzonen, wenn im String keine Zeitzone definiert ist und es kein ISO formatiertes Datum ist. Deswegen wird als Standardwert die Ortszeit genutzt.

+ +
Date.parse('Thu, 01 Jan 1970 00:00:00 GMT-0400');
+ +

Gibt 14400000 in allen Zeitzonen zurück, weil GMT (UTC) angegeben ist.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.4.2', 'Date.parse')}}{{Spec2('ES5.1')}}Einfaches ISO 8601 Format hinzugefügt.
{{SpecName('ES6', '#sec-date.parse', 'Date.parse')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.parse', 'Date.parse')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.parse")}}

+ +

Kompatibilitätsnotitzen

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/prototype/index.html b/files/de/web/javascript/reference/global_objects/date/prototype/index.html new file mode 100644 index 0000000000..a056132ba7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/prototype/index.html @@ -0,0 +1,182 @@ +--- +title: Date.prototype +slug: Web/JavaScript/Reference/Global_Objects/Date/prototype +tags: + - Date + - JavaScript + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date +--- +
{{JSRef}}
+ +

Die Date.prototype-Eigenschaft ist der Prototype für den {{jsxref("Date")}}-Konstruktor

+ +
{{js_property_attributes(0, 0, 1)}}
+ +

Beschreibung

+ +

JavaScript-{{jsxref("Date")}}-Instanzen erben von Date.prototype. Man kann das Konstruktorprototype-Objekt ändern, um Eigenschaften und Methoden aller {{jsxref("Date")}}-Instanzen zu ändern.

+ +

Für die Kompatibilität mit Jahrtausendsrechnungen (in anderen Worten, um das Jahr 2000 mit einzukalkulieren), sollte man das Jahr immer in voller Länge spezifizieren; zum Beispiel sollte 1998 und nicht 98 benutzt werden. Zur Unterstützung der Spezifizierung des vollen Jahres hat JavaScript die Methoden {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}}, {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}}, {{jsxref("Date.prototype.getUTCFullYear()", "getUTCFullYear()")}} und {{jsxref("Date.prototype.setUTCFullYear()", "setUTCFullYear()")}}.

+ +

Mit Einführung von ECMAScript 6 ist das Date.prototype-Objekt ein normales Objekt. Es ist keine Instanz von {{jsxref("Date")}}.

+ +

Eigenschaften

+ +
+
Date.prototype.constructor
+
Eine Funktion, die Instanzen erzeugen kann. Der {{jsxref("Date")}}-Konstruktor ist der Standard.
+
+ +

Methoden

+ +

Getter

+ +
+
{{jsxref("Date.prototype.getDate()")}}
+
Gibt den Tag des Monats (1 - 31) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getDay()")}}
+
Gibt den Tag der Woche (0 - 6) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getFullYear()")}}
+
Gibt das Jahr (4 Ziffern für 4 ziffrige Jahre) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getHours()")}}
+
Gibt die Stunde (0 - 23) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getMilliseconds()")}}
+
Gibt die Millisekunden (0 - 999) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getMinutes()")}}
+
Gibt die Minuten (0 - 59) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getMonth()")}}
+
Gibt den Monat (0 - 11) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getSeconds()")}}
+
Gibt die Sekunden (0 - 59) eines Datums gemäß der Ortszeit zurück.
+
{{jsxref("Date.prototype.getTime()")}}
+
Gibt den nummerischen Wert eines Datums als Millisekunden seit 1. Januar 1970 00:00:00 UTC (negativ für frühere Daten) zurück.
+
{{jsxref("Date.prototype.getTimezoneOffset()")}}
+
Gibt den Zeitzonenunterschied in Minuten für die aktuelle Region zurück.
+
{{jsxref("Date.prototype.getUTCDate()")}}
+
Gibt den Tag des Monats (1 - 31) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCDay()")}}
+
Gibt den Tag der Woche (0 - 6) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCFullYear()")}}
+
Gibt das Jahr (4 Ziffern für 4 ziffrige Jahre) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCHours()")}}
+
Gibt die Stunden (0 - 23) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCMilliseconds()")}}
+
Gibt die Millisekunden (0 - 999) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCMinutes()")}}
+
Gibt die Minuten (0 - 59) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCMonth()")}}
+
Gibt den Monat (0 - 11) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getUTCSeconds()")}}
+
Gibt die Sekunden (0 - 59) eines Datums gemäß der Weltzeit zurück.
+
{{jsxref("Date.prototype.getYear()")}} {{deprecated_inline}}
+
Gibt das Jahr (nur 2 - 3 Ziffern) eines Datums gemäß der Ortszeit zurück. Stattdessen sollte {{jsxref("Date.prototype.getFullYear()", "getFullYear()")}} benutzt werden.
+
+ +

Setter

+ +
+
{{jsxref("Date.prototype.setDate()")}}
+
Setzt den Tag des Monats eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setFullYear()")}}
+
Setzt das Jahr (4 Ziffern für vierstellige Jahre) eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setHours()")}}
+
Setzt die Stunden eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setMilliseconds()")}}
+
Setzt die Millisekunden eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setMinutes()")}}
+
Setzt die Minuten eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setMonth()")}}
+
Setzt den Monat eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setSeconds()")}}
+
Setzt die Sekunden eines Datums gemäß der Ortszeit.
+
{{jsxref("Date.prototype.setTime()")}}
+
Setzt ein {{jsxref("Date")}} Objekt auf die Zeit, mit der Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00UTC. Negative Zahlen sind für frühere Daten erlaubt.
+
{{jsxref("Date.prototype.setUTCDate()")}}
+
Setzt den Tag des Monats eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCFullYear()")}}
+
Setzt das Jahr (4 Ziffern für 4 ziffrige Jahre) eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCHours()")}}
+
Setzt die Stunde eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCMilliseconds()")}}
+
Setzt die Millisekunden eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCMinutes()")}}
+
Setzt die Minuten eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCMonth()")}}
+
Setzt den Monat eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setUTCSeconds()")}}
+
Setzt die Sekunden eines Datums gemäß der Weltzeit.
+
{{jsxref("Date.prototype.setYear()")}} {{deprecated_inline}}
+
Setzt das Jahr (nur 2 - 3 Ziffern) eines Datums gemäß der Ortszeit. Stattdessen sollte {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} benutzt werden.
+
+ +

Konvertierungsgetter

+ +
+
{{jsxref("Date.prototype.toDateString()")}}
+
Gibt das Datum als menschlich lesbaren String zurück (z. B. Thu Apr 12 2018). 
+
{{jsxref("Date.prototype.toISOString()")}}
+
Konvertiert ein Datum zu einem String im erweiterten ISO-8601-Format.
+
{{jsxref("Date.prototype.toJSON()")}}
+
Gibt eine String-Repräsentation eines {{jsxref("Date")}}-Objektes zurück. Dabei wird die {{jsxref("Date.prototype.toISOString()", "toISOString()")}}-Methode eingesetzt. Gedacht für den Einsatz von {{jsxref("JSON.stringify()")}}.
+
{{jsxref("Date.prototype.toGMTString()")}} {{deprecated_inline}}
+
Gibt eine String-Repräsentation eines {{jsxref("Date")}}-Objektes auf Basis der GMT-(UT)-Zeitzone zurück. Stattdessen sollte {{jsxref("Date.prototype.toUTCString()", "toUTCString()")}} eingesetzt werden.
+
{{jsxref("Date.prototype.toLocaleDateString()")}}
+
Gibt einen String mit ortssensitiver Repräsentation eines Datums zurück. Dieses Datum basiert auf den Systemeinstellungen.
+
{{jsxref("Date.prototype.toLocaleFormat()")}} {{non-standard_inline}}
+
Konvertiert ein Datum zu einem String mithilfe eines Formatierungsstrings.
+
{{jsxref("Date.prototype.toLocaleString()")}}
+
Gibt einen String mit ortssensitiver Repräsentation eines Datums zurück. Diese Method überschreibt die  {{jsxref("Object.prototype.toLocaleString()")}}-Methode.
+
{{jsxref("Date.prototype.toLocaleTimeString()")}}
+
Gibt einen String mit ortssensitiver Repräsentation der Zeit eines Datums zurück. Diese Zeit basiert auf den Systemeinstellungen.
+
{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt einen String-Repräsentation des Quelltextes zurück (gleich dem {{jsxref("Date")}}-Objekt). Man kann diese Methode einsetzen um ein neues Objekt zu erstellen. Diese Methode überschreibt die {{jsxref("Object.prototype.toSource()")}}-Methode
+
{{jsxref("Date.prototype.toString()")}}
+
Gibt eine String-Repräsentation eines {{jsxref("Date")}}-Objektes zurück. Diese Methode überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
{{jsxref("Date.prototype.toTimeString()")}}
+
Gibt die Zeit eines Datums als menschlich lesbaren String zurück.
+
{{jsxref("Date.prototype.toUTCString()")}}
+
Konvertiert das Datum zu einem String unter Einsatz der UTC-Zeitzone.
+
{{jsxref("Date.prototype.valueOf()")}}
+
Gibt ein primitiven Wert eines {{jsxref("Date")}}-Objektes zurück. Diese Methode überschreibt die {{jsxref("Object.prototype.valueOf()")}}-Methode.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.9.5', 'Date.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.prototype")}}

diff --git a/files/de/web/javascript/reference/global_objects/date/setdate/index.html b/files/de/web/javascript/reference/global_objects/date/setdate/index.html new file mode 100644 index 0000000000..4fb7d6ac63 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setdate/index.html @@ -0,0 +1,91 @@ +--- +title: Date.prototype.setDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/setDate +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setDate +--- +
{{JSRef}}
+ +

Die setDate() Methode setzt den Tag eines {{jsxref("Date")}} Objektes relativ zum Beginn des aktuellen Monats.

+ +
{{EmbedInteractiveExample("pages/js/date-setdate.html")}}
+ + + +

Syntax

+ +
dateObj.setDate(dayValue)
+ +

Parameter

+ +
+
dayValue
+
Eine ganze Zahl, die den Tag des Monats repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten {{jsxref("Date")}} Objektes (das Objekt wird auch geändert).

+ +

Beschreibung

+ +

Wenn dayValue außerhalb des Wertes für einen Tag in einem Monat ist, wird setDate() das {{jsxref("Date")}} Objekt dementsprechend ändern. Zum Beispiel wird der Wert 0 für dayValue den letzen Tag des vorherigen Monats einstellen.

+ +

Beispiele

+ +

Einsatz von setDate()

+ +
var theBigDay = new Date(1962, 6, 7); // 1962-07-07
+theBigDay.setDate(24);  // 1962-07-24
+theBigDay.setDate(32);  // 1962-08-01
+theBigDay.setDate(22);  // 1962-08-22
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.36', 'Date.prototype.setDate')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setdate', 'Date.prototype.setDate')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setdate', 'Date.prototype.setDate')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setDate")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setfullyear/index.html b/files/de/web/javascript/reference/global_objects/date/setfullyear/index.html new file mode 100644 index 0000000000..3dafd848dc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setfullyear/index.html @@ -0,0 +1,97 @@ +--- +title: Date.prototype.setFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setFullYear +--- +
{{JSRef}}
+ +

Die setFullYear() Methode stellt das ganze Jahr eines Datums bezüglich der Ortszeit ein und gibt einen neuen Zeitstempel zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-setfullyear.html")}}
+ + + +

Syntax

+ +
dateObj.setFullYear(yearValue[, monthValue[, dateValue]])
+ +

Parameter

+ +
+
yearValue
+
Eine ganze Zahl, welche den nummerischen Wert des Jahres angibt (z. B. 1995).
+
monthValue
+
Optional. Eine ganze Zahl zwischen 0 und 11, welche den Monat von Januar bis Dezember angibt.
+
dateValue
+
Optional. Eine ganze Zahl zwischen 1 und 31, welche den Tag des Monats angibt. Wenn der dateValue Parameter angegeben wird, muss auch der monthValue Parameter angegeben werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn die Parameter monthValue und dateValue nicht gesetzt sind, werden die Rückgabewerte der Methoden {{jsxref("Date.prototype.getMonth()", "getMonth()")}} und {{jsxref("Date.prototype.getDate()", "getDate()")}} eingesetzt.

+ +

Wenn ein gesetzter Parameter außerhalb seiner erwarteten Grenzen ist, ändert setFullYear() entsprechenden die anderen Parameter und die Informationen im {{jsxref("Date")}} Objekt. Wird zum Beispiel 15 für monthValue Übergeben, so wird das Jahr um 1 inkrementiert und der Wert 3 wird für den Monat genutzt.

+ +

Beispiele

+ +

Einsatz von setFullYear()

+ +
var theBigDay = new Date();
+theBigDay.setFullYear(1997);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.40', 'Date.prototype.setFullYear')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setFullYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/sethours/index.html b/files/de/web/javascript/reference/global_objects/date/sethours/index.html new file mode 100644 index 0000000000..3b40e647b6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/sethours/index.html @@ -0,0 +1,102 @@ +--- +title: Date.prototype.setHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/setHours +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setHours +--- +
{{JSRef}}
+ +

Die setHours() Methode setzt die Stunden für eine Zeit bezüglich der Ortszeit und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC nachdem die Zeit des {{jsxref("Date")}} geändert wurde.

+ +
{{EmbedInteractiveExample("pages/js/date-sethours.html")}}
+ + + +

Syntax

+ +
dateObj.setHours(hoursValue[, minutesValue[, secondsValue[, msValue]]])
+ +

Versionen vor JavaScript 1.3

+ +
dateObj.setHours(hoursValue)
+ +

Parameter

+ +
+
hoursValue
+
Eine ganze Zahl zwischen 0 und 23, die die Stunde repräsentiert. Wenn der Wert größer als 23 ist, werden die extra Stunden auf die Zeit addiert.
+
minutesValue
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Minuten repräsentiert. Wenn ein Wert größer als 59 angegeben wird, werden die extra Minuten auf die Zeit addiert.
+
secondsValue
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Sekunden repräsentiert. Wenn der Wert größer als 59 ist, werden die extra Sekunden auf die Zeit addiert. Wenn secondsValue angegeben ist, muss auch minutesValue angegeben werden.
+
msValue
+
Optional. Eine ganze Zahl zwischen 0 und 999, die die Millisekunden repräsentiert. Wenn der Wert größer als 999 ist, werden die extra Millisekunden auf die Zeit addiert. Wenn der msValue Parameter angegeben ist, müssen auch die minutesValue und secondsValue Parameter angegeben werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 UTC und dem geänderten date Objekte

+ +

Beschreibung

+ +

Wenn die Parameter minutesValue, secondsValue, und msValue nicht angegeben werden, werden die Rückgabewerte der Methoden {{jsxref("Date.prototype.getMinutes()", "getMinutes()")}}, {{jsxref("Date.prototype.getSeconds()", "getSeconds()")}} und {{jsxref("Date.prototype.getMilliseconds()", "getMilliseconds()")}} genutzt.

+ +

Wenn ein Parameter einen Wert außerhalb seiner Grenzen hat, wird setHours() das Informationen im {{jsxref("Date")}} Objekt dementsprechend ändern. Wenn zum Beispiel der Wert 100 für den Parameter secondsValue angegeben wird, wird die Minute um 1 inkrementiert und die Sekunden bekommen den Wert 40.

+ +

Beispiele

+ +

Einsatz von setHours()

+ +
var theBigDay = new Date();
+theBigDay.setHours(7);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.34', 'Date.prototype.setHours')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.sethours', 'Date.prototype.setHours')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.sethours', 'Date.prototype.setHours')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setHours")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setmilliseconds/index.html b/files/de/web/javascript/reference/global_objects/date/setmilliseconds/index.html new file mode 100644 index 0000000000..51f2e069ab --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setmilliseconds/index.html @@ -0,0 +1,90 @@ +--- +title: Date.prototype.setMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMilliseconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMilliseconds +--- +
{{JSRef}}
+ +

Die setMilliseconds() Methode setzt die Millisekunden einer Zeit bezüglich der Ortszeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setmilliseconds.html")}}
+ + + +

Syntax

+ +
dateObj.setMilliseconds(millisecondsValue)
+ +

Parameter

+ +
+
millisecondsValue
+
Eine ganze Zahl zwischen 0 und 999, welche die Millisekunden repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn der Parameter außerhalb seiner Grenzen definiert wird, wird diese Information bei der änderung des {{jsxref("Date")}} Objektes beachtet. Wenn zum Beispiel 1005 übergeben wird, wird die Sekunde um 1 inkrementiert und die Millisekunden werden auf 5 gesetzt.

+ +

Beispiele

+ +

Einsatz von setMilliseconds()

+ +
var theBigDay = new Date();
+theBigDay.setMilliseconds(100);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.28', 'Date.prototype.setMilliseconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setmilliseconds', 'Date.prototype.setMilliseconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setmilliseconds', 'Date.prototype.setMilliseconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setMilliseconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setminutes/index.html b/files/de/web/javascript/reference/global_objects/date/setminutes/index.html new file mode 100644 index 0000000000..75918fb16b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setminutes/index.html @@ -0,0 +1,100 @@ +--- +title: Date.prototype.setMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMinutes +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMinutes +--- +
{{JSRef}}
+ +

Die setMinutes() Methode setzt die Minuten für ein Datum (Zeit) bezüglich der Ortszeit

+ +
{{EmbedInteractiveExample("pages/js/date-setminutes.html")}}
+ + + +

Syntax

+ +
dateObj.setMinutes(minutesValue[, secondsValue[, msValue]])
+ +

Versionen vor JavaScript 1.3

+ +
dateObj.setMinutes(minutesValue)
+ +

Parameter

+ +
+
minutesValue
+
Eine ganze Zahl zwischen 0 und 59, die die Minuten repräsentiert.
+
secondsValue
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Sekunden repräsentiert.
+
msValue
+
Optional. Eine ganze Zahl zwischen 0 und 999, die die Millisekunden repräsentiert. Wenn der Parameter msValue angegeben ist, muss auch der Parameter secondsValue angegeben werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn die Parameter secondsValue and msValue nicht angegeben werden, wird die Rückgabewerte der Methoden {{jsxref("Date.prototype.getSeconds()", "getSeconds()")}} und {{jsxref("Date.prototype.getMilliseconds()", "getMilliseconds()")}} eingesetzt.

+ +

Wenn der Wert eines Parameters außerhalb seiner Grenzen liegt, wird dieses von der setMinutes() Methode berücksichtigt. Wenn zum Beispiel 100 für den Parameter secondsValue genutzt wird, werden die Minuten um 1 inkrementiert und die Sekunden werden auf 40 gesetzt.

+ +

Beispiele

+ +

Einsatz von setMinutes()

+ +
var theBigDay = new Date();
+theBigDay.setMinutes(45);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.32', 'Date.prototype.setMinutes')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setminutes', 'Date.prototype.setMinutes')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setminutes', 'Date.prototype.setMinutes')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setMinutes")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setmonth/index.html b/files/de/web/javascript/reference/global_objects/date/setmonth/index.html new file mode 100644 index 0000000000..02d659ad50 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setmonth/index.html @@ -0,0 +1,103 @@ +--- +title: Date.prototype.setMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMonth +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMonth +--- +
{{JSRef}}
+ +

Die setMonth() Methode setzt den Monat eines Datums bezüglich des aktuellen Jahres.

+ +
{{EmbedInteractiveExample("pages/js/date-setmonth.html")}}
+ +

Syntax

+ +
dateObj.setMonth(monthValue[, dayValue])
+ +

Versionen vor JavaScript 1.3

+ +
dateObj.setMonth(monthValue)
+ +

Parameter

+ +
+
monthValue
+
Eine ganze Zahl zwischen 0 und 11, die die Monate Januar bis Dezember repräsentiert.
+
dayValue
+
Optional. Eine ganze Zahl zwischen 1 und 31, die die Tage eines Monats repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn der dayValue Parameter nicht gesetzt wird, bekommt er den Rückgabewert der {{jsxref("Date.prototype.getDate()", "getDate()")}} Methode.

+ +

Wenn ein Parameter mit einem Wert außerhalb seiner Grenzen übergebn wird, berücksichtigt die  setMonth() Methode diese Information in dem {{jsxref("Date")}} Objekt. Wird zum Beispiel der Wert 15 für den monthValue Parameter übergeben, so wird das Jahr um 1 inkrementiert und der Monat auf dem Wert 3 gesetzt.

+ +

Der aktuelle Tag des Monats hat einen Einfluss auf diese Methode. Konzeptionell wird die Anzahl der Tage des aktuellen Monats hinzugefügt, um zum 1. des neuen Monats zu bekommen. Wird zum Beispiel auf dem 31. August 2016 setMonth mit dem Wert 1 aufgerufen, so wird der 2. März 2016 zurückgegeben. Dieses liegt daran, dass der Februar im Jahr 2016 nur 29 Tage hat.

+ +

Beispiele

+ +

Einsatz von setMonth()

+ +
var theBigDay = new Date();
+theBigDay.setMonth(6);
+
+//Achtet auf die Übergänge am Ende des Monats
+var endOfMonth = new Date(2016, 7, 31);
+endOfMonth.setMonth(1);
+console.log(endOfMonth); //Wed Mar 02 2016 00:00:00
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.38', 'Date.prototype.setMonth')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setmonth', 'Date.prototype.setMonth')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setmonth', 'Date.prototype.setMonth')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setMonth")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setseconds/index.html b/files/de/web/javascript/reference/global_objects/date/setseconds/index.html new file mode 100644 index 0000000000..9a10f186ec --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setseconds/index.html @@ -0,0 +1,98 @@ +--- +title: Date.prototype.setSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setSeconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setSeconds +--- +
{{JSRef}}
+ +

Die setSeconds() Methode setzt die Sekunden eines Datums bezüglich der Ortzseit.

+ +
{{EmbedInteractiveExample("pages/js/date-setseconds.html")}}
+ + + +

Syntax

+ +
dateObj.setSeconds(secondsValue[, msValue])
+ +

Versionen vor JavaScript 1.3

+ +
dateObj.setSeconds(secondsValue)
+ +

Parameter

+ +
+
secondsValue
+
Eine ganze Zahl  zwischen 0 und 59, die die Sekunden repräsentiert.
+
msValue
+
Optional. Eine ganze Zahl zwischen 0 und 999, die die Millisekunden repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn der Parameter msValue nicht gesetzt ist, wird der Rückgabewert der Methode {{jsxref("Date.prototype.getMilliseconds()", "getMilliseconds()")}} eingesetzt.

+ +

Wenn der Wert eines Parameters seine Grenzen überschreitet, wird die setSeconds() Methode diese Information in dem {{jsxref("Date")}} Objekt berücksichtigen. Wenn zum Beispiel für den Parameter secondsValue der Wert 100 benutzt wird, werden die Minuten um 1 inkrementiert und und für die Sekunden wird der Wert 40 benutzt.

+ +

Beispiele

+ +

Einsatz von setSeconds()

+ +
var theBigDay = new Date();
+theBigDay.setSeconds(30);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.30', 'Date.prototype.setSeconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setseconds', 'Date.prototype.setSeconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setseconds', 'Date.prototype.setSeconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setSeconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/settime/index.html b/files/de/web/javascript/reference/global_objects/date/settime/index.html new file mode 100644 index 0000000000..aaf72c378a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/settime/index.html @@ -0,0 +1,91 @@ +--- +title: Date.prototype.setTime() +slug: Web/JavaScript/Reference/Global_Objects/Date/setTime +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setTime +--- +
{{JSRef}}
+ +

Die Methode setTime() setzt das {{jsxref("Date")}} Objekt auf die Zeit, die durch eine Anzahl Millisekunden seit dem 1. Januar 1970, 00:00:00 UTC angegeben wird.

+ +
{{EmbedInteractiveExample("pages/js/date-settime.html")}}
+ + + +

Syntax

+ +
dateObj.setTime(timeValue)
+ +

Parameter

+ +
+
timeValue
+
Ein integer, der die Anzahl Millisekunden seit dem 1. Januar 1970, 00:00:00 UTC angibt.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt (effektiv dem Wert des übergebenen Parameters).

+ +

Beschreibung

+ +

Die Methode setTime() ist hilfreich, um Datum und Zeit einem anderen {{jsxref("Date")}} Objekt zuzuweisen.

+ +

Beispiele

+ +

Einsatz von setTime()

+ +
var theBigDay = new Date('July 1, 1999');
+var sameAsBigDay = new Date();
+sameAsBigDay.setTime(theBigDay.getTime());
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Erste Definition. Implementiert JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.27', 'Date.prototype.setTime')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.settime', 'Date.prototype.setTime')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.settime', 'Date.prototype.setTime')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setTime")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcdate/index.html b/files/de/web/javascript/reference/global_objects/date/setutcdate/index.html new file mode 100644 index 0000000000..15f05b5109 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcdate/index.html @@ -0,0 +1,90 @@ +--- +title: Date.prototype.setUTCDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCDate +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCDate +--- +
{{JSRef}}
+ +

Die setUTCDate() Methode setzt den Monatstag eines Datums bezüglich der Weltzeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setutcdate.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCDate(dayValue)
+ +

Parameter

+ +
+
dayValue
+
Eine ganze Zahl zwischen 1 und 31, die die Date eines Monats repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCDate() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 40  für dayValue angegeben wird, so wird ein {{jsxref("Date")}} Objekt mit dem Monat Juni auf den Tag 10 und den Monat Juli (Monat um 1 inkrementiert) aktualisiert.

+ +

Beispiele

+ +

Einsatz von setUTCDate()

+ +
var theBigDay = new Date();
+theBigDay.setUTCDate(20);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.37', 'Date.prototype.setUTCDate')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcdate', 'Date.prototype.setUTCDate')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcdate', 'Date.prototype.setUTCDate')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCDate")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcfullyear/index.html b/files/de/web/javascript/reference/global_objects/date/setutcfullyear/index.html new file mode 100644 index 0000000000..c901540225 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcfullyear/index.html @@ -0,0 +1,96 @@ +--- +title: Date.prototype.setUTCFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCFullYear +--- +
{{JSRef}}
+ +

Die setUTCFullYear() Methode setzt das volle Jahr für ein Datum bezüglich der Weltzeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setutcfullyear.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCFullYear(yearValue[, monthValue[, dayValue]])
+ +

Parameter

+ +
+
yearValue
+
Eine ganze Zahl, die das Jahr repräsentiert (z. B. 1995).
+
monthValue
+
Optional. Eine ganze Zahl zwischen 0 und 11, die die Monate Januar bis Dezember repräsentiert.
+
dayValue
+
Optional. Eine ganze Zahl zwischen 1 und 31, die den Tag eines Monats repräsentiert. Wenn dayValue benutzt wird, muss auch der Parameter monthValue benutzt werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn die Parameter monthValue und dayValue nicht angegeben werden, so werden für diese die Rückgabewerte der Methoden {{jsxref("Date.prototype.getUTCMonth()", "getUTCMonth()")}} und {{jsxref("Date.prototype.getUTCDate()", "getUTCDate()")}} benutzt.

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCFullYear() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 15  für monthValue angegeben wird, so wird das Jahr um 1 inkrementiert (yearValue + 1) und der Monat wird auf 3 gesetzt.

+ +

Beispiele

+ +

Einsatz von setUTCFullYear()

+ +
var theBigDay = new Date();
+theBigDay.setUTCFullYear(1997);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.41', 'Date.prototype.setUTCFullYear')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcfullyear', 'Date.prototype.setUTCFullYear')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcfullyear', 'Date.prototype.setUTCFullYear')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCFullYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutchours/index.html b/files/de/web/javascript/reference/global_objects/date/setutchours/index.html new file mode 100644 index 0000000000..6194eceb91 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutchours/index.html @@ -0,0 +1,98 @@ +--- +title: Date.prototype.setUTCHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCHours +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCHours +--- +
{{JSRef}}
+ +

Die setUTCHours() Methode setzt die Stunde eines Datums (mit Zeit) bezüglich der Weltzeit und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC nach dem Aktualisieren der {{jsxref("Date")}} Instanz zurück-

+ +
{{EmbedInteractiveExample("pages/js/date-setutchours.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCHours(hoursValue[, minutesValue[, secondsValue[, msValue]]])
+ +

Parameter

+ +
+
hoursValue
+
Eine ganze Zahl zwischen 0 und 23, die die Stunden repräsentiert.
+
minutesValue
+
Optional. Eine ganze Zahl zwischen 0 and 59, die die Minuten repräsentiert.
+
secondsValue
+
Optional. Eine ganze Zahl zwischen 0 and 59, die die Sekunden repräsentiert. Wenn der secondsValue Parameter angegeben wird, muss auch der minutesValue Parameter angegeben werden.
+
msValue
+
Optional. Eine ganze Zahl zwischen 0 and 999, die die Millisekunden repräsentiert. Wenn der msValue Parameter angegeben ist, müssen auch die Parameter minutesValue und secondsValue angegeben werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn die Parameter minutesValue, secondsValue, und msValue nicht angegeben werden, wird für diese der Rückgabewert der Methoden {{jsxref("Date.prototype.getUTCMinutes()", "getUTCMinutes()")}}, {{jsxref("Date.prototype.getUTCSeconds()", "getUTCSeconds()")}}, und {{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}} verwendet.

+ +

Wenn ein Parameter außerhalb seiner Grenzen angegeben wird, wird die setUTCHours() Methode diese Information beim aktualisieren des {{jsxref("Date")}} Objektes berücksichtigen. Wenn zum Beispiel 100 für den secondsValue Parameter genutzt wird, werden die Minuten um 1 inkrementiert (minutesValue + 1) und der Wert 40 wird für die Sekunden verwendet.

+ +

Beispiele

+ +

Einsatz von setUTCHours()

+ +
var theBigDay = new Date();
+theBigDay.setUTCHours(8);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.35', 'Date.prototype.setUTCHours')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutchours', 'Date.prototype.setUTCHours')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutchours', 'Date.prototype.setUTCHours')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCHours")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html b/files/de/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html new file mode 100644 index 0000000000..14cbca2f90 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html @@ -0,0 +1,90 @@ +--- +title: Date.prototype.setUTCMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMilliseconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMilliseconds +--- +
{{JSRef}}
+ +

Die setUTCMilliseconds() Methode setzt die Millisekunden eines Datums bezüglich der Weltzeit

+ +
{{EmbedInteractiveExample("pages/js/date-setutcmilliseconds.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCMilliseconds(millisecondsValue)
+ +

Parameter

+ +
+
millisecondsValue
+
Eine Zahl zwischen 0 und 999, die die Millisekunden repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCMilliseconds() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 1100 für millisecondsValue angegeben wird, so werden die Sekunden um 1 inkrementiert und die Millisekunden werden auf 100 gesetzt.

+ +

Beispiele

+ +

Einsatz von setUTCMilliseconds()

+ +
var theBigDay = new Date();
+theBigDay.setUTCMilliseconds(500);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.29', 'Date.prototype.setUTCMilliseconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcmilliseconds', 'Date.prototype.setUTCMilliseconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcmilliseconds', 'Date.prototype.setUTCMilliseconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCMilliseconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcminutes/index.html b/files/de/web/javascript/reference/global_objects/date/setutcminutes/index.html new file mode 100644 index 0000000000..b56abc94d6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcminutes/index.html @@ -0,0 +1,96 @@ +--- +title: Date.prototype.setUTCMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMinutes +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMinutes +--- +
{{JSRef}}
+ +

Die setUTCMinutes() Methode setzt die Minuten eines Datums bezüglich der Weltzeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setutcminutes.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCMinutes(minutesValue[, secondsValue[, msValue]])
+ +

Parameter

+ +
+
minutesValue
+
Eine ganze Zahl zwischen 0 und 59, die die Minuten repräsentiet.
+
secondsValue
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Sekunden repräsentiert.
+
msValue
+
Optional. Eine ganze Zahl zwischen 0 und 999, die die Millisekunden repräsentiert. Wenn der Parameter msValue angegeben wird, muss auch der Parameter secondsValue gesetzt werden.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn die Parameter secondsValue und msValue nicht angegeben werden, so werden für diese die Rückgabewerte der Methoden {{jsxref("Date.prototype.getUTCSeconds()", "getUTCSeconds()")}} und {{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}} benutzt.

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCMinutes() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 100  für secondsValue angegeben wird, so werden die Minuten um 1 inkrementiert  (minutesValue + 1) und die Sekunden werden auf 40 gesetzt.

+ +

Beispiele

+ +

Einsatz von setUTCMinutes()

+ +
var theBigDay = new Date();
+theBigDay.setUTCMinutes(43);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.33', 'Date.prototype.setUTCMinutes')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcminutes', 'Date.prototype.setUTCMinutes')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcminutes', 'Date.prototype.setUTCMinutes')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCMinutes")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcmonth/index.html b/files/de/web/javascript/reference/global_objects/date/setutcmonth/index.html new file mode 100644 index 0000000000..d4f393051d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcmonth/index.html @@ -0,0 +1,94 @@ +--- +title: Date.prototype.setUTCMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMonth +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMonth +--- +
{{JSRef}}
+ +

Die setUTCMonth() Methode setzt den Monat eines Datums bezüglich der Weltzeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setutcmonth.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCMonth(monthValue[, dayValue])
+ +

Parameter

+ +
+
monthValue
+
Eine ganze Zahl zwischen 0 und 11, die die Monate Januar bis Dezember repräsentiert.
+
dayValue
+
Optional. Eine ganze Zahl zwischen 1 und 31, die den Tag eines Monats repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn die Parameter dayValue nicht angegeben werden, so wird für diesen der Rückgabewert der Methode {{jsxref("Date.prototype.getUTCDate()", "getUTCDate()")}} benutzt.

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCMonth() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 15  für monthValue angegeben wird, so wird das Jahr um 1 inkrementiert und der Monat wird auf 3 gesetzt.

+ +

Beispiele

+ +

Einsatz von setUTCMonth()

+ +
var theBigDay = new Date();
+theBigDay.setUTCMonth(11);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.39', 'Date.prototype.setUTCMonth')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcmonth', 'Date.prototype.setUTCMonth')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcmonth', 'Date.prototype.setUTCMonth')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCMonth")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setutcseconds/index.html b/files/de/web/javascript/reference/global_objects/date/setutcseconds/index.html new file mode 100644 index 0000000000..52ce280245 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setutcseconds/index.html @@ -0,0 +1,94 @@ +--- +title: Date.prototype.setUTCSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCSeconds +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCSeconds +--- +
{{JSRef}}
+ +

Die setUTCSeconds() Methode setzt die Sekunden eines Datums bezüglich der Weltzeit.

+ +
{{EmbedInteractiveExample("pages/js/date-setutcseconds.html")}}
+ + + +

Syntax

+ +
dateObj.setUTCSeconds(secondsValue[, msValue])
+ +

Parameter

+ +
+
secondsValue
+
Eine ganze Zahl zwischen 0 und 59, die die Sekunden repräsentiert.
+
msValue
+
Optional. Eine ganze Zahl zwische 0 und 999, die die Millisekunden repräsentiert.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem aktualisierten date Objekte.

+ +

Beschreibung

+ +

Wenn der Parameter msValue nicht angegeben wird, so wird für diesen der Rückgabewert der Methode {{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}} benutzt.

+ +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen liegt, berücksichtigt die setUTCSeconds() Methode diese Information beim aktualisieren eines {{jsxref("Date")}} Objektes. Wenn zum Beispiel 100  für secondsValue angegeben wird, so werden die Minuten um 1 inkrementiert und die Sekunden werden auf 40 gesetzt.

+ +

Beispiele

+ +

Einsatz von setUTCSeconds()

+ +
var theBigDay = new Date();
+theBigDay.setUTCSeconds(20);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.31', 'Date.prototype.setUTCSeconds')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.setutcseconds', 'Date.prototype.setUTCSeconds')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.setutcseconds', 'Date.prototype.setUTCSeconds')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setUTCSeconds")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/setyear/index.html b/files/de/web/javascript/reference/global_objects/date/setyear/index.html new file mode 100644 index 0000000000..8eb3627370 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/setyear/index.html @@ -0,0 +1,96 @@ +--- +title: Date.prototype.setYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setYear +tags: + - Date + - Deprecated + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setYear +--- +
{{JSRef}} {{deprecated_header}}
+ +
Die setYear() Methode setzt das Jahr für eine Datum bezüglich der Ortszeit. Weil setYear() nicht das volle Jahr setzt ("Jahr 2000 Probem"), wird es nicht länger eingesetzt und wird von der Methode {{jsxref("Date.prototype.setFullYear()", "setFullYear()")}} ersetzt. 
+ +
 
+ +

Syntax

+ +
dateObj.setYear(yearValue)
+ +

Parameter

+ +
+
yearValue
+
Eine ganze Zahl.
+
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem geänderten date Objekt.

+ +

Beschreibung

+ +

Wenn yearValue eine Nummer zwische 0 und 99 (inklusiv) ist, wird das Jahr eines {{jsxref("date")}} Objekt mit dem Wert 1900 + yearValue gesetzt. Ansernfalls wird das Jahr des Objektes mit dem Wert  yearValue gesetzt.

+ +

Beispiele

+ +

Einsatz von setYear()

+ +

Die ersten beiden Zeilen setzen das Jahr auf 1996. Die dritte Zeile setzt das Jahr auf 2000

+ +
var theBigDay = new Date();
+
+theBigDay.setYear(96);
+theBigDay.setYear(1996);
+theBigDay.setYear(2000);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-B.2.5', 'Date.prototype.setYear')}}{{Spec2('ES5.1')}}Definiert in dem (informativen) Kompatibilitäts-Anhang
{{SpecName('ES6', '#sec-date.prototype.setyear', 'Date.prototype.setYear')}}{{Spec2('ES6')}}Definiert in dem (normativ) Anhang für zusätzliche Funktionen für Web-Browser.
{{SpecName('ESDraft', '#sec-date.prototype.setyear', 'Date.prototype.setYear')}}{{Spec2('ESDraft')}}Definiert in dem (normativ) Anhang für zusätzliche Funktionen für Web-Browser.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.setYear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/todatestring/index.html b/files/de/web/javascript/reference/global_objects/date/todatestring/index.html new file mode 100644 index 0000000000..00440243e6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/todatestring/index.html @@ -0,0 +1,92 @@ +--- +title: Date.prototype.toDateString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toDateString +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toDateString +--- +
{{JSRef}}
+ +

Die toDateString() Methode gibt den Datumsteil eines {{jsxref("Date")}} Objektes für Menschen lesbar,  im amerikanisch-englischen Format, zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-todatestring.html")}}
+ + + +

Syntax

+ +
dateObj.toDateString()
+ +

Rückgabewert

+ +

Ein String, der den Datumsteil des gegebenen {{jsxref("Date")}} Objektes für menschen lesbar im amerikanisch-englischen Format enthält

+ +

Beschreibung

+ +

{{jsxref("Date")}} Instanzen referenzieren einen spezifischen Zeitpunkt. Mit dem Aufruf von {{jsxref("Date.prototype.toString()", "toString()")}} wird dieser Zeitpunkt für Menschen lesbar, im amerikanisch-englischen Format, zurückgegeben. In SpiderMonkey enthält diese Format den Datumsteil (Tag, Monat und Jahr) gefolgt von dem Zeitteil (Stunden, Minuten, Sekunden und Zeitzone). Manchmal ist es erwünscht, nur die Zeit zu bekommen. In diesen Fällten wird die toTimeString() Methode eingesetzt.

+ +

Die toDateString() Methode ist besonders nützlich, weil JavaScript-Umgebungen die ECMA-262 implementieren. manchmal unterschiedliche Ergebnisse bei der Ausführung der {{jsxref("Date.prototype.toString()", "toString()")}} Methode eines {{jsxref("Date")}} Objektes liefern. Dieses liegt daran, weil das zurückgegebene Format der {{jsxref("Date.prototype.toString()", "toString()")}} Methode implementierungsabhängig ist, über mehrere Plattformen hinweg zu inkonsistenten Ergebnissen führen kann.

+ +

Beispiele

+ +

Einsatz von toDateString()

+ +
var d = new Date(1993, 5, 28, 14, 39, 7);
+
+console.log(d.toString());     // logs Wed Jun 28 1993 14:39:07 GMT-0600 (PDT)
+console.log(d.toDateString()); // logs Wed Jun 28 1993
+
+ +
+

Anmerkung: Der Monat ist 0-basiert wenn er als Argument in {{jsxref("Date")}} benutzt wird (0 entspricht Januar und 11 entspricht Dezember).

+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.9.5.3', 'Date.prototype.toDateString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toDateString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/togmtstring/index.html b/files/de/web/javascript/reference/global_objects/date/togmtstring/index.html new file mode 100644 index 0000000000..c80dfdc5b9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/togmtstring/index.html @@ -0,0 +1,87 @@ +--- +title: Date.prototype.toGMTString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toGMTString +tags: + - Date + - Deprecated + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toGMTString +--- +
{{JSRef}} {{deprecated_header}}
+ +
Die toGMTString() Methode konvertiert ein Datum in ein String unter Benutzung der mittleren Greenwich Zeit. Das exakte Format des Rückgabewertes der toGMTString() Methode variierte von Browser zu Browser. Generel wird ein für Menschen lesbarer String zurückgegeben.
+ +
 
+ +
{{noteStart}}toGMTString() ist deprecated und sollte nicht mehr benutzt werden. Es ist nur noch für die Rückwärtskompatibilität vorhanden; nutzt stattdessen {{jsxref("Date.prototype.toUTCString()", "toUTCString()")}}{{noteEnd}}
+ +
 
+ +

Syntax

+ +
dateObj.toGMTString()
+ +

Rückgabewert

+ +

Einen String, der das gegebene {{jsxref("Date")}} Objekt nach den Internet Greenwich Mean Zeit (GMT) Konventionen repräsentiert.

+ +

Beispiele

+ +

Einfaches Beispiel

+ +

In diesem Beispiel konvertiert die toGMTString() Methode das {{jsxref("date")}} Objekt zu einem String mit der GMT (UTC) unter benutzung der Systemzeitzone. Die exakte Formatierung des String hängt von der Implementierung ab.

+ +
var today = new Date();
+var str = today.toGMTString();  // deprecated! use toUTCString()
+
+console.log(str);               // Mon, 18 Dec 1995 17:28:35 GMT
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition, aber schon als deprecated markiert. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-B.2.6', 'Date.prototype.toGMTString')}}{{Spec2('ES5.1')}}Im (informativen) Anhang B "Compatibility" definiert.
{{SpecName('ES6', '#sec-date.prototype.togmtstring', 'Date.prototype.toGMTString')}}{{Spec2('ES6')}}Im (normativen) Anhang B "Additional ECMAScript Features for Web Browsers" definiert.
{{SpecName('ESDraft', '#sec-date.prototype.togmtstring', 'Date.prototype.toGMTString')}}{{Spec2('ESDraft')}}Im (normativen) Anhang B "Additional ECMAScript Features for Web Browsers" definiert.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toGMTString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/toisostring/index.html b/files/de/web/javascript/reference/global_objects/date/toisostring/index.html new file mode 100644 index 0000000000..8d84d65c3c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/toisostring/index.html @@ -0,0 +1,109 @@ +--- +title: Date.prototype.toISOString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toISOString +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toISOString +--- +
{{JSRef}}
+ +

Die toISOString() Methode gibt einen String im einfach erweitertem ISO format (ISO 8601) zurück, welcher immer 24 oder 27 Zeichen lang ist (YYYY-MM-DDTHH:mm:ss.sssZ oder ±YYYYYY-MM-DDTHH:mm:ss.sssZ). Die Zeitzone ist immer 0 UTC, wie es durch den Suffix "Z" angedeutet wird.

+ +
{{EmbedInteractiveExample("pages/js/date-toisostring.html")}}
+ + + +

Syntax

+ +
dateObj.toISOString()
+
+ +

Rückgabewert

+ +

Ein String, der das gegebene {{jsxref("Date")}} Objekt im ISO 8601 Format bezüglich der Weltzeit (UTC) repräsentiert.

+ +

Beispiele

+ +

Using toISOString()

+ +
var today = new Date('05 October 2011 14:48 UTC');
+
+console.log(today.toISOString()); // Returns 2011-10-05T14:48:00.000Z
+
+ +

Das obere Beispiel nutzt das Einlesen eines nicht standartisierten String Wert, welcher in nicht-Mozilla Browsern manchmal nicht richtig eingelesen wird.

+ +

Polyfill

+ +

Die Methode wurde in ECMA-262 5th edition standartisiert. In Umgebungen, die diese Methode nicht unterstützen (z. B. weil sie nicht aktualisiert werden), kann folgende Methode genutzt werden:

+ +
if (!Date.prototype.toISOString) {
+  (function() {
+
+    function pad(number) {
+      if (number < 10) {
+        return '0' + number;
+      }
+      return number;
+    }
+
+    Date.prototype.toISOString = function() {
+      return this.getUTCFullYear() +
+        '-' + pad(this.getUTCMonth() + 1) +
+        '-' + pad(this.getUTCDate()) +
+        'T' + pad(this.getUTCHours()) +
+        ':' + pad(this.getUTCMinutes()) +
+        ':' + pad(this.getUTCSeconds()) +
+        '.' + (this.getUTCMilliseconds() / 1000).toFixed(3).slice(2, 5) +
+        'Z';
+    };
+
+  }());
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.9.5.43', 'Date.prototype.toISOString')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.
{{SpecName('ES6', '#sec-date.prototype.toisostring', 'Date.prototype.toISOString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.toisostring', 'Date.prototype.toISOString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toISOString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tojson/index.html b/files/de/web/javascript/reference/global_objects/date/tojson/index.html new file mode 100644 index 0000000000..1d65876585 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tojson/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.toJSON() +slug: Web/JavaScript/Reference/Global_Objects/Date/toJSON +tags: + - Date + - JavaScript + - Methode(2) + - Prototype + - Referenz +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toJSON +--- +
{{JSRef}}
+ +

Die toJSON() Methode gibt einen String zurück, der das {{jsxref("Date")}} Objekt darstellt.

+ +
{{EmbedInteractiveExample("pages/js/date-tojson.html")}}
+ + + +

Syntax

+ +
dateObj.toJSON()
+ +

Rückgabewert

+ +

Ein String, der das gegebene date Objekt repräsentiert.

+ +

Beschreibung

+ +

{{jsxref("Date")}} Instanzen repräsentieren einen bestimmten Zeitpunkt. Ein Aufruf von toJSON() gibt unter Verwendung von {{jsxref("Date.prototype.toISOString()", "toISOString()")}} einen String zurück, der den Wert des {{jsxref("Date")}} Objekts darstellt. Diese Methode ist dafür vorgesehen, {{jsxref("Date")}} Objekte während der {{Glossary("JSON")}} Serialisierung standardisiert zu serialisieren.

+ +

Beispiele

+ +

Einsatz von toJSON()

+ +
var jsonDate = (new Date()).toJSON();
+var backToDate = new Date(jsonDate);
+
+console.log(jsonDate); //2015-10-26T07:46:36.611Z
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusBemerkung
{{SpecName('ES5.1', '#sec-15.9.5.44', 'Date.prototype.toJSON')}}{{Spec2('ES5.1')}}Erstmalige Definition. Implementiert in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-date.prototype.tojson', 'Date.prototype.toJSON')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.tojson', 'Date.prototype.toJSON')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toJSON")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tolocaledatestring/index.html b/files/de/web/javascript/reference/global_objects/date/tolocaledatestring/index.html new file mode 100644 index 0000000000..21248d939a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tolocaledatestring/index.html @@ -0,0 +1,188 @@ +--- +title: Date.prototype.toLocaleDateString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString +tags: + - Date + - IANA Timezone Forma + - Internationalization + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString +--- +
{{JSRef}}
+ +

Die toLocaleDateString() Methode gibt einen sprachsensitiven String mit dem Datumsteil des Zeitpunktes zurück. Die neuen Argumente locales und options können eingesetzt werden, um die Sprache (und damit die Formatierung) einzustellen oder benutzerdefinierte Formatierungen vorzunehmen. In älteren Implementierungen, die locales und options ignorieren, ist die Formatierung des String implementierungsabhängig.

+ +
{{EmbedInteractiveExample("pages/js/date-tolocaledatestring.html")}}
+ + + +

Syntax

+ +
dateObj.toLocaleDateString([locales [, options]])
+ +

Parameter

+ +

Überprüfe das Kapitel {{anch("Browser_compatibility", "Browserkompatibilität")}}, um zu erfahren, welcher Browser die Argumente locales and options unterstützt. Zudem sollte das Beispiel {{anch("Checking_for_support_for_locales_and_options_arguments", "Unterstützung der Argumente locales und options")}} beachtet werden.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat', 'Parameter')}}
+ +
Der Standardwert für jede Eigenschaft einer Datums-Zeitkomponente ist {{jsxref("undefined")}}, wenn aber die Eigenschaften weekday, year, month, day {{jsxref("undefined")}} sind, sind die Eigenschaften year, month, und day "numeric".
+ +

Rückgabewert

+ +

Einen String, der den Datumsteil des gegebenen {{jsxref("Date")}} Objektes mit sprachspezifischen Konventionen repräsentiert.

+ +

Beispiele

+ +

Einsatz von toLocaleDateString()

+ +

Standardeinsatz ohne Angaben zur Sprache und Formatierung. Ein formatierter String in der Standardsprache mit Standardoption wird zurückgegeben.

+ +
var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleDateString() ohne Argumente abhängig von der Implementierung,
+// der Standardsprache und der Standardzeitzone.
+console.log(date.toLocaleDateString());
+// → "12/11/2012" wenn in der Sprache en-US mit America/Los_Angeles Zeitzone ausgeführt
+
+ +

Unterstützung der Argumente locales und options

+ +

Die Argumente locales and options sind noch nicht in allen Browsern unterstützt. Um herauszufinden, ob eine Implementierung die Argumente unterstützt, kann die Anforderung benutzt werden, dass bei nicht existierenden Sprachen ein {{jsxref("RangeError")}} erzeugt wird:

+ +
function toLocaleDateStringSupportsLocales() {
+  try {
+    new Date().toLocaleDateString('i');
+  } catch (e) {
+    return e.name === 'RangeError';
+  }
+  return false;
+}
+
+ +

Einsatz von locales

+ +

Das Beispiel zeigt einige Variation von internationalisierten Datumsformaten. Um das Format der Sprache der Benutzerschnittstelle (z. B. Webseite) zu bekommen, muss die Sprache (und manchmal eine Fallback-Sprache) mit dem Argument locales gesetzt werden:

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Die unteren Formate setzen ein lokale Zeitzone voraus:
+// America/Los_Angeles für die US
+
+// US Englischer Einsatz von Monat-Tag-Jahr
+console.log(date.toLocaleDateString('en-US'));
+// → "12/19/2012"
+
+// British Englischer Einsatz von Tag-Monat-Jahr
+console.log(date.toLocaleDateString('en-GB'));
+// → "20/12/2012"
+
+// Koreanischer Einsatz von Jahr-Monat-Tag
+console.log(date.toLocaleDateString('ko-KR'));
+// → "2012. 12. 20."
+
+// Event für Persien. Es ist schwer manuell in Solar Hijri zu konvertieren
+console.log(date.toLocaleDateString('fa-IR'));
+// → "۱۳۹۱/۹/۳۰"
+
+// In den meisten arabischen Ländern werden arabische Ziffern genutzt.
+console.log(date.toLocaleDateString('ar-EG'));
+// → "٢٠‏/١٢‏/٢٠١٢"
+
+// Für mansche japanische Anwendungen wird er japanische Kalender benutzt,
+// bei dem das Jahr 2012 das Jahr 24 der Heisei-Zeit ist.
+console.log(date.toLocaleDateString('ja-JP-u-ca-japanese'));
+// → "24/12/20"
+
+// Wenn eine Sprache angegeben wird, die vielleicht nicht unterstützt wird,
+// wie Balinesisch, wird eine fallback Sprache (Indonesisch) definiert.
+console.log(date.toLocaleDateString(['ban', 'id']));
+// → "20/12/2012"
+
+ +

Einsatz von options

+ +

Das Ergebnis der toLocaleDateString() Methode kann benutzerdefiniert mit dem Argument options beeinflusst werden.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Gibt einen Wochentag und ein langes Datum zurück.
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(date.toLocaleDateString('de-DE', options));
+// → "Donnerstag, 20. Dezember 2012"
+
+// Macht UTC sichtbar
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(date.toLocaleDateString('en-US', options));
+// → "Thursday, December 20, 2012, GMT"
+
+ +

Performance

+ +

Wenn viele Daten formatiert werden sollen, ist es besser ein {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekt zu erstellen und die Funktion {{jsxref("DateTimeFormat.prototype.format", "format")}} zu benutzen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', 'sec-15.9.5.6', 'Date.prototype.toLocaleDateString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}{{Spec2('ESDraft')}} 
{{SpecName('ES Int 1.0', '#sec-13.3.2', 'Date.prototype.toLocaleDateString')}}{{Spec2('ES Int 1.0')}}Definition der locales und options Argumente.
{{SpecName('ES Int 2.0', '#sec-13.3.2', 'Date.prototype.toLocaleDateString')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Date.prototype.toLocaleDateString', 'Date.prototype.toLocaleDateString')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toLocaleDateString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tolocaleformat/index.html b/files/de/web/javascript/reference/global_objects/date/tolocaleformat/index.html new file mode 100644 index 0000000000..f8f596983f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tolocaleformat/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.toLocaleFormat() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleFormat +tags: + - Date + - Java + - Method + - Non-standard + - Prototype + - Reference +translation_of: Archive/Web/JavaScript/Date.toLocaleFormat +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die nicht standardisierte Methode toLocaleFormat() konvertiert einen {{jsxref("date")}} Objekt zu einem String im übergebenen Format. {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} ist einen standardisierte Alternative zum Formatieren von {{jsxref("Date")}} Objekten. Siehe auch die neuere Version der {{jsxref("Date.prototype.toLocaleDateString()")}} Methode an.

+ +
Diese Funktion wurde Entfernt und wird ab Firefox 58 nicht mehr Funktionieren. Für mehr Information un Migrationshilfe siehe in den Artikel {{jsxref("Errors/Deprecated_toLocaleFormat","Warning: Date.prototype.toLocaleFormat is deprecated")}}.
+ +

Syntax

+ +
dateObj.toLocaleFormat(formatString)
+ +

Parameter

+ +
+
formatString
+
Ein Formatstring, welche im selben Format sein muss, wie es die C Funktion strftime() erwartet.
+
+ +

Rückgabewert

+ +

Einen String, der das gegebenen {{jsxref("Date")}} Objekt im spezifizierten Format repräsentiert.

+ +

Beschreibung

+ +

Die toLocaleFormat() Methode ermöglicht es eine größere Kontrolle über das Formatieren von generierten Daten und/oder Zeiten zu haben. Namen für Monate und Wochentage werden mit den Spracheinstellungen des Betriebssystem formatiert. Die Anordnung von Tagen, Monaten und anderen Bestandteilen in der Formatierung wird nicht automatisch vorgenommen. Sie sind von den Angaben in dem Formatierungsstring abhängig. Man muss dafür sorgen, dass der Formatierungsstring zu richtigen Ergebnissen auf dem Benutzersystem führt. Man sollte vorsichtig sein, weil die Spracheinstellungen im Browser nicht die gleichen sein müssen, wie die des Betriebssystems.

+ +

Extension und XULRunner Entwickler wissen, dass das Laden von Formatstring aus .dtd oder .properties Dateien mit dem Einsatz von URIs (z. B. chrome://somedomain/locale/somefile.ext) vermieden werden sollte, weil .dtd/.properties Dateien und die toLocaleFormat() Methode nicht notwendiger Weise der gleichen Sprache folgen. Dieses kann zu nicht lesbaren oder merkwürdig formatierten Daten führen.

+ +

Außerdem ist zu beachten, dass der Einsatz von Formatierungen abhängig von der Plattform und den benutzerdefinierten Einstellungen des Benutzers nicht immer gewollt ist. Man sollte stattdessen die allgemeineren toLocale* Methoden des {{jsxref("Global_Objects/Date", "Date")}} Objektes nutzen oder ein eigenes Format mit den get* Methoden einer {{jsxref("Global_Objects/Date", "Date")}} Instanz erstellen.

+ +

Beispiele

+ +

Einsatz von toLocaleFormat()

+ +
var today = new Date();
+var date = today.toLocaleFormat('%A, %B %e, %Y'); // Schlechtes Beispiel
+
+ +

Im Beispiel gibt toLocaleFormat() einen String wie "Mittwoch, Oktober 3, 2007" zurück. Zu beachten ist, dass der String nicht unbedingt den Sprachegegebenheiten angepasst ist, was auf die oben genannten Probleme zurückzuführen ist.

+ +

Polyfill

+ +

Wenn die DateJS Bibliothek benutzt wird, kann folgender Polyfill benutzt werden:

+ +
if (!Date.prototype.toLocaleFormat) {
+    (function() {
+        Date.prototype.toLocaleFormat = function(formatString) {
+            return this.format(formatString);
+        };
+    }());
+}
+ +

Spezifikationen

+ +

Nicht spezifiziert. Implementiert in JavaScript 1.6.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toLocaleFormat")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tolocalestring/index.html b/files/de/web/javascript/reference/global_objects/date/tolocalestring/index.html new file mode 100644 index 0000000000..4db8f38c1e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tolocalestring/index.html @@ -0,0 +1,188 @@ +--- +title: Date.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString +tags: + - Date + - Internationalization + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString +--- +
{{JSRef}}
+ +

Die toLocaleString() Methode gibt einen sprachsensitiven String mit dem Zeitpunkt zurück. Die neuen Argumente locales und options können eingesetzt werden, um die Sprache (und damit die Formatierung) einzustellen oder benutzerdefinierte Formatierungen vorzunehmen. In älteren Implementierungen, die locales und options ignorieren, ist die Formatierung des String implementierungsabhängig.

+ +
{{EmbedInteractiveExample("pages/js/date-tolocalestring.html")}}
+ + + +

Syntax

+ +
dateObj.toLocaleString([locales[, options]])
+ +

Parameter

+ +

Überprüfe das Kapitel {{anch("Browser_compatibility", "Browserkompatibilität")}}, um zu erfahren, welcher Browser die Argumente locales and options unterstützt. Zudem sollte das Beispiel {{anch("Checking_for_upport_for_locales_and_options_arguments", "Unterstützung der Argumente locales und options")}} beachtet werden.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat', 'Parameter')}}
+ +
 
+ +
Der Standardwert für jede Eigenschaft einer Datums-Zeitkomponente ist {{jsxref("undefined")}}, wenn aber die Eigenschaften weekday, year, month, day, hour, minute, second {{jsxref("undefined")}} sind, sind die Eigenschaften year, month, day, hour, minute und second "numeric".
+ +
 
+ +

Rückgabewert

+ +

Einen String, der das gegebenen {{jsxref("Date")}} Objektes mit sprachspezifischen Konventionen repräsentiert.

+ +

Beispiele

+ +

Einsatz von toLocaleString()

+ +

Standardeinsatz ohne Angaben zur Sprache und Formatierung. Ein formatierter String in der Standardsprache mit Standardoption wird zurückgegeben.

+ +
var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleString() ohne Argumente abhängig von der Implementierung,
+// der Standardsprache und der Standardzeitzone.
+console.log(date.toLocaleString());
+// → "12/11/2012, 7:00:00 PM" wenn in der Sprache en-US mit America/Los_Angeles Zeitzone ausgeführt
+
+ +

Unterstützung der Argumente locales und options

+ +

Die Argumente locales and options sind noch nicht in allen Browsern unterstützt. Um herauszufinden, ob eine Implementierung die Argumente unterstützt, kann die Anforderung benutzt werden, dass bei nicht existierenden Sprachen ein {{jsxref("RangeError")}} erzeugt wird:

+ +
function toLocaleStringSupportsLocales() {
+  try {
+    new Date().toLocaleString('i');
+  } catch (e) {
+    return e instanceof RangeError;
+  }
+  return false;
+}
+
+ +

Einsatz von locales

+ +

Das Beispiel zeigt einige Variation von internationalisierten Datums- und Zeitformaten. Um das Format der Sprache der Benutzerschnittstelle (z. B. Webseite) zu bekommen, muss die Sprache (und manchmal eine fallback Sprache) mit dem Argument locales gesetzt werden:

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// US englischer einsatz mit Monat-Tag-Jahr und 12-Stunden Zeit mit AM/PM
+console.log(date.toLocaleString('en-US'));
+// → "12/19/2012, 7:00:00 PM"
+
+// Britisch englischer Einsatz mit Tag-Monat-Jahr und 24-Stunden Zeit ohne AM/PM
+console.log(date.toLocaleString('en-GB'));
+// → "20/12/2012 03:00:00"
+
+// Koreanischer Einsatz mit Jahr-Monat-Tag und 12-Stunden Zeit mit AM/PM
+console.log(date.toLocaleString('ko-KR'));
+// → "2012. 12. 20. 오후 12:00:00"
+
+// In den meisten arabischen Ländern werden arabische Ziffern genutzt.
+console.log(date.toLocaleString('ar-EG'));
+// → "٢٠‏/١٢‏/٢٠١٢ ٥:٠٠:٠٠ ص"
+
+// Für mansche japanische Anwendungen wird er japanische Kalender benutzt,
+// bei dem das Jahr 2012 das Jahr 24 der Heisei-Zeit ist.
+console.log(date.toLocaleString('ja-JP-u-ca-japanese'));
+// → "24/12/20 12:00:00"
+
+// Wenn eine Sprache angegeben wird, die vielleicht nicht unterstützt wird,
+// wie Balinesisch, wird eine fallback Sprache (Indonesisch) definiert.
+console.log(date.toLocaleString(['ban', 'id']));
+// → "20/12/2012 11.00.00"
+
+ +

Einsatz von options

+ +

Das Ergebnis der toLocaleString() Methode kann benutzerdefiniert mit dem Argument options beeinflusst werden.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Gibt einen Wochentag und ein langes Datum zurück
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(date.toLocaleString('de-DE', options));
+// → "Donnerstag, 20. Dezember 2012"
+
+//  Macht UTC sichtbar
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(date.toLocaleString('en-US', options));
+// → "Thursday, December 20, 2012, GMT"
+
+// Manchal brauchen US-Sprachen auch 24-Stunden Zeiten
+console.log(date.toLocaleString('en-US', { hour12: false }));
+// → "12/19/2012, 19:00:00"
+
+ +

Performance

+ +

Wenn viele Daten formatiert werden sollen, ist es besser ein {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekt zu erstellen und die Funktion {{jsxref("DateTimeFormat.prototype.format", "format")}} zu benutzen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.5', 'Date.prototype.toLocaleString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}{{Spec2('ESDraft')}} 
{{SpecName('ES Int 1.0', '#sec-13.3.1', 'Date.prototype.toLocaleString')}}{{Spec2('ES Int 1.0')}}Definition der locales und options Argumente.
{{SpecName('ES Int 2.0', '#sec-13.3.1', 'Date.prototype.toLocaleString')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Date.prototype.toLocaleString', 'Date.prototype.toLocaleString')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toLocaleString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tolocaletimestring/index.html b/files/de/web/javascript/reference/global_objects/date/tolocaletimestring/index.html new file mode 100644 index 0000000000..da74e548cf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tolocaletimestring/index.html @@ -0,0 +1,177 @@ +--- +title: Date.prototype.toLocaleTimeString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString +tags: + - Date + - Internationalization + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString +--- +
{{JSRef}}
+ +

Die toLocaleTimeString() Methode gibt einen sprachsensitiven String mit dem Zeitsteil des Zeitpunktes zurück. Die neuen Argumente locales und options können eingesetzt werden, um die Sprache (und damit die Formatierung) einzustellen oder benutzerdefinierte Formatierungen vorzunehmen. In älteren Implementierungen, die locales und options ignorieren, ist die Formatierung des String implementierungsabhängig.

+ +
{{EmbedInteractiveExample("pages/js/date-tolocaletimestring.html")}}
+ + + +

Syntax

+ +
dateObj.toLocaleTimeString([locales[, options]])
+ +

Parameter

+ +

Überprüfe das Kapitel {{anch("Browser_compatibility", "Browserkompatibilität")}}, um zu erfahren, welcher Browser die Argumente locales and options unterstützt. Zudem sollte das Beispiel {{anch("Checking_for_support_for_locales_and_options_arguments", "Unterstützung der Argumente locales und options")}} beachtet werden.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat', 'Parameter')}}
+ +
Der Standardwert für jede Eigenschaft einer Datums-Zeitkomponente ist {{jsxref("undefined")}}, wenn aber die Eigenschaften hour, minute, second {{jsxref("undefined")}} sind, sind die Eigenschaften hour, minute und second "numeric".
+ +

Rückgabewert

+ +

Einen String, der den Zeitteil des gegebenen {{jsxref("Date")}} Objektes mit sprachspezifischen Konventionen repräsentiert.

+ +

Beispiele

+ +

Einsatz von toLocaleTimeString()

+ +

Standardeinsatz ohne Angaben zur Sprache und Formatierung. Ein formatierter String in der Standardsprache mit Standardoption wird zurückgegeben.

+ +
var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleTimeString() ohne Argumente abhängig von der Implementierung,
+// der Standardsprache und der Standardzeitzone.
+console.log(date.toLocaleTimeString());
+// → "7:00:00 PM"  wenn in der Sprache en-US mit America/Los_Angeles Zeitzone ausgeführt
+
+ +

Unterstützung der Argumente locales und options

+ +

Die Argumente locales and options sind noch nicht in allen Browsern unterstützt. Um herauszufinden, ob eine Implementierung die Argumente unterstützt, kann die Anforderung benutzt werden, dass bei nicht existierenden Sprachen ein {{jsxref("RangeError")}} erzeugt wird:

+ +
function toLocaleTimeStringSupportsLocales() {
+  try {
+    new Date().toLocaleTimeString('i');
+  } catch (e) {
+    return e​.name === 'RangeError';
+  }
+  return false;
+}
+
+ +

Einsatz von locales

+ +

Das Beispiel zeigt einige Variation von internationalisierten Zeitformaten. Um das Format der Sprache der Benutzerschnittstelle (z. B. Webseite) zu bekommen, muss die Sprache (und manchmal eine fallback Sprache) mit dem Argument locales gesetzt werden:

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// die folgenden Formate setzen voraus, dass man die Zeitzone
+// America/Los_Angeles für US eingestellt hat.
+
+// US Englische Sprache; 12-Stunden Zeit mit AM/PM
+console.log(date.toLocaleTimeString('en-US'));
+// → "7:00:00 PM"
+
+// British Englishe Sprache; 24-Stunden Zeit ohne AM/PM
+console.log(date.toLocaleTimeString('en-GB'));
+// → "03:00:00"
+
+// Koreanische Sprache; 12-Stunden Zeit mit AM/PM
+console.log(date.toLocaleTimeString('ko-KR'));
+// → "오후 12:00:00"
+
+// In den meisten arabischen Ländern werden arabische Ziffern genutzt.
+console.log(date.toLocaleTimeString('ar-EG'));
+// → "٧:٠٠:٠٠ م"
+
+// Wenn eine Sprache angegeben wird, die vielleicht nicht unterstützt wird,
+// wie Balinesisch, wird eine fallback Sprache (Indonesisch) definiert.
+console.log(date.toLocaleTimeString(['ban', 'id']));
+// → "11.00.00"
+
+ +

Einsatz von options

+ +

Das Ergebnis der toLocaleTimeString() Methode kann benutzerdefiniert mit dem Argument options beeinflusst werden.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Macht UTC sichtbar
+var options = { timeZone: 'UTC', timeZoneName: 'short' };
+console.log(date.toLocaleTimeString('en-US', options));
+// → "3:00:00 AM GMT"
+
+// Manchal brauchen US-Sprachen auch 24-Stunden Zeiten
+console.log(date.toLocaleTimeString('en-US', { hour12: false }));
+// → "19:00:00"
+
+ +

Performance

+ +

Wenn viele Zeiten formatiert werden sollen, ist es besser ein {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekt zu erstellen und die Funktion {{jsxref("DateTimeFormat.prototype.format", "format")}} zu benutzen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.7', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ESDraft')}} 
{{SpecName('ES Int 1.0', '#sec-13.3.3', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES Int 1.0')}}Definition der locales und options Argumente.
{{SpecName('ES Int 2.0', '#sec-13.3.3', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Date.prototype.toLocaleTimeString', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toLocaleTimeString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tosource/index.html b/files/de/web/javascript/reference/global_objects/date/tosource/index.html new file mode 100644 index 0000000000..12764ae672 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tosource/index.html @@ -0,0 +1,61 @@ +--- +title: Date.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Date/toSource +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +
Die toSource() Methode gibt eine String Repräsentation des Quelltextes des Objektes zurück.
+ +
 
+ +

Syntax

+ +
dateObj.toSource()
+Date.toSource()
+ +

Rückgabewert

+ +

Ein String, der den Quelltext des gegebenen {{jsxref("Date")}} Objekt repräsentiert.

+ +

Beschreibung

+ +

Die toSource() Methode gibt die folgenden Werte zurück:

+ + + + + +

Diese Methode wird intern von JavaScript aufgerufen und wird nicht explizit im Quelltext eingesetzt.

+ +

Spezifikationen

+ +

Kein Standard. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toSource")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/tostring/index.html b/files/de/web/javascript/reference/global_objects/date/tostring/index.html new file mode 100644 index 0000000000..470fd1903c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/tostring/index.html @@ -0,0 +1,94 @@ +--- +title: Date.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toString +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toString +--- +
{{JSRef}}
+ +

Die toString() Methode gibt einen String zurück, der ein spezifisches {{jsxref("Date")}} Objekt repräsentiert.

+ +
{{EmbedInteractiveExample("pages/js/date-tostring.html")}}
+ + + +

Syntax

+ +
dateObj.toString()
+ +

Rückgabewert

+ +

Einen String, der das gegebene {{jsxref("Date")}} Objekt repräsentiert.

+ +

Beschreibung

+ +

Das {{jsxref("Date")}} Objekt überschreibt die toString() Methode des {{jsxref("Object")}} Objekts. Es wird nicht von  {{jsxref("Object.prototype.toString()")}} geerbt. Für {{jsxref("Date")}} Objekte gibt die toString() Methode einen String zurück, der das Objekt repräsentiert.

+ +

Die toString() Methode gibt immer einen String zurück, der den Zeitpunkt repräsentiert. Dieser String wird in einem amerikanisch-englischen Format zurückgegeben.

+ +

JavaScript ruft die toString() Methode automatisch auf, wenn ein {{jsxref("Date")}} Objekte als Text-Wert benötigt wird oder wenn das Objekt in einer String-Konkatination verwendet wird.

+ +

toString() ist eine generische Methode. Wenn this keine Instanz vom Typ {{jsxref("Date")}} ist, gibt die Methode "Invalid Date" zurück.

+ +

Beispiele

+ +

Einsatz von toString()

+ +

Im folgenden wird die Variable myVar mit dem Rückgabewert der toString() Methode eines {{jsxref("Date")}} Objektes beschrieben.

+ +
var x = new Date();
+myVar = x.toString(); // Weist der Variablen myVar folgenden Wert zu:
+                      // Mon Sep 28 1998 14:36:22 GMT-0700 (PDT)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.9.5.2', 'Date.prototype.toLocaleTimeString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.tostring', 'Date.prototype.toString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.tostring', 'Date.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/totimestring/index.html b/files/de/web/javascript/reference/global_objects/date/totimestring/index.html new file mode 100644 index 0000000000..65d643c72a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/totimestring/index.html @@ -0,0 +1,88 @@ +--- +title: Date.prototype.toTimeString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toTimeString +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toTimeString +--- +
{{JSRef}}
+ +

Die toDateString() Methode gibt den Zeitteil eines {{jsxref("Date")}} Objektes für Menschen lesbar,  im amerikanisch-englischen Format, zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-totimestring.html")}}
+ + + +

Syntax

+ +
dateObj.toTimeString()
+ +

Rückgabewert

+ +

Ein String, der den Zeitteil des gegebenen {{jsxref("Date")}} Objektes für menschen lesbar im amerikanisch-englischen Format enthält

+ +

Beschreibung

+ +

{{jsxref("Date")}} Instanzen referenzieren einen spezifischen Zeitpunkt. Mit dem Aufruf von {{jsxref("Date.prototype.toString()", "toString()")}} wird dieser Zeitpunkt für Menschen lesbar, im amerikanisch-englischen Format, zurückgegeben. In SpiderMonkey enthält diese Format den Datumsteil (Tag, Monat und Jahr) gefolgt von dem Zeitteil (Stunden, Minuten, Sekunden und Zeitzone). Manchmal ist es erwünscht, nur den Datumsteil zu bekommen. In diesen Fällen wird die toDateString() Methode eingesetzt.

+ +

Die toTimeString() Methode ist besonders nützlich, weil JavaScript-Umgebungen die ECMA-262 implementieren, manchmal unterschiedliche Ergebnisse bei der Ausführung der {{jsxref("Date.prototype.toString()", "toString()")}} Methode eines {{jsxref("Date")}} Objektes liefern. Dieses liegt daran, weil das zurückgegebene Format der {{jsxref("Date.prototype.toString()", "toString()")}} Methode implementierungsabhängig ist und über mehrere Plattformen hinweg zu inkonsistenten Ergebnissen führen kann.

+ +

Beispiele

+ +

Einsatz von toTimeString()

+ +
var d = new Date(1993, 6, 28, 14, 39, 7);
+
+console.log(d.toString());     // logs Wed Jul 28 1993 14:39:07 GMT-0600 (PDT)
+console.log(d.toTimeString()); // logs 14:39:07 GMT-0600 (PDT)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.9.5.4', 'Date.prototype.toTimeString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.totimestring', 'Date.prototype.toTimeString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.totimestring', 'Date.prototype.toTimeString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toTimeString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/toutcstring/index.html b/files/de/web/javascript/reference/global_objects/date/toutcstring/index.html new file mode 100644 index 0000000000..02dc9d414b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/toutcstring/index.html @@ -0,0 +1,84 @@ +--- +title: Date.prototype.toUTCString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toUTCString +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString +--- +
{{JSRef}}
+ +

Die toUTCString() Methode konvertiert ein {{jsxref("Date")}} in einen String. Dabei wird die UTC Zeitzone verwendet.

+ +
{{EmbedInteractiveExample("pages/js/date-toutcstring.html")}}
+ + + +

Syntax

+ +
dateObj.toUTCString()
+ +

Rückgabewert

+ +

Ein String, der das gegebene {{jsxref("Date")}} Objekt mit Zuhilfenahme der UTC Zeitzonen repräsentiert.

+ +

Beschreibung

+ +

Der Rückgabewert der toUTCString() Methode ist ein für menschen lesbarer String, der die UTC Zeitzone nutzt. Das Format des zurückgegebenen String kann von Plattform zu Plattform variieren. Der am häufigsten eingesetzte Wert ist ein RFC-1123 formatierter Zeitstempel, welcher ein Update des Zeitstempels in der Version RFC-822 ist.

+ +

Beispiele

+ +

Einsatz von toUTCString()

+ +
var today = new Date('Wed, 14 Jun 2017 00:00:00 PDT');
+var UTCstring = today.toUTCString(); // Wed, 14 Jun 2017 07:00:00 GMT
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.9.5.42', 'Date.prototype.toUTCString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.toutcstring', 'Date.prototype.toUTCString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.toutcstring', 'Date.prototype.toUTCString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.toUTCString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/utc/index.html b/files/de/web/javascript/reference/global_objects/date/utc/index.html new file mode 100644 index 0000000000..56aa3fde32 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/utc/index.html @@ -0,0 +1,133 @@ +--- +title: Date.UTC() +slug: Web/JavaScript/Reference/Global_Objects/Date/UTC +tags: + - Date + - JavaScript + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/UTC +--- +
{{JSRef}}
+ +

Die Date.UTC() Methode akzeptiert die gleichen Parameter, wie der längste Konstruktor von {{jsxref("Date")}} und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 00:00:00 UTC zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-utc.html")}}
+ + + +

Syntax

+ +
Date.UTC(year, month[, day[, hour[, minute[, second[, millisecond]]]]])
+ +

Parameter

+ +
+
year
+
Ein volles Jahr
+
month
+
Eine ganze Zahl zwischen 0 und 11, die den Monat repräsentiert.
+
day
+
Optional. Eine ganze Zahl zwischen 1 und 31 den Tag des Monats repräsentiert.
+
hour
+
Optional. Eine ganze Zahl zwischen 0 und 23, die die Stunde des Tages repräsentiert.
+
minute
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Minute der Stunde repräsentiert.
+
second
+
Optional. Eine ganze Zahl zwischen 0 und 59, die die Sekunden der Minute repräsentiert.
+
millisecond
+
Optional. Eine ganze Zahl zwischen 0 und 999, die die Millisekunden einer Sekunde repräsentiert.
+
+ +

Rückgabewert

+ +

Eine Zahl, die die Anzahl der Millisekunden des gegebenen {{jsxref("Date")}} Objektes, die seit dem 1. Januar 1970 00:00:00 Weltzeit (UTC) vergangen sind, repräsentiert.

+ +

Beschreibung

+ +

Die UTC() Methode bekommt mit Komma getrennte Parameter des Datums / der Zeit und gibt die Anzahl der Millisekunden seit dem 1. Januar 1970 in Weltzeit zurück.

+ +

Es muss ein volles Jahr für year spezifiziert werden (z. B. 1998). Wenn ein Jahr zwischen 0 und 99 ist, wird die Methode das Jahr zu einem Jahr im zwanzigsten Jahrhundert konvertieren (1900 + year). Zum Beispiel wird 95 zu 1995 konvertiert.

+ +

Die UTC() Methode unterscheidet sich in zwei Punkten von dem {{jsxref("Date")}} Konstruktor:

+ + + +

Wenn ein Parameter außerhalb seiner spezifizierten Grenzen ist, wird die UTC() Methode andere Parameter verändern, um den Wert zu realisieren. Wird zum Beispiel 15 als Monat angegeben, so wird das Jahr um 1 inkrementiert (year + 1) und der Monat wird auf 3 gesetzt.

+ +

Weil UTC() eine statische Methode von {{jsxref("Date")}} ist, wird sie immer als Date.UTC() genutzt und nicht als Methode einer {{jsxref("Date")}} Instanz.

+ +

Beispiele

+ +

Einsatz von Date.UTC()

+ +

Im folgenden Beispiel wird ein {{jsxref("Date")}} Objekt mithilfe der UTC (nicht der Ortszeit) erstellt:

+ +
var utcDate = new Date(Date.UTC(2018, 11, 1, 0, 0, 0));
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-date.utc', 'Date.UTC')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-date.utc', 'Date.UTC')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-15.9.4.3', 'Date.UTC')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.UTC")}}

+ +

Anmerkungen zur Kompatibilität

+ +

Date.UTC mit weniger als zwei Argumenten

+ +

Wenn Date.UTC weniger als zwei Argumenten erhält, wird {{jsxref("NaN")}} zurückgegeben. Dieses Verhalten wurde in ECMAScript 2017 spezifiziert. Umgebungen, welche dieses Verhalten nicht unterstützen, werden aktualisiert (siehe {{bug(1050755)}}, ecma-262 #642).

+ +
Date.UTC();
+Date.UTC(1);
+
+// Safari: NaN
+// Chrome/Opera/V8: NaN
+
+// Firefox <54: nicht NaN
+// Firefox 54+: NaN
+
+// IE: nicht NaN
+// Edge: NaN
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/date/valueof/index.html b/files/de/web/javascript/reference/global_objects/date/valueof/index.html new file mode 100644 index 0000000000..18f540fa4d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/date/valueof/index.html @@ -0,0 +1,85 @@ +--- +title: Date.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Date/valueOf +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/valueOf +--- +
{{JSRef}}
+ +

Die valueOf() Methode gibt den primitiven Wert eines {{jsxref("Date")}} Objektes zurück.

+ +
{{EmbedInteractiveExample("pages/js/date-valueof.html")}}
+ +

Syntax

+ +
dateObj.valueOf()
+ +

Rückgabewert

+ +

Die Anzahl der Millisekunden zwischen dem 1. Januar 1970 00:00:00 UTC und dem gegebenen date Objekt.

+ +

Beschreibung

+ +

Die valueOf() Methode gibt den primitiven Wert eines {{jsxref("Date")}} Objektes als Nummern-Datentyp (number) zurück. Diese Nummer entspricht der Anzahl der Millisekunden seit dem 1. Januar 1970 UTC.

+ +

Diese Methode hat den gleiche Funktionsumfang wie die {{jsxref("Date.prototype.getTime()")}} Methode.

+ +

Diese Methode wird intern von JavaScript aufgerufen und muss nicht explizit im Quelltext verwendet werden.

+ +

Beispiele

+ +

Einsatz von valueOf()

+ +
var x = new Date(56, 6, 17);
+var myVar = x.valueOf();      // schreibt -424713600000 auf myVar
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.9.5.8', 'Date.prototype.valueOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-date.prototype.valueof', 'Date.prototype.valueOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-date.prototype.valueof', 'Date.prototype.valueOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Date.valueOf")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/decodeuricomponent/index.html b/files/de/web/javascript/reference/global_objects/decodeuricomponent/index.html new file mode 100644 index 0000000000..7eb2c2c905 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/decodeuricomponent/index.html @@ -0,0 +1,127 @@ +--- +title: decodeURIComponent() +slug: Web/JavaScript/Reference/Global_Objects/decodeURIComponent +translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent +--- +
{{jsSidebar("Objects")}}
+ +

Die Funktion decodeURIComponent() dekodiert eine URI-Komponente die zuvor durch {{jsxref("encodeURIComponent")}} (oder einer ähnlichen Funktion) kodiert wurden.

+ +

Syntax

+ +
decodeURIComponent(encodedURI)
+ +

Parameters

+ +
+
encodedURI
+
Die kodierte Komponente einer URI.
+
+ +

Rückgabewert

+ +

Ein neuer String der die decodierte Version der übergebenen URI-Komponente repräsentiert.

+ +

Beschreibung

+ +

Ersetzt jede Escape-Sequenz der übergebenen kodierten Komponente durch ihre entsprechenden Zeichen.

+ +

Beispiele

+ +

Dekodieren einer kyrillischen URL-Komponente

+ +
decodeURIComponent("JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B");
+// "JavaScript_шеллы"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Anfangs-Definition
{{SpecName('ES5.1', '#sec-15.1.3.2', 'decodeURIComponent')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-decodeuricomponent-encodeduricomponent', 'decodeURIComponent')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-decodeuricomponent-encodeduricomponent', 'decodeURIComponent')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe

+ + diff --git a/files/de/web/javascript/reference/global_objects/encodeuri/index.html b/files/de/web/javascript/reference/global_objects/encodeuri/index.html new file mode 100644 index 0000000000..2b8521f9e7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/encodeuri/index.html @@ -0,0 +1,163 @@ +--- +title: encodeURI() +slug: Web/JavaScript/Reference/Global_Objects/encodeURI +translation_of: Web/JavaScript/Reference/Global_Objects/encodeURI +--- +
{{jsSidebar("Objects")}}
+ +

Die encodeURI() Funktion kodiert ein Uniform Resource Identifier (Abk. URI, englisch für einheitlicher Bezeichner für Ressurcen), indem sie jedes Vorkommen von speziellen Zeichen durch die jeweilige UTF-8 Zeichenkette ersetzt, die das Zeichen repräsentiert.

+ +

Syntax

+ +
encodeURI(URI)
+ +

Parameter

+ +
+
URI
+
Ein vollständiger Uniform Resource Identifier.
+
+ +

Return value

+ +

Ein neuer String, kodiert als Uniform Resource Identifier (URI).

+ +

Beschreibung

+ +

Die Funktion geht davon aus, dass die URI eine richtige URI ist, sodass sie keine Zeichen kodiert die spezielle Bedeutungen haben.

+ +

encodeURI ersetzt alle Zeichen außer die folgenden mit ihrer zugehörigen UTF-8 Escape-Sequenz:

+ + + + + + + + + + + + + + + + + + + + +
TypBeinhaltet
Zurückgehaltene Zeichen; , / ? : @ & = + $
Unescapte alphanumerische Zeichen, - _ . ! ~ * ' ( )
Zeichen für Nummern#
+ +

Beachten Sie, dass die encodeURI Funktion keine richtigen HTTP GET und POST Requests erzeugen kann, wie für XMLHTTPRequests benötigt, da "&", "+", und "=" nicht kodiert werden. Diese werden in GET und POST als spezielle Zeichen behandelt. Für solche Verwendungen steht die {{jsxref("encodeURIComponent")}} Funktion zur Verfügung.

+ +

Beachten Sie auch, dass ein {{jsxref("URIError")}} erzeugt wird,  sobald versucht wird, ein surrogate, welches nicht zu einem high-low Paar gehört, zu kodieren.

+ +
// high-low paar ok
+console.log(encodeURI('\uD800\uDFFF'));
+
+// einzelnes high surrogate erzeugt ein "URIError: malformed URI sequence"
+console.log(encodeURI('\uD800'));
+
+// einzelnes low surrogate erzeugt ein "URIError: malformed URI sequence"
+console.log(encodeURI('\uDFFF')); 
+ +

Wenn Sie den neueren RFC3986 Standart für URLs benutzen möchten, der eckige Klammern beachtet (für IPv6) und Teile die zur URL gehören könnten (wie der Host) nicht kodiert, könnte der kleine Code-Auszug helfen:

+ +
function fixedEncodeURI(str) {
+    return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']');
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initial definition.
{{SpecName('ES5.1', '#sec-15.1.3.3', 'encodeURI')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-encodeuri-uri', 'encodeURI')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-encodeuri-uri', 'encodeURI')}}{{Spec2('ESDraft')}} 
+ +

Browser kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Normale Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
+

Normale Unterstützung

+
{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/encodeuricomponent/index.html b/files/de/web/javascript/reference/global_objects/encodeuricomponent/index.html new file mode 100644 index 0000000000..a632775085 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/encodeuricomponent/index.html @@ -0,0 +1,163 @@ +--- +title: encodeURIComponent() +slug: Web/JavaScript/Reference/Global_Objects/encodeURIComponent +tags: + - JavaScript + - URI +translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent +--- +
{{jsSidebar("Objects")}}
+ +

Die Methode encodeURIComponent() kodiert eine Komponente des Uniform Resource Identifier (URI) indem jedes Vorkommen bestimmter Zeichen durch ein, zwei, drei oder vier Escape-Sequenzen ersetzt werden, die der UTF8-Kodierung des Zeichens entsprechen. Vier Escape-Sequenzen werden nur bei Zeichen bestehend aus zwei "Surrogate"-Zeichen verwendet.

+ +

Syntax

+ +
encodeURIComponent(str);
+ +

Parameter

+ +
+
str
+
String. Eine URI-Komponente.
+
+ +

Beschreibung

+ +

encodeURIComponent kodiert alle Zeichen außer den Folgenden: alphabetische, dezimale Ziffern, - _ . ! ~ * ' ( )

+ +

Beachte, dass {{jsxref("URIError")}} beim Versuch geworfen wird, ein Surrogate-Zeichen zu kodieren, das nicht Teil eines High-Low-Paares ist, z.B.:

+ +
// Zulässiges High-Low-Paar
+console.log(encodeURIComponent('\uD800\uDFFF'));
+
+// alleinstehendes High-Surrogate-Zeichen wirft "URIError: malformed URI sequence"
+console.log(encodeURIComponent('\uD800'));
+
+// alleinstehendes Low-Surrogate-Zeichen wirft "URIError: malformed URI sequence"
+console.log(encodeURIComponent('\uDFFF'));
+
+ +

Um unerwartete Anfragen an den Server zu vermeiden, sollte encodeURIComponent für jeden benutzerdefinierten Parameter, der als Teil der URI übergeben wird, verwendet werden. Z.B. könnte ein Benutzer in einem variablen Kommentar "Thyme &time=again" schreiben. Ohne Verwendung von encodeURIComponent erhältst Du comment=Thyme%20&time=again. Beachte, dass das Kaufmännische Und (Ampersand) und das Gleich-Zeichen ein neues Schlüssel-Wert-Paar bedeuten. Das bedeutet, dass statt dem POST-Schlüssel "Thyme &time=again" zwei POST-Schlüssel verwendet werden, der eine mit dem Wert "Thyme ", der andere (time) mit again.

+ +

Bei application/x-www-form-urlencoded werden Leerzeichen mit '+' ersetzt, so dass es u.U. erwünscht ist, nach der Ersetzung durch encodeURIComponent eine weitere Ersetzung von "%20" mit "+" durchzuführen.

+ +

Um streng konform mit RFC 3986 zu sein (welches !, ', (, ) und * reserviert), obwohl diese Zeichen keine formalisierten Trennzeichen sind, kann das Folgende sicher verwendet werden:

+ +
function fixedEncodeURIComponent (str) {
+  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
+    return '%' + c.charCodeAt(0).toString(16);
+  });
+}
+
+ +

Beispiele

+ +

Das folgende Beispiel stellt die spezielle Kodierung sicher, die in UTF-8-kodierten Parameterwerten der Server-Antwort-Headern Content-Disposition und Link benötigt wird (z.B. UTF-8-kodierte Dateinamen):

+ +
var fileName = 'my file(2).txt';
+var header = "Content-Disposition: attachment; filename*=UTF-8''"
+             + encodeRFC5987ValueChars(fileName);
+
+console.log(header);
+// logs "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt"
+
+
+function encodeRFC5987ValueChars (str) {
+    return encodeURIComponent(str).
+        // Beachte, dass obwohl RFC3986 "!" reserviert, es nicht kodiert
+        // werden muss, weil RFC5987 es nicht reserviert.
+        replace(/['()]/g, escape). // i.e., %27 %28 %29
+        replace(/\*/g, '%2A').
+            // Die folgenden Zeichen müssen nicht nach RFC5987 kodiert werden,
+            // daher können wir bessere Lesbarkeit übers Netzwerk sicherstellen:
+            // |`^
+            replace(/%(?:7C|60|5E)/g, unescape);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Ursprüngliche Definition
{{SpecName('ES5.1', '#sec-15.1.3.4', 'encodeURIComponent')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-encodeuricomponent-uricomponent', 'encodeURIComponent')}}{{Spec2('ES6')}} 
+ +

Browser Kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundlegende Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome für AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Grundlegende Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Weitere Infos

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/columnnumber/index.html b/files/de/web/javascript/reference/global_objects/error/columnnumber/index.html new file mode 100644 index 0000000000..8335fd02d6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/columnnumber/index.html @@ -0,0 +1,43 @@ +--- +title: Error.prototype.columnNumber +slug: Web/JavaScript/Reference/Global_Objects/Error/columnNumber +tags: + - Error + - JavaScript + - Non-standard + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/columnNumber +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die columnNumber Eigenschaft enthält die Spaltennummer in der Zeile in der Datei, in der der Fehler erzeugt wurde.

+ +

Beispiele

+ +

Einsatz von columnNumber

+ +
var e = new Error('Could not parse input');
+throw e;
+console.log(e.columnNumber) // 0
+
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten. Kein Standard.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.columnNumber")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/filename/index.html b/files/de/web/javascript/reference/global_objects/error/filename/index.html new file mode 100644 index 0000000000..df7383803e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/filename/index.html @@ -0,0 +1,47 @@ +--- +title: Error.prototype.fileName +slug: Web/JavaScript/Reference/Global_Objects/Error/fileName +tags: + - Error + - JavaScript + - Non-standard + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/fileName +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die fileName Eigenschaft enthält den Pfad der Datei, in der der Fehler erzeugt wurde.

+ +

Beschreibung

+ +

Diese nicht standardisierte Eigenschaft enthält den Pfad der Datei, in der der Fehler erzeugt wurde. Wenn diese Eigenschaft von aus einem Debugger heraus aufgerufen wird (z. B. Firefox Developer Tools), wird "debugger eval code" zurückgegeben.

+ +

Beispiele

+ +

Einsatz von fileName

+ +
var e = new Error('Could not parse input');
+throw e;
+// e.fileName könnte aussehen wie: "file:///C:/example.html"
+
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten. Kein Standard.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.fileName")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/index.html b/files/de/web/javascript/reference/global_objects/error/index.html new file mode 100644 index 0000000000..293f0927fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/index.html @@ -0,0 +1,241 @@ +--- +title: Error +slug: Web/JavaScript/Reference/Global_Objects/Error +tags: + - Error + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Error +--- +
{{JSRef}}
+ +

Der Error Konstruktor erstellt ein Fehler (Error) Objekt. Instanzen von Error Objekten werden geworfen (thrown), wenn zur Laufzeit ein Fehler auftritt. Das Error Objekt kann zudem als Basis für benutzerdefinierte Fehler benutzt werden. Weiter unten werden schon eingebaute Fehlertypen beschrieben.

+ +

Syntax

+ +
new Error([message[, fileName[, lineNumber]]])
+ +

Parameter

+ +
+
message
+
Optional. Für Menschen lesbare Beschreibung des Errors.
+
fileName {{non-standard_inline}}
+
Optional. Der Wert für die fileName Eigenschaft eines erstellten Error Objekts. Der Standardwert ist der Name der Datei, in dem der Quelltext Error() aufgerufen wird.
+
lineNumber {{non-standard_inline}}
+
Optional. Der Wert für die lineNumber Eigenschaft eines erstellten Error Objekts. Der Standardwert ist die Zeilennummer, in dem der Quelltext Error() aufgerufen wird.
+
+ +

Beschreibung

+ +

Laufzeitfehler resultieren in einem neu erstellten und geworfenen Error Objekt.

+ +

Diese Seite Dokumentiert den Einsatz des Error Objektes und den Einsatz als Konstruktorfunktion. Für eine Liste der Eigenschaften und Methoden, die eine Error Instanz erbt, siehe auf der Seite {{jsxref("Error.prototype")}}.

+ +

Einsatz als Funktion

+ +

Wenn Error als Funktion genutzt wird -- ohne new, wird diese ein Error Objekt zurückgeben. Daher wird der Aufruf der Funktion das gleiche zurückgeben wie der Aufruf des Error Konstruktors (mit new Schlüsselwort).

+ +
// dieser Aufruf:
+const x = Error('Ich wurde mit einem Funktionsaufruf erstellt!');
+​​​​// hat die gleiche Funktion wie folgender:
+const y = new Error('Ich wurde mit dem "new" Schlüsselwort erstellt!');
+ +

Fehlertypen

+ +

Neben dem generischen Error Konstruktor sind in JavaScript noch sieben weitere Error-Konstruktoren eingebaut. Für benutzerdefinierte Fehler siehe Statements zur Fehler- und Ausnahmebehandlung.

+ +
+
{{jsxref("EvalError")}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der bei der globalen {{jsxref("Global_Objects/eval", "eval()")}} Funktion auftritt.
+
{{jsxref("InternalError")}} {{non-standard_inline}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der auftritt, wenn ein interner Fehler in JavaScript auftaucht (z. B. zu viel Rekursion).
+
{{jsxref("RangeError")}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der auftritt, wenn eine nummerische Variable oder ein nummerischer Parameter außerhalb seiner validen Grenzen ist.
+
{{jsxref("ReferenceError")}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der auftritt, wenn eine nicht valide Referenz referenziert werden soll.
+
{{jsxref("SyntaxError")}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der auftritt, wenn die Syntax von  Quellcode, der in der {{jsxref("Global_Objects/eval", "eval()")}} Funktion übergeben wird, nicht richtig ist.
+
{{jsxref("TypeError")}}
+
Erstellt eine Instanz, die einen Fehler repräsentiert, der auftritt, wenn eine Variable oder ein Parameter einen nicht validen Typen enthält.
+
{{jsxref("URIError")}}
+
Erstellt ein Instanz, die einen Fehler repräsentiert, der auftritt, wenn die Methode {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} oder {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} nicht valide Parameter übergeben bekommt.
+
+ +

Eigenschaften

+ +
+
{{jsxref("Error.prototype")}}
+
Erlaubt es die Eigenschaften aller Error Instanzen zu verändern.
+
+ +

Methoden

+ +

Das globale Error Objekt besitzt keine eigenen Methoden. Stattdessen erbt es einige Methoden durch die Prototypenkette.

+ +

Error Instanzen

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Error/prototype', 'Beschreibung')}}
+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Error/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Error/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Werfen eines generischen Errors

+ +

Typischerweise erstellt man ein Error Objekt mit der Intention es mit dem {{jsxref("Statements/throw", "throw")}} Schlüsselwort zu werfen. Man kann den Fehler auffangen, indem man ein {{jsxref("Statements/try...catch", "try...catch")}} Konstrukt benutzt.

+ +
try {
+  throw new Error('Whoops!');
+} catch (e) {
+  console.log(e.name + ': ' + e.message);
+}
+
+ +

Einen Spezifischen Error behandeln

+ +

Man kann sich aussuchen, welche spezifischen Fehlertypen behandelt werden sollen, indem man die {{jsxref("Object.prototype.constructor", "constructor")}} Eigenschaft des Errors abfragt. In modernen JavaScript-Umgebungen kann stattdessen das {{jsxref("Operators/instanceof", "instanceof")}} Schlüsselwort verwendet werden:

+ +
try {
+  foo.bar();
+} catch (e) {
+  if (e instanceof EvalError) {
+    console.log(e.name + ': ' + e.message);
+  } else if (e instanceof RangeError) {
+    console.log(e.name + ': ' + e.message);
+  }
+  // ... etc
+}
+
+ +

Benutzerdefinierte Fehlertypen

+ +

Manchmal möchte man aber einen eigenen Error erstellen, der von Error abgeleitet ist, durch den Aufruf throw new CustomError()  geworfen werden kann und durch instanceof CustomError abgefragt werden kann. Eigene Fehlertypen führen zu einer besseren und konsistenten Fehlerbehandlung. Für eine tiefer gehende Diskussion schaue bitte auf Stack Overflow nach.

+ +

ES6 benutzerdefinierte Error Klasse

+ +
+

Babel und andere Transpiler werden den folgenden Quelltext nicht ohne zusätzliche Konfigurationen verarbeiten können.

+
+ +
+

Einige Browser enthalten den CustomError Konstruktor im Stack Trace, wenn ES2015 Klassen eingesetzt werden

+
+ +
class CustomError extends Error {
+  constructor(foo = 'bar', ...params) {
+    // Übergibt die verbleibenden Parameter (einschließlich Vendor spezifischer Parameter) dem Error Konstruktor
+    super(...params);
+
+    // Behält den richtigen Stack-Trace für die Stelle bei, an der unser Fehler ausgelöst wurde (nur bei V8 verfügbar)
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, CustomError);
+    }
+
+    // Benutzerdefinierte Debugging Informationen
+    this.foo = foo;
+    this.date = new Date();
+  }
+}
+
+try {
+  throw new CustomError('buz', 'buzMessage');
+} catch(e){
+  console.log(e.foo);     // baz
+  console.log(e.message); // bazMessage
+  console.log(e.stack);   // stacktrace
+}
+ +

ES5 benutzerdefiniertes Error Objekt

+ +
+

Alle Browser enthalten den CustomError Konstruktor im Stack Trace, wenn eine Prototypische Deklaration verwendet wird.

+
+ +
function CustomError(foo, message, fileName, lineNumber) {
+  var instance = new Error(message, fileName, lineNumber);
+  instance.foo = foo;
+  Object.setPropertyOf(instance, Object.getPrototypeOf(this));
+  if(Error.captureStackTrace) {
+    Error.captureStackTrace(instance, CustomError);
+  }
+  return instance;
+}
+
+CustomError.prototype = Object.create(Error.prototype, {
+  constructor: {
+    value: Error,
+    enumerable: false,
+    writable: true,
+    configurable: true
+  }
+});
+
+if(typeof Object.setPropertyOf != 'undefined') {
+  Object.setPrototypeOf(CustomError, Error);
+} else {
+  CustomError.__proto__ = Error;
+}
+
+
+try {
+  throw new CustomError('baz', 'bazMessage');
+} catch (e) {
+  console.log(e.foo);      // 'baz'
+  console.log(e.message);  // 'bazMessage'
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.11', 'Error')}}{{Spec2('ES5.1')}} 
{{SpecName('ES2015', '#sec-error-objects', 'Error')}}{{Spec2('ES2015')}} 
{{SpecName('ESDraft', '#sec-error-objects', 'Error')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/linenumber/index.html b/files/de/web/javascript/reference/global_objects/error/linenumber/index.html new file mode 100644 index 0000000000..63bb6a59c2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/linenumber/index.html @@ -0,0 +1,55 @@ +--- +title: Error.prototype.lineNumber +slug: Web/JavaScript/Reference/Global_Objects/Error/lineNumber +tags: + - Error + - JavaScript + - Non-standard + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Error/lineNumber +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die lineNumber Eigenschaft enthält die Zeilennummer in der Datei, in der der Fehler erzeugt wurde.

+ +

Beispiele

+ +

Einsatz von lineNumber

+ +
var e = new Error('Could not parse input');
+throw e;
+console.log(e.lineNumber) // 2
+
+ +

Alternatives Beispiel mit error Events

+ +
window.addEventListener('error', function(e) {
+  console.log(e.lineNumber); // 5
+});
+var e = new Error('Could not parse input');
+throw e;
+
+ +

Das ist keine Standardfunktion und es gibt auch keine breite Unterstützung (siehe Browserkompatibilitätstabelle unten).

+ +

Spezifikationen

+ +

Ist in keiner Spezifikation enthalten. Kein Standard.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.lineNumber")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/message/index.html b/files/de/web/javascript/reference/global_objects/error/message/index.html new file mode 100644 index 0000000000..559f457cb2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/message/index.html @@ -0,0 +1,75 @@ +--- +title: Error.prototype.message +slug: Web/JavaScript/Reference/Global_Objects/Error/message +tags: + - Error + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/message +--- +
{{JSRef}}
+ +

Die message Eigenschaft ist eine für Menschen lesbare Beschreibung von Errors.

+ +

Beschreibung

+ +

Diese Eigenschaft enthält eine knappe Beschreibung des Errors, wenn eine verfügbar ist oder gesetzt wird. Zum Beispiel setzt SpiderMonkey diese Eigenschaft sehr oft ein. Die message Eigenschaft kombiniert mit der {{jsxref("Error.prototype.name", "name")}} Eigenschaft werden in der {{jsxref("Error.prototype.toString()")}} Methode eingesetzt, um eine String-Repräsentation des Errors zu erstellen.

+ +

Der Standardwert für die message Eigenschaft ist ein leerer String, jedoch kann diese von einer Instanz überschrieben werden, indem der erste Parameter des  {{jsxref("Error", "Error Konstruktors")}} gesetzt wird.

+ +

Beispiele

+ +

Einen benutzerdefinierten Fehler erzeugen

+ +
var e = new Error('Falsches Eingabeformat');
+// e.message ist 'Falsches Eingabeformat'
+throw e;
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.11.4.3', 'Error.prototype.message')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-error.prototype.message', 'Error.prototype.message')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-error.prototype.message', 'Error.prototype.message')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.message")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/name/index.html b/files/de/web/javascript/reference/global_objects/error/name/index.html new file mode 100644 index 0000000000..abf77777fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/name/index.html @@ -0,0 +1,58 @@ +--- +title: Error.prototype.name +slug: Web/JavaScript/Reference/Global_Objects/Error/name +tags: + - Error + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/name +--- +
{{JSRef}}
+ +

Die name Eigenschaft repräsentiert einen Namen für die Art des Errors. Der Initialwert ist "Error".

+ +

Beschreibung

+ +

Als Standard wird für einer {{jsxref("Error")}} Instanz der Name "Error" gegeben. Die name Eigenschaft und die {{jsxref("Error.prototype.message", "message")}} Eigenschaft werden eingesetzt, um in der {{jsxref("Error.prototype.toString()")}} Methode eine Repräsentation des Fehlers als String zu erstellen.

+ +

Beispiele

+ +

Einen benutzerdefinierten Fehler erzeugen

+ +
var e = new Error('Malformed input'); // e.name ist 'Error'
+
+e.name = 'ParseError';
+throw e;
+// e.toString() wird 'ParseError: Malformed input' zurückgeben.
+
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-error.prototype.name', 'Error.prototype.name')}}
+ +

Browserkompatibilität

+ +
+
+ + +

{{Compat("javascript.builtins.Error.name")}}

+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/prototype/index.html b/files/de/web/javascript/reference/global_objects/error/prototype/index.html new file mode 100644 index 0000000000..f383b474ea --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/prototype/index.html @@ -0,0 +1,113 @@ +--- +title: Error.prototype +slug: Web/JavaScript/Reference/Global_Objects/Error/prototype +tags: + - Error + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Error +--- +
{{JSRef}}
+ +

Die Error.prototype Eigenschaft repräsentiert den Prototypen für den {{jsxref("Error")}} Konstruktor.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref("Error")}} Instanzen und Instanzen von {{jsxref("Global_Objects/Error", "nicht generischen Errors", "#Error_types", 1)}} erben von Error.prototype. Wie bei jeder Konstruktorfunktion, kann man den Prototypen des Konstruktors einsetzen, um Eigenschaften oder Methoden bei allen erstellten Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +

Standard-Eigenschaften

+ +
+
Error.prototype.constructor
+
Spezifiziert die Funktion, die einen Prototypen einer Instanz erstellt.
+
{{jsxref("Error.prototype.message")}}
+
Errornachricht.
+
{{jsxref("Error.prototype.name")}}
+
Errorname.
+
+ +

Vendor-spezifische Erweiterungen

+ +
{{non-standard_header}}
+ +

Microsoft

+ +
+
{{jsxref("Error.prototype.description")}} {{non-standard_inline}}
+
Errorbeschreibung. Ist das gleiche wie {{jsxref("Error.prototype.message")}}
+
{{jsxref("Error.prototype.number")}} {{non-standard_inline}}
+
Errornummer.
+
+ +

Mozilla

+ +
+
{{jsxref("Error.prototype.fileName")}} {{non-standard_inline}}
+
Pfad zu der Datei, die der der Error ausgelöst wurde.
+
{{jsxref("Error.prototype.lineNumber")}} {{non-standard_inline}}
+
Zeilennummer in der Datei, in der der Error ausgelöst wurde.
+
{{jsxref("Error.prototype.columnNumber")}} {{non-standard_inline}}
+
Spaltennummer in der Zeile, in der der Error ausgelöst wurde.
+
{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}
+
Stacktrace.
+
+ +

Methoden

+ +
+
{{jsxref("Error.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt einen String zurück, der den Quelltext eines spezifischen {{jsxref("Error")}} Objektes beinhaltet. Man kann diesen einsetzen, um ein neues Objekt zu erstellen. Überschreibt die {{jsxref("Object.prototype.toSource()")}} Methode.
+
{{jsxref("Error.prototype.toString()")}}
+
Gibt einen String zurück, der das Objekt repräsentiert. Überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.11.3.1', 'Error')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-error.prototype', 'Error')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-error.prototype', 'Error')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/stack/index.html b/files/de/web/javascript/reference/global_objects/error/stack/index.html new file mode 100644 index 0000000000..ed930983bc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/stack/index.html @@ -0,0 +1,124 @@ +--- +title: Error.prototype.stack +slug: Web/JavaScript/Reference/Global_Objects/Error/Stack +tags: + - Error + - JavaScript + - Non-standard + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Error/Stack +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die nicht standardisierte stack Eigenschaft des {{jsxref("Error")}} Objektes zeigt den Verlauf der aufgerufenen Funktionen. Dabei wird die Reihenfolge der Aufrufe, der Zeile und die Datei der Aufrufes und die übergebenen Argumenten angegeben. Der stack String verläuft von den jüngsten Aufrufen zu den vorherigen Aufrufen, bis zum globalen Scope zurück.

+ +

Beschreibung

+ +

Jeder Schritt wird durch einen neue Zeile getrennt. Der erste Teil einer Zeile besteht aus dem Funktionsnamen (wenn es kein Aufruf vom globalen Scope ist), gefolgt von einem @-Zeichen, dem Dateiort (ausgenommen, wenn die Funktion der Error-Konstruktor des geworfenen Errors ist), einem Doppelpunkt und einer Zeilennummer, wenn ein Dateiort existiert. Zu beachten ist, dass das {{jsxref("Error")}} Objekt auch die Eigenschaften fileName, lineNumber und columnNumber besitzt, um dieses von geworfenen Error wiederherzustellen (aber nur dem Fehler und nicht seinem trace).

+ +

Zu beachten ist, dass dieses das Format von Firefox ist. Es gibt keine Standardformat, auch wenn Safari 6+ und Opera 12- ein ähnliches Format verwenden. Browser die die V8 JavaScript Umgebung benutzen (z. B. Chrome, Opera 15+, Android Browser) und IE10+ nutzen ein anderes Format (zusehen in den MSDN error.stack docs).

+ +

Parameter Werte im Stack: Bis Firefox 14 ({{bug("744842")}}) folgten auf den Funktionsnamen die zu Strings konvertierten Werte der Parameter in runden Klammern vor dem @-Zeichen. Während ein Objekt (oder Array, etc.) zu "[object Object]" konvertiert werden und diese Werte nicht zurück zu einem existierenden Objekt ausgewertet werden können, können skalare Werte zurückverfolgt werden (manchmal kann es einfacher sein — nur in Firefox 14 möglich — arguments.callee.caller.arguments zu benutzen, der Funktionsname kann mit arguments.callee.caller.name erfragt werden). "undefined" wird mit "(void 0)" dargestellt. Zu beachten ist, dass String Argumente (oder auch Dateinamen), die Zeichen wie "@", "(", ")" beinhalten dazu führen, dass es nicht einfach ist, die Zeile in seine Komponenten aufzuteilen. In Firefox 14+ ist dieses kein Problem mehr.

+ +

Verschiedene Browser setzen den this Wert zu verschiedenen Zeitpunkten. Zum Beispiel setzt Firefox diesen beim erstellen eines {{jsxref("Error")}} Objektes, während PhantomJS dieses nur setzt, wenn das {{jsxref("Error")}} Objekt geworfen wird und MSDN docs scheinen diesem verhalten auch zu folgen.

+ +

Beispiele

+ +

Der folgende HTML-Quelltext demonstriert den Einsatz der stack Eigenschaft.

+ +
<!DOCTYPE HTML>
+<meta charset="UTF-8">
+<title>Stack Trace Example</title>
+<body>
+<script>
+function trace() {
+  try {
+    throw new Error('myError');
+  }
+  catch(e) {
+    alert(e.stack);
+  }
+}
+function b() {
+  trace();
+}
+function a() {
+  b(3, 4, '\n\n', undefined, {});
+}
+a('first call, firstarg');
+</script>
+
+ +

Angenommen der oben stehende Quelltext ist auf einen Windows Datei System unter C:\example.html gespeichert, wird der folgende Text ausgegeben:

+ +

Mit Firefox 30+ wird die Spaltennummer mit angegeben ({{bug("762556")}}):

+ +
trace@file:///C:/example.html:9:17
+b@file:///C:/example.html:16:13
+a@file:///C:/example.html:19:13
+@file:///C:/example.html:21:9
+ +

Von Firefox 14 bis Firefox 29:

+ +
trace@file:///C:/example.html:9
+b@file:///C:/example.html:16
+a@file:///C:/example.html:19
+@file:///C:/example.html:21
+ +

Bis Firefox 13 wird folgender Text ausgegeben:

+ +
Error("myError")@:0
+trace()@file:///C:/example.html:9
+b(3,4,"\n\n",(void 0),[object Object])@file:///C:/example.html:16
+a("first call, firstarg")@file:///C:/example.html:19
+@file:///C:/example.html:21
+ +

Stacks von eval Quelltext

+ +

Angefangen mit Firefox 30 {{geckoRelease("30")}} enthällt der Stack von Errors auch Informationen von Function() und eval() Aufrufen mit detailierten Spalten- und Zeilennummern innerhalb dieser Aufrufe. Funktionsaufrufe werden mit "> Function" angezeigt, Aufrufe mit eval werden mit "> eval" angezeigt. Siehe {{bug("332176")}}.

+ +
try {
+  new Function('throw new Error()')();
+} catch (e) {
+  console.log(e.stack);
+}
+
+// anonymous@file:///C:/example.html line 7 > Function:1:1
+// @file:///C:/example.html:7:6
+
+
+try {
+  eval("eval('FAIL')");
+} catch (x) {
+  console.log(x.stack);
+}
+
+// @file:///C:/example.html line 7 > eval line 1 > eval:1:1
+// @file:///C:/example.html line 7 > eval:1:1
+// @file:///C:/example.html:7:6
+
+ +

Man kann auch die //# sourceURL Direktive benutzen, um den eval-Code zu benennen. Siehe auch Debug eval sources in den Debugger docs und diesen Blogeintrag.

+ +

Spezifikationen

+ +

Ist kein Teil einer Spezifikation, nicht standardisiert.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.stack")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/tosource/index.html b/files/de/web/javascript/reference/global_objects/error/tosource/index.html new file mode 100644 index 0000000000..59025435f5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/tosource/index.html @@ -0,0 +1,57 @@ +--- +title: Error.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Error/toSource +tags: + - Error + - JavaScript + - Method + - Non-standard + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode gibt den Quelltext zurück, der zu dem selben Error ausgewertet werden kann.

+ +

Syntax

+ +
e.toSource()
+ +

Rückgabewert

+ +

Ein String, der den Quelltext des Fehlers enthält.

+ +

Beschreibung

+ +

Das Aufrufen der toSource Methode auf einer {{jsxref("Error")}} Instanz (auch bei NativeErrors) gibt einen String zurück, der den Quelltext der Instanz enthält. Dieser String kann ausgeführt werden, um (annähernd) gleiches Objekt zu erzeugen. Normalerweise enthält der String den Quelltext des {{jsxref("Error")}} Konstruktors. Zum Beispiel:

+ +
(newname(message ,fileName,lineNumber))
+
+ +

wo die Attribute den Eigenschaften der Error-Instanz entsprechen.

+ +
+

Bemerkung: Seien Sie sich bewusst, dass die Eigenschaften, die durch die toSource Methode bei der Erstellung des Strings verwendet, veränderbar sind und nicht genau die Funktion widerspiegeln, die eine Fehler Instanz erstellt habt. Das betrifft den Dateinamen und die Zeilennummer.

+
+ +

Spezifikationen

+ +

In keine Spezifikation enthalten. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.toSource")}}

+
+ +

See auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/error/tostring/index.html b/files/de/web/javascript/reference/global_objects/error/tostring/index.html new file mode 100644 index 0000000000..15565bd296 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/error/tostring/index.html @@ -0,0 +1,116 @@ +--- +title: Error.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Error/toString +tags: + - Error + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Error/toString +--- +
{{JSRef}}
+ +
Die toString() Methode gibt einen String zurück, der das {{jsxref("Error")}} Objekt repräsentiert.
+ +
 
+ +

Syntax

+ +
e.toString()
+ +

Rückgabewert

+ +

Einen String, der das gegebenen {{jsxref("Error")}} Objekt repräsentiert.

+ +

Beschreibung

+ +

Das {{jsxref("Error")}} Objekt überschreibt die {{jsxref("Object.prototype.toString()")}} Methode, die an allen Objekte vererbt werden. Die Semanik ist die folgende (angenommen {{jsxref("Object")}} und {{jsxref("String")}} wurden nicht verändert):

+ +
Error.prototype.toString = function() {
+  'use strict';
+
+  var obj = Object(this);
+  if (obj !== this) {
+    throw new TypeError();
+  }
+
+  var name = this.name;
+  name = (name === undefined) ? 'Error' : String(name);
+
+  var msg = this.message;
+  msg = (msg === undefined) ? '' : String(msg);
+
+  if (name === '') {
+    return msg;
+  }
+  if (msg === '') {
+    return name;
+  }
+
+  return name + ': ' + msg;
+};
+
+ +

Beispiele

+ +
var e = new Error('fatal error');
+console.log(e.toString()); // 'Error: fatal error'
+
+e.name = undefined;
+console.log(e.toString()); // 'Error: fatal error'
+
+e.name = '';
+console.log(e.toString()); // 'fatal error'
+
+e.message = undefined;
+console.log(e.toString()); // 'Error'
+
+e.name = 'hello';
+console.log(e.toString()); // 'hello'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.11.4.4', 'Error.prototype.toString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-error.prototype.tostring', 'Error.prototype.toString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-error.prototype.tostring', 'Error.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Error.toString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/escape/index.html b/files/de/web/javascript/reference/global_objects/escape/index.html new file mode 100644 index 0000000000..84ad406566 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/escape/index.html @@ -0,0 +1,132 @@ +--- +title: escape() +slug: Web/JavaScript/Reference/Global_Objects/escape +tags: + - JavaScript + - Veraltet +translation_of: Web/JavaScript/Reference/Global_Objects/escape +--- +
{{jsSidebar("Objects")}}
+ +

Die veraltete Funktion escape() erzeugt einen neuen Text, in welchem gewisse Zeichen durch eine Hexadezimal-Escape-Sequenz ersetzt wurden. Es wird empfohlen, {{jsxref("encodeURI")}} oder {{jsxref("encodeURIComponent")}} stattdessen zu nutzen.

+ +

Syntax

+ +
escape(str)
+ +

Parameter

+ +
+
str
+
Ein Text welcher verarbeitet wird.
+
+ +

Rückgabewert

+ +

Ein neuer Text, in welchem gewisse Zeichen escaped wurden.

+ +

Beschreibung

+ +

Die escape-Funktion ist Teil des globalen Objektes. Hierbei werden spezielle Zeichen codiert. Außnahme bilden hier: @*_+-./

+ +

Die hexadezimale Form für Zeichen, deren Code-Einheitswert 0xFF oder weniger ist, enspricht einer zwei Ziffern großen Escape-Sequenz: %xx. Für Zeichen mit einem größeren Code-Einheitswert wird ein vier-Ziffern-Format genutzt: %uxxxx

+ +

Beispiele

+ +
escape("abc123");     // "abc123"
+escape("äöü");        // "%E4%F6%FC"
+escape("ć");          // "%u0107"
+
+// Spezielle Zeichen
+escape("@*_+-./");    // "@*_+-./"
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-B.2.1', 'escape')}}{{Spec2('ES5.1')}}Informativ definiert in Compatibility Annex B
{{SpecName('ES6', '#sec-escape-string', 'escape')}}{{Spec2('ES6')}}Normativ definitiert in Annex B für Erweiterte ECMAScript-Features in Webbrowsern
{{SpecName('ESDraft', '#sec-escape-string', 'escape')}}{{Spec2('ESDraft')}}Normativ definitiert in Annex B für Erweiterte ECMAScript-Features in Webbrowsern
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe Auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/evalerror/index.html b/files/de/web/javascript/reference/global_objects/evalerror/index.html new file mode 100644 index 0000000000..3043bdf908 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/evalerror/index.html @@ -0,0 +1,118 @@ +--- +title: EvalError +slug: Web/JavaScript/Reference/Global_Objects/EvalError +tags: + - Error + - EvalError + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/EvalError +--- +
{{JSRef}}
+ +

Das EvalError Objekt bedeutet einen Fehler in Verbindung mit der globalen {{jsxref("Global_Objects/eval", "eval()")}} Funktion. Dieser Fehler wird nicht von JavaScript erzeugt, jedoch gibt es das EvalError Objekt noch aus Kompatibilitätsgründen.

+ +

Syntax

+ +
new EvalError([message[, fileName[, lineNumber]]])
+ +

Parameters

+ +
+
message
+
Optional. Für Menschen lesbare Beschreibung des Fehlers.
+
fileName {{non-standard_inline}}
+
Optional. Der Name der Datei, die den Code enthält, welcher zu dem Fehler führt.
+
lineNumber {{non-standard_inline}}
+
Optional. Die Zeilennummer, die den Code enthält, welcher zu dem Fehler führt.
+
+ +

Eigenschaften

+ +
+
{{jsxref("EvalError.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zu einem EvalError Objekt.
+
+ +

Methoden

+ +

Das globale EvalError Objekt enthält keine eigen Methoden, jedoch erbt es einige Methoden über die Prototypenkette.

+ +

EvalError Instanzen

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/EvalError/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/EvalError/prototype', 'Methoden')}}
+ +

Beispiele

+ +

EvalError wird nicht in der aktuellen ECMAScript Spezifikation verwendet und wird daher auch nicht von der Laufzeitumgebung erzeugt. Jedoch wird das Objekt aus Gründen der Rückwärtskompatibilität zu älteren Versionen der Spezifikation erhalten.

+ +

Erstellen eines EvalError

+ +
try {
+  throw new EvalError('Hello', 'someFile.js', 10);
+} catch (e) {
+  console.log(e instanceof EvalError); // true
+  console.log(e.message);              // "Hello"
+  console.log(e.name);                 // "EvalError"
+  console.log(e.fileName);             // "someFile.js"
+  console.log(e.lineNumber);           // 10
+  console.log(e.columnNumber);         // 0
+  console.log(e.stack);                // "@Scratchpad/2:2:9\n"
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.11.6.1', 'EvalError')}}{{Spec2('ES5.1')}}Nicht benutzt in dieser Spezifikation. Erhalten für Rückwärtskompatibilität.
{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}{{Spec2('ES6')}}Nicht benutzt in dieser Spezifikation. Erhalten für Rückwärtskompatibilität.
{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+
+ + +

{{Compat("javascript.builtins.EvalError")}}

+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/evalerror/prototype/index.html b/files/de/web/javascript/reference/global_objects/evalerror/prototype/index.html new file mode 100644 index 0000000000..03783a0294 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/evalerror/prototype/index.html @@ -0,0 +1,89 @@ +--- +title: EvalError.prototype +slug: Web/JavaScript/Reference/Global_Objects/EvalError/prototype +tags: + - Error + - EvalError + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/EvalError +--- +
{{JSRef}}
+ +

Die EvalError.prototype Eigenschaft repräsentiert den Prototypen des {{jsxref("EvalError")}} Konstruktors.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref("EvalError")}} Instanzen erben von EvalError.prototype. Man kann den Prototypen benutzen, um Eigenschaften oder Methoden für alle Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
EvalError.prototype.constructor
+
Spezifiziert die Funktion, die einen Instanzprototypen erstellt.
+
{{jsxref("Error.prototype.message", "EvalError.prototype.message")}}
+
Fehlernachricht. Obwohl ECMA-262 spezifiziert, dass {{jsxref("EvalError")}} seine eigene message Eigenschaft haben soll, wird diese in SpiderMonkey von {{jsxref("Error.prototype.message")}} geerbt.
+
{{jsxref("Error.prototype.name", "EvalError.prototype.name")}}
+
Fehlername. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.fileName", "EvalError.prototype.fileName")}}
+
Pfad zur Datei, die der der Fehler ausgelöst hat. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.lineNumber", "EvalError.prototype.lineNumber")}}
+
Zeilennummer in der Datei, in der der Fehler ausgelöst wurde. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.columnNumber", "EvalError.prototype.columnNumber")}}
+
Dpaltennummer in der Zeile, in der der Fehler ausgelöst wurde. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.stack", "EvalError.prototype.stack")}}
+
Stacktrace. Geerbt von {{jsxref("Error")}}.
+
+ +

Methoden

+ +

Obwohl des {{jsxref("EvalError")}} Prototypobjekt keine eigene Methode enthält, erben {{jsxref("EvalError")}} Instanzen einige Methoden durch die Prototypenkette.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}{{Spec2('ES5.1')}}Definiert als NativeError.prototype.
{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ES6')}}Definiert als NativeError.prototype.
{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ESDraft')}}Definiert als NativeError.prototype.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.EvalError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/float32array/index.html b/files/de/web/javascript/reference/global_objects/float32array/index.html new file mode 100644 index 0000000000..bb59fcf59f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/float32array/index.html @@ -0,0 +1,204 @@ +--- +title: Float32Array +slug: Web/JavaScript/Reference/Global_Objects/Float32Array +tags: + - Constructor + - JavaScript + - TypedArray + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/Float32Array +--- +
{{JSRef}}
+ +

Das Float32Array getypte Array repräsentiert ein Array von 32 Bit Gleitkommazahlen (entspricht dem C Datengyp float) in der Plattform-Byte-Reihenfolge. Wenn Kontrolle über die Byte-Reihenfolge erforderlich ist, muss {{jsxref("DataView")}} stattdessen benutz werden. Die Inhalte werden mit 0 initialisiert. Wie erwartet, kann man Element in einem Array mit Objektmethoden referenzieren oder man benutzt die normale Arrayindex-Syntax (das ist die Klammernotation).

+ +

Syntax

+ +
new Float32Array(); // new in ES2017
+new Float32Array(length);
+new Float32Array(typedArray);
+new Float32Array(object);
+new Float32Array(buffer [, byteOffset [, length]]);
+ +

Für mehr Informationen über die Konstruktorensyntax und die Parameter, siehe auf der Seite TypedArray.

+ +

Eigenschaften

+ +
+
{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Float32Array.BYTES_PER_ELEMENT")}}
+
Gibt die Größe der Elemente zurück. 4 im Falle eines Float32Array.
+
Float32Array.length
+
Statische Längeneigenschaft welche den Wert 0 hat. Für die aktuelle Länge (Anzahl der Elemente) siehe {{jsxref("TypedArray.prototype.length", "Float32Array.prototype.length")}}.
+
{{jsxref("TypedArray.name", "Float32Array.name")}}
+
Gibt den Stringwert des Konstruktornamens zurück. In Fall eines Float32Array Typs: "Float32Array".
+
{{jsxref("TypedArray.prototype", "Float32Array.prototype")}}
+
Prototyp für das TypedArray Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.from", "Float32Array.from()")}}
+
Erstelle ein neues Float32Array von einem Array-Ähnlichen oder Iterable Objekt. Siehe auch {{jsxref("Array.from()")}}.
+
{{jsxref("TypedArray.of", "Float32Array.of()")}}
+
Erstellt ein neues Float32Array mit einer variablen Anzahl an Argumenten. Sie auch {{jsxref("Array.of()")}}.
+
+ +

Float32Array Prototyp

+ +

Alle Float32Array Objekte erben von {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.

+ +

Eigenschaften

+ +
+
Float32Array.prototype.constructor
+
Gibt die Funktion, die einen Instanzprototyp erstellt zurück. Diese ist auf den Float32Array Konstruktor voreingestellt.
+
{{jsxref("TypedArray.prototype.buffer", "Float32Array.prototype.buffer")}} {{readonlyInline}}
+
Gibt die {{jsxref("ArrayBuffer")}} Referenz zurück, welche nach der Erstellung eines Float32Array fest ist und nicht mehr geändert werden kann.
+
{{jsxref("TypedArray.prototype.byteLength", "Float32Array.prototype.byteLength")}} {{readonlyInline}}
+
Gibt die Länge (in Bytes) des Float32Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.byteOffset", "Float32Array.prototype.byteOffset")}} {{readonlyInline}}
+
Gibt das Offset (in Bytes) des Float32Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.length", "Float32Array.prototype.length")}} {{readonlyInline}}
+
Gibt Anzahl der Elemente des Float32Array zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.copyWithin", "Float32Array.prototype.copyWithin()")}}
+
Kopiert eine Sequenz von Arrayelementen in das Array. Siehe auch {{jsxref("Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.entries", "Float32Array.prototype.entries()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Schlüssel/Wertepaare für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.entries()")}}.
+
{{jsxref("TypedArray.every", "Float32Array.prototype.every()")}}
+
Teste, ob alle Elemente einem, als Funktion übergebenen, Test erfüllen. Siehe auch Array.prototype.every()")}}.
+
{{jsxref("TypedArray.fill", "Float32Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays vom Startindex bis zum Endindex mit einem statischen Wert. Siehe auch {{jsxref("Array.prototype.fill()")}}.
+
{{jsxref("TypedArray.filter", "Float32Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen des alten Arrays, für die eine übergebene Filterfunktion true zurückgibt. Siehe auch {{jsxref("Array.prototype.filter()")}}.
+
{{jsxref("TypedArray.find", "Float32Array.prototype.find()")}}
+
Gibt ein gefundenes Element des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder undefined wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.find()")}}.
+
{{jsxref("TypedArray.findIndex", "Float32Array.prototype.findIndex()")}}
+
Gibt den Index eines gefundenen Elements des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.findIndex()")}}.
+
{{jsxref("TypedArray.forEach", "Float32Array.prototype.forEach()")}}
+
Ruft für jedes Element in einem Array eine Funktion auf. Siehe auch {{jsxref("Array.prototype.forEach()")}}.
+
{{jsxref("TypedArray.includes", "Float32Array.prototype.includes()")}} {{experimental_inline}}
+
Überprüft, ob ein getyptes Array ein bestimmtes Element enthält und gibt gegebenfalls true oderfalse zurück. Siehe auch {{jsxref("Array.prototype.includes()")}}.
+
{{jsxref("TypedArray.indexOf", "Float32Array.prototype.indexOf()")}}
+
Gibt den ersten Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.indexOf()")}}.
+
{{jsxref("TypedArray.join", "Float32Array.prototype.join()")}}
+
Führt alle Elemente eines Arrays zu einem String zusammen. Siehe auch {{jsxref("Array.prototype.join()")}}.
+
{{jsxref("TypedArray.keys", "Float32Array.prototype.keys()")}}
+
Gibt ein neuen Array Iterator zurück, der alle Schlüssel für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.keys()")}}.
+
{{jsxref("TypedArray.lastIndexOf", "Float32Array.prototype.lastIndexOf()")}}
+
Gibt den letzen Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.lastIndexOf()")}}.
+
{{jsxref("TypedArray.map", "Float32Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Resultaten spezifizierten Funktion, die für jedes Element aufgerufen wird. Siehe auch {{jsxref("Array.prototype.map()")}}.
+
{{jsxref("TypedArray.move", "Float32Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}
+
Ehemalige nicht Standardisierte Version von {{jsxref("TypedArray.copyWithin", "Float32Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.reduce", "Float32Array.prototype.reduce()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von links nach rechts), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reduceRight", "Float32Array.prototype.reduceRight()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von rechts nach links), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reverse", "Float32Array.prototype.reverse()")}}
+
Kehrt die Reihenfolge von jedem Element eines Arrays um — das Erste wird das Letzte und das Letzte wird das Erste. Siehe auch {{jsxref("Array.prototype.reverse()")}}.
+
{{jsxref("TypedArray.set", "Float32Array.prototype.set()")}}
+
Speichert mehrere Werte in einem getypten Array und ließt Eingabewerte aus einem spezifiziertem Array.
+
{{jsxref("TypedArray.slice", "Float32Array.prototype.slice()")}}
+
Extrahiert einen Bereich aus einem Array und gibt diesen in einem neuen Array zurück. Siehe auch {{jsxref("Array.prototype.slice()")}}.
+
{{jsxref("TypedArray.some", "Float32Array.prototype.some()")}}
+
Gibt true zurück, wenn nur ein Element in einem Array den als Funktion übergebenen Test erfüllt. Siehe auch {{jsxref("Array.prototype.some()")}}
+
{{jsxref("TypedArray.sort", "Float32Array.prototype.sort()")}}
+
Sortiert die Elemente eines Arrays in-Place und gibt das Array zurück. Siehe auch {{jsxref("Array.prototype.sort()")}}.
+
{{jsxref("TypedArray.subarray", "Float32Array.prototype.subarray()")}}
+
Gibt ein neues Float32Array vom gegebenen Start- und Endindex zurück.
+
{{jsxref("TypedArray.values", "Float32Array.prototype.values()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Werte von jedem Index im Array enthält. Siehe auch {{jsxref("Array.prototype.values()")}}.
+
{{jsxref("TypedArray.toLocaleString", "Float32Array.prototype.toLocaleString()")}}
+
Gibt einen Ortsabhängige Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toLocaleString()")}}.
+
{{jsxref("TypedArray.toString", "Float32Array.prototype.toString()")}}
+
Gibt einen Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toString()")}}.
+
{{jsxref("TypedArray.@@iterator", "Float32Array.prototype[@@iterator]()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die zugehörigen Werte für jeden Index im Array enthalten.
+
+ +

Beispiele

+ +

Verschiedene Wege, um ein Float32Array zu erstellen:

+ +
// From a length
+var float32 = new Float32Array(2);
+float32[0] = 42;
+console.log(float32[0]); // 42
+console.log(float32.length); // 2
+console.log(float32.BYTES_PER_ELEMENT); // 4
+
+// From an array
+var arr = new Float32Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Float32Array([21, 31]);
+var y = new Float32Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(16);
+var z = new Float32Array(buffer, 0, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var float32 = new Float32Array(iterable);
+// Float32Array[1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}{{Spec2('ES6')}}Initiale Definition in einem ECMA Standard. Spezifiziert, dass ein new benötigt wird.
{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}{{Spec2('ESDraft')}}ECMAScript 2017 ändert den Float32Array Konstruktor, um die ToIndex Operation zu benutzen und erlaubt einen Konstruktor ohne Parameter.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Float32Array")}}

+ +

Kompatibilitätshinweise

+ +

Mit Beginn von ECMAScript 2015, müssen Float32Array Konstruktoren mit einem {{jsxref("Operators/new", "new")}} benutzt werden. Der Aufruf eines Float32Array Konstruktors als eine Funktion ohne new, Führt jetzt zu einem {{jsxref("TypeError")}}.

+ +
var dv = Float32Array([1, 2, 3]);
+// TypeError: calling a builtin Float32Array constructor
+// without new is forbidden
+ +
var dv = new Float32Array([1, 2, 3]);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/float64array/index.html b/files/de/web/javascript/reference/global_objects/float64array/index.html new file mode 100644 index 0000000000..6d3b5003d8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/float64array/index.html @@ -0,0 +1,204 @@ +--- +title: Float64Array +slug: Web/JavaScript/Reference/Global_Objects/Float64Array +tags: + - Constructor + - JavaScript + - TypedArray + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/Float64Array +--- +
{{JSRef}}
+ +

Das Float64Array getypte Array repräsentiert ein Array von 64 Bit Gleitkommazahlen (entspricht dem C Datentyp double) in der Plattform-Byte-Reihenfolge. Wenn Kontrolle über die Byte-Reihenfolge erforderlich ist, muss stattdessen {{jsxref("DataView")}} benutz werden. Die Inhalte werden mit 0 initialisiert. Wie erwartet, kann man Elemente in einem Array mit Objektmethoden referenzieren oder man benutzt die normale Array-Index-Syntax (das ist die Klammernotation).

+ +

Syntax

+ +
new Float64Array(); // new in ES2017
+new Float64Array(length);
+new Float64Array(typedArray);
+new Float64Array(object);
+new Float64Array(buffer [, byteOffset [, length]]);
+ +

Für mehr Informationen über die Konstruktorensyntax und die Parameter, siehe auf der Seite TypedArray.

+ +

Eigenschaften

+ +
+
{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Float64Array.BYTES_PER_ELEMENT")}}
+
Gibt die Größe der Elemente zurück. 8 im Falle eines Float64Array.
+
Float64Array.length
+
Statische Längeneigenschaft, welche den Wert 0 hat. Für die aktuelle Länge (Anzahl der Elemente) siehe {{jsxref("TypedArray.prototype.length", "Float64Array.prototype.length")}}.
+
{{jsxref("TypedArray.name", "Float64Array.name")}}
+
Gibt den Stringwert des Konstruktornamens zurück. In Fall eines Float64Array Typs: "Float64Array".
+
{{jsxref("TypedArray.prototype", "Float64Array.prototype")}}
+
Prototyp für das TypedArray Objekt
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.from", "Float64Array.from()")}}
+
Erstellt ein neues Float64Array von einem Array-ähnlichen oder iterierbaren Objekt. Siehe auch {{jsxref("Array.from()")}}.
+
{{jsxref("TypedArray.of", "Float64Array.of()")}}
+
Erstellt ein neues Float64Array mit einer variablen Anzahl an Argumenten. Sie auch {{jsxref("Array.of()")}}.
+
+ +

Float64Array Prototyp

+ +

Alle Float64Array Objekte erben von {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.

+ +

Eigenschaften

+ +
+
Float64Array.prototype.constructor
+
Gibt die Funktion, die einen Instanzprototyp erstellt, zurück. Diese ist auf den Float64Array Konstruktor voreingestellt.
+
{{jsxref("TypedArray.prototype.buffer", "Float64Array.prototype.buffer")}} {{readonlyInline}}
+
Gibt die {{jsxref("ArrayBuffer")}} Referenz zurück, welche nach der Erstellung eines Float64Array fest ist und nicht mehr geändert werden kann.
+
{{jsxref("TypedArray.prototype.byteLength", "Float64Array.prototype.byteLength")}} {{readonlyInline}}
+
Gibt die Länge (in Bytes) des Float64Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. Wird beim Erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.byteOffset", "Float64Array.prototype.byteOffset")}} {{readonlyInline}}
+
Gibt das Offset (in Bytes) des Float64Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. Wird beim Erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.length", "Float64Array.prototype.length")}} {{readonlyInline}}
+
Gibt die Anzahl der Elemente des Float64Array zurück. Wird beim Erstellen festgesetzt und kann nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.copyWithin", "Float64Array.prototype.copyWithin()")}}
+
Kopiert eine Sequenz von Arrayelementen in das Array. Siehe auch {{jsxref("Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.entries", "Float64Array.prototype.entries()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Schlüssel/Wertepaare für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.entries()")}}.
+
{{jsxref("TypedArray.every", "Float64Array.prototype.every()")}}
+
Teste, ob alle Elemente einem, als Funktion übergebenen, Test erfüllen. Siehe auch Array.prototype.every()")}}.
+
{{jsxref("TypedArray.fill", "Float64Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays vom Startindex bis zum Endindex mit einem statischen Wert. Siehe auch {{jsxref("Array.prototype.fill()")}}.
+
{{jsxref("TypedArray.filter", "Float64Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen des alten Arrays, für die eine übergebene Filterfunktion true zurückgibt. Siehe auch {{jsxref("Array.prototype.filter()")}}.
+
{{jsxref("TypedArray.find", "Float64Array.prototype.find()")}}
+
Gibt ein gefundenes Element des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder undefined wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.find()")}}.
+
{{jsxref("TypedArray.findIndex", "Float64Array.prototype.findIndex()")}}
+
Gibt den Index eines gefundenen Elements des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.findIndex()")}}.
+
{{jsxref("TypedArray.forEach", "Float64Array.prototype.forEach()")}}
+
Ruft für jedes Element in einem Array eine Funktion auf. Siehe auch {{jsxref("Array.prototype.forEach()")}}.
+
{{jsxref("TypedArray.includes", "Float64Array.prototype.includes()")}} {{experimental_inline}}
+
Überprüft, ob ein getyptes Array ein bestimmtes Element enthält und gibt gegebenfalls true oder false zurück. Siehe auch {{jsxref("Array.prototype.includes()")}}.
+
{{jsxref("TypedArray.indexOf", "Float64Array.prototype.indexOf()")}}
+
Gibt den ersten Index eines Elementes zurück, welches kongruent eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.indexOf()")}}.
+
{{jsxref("TypedArray.join", "Float64Array.prototype.join()")}}
+
Führt alle Elemente eines Arrays zu einem String zusammen. Siehe auch {{jsxref("Array.prototype.join()")}}.
+
{{jsxref("TypedArray.keys", "Float64Array.prototype.keys()")}}
+
Gibt ein neuen Array Iterator zurück, der alle Schlüssel für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.keys()")}}.
+
{{jsxref("TypedArray.lastIndexOf", "Float64Array.prototype.lastIndexOf()")}}
+
Gibt den letzen Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.lastIndexOf()")}}.
+
{{jsxref("TypedArray.map", "Float64Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Resultaten einer für jedes Element aufgerufenen Funtion. Siehe auch {{jsxref("Array.prototype.map()")}}.
+
{{jsxref("TypedArray.move", "Float64Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}
+
Ehemalige, nicht standardisierte Version von {{jsxref("TypedArray.copyWithin", "Float64Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.reduce", "Float64Array.prototype.reduce()")}}
+
Führt eine Funktion gegen einen Akkumulator und jeden Wert des Array aus (von links nach rechts), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reduceRight", "Float64Array.prototype.reduceRight()")}}
+
Führt eine Funktion gegen einen Akkumulator und jeden Wert des Array aus (von rechts nach links), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reverse", "Float64Array.prototype.reverse()")}}
+
Kehrt die Reihenfolge von jedem Element eines Arrays um — das Erste wird das Letzte und das Letzte wird das Erste. Siehe auch {{jsxref("Array.prototype.reverse()")}}.
+
{{jsxref("TypedArray.set", "Float64Array.prototype.set()")}}
+
Speichert mehrere Werte in einem getypten Array und liest Eingabewerte aus einem spezifiziertem Array.
+
{{jsxref("TypedArray.slice", "Float64Array.prototype.slice()")}}
+
Extrahiert einen Bereich aus einem Array und gibt diesen in einem neuen Array zurück. Siehe auch {{jsxref("Array.prototype.slice()")}}.
+
{{jsxref("TypedArray.some", "Float64Array.prototype.some()")}}
+
Gibt true zurück, wenn nur ein Element in einem Array, den als Funktion übergebenen, Test erfüllt. Siehe auch {{jsxref("Array.prototype.some()")}}
+
{{jsxref("TypedArray.sort", "Float64Array.prototype.sort()")}}
+
Sortiert die Elemente eines Arrays in-Place und gibt das Array zurück. Siehe auch {{jsxref("Array.prototype.sort()")}}.
+
{{jsxref("TypedArray.subarray", "Float64Array.prototype.subarray()")}}
+
Gibt ein neues Float64Array vom gegebenen Start- und Endindex zurück.
+
{{jsxref("TypedArray.values", "Float64Array.prototype.values()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Werte von jedem Index im Array enthält. Siehe auch {{jsxref("Array.prototype.values()")}}.
+
{{jsxref("TypedArray.toLocaleString", "Float64Array.prototype.toLocaleString()")}}
+
Gibt eine ortsabhängige Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toLocaleString()")}}.
+
{{jsxref("TypedArray.toString", "Float64Array.prototype.toString()")}}
+
Gibt eine Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toString()")}}.
+
{{jsxref("TypedArray.@@iterator", "Float64Array.prototype[@@iterator]()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die zugehörigen Werte für jeden Index im Array enthalten.
+
+ +

Beispiele

+ +

Verschiedene Wege, um ein Float64Array zu erstellen:

+ +
// From a length
+var float64 = new Float64Array(2);
+float64[0] = 42;
+console.log(float64[0]); // 42
+console.log(float64.length); // 2
+console.log(float64.BYTES_PER_ELEMENT); // 8
+
+// From an array
+var arr = new Float64Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Float64Array([21, 31]);
+var y = new Float64Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(32);
+var z = new Float64Array(buffer, 0, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var float64 = new Float64Array(iterable);
+// Float64Array[1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#table-49', 'TypedArray constructors')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA Standard. Spezifiziert, dass ein new benötigt wird.
{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}{{Spec2('ESDraft')}}ECMAScript 2017 ändert den Float64Array Konstruktor, um die ToIndex Operation zu benutzen und erlaubt einen Konstruktor ohne Parameter.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Float64Array")}}

+ +

Kompatibilitätshinweise

+ +

Mit Beginn von ECMAScript 2015, müssen Float64Array Konstruktoren mit einem {{jsxref("Operators/new", "new")}} benutzt werden. Der Aufruf eines Float64Array Konstruktors als eine Funktion ohne new führt jetzt zu einem {{jsxref("TypeError")}}.

+ +
var dv = Float64Array([1, 2, 3]);
+// TypeError: calling a builtin Float64Array constructor
+// without new is forbidden
+ +
var dv = new Float64Array([1, 2, 3]);
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/apply/index.html b/files/de/web/javascript/reference/global_objects/function/apply/index.html new file mode 100644 index 0000000000..784843e276 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/apply/index.html @@ -0,0 +1,226 @@ +--- +title: Function.prototype.apply() +slug: Web/JavaScript/Reference/Global_Objects/Function/apply +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/apply +--- +
{{JSRef}}
+ +

Die apply() Methode ruft eine Funktion mit gegebenem this Wert und arguments als Array (oder einem Array ähnlichem Objekt).

+ +
+

Hinweis: Die Syntax dieser Funktion ist größtenteils identisch zu der Funktion {{jsxref("Function.call", "call()")}}. Der fundamentale Unterschied ist, dass call() eine Liste von Argumenten und apply() ein Array mit Argumenten übergeben bekommt.

+
+ +
{{EmbedInteractiveExample("pages/js/function-apply.html")}}
+ + + +

Syntax

+ +
function.apply(thisArg, [argsArray])
+ +

Parameter

+ +
+
thisArg
+
Optional. Der Wert von this, der für den Aufruf der Funktion func genutzt wird. Zu beachten ist, dass this möglicherweise nicht der Wert ist, den die Methode sieht: Wenn die Methode eine Funktion im {{jsxref("Functions_and_function_scope/Strict_mode", "non-strict mode", "", 1)}} ist, werden {{jsxref("Global_Objects/null", "null")}} und {{jsxref("Global_Objects/undefined", "undefined")}} mit dem globalen Objekt ersetzt und primitive Werte werden in ein Hüllobjekt umgewandelt.
+
argsArray
+
Optional. Ein Array ähnliches Objekt, welches die Argumente spezifiziert, welche beim Aufruf von func benutzt werden, oder {{jsxref("null")}} oder {{jsxref("undefined")}}, wenn keine Argumente übergeben werden. Mit Einführung von ECMAScript 5 können diese Argumente mit einem generische Array ähnliches Objekt statt einem Array übergeben werden. Für mehr Informationen sollte die {{anch("Browserkompatibilität", "Browserkompatibilität")}} geprüft werden.
+
+ +

Rückgabewert

+ +

Das Ergebnis der aufgerufenen Funktion mit dem spezifischen this Wert und Parametern.

+ +

Beschreibung

+ +

Man kann ein anderes this Objekt für den Aufruf einer existierenden Funktion zuweisen. this referenziert zum aktuellen Objekte, dem aufrufenden Objekt. Mit apply kann eine Methode geschrieben und in einem anderen Objekt vererbt werden, ohne die Methode für das neue Objekte neu zu schreiben.

+ +

apply ist sehr ähnlich zu {{jsxref("Function.call", "call()")}}, mit der Ausnahme des Typen der übergebenen Argumente. Man kann ein Array von Argumenten statt einer Menge von benannten Parametern benutzen. Mit apply kann man ein Arrayliteral benutzen, wie zum Beispiel fun.apply(this, ['eat', 'bananas']) oder ein {{jsxref("Array")}} Objekt, wie zum Beispiel fun.apply(this, new Array('eat', 'bananas')).

+ +

Für den argsArray Parameter kann auch {{jsxref("Functions/arguments", "arguments")}} eingesetzt werden. arguments ist eine lokale Variable einer Funktion. Sie kann für alle nicht spezifizieren Argumente bei einem Aufruf benutzt werde. Dadurch muss man die Argumente eines Aufrufers nicht kennen, wenn die apply Methode genutzt wird. Man kann arguments nutzen, um alle Argumente eines Aufrufers zu übergeben. Das aufgerufene Objekt ist dann verantwortlich für das Verarbeiten der Argument.

+ +

Seit ECMAScript in der 5. Ausgabe kann jedes Objekt übergeben werden, welches Array ähnlich ist, was in der Praxis bedeutet, dass es eine length Eigenschaft hat und Ganzzahlige Eigenschaften im Bereich von 0 bis length-1 besitzt. Zum Beispiel kann man {{domxref("NodeList")}} oder benutzerdefinierte Objekte wie { 'length': 2, '0': 'eat', '1': 'bananas' } benutzen.

+ +
Viele Browser, auch Chrome 14 und Internet Explorer 9, unterstützen keine Array ähnlichen Objekte, was zu einem Fehler führt.
+ +

Beispiele

+ +

Einsatz von apply um ein Array an ein anderes zu hängen

+ +

Man kann push benutzen, um ein Element an ein Array anzufügen. Weil push eine variable Anzahl von Argumenten enthält, kann man auch mehrere Element mit einem Aufruf hinzufügen. Übergibt man jedoch ein Array an die push Methode, so wird das Array als ein Element hinzugefügt anstatt jedes Element des Arrays hinzuzufügen, was zu einem Array im Array führt. Was tun, wenn das nicht das ist, was gewollt ist? concat hat das gewünschte verhalten, jedoch erstellt es ein neues Array und fügt die Elemente nicht an das existierende Array. Was wenn man die Elemente unbedingt an das existierende Array hängen möchte? Eine Schleife schreiben? Sicher nicht!

+ +

apply ist die Funktion der Wahl!

+ +
var array = ['a', 'b'];
+var elements = [0, 1, 2];
+array.push.apply(array, elements);
+console.info(array);  // ["a", "b", 0, 1, 2]
+
+ +

Einsatz von apply und eingebauten Standardfunktionen

+ +

Der clevere Einsatz von apply erlaubt es standard Functionen für Aufgaben zu benutzen, für die man sonst schleifen Schreiben müsste, um über alle Elemente eines Arrays zu iterieren. Im folgenden Beispiel wurde Math.max/Math.min benutzt, um das maximalen/minimalen Wert in einem Array zu finden.

+ +
// min/max number in an array
+var numbers = [5, 6, 2, 3, 7];
+
+// using Math.min/Math.max apply
+var max = Math.max.apply(null, numbers);
+// This about equal to Math.max(numbers[0], ...)
+// or Math.max(5, 6, ...)
+
+var min = Math.min.apply(null, numbers);
+
+// vs. simple loop based algorithm
+max = -Infinity, min = +Infinity;
+
+for (var i = 0; i < numbers.length; i++) {
+  if (numbers[i] > max) {
+    max = numbers[i];
+  }
+  if (numbers[i] < min) {
+    min = numbers[i];
+  }
+}
+
+ +

Jedoch muss man bei einem solchen Einsatz von apply vorsichtig sein, weil das Risiko da ist, dass man in das Limit der maximalen Argumente der JavaScriptumgebung überschreitet. Die Konsequenz aus dem ausführen von Funktionen mit zu vielen Argumenten (mehr als Zehntausend Argumente) ist, dass dieses Limit stark variiert (JavaScriptCore hat ein hart Codiertes Argumentlimit von 65536), weil es in JavaScript nicht spezifiziert ist (tatsächlich sogar die Art eines übermäßig großen Stack-Verhaltens). Einige Umgebungen erzeugen einen Fehler. Andere übergeben nicht alle Argumente der Funktion, um das Limit nicht zu überschreiten. Um diesen Fall man zu schildern: Wenn eine Umgebung ein Limit von 4 Argumenten hätte (aktuelle Limits sind natürlich signifikant höher), würde es so sein, als ob nur die Argumente 5, 6, 2, 3 über apply im oberen Beispiel übergeben werden, statt dem ganzen Array.

+ +

Wenn das Array in einigen Fällen so groß wird, dass es zehntausend Element erreicht, sollte eine hybride Strategie genutzt werden: Man teilt das Array auf und übergibt diese Teile der Funktion:

+ +
function minOfArray(arr) {
+  var min = Infinity;
+  var QUANTUM = 32768;
+
+  for (var i = 0, len = arr.length; i < len; i += QUANTUM) {
+    var submin = Math.min.apply(null,
+                                arr.slice(i, Math.min(i+QUANTUM, len)));
+    min = Math.min(submin, min);
+  }
+
+  return min;
+}
+
+var min = minOfArray([5, 6, 2, 3, 7]);
+
+ +

apply für das Verketten von Konstruktoren verwenden

+ +

Man kann apply einsetzen, um {{jsxref("Operators/new", "Konstruktoren", "", 1)}} für ein Objekt zu verketten, ähnlich wie in Java. Im folgenden Beispiel wird eine globale {{jsxref("Function")}} Methode namens construct erstellt, welche es ermöglicht ein Array ähnliches Objekt mit einem Konstruktor anstatt eines Argumentliste zu benutzen.

+ +
Function.prototype.construct = function (aArgs) {
+  var oNew = Object.create(this.prototype);
+  this.apply(oNew, aArgs);
+  return oNew;
+};
+
+ +
+

Hinweis: Die oben eingesetzte Object.create() Methode ist relativ neu. Alternativ kann eine der folgenden Ansätze verwendet werden:

+ +

Einsatz von {{jsxref("Object/__proto__", "Object.__proto__")}}:

+ +
Function.prototype.construct = function (aArgs) {
+  var oNew = {};
+  oNew.__proto__ = this.prototype;
+  this.apply(oNew, aArgs);
+  return oNew;
+};
+
+ +

Einsatz von Closures:

+ +
Function.prototype.construct = function(aArgs) {
+  var fConstructor = this, fNewConstr = function() {
+    fConstructor.apply(this, aArgs);
+  };
+  fNewConstr.prototype = fConstructor.prototype;
+  return new fNewConstr();
+};
+ +

Einsatz von {{jsxref("Function")}} Konstruktoren:

+ +
Function.prototype.construct = function (aArgs) {
+  var fNewConstr = new Function("");
+  fNewConstr.prototype = this.prototype;
+  var oNew = new fNewConstr();
+  this.apply(oNew, aArgs);
+  return oNew;
+};
+
+
+ +

Beispiel für den Einsatz:

+ +
function MyConstructor() {
+  for (var nProp = 0; nProp < arguments.length; nProp++) {
+    this['property' + nProp] = arguments[nProp];
+  }
+}
+
+var myArray = [4, 'Hello world!', false];
+var myInstance = MyConstructor.construct(myArray);
+
+console.log(myInstance.property1);                // logs 'Hello world!'
+console.log(myInstance instanceof MyConstructor); // logs 'true'
+console.log(myInstance.constructor);              // logs 'MyConstructor'
+
+ +
+

Hinweis: Diese nicht native Function.construct Methode funktioniert nicht mit einigen nativen Konstruktoren (mit {{jsxref("Date")}} zum Beispiel). In diesem Fall muss man die {{jsxref("Function.prototype.bind")}} Methode (hat man zum Beispiel ein Array ähnliches Objekt wie folgt, um mit dem {{jsxref("Global_Objects/Date", "Date")}} Konstruktor [2012, 11, 4] einzusetzen; in diesem Fall muss folgendes geschrieben werden: new (Function.prototype.bind.apply(Date, [null].concat([2012, 11, 4])))() — Jedoch ist das nicht die beste Art und Weise Probleme zu Lösen, weshalb diese Lösung nicht Praxistauglich ist).

+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.3.4.3', 'Function.prototype.apply')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function.prototype.apply', 'Function.prototype.apply')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function.prototype.apply', 'Function.prototype.apply')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.apply")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/arguments/index.html b/files/de/web/javascript/reference/global_objects/function/arguments/index.html new file mode 100644 index 0000000000..271120bd9d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/arguments/index.html @@ -0,0 +1,92 @@ +--- +title: Function.arguments +slug: Web/JavaScript/Reference/Global_Objects/Function/arguments +tags: + - Deprecated + - Function + - JavaScript + - Property + - arguments +translation_of: Web/JavaScript/Reference/Global_Objects/Function/arguments +--- +
{{JSRef}} {{deprecated_header}}
+ +

Die function.arguments Eigenschaft referenziert ein Array ähnliches Objekt, welches die übergebenen Parameter einer Funktion enthält. Stattdessen kann die Variable {{jsxref("Functions/arguments", "arguments")}} benutzt werden. Diese Eigenschaft ist im Strict Mode aufgrund von taill Aufrufoptimierung verboten.

+ +

Beschreibung

+ +

Die Syntax function.arguments ist veraltet. Der empfolene Weg, um das {{jsxref("Functions/arguments", "arguments")}} Objekt zu erreichen, ist in einer Funktion die Variable {{jsxref("Functions/arguments", "arguments")}} zu benutzen.

+ +

Im Fall von Rekursion, z. B. wenn die Funktion f mehrere Male auf dem Aufruf-Stack ist, repräsentiert f.arguments die Argumente des letzten Aufrufes der Funktion.

+ +

Der Wert der arguments Eigenschaft ist normalerweise null, wenn keine Durchführung der Funktion vorhanden ist (Durchführung bedeutet, dass die Funktion aufgerufen wurde, aber noch nichts zurückgegeben hat).

+ +

Beispiele

+ +
function f(n) { g(n - 1); }
+
+function g(n) {
+  console.log('before: ' + g.arguments[0]);
+  if (n > 0) { f(n); }
+  console.log('after: ' + g.arguments[0]);
+}
+
+f(2);
+
+console.log('returned: ' + g.arguments);
+
+// Output
+
+// before: 1
+// before: 0
+// after: 0
+// after: 1
+// returned: null
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0. Deprecated zugunsten von  {{jsxref("Functions/arguments", "arguments")}} in ES3.
{{SpecName('ES5.1', '#sec-10.6', 'arguments object')}}{{Spec2('ES5.1')}}{{jsxref("Functions/arguments", "arguments")}} Objekt
{{SpecName('ES6', '#sec-arguments-object', 'arguments object')}}{{Spec2('ES6')}}{{jsxref("Functions/arguments", "arguments")}} Objekt
{{SpecName('ESDraft', '#sec-arguments-object', 'arguments object')}}{{Spec2('ESDraft')}}{{jsxref("Functions/arguments", "arguments")}} Objekt
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.arguments")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/arity/index.html b/files/de/web/javascript/reference/global_objects/function/arity/index.html new file mode 100644 index 0000000000..f5ff00bd27 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/arity/index.html @@ -0,0 +1,32 @@ +--- +title: Function.arity +slug: Web/JavaScript/Reference/Global_Objects/Function/arity +tags: + - Function + - JavaScript + - Obsolete + - Property + - Unimplemented +translation_of: Archive/Web/JavaScript/Function.arity +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die arity Eigenschaft wurde benutzt, um die Anzahl der erwarteten Argumente einer Funktion zurückzugeben, jedoch existiert diese Eigenschaft nicht mehr und wurde durch die Eigenschaft {{jsxref("Function.prototype.length")}} ersetzt.

+ +

Spezifikationen

+ +

Implementiert in JavaScript 1.2. Veraltet seit JavaScript 1.4.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.arity")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/bind/index.html b/files/de/web/javascript/reference/global_objects/function/bind/index.html new file mode 100644 index 0000000000..9427e62299 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/bind/index.html @@ -0,0 +1,286 @@ +--- +title: Function.prototype.bind() +slug: Web/JavaScript/Reference/Global_Objects/Function/bind +tags: + - Class + - ECMAScript 2015 + - ECMAScript 5 + - Function + - JavaScript + - Method + - bind + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind +--- +
{{JSRef}}
+ +

Die bind() Methode erzeugt eine neue Funktion die beim Aufruf ihr this Schlüsselwort auf den ersten übergebenen Wert setzt. Alle weiteren Argumente werden den beim Funktionsaufruf übergebenen Werten vorangestellt.

+ +
{{EmbedInteractiveExample("pages/js/function-bind.html", "taller")}}
+ + + +

Syntax

+ +
function.bind(thisArg[, arg1[, arg2[, ...]]])
+ +

Parameter

+ +
+
thisArg
+
Der für this zu übergebende Wert an die Zielfunktion sobald die gebundene Funktion aufgerufen wird. Der Wert wird ignoriert, wenn die gebundene Funktion mit dem {{jsxref("Operators/new", "new")}} Schlüsselwort initiiert wurde.
+
arg1, arg2, ...
+
An die bind Funktion übergebene Werte. Diese Werte werden an die gebundene Funktion überreicht.
+
+ +

Rückgabewert

+ +

Eine Kopie der gegebenen Funktion mit dem spezifizierten this Wert und initialen Parametern.

+ +

Beschreibung

+ +

Die bind() Funktion erstellt eine neue gebundene Funktion (BF). Eine BF ist ein exotisches Funktionsobjekte (ein Teil von ECMAScript 2015) welches die eigentliche Funktion umhüllt. Das Aufrufen einer BF führt zum ausführen der umhüllten Funktion. Eine BF hat die folgenden internen Eigenschaften:

+ + + +

Wenn die gebundene Funktion aufgerufen wird, ruft diese die interne Methode [[Call]] auf [[BoundTargetFunction]] mit den Argumenten Call(boundThis, args) auf. Dabei ist boundThis gleich [[BoundThis]] und args gleich [[BoundArguments]] gefolgt von den übergebenen Parametern des Funktionsaufrufes.

+ +

Eine gebundene Funktion kann zudem mit einen new Operator erstellt werden: Das sieht so aus, als ob die Zielfunktion stattdessen konstruiert worden wäre. Dar übergebene this Wert wird ignoriert, während die voranstehenden Argumente für die Emulierte Funktion zur Verfügung stehen.

+ +

Beispiele

+ +

Erstellen einer gebunden Funktion

+ +

Die einfachste Verwendung von bind() besteht darin, eine Funktion zu erstellen, die, egal wie sie aufgerufen wird, mit einem this Wert aufgerufen wird. Ein häufiger Fehler für neue JavaScript-Programmierer besteht darin, eine Methode aus einem Objekt zu extrahieren, diese Funktion später aufzurufen und zu erwarten, dass sie das ursprüngliche Objekt als this verwendet (z. B. durch Verwendung dieser Methode in Callback-basiertem Code). Ohne besondere Sorgfalt ist das ursprüngliche Objekt jedoch in der Regel verloren. Das Erstellen einer gebundenen Funktion aus der Funktion, die das ursprüngliche Objekt verwendet, löst dieses Problem sauber:

+ +
this.x = 9;    // this refers to global "window" object here in the browser
+var module = {
+  x: 81,
+  getX: function() { return this.x; }
+};
+
+module.getX(); // 81
+
+var retrieveX = module.getX;
+retrieveX();
+// returns 9 - The function gets invoked at the global scope
+
+// Create a new function with 'this' bound to module
+// New programmers might confuse the
+// global var x with module's property x
+var boundGetX = retrieveX.bind(module);
+boundGetX(); // 81
+
+ +

Partiell gebunden Funktionen

+ +

Der nächste einfache Einsatz von bind() ist das Vordefinieren von Initialparameter einer Funktion. Diese Argumente (wenn welche vorhanden) folgen auf den übergebenen this Wert und Werten am Anfang der Zielfunktion den Parametern hinzugefügt, gefolgt von den Parametern, die der gebunden Funktion übergeben werden, immer wenn die gebunden Funktion aufgerufen wird.

+ +
function list() {
+  return Array.prototype.slice.call(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+// Create a function with a preset leading argument
+var leadingThirtysevenList = list.bind(null, 37);
+
+var list2 = leadingThirtysevenList();
+// [37]
+
+var list3 = leadingThirtysevenList(1, 2, 3);
+// [37, 1, 2, 3]
+
+ +

Mit setTimeout

+ +

Bei {{domxref("window.setTimeout()")}} wird im Standardfall das this Schlüsselwort mit dem {{ domxref("window") }} (oder global) Objekt versehen. Wenn mit Klassenmethoden gearbeitet wird, die es vorgesehen, dass this zu der Klasseninstanz verweist, muss this explizit an die Callback-Funktion gebunden werden, damit die Instanz vorhanden ist.

+ +
function LateBloomer() {
+  this.petalCount = Math.floor(Math.random() * 12) + 1;
+}
+
+// Declare bloom after a delay of 1 second
+LateBloomer.prototype.bloom = function() {
+  window.setTimeout(this.declare.bind(this), 1000);
+};
+
+LateBloomer.prototype.declare = function() {
+  console.log('I am a beautiful flower with ' +
+    this.petalCount + ' petals!');
+};
+
+var flower = new LateBloomer();
+flower.bloom();
+// after 1 second, triggers the 'declare' method
+ +

Gebunden Funktion mit einem Konstruktor

+ +
+

Warnung: Dieses Kapitel demonstriert JavaScript-möglichkeiten und dokumentiert Randfälle der bind() Methode. Die Methoden, die unten gezeigt werden, sind nicht die Besten, um Dinge zu lösen, weshalb sie nicht in einem Produktivsystem eingesetzt werden sollten.

+
+ +

Gebundene Funktion sind automatisch verfügbar für den Einsatz mit dem {{jsxref("Operators/new", "new")}} Operator, um eine neue Instanz von einer Zielfunktion zu erstellen. Wenn eine gebundene Funktion eingesetzt wird, um einen Wert zu erstellen, wird das unterstützte this Argument ignoriert. Dahingegen werden unterstützte Argumente vor den Konstruktoraufrufe vorgehängt:

+ +
function Point(x, y) {
+  this.x = x;
+  this.y = y;
+}
+
+Point.prototype.toString = function() {
+  return this.x + ',' + this.y;
+};
+
+var p = new Point(1, 2);
+p.toString(); // '1,2'
+
+// not supported in the polyfill below,
+
+// works fine with native bind:
+
+var YAxisPoint = Point.bind(null, 0/*x*/);
+
+
+var emptyObj = {};
+var YAxisPoint = Point.bind(emptyObj, 0/*x*/);
+
+var axisPoint = new YAxisPoint(5);
+axisPoint.toString(); // '0,5'
+
+axisPoint instanceof Point; // true
+axisPoint instanceof YAxisPoint; // true
+new Point(17, 42) instanceof YAxisPoint; // true
+
+ +

Zu beachten ist, dass nichts spezielles getan werden muss, um eine gebundene Funktion mit {{jsxref("Operators/new", "new")}} zu erstellen. Die Folge ist, dass man nichts Besonderes tun muss, um eine gebundene Funktion zu erzeugen, die einfach aufgerufen werden kann, selbst wenn es gewollt ist, dass die gebundene Funktion nur mit {{jsxref("Operators/new", "new")}} aufgerufen wird:

+ +
// Example can be run directly in your JavaScript console
+// ...continuing from above
+
+// Can still be called as a normal function
+// (although usually this is undesired)
+YAxisPoint(13);
+
+emptyObj.x + ',' + emptyObj.y;
+// >  '0,13'
+
+ +

Wenn es gewünscht ist, dass der Einsatz von gebundenen Funktion nur mit {{jsxref("Operators/new", "new")}} oder einem einfachen Aufruf sein soll, so muss die Zielfunktion diese Einschränkung erzwingen.

+ +

Kurzformen erstellen

+ +

bind() ist nützlich in fällen, in denen man kurzformen erstellen will, bei denen ein spezifischer this vorhanden sein soll.

+ +

Nimmt man zum Beispiel {{jsxref("Array.prototype.slice")}}, welche man zum Konvertieren von Array ähnlichen Objekte zu einem richtigen Array einsetzen mögliche, dann kann man eine Kurzform wie diese erstellen:

+ +
var slice = Array.prototype.slice;
+
+// ...
+
+slice.apply(arguments);
+
+ +

Mit bind(), kann dieses vereinfacht werden. Im folgenden Codestück ist slice eine gebunden Funktion zu der {{jsxref("Function.prototype.apply()", "apply()")}} Funktion von {{jsxref("Function.prototype")}} mit dem this Wert auf der {{jsxref("Array.prototype.slice()", "slice()")}} Funktion von {{jsxref("Array.prototype")}}. Das bedeutet, dass der zusätzliche Aufruf von apply() nicht nötig ist:

+ +
// same as "slice" in the previous example
+var unboundSlice = Array.prototype.slice;
+var slice = Function.prototype.apply.bind(unboundSlice);
+
+// ...
+
+slice(arguments);
+
+ +

Polyfill

+ +

Wenn die bind() Funktion nicht vorhanden ist, kann ein Großteil der Funktionalität mit trotzdem hinzugefügt werden, indem der folgende Quelltext am Anfang des Skriptes hinzugefügt wird.

+ +
if (!Function.prototype.bind) {
+  Function.prototype.bind = function(oThis) {
+    if (typeof this !== 'function') {
+      // closest thing possible to the ECMAScript 5
+      // internal IsCallable function
+      throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
+    }
+
+    var aArgs   = Array.prototype.slice.call(arguments, 1),
+        fToBind = this,
+        fNOP    = function() {},
+        fBound  = function() {
+          return fToBind.apply(this instanceof fNOP
+                 ? this
+                 : oThis,
+                 aArgs.concat(Array.prototype.slice.call(arguments)));
+        };
+
+    if (this.prototype) {
+      // Function.prototype doesn't have a prototype property
+      fNOP.prototype = this.prototype;
+    }
+    fBound.prototype = new fNOP();
+
+    return fBound;
+  };
+}
+
+ +

Einige der vielen Unterschiede (es kann durchaus andere geben, weil bei dieser Liste nicht auf Vollständig geachtet wurde) zwischen diesem Algorithmus und dem angegebenen Algorithmus sind:

+ + + +

Wenn diese partielle Implementierung eingesetzt wird, muss man davon ausgehen, dass dessen Verhalten von dem in ECMA-262 in der 5. Auflage unterscheidet! Mit etwas Vorsicht (und vielleicht kleinen Modifizierungen für spezielle Anforderungen) kann diese partielle Implementierung eine gute Übergangslösung für die Zeit sein, in der bind() noch nicht in allen Umgebungen unterstützt wird.

+ +

Auf https://github.com/Raynos/function-bind könnte es eine gründlichere Lösung geben!

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.3.4.5', 'Function.prototype.bind')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.5.
{{SpecName('ES2015', '#sec-function.prototype.bind', 'Function.prototype.bind')}}{{Spec2('ES2015')}}
{{SpecName('ESDraft', '#sec-function.prototype.bind', 'Function.prototype.bind')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.bind")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/call/index.html b/files/de/web/javascript/reference/global_objects/function/call/index.html new file mode 100644 index 0000000000..46bdb07442 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/call/index.html @@ -0,0 +1,163 @@ +--- +title: Function.prototype.call() +slug: Web/JavaScript/Reference/Global_Objects/Function/call +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/call +--- +
{{JSRef}}
+ +

Die call() Methode ruft eine Funktion mit dem Argument this und den individuellen Parametern auf.

+ +
+

Hinweis: Die Syntax dieser Funktion ist nahezu identisch zu {{jsxref("Function.prototype.apply", "apply()")}}. Der Unterschied ist, dass call() eine Liste von Argumenten und apply() einen einzelnen Array von Argumenten akzeptiert.

+
+ +
{{EmbedInteractiveExample("pages/js/function-call.html")}}
+ + + +

Syntax

+ +
function.call(thisArg, arg1, arg2, ...)
+ +

Parameter

+ +
+
thisArg
+
Optional. Der Wert von this, der für den Aufruf der Funktion function genutzt wird. Zu beachten ist, dass this möglicherweise nicht der Wert ist, den die Methode sieht: Wenn die Methode eine Funktion in {{jsxref("Functions_and_function_scope/Strict_mode", "non-strict mode", "", 1)}} ist, werden {{jsxref("Global_Objects/null", "null")}} und {{jsxref("Global_Objects/undefined", "undefined")}} mit dem globalen Objekt ersetzt und primitive Werte werden in ein Hüllobjekt umgewandelt.
+
arg1, arg2, ...
+
Argumente für das Objekt.
+
+ +

Rückgabewert

+ +

Das Ergebnis der aufgerufenen Funktion mit dem spezifischen this Wert und Parametern.

+ +

Beschreibung

+ +

Beim Aufruf einer existierenden Funktion können Sie für this ein neues Objekt zuweisen. this verweist auf das aktuelle Objekt, also das aufrufende Objekt. Mit call können Sie eine Methode schreiben und an ein anderes Objekt vererben, ohne die Methode für das neue Objekt neuzuschreiben.

+ +

Beispiele

+ +

Nutzung von call, um Konstruktoren für ein Objekt zu verketten

+ +

Man kann call nutzen, um Konstruktoren für ein Objekt, ähnlich wie in Java, zu verketten. Im folgenden Beispiel wird der Konstruktor für das Product Objekt mit zwei Parametern, name und price, definiert. Zwei andere Funktionen Food und Toy rufen Product auf und übergeben this, name und price. Product initialisiert die Eigenschaften name und price und beide speziellen Funktionen definieren category.

+ +
function Product(name, price) {
+  this.name = name;
+  this.price = price;
+}
+
+function Food(name, price) {
+  Product.call(this, name, price);
+  this.category = 'food';
+}
+
+function Toy(name, price) {
+  Product.call(this, name, price);
+  this.category = 'toy';
+}
+
+var cheese = new Food('feta', 5);
+var fun = new Toy('robot', 40);
+
+ +

Nutzung von call zum Aufruf einer anonymen Funktion

+ +

In diesem komplett konstruierten Beispiel erstellen wir eine anonyme Funktion und nutzen call, um diese für jedes Objekt in einem Array aufzurufen. Der Hauptnutzen für die Nutzung anonymer Funktionen hier, ist das hinzufügen einer Print-Funktion für jedes Objekt, welche den rechten Index des Objekts in dem eingegebenen Array ausgeben kann. Die Übergabe des Objektes als this-Wert ist hier nicht zwingend erforderlich, wurde aber zur Veranschaulichung genutzt.

+ +
var animals = [
+  { species: 'Lion', name: 'King' },
+  { species: 'Whale', name: 'Fail' }
+];
+
+for (var i = 0; i < animals.length; i++) {
+  (function(x) {
+    this.print = function() {
+      console.log('#' + x + ' ' + this.species
+                  + ': ' + this.name);
+    }
+    this.print();
+  }).call(animals[i], i);
+}
+
+ +

Einsatz von call zum aufrufen einer Funktion mit spezifiziertem Kontext für 'this'

+ +

Im unten stehenden Beispiel wird das thisObjekt der greet Funktion beim Aufruf auf obj gesetzt.

+ +
function greet() {
+  var reply = [this.animal, 'typically sleep betreen', this.sleepDuration].join(' ');
+  console.log(reply);
+}
+
+var obj = {
+  animal: 'cats', sleepDuration: '12 and 16 hours'
+};
+
+greet.call(obj); // cats typically sleep between 12 and 16 hours
+
+ +

Eine Funktion mit call ausführen ohne den ersten Parameter zu setzen.

+ +

Im unten stehenden Beispiel wird die display Funktion aufgerufen ohne den ersten Parameter zu übergeben. Wenn der erste Parameter nicht übergeben wird, ist this das globale Objekt.

+ +
var sData = 'Wisen';
+
+function display(){
+  console.log('sData value is %s', this.sData);
+}
+
+display.call(); // sData value is Wisen
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3.
{{SpecName('ES5.1', '#sec-15.3.4.4', 'Function.prototype.call')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function.prototype.call', 'Function.prototype.call')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function.prototype.call', 'Function.prototype.call')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.call")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/caller/index.html b/files/de/web/javascript/reference/global_objects/function/caller/index.html new file mode 100644 index 0000000000..1b0b3f6c03 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/caller/index.html @@ -0,0 +1,84 @@ +--- +title: Function.caller +slug: Web/JavaScript/Reference/Global_Objects/Function/caller +tags: + - Function + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/caller +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die function.caller Eigenschaft gibt die Funktion zurück, die eine spezifizierte Funktion aufgerufen hat. Diese Eigenschaft ist im Strict-Modus wegen tail call Optimierungen verboten.

+ +

Beschreibung

+ +

Wenn die Funktion f durch einen Quelltext auf höchster Ebene aufgerufen wird, ist der Wert von f.caller {{jsxref("null")}}, anderfalls die Funktion, die f aufgerufen hat.

+ +

Diese Eigenschaft ersetzt die veraltete Eigenschaft {{jsxref("Functions/arguments/caller", "arguments.caller")}} des {{jsxref("Functions/arguments", "arguments")}} Objektes.

+ +

Die spezielle Eigenschaft __caller__, welches das Objekt des Aufrufers zurück gab, erlaubt es den Stack zu rekonstruieren und wurde aus Sicherheitsgründen entfernt.

+ +

Hinweise

+ +

Im Fall von Rekursion, kann der Stack nicht mit dieser Eigenschaft reproduziert werden. Gegeben:

+ +
function f(n) { g(n - 1); }
+function g(n) { if (n > 0) { f(n); } else { stop(); } }
+f(2);
+
+ +

Im Moment, indem stop() aufgerufen wird, ist der Aufruferstack:

+ +
f(2) -> g(1) -> f(1) -> g(0) -> stop()
+
+ +

Das folgende ergibt true:

+ +
stop.caller === g && f.caller === g && g.caller === f
+
+ +

Wenn man versucht den Stacktrace in der stop() Funktion zu bekommen, wie hier:

+ +
var f = stop;
+var stack = 'Stack trace:';
+while (f) {
+  stack += '\n' + f.name;
+  f = f.caller;
+}
+
+ +

wird die Schleife nie beendet.

+ +

Beispiele

+ +

Prüfen des Wertes der Funktionseigenschaft caller

+ +

Der folgende Quelltext prüft den Wert der Funktionseigenschaft caller.

+ +
function myFunc() {
+  if (myFunc.caller == null) {
+    return 'The function was called from the top!';
+  } else {
+    return 'This function\'s caller was ' + myFunc.caller;
+  }
+}
+
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten. Implementiert in JavaScript 1.5.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.caller")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/displayname/index.html b/files/de/web/javascript/reference/global_objects/function/displayname/index.html new file mode 100644 index 0000000000..9e22b16fca --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/displayname/index.html @@ -0,0 +1,81 @@ +--- +title: Function.displayName +slug: Web/JavaScript/Reference/Global_Objects/Function/displayName +tags: + - Function + - JavaScript + - Non Standard + - Non-standard + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/displayName +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die function.displayName Eigenschaft gibt den sichtbaren Namen der Funktion zurück.

+ +

Beschreibung

+ +

Wenn definiert, gibt dit displayName Eigenschaft den sichtbaren Namen der Funktion zurück:

+ +
function doSomething() {}
+
+console.log(doSomething.displayName); // "undefined"
+
+var popup = function(content) { console.log(content); };
+
+popup.displayName = 'Show Popup';
+
+console.log(popup.displayName); // "Show Popup"
+
+ +

Man kann eine Funktion mit sichtbaren Namen mit einem {{jsxref("Functions", "Funktionsausdruck", "", 1)}} definieren:

+ +
var object = {
+  someMethod: function() {}
+};
+
+object.someMethod.displayName = 'someMethod';
+
+console.log(object.someMethod.displayName); // logs "someMethod"
+
+try { someMethod } catch(e) { console.log(e); }
+// ReferenceError: someMethod is not defined
+
+ +

Man kann den displayName einer Funktion dynamisch ändern:

+ +
var object = {
+  // anonymous
+  someMethod: function(value) {
+    arguments.callee.displayName = 'someMethod (' + value + ')';
+  }
+};
+
+console.log(object.someMethod.displayName); // "undefined"
+
+object.someMethod('123')
+console.log(object.someMethod.displayName); // "someMethod (123)"
+
+ +

Beispiele

+ +

Konsolen und Profiler präferieren die {{jsxref("Function.name", "func.name")}} zum anzeigen des Namens einer Funktion.

+ +

Beim eingeben des Folgenden Quelltextes in der Konsole, wird etwas wie "function My Function()" ausgegeben:

+ +
var a = function() {};
+a.displayName = 'My Function';
+
+a; // "function My Function()"
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.displayName")}}

+
diff --git a/files/de/web/javascript/reference/global_objects/function/index.html b/files/de/web/javascript/reference/global_objects/function/index.html new file mode 100644 index 0000000000..dd2a7d5583 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/index.html @@ -0,0 +1,188 @@ +--- +title: Function +slug: Web/JavaScript/Reference/Global_Objects/Function +tags: + - Constructor + - Function + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Function +--- +
{{JSRef}}
+ +

Der Function Konstruktor erstellt ein neues Funktion Objekt. Das direkte Aufrufen kann Funktionen dynamisch erstellen, hat aber Sicherheits- und Performanceprobleme genau wie der Einsatz von {{jsxref("eval")}}. Im Gegensatz zu eval ermöglicht der Function-Konstruktor die Ausführung von Code im globalen Gültigkeitsbereich, was zu besseren Programmiergewohnheiten führt und eine effizientere Code-Minimierung ermöglicht.

+ +
{{EmbedInteractiveExample("pages/js/function-constructor.html")}}
+ + + +

Jede JavaScript Funktion ist aktuell ein Function Objekt. Das kann mit dem Code (function(){}).constructor === Function gezeigt werden, der true zurückgibt.

+ +

Syntax

+ +
new Function ([arg1[, arg2[, ...argN]],] functionBody)
+ +

Parameter

+ +
+
arg1, arg2, ... argN
+
Namen die von der Funktion als formelle Argumentname genutzt werden. Jeder davon muss ein String sein, welcher ein gültiger JavaScript Bezeichner ist oder einer Liste von solchen Strings, getrennt mit Kommata ist. Zum Beispiel: "x", "derWert", oder "a,b".
+
functionBody
+
Ein String, welcher den JavaScript Ausdruck als Funktions-Definition beinhaltet.
+
+ +

Beschreibung

+ +

Mit dem Function Konstruktor erstellte Function-Objekte werden übersetzt, sobald die Funktion erstellt wurde. Das ist weniger effizient, als wenn man eine Funktion als Funktionsausdruck oder Funktionsstatement deklariert und diese innerhalb des Codes abruft, weil diese mit dem Rest des Codes übersetzt werden.

+ +

Alle der Funktion übergegebenen Argumente werden als Namen der Bezeichner der Parameter in der zu erstellenden Funktion in der angegebenen Reihenfolge behandelt.

+ +

Das Aufrufen des Function Konstruktors als Funktion (ohne den new Operator) hat dieselbe Wirkung, wie als Konstrukteuraufruf. Jedoch kann das Weglassen des new Operators eine kleinere minimierten Codegröße (4 Byte kleiner) erreichen, so dass es besser ist Function ohne new zu benutzen.

+ +

Eigenschaften und Methoden von Function

+ +

Das globale Function Objekt hat eigene Methoden und Eigenschaften, doch, da es eine Funktion selbst ist, erbt es einige Methoden und Eigenschaften durch die Prototypkette aus {{jsxref("Function.prototype")}}.

+ +

Function Prototyp Objekt

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', 'Methoden')}}
+ +

Function Instanzen

+ +

Funktions-Instanzen erben Methoden und Eigenschaften vom {{jsxref("Function.prototype")}}. Wie bei allen Konstruktoren kann das Prototypen Objekt verändern werden, um Änderungen an allen Funktions-Instanzen durchzuführen.

+ +

Beispiele

+ +

Spezifizieren von Argumente mit dem Function Konstruktor

+ +

Der folgende Code erstellt ein Funktions-Objekt, mit zwei Argumenten.

+ +
// Das Beispiel kann direkt in der JavaScript Console ausgeführt werden.
+
+// Erstellt eine Funktion mit zwei Argumenten und gibt die Summe dieser Argumente zurück
+var adder = new Function('a', 'b', 'return a + b');
+
+// Aufruf der Funktion
+adder(2, 6);
+// > 8
+
+ +

Die Argumente "a" und "b" sind formale Argument-Namen, welche im Funktionskörper genutzt werden, "return a + b".

+ +

Unterschiede zwischen dem Function Konstruktor und Funktionsdeklarationen

+ +

Funktionen, die mit dem Function Konstruktor erstellt werden, erstellen keine Closures in ihrem Erstellungskontext; Sie werden immer im globalen Scope erstellt. Wenn diese ausgeführt wird, kann sie nur auf eigene lokale oder globale Variablen zugreifen, jedoch nicht auf die aus dem Erstellungskontext des Function Konstruktor aufzufes. Dieses ist der Unterschied zum Einsatz von {{jsxref("eval")}} mit Quelltext für einen Funktionsausdruck.

+ +
var x = 10;
+
+function createFunction1() {
+    var x = 20;
+    return new Function('return x;'); // this |x| refers global |x|
+}
+
+function createFunction2() {
+    var x = 20;
+    function f() {
+        return x; // this |x| refers local |x| above
+    }
+    return f;
+}
+
+var f1 = createFunction1();
+console.log(f1());          // 10
+var f2 = createFunction2();
+console.log(f2());          // 20
+
+ +

Der "richtige" Weg für das Ausführen von externen Code mit Function (Für maximale Minimierung).

+ +
function makeFunction(code){
+    return Funktion('"use strict";return ' + code)();
+}
+var add = makeFunktion(
+  "" + function(a, b, c){ return a + b + c } // dieser Code ist in einer seperaten Datei irgendwo im Produktivprogramm
+)
+console.log( add(1, 2, 3) );  // gibt sechs aus
+
+ +

Zu beachten ist, dass der obere Code komplett unpraktikabel ist. Man sollte Function niemals so missbrauchen. Stattdessen ist der obere Code nur als vereinfachtes Beispiel für eine Art Modulloader zu sehen, wobei es ein Basisskript gibt, welches dann hunderte von großen optionalen Modulen lädt. Dadurch muss ein Benutzer nicht lange warten, bis alle Module heruntergeladen sind, sondern der Clientcomputer lädt nur die benötigten Module und eine Seite lädt schneller. Dabei wird es beim auswerten von vielen Funktionen empfohlen, sie gebündelt zu übersetzen anstatt jede einzeln.

+ +
function bulkMakeFunctions(){
+    var str = "", i = 1, Len = arguments.length;
+    if(Len) {
+        str = arguments[0];
+        while (i !== Len) str += "," + arguments[i], ++i;
+    }
+    return Funktion('"use strict";return[' + str + ']')();
+}
+const [
+    add,
+    sub,
+    mul,
+    div
+] = bulkMakeFunctions(
+    "function(a,b){return a+b}",
+    "function(a,b){return a-b}",
+    "function(a,b){return a*b}",
+    "function(a,b){return a/b}"
+);
+console.log(sub(add(mul(4, 3), div(225, 5)), 7));
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.3', 'Function')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function-objects', 'Function')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function-objects', 'Function')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/isgenerator/index.html b/files/de/web/javascript/reference/global_objects/function/isgenerator/index.html new file mode 100644 index 0000000000..5897905e92 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/isgenerator/index.html @@ -0,0 +1,56 @@ +--- +title: Function.prototype.isGenerator() +slug: Web/JavaScript/Reference/Global_Objects/Function/isGenerator +tags: + - Function + - JavaScript + - Method + - Non-standard + - Obsolete +translation_of: Archive/Web/JavaScript/Function.isGenerator +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die nicht standardisierte isGenerator() Methode wird benutzt, um festzustellen, ob eine Funktion ein Generator ist. In Firefox Version 58 wurde diese Methode entfernt.

+ +

Syntax

+ +
fun.isGenerator()
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}} Welcher angibt, ob eine Funktion ein Generator ist.

+ +

Beschreibung

+ +

Die isGenerator() Methode stellt fest, ob eine Funktion fun ein Generator ist. Diese war in einem frühen Vorschlag, wurde jedoch nicht in der ECMAScript 2015 Spezifikation eingefügt.

+ +

Beispiele

+ +
function f() {}
+
+function* g() {
+  yield 42;
+}
+
+console.log('f.isGenerator() = ' + f.isGenerator()); // f.isGenerator() = false
+console.log('g.isGenerator() = ' + g.isGenerator()); // g.isGenerator() = true
+
+ +

Spezifikationen

+ +

Ist in keiner Spezifikation vorhanden. Implementiert in JavaScript 1.8.6.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.isGenerator")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/length/index.html b/files/de/web/javascript/reference/global_objects/function/length/index.html new file mode 100644 index 0000000000..3eca57b92a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/length/index.html @@ -0,0 +1,92 @@ +--- +title: Function.length +slug: Web/JavaScript/Reference/Global_Objects/Function/length +tags: + - Function + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/length +--- +
{{JSRef}}
+ +

Die length Eigenschaft gibt die Anzahl der von der Funktion erwarteten Parameter an.

+ +
{{EmbedInteractiveExample("pages/js/function-length.html")}}
+ + + +
{{js_property_attributes(0,0,1)}}
+ +

Beschreibung

+ +

length ist eine Eigenschaft eines Funktionsobjekts und zeigt an, wie viele Argumente die Funktion erwartet, d.h. die Anzahl der formalen Parameter. Diese Anzahl beinhaltet jedoch nicht den {{jsxref("rest_parameters", "rest Parameter", "", 1)}} und bezieht außerdem auch nur die Parameter ein, die in der Reihenfolge vor dem ersten Parameter mit einem Default-Wert sind. Im Gegensatz dazu ist {{jsxref("Functions/arguments/length", "arguments.length")}} eine in jeder Funktion verfügbare lokale Variable, die die tatsächliche Anzahl der übergebenen Argumente angibt.

+ +

Dateneigenschaft des Function Konstruktors

+ +

Der {{jsxref("Global_Objects/Function", "Function")}} Konstruktor ist selbst ein {{jsxref("Global_Objects/Function", "Function")}} Objekt. Seine Eigenschaft length hat den Wert 1. Dessen Attribute lauten: Writable: false, Enumerable: false, Configurable: true.

+ +

Eigenschaft des Function prototype Objekt

+ +

Die length-Eigenschaft des {{jsxref("Global_Objects/Function", "Function")}} prototype Objekts hat den Wert 0.

+ +

Beispiele

+ +
console.log(Function.length); /* 1 */
+
+console.log((function()        {}).length); /* 0 */
+console.log((function(a)       {}).length); /* 1 */
+console.log((function(a, b)    {}).length); /* 2 etc. */
+
+console.log((function(...args) {}).length);
+// 0, rest parameter wird nicht gezählt
+
+console.log((function(a, b = 1, c) {}).length);
+// 1, nur Parameter vor dem ersten Parameter mit
+// einem Default-Wert werden gezählt
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.3.5.1', 'Function.length')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function-instances-length', 'Function.length')}}{{Spec2('ES6')}}Das configurable Attribut dieser Eigenschaft ist nun true.
{{SpecName('ESDraft', '#sec-function-instances-length', 'Function.length')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.length")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/name/index.html b/files/de/web/javascript/reference/global_objects/function/name/index.html new file mode 100644 index 0000000000..29a3903d56 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/name/index.html @@ -0,0 +1,229 @@ +--- +title: Function.name +slug: Web/JavaScript/Reference/Global_Objects/Function/name +tags: + - ECMAScript 2015 + - Function + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/name +--- +
{{JSRef}}
+ +

Die nur lesende Eigenschaft name eines {{jsxref("Function")}} Objektes welche den Namen, der beim erstellen angegeben wurde enthält oder "anonymous" für anonyme Funktionen.

+ +
{{EmbedInteractiveExample("pages/js/function-name.html")}}
+ + + +
{{js_property_attributes(0,0,1)}}
+ +
 
+ +
+

Zu beachten ist, dass in nicht standardisierten implementierungen vor ES2015 das configurable Attribute ebenfalls false ist.

+
+ +

Beispiele

+ +

Name bei Funktionsanweisungen

+ +

Die name Eigenschaft gibt den Namen einer Funktionsanweisung:

+ +
function doSomething() {}
+doSomething.name; // logs "doSomething"
+
+ +

Name bei Function Konstruktoren

+ +

Funktionen, die mit der Syntax new Function(...) oder nur Function(...) erstellt werden, erstellen {{jsxref("Function")}}  mit dem Namen "anonymous".

+ +
(new Function).name; // "anonymous"
+
+ +

Gefolgerte Funktionsnamen

+ +

Bei Variablen und Methoden kann der Name von anonymen Funktionen von ihrer syntaktischen Position gefolgert werden (neu in ECMAScript 2015).

+ +
var f = function() {};
+var object = {
+  someMethod: function() {}
+};
+
+console.log(f.name); // "f"
+console.log(object.someMethod.name); // "someMethod"
+
+ +

Funktionen mit einem Namen lassen sich mittels {{jsxref("Operators/Function", "Funktionanweisung", "", 1)}} definieren:

+ +
var object = {
+  someMethod: function object_someMethod() {}
+};
+console.log(object.someMethod.name); // logs "object_someMethod"
+
+try { object_someMethod } catch(e) { console.log(e); }
+// ReferenceError: object_someMethod is not defined
+
+ +

Man kann den Namen einer Funktion nicht ändern, weil diese Eigenschaft schreibgeschützt ist:

+ + + +
var object = {
+  // anonyme Funktionsdefinition
+  someMethod: function() {}
+};
+
+object.someMethod.name = 'someMethod';
+console.log(object.someMethod.name); // leerer String, someMethod ist anonym
+
+ +

Um sie zu ändern, kann {{jsxref("Object.defineProperty()")}} eingesetzt werden.

+ +

Kurzform von Methodennamen

+ +
var o = {
+  foo(){}
+};
+o.foo.name; // "foo";
+
+ +

Gebundene Funktionsnamen

+ +

{{jsxref("Function.bind()")}} erzeugt eine Funktion mit dem Namen, der sich aus "bound " und dem Namen der Funktion zusammensetzt.

+ +
function foo() {};
+foo.bind({}).name; // "bound foo"
+ +

Funktionsnamen für Getter und Setter

+ +

Beim Einsatz von get und set Zugriffseigenschaften wird "get" oder "set" im Funktionsnamen auftauchen.

+ +
var o = {
+  get foo(){},
+  set foo(x){}
+};
+
+var descriptor = Object.getOwnPropertyDescriptor(o, "foo");
+descriptor.get.name; // "get foo"
+descriptor.set.name; // "set foo"
+
+ +

Funktionsnamen in Klassen

+ +

Über obj.constructor.name lässt sich die "Klasse" eines Objekts überprüfen (jedoch sollten die unten stehende Warnung berücksichtigt werden):

+ +
function Foo() {}  // ES2015 Syntax: class Foo {}
+
+var fooInstance = new Foo();
+console.log(fooInstance.constructor.name); // logs "Foo"
+
+ +
+

Warnung: Der Skriptinterpreter wird die eingebaute Function.name Eigenschaft nur setzen, wenn eine Funktion keine eigene Eigenschaft mit dem Namen name hat (siehe Kapitel 9.2.11 der ECMAScript2015 Sprachdefinition). Jedoch spezifiziert ES2015 das static Schlüsselwort so, dass statische Methoden als eigene Eigenschaft des Klassenkonstruktorfunktion gesetzt wird (ECMAScript2015, 14.5.14.21.b + 12.2.6.9).

+
+ +

Aus diesem Grund kann der Klassenname für jede Klasse mit einer statischen Methodeneigenschaft name() nicht bestimmt werden:

+ +
class Foo {
+  constructor() {}
+  static name() {}
+}
+
+ +

Mit einer static name() Methode hält Foo.name nicht mehr den aktuellen Klassennamen bereit, sondern eine Referenz zu dem name() Funktionsobjekt. Die oben stehende Klassendefinition in ES2015 Syntax kann in ES5 Syntax für Chrome oder Firefox wie folgt übersetzt werden:

+ +
function Foo() {}
+Object.defineProperty(Foo, 'name', { writable: true});
+Foo.name = function() {};
+
+ +

Beim Versuch die Klasse von fooInstance mithilfe von fooInstance.constructor.name herauszufinden, bekommt man nicht den Klassennamen, sondern eine Referenz auf die statische Methode. Beispiel:

+ +
var fooInstance = new Foo();
+console.log(fooInstance.constructor.name); // logs function name()
+
+ +

Man sieht zudem in der Beispiel  der ES5 Syntax für Chrome und Firefox, dass die Definition der statischen Foo.name Methode überschreibbar (writable) wird. Wird nicht angegeben, ist der Standard für solche Definition nur lesend (read-only).

+ +
Foo.name = 'Hello'
+console.log(Foo.name); // logs "Hello" if class Foo has a static name() property but "Foo" if not.
+
+ +

Aus diesem Grund darf man sich nicht darauf verlassen, dass Function.name immer den Klassennamen zurück gibt.

+ +

Symbols als Funktionsnamen

+ +

Wenn ein {{jsxref("Symbol")}} als Funktionsnamen genutzt wird und das Symbol eine Beschreibung (description) hat, ist der Methodennamen gleich der Beschreibung in eckigen Klammern.

+ +
var sym1 = Symbol("foo");
+var sym2 = Symbol();
+bar o = {
+  [sym1]: function(){},
+  [sym2]: function(){}
+};
+
+o[sym1].name; // "[foo]"
+o[sym2].name; // ""
+
+ +

JavaScript-Kompressoren und -Minimierer

+ +
+

Warnung: Beim der Benutzung von Function.name ist Vorsicht geboten, wenn Codetransformtionen, wie JavaScript Kompressoren (Minimierer) oder Obfuscators, zum Einsatz kommen. Diese Werkzeuge werden häufig im Zuge von Werkzeugketten zum Bauen von JavaScript-Programmen eingesetzt um die Größe eines Programms zu für den Produktivbetrieb zu minimieren. Solche Werkzeuge ändern die Funktionsnamen häufig beim Erstellen.

+
+ +

Quelltext wie dieser:

+ +
function Foo() {};
+var foo = new Foo();
+
+if (foo.constructor.name === 'Foo') {
+  console.log("'foo' is an instance of 'Foo'");
+} else {
+  console.log('Oops!');
+}
+
+ +

wird manchmal zu folgendem Quelltext komprimiert:

+ +
function a() {};
+var b = new a();
+if (b.constructor.name === 'Foo') {
+  console.log("'foo' is an instance of 'Foo'");
+} else {
+  console.log('Oops!');
+}
+
+ +

In der nicht komprimierten Version läuft das Programm in den true-Zweig und gibt 'foo' is an instance of 'Foo' aus. Die komprimierte Version verhält sich anders und läuft in den else-Zweig. Wenn man sich Function.name zurückerinnert, wie in obigen Beispielen, muss beachtet werden, dass Kompressoren die Methodennamen nicht ändert oder nicht annimmt, dass eine Funktion nur in diesem Quelltext benutzt.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-name', 'name')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-function-instances-name', 'name')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ +{{Compat("javascript.builtins.Function.name")}}
diff --git a/files/de/web/javascript/reference/global_objects/function/prototype/index.html b/files/de/web/javascript/reference/global_objects/function/prototype/index.html new file mode 100644 index 0000000000..afb602971c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/prototype/index.html @@ -0,0 +1,99 @@ +--- +title: Function.prototype +slug: Web/JavaScript/Reference/Global_Objects/Function/prototype +tags: + - Function + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Function +--- +
{{JSRef}}
+ +

Die Function.prototype Eigenschaft repräsentiert das {{jsxref("Function")}} Prototyp Objekt.

+ +

Beschreibung

+ +

{{jsxref("Function")}} Objekte erben von Function.prototypeFunction.prototype kann nicht modifiziert werden.

+ +

Eigenschaften

+ +
+
{{jsxref("Function.arguments")}} {{deprecated_inline}}
+
Ein Array, welches die der Funktion übergebenen Parameter enthält. Dieses ist veraltet als Eigenschaft von {{jsxref("Function")}}. Stattdessen sollte das {{jsxref("Functions/arguments", "arguments")}} Objekt in einer Funktion benutzt werden
+
{{jsxref("Function.arity")}} {{obsolete_inline}}
+
Wurde benutzt, um die Anzahl der erwarteten Argumente einer Funktion einzustellen, ist jedoch entfernt. Stattdessen kann die {{jsxref("Function.length", "length")}} Eigenschaft genutzt werden.
+
{{jsxref("Function.caller")}} {{non-standard_inline}}
+
Spezifizert die Funktion, die die aktuelle Funktion aufgerufen hat.
+
{{jsxref("Function.length")}}
+
Spezifizert die Anzahl der Parameter, die eine Funktion erwartet.
+
{{jsxref("Function.name")}}
+
Der Name einer Funktion.
+
{{jsxref("Function.displayName")}} {{non-standard_inline}}
+
Der angezeigte Name einer Funktion.
+
Function.prototype.constructor
+
Spezifiziert die Funktion, die ein Objekt Prototyp erstellt. Mehr Informationen bei {{jsxref("Object.prototype.constructor")}}.
+
+ +

Methoden

+ +
+
{{jsxref("Function.prototype.apply()")}}
+
Führt eine Funktion aus und setzt das this Objekt mit einem übergebenen wert. Parameter können in einem {{jsxref("Array")}} Objekt übergeben werden.
+
{{jsxref("Function.prototype.bind()")}}
+
Erstellt eine neue Funktion, die beim Aufruf einen angegebenen Wert für this hat, wobei die Argumentfolge vor dem Aufruf der neuen Funktion fest steht.
+
{{jsxref("Function.prototype.call()")}}
+
Führt eine Funktion aus und setzt this auf einen übergebenen Wert. Parameter können übergeben werden.
+
{{jsxref("Function.prototype.isGenerator()")}} {{non-standard_inline}}
+
Gibt true zurück, wenn die Funktion ein Generator ist, anderfalls false.
+
{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt eine Stringrepräsentation des Quelltextes einer Funktion zurück. Sie überschreibt die {{jsxref("Object.prototype.toSource")}} Methode.
+
{{jsxref("Function.prototype.toString()")}}
+
Gibt eine Stringrepräsentation des Quelltextes einer Funktion zurück. Sie überschreibt die {{jsxref("Object.prototype.toString")}} Methode.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1
{{SpecName('ES5.1', '#sec-15.3.5.2', 'Function.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-function-instances-prototype', 'Function.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/tosource/index.html b/files/de/web/javascript/reference/global_objects/function/tosource/index.html new file mode 100644 index 0000000000..75552bdc8c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/tosource/index.html @@ -0,0 +1,72 @@ +--- +title: Function.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Function/toSource +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode gibt eine Stringrepräsentation des Quelltextes des Objektes zurück.

+ +

Syntax

+ +
function.toSource();
+Function.toSource();
+
+ +

Rückgabewert

+ +

Eine Stringrepräsentation des Quelltextes des Objektes.

+ +

Beschreibung

+ +

Die toSource Methode gibt die folgenden Werte zurück:

+ + + +

Die Methode wird normalerweise von JavaScript selbst aufgerufen und nicht explizit im Quelltext. Man kann toSource während des Debuggens aufrufen, um zu ermitteln, was ein Objekt enthält.

+ +

Spezifikationen

+ +

Ist in keinem Standard. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.toSource")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/function/tostring/index.html b/files/de/web/javascript/reference/global_objects/function/tostring/index.html new file mode 100644 index 0000000000..5b3978809e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/function/tostring/index.html @@ -0,0 +1,236 @@ +--- +title: Function.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Function/toString +tags: + - Function + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Function/toString +--- +
{{JSRef}}
+ +

Die toString() Methode gibt eine Stringrepräsentation des Quelltextes einer Funktion zurück.

+ +
{{EmbedInteractiveExample("pages/js/function-tostring.html")}}
+ + + +

Syntax

+ +
function.toString()
+ +

Rückgabewert

+ +

Eine Stringrepräsentation des Quelltextes der Funktion.

+ +

Beschreibung

+ +

Das {{jsxref("Function")}} Objekt überschreibt die von {{jsxref("Object")}} geerbte Methode {{jsxref("Object.prototype.toString", "toString")}}; sie erbt nicht von {{jsxref("Object.prototype.toString")}}. Für benutzerdefinierte {{jsxref("Function")}} Objekte gibt die toString Methode einen String zurück, welcher den Quelltext, der die Funktion definiert, enthält.

+ +

JavaScript ruft die toString Methode automatisch auf, wenn einen {{jsxref("Function")}} als Text repräsentiert werden muss, z. B. wenn eine Funktion mit einem String konkateniert wird.

+ +

Die toString() Methode erzeugt eine {{jsxref("TypeError")}} Fehler("Function.prototype.toString called on incompatible object"), wenn das Objekt von this Objekt kein Function Objekt ist. Dieser wird auch bei einem {{jsxref("Proxy")}} Objekte erzeugt, zum Beispiel:

+ +
Function.prototype.toString.call('foo'); // TypeError
+
+var proxy = new Proxy(function() {}, {});
+Function.prototype.toString.call(proxy); // TypeError
+
+ +

Wenn die toString() Methode auf eingebauten Objekten oder einer von Function.prototype.bind erstellten Methode aufgerufen wird, gibt toString() native function string zurück, was wie folgt aussiet:

+ +
"function () {\n    [native code]\n}"
+
+ +

Wenn die toString() Methode auf einer Funktion aufgerufen wird, die mit dem Function Konstruktor erstellt wurde, gibt diese den Quelltext der syntetischen Funktionsdeklerations mit dem Namen "anonymous" zurück, welche die Parameter und den Funktionrumpf enthält.

+ +

Beispiele

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FunktionErgebnis von Function.prototype.toString
+
+function f(){}
+
+
+"function f(){}"
+
+
+class A { a(){} }
+
+
+"class A { a(){} }"
+
+
+function* g(){}
+
+
+"function* g(){}"
+
+
+a => a
+
+
+"a => a"
+
+
+({ a(){} }.a)
+
+
+"a(){}"
+
+
+({ *a(){} }.a)
+
+
+"*a(){}"
+
+
+({ [0](){} }[0])
+
+
+"[0](){}"
+
+
+Object.getOwnPropertyDescriptor({
+    get a(){}
+}, "a").get
+
+
+"get a(){}"
+
+
+Object.getOwnPropertyDescriptor({
+    set a(x){}
+}, "a").set
+
+
+"set a(x){}"
+
+
+Function.prototype.toString
+
+
+"function toString() { [native code] }"
+
+
+(function f(){}.bind(0))
+
+
+"function () { [native code] }"
+
+
+Function("a", "b")
+
+
+"function anonymous(a\n) {\nb\n}"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES6', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}{{Spec2('ES6')}}Spezifischere Anforderungen wurden an die Stringrepräsentation hinzugefügt.
Function.prototype.toString revisionDraftStandardisierung nativer Funktionsstrings am Zeilenende.
{{SpecName('ESDraft', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Function.toString")}}

+
+ +

Firefox spezifische Hinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/generator/index.html b/files/de/web/javascript/reference/global_objects/generator/index.html new file mode 100644 index 0000000000..af21ef18f8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generator/index.html @@ -0,0 +1,137 @@ +--- +title: Generator +slug: Web/JavaScript/Reference/Global_Objects/Generator +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - Legacy Generator + - Legacy Iterator + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Generator +--- +
{{JSRef}}
+ +

Das Generator Objekt wird von der {{jsxref("Statements/function*", "Generator Function", "", 1)}} zurückgegeben und entspricht beidem, dem Iterable Protokoll und dem Iterator Protokoll.

+ +

Syntax

+ +
function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen(); // "Generator { }"
+ +

Methoden

+ +
+
{{jsxref("Generator.prototype.next()")}}
+
Gibt einen Wert vom Generator zurück (ausgelöst durch {{jsxref("Operators/yield", "yield")}}).
+
{{jsxref("Generator.prototype.return()")}}
+
Gibt den gegebene Wert zurück und beendet den Generator.
+
{{jsxref("Generator.prototype.throw()")}}
+
Erzeugt einen Fehler im Generator (beendet auch den Generator, wenn der Fehler nicht im Generator abgefangen wird).
+
+ +

Beispiele

+ +

Ein unendlicher Iterator

+ +
function* idMaker() {
+    var index = 0;
+    while(true)
+        yield index++;
+}
+
+var gen = idMaker(); // "Generator { }"
+
+console.log(gen.next().value); // 0
+console.log(gen.next().value); // 1
+console.log(gen.next().value); // 2
+// ...
+ +

Veraltete Generatorobjekte

+ +

Firefox (SpiderMonkey) hat eine frühe Version der Generatoren in JavaScript 1.7 implementiert, bei der kein Stern (*) in der Funktionsdeklaration nötig war (man benutzte nur das yield Schlüsselwort im Funktionsrumpf). Seit Firefox 58 (Released am 23. Januar 2018) sind diese veralteten Generatoren entfernt ({{bug(1083482)}}).

+ +

Veraltete Generator Methoden

+ +
+
Generator.prototype.next() {{non-standard_inline}}
+
Gibt einen Wert vom {{jsxref("Operators/yield", "yield")}} Ausdruck zurück. Diese korrespondiert mit der next() Methode in ES2015 Generator Objekt.
+
Generator.prototype.close() {{non-standard_inline}}
+
Beendet einen Generator, so dass der Aufruf von next() zu einem {{jsxref("StopIteration")}} Fehler führt. Diese korrespondiert mit der return() Methode in ES2015 Generator Objekt.
+
Generator.prototype.send() {{non-standard_inline}}
+
Wird benutzt, um einen Wert zum Generator zu senden. Der wert wird vom {{jsxref("Operators/yield", "yield")}} Ausdruck zurückgegeben und gibt einen Wert vom nächsten {{jsxref("Operators/yield", "yield")}} Ausdruck zurück. Diese korrespondiert mit der next(x) Methode in ES2015 Generator Objekt.
+
Generator.prototype.throw() {{non-standard_inline}}
+
Erzeugt einen Fehler im Generator. Diese korrespondiert mit der throw() Methode in ES2015 Generator Objekt.
+
+ +

Veraltete Generator Beispiele

+ +
function fibonacci() {
+  var a = yield 1;
+  yield a * 2;
+}
+
+var it = fibonacci();
+console.log(it);          // "Generator {  }"
+console.log(it.next());   // 1
+console.log(it.send(10)); // 20
+console.log(it.close());  // undefined
+console.log(it.next());   // throws StopIteration (as the generator is now closed)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generator-objects', 'Generator objects')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generator-objects', 'Generator objects')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Generator")}}

+ +

Siehe auch

+ +

Veraltete Generatoren

+ + + +

ES2015 Generatoren

+ + diff --git a/files/de/web/javascript/reference/global_objects/generator/next/index.html b/files/de/web/javascript/reference/global_objects/generator/next/index.html new file mode 100644 index 0000000000..44c45b77cf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generator/next/index.html @@ -0,0 +1,116 @@ +--- +title: Generator.prototype.next() +slug: Web/JavaScript/Reference/Global_Objects/Generator/next +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/next +--- +
{{JSRef}}
+ +

Die next() Methode gibt ein Objekt mit den zwei Eigenschaften done und value zurück. Man kann der next Methode auch einen Wert für den Generator übergeben.

+ +

Syntax

+ +
gen.next(value)
+ +

Parameter

+ +
+
value
+
Der Wert der zum Generator übermittelt wird.
+
+ +

Return value

+ +

Ein Objekt mit zwei Eigenschaften:

+ + + +

Beispiele

+ +

Einsatz von next()

+ +

Das folgende Beispiel zeigt einen einfachen Generator und das Objekt, welches die next Methode zurück gibt:

+ +
function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen(); // "Generator { }"
+g.next();      // "Object { value: 1, done: false }"
+g.next();      // "Object { value: 2, done: false }"
+g.next();      // "Object { value: 3, done: false }"
+g.next();      // "Object { value: undefined, done: true }"
+
+ +

Werte zum Generator senden

+ +

Im diesem Beispiel wird next mit einem Wert aufgerufen. Zu beachten ist, dass der Generator beim ersten aufruf nicht ausgibt, weil der Generator keinen initialen Wert generiert.

+ +
function* gen() {
+  while(true) {
+    var value = yield null;
+    console.log(value);
+  }
+}
+
+var g = gen();
+g.next(1);
+// "{ value: null, done: false }"
+g.next(2);
+// 2
+// "{ value: null, done: false }"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generator.prototype.next', 'Generator.prototype.next')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generator.prototype.next', 'Generator.prototype.next')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Generator.next")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/generator/return/index.html b/files/de/web/javascript/reference/global_objects/generator/return/index.html new file mode 100644 index 0000000000..897cd9b4f9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generator/return/index.html @@ -0,0 +1,102 @@ +--- +title: Generator.prototype.return() +slug: Web/JavaScript/Reference/Global_Objects/Generator/return +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/return +--- +
{{JSRef}}
+ +

Die return() Gibt den gegebenen Wert und beendet den Generator

+ +

Syntax

+ +
gen.return(value)
+ +

Parameter

+ +
+
value
+
Wert, der zurückgegeben werden soll.
+
+ +

Rückgabewert

+ +

Der als Argument angegebene Wert.

+ +

Beispiele

+ +

Einsatz von return()

+ +

Das folgende Beispiel zeigt einen einfachen Generator und den Einsatz der return Methode.

+ +
function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen();
+
+g.next();        // { value: 1, done: false }
+g.return('foo'); // { value: "foo", done: true }
+g.next();        // { value: undefined, done: true }
+
+ +

Wenn return(value) auf einem Generator aufgerufen wird, der schon den Status "completed" hat, bleibt diese auch in diesem Status. Wenn kein Argument übergeben wird, wird das selbe Objekt wir bei .next() zurückgegeben. Wenn ein Parameter übergeben wird, wird dieses als value Eigenschaft beim zurückgegebenen Objekt zurückgegeben.

+ +
function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen();
+g.next(); // { value: 1, done: false }
+g.next(); // { value: 2, done: false }
+g.next(); // { value: 3, done: false }
+g.next(); // { value: undefined, done: true }
+g.return(); // { value: undefined, done: true }
+g.return(1); // { value: 1, done: true }
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generator.prototype.return', 'Generator.prototype.return')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generator.prototype.return', 'Generator.prototype.return')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Generator.return")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/generator/throw/index.html b/files/de/web/javascript/reference/global_objects/generator/throw/index.html new file mode 100644 index 0000000000..0879bd77d3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generator/throw/index.html @@ -0,0 +1,101 @@ +--- +title: Generator.prototype.throw() +slug: Web/JavaScript/Reference/Global_Objects/Generator/throw +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw +--- +
{{JSRef}}
+ +

Die throw() Methode übergibt dem Generator eine Exception, welche im Generator zu einem Fehler führt. Zudem wird ein Objekt mit den zwei Eigenschaften done und value zurückgegeben.

+ +

Syntax

+ +
gen.throw(exception)
+ +

Parameter

+ +
+
exception
+
Die Exception, die geworfen werden soll. Für Debuggingzwecke ist es sinnvoll eine Instanz von {{jsxref("Error")}} zu verwenden.
+
+ +

Rückgabewert

+ +

Ein Objekt mit zwei Eigenschaften:

+ + + +

Beispiele

+ +

Einsatz von throw()

+ +

Das folgende Beispiel zeigt einen einfachen Generator und einen Fehler der mit der throw Methode erzeugt wird. Ein Fehler kann mit try...catch abgefangen werden.

+ +
function* gen() {
+  while(true) {
+    try {
+       yield 42;
+    } catch(e) {
+      console.log('Error caught!');
+    }
+  }
+}
+
+var g = gen();
+g.next();
+// { value: 42, done: false }
+g.throw(new Error('Something went wrong'));
+// "Error caught!"
+// { value: 42, done: false }
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Generator.throw")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/generatorfunction/index.html b/files/de/web/javascript/reference/global_objects/generatorfunction/index.html new file mode 100644 index 0000000000..717774e10f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generatorfunction/index.html @@ -0,0 +1,115 @@ +--- +title: GeneratorFunction +slug: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +tags: + - Constructor + - ECMAScript 2015 + - GeneratorFunction + - Iterator + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +--- +
{{JSRef}}
+ +

Der GeneratorFunction Konstruktor erstellt eine neues {{jsxref("Statements/function*", "Generator Funktion")}} Objekt. aktuell ist in JavaScript jede Generatorfunktion ein GeneratorFunction Objekt.

+ +

Zu beachten ist, dass GeneratorFunction kein globales Objekt ist. Es kann mit folgendem Quelltext erhalten werden.

+ +
Object.getPrototypeOf(function*(){}).constructor
+
+ +

Syntax

+ +
new GeneratorFunction ([arg1[, arg2[, ...argN]],] functionBody)
+ +

Parameters

+ +
+
arg1, arg2, ... argN
+
Namen für Formale Argumente der Funktion. Jeder muss ein String sein, der mit einem validen JavaScript-Bezeichner korrespondiert oder eine liste von solchen String, welche mit einem Komma getrennt sind; zum Beispiel "x", "theValue", oder "a,b"
+
functionBody
+
Ein String, welcher die Statements für die Funktionsdefinition enthält.
+
+ +

Beschreibung

+ +

{{jsxref("Statements/function*", "Generator Funktion")}} Objekte, die mit dem GeneratorFunction Konstruktor erstellt werden übersetzt, wenn die Funktion erstellt wird. Das ist weniger effizient als die Erstellung mit einer {{jsxref("Statements/function*", "function* Ausdruck")}} und Aufrufe im Quelltext, weil solche Funktionen dem dem Rest des Quelltextes übersetzt werden.

+ +

Alle Argumente, die der Funktion übergeben werden, werden als Namen der Bezeichner behandelt und werden als Parameter der Funktion übergen. Die Reihenfolge ist die angegebene Reihenfolge.

+ +
+

Hinweis: {{jsxref("Statements/function*", "Generator Function")}}, die mit dem GeneratorFunction Konstruktor erstellt werden erstellen keine Closures im Erstellungskontext. Sie werden immer im globalen Sichtbarkeitsbereich erstellt. Wenn diese ausgeführt werden, haben sie nur Zugriff auf eigene lokale Variablen und globale Variablen, jedoch nicht auf Variablen des Scopes, in der GeneratorFunction Konstruktor aufgerufen wird. Dieses unterscheidet diese Methode von {{jsxref("Global_Objects/eval", "eval")}} mit dem Quelltext einer Generatorfunktion.

+
+ +

Das Aufrufen des GeneratorFunction Konstruktors als Funktion (ohne Einsatz des new Operator) hat den selben Effekt wie beim Aufruf als Konstruktor.

+ +

Eigenschaften

+ +
+
GeneratorFunction.length
+
Die Länge des GeneratorFunction Konstruktor Eigenschaft, welche 1 ist.
+
{{jsxref("GeneratorFunction.prototype")}}
+
Erlaubt das Hinzufügen von Eingenschaften für alle Generatorfunktionsobjekte.
+
+ +

GeneratorFunction Prototyp Objekt

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/GeneratorFunction/prototype', 'Eigenschaften')}}
+ +

GeneratorFunction Instanzen

+ +

GeneratorFunction Instanzen erben Methoden und Eigenschaften von {{jsxref("GeneratorFunction.prototype")}}. Wie bei allen Konstruktoren, kann man das Konstruktor Prototyp Objekt ändern, um diese für alle GeneratorFunction Instanzen zu übernehmen.

+ +

Beispiele

+ +

Erstellen einer Generatorfunktion mit einem GeneratorFunction Konstruktor

+ +
var GeneratorFunction = Object.getPrototypeOf(function*(){}).constructor
+var g = new GeneratorFunction('a', 'yield a * 2');
+var iterator = g(10);
+console.log(iterator.next().value); // 20
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generatorfunction-objects', 'GeneratorFunction')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generatorfunction-objects', 'GeneratorFunction')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.GeneratorFunction")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/generatorfunction/prototype/index.html b/files/de/web/javascript/reference/global_objects/generatorfunction/prototype/index.html new file mode 100644 index 0000000000..d4e895ed9c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/generatorfunction/prototype/index.html @@ -0,0 +1,66 @@ +--- +title: GeneratorFunction.prototype +slug: Web/JavaScript/Reference/Global_Objects/GeneratorFunction/prototype +tags: + - ECMAScript 2015 + - GeneratorFunction + - Iterator + - JavaScript + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +--- +
{{JSRef}}
+ +

Die GeneratorFunction.prototype Eigenschaft repräsentiert den Prototypen des {{jsxref("GeneratorFunction")}} Objektes.

+ +

Beschreibung

+ +

{{jsxref("GeneratorFunction")}} Objekt erbt von GeneratorFunction.prototype. GeneratorFunction.prototype kann nicht verändert werden.

+ +

Eigenschaften

+ +
+
GeneratorFunction.constructor
+
Der initiale Wert von {{jsxref("GeneratorFunction")}}.
+
GeneratorFunction.prototype.prototype
+
Der Wert ist %GeneratorPrototype%.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-generatorfunction.prototype', 'GeneratorFunction.prototype')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-generatorfunction.prototype', 'GeneratorFunction.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.GeneratorFunction.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/globalthis/index.html b/files/de/web/javascript/reference/global_objects/globalthis/index.html new file mode 100644 index 0000000000..00e814c877 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/globalthis/index.html @@ -0,0 +1,96 @@ +--- +title: globalThis +slug: Web/JavaScript/Reference/Global_Objects/globalThis +tags: + - JavaScript + - Property + - Reference + - global + - globalThis + - this +translation_of: Web/JavaScript/Reference/Global_Objects/globalThis +--- +
{{jsSidebar("Objects")}}
+ +

Die Eigenschaft globalThis gibt das globale Objekt der obersten Ebene zurück.

+ +
{{EmbedInteractiveExample("pages/js/globalprops-globalthis.html","shorter")}}
+ + + +

{{JS_Property_Attributes(1, 0, 1)}}

+ +

Beschreibung

+ +

In der Vergangenheit war für den Zugriff auf das globale Objekt in verschiedenen JavaScript-Umgebungen eine unterschiedliche Syntax erforderlich. Im Web kann man {{domxref("Window.window", "window")}}, {{domxref("Window.self", "self")}} oder {{domxref("Window.frames", "frames")}} verwenden - aber in Web Workers funktioniert nur self. In Node.js funktioniert keines der aufgezählten, und es muss stattdessen global verwendet werden.

+ +

Das Schlüsselwort this kann in Funktionen verwendet werden, die nicht im Strict-Mode ausgeführt werden, ist jedoch in Modulen und in Funktionen, die im Strict-Mode ausgeführt werden, undefined. Es kann Function('return this')() verwendet werden, aber Umgebungen, die {{jsxref("eval", "eval()")}} deaktiviert haben, wie etwa durch {{Glossary("CSP")}} in Browsern, verhindern die Verwendung von {{jsxref("Function")}} auf diese Weise.
+
+ Die Eigenschaft globalThis bietet eine Standardmethode für den Zugriff auf den globalen Wert this (und damit auf das globale Objekt selbst) in verschiedenen Umgebungen. Im Gegensatz zu ähnlichen Eigenschaften wie window und self funktioniert es garantiert in Fenster- und Nicht-Fenster-Kontexten. Auf diese Weise können Sie auf konsistente Weise auf das globale Objekt zugreifen, ohne wissen zu müssen, in welcher Umgebung der Code ausgeführt wird. Um sich den Namen zu merken, denken Sie daran, dass this im globalen Bereich globalThis ist.

+ +

HTML und WindowProxy

+ +

In vielen Engines ist globalThis ein Verweis auf das tatsächliche globale Objekt. In Webbrowsern wird jedoch aus Gründen der iframe- und fensterübergreifenden Sicherheit ein {{jsxref("Proxy")}} um das tatsächliche globale Objekt (das nicht direkt verwendet werden kann). Diese Unterscheidung ist im allgemeinen Sprachgebrauch selten relevant, aber wichtig zu beachten.

+ +

Benennung

+ +

Mehrere andere populäre Namen wie self und global wurden aus dem Vorschlag entfernt, da sie die Kompatibilität mit existierendem Code potenziell brechen könnten. Siehe das Dokument "Naming Constraints" für weitere Details.

+ +

Beispiele

+ +

Umgebungsübergreifend den globalen Kontext finden

+ +

Vor globalThis war Function('return this')() die einzige zuverlässige, plattformübergreifende Methode, um das globale Objekt für eine Umgebung abzurufen. Dies führt jedoch in einigen Einstellungen zu CSP Verstößen. Daher verwendet es6-shim eine Prüfung wie diese:

+ +
var getGlobal = function () {
+  if (typeof self !== 'undefined') { return self; }
+  if (typeof window !== 'undefined') { return window; }
+  if (typeof global !== 'undefined') { return global; }
+  throw new Error('unable to locate global object');
+};
+
+var globals = getGlobal();
+
+if (typeof globals.setTimeout !== 'function') {
+  // no setTimeout in this environment!
+}
+
+ +

Mit der Verfügbarkeit von globalThis, ist die zusätzliche umgebungsübergreifende Suche nach dem Global Kontext nicht mehr notwendig:

+ +
if (typeof globalThis.setTimeout !== 'function') {
+  // no setTimeout in this environment!
+}
+ +

Spezifikationen

+ + + + + + + + + + + + +
Specification
{{SpecName("ESDraft", "#sec-globalthis", "globalThis")}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.globalThis")}}

+ +

Implementierungsfortschritt

+ +

Die folgende Tabelle enthält einen täglichen Implementierungsstatus für dieses Feature, da sie noch keine browserübergreifende Standardisierung erreicht hat. Die Daten werden generiert, indem die relevanten Funktionstests in Test262, der Standard-Testsuite von JavaScript, im nächtlichen Build oder in der neuesten Version der JavaScript-Engine jedes Browsers ausgeführt werden.

+ +
{{EmbedTest262ReportResultsTable("globalThis")}}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/index.html b/files/de/web/javascript/reference/global_objects/index.html new file mode 100644 index 0000000000..e7f9d05f3a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/index.html @@ -0,0 +1,191 @@ +--- +title: Globale Objekte +slug: Web/JavaScript/Reference/Global_Objects +tags: + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects +--- +
{{jsSidebar("Objects")}}
+ +

Dieses Kapitel dokumentiert alle Objekte, die standardmäßig in einer JavaScript-Umgebung zur Verfügung stehen.

+ +

Der Ausdruck "Globales Objekt" (oder Standardobjekt) ist nicht zu verwechseln mit dem global object. Hier sind globale Objekte Objekte, die zu Objekten im globalen Zugriffsbereich (scope) referenzieren. Das global object selbst wird mit Hilfe des {{jsxref("Operators/this", "this")}}-Operators im globalen Bereich angesprochen (sofern der Strict-Modus von ECMAScript 5 nicht verwendet wird, andernfalls sind sie undefined). Tatsächlich besteht der globale Bereich aus den Eigenschaften (properties) des global object (einschließlich geerbter Eigenschaften, falls vorhanden).

+ +

Andere Objekte im globalen Bereich wurden entweder vom Benutzerscript erstellt oder von der ausführenden Anwendung (meist der Browser) bereitgestellt. Die Anwendungsobjekte, welche im Browserumfeld (DOM) verfügbar sind, werden in der API-Referenz dokumentiert. Eine detailiertere Unterscheidung zwischen DOM- und Kern-JavaScript befindet sich im Kapitel Überblick JavaScript-Technologien.

+ +

Standardobjekte (kategorisiert)

+ +

Eigenschaften

+ +

Diese globalen Eigenschaften stellen einen einfachen Wert dar; sie haben keine weiteren Eigenschaften oder Methoden.

+ + + +

Funktionen

+ +

Diese globalen Funktionen werden als solche aufgerufen, nicht als Teil eines Objektes.

+ + + +

Fundamentale Objekte

+ +

Auf nachfolgenden Objekte basieren alle anderen, in JavaScript verfügbaren Objekte. Sie repräsentieren sowohl Objekte, als auch Funktionen und Fehler.

+ + + +

Zahlen und Zeiten

+ +

Objekte, die sich mit Zahlen und Zeit-Daten, sowie mathematischen Berechnungen befassen.

+ + + +

Textverarbeitung

+ +

Objekte zum Verarbeiten von Text.

+ + + +

Indexgebundene Kollektionen

+ +

Diese Objekte umfassen Sammlungen von anderen Objekten, auf die über einen fortlaufenden, nummerischen Index zugegriffen werden kann. Zu ihnen gehören Arrays (Felder) und Array-ähnliche Objekte.

+ + + +

Schlüsselgebundene Kollektionen

+ +

Diese Objekte umfassen Sammlungen von anderen Objekten, auf die über einen wahlfreien Schlüssel zugegriffen werden kann; sie lassen sich zudem nach Einfügereihenfolge durchlaufen.

+ + + +

Vector Kollektionen

+ +

{{Glossary("SIMD")}} Vector Datentypen sind Objekte in denen die Daten in Bahnen angeordnet sind.

+ + + +

Strukturierte Daten

+ +

Datenpuffer und JavaScript-Objekt-Notation.

+ + + +

Kontrollabstraktions Objekte

+ + + +

Reflection

+ + + +

Internationalisierung

+ +

Ergänzungen zum ECMAScript-Kern für Aufgaben, die verschiedene Sprachen unterstützen sollen.

+ + + +

WebAssembly

+ + + +

Sonstiges

+ + diff --git a/files/de/web/javascript/reference/global_objects/infinity/index.html b/files/de/web/javascript/reference/global_objects/infinity/index.html new file mode 100644 index 0000000000..f862732ec2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/infinity/index.html @@ -0,0 +1,83 @@ +--- +title: Infinity +slug: Web/JavaScript/Reference/Global_Objects/Infinity +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Infinity +--- +
{{jsSidebar("Objects")}}
+ +

Die globale Eigenschaft Infinity ist ein numerischer Wert, der die Unendlichkeit repräsentiert.

+ +

{{js_property_attributes(0,0,0)}}

+ +
{{EmbedInteractiveExample("pages/js/globalprops-infinity.html")}}
+ + + +

Syntax

+ +
Infinity 
+ +

Beschreibung

+ +

Infinity ist eine Eigenschaft des globalen Objekts, was bedeutet, dass es eine Variable im globalen Gültigkeitsbereich ist.

+ +

Der initiale Wert von Infinity entspricht {{jsxref("Number.POSITIVE_INFINITY")}}. Der Wert von Infinity (positiv unendlich) ist größer als alle anderen Nummern. Mathematisch entspricht der Wert der Unendlichkeit. Zum Beispiel ist das Produkt einer positiven Zahl mit Infinity immer Infinity. Jede Division einer Zahl durch Infinity ergibt 0.

+ +

In der ECMAScript 5 Spezifikation wurde Infinity als read only Eigenschaft (nur lesender Zugriff) eingestuft. (Dieses wurde in JavaScript 1.8.5 / Firefox 4 implementiert.)

+ +

Beispiele

+ +
console.log(Infinity);           /* Infinity */
+console.log(Infinity + 1);       /* Infinity */
+console.log(Math.pow(10, 1000)); /* Infinity */
+console.log(Math.log(0));        /* -Infinity */
+console.log(1 / Infinity);       /* 0 */
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3
{{SpecName('ES5.1', '#sec-15.1.1.2', 'Infinity')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-value-properties-of-the-global-object-infinity', 'Infinity')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-value-properties-of-the-global-object-infinity', 'Infinity')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Infinity")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/int16array/index.html b/files/de/web/javascript/reference/global_objects/int16array/index.html new file mode 100644 index 0000000000..4d2ff2cdab --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/int16array/index.html @@ -0,0 +1,204 @@ +--- +title: Int16Array +slug: Web/JavaScript/Reference/Global_Objects/Int16Array +tags: + - Constructor + - JavaScript + - TypedArray + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/Int16Array +--- +
{{JSRef}}
+ +

Das Int16Array getypte Array repräsentiert ein Array von zweierkomplement 16 Bit vorzeichenbehafteten, ganze Zahlen in der Plattform-Byte-Reihenfolge. Wenn Kontrolle über die Byte-Reihenfolge erforderlich ist, muss {{jsxref("DataView")}} stattdessen benutz werden. Die Inhalte werden mit 0 initialisiert. Wie erwartet, kann man Element in einem Array mit Objektmethoden referenzieren oder man benutzt die normale Arrayindex-Syntax (das ist die Klammernotation).

+ +

Syntax

+ +
new Int16Array(); // new in ES2017
+new Int16Array(length);
+new Int16Array(typedArray);
+new Int16Array(object);
+new Int16Array(buffer [, byteOffset [, length]]);
+ +

Für mehr Informationen über die Konstruktorensyntax und die Parameter, siehe auf der Seite TypedArray.

+ +

Eigenschaften

+ +
+
{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int16Array.BYTES_PER_ELEMENT")}}
+
Gibt die Größe der Elemente zurück. 2 im Falle eines Int16Array.
+
Int16Array.length
+
Statische Längeneigenschaft welche den Wert 0 hat. Für die aktuelle Länge (Anzahl der Elemente) siehe {{jsxref("TypedArray.prototype.length", "Int16Array.prototype.length")}}.
+
{{jsxref("TypedArray.name", "Int16Array.name")}}
+
Gibt den Stringwert des Konstruktornamens zurück. In Fall eines Int16Array Typs: "Int16Array".
+
{{jsxref("TypedArray.prototype", "Int16Array.prototype")}}
+
Prototyp für das TypedArray Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.from", "Int16Array.from()")}}
+
Erstelle ein neues Int16Array von einem Array-Ähnlichen oder Iterable Objekt. Siehe auch {{jsxref("Array.from()")}}.
+
{{jsxref("TypedArray.of", "Int16Array.of()")}}
+
Erstellt ein neues Int16Array mit einer variablen Anzahl an Argumenten. Sie auch {{jsxref("Array.of()")}}.
+
+ +

Int16Array Prototyp

+ +

Alle Int16Array Objekte erben von {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.

+ +

Eigenschaften

+ +
+
Int16Array.prototype.constructor
+
Gibt die Funktion, die einen Instanzprototyp erstellt zurück. Diese ist auf den Int16Array Konstruktor voreingestellt.
+
{{jsxref("TypedArray.prototype.buffer", "Int16Array.prototype.buffer")}} {{readonlyInline}}
+
Gibt die {{jsxref("ArrayBuffer")}} Referenz zurück, welche nach der Erstellung eines Int16Array fest ist und nicht mehr geändert werden kann.
+
{{jsxref("TypedArray.prototype.byteLength", "Int16Array.prototype.byteLength")}} {{readonlyInline}}
+
Gibt die Länge (in Bytes) des Int16Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.byteOffset", "Int16Array.prototype.byteOffset")}} {{readonlyInline}}
+
Gibt das Offset (in Bytes) des Int16Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.length", "Int16Array.prototype.length")}} {{readonlyInline}}
+
Gibt Anzahl der Elemente des Int16Array zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.copyWithin", "Int16Array.prototype.copyWithin()")}}
+
Kopiert eine Sequenz von Arrayelementen in das Array. Siehe auch {{jsxref("Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.entries", "Int16Array.prototype.entries()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Schlüssel/Wertepaare für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.entries()")}}.
+
{{jsxref("TypedArray.every", "Int16Array.prototype.every()")}}
+
Teste, ob alle Elemente einem, als Funktion übergebenen, Test erfüllen. Siehe auch Array.prototype.every()")}}.
+
{{jsxref("TypedArray.fill", "Int16Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays vom Startindex bis zum Endindex mit einem statischen Wert. Siehe auch {{jsxref("Array.prototype.fill()")}}.
+
{{jsxref("TypedArray.filter", "Int16Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen des alten Arrays, für die eine übergebene Filterfunktion true zurückgibt. Siehe auch {{jsxref("Array.prototype.filter()")}}.
+
{{jsxref("TypedArray.find", "Int16Array.prototype.find()")}}
+
Gibt ein gefundenes Element des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder undefined wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.find()")}}.
+
{{jsxref("TypedArray.findIndex", "Int16Array.prototype.findIndex()")}}
+
Gibt den Index eines gefundenen Elements des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.findIndex()")}}.
+
{{jsxref("TypedArray.forEach", "Int16Array.prototype.forEach()")}}
+
Ruft für jedes Element in einem Array eine Funktion auf. Siehe auch {{jsxref("Array.prototype.forEach()")}}.
+
{{jsxref("TypedArray.includes", "Int16Array.prototype.includes()")}} {{experimental_inline}}
+
Überprüft, ob ein getyptes Array ein bestimmtes Element enthält und gibt gegebenfalls true oderfalse zurück. Siehe auch {{jsxref("Array.prototype.includes()")}}.
+
{{jsxref("TypedArray.indexOf", "Int16Array.prototype.indexOf()")}}
+
Gibt den ersten Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.indexOf()")}}.
+
{{jsxref("TypedArray.join", "Int16Array.prototype.join()")}}
+
Führt alle Elemente eines Arrays zu einem String zusammen. Siehe auch {{jsxref("Array.prototype.join()")}}.
+
{{jsxref("TypedArray.keys", "Int16Array.prototype.keys()")}}
+
Gibt ein neuen Array Iterator zurück, der alle Schlüssel für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.keys()")}}.
+
{{jsxref("TypedArray.lastIndexOf", "Int16Array.prototype.lastIndexOf()")}}
+
Gibt den letzen Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.lastIndexOf()")}}.
+
{{jsxref("TypedArray.map", "Int16Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Resultaten spezifizierten Funktion, die für jedes Element aufgerufen wird. Siehe auch {{jsxref("Array.prototype.map()")}}.
+
{{jsxref("TypedArray.move", "Int16Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}
+
Ehemalige nicht Standardisierte Version von {{jsxref("TypedArray.copyWithin", "Int16Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.reduce", "Int16Array.prototype.reduce()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von links nach rechts), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reduceRight", "Int16Array.prototype.reduceRight()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von rechts nach links), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reverse", "Int16Array.prototype.reverse()")}}
+
Kehrt die Reihenfolge von jedem Element eines Arrays um — das Erste wird das Letzte und das Letzte wird das Erste. Siehe auch {{jsxref("Array.prototype.reverse()")}}.
+
{{jsxref("TypedArray.set", "Int16Array.prototype.set()")}}
+
Speichert mehrere Werte in einem getypten Array und ließt Eingabewerte aus einem spezifiziertem Array.
+
{{jsxref("TypedArray.slice", "Int16Array.prototype.slice()")}}
+
Extrahiert einen Bereich aus einem Array und gibt diesen in einem neuen Array zurück. Siehe auch {{jsxref("Array.prototype.slice()")}}.
+
{{jsxref("TypedArray.some", "Int16Array.prototype.some()")}}
+
Gibt true zurück, wenn nur ein Element in einem Array den als Funktion übergebenen Test erfüllt. Siehe auch {{jsxref("Array.prototype.some()")}}
+
{{jsxref("TypedArray.sort", "Int16Array.prototype.sort()")}}
+
Sortiert die Elemente eines Arrays in-Place und gibt das Array zurück. Siehe auch {{jsxref("Array.prototype.sort()")}}.
+
{{jsxref("TypedArray.subarray", "Int16Array.prototype.subarray()")}}
+
Gibt ein neues Int16Array vom gegebenen Start- und Endindex zurück.
+
{{jsxref("TypedArray.values", "Int16Array.prototype.values()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Werte von jedem Index im Array enthält. Siehe auch {{jsxref("Array.prototype.values()")}}.
+
{{jsxref("TypedArray.toLocaleString", "Int16Array.prototype.toLocaleString()")}}
+
Gibt einen Ortsabhängige Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toLocaleString()")}}.
+
{{jsxref("TypedArray.toString", "Int16Array.prototype.toString()")}}
+
Gibt einen Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toString()")}}.
+
{{jsxref("TypedArray.@@iterator", "Int16Array.prototype[@@iterator]()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die zugehörigen Werte für jeden Index im Array enthalten.
+
+ +

Beispiele

+ +

Verschiedene Wege, um ein Int16Array zu erstellen:

+ +
// From a length
+var int16 = new Int16Array(2);
+int16[0] = 42;
+console.log(int16[0]); // 42
+console.log(int16.length); // 2
+console.log(int16.BYTES_PER_ELEMENT); // 2
+
+// From an array
+var arr = new Int16Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Int16Array([21, 31]);
+var y = new Int16Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(8);
+var z = new Int16Array(buffer, 0, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var int16 = new Int16Array(iterable);
+// Int16Array[1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#table-49', 'TypedArray constructors')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA Standard. Spezifiziert, dass ein new benötigt wird.
{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}{{Spec2('ESDraft')}}ECMAScript 2017 ändert den Int16Array Konstruktor, um die ToIndex Operation zu benutzen und erlaubt einen Konstruktor ohne Parameter.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Int16Array")}}

+ +

Kompatibilitätshinweise

+ +

Mit Beginn von ECMAScript 2015, müssen Int16Array Konstruktoren mit einem {{jsxref("Operators/new", "new")}} benutzt werden. Der Aufruf eines Int16Array Konstruktors als eine Funktion ohne new, Führt jetzt zu einem {{jsxref("TypeError")}}.

+ +
var dv = Int16Array([1, 2, 3]);
+// TypeError: calling a builtin Int16Array constructor
+// without new is forbidden
+ +
var dv = new Int16Array([1, 2, 3]);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/int32array/index.html b/files/de/web/javascript/reference/global_objects/int32array/index.html new file mode 100644 index 0000000000..ed2da2bcdc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/int32array/index.html @@ -0,0 +1,204 @@ +--- +title: Int32Array +slug: Web/JavaScript/Reference/Global_Objects/Int32Array +tags: + - Constructor + - JavaScript + - TypedArray + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/Int32Array +--- +
{{JSRef}}
+ +

Das Int32Array getypte Array repräsentiert ein Array von zweierkomplement 32 Bit vorzeichenbehafteten, ganze Zahlen in der Plattform-Byte-Reihenfolge. Wenn Kontrolle über die Byte-Reihenfolge erforderlich ist, muss {{jsxref("DataView")}} stattdessen benutz werden. Die Inhalte werden mit 0 initialisiert. Wie erwartet, kann man Element in einem Array mit Objektmethoden referenzieren oder man benutzt die normale Arrayindex-Syntax (das ist die Klammernotation).

+ +

Syntax

+ +
new Int32Array(); // new in ES2017
+new Int32Array(length);
+new Int32Array(typedArray);
+new Int32Array(object);
+new Int32Array(buffer [, byteOffset [, length]]);
+ +

Für mehr Informationen über die Konstruktorensyntax und die Parameter, siehe auf der Seite TypedArray.

+ +

Eigenschaften

+ +
+
{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int32Array.BYTES_PER_ELEMENT")}}
+
Gibt die Größe der Elemente zurück. 4 im Falle eines Int32Array.
+
Int32Array.length
+
Statische Längeneigenschaft welche den Wert 0 hat. Für die aktuelle Länge (Anzahl der Elemente) siehe {{jsxref("TypedArray.prototype.length", "Int32Array.prototype.length")}}.
+
{{jsxref("TypedArray.name", "Int32Array.name")}}
+
Gibt den Stringwert des Konstruktornamens zurück. In Fall eines Int32Array Typs: "Int32Array".
+
{{jsxref("TypedArray.prototype", "Int32Array.prototype")}}
+
Prototyp für das TypedArray Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.from", "Int32Array.from()")}}
+
Erstelle ein neues Int32Array von einem Array-Ähnlichen oder Iterable Objekt. Siehe auch {{jsxref("Array.from()")}}.
+
{{jsxref("TypedArray.of", "Int32Array.of()")}}
+
Erstellt ein neues Int32Array mit einer variablen Anzahl an Argumenten. Sie auch {{jsxref("Array.of()")}}.
+
+ +

Int32Array Prototyp

+ +

Alle Int32Array Objekte erben von {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.

+ +

Eigenschaften

+ +
+
Int32Array.prototype.constructor
+
Gibt die Funktion, die einen Instanzprototyp erstellt zurück. Diese ist auf den Int32Array Konstruktor voreingestellt.
+
{{jsxref("TypedArray.prototype.buffer", "Int32Array.prototype.buffer")}} {{readonlyInline}}
+
Gibt die {{jsxref("ArrayBuffer")}} Referenz zurück, welche nach der Erstellung eines Int32Array fest ist und nicht mehr geändert werden kann.
+
{{jsxref("TypedArray.prototype.byteLength", "Int32Array.prototype.byteLength")}} {{readonlyInline}}
+
Gibt die Länge (in Bytes) des Int32Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.byteOffset", "Int32Array.prototype.byteOffset")}} {{readonlyInline}}
+
Gibt das Offset (in Bytes) des Int32Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.length", "Int32Array.prototype.length")}} {{readonlyInline}}
+
Gibt Anzahl der Elemente des Int32Array zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.copyWithin", "Int32Array.prototype.copyWithin()")}}
+
Kopiert eine Sequenz von Arrayelementen in das Array. Siehe auch {{jsxref("Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.entries", "Int32Array.prototype.entries()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Schlüssel/Wertepaare für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.entries()")}}.
+
{{jsxref("TypedArray.every", "Int32Array.prototype.every()")}}
+
Teste, ob alle Elemente einem, als Funktion übergebenen, Test erfüllen. Siehe auch Array.prototype.every()")}}.
+
{{jsxref("TypedArray.fill", "Int32Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays vom Startindex bis zum Endindex mit einem statischen Wert. Siehe auch {{jsxref("Array.prototype.fill()")}}.
+
{{jsxref("TypedArray.filter", "Int32Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen des alten Arrays, für die eine übergebene Filterfunktion true zurückgibt. Siehe auch {{jsxref("Array.prototype.filter()")}}.
+
{{jsxref("TypedArray.find", "Int32Array.prototype.find()")}}
+
Gibt ein gefundenes Element des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder undefined wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.find()")}}.
+
{{jsxref("TypedArray.findIndex", "Int32Array.prototype.findIndex()")}}
+
Gibt den Index eines gefundenen Elements des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.findIndex()")}}.
+
{{jsxref("TypedArray.forEach", "Int32Array.prototype.forEach()")}}
+
Ruft für jedes Element in einem Array eine Funktion auf. Siehe auch {{jsxref("Array.prototype.forEach()")}}.
+
{{jsxref("TypedArray.includes", "Int32Array.prototype.includes()")}} {{experimental_inline}}
+
Überprüft, ob ein getyptes Array ein bestimmtes Element enthält und gibt gegebenfalls true oderfalse zurück. Siehe auch {{jsxref("Array.prototype.includes()")}}.
+
{{jsxref("TypedArray.indexOf", "Int32Array.prototype.indexOf()")}}
+
Gibt den ersten Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.indexOf()")}}.
+
{{jsxref("TypedArray.join", "Int32Array.prototype.join()")}}
+
Führt alle Elemente eines Arrays zu einem String zusammen. Siehe auch {{jsxref("Array.prototype.join()")}}.
+
{{jsxref("TypedArray.keys", "Int32Array.prototype.keys()")}}
+
Gibt ein neuen Array Iterator zurück, der alle Schlüssel für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.keys()")}}.
+
{{jsxref("TypedArray.lastIndexOf", "Int32Array.prototype.lastIndexOf()")}}
+
Gibt den letzen Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.lastIndexOf()")}}.
+
{{jsxref("TypedArray.map", "Int32Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Resultaten spezifizierten Funktion, die für jedes Element aufgerufen wird. Siehe auch {{jsxref("Array.prototype.map()")}}.
+
{{jsxref("TypedArray.move", "Int32Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}
+
Ehemalige nicht Standardisierte Version von {{jsxref("TypedArray.copyWithin", "Int32Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.reduce", "Int32Array.prototype.reduce()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von links nach rechts), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reduceRight", "Int32Array.prototype.reduceRight()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von rechts nach links), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reverse", "Int32Array.prototype.reverse()")}}
+
Kehrt die Reihenfolge von jedem Element eines Arrays um — das Erste wird das Letzte und das Letzte wird das Erste. Siehe auch {{jsxref("Array.prototype.reverse()")}}.
+
{{jsxref("TypedArray.set", "Int32Array.prototype.set()")}}
+
Speichert mehrere Werte in einem getypten Array und ließt Eingabewerte aus einem spezifiziertem Array.
+
{{jsxref("TypedArray.slice", "Int32Array.prototype.slice()")}}
+
Extrahiert einen Bereich aus einem Array und gibt diesen in einem neuen Array zurück. Siehe auch {{jsxref("Array.prototype.slice()")}}.
+
{{jsxref("TypedArray.some", "Int32Array.prototype.some()")}}
+
Gibt true zurück, wenn nur ein Element in einem Array den als Funktion übergebenen Test erfüllt. Siehe auch {{jsxref("Array.prototype.some()")}}
+
{{jsxref("TypedArray.sort", "Int32Array.prototype.sort()")}}
+
Sortiert die Elemente eines Arrays in-Place und gibt das Array zurück. Siehe auch {{jsxref("Array.prototype.sort()")}}.
+
{{jsxref("TypedArray.subarray", "Int32Array.prototype.subarray()")}}
+
Gibt ein neues Int32Array vom gegebenen Start- und Endindex zurück.
+
{{jsxref("TypedArray.values", "Int32Array.prototype.values()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Werte von jedem Index im Array enthält. Siehe auch {{jsxref("Array.prototype.values()")}}.
+
{{jsxref("TypedArray.toLocaleString", "Int32Array.prototype.toLocaleString()")}}
+
Gibt einen Ortsabhängige Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toLocaleString()")}}.
+
{{jsxref("TypedArray.toString", "Int32Array.prototype.toString()")}}
+
Gibt einen Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toString()")}}.
+
{{jsxref("TypedArray.@@iterator", "Int32Array.prototype[@@iterator]()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die zugehörigen Werte für jeden Index im Array enthalten.
+
+ +

Beispiele

+ +

Verschiedene Wege, um ein Int32Array zu erstellen:

+ +
// From a length
+var int32 = new Int32Array(2);
+int32[0] = 42;
+console.log(int32[0]); // 42
+console.log(int32.length); // 2
+console.log(int32.BYTES_PER_ELEMENT); // 4
+
+// From an array
+var arr = new Int32Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Int32Array([21, 31]);
+var y = new Int32Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(16);
+var z = new Int32Array(buffer, 0, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var int32 = new Int32Array(iterable);
+// Int32Array[1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#table-49', 'TypedArray constructors')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA Standard. Spezifiziert, dass ein new benötigt wird.
{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}{{Spec2('ESDraft')}}ECMAScript 2017 ändert den Int32Array Konstruktor, um die ToIndex Operation zu benutzen und erlaubt einen Konstruktor ohne Parameter.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Int32Array")}}

+ +

Kompatibilitätshinweise

+ +

Mit Beginn von ECMAScript 2015, müssen Int32Array Konstruktoren mit einem {{jsxref("Operators/new", "new")}} benutzt werden. Der Aufruf eines Int32Array Konstruktors als eine Funktion ohne new, Führt jetzt zu einem {{jsxref("TypeError")}}.

+ +
var dv = Int32Array([1, 2, 3]);
+// TypeError: calling a builtin Int32Array constructor
+// without new is forbidden
+ +
var dv = new Int32Array([1, 2, 3]);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/int8array/index.html b/files/de/web/javascript/reference/global_objects/int8array/index.html new file mode 100644 index 0000000000..2358f38883 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/int8array/index.html @@ -0,0 +1,209 @@ +--- +title: Int8Array +slug: Web/JavaScript/Reference/Global_Objects/Int8Array +tags: + - Constructor + - Int8Array + - JavaScript + - TypedArray + - TypedArrays +translation_of: Web/JavaScript/Reference/Global_Objects/Int8Array +--- +
{{JSRef}}
+ +

Das Int8Array getypte Array repräsentiert ein Array von zweierkomplement 8 Bit vorzeichenbehafteten, ganze Zahlen in der Plattform-Byte-Reihenfolge. Die Inhalte werden mit 0 initialisiert. Wie erwartet, kann man Element in einem Array mit Objektmethoden referenzieren oder man benutzt die normale Arrayindex-Syntax (das ist die Klammernotation).

+ +

Syntax

+ +
new Int8Array(); // new in ES2017
+new Int8Array(length);
+new Int8Array(typedArray);
+new Int8Array(object);
+new Int8Array(buffer [, byteOffset [, length]]);
+ +

Für mehr Informationen über die Konstruktorensyntax und die Parameter, siehe auf der Seite TypedArray.

+ +

Eigenschaften

+ +
+
{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int8Array.BYTES_PER_ELEMENT")}}
+
Gibt die Größe der Elemente zurück. 1 im Falle eines Int8rray.
+
Int8Array.length
+
Statische Längeneigenschaft welche den Wert 0 hat. Für die aktuelle Länge (Anzahl der Elemente) siehe {{jsxref("TypedArray.prototype.length", "Int8Array.prototype.length")}}.
+
{{jsxref("TypedArray.name", "Int8Array.name")}}
+
Gibt den Stringwert des Konstruktornamens zurück. In Fall eines Int8Array Typs: "Int8Array".
+
{{jsxref("TypedArray.prototype", "Int8Array.prototype")}}
+
Prototyp für das TypedArray Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.from", "Int8Array.from()")}}
+
Erstelle ein neues Int8Array von einem Array-Ähnlichen oder Iterable Objekt. Siehe auch {{jsxref("Array.from()")}}.
+
{{jsxref("TypedArray.of", "Int8Array.of()")}}
+
Erstellt ein neues Int8Array mit einer variablen Anzahl an Argumenten. Sie auch {{jsxref("Array.of()")}}.
+
+ +

Int8Array Prototyp

+ +

 

+ +

Alle Int8Array Objekte erben von {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.

+ +

Eigenschaften

+ +
+
Int8Array.prototype.constructor
+
Gibt die Funktion, die einen Instanzprototyp erstellt zurück. Diese ist auf den Int8Array Konstruktor voreingestellt.
+
{{jsxref("TypedArray.prototype.buffer", "Int8Array.prototype.buffer")}} {{readonlyInline}}
+
Gibt die {{jsxref("ArrayBuffer")}} Referenz zurück, welche nach der Erstellung eines Int8Array fest ist und nicht mehr geändert werden kann.
+
{{jsxref("TypedArray.prototype.byteLength", "Int8Array.prototype.byteLength")}} {{readonlyInline}}
+
Gibt die Länge (in Bytes) des Int8Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.byteOffset", "Int8Array.prototype.byteOffset")}} {{readonlyInline}}
+
Gibt das Offset (in Bytes) des Int8Array vom Anfang seines {{jsxref("ArrayBuffer")}} zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
{{jsxref("TypedArray.prototype.length", "Int8Array.prototype.length")}} {{readonlyInline}}
+
Gibt Anzahl der Elemente des Int8Array zurück. WIrd beim erstellen festgesetzt und kann nicht geändert werden.
+
+ +

Methoden

+ +
+
{{jsxref("TypedArray.copyWithin", "Int8Array.prototype.copyWithin()")}}
+
Kopiert eine Sequenz von Arrayelementen in das Array. Siehe auch {{jsxref("Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.entries", "Int8Array.prototype.entries()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Schlüssel/Wertepaare für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.entries()")}}.
+
{{jsxref("TypedArray.every", "Int8Array.prototype.every()")}}
+
Teste, ob alle Elemente einem, als Funktion übergebenen, Test erfüllen. Siehe auch Array.prototype.every()")}}.
+
{{jsxref("TypedArray.fill", "Int8Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays vom Startindex bis zum Endindex mit einem statischen Wert. Siehe auch {{jsxref("Array.prototype.fill()")}}.
+
{{jsxref("TypedArray.filter", "Int8Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen des alten Arrays, für die eine übergebene Filterfunktion true zurückgibt. Siehe auch {{jsxref("Array.prototype.filter()")}}.
+
{{jsxref("TypedArray.find", "Int8Array.prototype.find()")}}
+
Gibt ein gefundenes Element des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder undefined wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.find()")}}.
+
{{jsxref("TypedArray.findIndex", "Int8Array.prototype.findIndex()")}}
+
Gibt den Index eines gefundenen Elements des Arrays zurück, welches bei der übergebenen Testfunktion true zurückgibt oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.findIndex()")}}.
+
{{jsxref("TypedArray.forEach", "Int8Array.prototype.forEach()")}}
+
Ruft für jedes Element in einem Array eine Funktion auf. Siehe auch {{jsxref("Array.prototype.forEach()")}}.
+
{{jsxref("TypedArray.includes", "Int8Array.prototype.includes()")}} {{experimental_inline}}
+
Überprüft, ob ein getyptes Array ein bestimmtes Element enthält und gibt gegebenfalls true oderfalse zurück. Siehe auch {{jsxref("Array.prototype.includes()")}}.
+
{{jsxref("TypedArray.indexOf", "Int8Array.prototype.indexOf()")}}
+
Gibt den ersten Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.indexOf()")}}.
+
{{jsxref("TypedArray.join", "Int8Array.prototype.join()")}}
+
Führt alle Elemente eines Arrays zu einem String zusammen. Siehe auch {{jsxref("Array.prototype.join()")}}.
+
{{jsxref("TypedArray.keys", "Int8Array.prototype.keys()")}}
+
Gibt ein neuen Array Iterator zurück, der alle Schlüssel für jeden Index im Array enthält. Siehe auch {{jsxref("Array.prototype.keys()")}}.
+
{{jsxref("TypedArray.lastIndexOf", "Int8Array.prototype.lastIndexOf()")}}
+
Gibt den letzen Index eines Elementes zurück, welches gleiche eines spezifizierten Wertes ist oder -1 wenn es keins gibt. Siehe auch {{jsxref("Array.prototype.lastIndexOf()")}}.
+
{{jsxref("TypedArray.map", "Int8Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Resultaten spezifizierten Funktion, die für jedes Element aufgerufen wird. Siehe auch {{jsxref("Array.prototype.map()")}}.
+
{{jsxref("TypedArray.move", "Int8Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}
+
Ehemalige nicht Standardisierte Version von {{jsxref("TypedArray.copyWithin", "Int8Array.prototype.copyWithin()")}}.
+
{{jsxref("TypedArray.reduce", "Int8Array.prototype.reduce()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von links nach rechts), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reduceRight", "Int8Array.prototype.reduceRight()")}}
+
Führt eine Funktion gegeben einen Akkumulator und jeden Wert des Array aus (von rechts nach links), um das Array auf einen Wert zu reduzieren. Siehe auch {{jsxref("Array.prototype.reduce()")}}.
+
{{jsxref("TypedArray.reverse", "Int8Array.prototype.reverse()")}}
+
Kehrt die Reihenfolge von jedem Element eines Arrays um — das Erste wird das Letzte und das Letzte wird das Erste. Siehe auch {{jsxref("Array.prototype.reverse()")}}.
+
{{jsxref("TypedArray.set", "Int8Array.prototype.set()")}}
+
Speichert mehrere Werte in einem getypten Array und ließt Eingabewerte aus einem spezifiziertem Array.
+
{{jsxref("TypedArray.slice", "Int8Array.prototype.slice()")}}
+
Extrahiert einen Bereich aus einem Array und gibt diesen in einem neuen Array zurück. Siehe auch {{jsxref("Array.prototype.slice()")}}.
+
{{jsxref("TypedArray.some", "Int8Array.prototype.some()")}}
+
Gibt true zurück, wenn nur ein Element in einem Array den als Funktion übergebenen Test erfüllt. Siehe auch {{jsxref("Array.prototype.some()")}}
+
{{jsxref("TypedArray.sort", "Int8Array.prototype.sort()")}}
+
Sortiert die Elemente eines Arrays in-Place und gibt das Array zurück. Siehe auch {{jsxref("Array.prototype.sort()")}}.
+
{{jsxref("TypedArray.subarray", "Int8Array.prototype.subarray()")}}
+
Gibt ein neues Int8Array vom gegebenen Start- und Endindex zurück.
+
{{jsxref("TypedArray.values", "Int8Array.prototype.values()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die Werte von jedem Index im Array enthält. Siehe auch {{jsxref("Array.prototype.values()")}}.
+
{{jsxref("TypedArray.toLocaleString", "Int8Array.prototype.toLocaleString()")}}
+
Gibt einen Ortsabhängige Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toLocaleString()")}}.
+
{{jsxref("TypedArray.toString", "Int8Array.prototype.toString()")}}
+
Gibt einen Stringrepräsentation des Arrays und seiner Element zurück. Siehe auch {{jsxref("Array.prototype.toString()")}}.
+
{{jsxref("TypedArray.@@iterator", "Int8Array.prototype[@@iterator]()")}}
+
Gibt ein neues Array Iterator Objekt zurück, welches die zugehörigen Werte für jeden Index im Array enthalten.
+
+ +

 

+ +

Beispiele

+ +

Verschiedene Wege, um ein Int8Array zu erstellen:

+ +
// From a length
+var int8 = new Int8Array(2);
+int8[0] = 42;
+console.log(int8[0]); // 42
+console.log(int8.length); // 2
+console.log(int8.BYTES_PER_ELEMENT); // 1
+
+// From an array
+var arr = new Int8Array([21,31]);
+console.log(arr[1]); // 31
+
+// From another TypedArray
+var x = new Int8Array([21, 31]);
+var y = new Int8Array(x);
+console.log(y[0]); // 21
+
+// From an ArrayBuffer
+var buffer = new ArrayBuffer(8);
+var z = new Int8Array(buffer, 1, 4);
+
+// From an iterable
+var iterable = function*(){ yield* [1,2,3]; }();
+var int8 = new Int8Array(iterable);
+// Int8Array[1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Ersetzt in ECMAScript 2015.
{{SpecName('ES2015', '#table-49', 'TypedArray constructors')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMA Standard. Spezifiziert, dass ein new benötigt wird.
{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}{{Spec2('ESDraft')}}ECMAScript 2017 ändert den Int8Array Konstruktor, um die ToIndex Operation zu benutzen und erlaubt einen Konstruktor ohne Parameter.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Int8Array")}}

+ +

Kompatibilitätshinweise

+ +

Mit Beginn von ECMAScript 2015, müssen Int8Array Konstruktoren mit einem {{jsxref("Operators/new", "new")}} benutzt werden. Der Aufruf eines Int8Array Konstruktors als eine Funktion ohne new, Führt jetzt zu einem {{jsxref("TypeError")}}.

+ +
var dv = Int8Array([1, 2, 3]);
+// TypeError: calling a builtin Int8Array constructor
+// without new is forbidden
+ +
var dv = new Int8Array([1, 2, 3]);
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/internalerror/index.html b/files/de/web/javascript/reference/global_objects/internalerror/index.html new file mode 100644 index 0000000000..3775c4edd9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/internalerror/index.html @@ -0,0 +1,82 @@ +--- +title: InternalError +slug: Web/JavaScript/Reference/Global_Objects/InternalError +tags: + - Error + - InternalError + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/InternalError +--- +
{{JSRef}} {{non-standard_header}}
+ +

Das InternalError Objekt zeigt einen Fehler an, der in der JavaScript-Umgebung auftritt. Zum Beispiel: "InternalError: too much recursion".

+ +

Syntax

+ +
new InternalError([message[, fileName[, lineNumber]]])
+ +

Parameter

+ +
+
message
+
Optional. Für Menschen lesbare Fehlerbeschreibung.
+
fileName {{non-standard_inline}}
+
Optional. Der Name der Datei, in der der Fehler auftritt.
+
lineNumber {{non-standard_inline}}
+
Optional. Die Zeilennummer in der Datei, in der der Fehler auftritt.
+
+ +

Beschreibung

+ +

Ein InternalError wird immer erzeugt, wenn ein Fehler in der JavaScript-Umgebung auftritt.

+ +

Beispielfälle die oft eintreten, wenn manchmal etwas zu ang ist:

+ + + +

Eigenschaften

+ +
+
{{jsxref("InternalError.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zu einem InternalError Objekt.
+
+ +

Methoden

+ +

Die globale InternalError Klasse enthält keine eigenen Methoden, jedoch erbt sie einige Methoden durch die Prototypenkette.

+ +

InternalError Instanzen

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/InternalError/prototype', 'Eigenschaften')}}
+ +

Methods

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/InternalError/prototype', 'Methoden')}}
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten.

+ +

Browserkompatibilität

+ +
+
+ + +

{{Compat("javascript.builtins.InternalError")}}

+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/internalerror/prototype/index.html b/files/de/web/javascript/reference/global_objects/internalerror/prototype/index.html new file mode 100644 index 0000000000..f76ee54ea8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/internalerror/prototype/index.html @@ -0,0 +1,61 @@ +--- +title: InternalError.prototype +slug: Web/JavaScript/Reference/Global_Objects/InternalError/prototype +tags: + - Error + - InternalError + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/InternalError +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die InternalError.prototype Eigenschaft repräsentiert den Prototypen des {{jsxref("InternalError")}} Konstruktors.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref("InternalError")}} Instanzen erben von InternalError.prototype. Man kann den Prototypen benutzt, um Eigenschaften oder Methoden für alle Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
InternalError.prototype.constructor
+
Spezifiziert die Funktion, die einen Instanzen Prototyp erstellt.
+
{{jsxref("Error.prototype.message", "InternalError.prototype.message")}}
+
Fehlermeldung. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.name", "InternalError.prototype.name")}}
+
Fehlername. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.fileName", "InternalError.prototype.fileName")}}
+
Pfad zur Datei, in der der Fehler auftritt. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.lineNumber", "InternalError.prototype.lineNumber")}}
+
Zeilennummer, in der Datei, in der der Fehler auftritt. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.columnNumber", "InternalError.prototype.columnNumber")}}
+
Spaltennummer, in der Zeile, in der der Fehler auftritt. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.stack", "InternalError.prototype.stack")}}
+
Stacktrace. Geerbt von {{jsxref("Error")}}.
+
+ +

Methoden

+ +

Obwohl das {{jsxref("InternalError")}} Prototypobjekt keine eigenen Methoden besitzt, erben {{jsxref("InternalError")}} Instanzen einige Methoden durch die Prototypenkette.

+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.InternalError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/collator/compare/index.html b/files/de/web/javascript/reference/global_objects/intl/collator/compare/index.html new file mode 100644 index 0000000000..c54c1a2869 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/collator/compare/index.html @@ -0,0 +1,101 @@ +--- +title: Intl.Collator.prototype.compare +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator/compare +tags: + - Collator + - Internationalization + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator/compare +--- +
{{JSRef}}
+ +

Die Intl.Collator.prototype.compare Eigenschaft gibt eine Funktion zurück, die zwei Strings, abhängig von der Sortierreihenfolge des {{jsxref("Collator")}} Objektes, vergleicht.

+ +
{{EmbedInteractiveExample("pages/js/intl-collator-prototype-compare.html")}}
+ + + +

Syntax

+ +
collator.compare(string1, string2)
+ +

Parameter

+ +
+
string1
+
string2
+
Die Strings, die miteinander verglichen werden sollen.
+
+ +

Beschreibung

+ +

Die Funktion, die von dem Getter compare zurückgegeben wird, gibt eine Zahl zurück, die angibt, wie string1 und string2 in der Sortierreihenfolge des {{jsxref("Collator")}} Objektes zueinander stehen: Ein negativer Wert gibt an, string1 vor string2 kommt; Ein positiver Wert gibt an, dass string1 nach string2 kommt; 0 gibt an, dass beide gleich sind.

+ +

Beispiele

+ +

Einsatz von compare zum Sortieren von Arrays

+ +

Man kann die vom Getter compare zurückgegebenen Funktion zum Sortieren von Arrays einsetzen. Zu beachten ist, dass diese Funktion an das collator-Objekte gebunden ist, auf dem es aufgerufen wurde, so dass es direkt an {{jsxref("Array.prototype.sort()")}} übergeben werden kann.

+ +
var a = ['Offenbach', 'Österreich', 'Odenwald'];
+var collator = new Intl.Collator('de-u-co-phonebk');
+a.sort(collator.compare);
+console.log(a.join(', '));
+// → "Odenwald, Österreich, Offenbach"
+
+ +

Einsatz von compare zum Suchen in Arrays

+ +

Man kann die vom Getter compare zurückgegebenen Funktion zum suchen von passenden Elementen in einem Array benutzen:

+ +
var a = ['Congrès', 'congres', 'Assemblée', 'poisson'];
+var collator = new Intl.Collator('fr', { usage: 'search', sensitivity: 'base' });
+var s = 'congres';
+var matches = a.filter(v => collator.compare(v, s) === 0);
+console.log(matches.join(', '));
+// → "Congrès, congres"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-10.3.2', 'Intl.Collator.prototype.compare')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-10.3.2', 'Intl.Collator.prototype.compare')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.Collator.prototype.compare', 'Intl.Collator.prototype.compare')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.Collator.compare")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/collator/index.html b/files/de/web/javascript/reference/global_objects/intl/collator/index.html new file mode 100644 index 0000000000..1ed4bb3f34 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/collator/index.html @@ -0,0 +1,179 @@ +--- +title: Intl.Collator +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator +tags: + - Collator + - Internationalization + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator +--- +
{{JSRef}}
+ +

Das Intl.Collator Objekt ist ein Konstruktor für Überprüfer, Objekte die Sprachsensitive Stringvergleiche unterstützen.

+ +
{{EmbedInteractiveExample("pages/js/intl-collator.html")}}
+ + + +

Syntax

+ +
new Intl.Collator([locales[, options]])
+Intl.Collator.call(this[, locales[, options]])
+ +

Parameter

+ +
+
locales
+
+

Optional. Ein String mit einem BCP 47 Sprachtag, oder einem Array von solchen Strings. Für die generelle Interpretation für das locales Argument, siehe auf der {{jsxref("Global_Objects/Intl", "Intl Seite", "#Gebietsidentifikation_und_-verhandlung", 1)}} nach. Die folgenden Unicode-Erweiterunsschlüssel sind erlaubt:

+ +
+
co
+
Abweichender Vergleich für einige Gebiete. Folgende Werte sind möglich: "big5han", "dict", "direct", "ducet", "gb2312", "phonebk", "phonetic", "pinyin", "reformed", "searchjl", "stroke", "trad", "unihan". Die Werte "standard" und "search" werden ignoriert. Sie werden durch die EIgenschaft usage des options Objekt ersetzt (siehe unten).
+
kn
+
Wenn numerische Vergleiche benutzt werden soll, so wie "1" < "2" < "10". Mögliche Werte sind "true" und "false". Diese Option kann über eine options Eigenschaft oder über einen Unicode-Erweiterungsschlüssel gesetzt werden. Wenn beide gesetzt sind, hat die options Eigenschaft Vorrang.
+
kf
+
Wenn Kleinschreibung oder Großschreibung zuerst in der Reihenfolge kommt. Mögliche Wert sind "upper", "lower", or "false" (benutzt den Gebietsstandard). Diese Option kann über eine options Eigenschaft oder über einen Unicode-Erweiterungsschlüssel gesetzt werden. Wenn beide gesetzt sind, hat die options Eigenschaft Vorrang.
+
+
+
options
+
+

Optional. Ein Objekt einigen oder allen der folgenden Eigenschafte:

+ +
+
localeMatcher
+
Der Algorithmus zur Ermittlung des Gebiets. Mögliche Werte sind "lookup" and "best fit"; Der Standard ist "best fit". Für Informationen über diese Option siehe auf der {{jsxref("Global_Objects/Intl", "Intl Seite", "#Gebietsauswahl", 1)}} nach.
+
usage
+
Ob der Vergleich für das Sortieren oder Suchen von Strings ist. Mögliche Werte sind "sort" and "search"; der Standard ist "sort".
+
sensitivity
+
+

Welche Unterschiede in Strings sollen zu Resultaten ungleich 0 führen. Mögliche Werte:

+ +
    +
  • "base": Nur Strings die im Basisbuchstaben ungleiche sind. Beispiele: a ≠ b, a = á, a = A.
  • +
  • "accent": Nur Strings die im Basisbuchstaben oder Akzent und anderen diakritisch Zeichen ungleich sind. Beispiele: a ≠ b, a ≠ á, a = A.
  • +
  • "case": Nur Strings die im Basisbuchstaben oder der Größe ungleich sind. Beispiele: a ≠ b, a = á, a ≠ A.
  • +
  • "variant": Strings, die im Basisbuchstaben, im Akzent und anderen diakritischen Zeichen oder in der Großschreibung ungleich sind. Andere Unterschiede können in den Vergleich eingehen. Beispiele: a ≠ b, a ≠ á, a ≠ A.
  • +
+ +

Der Standardwert ist "variant" wenn usage auf "sort" steht. Für usage gleich "search" ist es Gebietsabhängig.

+
+
ignorePunctuation
+
Wenn Interpunktion ignoriert werden soll. Mögliche Werte sind true and false; Der Standard ist false.
+
numeric
+
Wenn numerische Vergleiche benutzt werden soll, so wie "1" < "2" < "10". Mögliche Werte sind "true" und "false". Der Standard ist false. Diese Option kann über eine options Eigenschaft oder über einen Unicode-Erweiterungsschlüssel gesetzt werden. Wenn beide gesetzt sind, hat die options Eigenschaft Vorrang. Implementierungen müssen diese Eigenschaft nicht unterstützen.
+
caseFirst
+
Wenn Kleinschreibung oder Großschreibung zuerst in der Reihenfolge kommt. Mögliche Wert sind "upper", "lower", or "false" (benutzt den Gebietsstandard). Der Standard ist "false". Diese Option kann über eine options Eigenschaft oder über einen Unicode-Erweiterungsschlüssel gesetzt werden. Wenn beide gesetzt sind, hat die options Eigenschaft Vorrang. Implementierungen müssen diese Eigenschaft nicht unterstützen.
+
+
+
+ +

Beschreibung

+ +

Das Intl.Collator Objekt hat die folgenden Eigenschaften und Methoden:

+ +

Eigenschaften

+ +
+
{{jsxref("Collator.prototype", "Intl.Collator.prototype")}}
+
Erlaubt das hinzufügen von Eigenschaften zu allen Objekten.
+
+ +

Methoden

+ +
+
{{jsxref("Collator.supportedLocalesOf", "Intl.Collator.supportedLocalesOf()")}}
+
Gibt ein Array von Gebieten zurück, die unterstützt werden, ohne dass die Backuplösung des Umgebungsstandards eingesetzt wird.
+
+ +

Collator Instanzen

+ +

Eigenschaften

+ +

Collator Instanzen erben die folgenden Eigenschaften von ihrem Prototyp:

+ +
{{page('de/docs/Web/JavaScript/Reference/Global_Objects/Collator/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +

Collator Instanzen erben die folgenden Methoden von ihrem Prototyp:

+ +
{{page('de/docs/Web/JavaScript/Reference/Global_Objects/Collator/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Einsatz von Collator

+ +

Das folgende Beispiel demonstriert die potentiell Unterschiedlichen Ergebnisse für ein String vor, nach, oder an der selben Stelle in ein andere String in der Sortierreihenfolge:

+ +
console.log(new Intl.Collator().compare('a', 'c')); // → ein negativer Wert
+console.log(new Intl.Collator().compare('c', 'a')); // → ein positiver Wert
+console.log(new Intl.Collator().compare('a', 'a')); // → 0
+
+ +

Zu beachten ist, dass sich das im Quelltext gezeigte Ergebnis zwischen Browsern und Browserversionen unterscheiden kann. Das ist, weil die Werte implementierungsabhängig sind. Die Spezifikation definiert nur, dass die Werte vor und nach gleich negativ und positiv sein müssen.

+ +

Einsatz von locales

+ +

Das Ergebnis von {{jsxref("Collator.prototype.compare()")}} variiert zwischen Sprachen. Um die Sortierreihenfolge eine Sprache im Benutzerinterface eine Applikation zu bekommen, sollte man die Sprache mit dem locales Argument spezifizieren (und einige Backupsprachen):

+ +
// in German, ä sorts with a
+console.log(new Intl.Collator('de').compare('ä', 'z'));
+// → a negative value
+
+// in Swedish, ä sorts after z
+console.log(new Intl.Collator('sv').compare('ä', 'z'));
+// → a positive value
+
+ +

Einsatz von options

+ +

Das Ergebnis von {{jsxref("Collator.prototype.compare()")}} kann durch den Einsatz des options Argument verändert werden:

+ +
// in German, ä has a as the base letter
+console.log(new Intl.Collator('de', { sensitivity: 'base' }).compare('ä', 'a'));
+// → 0
+
+// in Swedish, ä and a are separate base letters
+console.log(new Intl.Collator('sv', { sensitivity: 'base' }).compare('ä', 'a'));
+// → a positive value
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-10.1', 'Intl.Collator')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-10.1', 'Intl.Collator')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#collator-objects', 'Intl.Collator')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.Collator")}}

+
+ +

Siehe auch

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'Siehe_auch')}}
diff --git a/files/de/web/javascript/reference/global_objects/intl/collator/prototype/index.html b/files/de/web/javascript/reference/global_objects/intl/collator/prototype/index.html new file mode 100644 index 0000000000..2528ecc7ba --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/collator/prototype/index.html @@ -0,0 +1,79 @@ +--- +title: Intl.Collator.prototype +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator/prototype +tags: + - Collator + - Internationalization + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator +--- +
{{JSRef}}
+ +

Die Intl.Collator.prototype Eigenschaft repräsentiert das Prototypobjekt für den {{jsxref("Collator", "Intl.Collator")}} Konstruktor.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Siehe im Beitrag {{jsxref("Collator")}} für eine Beschreibung von Intl.Collator Instanzen.

+ +

{{jsxref("Collator", "Intl.Collator")}} Instanzen erben von Intl.Collator.prototype. Änderungen am Prototypobjekt werden an alle {{jsxref("Collator", "Intl.Collator")}} Instanzen vererbt.

+ +

Eigenschaften

+ +
+
{{jsxref("Collator.compare", "Intl.Collator.prototype.compare")}}
+
Getter; gibt eine Funktion zurück, die zwei Strings abhängig vom der Sortierreihenfolge des {{jsxref("Global_Objects/Collator", "Intl.Collator")}} Objektes vergleicht.
+
Intl.Collator.prototype.constructor
+
Eine Referenz zu {{jsxref("Global_Objects/Collator", "Intl.Collator")}}.
+
+ +

Methoden

+ +
+
{{jsxref("Collator.resolvedOptions", "Intl.Collator.prototype.resolvedOptions()")}}
+
Gibt ein neues Objekt mit Eigenschaften zu Gebiets- und Collation-Optionen, die bei der Initialisierung des Objekte ermittelt wurden.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-10.2.1', 'Intl.Collator.prototype')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-10.2.1', 'Intl.Collator.prototype')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.Collator.prototype', 'Intl.Collator.prototype')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.Collator.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/collator/resolvedoptions/index.html b/files/de/web/javascript/reference/global_objects/intl/collator/resolvedoptions/index.html new file mode 100644 index 0000000000..322621017f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/collator/resolvedoptions/index.html @@ -0,0 +1,100 @@ +--- +title: Intl.Collator.prototype.resolvedOptions() +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator/resolvedOptions +tags: + - Collator + - Internationalization + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator/resolvedOptions +--- +
{{JSRef}}
+ +

Die Intl.Collator.prototype.resolvedOptions() Methode gibt ein neues Objekt mit Eigenschaften zurück, welches die Gebiets- und Vergleichs-Optionen während der Initialisierung des {{jsxref("Collator")}} Objektes wiederspiegelt.

+ +
{{EmbedInteractiveExample("pages/js/intl-collator-prototype-resolvedoptions.html")}}
+ + + +

Syntax

+ +
collator.resolvedOptions()
+ +

Rückgabewert

+ +

Ein neues Objekt mit Eigenschaften, die die Eigenschaften der Gebiets- und Vergleichsoptionen enthält, die während der Initialisierung des gegebenen {{jsxref("Collator")}} Objekt ermittelt wurden.

+ +

Beschreibung

+ +

Das Ergebnisobjekt hat die folgenden Eigenschaften:

+ +
+
locale
+
Der BCP 47 Sprachtag für das aktuell benutzte Gebiet. Wenn Unicode-Erweiterungswerte im BCP 47 Sprachtag in der Gebietsangabe angegeben sind, sind die, die auch unterstützt sind, in locale vorhanden.
+
usage
+
sensitivity
+
ignorePunctuation
+
Die Werte der Unterstützten Eigenschaften des options Argument oder eingesetzte Standardwerte.
+
collation
+
Der überbene Wert des Unicode-Werweiterungsschlüssels "co", wenn dieser für locale unterstützt wird oder "default".
+
numeric
+
caseFirst
+
Die Werte der Unterstützten Eigenschaften des options Argument oder der eingesetzten Unicode-Erweiterungsschlüssel "kn" and "kf" oder den Standardwerten. Wenn die Implimentierung diese Eigenschaften nicht unterstützt, werden diese weggelassen.
+
+ +

Beispiele

+ +

Einsatz der resolvedOptions Methode

+ +
var de = new Intl.Collator('de', { sensitivity: 'base' })
+var usedOptions = de.resolvedOptions();
+
+usedOptions.locale;            // "de"
+usedOptions.usage;             // "sort"
+usedOptions.sensitivity;       // "base"
+usedOptions.ignorePunctuation; // false
+usedOptions.collation;         // "default"
+usedOptions.numeric;           // false
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-10.3.3', 'Intl.Collator.prototype.resolvedOptions')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-10.3.3', 'Intl.Collator.prototype.resolvedOptions')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.Collator.prototype.resolvedOptions', 'Intl.Collator.prototype.resolvedOptions')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.Collator.resolvedOptions")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/collator/supportedlocalesof/index.html b/files/de/web/javascript/reference/global_objects/intl/collator/supportedlocalesof/index.html new file mode 100644 index 0000000000..8bc9bed6bb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/collator/supportedlocalesof/index.html @@ -0,0 +1,98 @@ +--- +title: Intl.Collator.supportedLocalesOf() +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator/supportedLocalesOf +tags: + - Collator + - Internationalization + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator/supportedLocalesOf +--- +
{{JSRef}}
+ +

Die Intl.Collator.supportedLocalesOf() Methode gibt ein Array zurück, welches die Gebiete enthält, die von Collation unterstützt werden, ohne das die Laufzeitumgebung auf den Systemstandard zurückgreifen muss.

+ +
{{EmbedInteractiveExample("pages/js/intl-collator-prototype-supportedlocalesof.html")}}
+ + + +

Syntax

+ +
Intl.Collator.supportedLocalesOf(locales[, options])
+ +

Parameter

+ +
+
locales
+
Ein String mit einem BCP 47 Sprachtag oder einem Array von solchen. Für die generelle Form des locales Argument siehe die {{jsxref("Global_Objects/Intl", "Intl Seite", "#Gebietsidentifikation_und_-verhandlung", 1)}}.
+
options
+
+

Optional. Ein Objekt welches die folgenden Eigenschaften haben kann:

+ +
+
localeMatcher
+
Der Auswahlalgorithmus für das Gebiet. Mögliche Werte sind "lookup" and "best fit"; Der Standard ist "best fit". Mehr Informationen über diese Algorithmen sind auch der {{jsxref("Global_Objects/Intl", "Intl Seite", "#Gebietsauswahl", 1)}} verfügbar.
+
+
+
+ +

Rückgabewert

+ +

Ein Array von String, welches eine Untermenge von  Gebiete enthält, die von Collation unterstützt werden, ohne das die Laufzeitumgebung auf den Systemstandard zurückgreifen muss.

+ +

Beschreibung

+ +

Gibt ein Array mit einer Untermenge von Sprachtags, die in locales angegeben sind zurück. Die Sprachtags, die zurückgegeben werden, werden von collation unterstützt und vom Auswahlalgorithmus ausgesucht, ohne auf eine Standard-Sprache zurückzugreifen.

+ +

Beispiele

+ +

Einsatz von supportedLocalesOf

+ +

Angenommen wird, dass indonesisch und deutsch in collation unterstützt wird, aber balinesisch nicht. supportedLocalesOf gibt das indonesische und deutsche Sprachtag unverändert zurück, obwohl Pinyin nicht mit Indonesisch verwendet wird und Fachdeutsch wahrscheinlich nicht für Indonesisch verfügbar ist. Zu bemerken ist, dass der "lookup" Algorithmus verwendet wird — der"best-fit" Algorithmus könnte entscheiden, dass Indonesisch eine angemessene Ergänzung für Balinesen ist, da die meisten Balinesen Indonesisch verstehen und daher auch das balinesische Sprachtag zurückgeben.

+ +
var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
+var options = { localeMatcher: 'lookup' };
+console.log(Intl.Collator.supportedLocalesOf(locales, options).join(', '));
+// → "id-u-co-pinyin, de-ID"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-10.2.2', 'Intl.Collator.supportedLocalesOf')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-10.2.2', 'Intl.Collator.supportedLocalesOf')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.Collator.supportedLocalesOf', 'Intl.Collator.supportedLocalesOf')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.Collator.supportedLocalesOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/format/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/format/index.html new file mode 100644 index 0000000000..38ebaa091f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/format/index.html @@ -0,0 +1,101 @@ +--- +title: Intl.DateTimeFormat.prototype.format +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/format +tags: + - DateTimeFormat + - Internationalization + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/format +--- +
{{JSRef}}
+ +

Die Intl.DateTimeFormat.prototype.format Eigenschaft gibt einen Getter-Funktion zurück, die einen Zeitstempel nach den Gebiets- und Formatierungsoptionen des {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekts formatiert.

+ +
{{EmbedInteractiveExample("pages/js/intl-datetimeformat-prototype-format.html")}}
+ + + +

Syntax

+ +
dateTimeFormat.format(date)
+ +

Parameter

+ +
+
date
+
Der Zeitstempel, der formatiert werden soll.
+
+ +

Beschreibung

+ +

Die Funktion, die vom format Getter zurückgegeben wird, formatiert einen Zeitpunkt (date) in einen String. Dabei werden die Gebiets- und Formatierungsoptionen des {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekts berücksichtigt.

+ +

Beispiele

+ +

Einsatz von format

+ +

Die vom format Getter zurückgegebene Funktion wird zum Formatieren von Zeitstempeln genutzt, hier für Serbien:

+ +
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+var dateTimeFormat = new Intl.DateTimeFormat('sr-RS', options);
+console.log(dateTimeFormat.format(new Date()));
+// → "недеља, 7. април 2013."
+
+ +

Einsatz von format mit map

+ +

Die vom format Getter zurückgegebene Funktion kann zum Formatieren von Zeitpunkten in einem Array genutzt werden. Zu berücksichtigen ist, dass die Funktion an das {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Objekt gebunden ist, von welche die Funktion stammt, so dass sie direkt an {{jsxref("Array.prototype.map()")}} übergeben werden kann.

+ +
var a = [new Date(2012, 08), new Date(2012, 11), new Date(2012, 03)];
+var options = { year: 'numeric', month: 'long' };
+var dateTimeFormat = new Intl.DateTimeFormat('pt-BR', options);
+var formatted = a.map(dateTimeFormat.format);
+console.log(formatted.join('; '));
+// → "setembro de 2012; dezembro de 2012; abril de 2012"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-12.3.2', 'Intl.DateTimeFormat.format')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-12.3.2', 'Intl.DateTimeFormat.format')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype.format', 'Intl.DateTimeFormat.format')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat.format")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/formattoparts/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/formattoparts/index.html new file mode 100644 index 0000000000..07919d3fcf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/formattoparts/index.html @@ -0,0 +1,169 @@ +--- +title: Intl.DateTimeFormat.prototype.formatToParts() +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/formatToParts +tags: + - DateTimeFormat + - Internationalization + - Intl + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/formatToParts +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die Intl.DateTimeFormat.prototype.formatToParts() Methode erlaubt gebietssichere Formatierung von Strings, die von DateTimeFormat Formatierungen erzeugt werden.

+ +

Syntax

+ +
Intl.DateTimeFormat.prototype.formatToParts(date)
+ +

Parameter

+ +
+
date {{optional_inline}}
+
Der Zeitstempel, der formatiert werden soll.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Array")}} von Objekten, die das Formatierte Datum in Teilen wiederspielgeln.

+ +

Beschreibung

+ +

Die formatToParts() Methode ist nützlich für benutzerdefinierte Formatierung von Zeitpunktsstrings. Sie gibt ein {{jsxref ("Array")}} von Objekten zurück, die die länderspezifischen Token enthalten, aus denen benutzerdefinierte Zeichenfolgen erstellt werden können, während die länderspezifischen Teile beibehalten werden. Die Struktur, die die formatToParts()  Methode zurückgibt, sieht so aus:

+ +
[
+  { type: 'day', value: '17' },
+  { type: 'weekday', value: 'Monday' }
+]
+ +

Mögliche Typen sind die folgenden:

+ +
+
day
+
Der String, der für den Tag benutzt wird. Zum Beispiel "17".
+
dayPeriod
+
Der String, der für die Tagesperiode benutzt wird. Zum Beispiel "AM" oder "PM".
+
era
+
Der String, der für die Ära benutzt wird. Zum Beispiel "BC" oder "AD".
+
hour
+
Der String, der für die Stunde benutzt wird. Zum Beispiel "3" oder "03".
+
literal
+
Der String, der als Trennung für das Datum und die Zeitbenutzt benutzt wird. Zum Beispiel "/", ",", "o'clock", "de", etc.
+
minute
+
Der String, der für die Minute benutzt wird. Zum Beispiel "00".
+
month
+
Der String, der für den Monat benutzt wird. Zum Beispiel "12".
+
second
+
Der String, der für die Sekunde benutzt wird. Zum Beispiel "07" oder "42".
+
timeZoneName
+
Der String, der für den Zeitzonennamen benutzt wird. Zum Beispiel "UTC".
+
weekday
+
Der String, der für den Wochentag benutzt wird. Zum Beispiel "M", "Monday" oder "Montag".
+
year
+
Der String, der für das Jahr benutzt wird. Zum Beispiel "2012" oder "96".
+
+ +

Beispiele

+ +

DateTimeFormat gibt lokalisierte Strings aus, die nicht direkt verändert werden können:

+ +
var date = Date.UTC(2012, 11, 17, 3, 0, 42);
+
+var formatter = new Intl.DateTimeFormat('en-us', {
+  weekday: 'long',
+  year: 'numeric',
+  month: 'numeric',
+  day: 'numeric',
+  hour: 'numeric',
+  minute: 'numeric',
+  second: 'numeric',
+  hour12: true,
+  timeZone: 'UTC'
+});
+
+formatter.format(date);
+// "Monday, 12/17/2012, 3:00:42 AM"
+
+ +

Oftmals ist es in vielen Benutzeroberflächen erwünscht die Formatierung dieser Strings zu verändern. Die formatToParts Methode erlaubt lokalsicheres Formatieren von Strings, die von DateTimeFormat in Teilstrings unterstützt werden:

+ +
formatter.formatToParts(date);
+
+// return value:
+[
+  { type: 'weekday',   value: 'Monday' },
+  { type: 'literal',   value: ', '     },
+  { type: 'month',     value: '12'     },
+  { type: 'literal',   value: '/'      },
+  { type: 'day',       value: '17'     },
+  { type: 'literal',   value: '/'      },
+  { type: 'year',      value: '2012'   },
+  { type: 'literal',   value: ', '     },
+  { type: 'hour',      value: '3'      },
+  { type: 'literal',   value: ':'      },
+  { type: 'minute',    value: '00'     },
+  { type: 'literal',   value: ':'      },
+  { type: 'second',    value: '42'     },
+  { type: 'literal',   value: ' '      },
+  { type: 'dayPeriod', value: 'AM'     }
+]
+
+ +

Jetzt sind die Informationen separiert vorhanden und  man kann Formatierungen und Konkatinationen benutzerdefiniert vornehmen. Zum Beispiel unter Einsatz von {{jsxref("Array.prototype.map()")}}, Arrow Funktionen, einem switch Statement, Templateliteralen und {{jsxref("Array.prototype.reduce()")}}.

+ +
var dateString = formatter.formatToParts(date).map(({type, value}) => {
+  switch (type) {
+    case 'dayPeriod': return `<b>${value}</b>`;
+    default : return value;
+  }
+}).reduce((string, part) => string + part);
+
+ +

Diese Beispiel macht die Tagesperiode fett, wenn die formatToParts() Methode benutzt wird.

+ +
console.log(formatter.format(date));
+// "Monday, 12/17/2012, 3:00:42 AM"
+
+console.log(dateString);
+// "Monday, 12/17/2012, 3:00:42 <b>AM</b>"
+ +

Polyfill

+ +

Ein Polyfill für die Funktionalität ist im proposal repository verfügbar.

+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype.formatToParts', 'Intl.DateTimeFormat.prototype.formatToParts')}}{{Spec2('ES Int Draft')}}Initiale Definition
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat.formatToParts")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/index.html new file mode 100644 index 0000000000..94cfe2d3c7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/index.html @@ -0,0 +1,248 @@ +--- +title: Intl.DateTimeFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +tags: + - DateTimeFormat + - Internationalization + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +--- +
{{JSRef}}
+ +

Das Intl.DateTimeFormat Objekt ist ein Konstruktor für Objekte, die sprachsensitive Formatierung von Datums- und Zeitangaben ermöglicht.

+ +
{{EmbedInteractiveExample("pages/js/intl-datetimeformat.html")}}
+ + + +

Syntax

+ +
new Intl.DateTimeFormat([locales[, options]])
+Intl.DateTimeFormat.call(this[, locales[, options]])
+ +

Parameter

+ +
+
locales
+
Optional. Ein String mit einem BCP 47 Sprachcode, oder einem Array von Sprachcodes. Für die generelle Form und Interpretation des locales Arguments siehe auf der {{jsxref("Global_Objects/Intl", "Intl Seite", "#Locale_identification_and_negotiation", 1)}}. Die folgenden  Unicode Erweiterungen sind erlaubt:
+
+
+
nu
+
Zahlensysteme. Mögliche Werte sind: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".
+
ca
+
Kalender. Mögliche Werte sind: "buddhist", "chinese", "coptic", "ethioaa", "ethiopic", "gregory", "hebrew", "indian", "islamic", "islamicc", "iso8601", "japanese", "persian", "roc".
+
hc
+
Stundenzyklus. Mögliche Werte sind: "h11", "h12", "h23", "h24".
+
+
+
options
+
+

Optional. Ein Objekt mit einigen oder allen folgenden Eigenschaften:

+ +
+
localeMatcher
+
Der Sprachfindungsalgorithmus, der eingesetzt wird. Mögliche Werte sind "lookup" und "best fit". Als Standard ist "best fit" vorgegeben. Für Informationen über diese Option siehe auf der {{jsxref("Global_Objects/Intl", "Intl Seite", "#Locale_negotiation", 1)}} nach.
+
timeZone
+
Die eingesetzte Zeitzone. Der einzige Wert, den alle Implementierungen verstehen ist "UTC". Der Standardwert ist die Standard-Laufzeitzeitzone. Manche Implementierungen erkennen auch die Namen der IANA Zeitzonendatenbank, wie zum Beispiel "Asia/Shanghai", "Asia/Kolkata" und "America/New_York".
+
hour12
+
Wird eingesetzt, wenn 12-Stunden Zeitangaben eingesetzt werden (im gegensatz zu 24-Stunden Zeitangaben). Mögliche Werte sind true und false. Diese Option überschreibt den  hc Sprachen-Tag und/oder hourCycle wenn beide vorhanden sind.
+
hourCycle
+
Der eingesetzte Stundenzyklus. Mögliche Werte sind "h11", "h12", "h23" oder "h24". Diese Option überschreibt den  hc Sprachen-Tag, wenn beide präsent sind und die hour12 Option hat Vorrang, wenn beide Optionen spezifiziert sind.
+
formatMatcher
+
Der eingesetzte Formaterkennungsalgorithmus. Mögliche Werte sind "basic" und "best fit". Der Standard ist "best fit". Siehe folgenden Absatz, um den Einsatz dieses Parameters zu verstehen.
+
+ +

Die folgenden Eigenschaften beschreiben die Datums-Zeit-Komponenten, die für die formatierten Ausgabe eingesetzt werden und deren Repräsentation. Implementierungen müssen folgende Kombinationen der Eigenschaften unterstützen:

+ +
    +
  • Wochentag, Jahr, Monat, Tag, Stunde, Minute, Sekunde
  • +
  • Wochentag, Jahr, Monat, Tag
  • +
  • Jahr, Monat, Tag
  • +
  • Jahr, Monat
  • +
  • Monat, Tag
  • +
  • Stunde, Minute, Sekunde
  • +
  • Stunde, Minute
  • +
+ +

Manche Implementierungen unterstützen weitere Kombinationen der Parameter. Es wird immer auf alle möglichen Kombinationen geprüft, um den besten Treffer zu landen. Zwei Algorithmen sind für die Auswahl der Kombination vorhanden: Ein voll spezifizierter "basic" Algorithmus und ein implementierungsabhängiger "best fit" Algorithmus.

+ +
+
weekday
+
Die Repräsentation der Wochentage. Mögliche Werte sind "narrow", "short" und "long".
+
era
+
Die Repräsentation der Epoche. Mögliche Werte sind "narrow", "short" und "long".
+
year
+
Die Repräsentation des Jahres. Mögliche Werte sind "numeric" und "2-digit".
+
month
+
Die Repräsentation des Monats. Mögliche Werte sind "numeric", "2-digit", "narrow", "short" und "long".
+
day
+
Die Repräsentation des Tages. Mögliche Werte sind "numeric" und "2-digit".
+
hour
+
Die Repräsentation der Stunden. Mögliche Werte sind "numeric" und "2-digit".
+
minute
+
Die Repräsentation der Minuten. Mögliche Werte sind "numeric" und "2-digit".
+
second
+
Die Repräsentation der Sekunden. Mögliche Werte sind "numeric" und "2-digit".
+
timeZoneName
+
Die Repräsentation des Zeitzonennamens. Mögliche Werte sind "short" und "long".
+
+ +

Die Standardwerte für jede Datums-Zeit-Komponente ist {{jsxref("undefined")}}, wenn jedoch alle Komponenten {{jsxref("undefined")}} sind, wird year, month, and day als "numeric" angenommen.

+
+
+ +

Beschreibung

+ +

Eigenschaften

+ +
+
{{jsxref("DateTimeFormat.prototype", "Intl.DateTimeFormat.prototype")}}
+
Ermögliche es Eigenschaften und Methoden für alle Objekte zu definieren.
+
+ +

Methoden

+ +
+
{{jsxref("DateTimeFormat.supportedLocalesOf", "Intl.DateTimeFormat.supportedLocalesOf()")}}
+
Gibt ein Array an Sprachen zurück, die unterstützt werden, ohne dass auf den Laufzeitumgebungsstandard zurückgegriffen wird.
+
+ +

DateTimeFormat Instanzen

+ +

Eigenschaften

+ +

DateTimeFormat Instanzen erben die folgenden Eigenschaften von ihrem Prototypen:

+ +
{{page("/de/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype", "Eigenschaften")}}
+ +

Methoden

+ +

DateTimeFormat Instanzen erben die folgenden Methoden von ihrem Prototypen:

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Einsatz von DateTimeFormat

+ +

Der Basiseinsatz ohne extra Sprach- und Formatierungsoptionen, sondern den Standardeinstellungen.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// toLocaleString ohne Argumente ist von der implementierunge,
+// der Standardsprache und der Standardzeitzone abhängig.
+console.log(new Intl.DateTimeFormat().format(date));
+// → "12/19/2012" wenn das Gebiet en-US mit der Zeitzone America/Los_Angeles (UTC-0800) der Standard ist.
+
+ +

Einsatz von locales

+ +

Das folgende Beispiel zeigt verschiedene Formatierungsoptionen von Datums- und Zeitformaten. Um sicherzustellen, dass das Format der Sprache eingesetzt wird, die in der Benutzerschnittstelle benutzt wird, muss diese (und mögliche Rückfallsprachen) mit dem locales Argument eingestellt werden.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Die folgenden Formate setzen die Zeitzone America/Los_Angeles
+// für die Sprache US voraus.
+
+// US englisch: Monat-Tag-Jahr
+console.log(new Intl.DateTimeFormat('en-US').format(date));
+// → "12/19/2012"
+
+// Britisch englisch: Tag-Monat-Jahr
+console.log(new Intl.DateTimeFormat('en-GB').format(date));
+// → "20/12/2012"
+
+// Koreanisch: Jahr-Monat-Tag
+console.log(new Intl.DateTimeFormat('ko-KR').format(date));
+// → "2012. 12. 20."
+
+// Arabisch: In den meisten arabischen Ländern werden arabische Ziffern genutzt
+console.log(new Intl.DateTimeFormat('ar-EG').format(date));
+// → "٢٠‏/١٢‏/٢٠١٢"
+
+// Japanisch: In Japan wird der japanische Kalender eingesetzt:
+// 2012 ist in diesem das Jahr 24 der Heisei Ära.
+console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date));
+// → "24/12/20"
+
+// Einsatz von Sprachen, die vielleicht nicht unterstützt werden:
+// Balinesisch, und Indonesisch als Rückfallsprache.
+console.log(new Intl.DateTimeFormat(['ban', 'id']).format(date));
+// → "20/12/2012"
+
+ +

Einsatz von options

+ +

Das Datums- und Zeitformat kann mit dem Einsatz des options Arguments vom Benutzer definiert werden.

+ +
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Langer Wochentag mit langem Datum
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(new Intl.DateTimeFormat('de-DE', options).format(date));
+// → "Donnerstag, 20. Dezember 2012"
+
+// sichtbares UTC
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(new Intl.DateTimeFormat('en-US', options).format(date));
+// → "Thursday, December 20, 2012, GMT"
+
+// Präzisere Angaben der Zeit
+options = {
+  hour: 'numeric', minute: 'numeric', second: 'numeric',
+  timeZone: 'Australia/Sydney',
+  timeZoneName: 'short'
+};
+console.log(new Intl.DateTimeFormat('en-AU', options).format(date));
+// → "2:00:00 pm AEDT"
+
+// 24-Stunden Angabe in US Zeiten
+options = {
+  year: 'numeric', month: 'numeric', day: 'numeric',
+  hour: 'numeric', minute: 'numeric', second: 'numeric',
+  hour12: false,
+  timeZone: 'America/Los_Angeles'
+};
+console.log(new Intl.DateTimeFormat('en-US', options).format(date));
+// → "12/19/2012, 19:00:00"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-12.1', 'Intl.DateTimeFormat')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-12.1', 'Intl.DateTimeFormat')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#datetimeformat-objects', 'Intl.DateTimeFormat')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat")}}

+
+ +

Siehe auch

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}
diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html new file mode 100644 index 0000000000..98f5e8f57b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html @@ -0,0 +1,83 @@ +--- +title: Intl.DateTimeFormat.prototype +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/prototype +tags: + - DateTimeFormat + - Internationalization + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +--- +
{{JSRef}}
+ +
Die Intl.DateTimeFormat.prototype Eigenschaft ist ein Prototyp Objekt für den {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Konstruktor.
+ +
 
+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Für eine Beschreibung von Intl.DateTimeFormat Instanzen siehe im Artikel {{jsxref("DateTimeFormat")}} nach.

+ +

{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} Instanzen erben von Intl.DateTimeFormat.prototype. Änderungen in der Eigenschaft prototype wirken sich auf alle Instanzen von {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} aus.

+ +

Eigenschaften

+ +
+
Intl.DateTimeFormat.prototype.constructor
+
Eine Referenz zu {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}.
+
{{jsxref("DateTimeFormat.format", "Intl.DateTimeFormat.prototype.format")}}
+
Getter, der eine Funktion, die für das Formatieren von Datums- und Zeitangaben nach den Optionen des {{jsxref("DateTimeFormat", "DateTimeFormat")}} ermöglicht, wird zurückgegeben.
+
+ +

Methoden

+ +
+
{{jsxref("DateTimeFormat.formatToParts", "Intl.DateTimeFormat.prototype.formatToParts()")}}
+
Gibt ein {{jsxref("Array")}} von Objekten zurück, die den formatierten String in Teilen repräsentiert. Das kann eingesetzt werden, um ein benutzerdefiniertes Format zu erstellen.
+
{{jsxref("DateTimeFormat.resolvedOptions", "Intl.DateTimeFormat.prototype.resolvedOptions()")}}
+
Gibt ein neues Objekt mit den Eigenschaften der Sprache und des Formates zum Erstellungszeitpunkt des Objektes zurück.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype', 'Intl.DateTimeFormat.prototype')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/resolvedoptions/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/resolvedoptions/index.html new file mode 100644 index 0000000000..a1403f9a7b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/resolvedoptions/index.html @@ -0,0 +1,107 @@ +--- +title: Intl.DateTimeFormat.prototype.resolvedOptions() +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/resolvedOptions +tags: + - DateTimeFormat + - Internationalization + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/resolvedOptions +--- +
{{JSRef}}
+ +

Die Intl.DateTimeFormat.prototype.resolvedOptions() Methode gibt ein Objekt mit den Eigenschaften zum Gebiet und der Datums- und Zeitformatierung zurück, die beim der Initialisierung eines {{jsxref("DateTimeFormat", "DateTimeFormat")}} Objektes berechnet werden.

+ +
{{EmbedInteractiveExample("pages/js/intl-datetimeformat-prototype-resolvedoptions.html")}}
+ + + +

Syntax

+ +
dateTimeFormat.resolvedOptions()
+ +

Rückgabewert

+ +

Ein neues Objekt mit den Eigenschaften zum Gebiet und der Datums- und Zeitformatierung, die beim der Initialisierung eines {{jsxref("DateTimeFormat", "DateTimeFormat")}} Objektes berechnet werden.

+ +

Beschreibung

+ +

Das resultierende Objekt hat die folgenden Eigenschaften:

+ +
+
locale
+
Der BCP 47 Sprach-Tag für die genutzte Sprache. Wenn Unicode-Erweiterungen im BCP 47 Sprach-Tag enthalten waren, die für die Sprache unterstützt werden, sind die Unterstützen Schlüssel-Werte-Paare in locale enthalten.
+
calendar
+
numberingSystem
+
Dieser Wert wird durch die Unicode-Erweiterungsschlüssel "ca" und "nu" oder mit einem Standardwert gefüllt.
+
timeZone
+
Die Wert für die Unterstützen Eigenschaft im options Argument; {{jsxref("undefined")}} (entspricht der Standard-Zeitzone der Laufzeitumgebung), wenn keine verwendet wird. Warnung: Anwendungen sollten nicht auf den Rückgabewert {{jsxref("undefined")}} programmiert sein, weil es in zukünftigen Versionen sein kann, dass ein {{jsxref("String")}} zurückgegeben wird, der die Standard-Zeitzone der Laufzeitumgebung identifiziert.
+
hour12
+
Der Wert der verwendeten Eigenschaft im options Argument oder ein Standard-Wert.
+
weekday
+
era
+
year
+
month
+
day
+
hour
+
minute
+
second
+
timeZoneName
+
Die Werte resultieren von den Eigenschaften in dem options Argument und den möglichen Kombinationen und Repräsentationen der Datums- und Zeitformatierung aus der ausgewählte Sprache. Einige der Eigenschaften können auch fehlen, was bedeutet, dass die Komponenten nicht in der formatierten Ausgabe enthalten sind.
+
+ +

Beispiele

+ +

Einsatz der resolvedOptions Methode

+ +
var germanFakeRegion = new Intl.DateTimeFormat('de-XX', { timeZone: 'UTC' });
+var usedOptions = germanFakeRegion.resolvedOptions();
+
+usedOptions.locale;          // "de"
+usedOptions.calendar;        // "gregory"
+usedOptions.numberingSystem; // "latn"
+usedOptions.timeZone;        // "UTC"
+usedOptions.month;           // "numeric"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-12.3.3', 'Intl.DateTimeFormat.prototype.resolvedOptions')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-Intl.DateTimeFormat.prototype.resolvedOptions', 'Intl.DateTimeFormat.prototype.resolvedOptions')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype.resolvedOptions', 'Intl.DateTimeFormat.prototype.resolvedOptions')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat.resolvedOptions")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/datetimeformat/supportedlocalesof/index.html b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/supportedlocalesof/index.html new file mode 100644 index 0000000000..722b372745 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/datetimeformat/supportedlocalesof/index.html @@ -0,0 +1,99 @@ +--- +title: Intl.DateTimeFormat.supportedLocalesOf() +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/supportedLocalesOf +tags: + - DateTimeFormat + - Internationalization + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/supportedLocalesOf +--- +
{{JSRef}}
+ +

Die Intl.DateTimeFormat.supportedLocalesOf() Methode gibt ein Array zurück, welches die Gebiete enthält, die die Datums- und Zeitformatierung unterstützen, ohne das auf das Laufzeitstandardgebeit zurückgegriffen werden muss.

+ +
{{EmbedInteractiveExample("pages/js/intl-datetimeformat-prototype-supportedlocalesof.html")}}
+ + + +

Syntax

+ +
Intl.DateTimeFormat.supportedLocalesOf(locales[, options])
+ +

Parameter

+ +
+
locales
+
Ein String mit einem BCP 47 Sprachtag, oder ein Array von solchen Strings. Für die generelle Form des locales Arguments siehe die {{jsxref("Intl", "Intl Seite", "#Gebietsidentifikation_und_-verhandlung", 1)}}.
+
options
+
+

Optional. Ein Objekt, welches die folgende Eigenschaft haben kann:

+ +
+
localeMatcher
+
Der Auswahlalgorithmus des Gebietes. Mögliche Werte sind "lookup" und "best fit"; der Standard ist "best fit". Für mehr Information über diese Option siehe auf der {{jsxref("Intl", "Intl Seite", "#Gebietsauswahl", 1)}}.
+
+
+
+ +

Rückgabewert

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete enthält, für die die Datums- und Zeitformatierung unterstützen wird, ohne das auf das Laufzeitstandardgebeit zurückgegriffen werden muss.

+ +

Beschreibung

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete (locales) enthält. Die Sprachtags, die zurückgegeben werden, unterstützen Datums- und Zeitformatierungen für das entsprechende Gebiet, ohne auf den Systemstandard zurückgreifen zu müssen.

+ +

Beispiele

+ +

Einsatz von supportedLocalesOf

+ +

Angenommen wird, dass indonesische und deutsche Datums- und Zeitformatierung unterstützt wird, aber balinesisch nicht. supportedLocalesOf gibt das indonesische und deutsche Sprachtag unverändert zurück, obwohl Pinyin nicht mit Indonesisch verwendet wird und Fachdeutsch wahrscheinlich nicht für Indonesisch verfügbar ist. Zu bemerken ist, dass der "lookup" Algorithmus verwendet wird — der"best-fit" Algorithmus könnte entscheiden, dass Indonesisch eine angemessene Ergänzung für Balinesen ist, da die meisten Balinesen Indonesisch verstehen und daher auch das balinesische Sprachtag zurückgeben.

+ +
var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
+var options = { localeMatcher: 'lookup' };
+console.log(Intl.DateTimeFormat.supportedLocalesOf(locales, options).join(', '));
+// → "id-u-co-pinyin, de-ID"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-12.2.2', 'Intl.DateTimeFormat.supportedLocalesOf')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-12.2.2', 'Intl.DateTimeFormat.supportedLocalesOf')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.supportedLocalesOf', 'Intl.DateTimeFormat.supportedLocalesOf')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.DateTimeFormat.supportedLocalesOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html b/files/de/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html new file mode 100644 index 0000000000..0913ad7a6e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html @@ -0,0 +1,74 @@ +--- +title: Intl.getCanonicalLocales() +slug: Web/JavaScript/Reference/Global_Objects/Intl/getCanonicalLocales +tags: + - Internationalization + - Intl + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/getCanonicalLocales +--- +
{{JSRef}}
+ +

Die Intl.getCanonicalLocales() Methode gibt ein Array mit den anerkannten Gebietsnamen zurück. Duplikate werden verhindert und Elemente werden auf valide Sprach-Tag-Struktur geprüft.

+ +
{{EmbedInteractiveExample("pages/js/intl-getcanonicallocales.html")}}
+ + + +

Syntax

+ +
Intl.getCanonicalLocales(locales)
+ +

Parameter

+ +
+
locales
+
Eine List von {{jsxref("String")}} Werten, von welchen die anerkannten Gebietsnamen gesucht werden.
+
+ +

Rückgabewert

+ +

Ein Array mit den anerkannten Gebietsnamen.

+ +

Beispiele

+ +
Intl.getCanonicalLocales('EN-US'); // ["en-US"]
+Intl.getCanonicalLocales(['EN-US', 'Fr']); // ["en-US", "fr"]
+
+Intl.getCanonicalLocales('EN_US');
+// RangeError:'EN_US' is not a structurally valid language tag
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int Draft', '#sec-intl.getcanonicallocales', 'Intl.getCanonicalLocales')}}{{Spec2('ES Int Draft')}}Initiale Definition
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.getCanonicalLocales")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/index.html b/files/de/web/javascript/reference/global_objects/intl/index.html new file mode 100644 index 0000000000..50567a9913 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/index.html @@ -0,0 +1,129 @@ +--- +title: Intl +slug: Web/JavaScript/Reference/Global_Objects/Intl +tags: + - Internationalization + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Intl +--- +
{{JSRef}}
+ +

Das Intl Objekt ist der Namensraum für die ECMAScript Internationalisierungs API, welche sprachenabhängige Stringvergleiche, Zahlenformate und Datums bzw. Zeitformate unterstützt. Der Konstruktoren für {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} und {{jsxref("DateTimeFormat")}} Objekte sind Eigenschaften des Intl Objektes. Diese Seite dokumentiert diese Eigenschaften sowie die Funktionalität, die in Internationalisierungskonstruktoren und anderen sprachsensitiven Funktionen gemeinsam sind.

+ +

Eigenschaften

+ +
+
{{jsxref("Global_Objects/Collator", "Intl.Collator")}}
+
Konstruktor für Collatoren, Objekte mit sprachsensitiven Stringvergleichen.
+
{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}
+
Konstruktor für Objekte, die Daten und Zeiten sprachsensitiv formatieren.
+
{{jsxref("Global_Objects/NumberFormat", "Intl.NumberFormat")}}
+
Konstruktor für Objekte, die Zahlen sprachsensitiv formatieren.
+
{{jsxref("Global_Objects/PluralRules", "Intl.PluralRules")}}
+
Konstruktor für Objekte, die mit Pluralsprachregeln pluralsensitiv formatieren kann.
+
+ +

Methoden

+ +
+
{{jsxref("Intl.getCanonicalLocales()")}}
+
Eine Methode, die den kanonischen Gebietsnamen zurückgibt.
+
+ +

Gebietsidentifikation und -verhandlung

+ +

Die Internationalisierungskonstruktoren genauso wie viele sprachsensitive Methoden von anderen Konstruktoren (aufgelistet unter {{anch("Siehe auch", "Siehe auch")}}) benutzten übliche Muster für die Identifizierung von Gebieten und der Feststellung des aktuellen Gebietes: Alle diese akzeptieren locales und options Parameter und verhandeln ein Gebiet aus den gesendeten Gebieten und den Lokal unterstützen Gebieten mithilfe eines Speziellen Algorithmus in der Eigenschaft options.localeMatcher aus.

+ +

locales Argument

+ +

Das locales Argument muss entweder ein String sein, der einen BCP 47 Sprachcode enthält, oder ein Array mit solche Sprachcodes. Wenn dieses Argument nicht unterstützt ist oder undefined ist, wird das lokale Standardgebiet benutzt.

+ +

Ein BCP 47-Sprachcode definiert eine Sprache und enthält minimal einen primären Sprachcode. In seiner gebräuchlichsten Form kann er folgender Reihenfolge enthalten: einen Sprachcode, einen Skriptcode und einen Länder- oder Regionscode, alle getrennt durch Bindestriche. Weil diese Codes unabhängig von Groß- und Kleinschreibung ist, ist es empfohlen bei Skriptcodes den ersten Buchstaben groß zuschreiben, bei Länder- und Regionscodes soll alles groß geschrieben werden und der Rest soll klein geschreiben werden.

+ +

Beispiele:

+ + + +

Die Subcodes zum identifizieren von Sprachen, Skripten, Ländern (Regionen) und (selten genutzen) Varianten in BCP 47 Sprachcodes können im IANA Sprach Subtag Register gefunden werden.

+ +

BCP 47 erlaubt sogar Erweiterungen. JavaScript Internationalisierungsfunktionen benutzen die "u" (Unicode) Erweiterung, welche es ermöglicht benutzerdefinierte Änderungen in {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} oder {{jsxref("DateTimeFormat")}} einzubringen. Beispiele:

+ + + +

Gebietsauswahl

+ +

Das locales Argument wird als priorisierte Angabe für die Applikation interpretiert, nach dem alle Unicode-Erweiterungen durchführt wurden. Zur Laufzeut wird gegeben verfügbare Gebiete verglichen und das am besten passende genommen. Es existieren zwei Algorithmen für die Auswahl: die "lookup" Auswahl, die dem im BCP 47 spezifizierten Algorithmus folgt; die "best fit" Auswahl, bei dem die Laufzeigumgebung mindestens einen gleichgutes Ergebnis wie der Lookup Algorithmus erzielt, wenn nicht sogar einen besseren. Wenn die Applikation kein locales Argument unterstützt oder die Laufzeit kein Gebiet hat, welches passt, dann wird das Standardgebiet der Laufzeitumgebung werdendet. Das Algorithmus zur Auswahl kann über das options Argument ausgewählt werden (siehe unten).

+ +

Wenn der ausgewählte Sprache-Tag eine Unicode Erweiterung hat, wird diese genutzt, um das erstellte Objekte oder das Verhalten der Funktion anzupassen. Jeder Konstruktor oder jede Funktion unterstützt nur eine Untermenge der als Unicode Erweiterungen definierten Schlüssel und die unterstützen Werte sind meistens von Sprach-Tag abhängig. Zum Beispiel ist der "co" Schlüssel (collation) nur in {{jsxref("Collator")}} unterstützt und der "phonebk" Wert ist nur im Deutschen unterstützt.

+ +

options Argument

+ +

Das options Argument muss ein Objekt mit Eigenschaften sein, welche vom Konstruktor und der Funktion abhängen. Wenn das options Argument nicht unterstützt wird oder undefined ist, werden Standardwerte für alle Eigenschaften benutzt.

+ +

Eine Eigenschaft ist in allen sprachensensitiven Konstruktoren und Funktionen forhanden: Die localeMatcher Eigenschaft, die vom Datentyp String ist und den Wert "lookup" oder "best fit" hat, welche den Algorithmus für die Auswahl des Gebietes beschreiben (siehe oben).

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-8', 'Intl')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-8', 'Intl')}}{{Spec2('ES Int 2.0')}}
{{SpecName('ES Int Draft', '#intl-object', 'Intl')}}{{Spec2('ES Int Draft')}}Intl.getCanonicalLocales in the 4. Auflage hinzugefügt.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/numberformat/format/index.html b/files/de/web/javascript/reference/global_objects/intl/numberformat/format/index.html new file mode 100644 index 0000000000..4d42272e9c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/numberformat/format/index.html @@ -0,0 +1,98 @@ +--- +title: Intl.NumberFormat.prototype.format +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format +tags: + - Internationalization + - JavaScript + - NumberFormat + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format +--- +
{{JSRef}}
+ +

Die Intl.NumberFormat.prototype.format Eigenschaft gibt eine Getterfunktion zurück, die eine Zahl nach den Sprach- und Formatierungsoptionen dieses {{jsxref("NumberFormat")}} Objektes formatiert.

+ +
{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-format.html")}}
+ + + +

Syntax

+ +
numberFormat.format(number)
+ +

Parameter

+ +
+
number
+
Zahl, die formatiert werden soll.
+
+ +

Beschreibung

+ +

Die Funktion, die von format Getter zurückgegeben wird, formatiert eine Zahl in einen String nach den angegebenen Sprach- und Formatierungsoptionen des {{jsxref("NumberFormat")}} Objektes.

+ +

Beispiele

+ +

Einsatz von format

+ +

Einsatz der vom format Getter zurückgegebenen Funktion zum Formatieren eines Währungswertes, hier für Russland:

+ +
var options = { style: 'currency', currency: 'RUB' };
+var numberFormat = new Intl.NumberFormat('ru-RU', options);
+console.log(numberFormat.format(654321.987));
+// → "654 321,99 руб."
+
+ +

Einsatz format mit map

+ +

Einsatz der vom format Getter zurückgegebenen Funktion zum Formatieren von allen Zahlen in einem Array. Zu bemerken ist, dass die Funktion an das {{jsxref("NumberFormat")}} Objekt gebunden ist, von dem sie stammt, so dass es direkt in {{jsxref("Array.prototype.map")}} verwendet werden kann.

+ +
var a = [123456.789, 987654.321, 456789.123];
+var numberFormat = new Intl.NumberFormat('es-ES');
+var formatted = a.map(numberFormat.format);
+console.log(formatted.join('; '));
+// → "123.456,789; 987.654,321; 456.789,123"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES Int 1.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.NumberFormat.prototype.format', 'Intl.NumberFormat.prototype.format')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.NumberFormat.format")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/numberformat/index.html b/files/de/web/javascript/reference/global_objects/intl/numberformat/index.html new file mode 100644 index 0000000000..b2881e081d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/numberformat/index.html @@ -0,0 +1,195 @@ +--- +title: Intl.NumberFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat +tags: + - Internationalization + - JavaScript + - NumberFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat +--- +
{{JSRef}}
+ +

Das Intl.NumberFormat Objekt ist ein Konstruktor für Objekte, die sprachabhängige Zahlenformatierungen nutzen.

+ +
{{EmbedInteractiveExample("pages/js/intl-numberformat.html")}}
+ + + +

Syntax

+ +
new Intl.NumberFormat([locales[, options]])
+Intl.NumberFormat.call(this[, locales[, options]])
+
+ +

Parameter

+ +
+
locales
+
Optional. Ein String mit einem BCP 47 Sprachcode, oder ein Array mit solchen Strings. Für die generelle Form und Interpretation des locales Arguments siehe im {{jsxref("Intl", "Intl Artikel", "#Locale_identification_and_negotiation", 1)}}. Die folgenden Unicode Erweiterungsschlüssel sind erlaubt:
+
+
+
nu
+
Das einzusetzende Nummerierungssystem. Mögliche Wert sind: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".
+
+
+
options
+
+

Optional. Ein Objekt mit einigen oder allen der folgenden Eigenschaften:

+ +
+
localeMatcher
+
Der Spracherkennungsalgorithmus. Mögliche Werte sind "lookup" und "best fit". Der Standardwert ist "best fit". Für mehr Informationen siehe in den {{jsxref("Intl", "Intl Artikel", "#Locale_negotiation", 1)}}.
+
style
+
Der einzusetzende Formatierungsstil. Mögliche Werte sind "decimal" für einfache Zahlenformate, "currency" für Währungen, "percent" für Prozentzahlen. Der Standardwert ist "decimal".
+
currency
+
Die bei der Währungsformatierung einzusetzende Währung. Mögliche Werte sind die ISO 4217 Währungscodes wie zum Beispiel "USD" für US Dollar, "EUR" für Euro und "CNY" für Chinesischen RMB (siehe Current currency & funds code list). Es gibt keinen Standardwert. Wenn style auf "currency" gesetzt ist, muss die currency Eigenschaft gesetzt werden.
+
currencyDisplay
+
Währungsanzeige im String. Mögliche Werte sind "symbol" für lokalisierte Währungssymbole wie zum Beispiel €, "code" für ISO Währungscodes, "name" für den Namen der Währung wie zum Beispiel "dollar". Der Standardwert ist "symbol".
+
useGrouping
+
Gruppierung der Zahl. Wird für das Ein- und Ausschalten der Tausendertrenner oder thousand/lakh/crore-Trenner eingesetzt. Mögliche Werte sind true und false. Der Standardwert ist true.
+
+ +

Die folgenden Eingeschaften fallen in zwei Gruppen: minimumIntegerDigits, minimumFractionDigits, und maximumFractionDigits in einer Gruppe, minimumSignificantDigits und maximumSignificantDigits in der anderen. Wenn nur eine Eigenschaft der zweiten Gruppe genutzt wird, wird die erste Gruppe ignoriert.

+ +
+
minimumIntegerDigits
+
Die minimale Anzahl von Ganzzahl Ziffern. Mögliche Werte sind zwischen 1 und 21. Der Standardwert ist 1.
+
minimumFractionDigits
+
Die minimale Anzahl von Nachkommastellen. Mögliche Werte sind zwischen 0 und 20. Der Standardwert für Zahlen und Prozentzahlen ist 0. Der Standard für Währungen ist die Anzahl der Stellen für die Untereinheit der Währung, die eingesetzt wird (ISO 4217 currency code list) oder 2, wenn die Währung nicht unterstützt wird.
+
maximumFractionDigits
+
Die Maximale Anzahl von Nachkommastellen. Mögliche Werte sind zwischen 0 und 20. Der Standardwert für einfache Zahlen ist die größere Zahl von minimumFractionDigits und 3. Der Standardwert für Währungen ist der größere von minimumFractionDigits und der Anzahl der Stellen für die Untereinheit der Währung oder 2 wenn die Währung nicht unterstützt wird. Der Standardwert für Prozentzahlen ist die größere Zahl von minimumFractionDigits und 0.
+
minimumSignificantDigits
+
Die minimale Anzahl von signifikanten Stellen. Mögliche Werte sind zwischen 1 und 21. Der Standardwert ist 1.
+
maximumSignificantDigits
+
Die maximale Anzahl von signifikanten Stellen. Mögliche Werte sind zwischen 1 und 21. Der Standardwert ist minimumSignificantDigits.
+
+
+
+ +

Beschreibung

+ +

Eigenschaften

+ +
+
{{jsxref("NumberFormat.prototype", "Intl.NumberFormat.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften zu allen Objekten.
+
+ +

Methoden

+ +
+
{{jsxref("NumberFormat.supportedLocalesOf", "Intl.NumberFormat.supportedLocalesOf()")}}
+
Gibt ein Array zurück, welches alle Sprachen enthält, die unterstützt werden, ohne auf den Laufzeitstandard zurückzufallen (ohne fallback).
+
+ +

NumberFormat Instanzen

+ +

Eigenschaften

+ +

NumberFormat Instanzen erben die folgenden Eigenschaften von ihrem Prototyp:

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +

NumberFormat Instanzen erben die folgenden Methoden von ihrem Prototyp:

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Standardeinsatz

+ +

Beim Einsatz ohne spezifizierte Sprache wird ein formatierter String in der Standardsprache und mit Standardoptionen zurückgegeben:

+ +
var number = 3500;
+
+console.log(new Intl.NumberFormat().format(number));
+// → '3.500' wenn in Deutscher Sprache
+
+ +

Einsatz von locales

+ +

Diese Beispiel zeigt einige der Variationen lokalisierter Zahlenformate. Um das Format der Sprache zu erhalten, welches in der Anwendung benutzt wird, spezifiziere die Sprache (und mögliche Rückfallsprachen (fallback)) mit dem locales Argument.

+ +
var number = 123456.789;
+
+// Englische Benutzer sehen ein Punkt anstatt eines Kommas als Dezimaltrenner
+console.log(new Intl.NumberFormat('en-GB').format(number));
+// → 123.456,789
+
+// Arabisch ist in den meisten arabisch sprachigen Ländern eingesetzt
+console.log(new Intl.NumberFormat('ar-EG').format(number));
+// → ١٢٣٤٥٦٫٧٨٩
+
+// Indien benutzt Tausendertrennzeichen bei Tausend und allen weiteren zwei Stellen
+console.log(new Intl.NumberFormat('en-IN').format(number));
+// → 1,23,456.789
+
+// Chinesisches Zahlensystem
+console.log(new Intl.NumberFormat('zh-Hans-CN-u-nu-hanidec').format(number));
+// → 一二三,四五六.七八九
+
+// Wenn eine Sprache übergeben werden soll, die vielleicht nicht
+// unterstützt wird (Balinesisch), nutze eine fallback Sprache (Indonesisch)
+console.log(new Intl.NumberFormat(['ban', 'id']).format(number));
+// → 123.456,789
+
+ +

Einsatz von options

+ +

Das Ergebnis von toLocaleString kann durch das options Argument angepasst werden.

+ +
var number = 123456.789;
+
+//  Währungsformat
+console.log(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(number));
+// → 123.456,79 €
+
+//  Der Japanische Yen hat keine Unterwährung (z. B. Cent)
+console.log(new Intl.NumberFormat('ja-JP', { style: 'currency', currency: 'JPY' }).format(number));
+// → ¥123,457
+
+//  Limitiert auf drei signifikante Stellen
+console.log(new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 3 }).format(number));
+// → 1,23,000
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-11.1', 'Intl.NumberFormat')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-11.1', 'Intl.NumberFormat')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#numberformat-objects', 'Intl.NumberFormat')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.NumberFormat")}}

+
+ +

Siehe auch

+ +

{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'Siehe auch')}}

diff --git a/files/de/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html b/files/de/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html new file mode 100644 index 0000000000..aa10caf254 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/numberformat/prototype/index.html @@ -0,0 +1,81 @@ +--- +title: Intl.NumberFormat.prototype +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/prototype +tags: + - Internationalization + - JavaScript + - NumberFormat + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat +--- +
{{JSRef}}
+ +

Die Intl.NumberFormat.prototype Eigenschaft repräsentiert das Prototypobjekt für einen {{jsxref("NumberFormat", "Intl.NumberFormat")}} Konstruktor.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Siehe {{jsxref("NumberFormat")}} für eine Beschreibung von Intl.NumberFormat Instanzen.

+ +

{{jsxref("NumberFormat", "Intl.NumberFormat")}} Instanzen erben von Intl.NumberFormat.prototype. Veränderungen am Prototypobjekt werden an alle {{jsxref("NumberFormat", "Intl.NumberFormat")}} Instanzen vererbt.

+ +

Eigenschaften

+ +
+
Intl.NumberFormat.prototype.constructor
+
Eine Referenz zu Intl.NumberFormat.
+
{{jsxref("NumberFormat.format", "Intl.NumberFormat.prototype.format")}}
+
Getter; gibt eine Funktion zurück, die eine Zahl nach den Sprach- und Formatierungsoptionen dieses {{jsxref("NumberFormat")}} Objektes formatiert.
+
+ +

Methoden

+ +
+
{{jsxref("NumberFormat.formatToParts", "Intl.NumberFormat.prototype.formatToParts()")}}
+
Gibt ein {{jsxref("Array")}} mit Objekten zurück, welche die Repräsentation des Zahlenstrings in Teilen enthalten, die für sprachsicheres Formatieren genutzt werden können.
+
{{jsxref("NumberFormat.resolvedOptions", "Intl.NumberFormat.prototype.resolvedOptions()")}}
+
Gibt ein neues Objekt mit eigenschaften zurück, die Sprach- und Formatierungsoptionen enthält, die bei der Initialisierung des Objektes errechnet wurden.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES Int 1.0', '#sec-11.2.1', 'Intl.NumberFormat.prototype')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-11.2.1', 'Intl.NumberFormat.prototype')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Intl.NumberFormat.prototype', 'Intl.NumberFormat.prototype')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.NumberFormat.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html b/files/de/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html new file mode 100644 index 0000000000..2521267a18 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/numberformat/supportedlocalesof/index.html @@ -0,0 +1,98 @@ +--- +title: Intl.NumberFormat.supportedLocalesOf() +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/supportedLocalesOf +tags: + - Internationalization + - JavaScript + - Method + - NumberFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/supportedLocalesOf +--- +
{{JSRef}}
+ +

Die Intl.NumberFormat.supportedLocalesOf() Methode gibt ein Array zurück, welches die Gebiete enthält, die die Zahlenformatierung unterstützen, ohne das auf das Laufzeitstandardgebiet zurückgegriffen werden muss.

+ +
{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-supportedlocalesof.html")}}
+ + + +

Syntax

+ +
Intl.NumberFormat.supportedLocalesOf(locales[, options])
+ +

Parameter

+ +
+
locales
+
Ein String mit einem BCP 47 Sprachtag, oder ein Array von solchen Strings. Für die generelle Form des locales Arguments siehe die {{jsxref("Intl", "Intl Seite", "#Gebietsidentifikation_und_-verhandlung", 1)}}.
+
options
+
+

Optional. Ein Objekt, welches die folgende Eigenschaft haben kann:

+ +
+
localeMatcher
+
Der Auswahlalgorithmus des Gebietes. Mögliche Werte sind "lookup" und "best fit"; der Standard ist "best fit". Für mehr Information über diese Option siehe auf der {{jsxref("Intl", "Intl Seite", "#Gebietsauswahl", 1)}}.
+
+
+
+ +

Rückgabewert

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete enthält, für die die Zahlenformatierung unterstützen wird, ohne das auf das Laufzeitstandardgebeit zurückgegriffen werden muss.

+ +

Beschreibung

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete (locales) enthält. Die Sprachtags, die zurückgegeben werden, unterstützen Zahlenformatierungen für das entsprechende Gebiet, ohne auf den Systemstandard zurückgreifen zu müssen.

+ +

Beispiele

+ +

Einsatz von supportedLocalesOf

+ +

Angenommen wird, dass indonesische und deutsche Zahlenformatierung unterstützt wird, aber balinesisch nicht. supportedLocalesOf gibt das indonesische und deutsche Sprachtag unverändert zurück, obwohl Pinyin nicht mit Indonesisch verwendet wird und Fachdeutsch wahrscheinlich nicht für Indonesisch verfügbar ist. Zu bemerken ist, dass der "lookup" Algorithmus verwendet wird — der"best-fit" Algorithmus könnte entscheiden, dass Indonesisch eine angemessene Ergänzung für Balinesen ist, da die meisten Balinesen Indonesisch verstehen und daher auch das balinesische Sprachtag zurückgeben.

+ +
var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
+var options = { localeMatcher: 'lookup' };
+console.log(Intl.NumberFormat.supportedLocalesOf(locales, options).join(', '));
+// → "id-u-co-pinyin, de-ID"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES Int 1.0', '#sec-11.2.2', 'Intl.NumberFormat.supportedLocalesOf')}}{{Spec2('ES Int 1.0')}}Initiale Definition.
{{SpecName('ES Int 2.0', '#sec-11.2.2', 'Intl.NumberFormat.supportedLocalesOf')}}{{Spec2('ES Int 2.0')}}
{{SpecName('ES Int Draft', '#sec-Intl.NumberFormat.supportedLocalesOf', 'Intl.NumberFormat.supportedLocalesOf')}}{{Spec2('ES Int Draft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.NumberFormat.supportedLocalesOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/intl/pluralrules/index.html b/files/de/web/javascript/reference/global_objects/intl/pluralrules/index.html new file mode 100644 index 0000000000..fe646e4772 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/pluralrules/index.html @@ -0,0 +1,161 @@ +--- +title: Intl.PluralRules +slug: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules +tags: + - Internationalization + - Intl + - JavaScript + - NeedsTranslation + - PluralRules + - TopicStub +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules +--- +
{{JSRef}}
+ +

The Intl.PluralRules object is a constructor for objects that enable plural sensitive formatting and plural language language rules.

+ +

Syntax

+ +
new Intl.PluralRules([locales[, options]])
+Intl.PluralRules.call(this[, locales[, options]])
+
+ +

Parameters

+ +
+
locales
+
+

Optional. A string with a BCP 47 language tag, or an array of such strings. For the general form and interpretation of the locales argument, see the {{jsxref("Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}.

+
+
options
+
+

Optional. An object with some or all of the following properties:

+ +
+
localeMatcher
+
The locale matching algorithm to use. Possible values are "lookup" and "best fit"; the default is "best fit". For information about this option, see the {{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}.
+
type
+
The type to use. Possible values are: +
    +
  • "cardinal" for cardinal numbers (refering to the quantity of things). This is the default value.
  • +
  • "ordinal" for ordinal number (refering to the ordering or ranking of things, e.g. "1st", "2nd", "3rd" in English).
  • +
+
+
+
+
+ +

Description

+ +

Properties

+ +
+
{{jsxref("PluralRules.prototype", "Intl.PluralRules.prototype")}}
+
Allows the addition of properties to all objects.
+
+ +

Methods

+ +
+
{{jsxref("PluralRules.supportedLocalesOf", "Intl.PluralRules.supportedLocalesOf()")}}
+
Returns an array containing those of the provided locales that are supported without having to fall back to the runtime's default locale.
+
+ +

PluralRules instances

+ +

Properties

+ +

PluralRules instances inherit the following properties from their prototype:

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/PluralRules/prototype', 'Properties')}}
+ +

Methods

+ +

PluralRules instances inherit the following methods from their prototype:

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/PluralRules/prototype', 'Methods')}}
+ +

Examples

+ +

Basic usage

+ +

In basic use without specifying a locale, a formatted string in the default locale and with default options is returned. This is useful to distinguish between singular and plural forms, e.g. "dog" and "dogs".

+ +
var pr = new Intl.PluralRules();
+
+pr.select(0);
+// → 'other' if in US English locale
+
+pr.select(1);
+// → 'one' if in US English locale
+
+pr.select(2);
+// → 'other' if in US English locale
+
+ +

Using locales

+ +

This example shows some of the variations in localized plural rules. In order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the locales argument:

+ +
// Arabic has different plural rules
+
+new Intl.PluralRules('ar-EG').select(0);
+// → 'zero'
+new Intl.PluralRules('ar-EG').select(1);
+// → 'one'
+new Intl.PluralRules('ar-EG').select(2);
+// → 'two'
+new Intl.PluralRules('ar-EG').select(6);
+// → 'few'
+new Intl.PluralRules('ar-EG').select(18);
+// → 'many'
+
+ +

Using options

+ +

The results can be customized using the options argument, which has one property called type which you can set to ordinal. This is useful to figure out the ordinal indicator, e.g. "1st", "2nd", "3rd", "4th", "42nd" and so forth.

+ +
var pr = new Intl.PluralRules('en-US', { type: 'ordinal' });
+
+pr.select(0);
+// → 'other'
+pr.select(1);
+// → 'one'
+pr.select(2);
+// → 'two'
+pr.select(3);
+// → 'few'
+pr.select(4);
+// → 'other'
+pr.select(42);
+// → 'two'
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
Intl Plural Rules Draft{{Spec2('ES Int Draft')}}Initial definition
+ +

Browser compatibility

+ +
+ + +

{{Compat("javascript.builtins.Intl.PluralRules")}}

+
+ +

See also

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}
diff --git a/files/de/web/javascript/reference/global_objects/intl/pluralrules/supportedlocalesof/index.html b/files/de/web/javascript/reference/global_objects/intl/pluralrules/supportedlocalesof/index.html new file mode 100644 index 0000000000..a33eac3e76 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/intl/pluralrules/supportedlocalesof/index.html @@ -0,0 +1,85 @@ +--- +title: Intl.PluralRules.supportedLocalesOf() +slug: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules/supportedLocalesOf +tags: + - Internationalization + - Intl + - JavaScript + - Method + - PluralRules +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules/supportedLocalesOf +--- +
{{JSRef}}
+ +

Die Intl.PluralRules.supportedLocalesOf() Methode gibt ein Array zurück, welches die Gebiete enthält, die die Pluralformatierung unterstützen, ohne das auf das Laufzeitstandardgebeit zurückgegriffen werden muss.

+ +

Syntax

+ +
Intl.PluralRules.supportedLocalesOf(locales[, options])
+ +

Parameter

+ +
+
locales
+
Ein String mit einem BCP 47 Sprachtag, oder ein Array von solchen Strings. Für die generelle Form des locales Arguments siehe die {{jsxref("Intl", "Intl Seite", "#Gebietsidentifikation_und_-verhandlung", 1)}}.
+
options
+
+

Optional. Ein Objekt, welches die folgende Eigenschaft haben kann:

+ +
+
localeMatcher
+
Der Auswahlalgorithmus des Gebietes. Mögliche Werte sind "lookup" und "best fit"; der Standard ist "best fit". Für mehr Information über diese Option siehe auf der {{jsxref("Intl", "Intl Seite", "#Gebietsauswahl", 1)}}.
+
+
+
+ +

Rückgabewert

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete enthält, für die die Pluralformatierung unterstützen wird, ohne das auf das Laufzeitstandardgebeit zurückgegriffen werden muss.

+ +

Beschreibung

+ +

Gibt ein Array zurück, welches eine Untermenge der gegebenen Gebiete (locales) enthält. Die Sprachtags, die zurückgegeben werden, unterstützen Zahlenformatierungen für das entsprechende Gebiet, ohne auf den Systemstandard zurückgreifen zu müssen.

+ +

Beispiele

+ +

Einsatz von supportedLocalesOf

+ +

Angenommen wird, dass indonesische und deutsche Pluralformatierung unterstützt wird, aber balinesisch nicht. supportedLocalesOf gibt das indonesische und deutsche Sprachtag unverändert zurück, obwohl Pinyin nicht mit Indonesisch verwendet wird und Fachdeutsch wahrscheinlich nicht für Indonesisch verfügbar ist. Zu bemerken ist, dass der "lookup" Algorithmus verwendet wird — der"best-fit" Algorithmus könnte entscheiden, dass Indonesisch eine angemessene Ergänzung für Balinesen ist, da die meisten Balinesen Indonesisch verstehen und daher auch das balinesische Sprachtag zurückgeben.

+ +
var locales = ['ban', 'id-u-co-pinyin', 'de-ID'];
+var options = { localeMatcher: 'lookup' };
+console.log(Intl.PluralRules.supportedLocalesOf(locales, options).join(', '));
+// → "id-u-co-pinyin, de-ID"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Intl Plural Rules Draft{{Spec2('ES Int Draft')}}Initiale Definition
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Intl.PluralRules.supportedLocalesOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/isfinite/index.html b/files/de/web/javascript/reference/global_objects/isfinite/index.html new file mode 100644 index 0000000000..c947c8cbf8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/isfinite/index.html @@ -0,0 +1,99 @@ +--- +title: isFinite() +slug: Web/JavaScript/Reference/Global_Objects/isFinite +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/isFinite +--- +
{{jsSidebar("Objects")}}
+ +

Die globale Funktion isFinite() prüft, ob eine Zahl endlich ist oder nicht. Wenn der übergeben Wert keine Nummer ist, wird dieser zuerst konvertiert.

+ +
{{EmbedInteractiveExample("pages/js/globalprops-isfinite.html")}}
+ + + +

Syntax

+ +
isFinite(testWert)
+ +

Parameter

+ +
+
testWert
+
Wert, der auf Endlichkeit geprüft wird.
+
+ +

Rückgabewert

+ +

false wenn der Wert positiv {{jsxref("Infinity")}}, negativ {{jsxref("Infinity")}} or {{jsxref("NaN")}} ist, andernfalls true.

+ +

Beschreibung

+ +

isFinite ist eine Toplevel-Funktion und ist nicht mit einem Objekt verbunden.

+ +

Man kann die Funktion nutzen, um eine Nummer auf Endlichkeit zu prüfen. Die isFinite Funktion prüft die Zahl, die ihr als Parameter mit übergeben wird. Wenn der Wert der Zahl {{jsxref("Global_Objects/NaN", "NaN")}}, positiv {{jsxref("Global_Objects/Infinity", "infinity")}} oder negativ {{jsxref("Global_Objects/Infinity", "infinity")}} ist, so ist der Rückgabewert false; andernfalls true.

+ +

Beispiele

+ +
isFinite(Infinity);  // false
+isFinite(NaN);       // false
+isFinite(-Infinity); // false
+
+isFinite(0);         // true
+isFinite(2e64);      // true
+isFinite(null);      // true
+
+isFinite(null)       // true, würde false sein, wenn die robustere
+                     // Methode Number.isFinite(null) eingesetzt wird.
+
+isFinite('0');       // true, würde false sein, wenn die robustere
+                     // Methode Number.isFinite('0') eingesetzt wird.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.1.2.5', 'isFinite')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-isfinite-number', 'isFinite')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-isfinite-number', 'isFinite')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.isFinite")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/isnan/index.html b/files/de/web/javascript/reference/global_objects/isnan/index.html new file mode 100644 index 0000000000..328ef94557 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/isnan/index.html @@ -0,0 +1,192 @@ +--- +title: isNaN() +slug: Web/JavaScript/Reference/Global_Objects/isNaN +tags: + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/isNaN +--- +
{{jsSidebar("Objects")}}
+ +

Die isNaN() Methode prüft, ob ein Wert {{jsxref("NaN")}} ist. Bemerkung: Aufgrund innerer Zwänge weist die isNaN Methode interessante Regeln auf. Alternativ kann die in ECMAScript 2015 definierte Methode {{jsxref("Number.isNaN()")}} genutzt werden.

+ +
{{EmbedInteractiveExample("pages/js/globalprops-isnan.html")}}
+ +

Syntax

+ +
isNaN(testWert)
+ +

Parameter

+ +
+
testWert
+
Der zu testende Wert.
+
+ +

Rückgabewert

+ +

true wenn der gegebene Wert {{jsxref("NaN")}} ist, andernfalls false.

+ +

Beschreibung

+ +

Die notwendigkeit einer isNaN Methode

+ +

Anders als bei allen anderen Werten in JavaScript, ist es nicht möglich mit den Gleichheitsoperatoren ({{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} and {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}) zu prüfen, ob ein Wert {{jsxref("NaN")}} ist oder nicht. NaN == NaN und NaN === NaN werden zu false ausgewertet. Aus diesem Grund wird eine isNaN Methode benötigt. 

+ +

Ursprünge des NaNWertes

+ +

NaN Werte werden generiert, wenn das Ergebnis einer arithmetischen Operation ein undefinierter Wert oder ein nicht repräsentierbarer Wert ist. Diese Werte entsprechen nicht unbedingt dem Überlauf von Wertebereichen. Ein NaN Ergebnis kann ebenfalls entstehen, wenn es für eine Operation keine primitive Zahl als Darstellung gibt.

+ +

Beispielsweise ist das Ergebnis einer Division von null durch null NaN. Jedoch ist das Ergebnis nicht NaN wenn andere Zahlen durch null geteilt werden.

+ +

Verwirrende Spezialfälle

+ +

Schon seit den frühesten Versionen der isNaN Methodendefinition ist das Verhalten für nicht numerische Typen nicht trivial. Wenn der zu überprüfende Wert nicht vom Typ Number ist, so wird dieser Wert zuerst in den Typ Number konvertiert. Erst dann wird geprüft, ob der Wert {{jsxref("NaN")}} ist. Weil einige nicht numerischen Werte trotzdem als Zahlen interpretiert werden können (leere Strings und Werte vom Typ boolean können als Nullen und Einsen dargestellt werden) ist das false-Resultat der Funktion manchmal unerwartet. Der leere String ist ein Beispiel dafür, weil dieser definitiv keine Nummer ist. Das verwirrende ist jedoch dass "not a number" eine spezielle Repräsentation in den IEEE-754 Gleitkommazahlen besitzt. Aus diesem Grund kann die Methode so interpretiert werden, dass sie die Antwort auf die Frage gibt, ob ein Wert, der als Nummer interpretiert wird, eine IEEE-754 'Not a number' ist.

+ +

Die aktuelle Version von ECMAScript (ES2015) enthält die Methode {{jsxref("Number.isNaN()")}}. Number.isNaN(x) wird eine zuverlässige Möglichkeit sein um zu testen ob x den Wert NaN entspricht oder nicht. Mit Number.isNaN wird exakt abgefragt, ob es sich um eine Nummer handelt. Eine Alternative zu testen ob eine Variable NaN ist, ist die Abfrage  (x != x). Diese wird im Normalfall zu false ausgewertet, außer wenn der wert NaN ist.

+ +

Ein Polyfill für isNaN ist folgender (der Polyfill nutzt die einzigartigen Eigenschaften von NaN, dass dieses niemals gleichwertig mit NaN ist):

+ +
var isNaN = function(value) {
+    var n = Number(value);
+    return n !== n;
+}
+ +

Beispiele

+ +
isNaN(NaN);       // true
+isNaN(undefined); // true
+isNaN({});        // true
+
+isNaN(true);      // false
+isNaN(null);      // false
+isNaN(37);        // false
+
+// strings
+isNaN("37");      // false: "37" wird in die Nummer 37 konvertiert welche nicht NaN ist
+isNaN("37.37");   // false: "37.37" wird in die Nummer 37.37 konvertiert welche nicht NaN ist
+isNaN("37,5");    // true
+isNaN("123ABC");  // true:  parseInt("123ABC") ist 123 aber Number("123ABC") ist NaN
+isNaN("");        // false: der leere String wird zu 0 konvertiert welche nicht NaN ist
+isNaN(" ");       // false: ein String mit Leerzeichen wird zu 0 konvertiert welche nicht NaN ist
+
+// dates
+isNaN(new Date());                // false
+isNaN(new Date().toString());     // true
+
+// Dieses ist das Beispiel, warum isNaN nicht zuverlässig ist.
+isNaN("blabla")   // true: "blabla" wird zu einer Nummer konvertiert
+                  // Das Konvertieren schlägt fehl und gibt NaN zurück
+
+ +

Nützliche Spezialfälle

+ +

Es gibt weitere nützliche Wege isNaN() einzusetzen: Wenn isNaN(x) false zurückgibt, kann x in einer arithmetischen Operation eingesetzt werden, ohne dass diese zu NaN ausgewertet wird. Wenn true zurückgegeben wird, wird jede arithmetische Operation zu NaN ausgewertet. Das bedeutet, dass in JavaScript isNaN(x) == true  gleich zu "x - 0 ergibt NaN" (in JavaScript wird x - 0 == NaN immer false zurückgeben, was bedeutet, man kann es nicht testen). Aktuell geben isNaN(x), isNaN(x - 0), isNaN(Number(x)), Number.isNaN(x - 0), und Number.isNaN(Number(x)) immer das selbe Ergebnis  zurück und isNaN(x) ist der kürzest mögliche Ausdruck.

+ +

Dieses kann zum Beispiel eingesetzt werden, um zu prüfen, ob ein Funktionsargument arithmetisch verarbeitet werden kann. Wenn diese Verarbeitung nicht möglich ist, kann ein Standardwert unterstützt werden oder irgendetwas anderes. Damit kann man sich die volle Vielseitigkeit, die JavaScript mit implizierten Typkonvertierungen abhängig vom Kontext unterstützt, zu nutze machen.

+ +

Beispiele

+ +
function increment(x) {
+  if (isNaN(x)) x = 0;
+  return x + 1;
+};
+
+// Gleicher Wirkung wie bei Number.isNaN():
+function increment(x) {
+  if (Number.isNaN(Number(x))) x = 0;
+  return x + 1;
+};
+
+// In den folgenden Fällen ist für das Funktionsargument x
+// isNaN(x) immer false, weil es keine Nummer ist,
+// jedoch kann es in arithmetischen Operationen eingesetzt
+// werden.
+increment("");            // 1: "" is converted to 0
+increment(new String());  // 1: String object representing an empty string is converted to 0
+increment([]);            // 1: [] is converted to 0
+increment(new Array());   // 1: Array object representing an empty array is converted to 0
+increment("0");           // 1: "0" is converted to 0
+increment("1");           // 2: "1" is converted to 1
+increment("0.1");         // 1.1: "0.1" is converted to 0.1
+increment("Infinity");    // Infinity: "Infinity" is converted to Infinity
+increment(null);          // 1: null is converted to 0
+increment(false);         // 1: false is converted to 0
+increment(true);          // 2: true is converted to 1
+increment(new Date());    // returns current date/time in milliseconds plus 1
+
+// In den folgenden Fällen ist für das Funktionsargument x
+// isNaN(x) immer false und x ist eine Nummer
+increment(-1);            // 0
+increment(-0.1);          // 0.9
+increment(0);             // 1
+increment(1);             // 2
+increment(2);             // 3
+// ... und so weiter ...
+increment(Infinity);      // Infinity
+
+// In den folgenden Fällen ist für das Funktionsargument x
+// isNaN(x) immer true und x ist keine Nummer,
+// weshalb die Funktion es mit 0 ersetzt und 1 zurück gibt.
+increment(String);            // 1
+increment(Array);             // 1
+increment("blabla");          // 1
+increment("-blabla");         // 1
+increment(0/0);               // 1
+increment("0/0");             // 1
+increment(Infinity/Infinity); // 1
+increment(NaN);               // 1
+increment(undefined);         // 1
+increment();                  // 1
+
+// isNaN(x) ist immer identisch mit isNaN(Number(x)),
+// aber die Präsenz wenn x ist immer zwingend erforderlich.
+isNaN(x) == isNaN(Number(x)) // true für jeden Wert von x, auch x == undefined,
+                             // weil isNaN(undefined) == true und Number(undefined) gibt NaN,
+                             // aber ...
+isNaN() == isNaN(Number())   // false, weil isNaN() == true und Number() == 0
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.1.2.4', 'isNaN')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-isnan-number', 'isNaN')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-isnan-number', 'isNaN')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.isNaN")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/json/index.html b/files/de/web/javascript/reference/global_objects/json/index.html new file mode 100644 index 0000000000..e52af893a1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/json/index.html @@ -0,0 +1,155 @@ +--- +title: JSON +slug: Web/JavaScript/Reference/Global_Objects/JSON +tags: + - JSON + - JavaScript + - Object + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/JSON +--- +
{{JSRef}}
+ +

Das JSON Objekt enthält Methoden für das Einlesen und Konvertieren der JavaScript Objekt Notation ({{glossary("JSON")}}) in JavaScript und umgekehrt. Es kann nicht aufgerufen oder erstellt werden. Außer seinen zwei Methoden hat das Objekt keine interessante Funktionalität.

+ +

Beschreibung

+ +

JavaScript Objekt Notation

+ +

JSON ist eine Syntax für das Serialisieren von Objekten, Arrays, Nummern, Strings, Wahrheitswerten und {{jsxref("null")}}. JSON basiert auf der JavaScript Syntax, jedoch ist sie leicht unterschiedlich: Manches JavaScript ist kein JSON und manches JSON ist kein JavaScript. Für mehr Informationen Siehe in dem Artikel JSON: The JavaScript subset that isn't.

+ + + + + + + + + + + + + + + + + + + + + + + +
JavaScript und JSON Unterschiede
JavaScript TypenJSON Unterschiede
Objekte und ArraysNamen von Eigenschaften müssen als Strings in Doppelten Anführungszeichen (") geschrieben werden; Angefügte Kommas sind verboten.
ZahlenFührende Nullen sind verboten (JSON.stringify ignoriert diese Nullen, jedoch wirft JSON.parse einen SyntaxError); Nach einem Dezimalpunkt muss mindestens eine Ziffer folgen.
Strings +

Nur eine begrenzte Menge von Zeichen muss maskiert werden; Einige Kontrollzeichen sind verboten; Die Unicodezeichen Zeilenumbruch (U+2028) und Paragraphenumbruch (U+2029) sind erlaubt; Strings müssen in Doppelten Anführungszeichen (") geschrieben werden. Das folgenden Beispiel zeigt eine Situation in der {{jsxref("JSON.parse()")}} funktioniert, aber das Ausführen durch JavaScript zu einem {{jsxref("SyntaxError")}} führt:

+ +
+var code = '"\u2028\u2029"';
+JSON.parse(code); // funktioniert
+eval(code); // Error
+
+
+ +

Nachfolgend ist die komplette JSON Syntax zu sehen:

+ +
JSON = null
+    or true or false
+    or JSONNumber
+    or JSONString
+    or JSONObject
+    or JSONArray
+
+JSONNumber = - PositiveNumber
+          or PositiveNumber
+PositiveNumber = DecimalNumber
+              or DecimalNumber . Digits
+              or DecimalNumber . Digits ExponentPart
+              or DecimalNumber ExponentPart
+DecimalNumber = 0
+             or OneToNine Digits
+ExponentPart = e Exponent
+            or E Exponent
+Exponent = Digits
+        or + Digits
+        or - Digits
+Digits = Digit
+      or Digits Digit
+Digit = 0 through 9
+OneToNine = 1 through 9
+
+JSONString = ""
+          or " StringCharacters "
+StringCharacters = StringCharacter
+                or StringCharacters StringCharacter
+StringCharacter = any character
+                  except " or \ or U+0000 through U+001F
+               or EscapeSequence
+EscapeSequence = \" or \/ or \\ or \b or \f or \n or \r or \t
+              or \u HexDigit HexDigit HexDigit HexDigit
+HexDigit = 0 through 9
+        or A through F
+        or a through f
+
+JSONObject = { }
+          or { Members }
+Members = JSONString : JSON
+       or Members , JSONString : JSON
+
+JSONArray = [ ]
+         or [ ArrayElements ]
+ArrayElements = JSON
+             or ArrayElements , JSON
+ +

Unbedeutende Whitespaces können überall eingebaut werden außer in eine JSONNumber (Nummern dürfen keine Whitespaces enthalten) und einen JSONString (In dem wird es als das entsprechende Whitespace interpretiert oder führt zu einem Fehler). Das Tab-Zeichen (U+0009), "carriage return"-Zeichen (U+000D), "line feed"-Zeichen (U+000A) und Leerzeichen (U+0020) sind die einzigen erlaubten Whitespace-Zeichen.

+ +

Methoden

+ +
+
{{jsxref("JSON.parse()")}}
+
Liest einen String als JSON ein. Optional werden die Werte und die Eigenschaften Transformiert und zurückgegeben.
+
{{jsxref("JSON.stringify()")}}
+
Gibt ein JSON-String eines übergebenen Wertes zurück. Optional können nur bestimmte Eigenschaften zum JSON hinzugefügt werden oder Eigenschaften werden Ersetzt. Dieses wird durch eine Benutzerdefinierte Methode durchgeführt.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.12', 'JSON')}}{{Spec2('ES5.1')}}Initiale Definition.
{{SpecName('ES6', '#sec-json-object', 'JSON')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-json-object', 'JSON')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+
+ + +

{{Compat("javascript.builtins.JSON")}}

+
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/json/parse/index.html b/files/de/web/javascript/reference/global_objects/json/parse/index.html new file mode 100644 index 0000000000..b8442eb38d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/json/parse/index.html @@ -0,0 +1,128 @@ +--- +title: JSON.parse() +slug: Web/JavaScript/Reference/Global_Objects/JSON/parse +tags: + - ECMAScript5 + - JSON + - JavaScript + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/JSON/parse +--- +
{{JSRef}}
+ +

Die Methode JSON.parse() erzeugt aus einem JSON-formatierten Text ein entsprechendes Javascript-Objekt. Der optionale reviver-Parameter kann die Umwandlung im Detail beeinflussen.

+ +
{{EmbedInteractiveExample("pages/js/json-parse.html")}}
+ + + +

Syntax

+ +
JSON.parse(text[, reviver])
+ +

Parameter

+ +
+
text
+
JSON-formatierter Text, der eingelesen werden soll. Siehe {{jsxref("JSON")}} für eine Beschreibung der JavaScript Objekt Notation.
+
reviver {{optional_inline}}
+
+

Wenn es sich um eine Funktion handelt, schreibt diese vor, wie der ursprünglich vom Parsen erzeugte Wert transformiert wird, bevor er zurückgegeben wird.

+
+
+ +

Rückgabewert

+ +

Die Funktion gibt das aus text erzeugte {{jsxref("Object")}} zurück.

+ +

Ausnahmen

+ +

{{jsxref("SyntaxError")}}, falls text kein gültiges JSON enthält.

+ +

Beispiele

+ +

JSON.parse() verwenden

+ +
JSON.parse('{}');              // {}
+JSON.parse('true');            // true
+JSON.parse('"foo"');           // "foo"
+JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
+JSON.parse('null');            // null
+
+ +

Verwendung des reviver-Parameters

+ +

Wenn reviver spezifiziert ist, wird der vom Parser berechnete Wert vor der Rückgabe Transformiert. Insbesondere der berechnete Wert und alle seine EIgenschaften (beginnend mit dem am tiefsten geschachtelten Eigenschaft bis hin zum originalen Wert selbst) werden separat mit dem reviver Ausgeführt. Dann wird sie aufgerufen, wobei das Objekt, das die Eigenschaft enthält, als this und der Eigenschaftsname als Zeichenfolge und der Eigenschaftswert als Argumente verarbeitet werden. Wenn reviver {{jsxref("undefined")}} zurück gibt (oder keinen Wert zurück gibt, wenn zum Beispiel die Ausführung der Funktion fehlschlägt), wird die Eigenschaft aus dem Ergebnis entfernt. Anderenfalls wird dessen Wert in den Rückgabewert neu definiert.

+ +

Falls reviver nur einige Werte ändert, muss sichergestellt sein, dass die unveränderten Werte auch zurückgegeben werden, ansonsten werden diese Werte aus dem Ergebnis gelöscht.

+ +
JSON.parse('{"p": 5}', (key, value) =>
+  typeof value === 'number'
+    ? value * 2 // Gibt value * 2 für Zahlen zurück.
+    : value     // Alle anderen Werte werden unverändert zurückgegeben.
+);
+
+// { p: 10 }
+
+JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', (key, value) => {
+  console.log(key); // Loggt die Namen der Eigenschaften, der letzte ist "".
+  return value;     // Gib den unveränderten Eigenschaftenwert zurück.
+});
+
+// 1
+// 2
+// 4
+// 6
+// 5
+// 3
+// ""
+
+ +

JSON.parse() erlaubt keine abschließenden Kommas

+ +
// Beides erzeugt einen Syntaxfehler
+JSON.parse("[1, 2, 3, 4, ]");
+JSON.parse("{ \"foo\" : 1, }");
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.12.2', 'JSON.parse')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.7.
{{SpecName('ES6', '#sec-json.parse', 'JSON.parse')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-json.parse', 'JSON.parse')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.JSON.parse")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/json/stringify/index.html b/files/de/web/javascript/reference/global_objects/json/stringify/index.html new file mode 100644 index 0000000000..1acea5bbd3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/json/stringify/index.html @@ -0,0 +1,310 @@ +--- +title: JSON.stringify() +slug: Web/JavaScript/Reference/Global_Objects/JSON/stringify +tags: + - JSON + - JavaScript + - Method + - Reference + - stringify +translation_of: Web/JavaScript/Reference/Global_Objects/JSON/stringify +--- +
{{JSRef}}
+ +

Die JSON.stringify() Methode konvertiert einen JavaScript-Wert in einen JSON-String. Optional werden Werte ersetzt, wenn eine Ersetzungsfunktion angegeben ist. Optional werden nur die angegebenen Eigenschaften einbezogen, wenn ein Ersetzungsarray angegeben ist.

+ +
{{EmbedInteractiveExample("pages/js/json-stringify.html")}}
+ + + +

Syntax

+ +
JSON.stringify(value[, replacer[, space]])
+ +

Parameter

+ +
+
value
+
Der Wert, der zu einem JSON-String konvertiert werden soll.
+
replacer {{optional_inline}}
+
Eine Funktion, die das Verhalten des String- Erstellungsprozesses verändert, oder ein Array von {{jsxref("String")}} und {{jsxref("Number")}} Objekten, die als Whiteliste für die Selektion von Eigenschaften des value Objektes fungiert, um nur bestimmte Eigenschaften im JSON-String aufzunehmen. Wenn dieser Parameter null ist oder nicht unterstützt wird, werden alle Eigenschaften des Objektes im JSON-String aufgenommen.
+
space {{optional_inline}}
+
Ein {{jsxref("String")}} oder {{jsxref("Number")}} Objekt, welches eingesetzt wird, um Whitespaces in den JSON-String für die Lesbarkeit hinzuzufügen. Wenn eine Number angegeben ist, bedeutet dies, dass die angegebene Anzahl an Leerzeichen hinzugefügt werden; Die Anzahl der Leerzeichen ist hierbei auf 10 begrenzt und wird bei einer größeren Anzahl auf 10 gesetzt. Werte kleiner als 1 bedeuten, dass keine Leerzeichen verwendet werden sollen. Wenn ein String angegeben wird, wird der String (oder die ersten 10 Zeichen des Strings, wenn er länger ist) als Leerzeichen benutzt. Wenn dieser Parameter null ist oder nicht unterstützt wird, werden keine Whitespaces verwendet.
+
+ +

Rückgabewert

+ +

Ein JSON-String, der den angegebenen Wert repräsentiert.

+ +

Fehler

+ +

Erzeugt einen {{jsxref("TypeError")}} ("cyclic object value") Fehler, wenn eine zyklische Referenz gefunden wird.

+ +

Beschreibung

+ +

JSON.stringify() konvertiert einen Wert in einen in JSON-Notation gleichwertigen Wert:

+ + + +
JSON.stringify({});                    // '{}'
+JSON.stringify(true);                  // 'true'
+JSON.stringify('foo');                 // '"foo"'
+JSON.stringify([1, 'false', false]);   // '[1,"false",false]'
+JSON.stringify([NaN, null, Infinity]); // '[null,null,null]'
+JSON.stringify({ x: 5 });              // '{"x":5}'
+
+JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))
+// '"2006-01-02T15:04:05.000Z"'
+
+JSON.stringify({ x: 5, y: 6 });
+// '{"x":5,"y":6}' or '{"y":6,"x":5}'
+JSON.stringify([new Number(1), new String('false'), new Boolean(false)]);
+// '[1,"false",false]'
+
+JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });
+// '{"x":[10,null,null,null]}'
+
+// Standard-Datenstrukturen
+JSON.stringify([new Set([1]), new Map([[1, 2]]), new WeakSet([{a: 1}]), new WeakMap([[{a: 1}, 2]])]);
+// '[{},{},{},{}]'
+
+// TypedArray
+JSON.stringify([new Int8Array([1]), new Int16Array([1]), new Int32Array([1])]);
+// '[{"0":1},{"0":1},{"0":1}]'
+JSON.stringify([new Uint8Array([1]), new Uint8ClampedArray([1]), new Uint16Array([1]), new Uint32Array([1])]);
+// '[{"0":1},{"0":1},{"0":1},{"0":1}]'
+JSON.stringify([new Float32Array([1]), new Float64Array([1])]);
+// '[{"0":1},{"0":1}]'
+
+// toJSON()
+JSON.stringify({ x: 5, y: 6, toJSON(){ return this.x + this.y} });
+// '11'
+
+// Symbols:
+JSON.stringify({ x: undefined, y: Object, z: Symbol('') });
+// '{}'
+JSON.stringify({ [Symbol('foo')]: 'foo' });
+// '{}'
+JSON.stringify({ [Symbol.for('foo')]: 'foo' }, [Symbol.for('foo')]);
+// '{}'
+JSON.stringify({ [Symbol.for('foo')]: 'foo' }, function(k, v) {
+  if (typeof k === 'symbol') {
+    return 'a symbol';
+  }
+});
+// '{}'
+
+// Nicht-enumerable Eigenschaften:
+JSON.stringify( Object.create(null, { x: { value: 'x', enumerable: false }, y: { value: 'y', enumerable: true } }) );
+// '{"y":"y"}'
+
+ +

Der replacer Parameter

+ +

Der replacer Parameter kann entweder eine Funktion oder ein Array sein. Als Funktion erhält diese zwei Parameter, den Schlüssel und den Wert, die in JSON konvertiert werden. Das Objekt, in dem der Schlüssel gefunden wurde, kann in der replacer Funktion mit this abgefragt werden. Initial wird die replacer Funktion mit einem leeren String als Schlüssel aufgerufen, was bedeutet, dass das Objekt konvertiert wird und dieses dann für alle Eigenschaften des Objektes oder Arrays die replacer Funktion aufruft. Die Funktion kann den Rückgabewert wie folgt zurückgeben, damit das Objekt zum JSON-String hinzugefügt wird:

+ + + +
Hinweis: Man kann eine replacer Funktion nicht nutzen, um Werte von Arrays zu entfernen. Wenn man undefined oder eine function zurückgibt, wird null zum JSON hinzugefügt.
+ +
Hinweis: Wenn man möchten, dass der Replacer ein initiales Objekt von einem Schlüssel mit einer leeren String-Eigenschaft unterscheidet (da beide den leeren String als Schlüssel und möglicherweise ein Objekt als Wert angeben würden), muss man den Anzahl der Iterationen verfolgen (wenn er jenseits der ersten Iteration ist, ist es ein echter leerer String-Schlüssel).
+ +

Beispiel mit einer Funktion

+ +
function replacer(key, value) {
+  if (typeof value === "string") {
+    return undefined;
+  }
+  return value;
+}
+
+var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
+var jsonString = JSON.stringify(foo, replacer);
+//  {"week":45,"month":7} 
+ +

Beispiel mit einem Array

+ +

Wenn replacer ein Array ist, geben die Werte des Arrays die Namen der Eigenschaften an, die im JSON-String mit aufgenommen werden sollen.

+ +
JSON.stringify(foo, ['week', 'month']);
+// '{"week":45,"month":7}', only keep "week" and "month" properties
+
+ +

Der space Parameter

+ +

Der space Parameter wird eingesetzt, um die Abstände in dem JSON-String zu beeinflussen. Wenn es eine Zahl ist, werden sukzessiv alle Stufen um die angegebene Anzahl von Leerzeichen (bis zu 10) eingerückt. Wenn space ein String ist, werden sukzessiv alle Stufen mit dem angegebenen String eingerückt (oder mit den ersten zehn Zeichen).

+ +
JSON.stringify({ a: 2 }, null, ' ');
+// '{
+//  "a": 2
+// }'
+
+ +

Einsatz eines Tab-Zeichens als Standard für leserliches Aussehen:

+ +
JSON.stringify({ uno: 1, dos: 2 }, null, '\t');
+// returns the string:
+// '{
+//     "uno": 1,
+//     "dos": 2
+// }'
+
+ +

toJSON() Verhalten

+ +

Wenn ein Objekt in ein JSON-String umgewandelt werden soll und eine Eigenschaft mit dem Namen toJSON, dessen Wert eine Funktion ist, wird die toJSON() Funktion eingesetzt um ein JSON-String zu erstellen: Anstatt, dass das Objekt normal serialisiert wird, wird die toJSON() Funktion aufgerufen und der Rückgabewert serialisiert. JSON.stringify ruft toJSON mit einem Parameter auf:

+ + + +

Zum Beispiel:

+ +
var obj = {
+    data: 'data',
+
+    toJSON(key){
+        if(key)
+            return `Now I am a nested Object under key '${key}'`;
+
+        else
+            return this;
+    }
+};
+
+JSON.stringify(obj);
+// Returns '{"data":"data"}'
+
+JSON.stringify({ obj });
+// Returns '{"obj":"Now I am a nested object under key 'obj'"}'
+
+JSON.stringify([ obj ])
+// Returns '["Now I am a nested object under key '0'"]'
+ +

Probleme mit JSON.stringify bei zyklischen Referenzen

+ +

Zu beachten ist, dass das JSON Format keine Objektreferenzen unterstützt (es existiert nur ein IETF Entwurf), so dass ein {{jsxref("TypeError")}} erzeugt wird, wenn ein Objekt mit zyklischen Referenzen übersetzt werden soll.

+ +
const circularReference = {};
+circularReference.myself = circularReference;
+
+// Serializing circular references throws "TypeError: cyclic object value"
+JSON.stringify(circularReference);
+
+ +

Um zyklische Referenzen zu Serialisieren, wird ein Bibliothek mit solchen Funktionen benötigt (z. B. cycle.js von Douglas Crockford) oder es muss eine eigene Lösung implementiert werden, welche zyklische Referenzen bei serialisierbaren Werten findet und ersetzt (oder entfernt).

+ +

Probleme mit reinem Einsatz von JSON.stringify für JavaScript

+ +

Man muss anmerken, dass JSON keine komplette strikte Untermenge von JavaScript ist (englisch). Es gibt nämlich zwei Zeilentrenner (Zeilentrenner und Paragraphentrenner), die in JSON nicht escaped werden müssen, in JavasScript jedoch schon. Wenn ein JSON nun ausgewertet oder direkt in JSONP eingesetzt werden soll, kann der folgende Quelltext verwendet werden:

+ +
function jsFriendlyJSONStringify (s) {
+    return JSON.stringify(s).
+        replace(/\u2028/g, '\\u2028').
+        replace(/\u2029/g, '\\u2029');
+}
+
+var s = {
+    a: String.fromCharCode(0x2028),
+    b: String.fromCharCode(0x2029)
+};
+try {
+    eval('(' + JSON.stringify(s) + ')');
+} catch (e) {
+    console.log(e); // "SyntaxError: unterminated string literal"
+}
+
+// kein catch benötigt
+eval('(' + jsFriendlyJSONStringify(s) + ')');
+
+// console.log in Firefox unescapes den Unicode wenn
+// in die Konsole geloggt wird, weshalb hier alert eingesetzt wird.
+alert(jsFriendlyJSONStringify(s)); // {"a":"\u2028","b":"\u2029"}
+ +

Beispiel für Einsatz von JSON.stringify() mit localStorage

+ +

In einem Fall, indem man ein Objekt speichern möchte, dass von einem Benutzer erstellt wurde, und dem Benutzer dieses auch nach dem Schließen des Browsers wieder zur Verfügung stellten möchte, ist ein Beispiel für die Anwendung von JSON.stringify():

+ +
// Creating an example of JSON
+var session = {
+  'screens': [],
+  'state': true
+};
+session.screens.push({ 'name': 'screenA', 'width': 450, 'height': 250 });
+session.screens.push({ 'name': 'screenB', 'width': 650, 'height': 350 });
+session.screens.push({ 'name': 'screenC', 'width': 750, 'height': 120 });
+session.screens.push({ 'name': 'screenD', 'width': 250, 'height': 60 });
+session.screens.push({ 'name': 'screenE', 'width': 390, 'height': 120 });
+session.screens.push({ 'name': 'screenF', 'width': 1240, 'height': 650 });
+
+// Konvertiert zu einem JSON-String mit JSON.stringify().
+// Dann wird der String des session-Objektes im localStorage gespeichert.
+localStorage.setItem('session', JSON.stringify(session));
+
+// Beispiel wie man den mit JSON.stringify() generierten und
+// im localStorage gespeicherten JSON-String in ein Objekt umwandelt.
+var restoredSession = JSON.parse(localStorage.getItem('session'));
+
+// Jetzt enthält die Variable restoredSession das im localStorage
+// abgespeicherte Objekt
+console.log(restoredSession);
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.12.3', 'JSON.stringify')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.7.
{{SpecName('ES6', '#sec-json.stringify', 'JSON.stringify')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-json.stringify', 'JSON.stringify')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.JSON.stringify")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/@@iterator/index.html b/files/de/web/javascript/reference/global_objects/map/@@iterator/index.html new file mode 100644 index 0000000000..8f480772d1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/@@iterator/index.html @@ -0,0 +1,102 @@ +--- +title: 'Map.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@iterator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@iterator +--- +
{{JSRef}}
+ +

Der initialewert der @@iterator Eigenschaft enthält das selbe Funktionsobjekt wie der Wert in der {{jsxref("Map.prototype.entries()", "entries")}} Methode.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-@@iterator.html")}}
+ + + +

Syntax

+ +
myMap[Symbol.iterator]
+ +

Rückgabewert

+ +

Die iterator Funktion von map ist im Standardfall die {{jsxref("Map.prototype.entries()", "entries()")}} Funktion.

+ +

Beispiele

+ +

Einsatz von [@@iterator]()

+ +
const myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+const mapIter = myMap[Symbol.iterator]();
+
+console.log(mapIter.next().value); // ["0", "foo"]
+console.log(mapIter.next().value); // [1, "bar"]
+console.log(mapIter.next().value); // [Object, "baz"]
+
+ +

Einsatz von [@@iterator]() mit for..of

+ +
const myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+for (const entry of myMap) {
+  console.log(entry);
+}
+// ["0", "foo"]
+// [1, "bar"]
+// [{}, "baz"]
+
+for (const [key, value] of myMap) {
+  console.log(`${key}: ${value}`);
+}
+// 0: foo
+// 1: bar
+// [Object]: baz
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype-@@iterator', 'Map.prototype[@@iterator]()')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype-@@iterator', 'Map.prototype[@@iterator]()')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.@@iterator")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/@@species/index.html b/files/de/web/javascript/reference/global_objects/map/@@species/index.html new file mode 100644 index 0000000000..8dc72de6bc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/@@species/index.html @@ -0,0 +1,72 @@ +--- +title: 'get Map[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@species +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@species +--- +
{{JSRef}}
+ +

Die Map[@@species] Zugriffseigenschaft gibt den Map Konstruktor zurück.

+ +

Syntax

+ +
Map[Symbol.species]
+
+ +

Beschreibung

+ +

Die species Zugriffseigenschaft gibt den Standard-Konstruktor für Map Objekte zurück. Konstruktoren von Unterklassen überschreiben diese Eigenschaft manchmal, um die Konstruktorzuweisung zu ändern.

+ +

Beispiele

+ +

Die species Eigenschaft gibt die Standard-Konstruktorfunktion, welches der Map Konstruktor von Map Objekten ist:

+ +
Map[Symbol.species]; // function Map()
+ +

In einem abgeleiteten Collection Objekt (z. B. eine Benutzerdifinierte Map MyMap) ist der species von MyMap der MyMap Konstruktor. Manchmal, wenn dieser Überschrieben wird das Eltern Map Objekt in der abgeleiteten Klassenmethode verwenden:

+ +
class MyMap extends Map {
+  // Overwrite MyMap species to the parent Map constructor
+  static get [Symbol.species]() { return Map; }
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-get-map-@@species', 'get Map [ @@species ]')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-map-@@species', 'get Map [ @@species ]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Map.@@species")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/@@tostringtag/index.html b/files/de/web/javascript/reference/global_objects/map/@@tostringtag/index.html new file mode 100644 index 0000000000..50d1515963 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/@@tostringtag/index.html @@ -0,0 +1,58 @@ +--- +title: 'Map.prototype[@@toStringTag]' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@toStringTag +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@toStringTag +--- +
{{JSRef}}
+ +

Die Map[@@toStringTag] Eigenschaft hat den initialen Wert "Map".

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-@@tostringtag.html")}}
+ + + +
{{js_property_attributes(0,0,1)}}
+ +

Syntax

+ +
Map[Symbol.toStringTag]
+ +

Beispiele

+ +
Object.prototype.toString.call(new Map()) // "[object Map]"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype-@@tostringtag', 'Map.prototype[@@toStringTag]')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype-@@tostringtag', 'Map.prototype[@@toStringTag]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.@@toStringTag")}}

diff --git a/files/de/web/javascript/reference/global_objects/map/clear/index.html b/files/de/web/javascript/reference/global_objects/map/clear/index.html new file mode 100644 index 0000000000..6ae31b4dee --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/clear/index.html @@ -0,0 +1,77 @@ +--- +title: Map.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/Map/clear +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/clear +--- +
{{JSRef}}
+ +

Die clear() Methode entfernt alle Elemente von einem Map Objekt.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-clear.html")}}
+ + + +

Syntax

+ +
myMap.clear();
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Beispiele

+ +

Einsatz der clear Methode

+ +
var myMap = new Map();
+myMap.set('bar', 'baz');
+myMap.set(1, 'foo');
+
+myMap.size;       // 2
+myMap.has('bar'); // true
+
+myMap.clear();
+
+myMap.size;       // 0
+myMap.has('bar')  // false
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.clear', 'Map.prototype.clear')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.clear', 'Map.prototype.clear')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.clear")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/delete/index.html b/files/de/web/javascript/reference/global_objects/map/delete/index.html new file mode 100644 index 0000000000..40f38a6931 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/delete/index.html @@ -0,0 +1,73 @@ +--- +title: Map.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/Map/delete +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete +--- +
{{JSRef}}
+ +

Die delete() Methode entfernt das Element mit eine bestimmten Schlüssel von einem Map Objekt.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-delete.html")}}
+ + + +

Syntax

+ +
myMap.delete(key);
+ +

Parameter

+ +
+
key
+
Der Schlüssel des Element, welches aus dem Map Objekt entfernt wird.
+
+ +

Rückgabewert

+ +

Gibt true zurück, wenn ein Element in der Map existiert und gelöscht wird, oder false wenn kein Element existiert.

+ +

Beispiele

+ +

Einsatz der delete Methode

+ +
var myMap = new Map();
+myMap.set('bar', 'foo');
+
+myMap.delete('bar'); // Returns true. Successfully removed.
+myMap.has('bar');    // Returns false. The "bar" element is no longer present.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-map.prototype.delete', 'Map.prototype.delete')}}
{{SpecName('ES2015', '#sec-map.prototype.delete', 'Map.prototype.delete')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.delete")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/entries/index.html b/files/de/web/javascript/reference/global_objects/map/entries/index.html new file mode 100644 index 0000000000..018cd8088a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/entries/index.html @@ -0,0 +1,78 @@ +--- +title: Map.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Map/entries +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries +--- +
{{JSRef}}
+ +

Die entries() Methode gibt ein neues Iterator Objekt mit allen [Schlüssel, Wert] Paaren von jedem Element in dem Map Objekt in Einfügereihenfolge zurück.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-entries.html")}}
+ + + +

Syntax

+ +
myMap.entries()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Map")}} Iterator Objekt.

+ +

Beispiele

+ +

Einsatz von entries()

+ +
var myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+var mapIter = myMap.entries();
+
+console.log(mapIter.next().value); // ["0", "foo"]
+console.log(mapIter.next().value); // [1, "bar"]
+console.log(mapIter.next().value); // [Object, "baz"]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.entries', 'Map.prototype.entries')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.entries', 'Map.prototype.entries')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.entries")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/foreach/index.html b/files/de/web/javascript/reference/global_objects/map/foreach/index.html new file mode 100644 index 0000000000..017fa9b069 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/foreach/index.html @@ -0,0 +1,104 @@ +--- +title: Map.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Map/forEach +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach +--- +
{{JSRef}}
+ +

Die forEach() Methode führt eine übergebene Funktion für jedes Schlüssel/Wert Paar in dem Map Objekt in der Einfügereihenfolge aus.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-foreach.html")}}
+ + + +

Syntax

+ +
myMap.forEach(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die für jedes Schlüssel/Werte-Paar aufgerufen wird.
+
thisArg
+
Wert, der bei der Ausführung der callback-Funktion als this genutzt wird.
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Beschreibung

+ +

Die forEach Methode ruft die übergebene Funktion für jedes Schlüssel/Wert Paar in dem Map Objekt aus. Die callback Funktion wird nicht aufgerufen, wenn der Schlüssel gelöscht wurde. Sie wird aber aufgerufen, wenn der aktuelle Wert undefined ist.

+ +

Die callback Funktion wird mit drei Parametern aufgerufen:

+ + + +

Wenn der thisArg-Parameter an forEach übergeben wird, wird er auch an die callback-Funktion als deren this Wert weitergegeben.  Andernfalls wird dafür undefined genutzt.  Der this-Wert, der in der callback-Funktion wahrgenommen wird, ist festgelegt durch die generellen Regeln für die Nutzung von this in einer Funktion.

+ +

Jeder Wert wird einmal besucht, mit Außnahme von Fällen, in denen ein Wert glöscht und neu hinzugefügt wird, bevor forEach fertig ist. Die callback Funktion wird nicht für Wert aufgerufen, die vorher gelöscht wurden. Neue Werte, die vor der Beendigung von forEach hinzugefügt werden, werden berücksichtigt.

+ +

Die forEach Methode ruft callback für jedes Element in dem Map Objekt aus.  forEach gibt keinen Wert zurück.

+ +

Beispiele

+ +

Ausgabe der Inhalte eines Map Objekts

+ +

Der folgende Code gibt für jedes Element in der Map eine Nachricht in der Konsole aus.

+ +
function logMapElements(value, key, map) {
+    console.log(`m[${key}] = ${value}`);
+}
+new Map([['foo', 3], ['bar', {}], ['baz', undefined]]).forEach(logMapElements);
+// logs:
+// "m[foo] = 3"
+// "m[bar] = [object Object]"
+// "m[baz] = undefined"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.forEach")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/get/index.html b/files/de/web/javascript/reference/global_objects/map/get/index.html new file mode 100644 index 0000000000..c178c59f0b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/get/index.html @@ -0,0 +1,80 @@ +--- +title: Map.prototype.get() +slug: Web/JavaScript/Reference/Global_Objects/Map/get +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/get +--- +
{{JSRef}}
+ +

Die get() Methode gibt eine Spezielles Element aus einem Map Objekt zurück.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-get.html")}}
+ + + +

Syntax

+ +
myMap.get(schlüssel);
+ +

Parameter

+ +
+
schlüssel
+
Der Schlüssel eines Elements, welches aus der Map zurückgegeben wird.
+
+ +

Rückgabewert

+ +

Gibt das Element zurück, welches zu dem Schlüssel gehört oder undefined, wenn kein Schlüssel in dem Map Objekt vorhanden ist.

+ +

Beispiele

+ +

Einsatz der get Methode

+ +
var myMap = new Map();
+myMap.set('bar', 'foo');
+
+myMap.get('bar');  // Returns "foo".
+myMap.get('baz');  // Returns undefined.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.get', 'Map.prototype.get')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.get', 'Map.prototype.get')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.get")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/has/index.html b/files/de/web/javascript/reference/global_objects/map/has/index.html new file mode 100644 index 0000000000..ea4df56c27 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/has/index.html @@ -0,0 +1,83 @@ +--- +title: Map.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/Map/has +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/has +--- +
{{JSRef}}
+ +

Die has() Methode gibt einen boolean zurück, welcher angibt, ob ein spezieller Schlüssel vorhanden ist oder nicht.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-has.html")}}
+ + + +

Syntax

+ +
myMap.has(schlüssel);
+ +

Parameter

+ +
+
schlüssel
+
Der Schlüssel, auf dessen Präsenz in dem Map Objekt geprüft wird.
+
+ +

Return value

+ +
+
Boolean
+
Gibt true zurück, wenn ein Element mit Schlüssel in dem Map Objekt existiert, andernfalls false.
+
+ +

Beispiele

+ +

Einsatz der has Methode

+ +
var myMap = new Map();
+myMap.set('bar', "foo");
+
+myMap.has('bar');  // returns true
+myMap.has('baz');  // returns false
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.has', 'Map.prototype.has')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.has', 'Map.prototype.has')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.has")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/index.html b/files/de/web/javascript/reference/global_objects/map/index.html new file mode 100644 index 0000000000..3cfa11c840 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/index.html @@ -0,0 +1,207 @@ +--- +title: Map +slug: Web/JavaScript/Reference/Global_Objects/Map +tags: + - ECMAScript 2015 + - JavaScript + - Map +translation_of: Web/JavaScript/Reference/Global_Objects/Map +--- +
{{JSRef}}
+ +
Das Map Objekt ist eine einfache Schlüssel/Wert Zuordnung. Jeder Wert (Sowohl Objekte, als auch  {{Glossary("Primitive", "primitive Datentypen")}}) kann als Schlüssel/Wert verwendet werden.
+ +

Syntax

+ +
new Map([iterable])
+ +

Parameter

+ +
+
iterable
+
+

Der Parameter iterable ist ein Array oder anderes iterierbares Objekt, dessen Elemente Schlüssel-Wert Paare (2-Element Arrays) sind. Jedes Schlüssel-Wert Paar wird der neuen Map hinzugefügt.

+
+
+ +

Beschreibung

+ +

Ein Map Object iteriert in der Reihenfolge des Einfügens über seine Elemente — eine {{jsxref("Statements/for...of", "for...of")}} Schleife gibt ein Array mit [key, value] für jede Iteration zurück.

+ +

Es ist festzuhalten, dass eine Map, bestehend aus objects, insbesondere ein "dictionary of dictionaries", nur nach der Einfügereihenfolge angelegt wird, die zufällig und ungeordnet ist.

+ +

Schlüsselvergleich

+ +

Der Schlüsselvergleich basiert auf dem "gleicher-Wert" Algorithmus: NaN wird als gleich mit einer anderen NaN angesehen (trotz dem, dass NaN !== NaN) und alle anderen Werte müssen typ- und wert identisch, wie beim === Operator, sein. In der aktuellen ECMAScript Spezifikation werden -0 und +0 als gleich behandelt, auch wenn dies in früheren Entwürfen anders war. Details dazu sind der Tabelle browser compatibility zu entnehmen. 

+ +

Objects und Maps im Vergleich

+ +

{{jsxref("Object", "Objects")}} und Maps haben einige gemeinsame Eigenschaften. In beiden lassen sich Schlüssel auf Werte setzen, diese Werte wiederfinden, Schlüssel löschen und herausfinden, ob etwas unter einem bestimmten Schlüssel gespeichert ist. Aus diesem Grund (und weil es keine spracheigenen Alternativen gab) wurden früher Objects als Maps benutzt. Doch es gibt bedeutende Unterschiede zwischen diesen beiden Strukturen, die es in verschiedenen Fällen zu beachten gilt:

+ + + +

Eigenschaften

+ +
+
Map.length
+
Der Wert von length beträgt 0.
+
{{jsxref("Map.@@species", "get Map[@@species]")}}
+
Die Konstruktor-Funktion, zum Erzeugen abgeleiteter Objekte.
+
{{jsxref("Map.prototype")}}
+
Repräsentiert den Prototyp für den Map Konstruktor. Erlaubt das Hinzufügen von Eigenschaften zu allen Map Objekten.
+
+ +

Map Instanzen

+ +

Alle Map Instanzen erben von {{jsxref("Map.prototype")}}.

+ +

Eigenschaften

+ +

{{page('/de/Web/JavaScript/Reference/Global_Objects/Map/prototype','Eigenschaften')}}

+ +

Methoden

+ +

{{page('/de/Web/JavaScript/Reference/Global_Objects/Map/prototype','Methoden')}}

+ +

Beispiele

+ +

Einsatz vom Map Objekt

+ +
var myMap = new Map();
+
+var keyString = "ein string",
+    keyObj = {},
+    keyFunc = function () {};
+
+// setting the values
+myMap.set(keyString, "value associated with 'ein string'");
+myMap.set(keyObj, "value associated with keyObj");
+myMap.set(keyFunc, "value associated with keyFunc");
+
+myMap.size; // 3
+
+// getting the values
+myMap.get(keyString);    // "value associated with 'ein string'"
+myMap.get(keyObj);       // "value associated with keyObj"
+myMap.get(keyFunc);      // "value associated with keyFunc"
+
+myMap.get("ein string");   // "value associated with 'ein string'"
+                         // because keyString === 'ein string'
+myMap.get({});           // undefined, because keyObj !== {}
+myMap.get(function() {}) // undefined, because keyFunc !== function () {}
+
+ +

Benutzung von NaN als Map Schlüssel

+ +

NaN kann auch als Schlüssel benutzt werden. Auch wenn jede NaN nicht gleich zu sich selbst ist (NaN !== NaN is true) funktioniert das folgende Beispiel, da NaNs ununterscheidbar von jeder anderen ist:

+ +
var myMap = new Map();
+myMap.set(NaN, "not a number");
+
+myMap.get(NaN); // "not a number"
+
+var otherNaN = Number("foo");
+myMap.get(otherNaN); // "not a number"
+
+ +

Iterieren über Maps mit for..of

+ +

Über Maps kann mit der for..of Schleife iteriert werden:

+ +
var myMap = new Map();
+myMap.set(0, "zero");
+myMap.set(1, "one");
+for (var [key, value] of myMap) {
+  console.log(key + " = " + value);
+}
+// 0 = zero
+// 1 = one
+
+for (var key of myMap.keys()) {
+  console.log(key);
+}
+// 0
+// 1
+
+for (var value of myMap.values()) {
+  console.log(value);
+}
+// zero
+// one
+
+for (var [key, value] of myMap.entries()) {
+  console.log(key + " = " + value);
+}
+// 0 = zero
+// 1 = one
+
+ +

Integration von Maps mit forEach()

+ +

Über Maps kann mit der forEach() method iteriert werden:

+ +
myMap.forEach(function(value, key) {
+  console.log(key + " = " + value);
+}, myMap)
+// Will show 2 logs; first with "0 = zero" and second with "1 = one"
+
+ +

Relation mit Array Objekten

+ +
var kvArray = [['key1', 'value1'], ['key2', 'value2']];
+
+// Use the regular Map constructor to transform a 2D key-value Array into a map
+var myMap = new Map(kvArray);
+
+myMap.get('key1'); // returns "value1"
+
+// Use the Array.from function to transform a map into a 2D key-value Array
+console.log(Array.from(myMap)); // Will show you exactly the same Array as kvArray
+
+// Or use the keys or values iterators and convert them to an array
+console.log(Array.from(myMap.keys())); // Will show ["key1", "key2"]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map-objects', 'Map')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map-objects', 'Map')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/keys/index.html b/files/de/web/javascript/reference/global_objects/map/keys/index.html new file mode 100644 index 0000000000..0f8187752b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/keys/index.html @@ -0,0 +1,69 @@ +--- +title: Map.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Map/keys +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/keys +--- +
{{JSRef}}
+ +

Die Methode keys() gibt ein neues Iterator Objekt zurück, das die Schlüssel für alle Elemente des Map Objekts in der Reihenfolge des Einfügens enthält.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-keys.html")}}
+ + + +

Syntax

+ +
myMap.keys()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Map")}} Iterator-Objekt.

+ +

Beispiele

+ +

Verwendung von keys()

+ +
var myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+var mapIter = myMap.keys();
+
+console.log(mapIter.next().value); // "0"
+console.log(mapIter.next().value); // 1
+console.log(mapIter.next().value); // Object
+
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-map.prototype.keys', 'Map.prototype.keys')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.keys")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/prototype/index.html b/files/de/web/javascript/reference/global_objects/map/prototype/index.html new file mode 100644 index 0000000000..1c7b6350cf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/prototype/index.html @@ -0,0 +1,86 @@ +--- +title: Map.prototype +slug: Web/JavaScript/Reference/Global_Objects/Map/prototype +tags: + - JavaScript + - Map + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Map +--- +
{{JSRef}}
+ +

Die Map.prototype Eigenschaft repräsentiert den Prototyp für den {{jsxref("Map")}} Konstruktor.

+ +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

{{jsxref("Map")}} Instanzen erben von {{jsxref("Map.prototype")}}. Man kann das prototype Objekt des Konstruktors nutzen, um Eigenschaften oder Methoden für alle map Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
Map.prototype.constructor
+
Gibt die Funktion zurück, die einen Instanzenprototype erstellt. Der Standardwert ist die {{jsxref("Map")}} Funktion.
+
{{jsxref("Map.prototype.size")}}
+
Gibt die Anzahl an Schlüssel/Werte-Paaren in dem Map Objekt zurück.
+
+ +

Methoden

+ +
+
{{jsxref("Map.prototype.clear()")}}
+
Entfernt alle Schlüssel/Werte-Paare von dem Map Objekt.
+
{{jsxref("Map.delete", "Map.prototype.delete(schlüssel)")}}
+
Gibt true zurück, wenn ein Element im Map Objekt existiert und gelöscht wird, oder false wenn das Element nicht existiert. Map.prototype.has(schlüssel) wird danach false zurückgeben.
+
{{jsxref("Map.prototype.entries()")}}
+
Gibt ein neues Iterator Objekt mit allen [Schlüssel, Wert] Paaren als Array von jedem Element in dem Map Objekt in Einfügereihenfolge zurück.
+
{{jsxref("Map.forEach", "Map.prototype.forEach(callbackFn[, thisArg])")}}
+
Ruft callbackFn einmal für jedes Schlüssel/Wert Paar in dem Map Objekt in der Einfügereihenfolge aus. Wenn ein thisArg Parameter angegeben ist, wird dieser als this für jeden Funktionsaufruf benutzt.
+
{{jsxref("Map.get", "Map.prototype.get(schlüssel)")}}
+
Gibt den Wert zu dem zugehörigen schlüssel zurück oder undefined wenn dieser nicht existiert.
+
{{jsxref("Map.has", "Map.prototype.has(schlüssel)")}}
+
Gibt einen boolean zurück, der angibt, ob ein Wert mit den schlüssel in einem Map Objekt vorhanden ist oder nicht.
+
{{jsxref("Map.prototype.keys()")}}
+
Gibt ein neues Iterator Objekt mit allen Schlüsseln von jedem Element in dem Map Objekt in Einfügereihenfolge zurück.
+
{{jsxref("Map.set", "Map.prototype.set(schlüssel, wert)")}}
+
Setzt den wert für einen schlüssel im Map Objekt. Gibt das Map Objekt zurück.
+
{{jsxref("Map.prototype.values()")}}
+
Gibt ein neues Iterator Objekt mit allen Werten von jedem Element in dem Map Objekt in Einfügereihenfolge zurück.
+
{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}
+
Gibt ein neues Iterator Objekt mit allen [Schlüssel, Wert] Paaren als Array von jedem Element in dem Map Objekt in Einfügereihenfolge zurück.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype', 'Map.prototype')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype', 'Map.prototype')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.prototype")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/set/index.html b/files/de/web/javascript/reference/global_objects/map/set/index.html new file mode 100644 index 0000000000..dd675fab69 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/set/index.html @@ -0,0 +1,96 @@ +--- +title: Map.prototype.set() +slug: Web/JavaScript/Reference/Global_Objects/Map/set +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/set +--- +
{{JSRef}}
+ +

Die set() Methode fügt ein ELement mit einem spezifischen schlüssel und wert zu einem Map Objekt hinzu oder aktualisiert es.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-set.html")}}
+ + + +

Syntax

+ +
myMap.set(schlüssel, wert);
+ +

Parameter

+ +
+
schlüssel
+
Der Schlüssel des Elementes, welches zu dem Map Objekt hinzugefügt wird.
+
wert
+
Der Wert des Elementes, welches zu dem Map Objekt hinzugefügt wird.
+
+ +

Rückgabewert

+ +

Das Map Objekt.

+ +

Beispiele

+ +

Einsatz der set Methode

+ +
var myMap = new Map();
+
+// Fügt ein neues Element hinzu
+myMap.set('bar', 'foo');
+myMap.set(1, 'foobar');
+
+// Aktualisiert ein Element
+myMap.set('bar', 'baz');
+
+ +

Einsatz der set Methode mit Verkettung

+ +

Seit die set() Methode das selbe Map Objekt zurück gibt, kann die Methode wie folgt verkettet aufgerufen werden.

+ +
// Fügt neue Element mit verketteten Aufruf hinzu.
+myMap.set('bar', 'foo')
+     .set(1, 'foobar')
+     .set(2, 'baz');
+
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.set', 'Map.prototype.set')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.set")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/size/index.html b/files/de/web/javascript/reference/global_objects/map/size/index.html new file mode 100644 index 0000000000..3f859dcde5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/size/index.html @@ -0,0 +1,67 @@ +--- +title: Map.prototype.size +slug: Web/JavaScript/Reference/Global_Objects/Map/size +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Map/size +--- +
{{JSRef}}
+ +

Die size Zugriffseigenschaft gibt die Anzahl der Elemente in einem {{jsxref("Map")}} Objekt zurück.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-size.html")}}
+ + + +

Beschreibung

+ +

Der Wert von size ist eine ganze Zahl, die angibt, wie viele Einträge ein Map Objekt hat. Die set-Zugriffsfunktion für size ist undefined; diese Eigenschaft kann nicht geändert werden.

+ +

Beispiele

+ +

Einsatz von size

+ +
var myMap = new Map();
+myMap.set('a', 'alpha');
+myMap.set('b', 'beta');
+myMap.set('g', 'gamma');
+
+myMap.size // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-get-map.prototype.size', 'Map.prototype.size')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-get-map.prototype.size', 'Map.prototype.size')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.size")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/map/values/index.html b/files/de/web/javascript/reference/global_objects/map/values/index.html new file mode 100644 index 0000000000..3cbe8dd064 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/map/values/index.html @@ -0,0 +1,77 @@ +--- +title: Map.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Map/values +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/values +--- +
{{JSRef}}
+ +

Die values() Methode gibt ein neues Iterator Objekt mit allen Werten aller Elemente des Map Objektes in Einfügereihenfolge zurück.

+ +
{{EmbedInteractiveExample("pages/js/map-prototype-values.html")}}
+ + + +

Syntax

+ +
myMap.values()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Map")}} Iterator Objekt.

+ +

Beispiele

+ +

Einsatz von values()

+ +
var myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+var mapIter = myMap.values();
+
+console.log(mapIter.next().value); // "foo"
+console.log(mapIter.next().value); // "bar"
+console.log(mapIter.next().value); // "baz"
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-map.prototype.values', 'Map.prototype.values')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-map.prototype.values', 'Map.prototype.values')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Map.values")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/acos/index.html b/files/de/web/javascript/reference/global_objects/math/acos/index.html new file mode 100644 index 0000000000..3512f639b1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/acos/index.html @@ -0,0 +1,103 @@ +--- +title: Math.acos() +slug: Web/JavaScript/Reference/Global_Objects/Math/acos +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/acos +--- +
{{JSRef}}
+ +

Die Funktion Math.acos() gibt den Arkuskosinus (im Radiantenmaß) einer Zahl zurück:

+ +

x[-1;1],Math.acos(x)=arccos(x)= das gleiche y[0;π]derart, dasscos(y)=x\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.acos}(x)} = \arccos(x) = \text{ das gleiche } \; y \in [0; \pi] \, \text{derart, dass} \; \cos(y)

+ +
{{EmbedInteractiveExample("pages/js/math-acos.html")}}
+ + + +

Syntax

+ +
Math.acos(x) 
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der Arkuskosinus (im Radiantenmaß) der übergebenen Zahl, wenn diese zwischen -1 und 1 ist. Anderfalls wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Die acos Methode gibt einen numerischen Wert zwischen 0 und {{jsxref("Math/PI", "Pi")}} im Radiantenmaß für x Werte zwischen -1 und 1 zurück.  Wenn der übergebene Wert außerhalb dieses Bereiches liegt, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Weil acos eine statische Methode von Math ist, kann dieses immer mit Math.acos() genutzt werden, ohne dass ein Objekt von Math erstellt werden muss (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Beispiel: Math.acos benutzen

+ +
Math.acos(-2);  // NaN
+Math.acos(-1);  // 3.141592653589793
+Math.acos(0);   // 1.5707963267948966
+Math.acos(0.5); // 1.0471975511965979
+Math.acos(1);   // 0
+Math.acos(2);   // NaN
+
+ +

Für Werte kleiner -1 oder größer 1 gibt Math.acos {{jsxref("Global_Objects/NaN", "NaN")}} zurück.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.2', 'Math.acos')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.acos', 'Math.acos')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.acos', 'Math.acos')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.acos")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/acosh/index.html b/files/de/web/javascript/reference/global_objects/math/acosh/index.html new file mode 100644 index 0000000000..46703ec486 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/acosh/index.html @@ -0,0 +1,98 @@ +--- +title: Math.acosh() +slug: Web/JavaScript/Reference/Global_Objects/Math/acosh +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/acosh +--- +
{{JSRef}}
+ +

Die Funktion Math.acosh() gibt den hyperbolischen Arkuskosinus einer Zahl zurück:

+ +

x1,Math.acosh(x)=arcosh(x)= das Ergebnis y0so  dasscosh(y)=x\forall x \geq 1, \mathtt{\operatorname{Math.acosh}(x)} = \operatorname{arcosh}(x) = \text{ the unique } \; y \geq 0 \; \text{such that} \; \cosh(y) = x

+ +
{{EmbedInteractiveExample("pages/js/math-acosh.html")}}
+ + + +

Syntax

+ +
Math.acosh(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der hyperbolische Arkuskosinus der übergebenen Zahl. Wenn die Zahl kleiner als 1 ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Weil acosh() eine statische Methode von Math ist, muss diese immer mit Math.acosh() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.acosh()

+ +
Math.acosh(-1); // NaN
+Math.acosh(0);  // NaN
+Math.acosh(0.5) // NaN
+Math.acosh(1);  // 0
+Math.acosh(2);  // 1.3169578969248166
+
+ +

Für Werte kleiner 1 Math.acosh() gibt Math.acosh {{jsxref("NaN")}} zurück.

+ +

Polyfill

+ +

Für x1x \geq 1 gilt: arcosh(x)=ln(x+x2-1)\operatorname {arcosh} (x) = \ln \left(x + \sqrt{x^{2} - 1} \right), daher kann dieses mit der folgenden Funktion emuliert werden:

+ +
Math.acosh = Math.acosh || function(x) {
+  return Math.log(x + Math.sqrt(x * x - 1));
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-math.acosh', 'Math.acosh')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.acosh', 'Math.acosh')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.acosh")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/asin/index.html b/files/de/web/javascript/reference/global_objects/math/asin/index.html new file mode 100644 index 0000000000..bf69f52450 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/asin/index.html @@ -0,0 +1,103 @@ +--- +title: Math.asin() +slug: Web/JavaScript/Reference/Global_Objects/Math/asin +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/asin +--- +
{{JSRef}}
+ +

Die Funktion Math.asin() gibt den Arkussinus (im Radiantenmaß) einer Zahl zurück:

+ +

x[-1;1],Math.asin(x)=arcsin(x)= das Ergebnis y[-π2;π2]so  dasssin(y)=x\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.asin}(x)} = \arcsin(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \sin(y) = x

+ +
{{EmbedInteractiveExample("pages/js/math-asin.html")}}
+ + + +

Syntax

+ +
Math.asin(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der Arkussinus (im Radiantenmaß) der übergebenen Zahl, die zwischen -1 und 1 liegt. Andernfalls wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Die Math.asin() Methode gibt einen numerischen Wert zwischen -π2-\frac{\pi}{2} und π2\frac{\pi}{2} im Radiantenmaß für x Werte zwischen -1 und 1 zurück. Wenn der übergebene Wert außerhalb dieses Bereiches liegt, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Weil asin() eine statische Methode von Math ist, muss diese immer mit Math.asin() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.asin()

+ +
Math.asin(-2);  // NaN
+Math.asin(-1);  // -1.5707963267948966 (-pi/2)
+Math.asin(0);   // 0
+Math.asin(0.5); // 0.5235987755982989
+Math.asin(1);   // 1.5707963267948966 (pi/2)
+Math.asin(2);   // NaN
+
+ +

Für Werte kleiner -1 oder größer als 1 gibt Math.asin() {{jsxref("NaN")}} zurück.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.3', 'Math.asin')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.asin', 'Math.asin')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.asin', 'Math.asin')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.asin")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/asinh/index.html b/files/de/web/javascript/reference/global_objects/math/asinh/index.html new file mode 100644 index 0000000000..fa5e1d0472 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/asinh/index.html @@ -0,0 +1,99 @@ +--- +title: Math.asinh() +slug: Web/JavaScript/Reference/Global_Objects/Math/asinh +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/asinh +--- +
{{JSRef}}
+ +

Die Funktion Math.asinh() gibt den hyperbolische Arkussinus (im Radiantenmaß) einer Zahl zurück:

+ +

Math.asinh(x)=arcsinh(x)= das Ergebnis yso  dasssinh(y)=x\mathtt{\operatorname{Math.asinh}(x)} = \operatorname{arsinh}(x) = \text{ the unique } \; y \; \text{such that} \; \sinh(y) = x

+ +
{{EmbedInteractiveExample("pages/js/math-asinh.html")}}
+ + + +

Syntax

+ +
Math.asinh(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der hyperbolische Arkussinus der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil asinh() eine statische Methode von Math ist, muss diese immer mit Math.asinh() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.asinh()

+ +
Math.asinh(1);  // 0.881373587019543
+Math.asinh(0);  // 0
+
+ +

Polyfill

+ +

Es gilt: arsinh(x)=ln(x+x2+1). Daher kann asinh mit der folgenden Funktion emuliert werden:

+ +
Math.asinh = Math.asinh || function(x) {
+  if (x === -Infinity) {
+    return x;
+  } else {
+    return Math.log(x + Math.sqrt(x * x + 1));
+  }
+};
+
+ +

Die formale Korrektheit hängt von einer Reihe von Problemen mit Floating-Point-Berechnungen ab. Genaue Ergebnisse erfordern die Behandlung von positiven/negativen, kleinen/großen Argumenten, wie es in glibc oder GNU Scientific Library vorhanden ist.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-math.asinh', 'Math.asinh')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.asinh', 'Math.asinh')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.asinh")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/atan/index.html b/files/de/web/javascript/reference/global_objects/math/atan/index.html new file mode 100644 index 0000000000..1c37c3dcc4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/atan/index.html @@ -0,0 +1,105 @@ +--- +title: Math.atan() +slug: Web/JavaScript/Reference/Global_Objects/Math/atan +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan +--- +
{{JSRef}}
+ +

Die Funktion Math.atan() gibt den Arkustangens (im Radiantenmaß) einer Zahl zurück:

+ +

Math.atan(x)=arctan(x)= das Ergebnis y[-π2;π2]so  dasstan(y)=x\mathtt{\operatorname{Math.atan}(x)} = \arctan(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \tan(y) = x

+ +
{{EmbedInteractiveExample("pages/js/math-atan.html")}}
+ + + +

Syntax

+ +
Math.atan(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der Arkustangens (im Radiantenmaß) der übergebenen Zahl.

+ +

Beschreibung

+ +

Die Math.atan() Methode gibt einen numerischen Wert zwischen -π2-\frac{\pi}{2} und π2\frac{\pi}{2} im Radiantenmaß zurück.

+ +

Weil atan() eine statische Methode von Math ist, muss diese immer mit Math.atan() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.atan()

+ +
Math.atan(1);   // 0.7853981633974483
+Math.atan(0);   // 0
+Math.atan(-0);  // -0
+
+Math.atan(Infinity);   //  1.5707963267948966
+Math.atan(-Infinity);  // -1.5707963267948966
+
+// The angle that the line [(0,0);(x,y)] forms with the x-axis in a Cartesian coordinate system
+Math.atan(y / x);
+ +

Beachten Sie, dass es manchmal aus stilistischen Gründen gewollt ist, dass ±Infinity vermieden werden soll. In diesen Fällen kann die Funktion {{jsxref("Math.atan2()")}} mit 0 als zweiten Parameter bessere Ergebnisse liefern.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.4', 'Math.atan')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.atan', 'Math.atan')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.atan', 'Math.atan')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.atan")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/atan2/index.html b/files/de/web/javascript/reference/global_objects/math/atan2/index.html new file mode 100644 index 0000000000..5848a76898 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/atan2/index.html @@ -0,0 +1,113 @@ +--- +title: Math.atan2() +slug: Web/JavaScript/Reference/Global_Objects/Math/atan2 +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan2 +--- +
{{JSRef}}
+ +

Die Funktion Math.atan2() gibt den Arkustangens (im Radiantenmaß) des Quotienten der Parameter zurück.

+ +
{{EmbedInteractiveExample("pages/js/math-atan2.html")}}
+ + + +

Syntax

+ +
Math.atan2(y, x)
+ +

Parameter

+ +
+
y
+
Eine Zahl.
+
x
+
Eine zweite Zahl.
+
+ +

Rückgabewert

+ +

Der Arkustangens des Quotienten der übergebenen Parameter.

+ +

Beschreibung

+ +

Die Math.atan2() Methode gibt einen numerischen Wert zwischen -π und π zurück, welcher den Winkel Theta eines (x, y) Punktes wiedergibt. Dies ist der Radius entgegen dem Uhrzeigersinn, gemessen in Radianten, zwischen der positiven x Achse, und des Punktes (x, y). Beachte, dass bei der Funktion der erste Parameter die y Koordinate und der zweite die x Koordinate ist.

+ +

Ein einfaches Diagramm welches den zurückgegebenen Winkel von atan2(y, x) zeigt

+ +

Bei Math.atan2() wird x und y separat übergeben, bei Math.atan() hingegen wird das Verhältnis der zwei Parameter übergeben.

+ +

Weil atan2() eine statische Methode von Math ist, muss diese immer mit Math.atan2() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.atan2()

+ +
Math.atan2(90, 15); // 1.4056476493802699
+Math.atan2(15, 90); // 0.16514867741462683
+
+Math.atan2(±0, -0);               // ±PI.
+Math.atan2(±0, +0);               // ±0.
+Math.atan2(±0, -x);               // ±PI for x > 0.
+Math.atan2(±0, x);                // ±0 for x > 0.
+Math.atan2(-y, ±0);               // -PI/2 for y > 0.
+Math.atan2(y, ±0);                // PI/2 for y > 0.
+Math.atan2(±y, -Infinity);        // ±PI for finite y > 0.
+Math.atan2(±y, +Infinity);        // ±0 for finite y > 0.
+Math.atan2(±Infinity, x);         // ±PI/2 for finite x.
+Math.atan2(±Infinity, -Infinity); // ±3*PI/4.
+Math.atan2(±Infinity, +Infinity); // ±PI/4.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.5', 'Math.atan2')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.atan2', 'Math.atan2')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.atan2', 'Math.atan2')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.atan2")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/cbrt/index.html b/files/de/web/javascript/reference/global_objects/math/cbrt/index.html new file mode 100644 index 0000000000..a24c572eb7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/cbrt/index.html @@ -0,0 +1,98 @@ +--- +title: Math.cbrt() +slug: Web/JavaScript/Reference/Global_Objects/Math/cbrt +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cbrt +--- +
{{JSRef}}
+ +

Die Funktion Math.cbrt() gibt die Kubikwurzel einer Zahl zurück:

+ +

Math.cbrt(x)=x3=das  Ergebnisyso  dassy3=x\mathtt{Math.cbrt(x)} = \sqrt[3]{x} = \text{the unique} \; y \; \text{such that} \; y^3 = x

+ +
{{EmbedInteractiveExample("pages/js/math-cbrt.html")}}
+ + + +

Syntax

+ +
Math.cbrt(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Die Kubikwurzel der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil cbrt() eine statische Methode von Math ist, muss diese immer mit Math.cbrt() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.cbrt()

+ +
Math.cbrt(NaN); // NaN
+Math.cbrt(-1); // -1
+Math.cbrt(-0); // -0
+Math.cbrt(-Infinity); // -Infinity
+Math.cbrt(0); // 0
+Math.cbrt(1); // 1
+Math.cbrt(Infinity); // Infinity
+Math.cbrt(null); // 0
+Math.cbrt(2);  // 1.2599210498948734
+ +

Polyfill

+ +

Für x0x \geq 0 gilt x3=x1/3\sqrt[3]{x} = x^{1/3} so dass diese Funktion wie folgt emuliert werden kann:

+ +
if (!Math.cbrt) {
+  Math.cbrt = function(x) {
+    var y = Math.pow(Math.abs(x), 1/3);
+    return x < 0 ? -y : y;
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-math.cbrt', 'Math.cbrt')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.cbrt', 'Math.cbrt')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.cbrt")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/ceil/index.html b/files/de/web/javascript/reference/global_objects/math/ceil/index.html new file mode 100644 index 0000000000..06cf4808e7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/ceil/index.html @@ -0,0 +1,170 @@ +--- +title: Math.ceil() +slug: Web/JavaScript/Reference/Global_Objects/Math/ceil +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/ceil +--- +
{{JSRef}}
+ +

Die Funktion Math.ceil() gibt die nächste Ganzzahl, die größer oder gleich der gegebenen Zahl ist, zurück.

+ +
{{EmbedInteractiveExample("pages/js/math-ceil.html")}}
+ + + +

Syntax

+ +
Math.ceil(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Die kleinste ganze Zahl größer oder gleich der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil ceil() eine statische Methode von Math ist, muss diese immer mit Math.ceil() genutzt werden, ohne dass ein Objekt von Math erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Verwendung von Math.ceil()

+ +

Das folgende Beispiel zeigt den exemplarischen Einsatz von Math.ceil().

+ +
Math.ceil(.95);    // 1
+Math.ceil(4);      // 4
+Math.ceil(7.004);  // 8
+Math.ceil(-0.95);  // -0
+Math.ceil(-4);     // -4
+Math.ceil(-7.004); // -7
+
+ +

Dezimales anpassen

+ +
// Closure
+(function() {
+  /**
+   * Decimal adjustment of a number.
+   *
+   * @param {String}  type  The type of adjustment.
+   * @param {Number}  value The number.
+   * @param {Integer} exp   The exponent (the 10 logarithm of the adjustment base).
+   * @returns {Number} The adjusted value.
+   */
+  function decimalAdjust(type, value, exp) {
+    // If the exp is undefined or zero...
+    if (typeof exp === 'undefined' || +exp === 0) {
+      return Math[type](value);
+    }
+    value = +value;
+    exp = +exp;
+    // If the value is not a number or the exp is not an integer...
+    if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) {
+      return NaN;
+    }
+    // Shift
+    value = value.toString().split('e');
+    value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
+    // Shift back
+    value = value.toString().split('e');
+    return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
+  }
+
+  // Decimal round
+  if (!Math.round10) {
+    Math.round10 = function(value, exp) {
+      return decimalAdjust('round', value, exp);
+    };
+  }
+  // Decimal floor
+  if (!Math.floor10) {
+    Math.floor10 = function(value, exp) {
+      return decimalAdjust('floor', value, exp);
+    };
+  }
+  // Decimal ceil
+  if (!Math.ceil10) {
+    Math.ceil10 = function(value, exp) {
+      return decimalAdjust('ceil', value, exp);
+    };
+  }
+})();
+
+// Round
+Math.round10(55.55, -1);   // 55.6
+Math.round10(55.549, -1);  // 55.5
+Math.round10(55, 1);       // 60
+Math.round10(54.9, 1);     // 50
+Math.round10(-55.55, -1);  // -55.5
+Math.round10(-55.551, -1); // -55.6
+Math.round10(-55, 1);      // -50
+Math.round10(-55.1, 1);    // -60
+// Floor
+Math.floor10(55.59, -1);   // 55.5
+Math.floor10(59, 1);       // 50
+Math.floor10(-55.51, -1);  // -55.6
+Math.floor10(-51, 1);      // -60
+// Ceil
+Math.ceil10(55.51, -1);    // 55.6
+Math.ceil10(51, 1);        // 60
+Math.ceil10(-55.59, -1);   // -55.5
+Math.ceil10(-59, 1);       // -50
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 1st Edition.StandardInitiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.6', 'Math.ceil')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.ceil', 'Math.ceil')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.ceil', 'Math.ceil')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.ceil")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/clz32/index.html b/files/de/web/javascript/reference/global_objects/math/clz32/index.html new file mode 100644 index 0000000000..ac7c78c4a7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/clz32/index.html @@ -0,0 +1,112 @@ +--- +title: Math.clz32() +slug: Web/JavaScript/Reference/Global_Objects/Math/clz32 +tags: + - ECMAScript 2015 + - Java + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/clz32 +--- +
{{JSRef}}
+ +

Die Math.clz32() Funktion zählt die führenden Nullbits in der 32-Bit binär Repräsentation einer Nummer.

+ +
{{EmbedInteractiveExample("pages/js/math-clz32.html")}}
+ + + +

Syntax

+ +
Math.clz32(x)
+ +

Parameter

+ +
+
x
+
Eine Nummer.
+
+ +

Rückgabewert

+ +

Die Anzahl der führenden Nullbits in der 32-Bit binör Repräsentation der übergebenen Zahl.

+ +

Beschreibung

+ +

"clz32" steht für CountLeadingZeroes32 (AnzahlFührenderNullen32).

+ +

Wenn x keine Nummer ist, wird x in eine Nummer konvertiert. Danach wird diese Nummer in einen 32-Bit vorzeichenlose Ganzzahl (unsigned integer) konvertiert.

+ +

Wenn die konvertierte 32-Bit vorzeichenlose Zahl 0 ist, so wird die Funktion 32 zurück geben, weil alle Bits 0 sind.

+ +

Diese Funktion ist nützlich für Systeme, die in zu JavaScript kompilieren (z. B. Emscripten).

+ +

Beispiele

+ +

Einsatz von Math.clz32()

+ +
Math.clz32(1);                // 31
+Math.clz32(1000);             // 22
+Math.clz32();                 // 32
+
+[NaN, Infinity, -Infinity, 0, -0, null, undefined, 'foo', {}, []].filter(
+function(n) {
+  return Math.clz32(n) !== 32
+});                           // []
+
+Math.clz32(true);             // 31
+Math.clz32(3.5);              // 30
+
+ +

Polyfill

+ +

Der folgende Polyfill ist der effizienteste.

+ +
if (!Math.clz32) {
+  Math.clz32 = function(x) {
+    // Let n be ToUint32(x).
+    // Let p be the number of leading zero bits in 
+    // the 32-bit binary representation of n.
+    // Return p.    
+    if (x == null || x === 0) {
+      return 32;
+    }
+    return 31 - Math.floor(Math.log(x >>> 0) * Math.LOG2E);
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-math.clz32', 'Math.clz32')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.clz32', 'Math.clz32')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.clz32")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/cos/index.html b/files/de/web/javascript/reference/global_objects/math/cos/index.html new file mode 100644 index 0000000000..300908a90b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/cos/index.html @@ -0,0 +1,98 @@ +--- +title: Math.cos() +slug: Web/JavaScript/Reference/Global_Objects/Math/cos +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cos +--- +
{{JSRef}}
+ +

Die Math.cos() Funktion gibt den {{interwiki("wikipedia", "Cosinus")}} eines Winkels zurück. Der Winkel muss im {{interwiki("wikipedia", "Bogenmaß")}} angegeben werden. Der Wert ist  length adjacent length hypotenuse .

+ +
{{EmbedInteractiveExample("pages/js/math-cos.html")}}
+ + + +

Syntax

+ +
Math.cos(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl im Winkelmaß (rad).
+
+ +

Rückgabewert

+ +

Der Cosinus der übergebenen Zahl.

+ +

Beschreibung

+ +

Die Math.cos() Funktion gibt einen nummerischen Wert zwischen -1 und 1 zurück. Dieser repräsentiert den Cosinus des Winkels.

+ +

Weil cos() eine statische Funktion von Math ist, wird es immer als Math.cos() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.cos()

+ +
Math.cos(0);           // 1
+Math.cos(1);           // 0.5403023058681398
+
+Math.cos(Math.PI);     // -1
+Math.cos(2 * Math.PI); // 1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationenStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.7', 'Math.cos')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.cos', 'Math.cos')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.cos', 'Math.cos')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.cos")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/cosh/index.html b/files/de/web/javascript/reference/global_objects/math/cosh/index.html new file mode 100644 index 0000000000..9b24cbbeaf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/cosh/index.html @@ -0,0 +1,102 @@ +--- +title: Math.cosh() +slug: Web/JavaScript/Reference/Global_Objects/Math/cosh +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cosh +--- +
{{JSRef}}
+ +

Die Math.cosh() Funktion gibt den Cosinus Hyperbolicus einer Zahl zurück. Dieser kann mit dem Einsatz der {{jsxref("Math.E", "Eulerschen Zahl", "", 1)}} folgendermaßen berechnet werden:

+ +

Math.cosh(x)=ex+e-x2\mathtt{\operatorname{Math.cosh(x)}} = \frac{e^x + e^{-x}}{2}

+ +
{{EmbedInteractiveExample("pages/js/math-cosh.html")}}
+ + + +

Syntax

+ +
Math.cosh(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der hyperbolische Cosinus der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil cosh() eine statische Funktion von Math ist, wird es immer als Math.cosh() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.cosh()

+ +
Math.cosh(0);  // 1
+Math.cosh(1);  // 1.5430806348152437
+Math.cosh(-1); // 1.5430806348152437
+
+ +

Polyfill

+ +

Diese Funktion kann mit Hilfe der Funktion {{jsxref("Math.exp()")}} emuliert werden:

+ +
Math.cosh = Math.cosh || function(x) {
+  return (Math.exp(x) + Math.exp(-x)) / 2;
+}
+
+ +

Oder nur mit einem Aufruf der {{jsxref("Math.exp()")}} Funktion:

+ +
Math.cosh = Math.cosh || function(x) {
+  var y = Math.exp(x);
+  return (y + 1 / y) / 2;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-math.cosh', 'Math.cosh')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.cosh', 'Math.cosh')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.cosh")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/e/index.html b/files/de/web/javascript/reference/global_objects/math/e/index.html new file mode 100644 index 0000000000..1ba5bd74d5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/e/index.html @@ -0,0 +1,83 @@ +--- +title: Math.E +slug: Web/JavaScript/Reference/Global_Objects/Math/E +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/E +--- +
{{JSRef}}
+ +

Die Math.E Eigenschaft repräsentiert die Basis des natürlichen Logarithmus, was gerundet 2,718 ist.

+ +

Math.E=e2,718\mathtt{\mi{Math.E}} = e \approx 2,718

+ +
{{EmbedInteractiveExample("pages/js/math-e.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil E eine statische Eigenschaft von Math ist, muss immer Math.E genutzt werden, ohne dass ein Math Objekt erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.E

+ +

Die folgende Funktion gibt e zurück:

+ +
function getNapier() {
+   return Math.E
+}
+
+getNapier() // 2.718281828459045
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.8.1.1', 'Math.E')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.e', 'Math.E')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.e', 'Math.E')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.E")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/exp/index.html b/files/de/web/javascript/reference/global_objects/math/exp/index.html new file mode 100644 index 0000000000..df215203d8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/exp/index.html @@ -0,0 +1,95 @@ +--- +title: Math.exp() +slug: Web/JavaScript/Reference/Global_Objects/Math/exp +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/exp +--- +
{{JSRef}}
+ +

Die Math.exp() Funktion gibt ex zurück, wobei x der Parameter ist. e ist die {{jsxref("Math.E", "Eulersche Zahl", "", 1)}}, die Basis des natürlichen Logarithmus.

+ +
{{EmbedInteractiveExample("pages/js/math-exp.html")}}
+ + + +

Syntax

+ +
Math.exp(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Die Zahl, die ex repräsentiert, wobei e die {{jsxref("Math.E", "Eulersche Zahl", "", 1)}} ist und x die übergebene Zahl ist.

+ +

Beschreibung

+ +

Weil exp() eine statische Funktion von Math ist, wird es immer als Math.exp() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.exp()

+ +
Math.exp(-1); // 0.36787944117144233
+Math.exp(0);  // 1
+Math.exp(1);  // 2.718281828459045
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.8', 'Math.exp')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.exp', 'Math.exp')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.exp', 'Math.exp')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.exp")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/expm1/index.html b/files/de/web/javascript/reference/global_objects/math/expm1/index.html new file mode 100644 index 0000000000..b257953d87 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/expm1/index.html @@ -0,0 +1,94 @@ +--- +title: Math.expm1() +slug: Web/JavaScript/Reference/Global_Objects/Math/expm1 +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/expm1 +--- +
{{JSRef}}
+ +

Die Math.expm1() Funktion gibt ex - 1 zurück, wobei x der Parameter ist. e ist die {{jsxref("Math.E", "Eulersche Zahl", "", 1)}}, die Basis des natürlichen Logarithmus.

+ +
{{EmbedInteractiveExample("pages/js/math-expm1.html")}}
+ + + +

Syntax

+ +
Math.expm1(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Die Zahl, die ex - 1 repräsentiert, wobei e die {{jsxref("Math.E", "Eulersche Zahl", "", 1)}} und x die übergebene Zahl ist.

+ +

Beschreibung

+ +

Weil expm1() eine statische Funktion von Math ist, wird es immer als Math.expm1() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.expm1()

+ +
Math.expm1(-1); // -0.6321205588285577
+Math.expm1(0);  // 0
+Math.expm1(1);  // 1.718281828459045
+
+ +

Polyfill

+ +

Diese Funktion kann mit Hilfe der Funktion {{jsxref("Math.exp()")}} emitiert werden:

+ +
Math.expm1 = Math.expm1 || function(x) {
+  return Math.exp(x) - 1;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusComment
{{SpecName('ES6', '#sec-math.expm1', 'Math.expm1')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.expm1', 'Math.expm1')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.expm1")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/floor/index.html b/files/de/web/javascript/reference/global_objects/math/floor/index.html new file mode 100644 index 0000000000..68f8bf86fa --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/floor/index.html @@ -0,0 +1,137 @@ +--- +title: Math.floor() +slug: Web/JavaScript/Reference/Global_Objects/Math/floor +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/floor +--- +
{{JSRef}}
+ +

Die Math.floor() Funktion gibt den größten Integer zurück, der kleiner oder gleich der gegeben Nummer ist. (Abrunden) 

+ +
{{EmbedInteractiveExample("pages/js/math-floor.html")}}
+ + + +

Syntax

+ +
Math.floor(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Eine größte ganze Zahl, die kleiner oder gleich der übergebenen Zahl ist.

+ +

Beschreibung

+ +

Weil floor() eine statische Methode von Math ist, wird sie immer als Math.floor() aufgerufen und nicht als eine Methode eines erstellten Math Objektes (Math ist kein Konstruktor).

+ +
+

Hinweis: Math.floor(null) gibt 0, aber nicht {{jsxref("NaN")}}, zurück.

+
+ +

Beispiele

+ +

Einsatz von Math.floor()

+ +
Math.floor(45.95);   // 45
+Math.floor(45.05);   // 45
+Math.floor(4);       // 4
+Math.floor(-45.05);  // -46
+Math.floor(-45.95);  // -46
+
+ +

Dezimale Justierung

+ +
/**
+ * Decimal adjustment of a number.
+ *
+ * @param {String}  type  The type of adjustment.
+ * @param {Number}  value The number.
+ * @param {Integer} exp   The exponent (the 10 logarithm of the adjustment base).
+ * @returns {Number} The adjusted value.
+ */
+function decimalAdjust(type, value, exp) {
+  // If the exp is undefined or zero...
+  if (typeof exp === 'undefined' || +exp === 0) {
+    return Math[type](value);
+  }
+  value = +value;
+  exp = +exp;
+  // If the value is not a number or the exp is not an integer...
+  if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) {
+    return NaN;
+  }
+  // Shift
+  value = value.toString().split('e');
+  value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
+  // Shift back
+  value = value.toString().split('e');
+  return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
+}
+
+// Decimal round
+const round10 = (value, exp) => decimalAdjust('round', value, exp);
+// Decimal floor
+const floor10 = (value, exp) => decimalAdjust('floor', value, exp);
+// Decimal ceil
+const ceil10 = (value, exp) => decimalAdjust('ceil', value, exp);
+
+// Round
+round10(55.55, -1);   // 55.6
+round10(55.549, -1);  // 55.5
+round10(55, 1);       // 60
+round10(54.9, 1);     // 50
+round10(-55.55, -1);  // -55.5
+round10(-55.551, -1); // -55.6
+round10(-55, 1);      // -50
+round10(-55.1, 1);    // -60
+// Floor
+floor10(55.59, -1);   // 55.5
+floor10(59, 1);       // 50
+floor10(-55.51, -1);  // -55.6
+floor10(-51, 1);      // -60
+// Ceil
+ceil10(55.51, -1);    // 55.6
+ceil10(51, 1);        // 60
+ceil10(-55.59, -1);   // -55.5
+ceil10(-59, 1);       // -50
+
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-math.floor', 'Math.floor')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.floor")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/fround/index.html b/files/de/web/javascript/reference/global_objects/math/fround/index.html new file mode 100644 index 0000000000..de905d6637 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/fround/index.html @@ -0,0 +1,112 @@ +--- +title: Math.fround() +slug: Web/JavaScript/Reference/Global_Objects/Math/fround +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/fround +--- +
{{JSRef}}
+ +

Die Math.fround() Funktion gibt die am nächsten gelegenen 32 Bit einfach genaue Repräsentation einer {{jsxref("Number")}}.

+ +
{{EmbedInteractiveExample("pages/js/math-fround.html")}}
+ + + +

Syntax

+ +
var singleFloat = Math.fround(doubleFloat)
+ +

Parameter

+ +
+
doubleFloat
+
Eine {{jsxref("Number")}}. Wenn der Parameter von einem anderen Typ ist, wird dieser zu einer Zahl konvertiert oder wenn er nicht konvertiert werden kann {{jsxref("NaN")}}.
+
+ +

Rückgabewert

+ +

Die am nächsten gelegenen 32 Bit einfach genaue Repräsentation einer Floatingpoint-Nummer, der übergebenen Zahl.

+ +

Beschreibung

+ +

JavaScript benutzt intern 64 Bit double Gleitkommazahlen, welche eine hohe Präzision haben. Manchmal ist es gewollt mit 32 Bit Gleitkommazahlen zu arbeiten, zum Beispiel, wenn von einem von einem {{jsxref("Float32Array")}} gelesen wird. Das kann verwirrend sein: Prüfen einer 64 Bit Gleitkommazahl und einer 32 Bit Gleitkommazahl auf Gleichheit kann fehlschlagen, auch wenn sie scheinbar identisch sind.

+ +

Um das zu beheben, kann Math.fround() eingesetzt werden um 64 Bit Gleitkommazahlen in 32 Bit Gleitkommazahlen umzuwandeln. Intern wird JavaScript die Zahl als 64 Bit Gleitkommazahl benutzen, es wird jedoch ein "Runden zu geraden Zahlen" (round to even) an der 23. Stelle der Mantisse vorgenommen und alle folgenden Stellen der Mantisse auf 0 gesetzt. Wenn die Zahl außerhalb des 32 Bit Gleitkommazahlenbereiches liegt wird {{jsxref("Infinity")}} oder -Infinity zurückgegeben.

+ +

Weil fround() eine statische Funktion von Math ist, wird es immer als Math.fround() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.fround()

+ +

Die Zahl 1-5 kan präzise im Binärsystem dargestellt werden und ist identisch in 32 Bit und 64 Bit:

+ +
Math.fround(1.5);        // 1.5
+Math.fround(1.5) === 1.5 // true
+ +

Die Zahl 1.337 kan nicht präzise in Binärsystem dargestellt werden und unterscheidet sich in 32 Bit und 64 Bit:

+ +
Math.fround(1.337);           //1.3370000123977661
+Math.fround(1.337) === 1.337; // false
+
+ +

21502^150 ist zu groß für eine 32 Bit Gleitkommazahl, weshalb Infinity zurückgegeben wird.

+ +
2 ** 150;              // 1.42724769270596e+45
+Math.fround(2 ** 150); // Infinity
+
+ +

Wenn der Parameter nicht zu einer Zahl konvertiert werden kann, oder keine Zahl ist (NaN), gibt Math.fround() NaN zurück:

+ +
Math.fround('abc'); // NaN
+Math.fround(NaN);   // NaN
+
+ +

Polyfill

+ +

Diese Funktion kann emuliert werden, wenn {{jsxref("Float32Array")}} verfügbar ist:

+ +
Math.fround = Math.fround || (function (array) {
+  return function(x) {
+    return array[0] = x, array[0];
+  };
+})(Float32Array(1));
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-math.fround', 'Math.fround')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.fround', 'Math.fround')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.fround")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/hypot/index.html b/files/de/web/javascript/reference/global_objects/math/hypot/index.html new file mode 100644 index 0000000000..b88861e06d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/hypot/index.html @@ -0,0 +1,128 @@ +--- +title: Math.hypot() +slug: Web/JavaScript/Reference/Global_Objects/Math/hypot +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/hypot +--- +
{{JSRef}}
+ +

Die Math.hypot() Funktion gibt die Quadratwurzel von der Summe der quadrierten Argumente zurück. Das bedeutet

+ +

Math.hypot(v1,v2,,vn)=i=1nvi2=v12+v22++vn2\mathtt{\operatorname{Math.hypot}(v_1, v_2, \dots, v_n)} = \sqrt{\sum_{i=1}^n v_i^2} = \sqrt{v_1^2 + v_2^2 + \dots + v_n^2}

+ +
{{EmbedInteractiveExample("pages/js/math-hypot.html")}}
+ + + +

Syntax

+ +
Math.hypot([value1[, value2[, ...]]])
+ +

Parameter

+ +
+
value1, value2, ...
+
Zahlen.
+
+ +

Rückgabewert

+ +

Die Quadratwurzel der Summe der quadrierten übergebenen Parameter. Wenn ein Parameter nicht in eine Zahl konvertiert werden kann, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Das Berechnen der Hypotenuse eines rechtwinkligen Dreiecks oder die Größe einer komplexen Zahl verwendet die Formel Math.sqrt (v1 * v1 + v2 * v2), wobei v1 und v2 entweder die Seiten des Dreiecks oder die reellen und komplexen Werte sind. Zum Berechnen der Entfernung in 2 oder mehr Dimensionen fügt man einfach weitere Quadrate innerhalb des Quadratwurzelzeichens ein, wie z. B. Math.sqrt (v1 * v1 + v2 * v2 + v3 * v3 + v4 * v4).

+ +

Diese Funktion macht es ein bisschen einfacher und schneller, man kann einfach Math.hypot(v1, v2) , or Math.hypot(v1, v2, v3, v4, ...) aufrufen.

+ +

Sie vermeidet zudem ein Problem, wenn Zahlen sehr groß werden. Die größte Zahl, die in JavaScript dargestellt werden kann ist Number.MAX_VALUE = 1.797...e+308. Wenn die Zahlen größer als 1e154 sind, wird das Quadrieren dieser zu dem ergebnis Infinity führen und das Ergebnis zerstören. Zum Beispiel: Math.sqrt(1e200*1e200 + 1e200*1e200) = Infinity. Wenn hypot() stattdessen benutzt wird bekommt man ein gutes Ergebnis: Math.hypot(1e200, 1e200) = 1.4142...e+200. Diese gilt auch für sehr kleine Zahlen. Math.sqrt(1e-200*1e-200 + 1e-200*1e-200) = 0, wohingegen Math.hypot(1e-200, 1e-200) =1.4142...e-200 eine gute Lösung ist.

+ +

Weil hypot() eine statische Funktion von Math ist, wird es immer als Math.hypot() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Wenn kein Argument übergeben wird, ist das Ergebnis +0.

+ +

Wenn einer der übergebenen Parameter nicht zu einer Zahl konvertiert werden kann, ist das Ergebnis {{jsxref("NaN")}}.

+ +

Wenn nur ein Argument übergeben wird, so sind die Ergebnisse der Funktionen Math.hypot() und {{jsxref("Math.abs()")}} gleich.

+ +

Beispiele

+ +

Einsatz von Math.hypot()

+ +
Math.hypot(3, 4);        // 5
+Math.hypot(3, 4, 5);     // 7.0710678118654755
+Math.hypot();            // 0
+Math.hypot(NaN);         // NaN
+Math.hypot(3, 4, 'foo'); // NaN, +'foo' => NaN
+Math.hypot(3, 4, '5');   // 7.0710678118654755, +'5' => 5
+Math.hypot(-3);          // 3, das gleiche wie Math.abs(-3)
+
+ +

Polyfill

+ +

Diese Funktion kann folgendermaßen emuliert werden:

+ +
Math.hypot = Math.hypot || function() {
+  var y = 0, i = arguments.length;
+  while (i--) y += arguments[i] * arguments[i];
+  return Math.sqrt(y);
+};
+
+ +

Ein Polyfill der Underflows und Overflows vermeidet:

+ +
Math.hypot = function (x, y) {
+  // https://bugzilla.mozilla.org/show_bug.cgi?id=896264#c28
+  var max = 0;
+  var s = 0;
+  for (var i = 0; i < arguments.length; i += 1) {
+    var arg = Math.abs(Number(arguments[i]));
+    if (arg > max) {
+      s *= (max / arg) * (max / arg);
+      max = arg;
+    }
+    s += arg === 0 && max === 0 ? 0 : (arg / max) * (arg / max);
+  }
+  return max === 1 / 0 ? 1 / 0 : max * Math.sqrt(s);
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.hypot', 'Math.hypot')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.hypot', 'Math.hypot')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.hypot")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/imul/index.html b/files/de/web/javascript/reference/global_objects/math/imul/index.html new file mode 100644 index 0000000000..ea3bc9abf3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/imul/index.html @@ -0,0 +1,92 @@ +--- +title: Math.imul() +slug: Web/JavaScript/Reference/Global_Objects/Math/imul +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/imul +--- +
{{JSRef}}
+ +

Die Math.imul() Funktion führt eine C ähnliche 32-Bit Multiplikation der zwei Parameter durch.

+ +
{{EmbedInteractiveExample("pages/js/math-imul.html")}}
+ + + +

Syntax

+ +
Math.imul(a, b)
+ +

Parameter

+ +
+
a
+
Erste Nummer.
+
b
+
Zweite Nummer.
+
+ +

Rückgabewert

+ +

Das Resultat der C-ähnlichen 32-Bit Multiplikation der übergebenen Parameter.

+ +

Beschreibung

+ +

Math.imul() erlaubt es schnelle 32-Bit Ganzzahlmultiplikationen mit C ähnlicher Semantik durchzuführen. Diese Funktion ist nützlich für Projekte wie Emscripten. Weil imul() eine statische Methode von Math ist, muss man immer Math.imul() benutzen und nicht als Methode eines Math Objektes, das man erzeugt (Math ist kein Konstruktor). Wenn normale JavaScript Gleitkommazahlen in imul eingesetzt werden, wird die Performance beeinträchtigt. Das ist wegen der Umwandlung von Gleitkommazahlen zu ganzen Zahlen für die Multiplikation und die anschließende Rückkonvertierung des Ergebnisses in eine Gleitkommazahl. Der Grund warum imul existiert, ist, dass esin (nur) einem Fall schneller ist: AsmJS. AsmJS erlaubt JIST-Optimierungen für einfache Implementierung von ganzen Zahlen in JavaScript. Multiplizieren von zwei Zahlen mit imul, die intern als Integer dargestellt sind (was nur mit AsmJS funktioniert) ist der einzige Grund, wo Math.imul die Performance im Browsern steigern kann.

+ +

Beispiele

+ +

Einsatz von Math.imul()

+ +
Math.imul(2, 4);          // 8
+Math.imul(-1, 8);         // -8
+Math.imul(-2, -2);        // 4
+Math.imul(0xffffffff, 5); // -5
+Math.imul(0xfffffffe, 5); // -10
+
+ +

Polyfill

+ +

Diese Funktionalität kann durch folgende Funktion emuliert werden:

+ +
Math.imul = Math.imul || function(a, b) {
+  var aHi = (a >>> 16) & 0xffff;
+  var aLo = a & 0xffff;
+  var bHi = (b >>> 16) & 0xffff;
+  var bLo = b & 0xffff;
+  // the shift by 0 fixes the sign on the high part
+  // the final |0 converts the unsigned value into a signed value
+  return ((aLo * bLo) + (((aHi * bLo + aLo * bHi) << 16) >>> 0) | 0);
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES6', '#sec-math.imul', 'Math.imul')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-math.imul', 'Math.imul')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.imul")}}

diff --git a/files/de/web/javascript/reference/global_objects/math/index.html b/files/de/web/javascript/reference/global_objects/math/index.html new file mode 100644 index 0000000000..7dd7493568 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/index.html @@ -0,0 +1,201 @@ +--- +title: Math +slug: Web/JavaScript/Reference/Global_Objects/Math +tags: + - JavaScript + - Math + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math +--- +
{{JSRef}}
+ +

Math ist ein Standardobjekt, das Eigenschaften und Methoden für mathematische Konstanten und Funktionen besitzt. Es ist kein Funktionsobjekt.

+ +

Beschreibung

+ +

Im Unterschied zu den anderen globalen Objekten hat Math keinen Konstruktor. Alle Eigenschaften und Methoden von Math sind statisch. Um die Konstante Pi zu erreichen, wird Math.PI genutzt. Die Sinusfunktion wird mit Math.sin(x) ausgeführt, wobei x der Methodenparameter ist. Konstanten sind so präzise wie der Typ number in JavaScript.

+ +

Eigenschaften

+ +
+
{{jsxref("Math.E")}}
+
Eulersche Zahl und die Basis für den natürlichen Logarithmus (gerundet 2,718).
+
+ +
+
{{jsxref("Math.LN2")}}
+
Natürlicher Logarithmus von 2 (gerundet 0,693).
+
{{jsxref("Math.LN10")}}
+
Natürlicher Logarithmus von 10 (gerundet 2,303).
+
{{jsxref("Math.LOG2E")}}
+
Logarithmus zur Basis 2 von der Eulerschen Zahl (gerundet 1,443).
+
{{jsxref("Math.LOG10E")}}
+
Logarithmus zur Basis 10 von der Eulerschen Zahl (gerundet 0,434).
+
{{jsxref("Math.PI")}}
+
Kreiszahl Pi, welche als Verhältnis zwischen Kreisumfang und Durchmesser definiert ist (gerundet 3,14159).
+
{{jsxref("Math.SQRT1_2")}}
+
Quadratwurzel aus 1/2 oder 1 geteilt durch die Quadratwurzel von 2 (gerundet 0,707).
+
{{jsxref("Math.SQRT2")}}
+
Quadratwurzel aus 2 (gerundet 1,414).
+
+ +

Methoden

+ +
Anmerkung: Die trigonometrischen Funktionen (sin(), cos(), tan(), asin(), acos(), atan(), atan2()) erwarten Parameter und geben Rückgabewerte im Bogenmaß zurück. Um dieses in das Gradmaß umzurechnen, teilt man durch (Math.PI / 180) und multipliziert das Ergebnis mit der Bogenmaß.
+ +
Anmerkung: Bei vielen mathematischen Funktionen ist die Präzision implementationsabhängig. Das bedeutet, dass es bei verschiedenen Browsern verschiedene Ergebnisse geben kann. Auch in der gleichen JavaScript-Umgebung auf verschiedenen Betriebssystemen oder Architekturen können Abweichungen entstehen.
+ +
+
+ +
+
{{jsxref("Global_Objects/Math/abs", "Math.abs(x)")}}
+
Gibt den Betrag einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/acos", "Math.acos(x)")}}
+
Gibt den Arcus Cosinus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/acosh", "Math.acosh(x)")}}
+
Gibt den Areacosinus Hyperbolicus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/asin", "Math.asin(x)")}}
+
Gibt den Arcus Sinus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/asinh", "Math.asinh(x)")}}
+
Gibt den Areasinus Hyperbolicus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/atan", "Math.atan(x)")}}
+
Gibt den Arcus Tangens einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/atanh", "Math.atanh(x)")}}
+
Gibt den Areatangens Hyperbolicus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/atan2", "Math.atan2(y, x)")}}
+
Gibt den Arcus Tangens aus dem Quotienten der Argumente zurück.
+
{{jsxref("Global_Objects/Math/cbrt", "Math.cbrt(x)")}}
+
Gibt die Kubikwurzel einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/ceil", "Math.ceil(x)")}}
+
Gibt die kleinste ganze Zahl zurück, die größer oder gleich dem Parameter ist.
+
{{jsxref("Global_Objects/Math/clz32", "Math.clz32(x)")}}
+
Gibt die Anzahl der voranstehenden 0-Bits einer 32-Bit-Repräsentation zurück.
+
{{jsxref("Global_Objects/Math/cos", "Math.cos(x)")}}
+
Gibt den Cosinus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/cosh", "Math.cosh(x)")}}
+
Gibt den Cosinus Hyperbolicus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/exp", "Math.exp(x)")}}
+
Gibt Ex zurück, wobei x der Parameter und E die Eulersche Zahl ist.
+
{{jsxref("Global_Objects/Math/expm1", "Math.expm1(x)")}}
+
Gibt exp(x) - 1 zurück.
+
{{jsxref("Global_Objects/Math/floor", "Math.floor(x)")}}
+
Rundet eine Zahl auf eine ganze Zahl ab.
+
{{jsxref("Global_Objects/Math/fround", "Math.fround(x)")}}
+
Gibt die am nächsten liegende einfache genaue Gleitkommazahl des Parameters zurück.
+
{{jsxref("Global_Objects/Math/hypot", "Math.hypot([x[,y[,…]]])")}}
+
Gibt die Quadratwurzel aus der Summe der quadrierten Parameterwerte zurück.
+
{{jsxref("Global_Objects/Math/imul", "Math.imul(x)")}}
+
Gibt das Ergebnis einer 32-Bit-Ganzzahlmultiplikation zurück.
+
{{jsxref("Global_Objects/Math/log", "Math.log(x)")}}
+
Gibt den natürlichen Logarithmus (loge oder ln) einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/log1p", "Math.log1p(x)")}}
+
Gibt den natürlichen Logarithmus (loge oder ln) einer mit 1 addierten Zahl zurück.
+
{{jsxref("Global_Objects/Math/log10", "Math.log10(x)")}}
+
Gibt den Logarithmus zur Basis 10 einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/log2", "Math.log2(x)")}}
+
Gibt den Logarithmus zur Basis 2 einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/max", "Math.max([x[,y[,…]]])")}}
+
Gibt die größte von null oder mehr Zahlen zurück.
+
{{jsxref("Global_Objects/Math/min", "Math.min([x[,y[,…]]])")}}
+
Gibt die kleinste von null oder mehr Zahlen zurück.
+
{{jsxref("Global_Objects/Math/pow", "Math.pow(x,y)")}}
+
Gibt die Potenz zweier Zahlen zurück (xy).
+
{{jsxref("Global_Objects/Math/random", "Math.random()")}}
+
Gibt eine Pseudozufallszahl zwischen 0 und 1 zurück.
+
{{jsxref("Global_Objects/Math/round", "Math.round(x)")}}
+
Gibt den ganzzahlig gerundeten Wert des Parameters zurück.
+
+ +
+
{{jsxref("Global_Objects/Math/sign", "Math.sign(x)")}}
+
Gibt das Vorzeichen (positiv, negativ, 0) von x zurück.
+
{{jsxref("Global_Objects/Math/sin", "Math.sin(x)")}}
+
Gibt den Sinus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/sinh", "Math.sinh(x)")}}
+
Gibt den Sinus Hyperbolicus einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/sqrt", "Math.sqrt(x)")}}
+
Gibt die positive Quadratwurzel einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/tan", "Math.tan(x)")}}
+
Gibt den Tangens einer Zahl zurück.
+
{{jsxref("Global_Objects/Math/tanh", "Math.tanh(x)")}}
+
Gibt den Tangens Hyperbolicus einer Zahl zurück.
+
Math.toSource() {{Non-standard_inline() }}
+
Gibt die Zeichenkette "Math" zurück.
+
{{jsxref("Global_Objects/Math/trunc", "Math.trunc(x)")}}
+
Gibt den ganzzahligen Teil der Zahl x, ohne jede Nachkommastellen, zurück.
+
+ +

Das Math Objekt erweitern

+ +

Wie die meisten der Standard-JavaScript Objekte kann auch das Math Objekt um benutzerdefinierten Eigenschaften und Methoden erweitert werden. Zum Erweitern des Math Objektes wird nicht prototype genutzt. Stattdessen wird Math direkt erweitert.

+ +
Math.propName = propValue;
+Math.methodName = methodRef;
+ +

Im folgenden Beispiel wird eine Methode zum Math Objekt hinzugefügt, welche den größten gemeinsamen Teiler von einer Liste von Argumenten ermittelt.

+ +
/* Variadic function -- Returns the greatest common divisor of a list of arguments */
+Math.gcd = function () {
+  if(arguments.length == 2) {
+    if(arguments[1] == 0) {
+      return arguments[0];
+    } else {
+      return Math.gcd(arguments[1], arguments[0] % arguments[1]);
+    }
+  } else if (arguments.length > 2) {
+    var result = Math.gcd(arguments[0], arguments[1]);
+    for (var i = 2; i < arguments.length; i++) {
+      result = Math.gcd(result, arguments[i]);
+    }
+    return result;
+  }
+}
+ +

Zum Ausprobieren:

+ +
console.log(Math.gcd(20, 30, 15, 70, 40)); // `5`
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.8', 'Math')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math-object', 'Math')}}{{Spec2('ES6')}}Die neuen Methoden {{jsxref("Math.log10()", "log10()")}}, {{jsxref("Math.log2()", "log2()")}}, {{jsxref("Math.log1p()", "log1p()")}}, {{jsxref("Math.expm1()", "expm1()")}}, {{jsxref("Math.cosh()", "cosh()")}}, {{jsxref("Math.sinh()", "sinh()")}}, {{jsxref("Math.tanh()", "tanh()")}}, {{jsxref("Math.acosh()", "acosh()")}}, {{jsxref("Math.asinh()", "asinh()")}}, {{jsxref("Math.atanh()", "atanh()")}}, {{jsxref("Math.hypot()", "hypot()")}}, {{jsxref("Math.trunc()", "trunc()")}}, {{jsxref("Math.sign()", "sign()")}}, {{jsxref("Math.imul()", "imul()")}}, {{jsxref("Math.fround()", "fround()")}}, {{jsxref("Math.cbrt()", "cbrt()")}} und {{jsxref("Math.clz32()", "clz32()")}} hinzugefügt.
{{SpecName('ESDraft', '#sec-math-object', 'Math')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/ln10/index.html b/files/de/web/javascript/reference/global_objects/math/ln10/index.html new file mode 100644 index 0000000000..b43f317ef4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/ln10/index.html @@ -0,0 +1,83 @@ +--- +title: Math.LN10 +slug: Web/JavaScript/Reference/Global_Objects/Math/LN10 +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN10 +--- +
{{JSRef}}
+ +

Die Math.LN10 Eigenschaft repräsentiert den natürlichen Logarithmus von 10, was gerundet 2,302 ist:

+ +

Math.LN10=ln(10)2,302\mathtt{\mi{Math.LN10}} = \ln(10) \approx 2,302

+ +
{{EmbedInteractiveExample("pages/js/math-ln10.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil LN10 eine statische Eigenschaft von Math ist, kann diese immer über Math.LN10 erreicht werden, ohne dass ein Objekt von Math erstellt werden muss (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.LN10

+ +

Die folgende Funktion gibt das Ergebnis des natürlichen Logarithmus von 10 zurück:

+ +
function getNatLog10() {
+   return Math.LN10
+}
+
+getNatLog10() // 2.302585092994046
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0
{{SpecName('ES5.1', '#sec-15.8.1.2', 'Math.LN10')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.ln10', 'Math.LN10')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.ln10', 'Math.LN10')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.LN10")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/ln2/index.html b/files/de/web/javascript/reference/global_objects/math/ln2/index.html new file mode 100644 index 0000000000..5577b36c74 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/ln2/index.html @@ -0,0 +1,83 @@ +--- +title: Math.LN2 +slug: Web/JavaScript/Reference/Global_Objects/Math/LN2 +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN2 +--- +
{{JSRef}}
+ +

Die Math.LN2 Eigenschaft repräsentiert den natürlichen Logarithmus von 2, was gerundet 0,693 ist:

+ +

Math.LN2=ln(2)0,693\mathtt{\mi{Math.LN2}} = \ln(2) \approx 0,693

+ +
{{EmbedInteractiveExample("pages/js/math-ln2.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil LN2 eine statische Eigenschaft von Math ist, kann diese immer mit Math.LN2 erreicht werden, ohne dass ein Objekt von Math erstellt werden muss (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.LN2

+ +

Die folgende Funktion gibt den Logarithmus zur Basis 2 von einer Zahl zurück. Dabei wird Math.LN2 benutzt:

+ +
function getLog2(x) {
+  return Math.log(x) / Math.LN2;
+}
+
+getLog2(256) // 8
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0
{{SpecName('ES5.1', '#sec-15.8.1.3', 'Math.LN2')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.ln2', 'Math.LN2')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.ln2', 'Math.LN2')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.LN2")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log/index.html b/files/de/web/javascript/reference/global_objects/math/log/index.html new file mode 100644 index 0000000000..d4502d50e2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log/index.html @@ -0,0 +1,113 @@ +--- +title: Math.log() +slug: Web/JavaScript/Reference/Global_Objects/Math/log +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log +--- +
{{JSRef}}
+ +

Die Math.log() Funktion gibt den natürlichen Logarithmus (Logarithmus zur Basis {{jsxref("Math.E", "e")}}) einer Zahl zurück. Das bedeutet

+ +

x>0,Math.log(x)=ln(x)=ysodass ey=x\forall x > 0, \mathtt{\operatorname{Math.log}(x)} = \ln(x) = \text{the unique} \; y \; \text{such that} \; e^y = x

+ +

Die JavaScript Function Math.log() ist gleichbedeutend zu der mathematischen Funktion ln(x).

+ +
{{EmbedInteractiveExample("pages/js/math-log.html")}}
+ + + +

Syntax

+ +
Math.log(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Der natürliche Logarithmus (Basis {{jsxref("Math.E", "e")}}) der übergebenen Zahl. Wenn die Zahl negativ ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Wenn der Wert von x negativ ist, so gibt die Funktion immer {{jsxref("NaN")}} zurück.

+ +

Weil log() eine statische Funktion von Math ist, wird es immer als Math.log() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Wenn der natürliche Logarithmus von 2 und 10 gebraucht wird, gibt es die Konstanten {{jsxref("Math.LN2")}} und {{jsxref("Math.LN10")}}. Wenn ein Logarithmus zur Basis 2 oder 10 gebracht wird, gibt es die Funktionen {{jsxref("Math.log2()")}} und {{jsxref("Math.log10()")}}. Wenn der Logarithmus zu einer anderen Basis gebraucht wird, benutzt man Math.log(x) / Math.log(andereBasis) wie im Beispiel unten. Manchmal möchte man 1 / Math.log(andereBasis) vorberechnen.

+ +

Beispiele

+ +

Einsatz von Math.log()

+ +
Math.log(-1); // NaN, weil negativ
+Math.log(0);  // -Infinity
+Math.log(1);  // 0
+Math.log(10); // 2.302585092994046
+
+ +

Einsatz von  Math.log() mit unterschiedlichen Basen

+ +

Die folgende Funktion gibt den Logarithmus von y zur Basis x zurück (logx y):

+ +
function getBaseLog(x, y) {
+  return Math.log(y) / Math.log(x);
+}
+
+ +

Wenn getBaseLog(10, 1000) ausgeführt wird, ist das Ergebnis 2.9999999999999996. Diese Zahl ist nah an 3 und kommt durch Rundungsfehler bei Fließkommazahlen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.10', 'Math.log')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-math.log', 'Math.log')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-math.log', 'Math.log')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.log")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log10/index.html b/files/de/web/javascript/reference/global_objects/math/log10/index.html new file mode 100644 index 0000000000..fad6ea0996 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log10/index.html @@ -0,0 +1,101 @@ +--- +title: Math.log10() +slug: Web/JavaScript/Reference/Global_Objects/Math/log10 +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log10 +--- +
{{JSRef}}
+ +
Die Math.log10() Funktion gibt den Logarithmus zur Basis 10 zurück. Das bedeutet
+ +

x>0,Math.log10(x)=log10(x)=yso das10y=x\forall x > 0, \mathtt{\operatorname{Math.log10}(x)} = \log_10(x) = \text{the unique} \; y \; \text{such that} \; 10^y = x

+ +
{{EmbedInteractiveExample("pages/js/math-log10.html")}}
+ + + +

Syntax

+ +
Math.log10(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den Logarithmus zur Basis 10 der gegebenen Zahl. Wenn die Zahl negativ ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Wenn der Wert von x negativ ist, so gibt die Funktion immer NaN zurück.

+ +

Weil log10() eine statische Funktion von Math ist, wird es immer als Math.log10() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Diese Funktion ist äquivalent zu Math.log(x) / Math.log(10). Für log10(e) gibt es die Konstante {{jsxref("Math.LOG10E")}} welche 1 / {{jsxref("Math.LN10")}} ist.

+ +

Beispiele

+ +

Einsatz von Math.log10()

+ +
Math.log10(2);      // 0.3010299956639812
+Math.log10(1);      // 0
+Math.log10(0);      // -Infinity
+Math.log10(-2);     // NaN
+Math.log10(100000); // 5
+
+ +

Polyfill

+ +

Diese Funktion kann folgendermaßen emitiert werden:

+ +
Math.log10 = Math.log10 || function(x) {
+  return Math.log(x) * Math.LOG10E;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.log10', 'Math.log10')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.log10', 'Math.log10')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.log10")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log10e/index.html b/files/de/web/javascript/reference/global_objects/math/log10e/index.html new file mode 100644 index 0000000000..28d609df71 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log10e/index.html @@ -0,0 +1,85 @@ +--- +title: Math.LOG10E +slug: Web/JavaScript/Reference/Global_Objects/Math/LOG10E +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG10E +--- +
{{JSRef}}
+ +

Die Math.LOG10E Eigenschaft repräsentiert den Logarithmus zur Basis 10 von e, was gerundet 0,434 ist:

+ +

Math.LOG10E=log10(e)0,434\mathtt{\mi{Math.LOG10E}} = \log_10(e) \approx 0,434

+ +
{{EmbedInteractiveExample("pages/js/math-log10e.html")}}
+ + + +

{{js_property_attributes(0,0,0)}}

+ +

Beschreibung

+ +

Weil LOG10E eine statische Eigenschaft von Math ist, kann diese immer über Math.LOG10E erreicht werden, ohne dass ein Objekt erstellt werden muss (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.LOG10E

+ +

Die folgende Funktion gibt den Logarithmus zur Basis 10 von e zurück.

+ +
function getLog10e() {
+   return Math.LOG10E
+}
+
+getLog10e() // 0.4342944819032518
+ +

Spezifikationen

+ +

{{Spec2('ES1')}}

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.1.5', 'Math.LOG10E')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.log10e', 'Math.LOG10E')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.log10e', 'Math.LOG10E')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.LOG10E")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log1p/index.html b/files/de/web/javascript/reference/global_objects/math/log1p/index.html new file mode 100644 index 0000000000..a63eab6b6f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log1p/index.html @@ -0,0 +1,102 @@ +--- +title: Math.log1p() +slug: Web/JavaScript/Reference/Global_Objects/Math/log1p +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log1p +--- +
{{JSRef}}
+ +

Die Math.log1p() Funktion gibt den natürlichen Logarithmus (Logarithmus zur Basis {{jsxref("Math.E", "e")}}) von 1 + x zurück. Das bedeutet

+ +

x>-1,Math.log1p(x)=ln(1+x)\forall x > -1, \mathtt{\operatorname{Math.log1p}(x)} = \ln(1 + x)

+ +
{{EmbedInteractiveExample("pages/js/math-log1p.html")}}
+ + + +

Syntax

+ +
Math.log1p(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den natürliche Logarithmus (zur Basis {{jsxref("Math.E", "e")}}) von 1 plus der gegebenen Zahl. Wenn die Zahl kleiner als -1 ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Für sehr kleine Zahlen für x kann das Addieren mit 1 zu verlusten in der Präzision führen. Die Zahlen in JavaScript haben eine Genauigkeit von 15 Stellen. 1 + 1e-15 = 1.000000000000001, aber 1 + 1e-16 = 1.000000000000000 und damit exakt 1.0 in dieser Arithmetik, weil Ziffern nach der 15 Stelle gerundet werden.

+ +

Wenn log(1 + x) berechnet wird, bekommt man ein Ergebnis sehr na an x, wenn x klein ist (das ist der Grund, warum es 'natürlicher' Logarithmus heißt). Wenn Math.log(1 + 1.1111111111e-15) berechnet wird sollte man ein Ergebnis nah an 1.1111111111e-15 bekommt. Stattdessen berechnet man den Logarithmus von 1.00000000000000111022 (die Rundung geschieht im Binärsystem und ist manchmal unschön) un erhält das Ergebnis 1.11022...e-15 mit nur 3 korrekten Stellen. Wenn stattdessen Math.log1p(1.1111111111e-15) berechnet wird, bekommt man ein besseres Ergebnis von 1.1111111110999995e-15 mit 15 korrekten Stellen in der Präzision (aktuell 16 in diesem Fall).

+ +

Wenn der Wert von x kleiner als -1 ist, gibt die Funktion immer den Wert {{jsxref("NaN")}} zurück.

+ +

Weil log1p() eine statische Funktion von Math ist, wird es immer als Math.log1p() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.log1p()

+ +
Math.log1p(1);  // 0.6931471805599453
+Math.log1p(0);  // 0
+Math.log1p(-1); // -Infinity
+Math.log1p(-2); // NaN
+
+ +

Polyfill

+ +

Diese Funktion kann folgendermaßen emuliert werden:

+ +
Math.log1p = Math.log1p || function(x) {
+  return Math.log(1 + x);
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.log1p', 'Math.log1p')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.log1p', 'Math.log1p')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.log1p")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log2/index.html b/files/de/web/javascript/reference/global_objects/math/log2/index.html new file mode 100644 index 0000000000..de98c13128 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log2/index.html @@ -0,0 +1,101 @@ +--- +title: Math.log2() +slug: Web/JavaScript/Reference/Global_Objects/Math/log2 +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log2 +--- +
{{JSRef}}
+ +

Die Math.log2() Funktion gibt den Logarithmus zur Basis 2 zurück. Das bedeutet

+ +

x>0,Math.log2(x)=log2(x)=yso das2y=x\forall x > 0, \mathtt{\operatorname{Math.log2}(x)} = \log_2(x) = \text{the unique} \; y \; \text{such that} \; 2^y = x

+ +
{{EmbedInteractiveExample("pages/js/math-log2.html")}}
+ + + +

Syntax

+ +
Math.log2(x)
+ +

Parameters

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den Logarithmus zur Basis 2 der gegebenen Zahl. Wenn die Zahl negativ ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Wenn der Wert von x negativ ist, so gibt die Funktion immer NaN zurück.

+ +

Weil log2() eine statische Funktion von Math ist, wird es immer als Math.log2() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Diese Funktion ist äquivalent zu Math.log(x) / Math.log(2). Für log2(e) gibt es die Konstante {{jsxref("Math.LOG2E")}} welche 1 / {{jsxref("Math.LN2")}} ist.

+ +

Beispiele

+ +

Einsatz von Math.log2()

+ +
Math.log2(3);    // 1.584962500721156
+Math.log2(2);    // 1
+Math.log2(1);    // 0
+Math.log2(0);    // -Infinity
+Math.log2(-2);   // NaN
+Math.log2(1024); // 10
+
+ +

Polyfill

+ +

Diese Funktion kann mit folgender Funktion emitiert werden. Es kann sein, dass diese Funktion bei einigen eingabewerten ungenau (ungefähr 1 << 29) ist. Schachtel die Funktion in {{jsxref("Math.round()")}} wenn mit Bitmasken gearbeitet wird.

+ +
Math.log2 = Math.log2 || function(x) {
+  return Math.log(x) * Math.LOG2E;
+};
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.log2', 'Math.log2')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.log2', 'Math.log2')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.log2")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/log2e/index.html b/files/de/web/javascript/reference/global_objects/math/log2e/index.html new file mode 100644 index 0000000000..2f302bf4a2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/log2e/index.html @@ -0,0 +1,83 @@ +--- +title: Math.LOG2E +slug: Web/JavaScript/Reference/Global_Objects/Math/LOG2E +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG2E +--- +
{{JSRef}}
+ +

Die Math.LOG2E Eigenschaft repräsentiert den Logarithmus zur Basis 2 von e, was gerundet 1,443 ist:

+ +

Math.LOG2E=log2(e)1,442\mathtt{\mi{Math.LOG2E}} = \log_2(e) \approx 1,442

+ +
{{EmbedInteractiveExample("pages/js/math-log2e.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil LOG2E eine statische Eigenschaft von Math ist, kann diese immer über Math.LOG2E erreicht werden, ohne dass ein Objekt erstellt werden muss (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.LOG2E

+ +

Die folgende Funktion gibt den Logarithmus zur Basis 2 von e zurück.

+ +
function getLog2e() {
+   return Math.LOG2E
+}
+
+getLog2e() // 1.4426950408889634
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.1.4', 'Math.LOG2E')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.log2e', 'Math.LOG2E')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.log2e', 'Math.LOG2E')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.LOG2E")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/math.random/index.html b/files/de/web/javascript/reference/global_objects/math/math.random/index.html new file mode 100644 index 0000000000..6097229c1a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/math.random/index.html @@ -0,0 +1,112 @@ +--- +title: Math.random() +slug: Web/JavaScript/Reference/Global_Objects/Math/math.random +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/random +--- +
{{JSRef}}
+ +

Die Math.random() Funktion gibt eine Pseudozufallszahl in Form einer Gleitkommazahl im Bereich von 0 - 1 (0 inklusiv, aber 1 nicht) annähernd gleichverteilt zurück, die dann zur gewünschten Größe skaliert werden kann. Die Zufallszahl wird von der Implementierung bestimmt; sie kann nicht vom Benutzer ausgewählt oder zurückgesetzt werden.

+ +
{{EmbedInteractiveExample("pages/js/math-random.html")}}
+ +
+

Math.random() stellt keine kryprografisch sicheren Zufallszahlen bereit. Verwenden Sie sie auf keinen Fall für etwas, das  in Verbindung mit Sicherheit steht. Benutzen Sie stattdessen die Web Crypto API, genauer gesagt die {{domxref("RandomSource.getRandomValues()", "window.crypto.getRandomValues()")}}-Methode.

+
+ +

Syntax

+ +
Math.random()
+ +

Rückgabewert

+ +

Eine pseudozufällige Gleitkommazahl zwischen 0 (inklusiv) und 1 (exklusiv).

+ +

Beispiele

+ +

Beachten Sie, dass, weil Zahlen in JavaScript IEEE 754 Gleitkommazahlen sind, mit dem Verhalten zur nächsten geraden Zahl zu runden, die Bereiche für die folgenden Funktionen - mit Ausnahme für Math.random() selbst - nicht exakt sind.
+ Wenn extrem große Grenzen
(253 oder höher) gewählt werden, ist es in äußerst seltenen Fällen möglich, dass die eigentlich ausgeschlossenen Obergrenzen mit eingerechnet werden.

+ +

Erzeugt eine Zufallszahl zwischen 0 (inklusive) und 1 (exklusive)

+ +
function getRandom() {
+  return Math.random();
+}
+
+ +

Erzeugt eine Zufallszahl zwischen zwei Zahlen

+ +

Das Beispiel gibt eine zufällige Zahl zwischen zwei Zahlen zurück. Der Rückgabewert is größer oder gleich min und kleiner als max.

+ +
function getRandomArbitrary(min, max) {
+  return Math.random() * (max - min) + min;
+}
+
+ +

Erzeugt eine ganze Zufallszahl zwischen zwei Zahlen

+ +

Das Beispiel gibt eine zufällige ganze Zahl zwischen den spezifizierten Werten zurück. Der Wert ist nicht kleiner als min (oder der nächstgrößeren ganzen Zahl von min, wenn min keine ganze Zahl ist) und ist kleiner als  (aber nicht gleich) max.

+ +
function getRandomInt(min, max) {
+  min = Math.ceil(min);
+  max = Math.floor(max);
+  return Math.floor(Math.random() * (max - min)) + min;
+}
+
+ +
+

Es könnte verlockend sein, Math.round() zu verwenden, um das Ergebnis zu erreichen, aber das würde dazu führen, dass die zufälligen Zahlen einer ungleichmäßigen Verteilung folgen würden, die möglicherweise nicht den geforderten Bedürfnisse entsprechen würde.

+
+ +

Erzeugt eine ganze Zufallszahl zwischen zwei Zahlen (inklusiv)

+ +

Die obere getRandomInt() Funktion hat ein inklusives Minimum und ein exklusives Maximum. Was ist, wenn sowohl das Minimum als auch das Maximum inklusive sein sollen? Die getRandomIntInclusive() Funktion ermöglicht dieses:

+ +
function getRandomIntInclusive(min, max) {
+  min = Math.ceil(min);
+  max = Math.floor(max);
+  return Math.floor(Math.random() * (max - min +1)) + min;
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. JavaScript 1.0 (nur auf UNIX) / JavaScript 1.1 (auf allen Plattformen).
{{SpecName('ES5.1', '#sec-15.8.2.14', 'Math.random')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-math.random', 'Math.random')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-math.random', 'Math.random')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.random")}}

diff --git a/files/de/web/javascript/reference/global_objects/math/max/index.html b/files/de/web/javascript/reference/global_objects/math/max/index.html new file mode 100644 index 0000000000..e1ac3eba01 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/max/index.html @@ -0,0 +1,118 @@ +--- +title: Math.max() +slug: Web/JavaScript/Reference/Global_Objects/Math/max +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/max +--- +
{{JSRef}}
+ +

Die Funktion Math.max() gibt die größte von 0 oder mehr Zahlen zurück.

+ +
{{EmbedInteractiveExample("pages/js/math-max.html")}}
+ + + +

Syntax

+ +
Math.max([wert1[, wert2[, ...]]])
+ +

Parameter

+ +
+
wert1, wert2, ...
+
Zahlen.
+
+ +

Rückgabewert

+ +

Die größte der übergebenen Zahlen. Wenn mindestens ein Parameter nicht zu einer Zahl konvertiert werden kann, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Weil max() eine statische Methode von Math ist, kann nur Math.max() verwendet werden. Eine Verwendung mit Math als instanziertem Objekt ist nicht möglich (Math ist kein constructor).

+ +

Wenn keine Argumente übergeben wurden ist der Rückgabewert -{{jsxref("Infinity")}}.

+ +

Wenn mindestens eines der Argumente nicht in eine Zahl umgewandelt werden kann, ist der Rückgabewert {{jsxref("NaN")}}.

+ +

Beispiele

+ +

Einsatz von Math.max()

+ +
Math.max(10, 20);   //  20
+Math.max(-10, -20); // -10
+Math.max(-10, 20);  //  20
+
+ +

Das größte Element in einem Array ermitteln

+ +

{{jsxref("Array.prototype.reduce", "Array.reduce()")}} kann ebenfalls benutzt werden, um das Maximum eines Arrays zu erhalten, indem jeder Wert verglichen wird.

+ +
var arr = [1, 2, 3];
+var max = arr.reduce(function(a, b) {
+  return Math.max(a, b);
+});
+
+ +

Die folgende Funktion benutzt {{jsxref("Function.prototype.apply()")}}, um den maximalen Wert eines numerischen Arrays zu finden. getMaxOfArray([1, 2, 3]) entspricht Math.max(1, 2, 3), aber getMaxOfArray() kann programmatisch erstellte Arrays jeder Art annehmen.

+ +
function getMaxOfArray(numArray) {
+  return Math.max.apply(null, numArray);
+}
+
+ +

Alternativ ist es mit dem neuen {{jsxref("Operators/Spread_operator", "spread Operator")}} viel einfacher, den maximalen Wert eines Arrays herauszufinden.

+ +
var arr = [1, 2, 3];
+var max = Math.max(...arr);
+
+ +

Bei dem Einsatz des {{jsxref("Operators/Spread_operator", "spread Operator")}} oder apply kann der Aufruf fehlschlagen oder ein ungültiges Ergebnis herauskommen, wenn das Array zu viele Elemente hat. Das liegt daran, dass versucht wird die Elemente des Arrays als Parameter einer Funktion zu übergeben. Siehe für mehr Details im Abschnitt Einsatz von apply und standard Funktionen nach. Die reduce Lösung hat dieses Problem nicht.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. In JavaScript 1.0 implementiert.
{{SpecName('ES5.1', '#sec-15.8.2.11', 'Math.max')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.max', 'Math.max')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.max', 'Math.max')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.max")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/min/index.html b/files/de/web/javascript/reference/global_objects/math/min/index.html new file mode 100644 index 0000000000..9cd666fda3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/min/index.html @@ -0,0 +1,112 @@ +--- +title: Math.min() +slug: Web/JavaScript/Reference/Global_Objects/Math/min +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/min +--- +
{{JSRef}}
+ +

Die Math.min() Funktion gibt den Wert der kleinsten übergebenen Zahl zurück oder {{jsxref("NaN")}}, wenn ein Parameter keine Zahl ist und auch nicht in eine Zahl konvertiert werden kann.

+ +
{{EmbedInteractiveExample("pages/js/math-min.html")}}
+ + + +

Syntax

+ +
Math.min([value1[, value2[, ...]]])
+ +

Parameter

+ +
+
value1, value2, ...
+
Zahlen.
+
+ +

Rückgabewert

+ +

Die kleinste der übergebenen Zahlen. Wenn nur ein Parameter nicht zu einer Zahl konvertiert werden kann, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Da min() eine statische Eigenschaft von Math ist, muss immer Math.min() genutzt werden, ohne dass ein Math-Objekt erstellt wird (Math ist kein Konstruktor).

+ +

Ohne Übergabeparameter wird {{jsxref("Infinity")}} zurückgegeben.

+ +

Wenn mindestens ein Übergabeparameter nicht in eine Zahl konvertiert werden kann wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beispiele

+ +

Einsatz von Math.min()

+ +

Dies findet den kleinsten Wert aus x und y und weist diesen z zu.

+ +
var x = 10, y = -20;
+var z = Math.min(x, y);
+
+ +

Wert mittels Math.min() begrenzen

+ +

Math.min() wird oftmals verwendet um einen Wert so zu begrenzen, dass dieser nicht größer als ein gesetztes Limit werden kann. So kann dies

+ +
var x = f(foo);
+
+if (x > limit) {
+  x = limit;
+}
+
+ +

auch folgendermaßen formuliert werden

+ +
var x = Math.min(f(foo), limit);
+
+ +

Analog kann {{jsxref("Math.max()")}} verwendet werden um einen Mindestwert zu realisieren.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.12', 'Math.min')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.min', 'Math.min')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.min', 'Math.min')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.min")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/pi/index.html b/files/de/web/javascript/reference/global_objects/math/pi/index.html new file mode 100644 index 0000000000..4a07aadc15 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/pi/index.html @@ -0,0 +1,81 @@ +--- +title: Math.PI +slug: Web/JavaScript/Reference/Global_Objects/Math/PI +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/PI +--- +
{{JSRef}}
+ +

Die Math.PI Eigenschaft repräsentiert die Kreiszahl Pi, welche als Verhältnis zwischen Kreisumfang und Durchmesser definiert ist und gerundet die Zahl 3,14159 ist.

+ +

Math.PI=π3,14159\mathtt{\mi{Math.PI}} = \pi \approx 3,14159

+ +
{{EmbedInteractiveExample("pages/js/math-pi.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil PI eine statische Eigenschaft von Math ist, muss immer Math.PI genutzt werden, ohne dass ein Math Objekt erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.PI

+ +

Die folgende Funktion benutzt Math.PI, um aus einem Radius den Umfrang eines Kreises zu berechnen:

+ +
function calculateCircumference(radius) {
+  return Math.PI * (radius + radius);
+}
+
+calculateCircumference(1);  // 6.283185307179586
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.1.6', 'Math.PI')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.pi', 'Math.PI')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.pi', 'Math.PI')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.PI")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/pow/index.html b/files/de/web/javascript/reference/global_objects/math/pow/index.html new file mode 100644 index 0000000000..5966acd81f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/pow/index.html @@ -0,0 +1,113 @@ +--- +title: Math.pow() +slug: Web/JavaScript/Reference/Global_Objects/Math/pow +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow +--- +
{{JSRef}}
+ +

Die Funktion Math.pow() gibt die Potenz der Basis mit dem Exponenten an (BasisExponent)

+ +
{{EmbedInteractiveExample("pages/js/math-pow.html")}}
+ + + +

Syntax

+ +
Math.pow(Basis, Exponent)
+ +

Parameter

+ +
+
Basis
+
Basis (auch: die Grundzahl).
+
Exponent
+
der Exponent (auch: die Hochzahl).
+
+ +

Rückgabewert

+ +

Eine Zahl, die die Basis potenziert mit dem Exponenten repräsentiert.

+ +

Beschreibung

+ +

Weil pow() eine statische Funktion von Math ist, wird es immer als Math.pow() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Benutzung von Math.pow()

+ +
// einfach
+Math.pow(7, 2);    // 49
+Math.pow(7, 3);    // 343
+Math.pow(2, 10);   // 1024
+// Brüche als Exponenten
+Math.pow(4, 0.5);  // 2 (Wurzel aus 4)
+Math.pow(8, 1/3);  // 2 (Kubikwurzel aus 8)
+Math.pow(2, 0.5);  // 1.4142135623730951 (Wurzel aus 2)
+Math.pow(2, 1/3);  // 1.2599210498948732 (Kubikwurzel aus 2)
+// Negative Exponenten
+Math.pow(7, -2);   // 0.02040816326530612 (1/49)
+Math.pow(8, -1/3); // 0.5
+// Negative Basis
+Math.pow(-7, 2);   // 49 (Das Quadrat ist positiv)
+Math.pow(-7, 3);   // -343 (kann negativ sein)
+Math.pow(-7, 0.5); // NaN (negative Zahlen haben keine Quadratwurzel)
+// auch wegen Grenzen bei der Gleitkomma Berechnung,
+// Negative Basis mit Bruch als Exponent gibt immer NaN zurück
+Math.pow(-7, 1/3); // NaN
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}} +

Initiale Deffinition, Implementiert in JavaScript 1.0.

+
{{SpecName('ES5.1', '#sec-15.8.2.13', 'Math.pow')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.pow', 'Math.pow')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.pow', 'Math.pow')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.pow")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/round/index.html b/files/de/web/javascript/reference/global_objects/math/round/index.html new file mode 100644 index 0000000000..8e009bf6cb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/round/index.html @@ -0,0 +1,99 @@ +--- +title: Math.round() +slug: Web/JavaScript/Reference/Global_Objects/Math/round +tags: + - JavaScript + - Math + - Method + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/round +--- +

{{JSRef}}
+ Die Math.round() Funktion gibt die nächstgelegenen Ganzzahl einer Zahl zurück.

+ +
{{EmbedInteractiveExample("pages/js/math-round.html")}}
+ + + +

Syntax

+ +
Math.round(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den Wert der gegebenen Zahl, der zur nächsten ganzen Zahl gerundet wird.

+ +

Beschreibung

+ +

Wenn der Nachkommateil des Argumentes größer als 0.5 ist, wird das Argument zur nächsten ganzen Zahl, deren Absolutwert größer ist, gerundet. Wenn der Nachkommateil kleiner als 0.5 ist, wird auf die nächsten ganzen Zahl, deren Absolutwert kleiner ist, gerundet. Wenn der Nachkommateil genau 0.5 ist, wird auf die nächst größere ganze Zahl aufgerundet (in Richtung +∞). Das Verhalten bei 0.5 ist anders als bei vielen anderen Programmiersprachen, welche in der Regel zur nächsten ganzen Zahl, welche weiter entfernt von 0 liegt, runden (das kann zu unterschiedlichen Ergebnissen bei negativen Zahlen mit einem exakten Nachkommateil von 0.5 führen).

+ +

Weil round() eine statische Methode von Math ist, benutzt man als Aufruf immer Math.round() und nicht in dem man zunächst ein Math-Objekt erzeugt um anschliessend die round()-Methode aufzurufen (Math ist kein Konstruktor).

+ +

Beispiele

+ +
Math.round(20.49);  // 20
+Math.round(20.5);   // 21
+Math.round(42);     // 42
+Math.round(-20.5);  // -20
+Math.round(-20.51); // -21
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 1st Edition.{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.15', 'Math.round')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.round', 'Math.round')}}{{Spec2('ES6')}} +

 

+
{{SpecName('ESDraft', '#sec-math.round', 'Math.round')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.round")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sign/index.html b/files/de/web/javascript/reference/global_objects/math/sign/index.html new file mode 100644 index 0000000000..26a4085eb1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sign/index.html @@ -0,0 +1,115 @@ +--- +title: Math.sign() +slug: Web/JavaScript/Reference/Global_Objects/Math/sign +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sign +--- +
{{JSRef}}
+ +

Die Math.sign() Funktion gibt das Vorzeichen einer Zahl zurück, welches angibt, ob eine Zahl positiv, negativ oder 0 ist.

+ +
{{EmbedInteractiveExample("pages/js/math-sign.html")}}
+ + + +

Syntax

+ +
Math.sign(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Eine Zahl, die das Vorzeichen des übergebenen Wertes repräsentiert. Wenn der Parameter eine positive Zahl ist, eine negative Zahl ist oder eine Null (0) ist, wird die Funktion 1, -1, 0 oder -0 zurückgeben. Andernfalls wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Weil sign() eine statische Funktion von Math ist, wird sie immer als Math.sign() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Diese Funktion hat die 5 möglichen Rückgabewerte 1, -1, 0, -0 und NaN, welche "positive Zahlen", "negative Zahlen", "positiv 0", "negativ 0" und {{jsxref("NaN")}} repräsentieren.

+ +

Der Übergebeparameter dieser Funktion wird implizit zu einem number-Type konvertiert.

+ +

Beispiele

+ +

Einsatz von Math.sign()

+ +
Math.sign(3);     //  1
+Math.sign(-3);    // -1
+Math.sign('-3');  // -1
+Math.sign(0);     //  0
+Math.sign(-0);    // -0
+Math.sign(NaN);   // NaN
+Math.sign('foo'); // NaN
+Math.sign();      // NaN
+
+ +

Polyfill

+ +
if (!Math.sign) {
+  Math.sign = function(x) {
+    // If x is NaN, the result is NaN.
+    // If x is -0, the result is -0.
+    // If x is +0, the result is +0.
+    // If x is negative and not -0, the result is -1.
+    // If x is positive and not +0, the result is +1.
+    return ((x > 0) - (x < 0)) || +x;
+    // A more aesthetical persuado-representation is shown below
+    //
+    // ( (x > 0) ? 0 : 1 )  // if x is negative then negative one
+    //          +           // else (because you cant be both - and +)
+    // ( (x < 0) ? 0 : -1 ) // if x is positive then positive one
+    //         ||           // if x is 0, -0, or NaN, or not a number,
+    //         +x           // Then the result will be x, (or) if x is
+    //                      // not a number, then x converts to number
+  };
+}
+ +

In diesem Polyfill ist keine weitere Typumwandlung nötig, um aus (x > 0) oder (x < 0) Zahlen zu machen, weil das Subtrahieren voneinander eine Typkonvertierung von boolean zu Zahlen erzwingt.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusComment
{{SpecName('ES6', '#sec-math.sign', 'Math.sign')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.sign', 'Math.sign')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.sign")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sin/index.html b/files/de/web/javascript/reference/global_objects/math/sin/index.html new file mode 100644 index 0000000000..69a7a2f559 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sin/index.html @@ -0,0 +1,97 @@ +--- +title: Math.sin() +slug: Web/JavaScript/Reference/Global_Objects/Math/sin +tags: + - JavaScript + - Math + - Meth + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sin +--- +
{{JSRef}}
+ +

Die Math.sin() Funktion gibt den Sinus einer Zahl zurück.

+ +
{{EmbedInteractiveExample("pages/js/math-sin.html")}}
+ + + +

Syntax

+ +
Math.sin(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl im Bogenmaß (rad).
+
+ +

Rückgabewert

+ +

Den Sinus der übergebenen Zahl.

+ +

Beschreibung

+ +

Die Math.sin() Funktion gibt einen nummerischen Wert zwischen -1 und 1 zurück. Dieser repräsentiert den Sinus des Winkels.

+ +

Weil sin() eine statische Funktion von Math ist, wird es immer als Math.sin() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.sin()

+ +
Math.sin(0);           // 0
+Math.sin(1);           // 0.8414709848078965
+
+Math.sin(Math.PI / 2); // 1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.16', 'Math.sin')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.sin', 'Math.sin')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.sin', 'Math.sin')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.sin")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sinh/index.html b/files/de/web/javascript/reference/global_objects/math/sinh/index.html new file mode 100644 index 0000000000..99e8d1e3c6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sinh/index.html @@ -0,0 +1,102 @@ +--- +title: Math.sinh() +slug: Web/JavaScript/Reference/Global_Objects/Math/sinh +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sinh +--- +
{{JSRef}}
+ +

Die Math.sinh() Funktion gibt den Sinus Hyperbolicus einer Zahl zurück. Dieser kann mit dem Einsatz der {{jsxref("Math.E", "Eulerschen Zahl", "", 1)}} folgendermaßen berechnet werden:

+ +

Math.sinh(x)=ex-e-x2\mathtt{\operatorname{Math.sinh(x)}} = \frac{e^x - e^{-x}}{2}

+ +
{{EmbedInteractiveExample("pages/js/math-sinh.html")}}
+ + + +

Syntax

+ +
Math.sinh(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den Sinus Hyperbolicus der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil sinh() eine statische Funktion von Math ist, wird es immer als Math.sinh() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.sinh()

+ +
Math.sinh(0); // 0
+Math.sinh(1); // 1.1752011936438014
+
+ +

Polyfill

+ +

Diese Funktion kann mit Hilfe der Funktion {{jsxref("Math.exp()")}} emuliert werden:

+ +
Math.sinh = Math.sinh || function(x) {
+  return (Math.exp(x) - Math.exp(-x)) / 2;
+}
+
+ +

Oder nur mit einem Aufruf der {{jsxref("Math.exp()")}} Funktion:

+ +
Math.sinh = Math.sinh || function(x) {
+  var y = Math.exp(x);
+  return (y - 1 / y) / 2;
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.sinh', 'Math.sinh')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.sinh', 'Math.sinh')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.sinh")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sqrt/index.html b/files/de/web/javascript/reference/global_objects/math/sqrt/index.html new file mode 100644 index 0000000000..a7ad903569 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sqrt/index.html @@ -0,0 +1,99 @@ +--- +title: Math.sqrt() +slug: Web/JavaScript/Reference/Global_Objects/Math/sqrt +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt +--- +
{{JSRef}}
+ +

Die Math.sqrt() Funktion gibt die Quadratwurzel einer Zahl zurück. Diese Ist Mathematisch folgendermaßen definiert:

+ +

x0,Math.sqrt(x)=x=einy0so dasy2=x\forall x \geq 0, \mathtt{Math.sqrt(x)} = \sqrt{x} = \text{the unique} \; y \geq 0 \; \text{such that} \; y^2 = x

+ +
{{EmbedInteractiveExample("pages/js/math-sqrt.html")}}
+ + + +

Syntax

+ +
Math.sqrt(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Die Quadratwurzel der übergebenen Zahl. Wenn der Parameter negativ ist, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Wenn der Wert von x negativ ist, gibt Math.sqrt() {{jsxref("NaN")}} zurück.

+ +

Weil sqrt() eine statische Funktion von Math ist, wird es immer als Math.sqrt() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.sqrt()

+ +
Math.sqrt(9); // 3
+Math.sqrt(2); // 1.414213562373095
+
+Math.sqrt(1);  // 1
+Math.sqrt(0);  // 0
+Math.sqrt(-1); // NaN
+Math.sqrt(-0); // -0
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.17', 'Math.sqrt')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.sqrt', 'Math.sqrt')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.sqrt', 'Math.sqrt')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.sqrt")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sqrt1_2/index.html b/files/de/web/javascript/reference/global_objects/math/sqrt1_2/index.html new file mode 100644 index 0000000000..19e1a24f4d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sqrt1_2/index.html @@ -0,0 +1,84 @@ +--- +title: Math.SQRT1_2 +slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2 +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2 +--- +
{{JSRef}}
+ +

Die Math.SQRT1_2 Eigenschaft repräsentiert die Quadratwurzel aus 1/2, welche gerundet 0,707 ist:

+ +

Math.SQRT1_2=12=120,707\mathtt{\mi{Math.SQRT1_2}} = \sqrt{\frac{1}{2}} = \frac{1}{\sqrt{2}} \approx 0,707

+ +
{{EmbedInteractiveExample("pages/js/math-sqrt1_2.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil SQRT1_2 eine statische Eigenschaft von Math ist, muss immer Math.SQRT1_2 genutzt werden, ohne dass ein Math Objekt erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.SQRT1_2

+ +

Die folgende Funktion gibt die Quadratwurzel aus 1/2 zurück:

+ +
function getRoot1_2() {
+   return Math.SQRT1_2
+}
+
+getRoot1_2() // 0.7071067811865476
+ +

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.1.7', 'Math.SQRT1_2')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.SQRT1_2")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/sqrt2/index.html b/files/de/web/javascript/reference/global_objects/math/sqrt2/index.html new file mode 100644 index 0000000000..14b748c555 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/sqrt2/index.html @@ -0,0 +1,82 @@ +--- +title: Math.SQRT2 +slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT2 +tags: + - JavaScript + - Math + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT2 +--- +
{{JSRef}}
+ +

Die Math.SQRT2 Eigenschaft repräsentiert die Quadratwurzel aus 2, welche gerundet 1,414 ist:

+ +

Math.SQRT2=21,414\mathtt{\mi{Math.SQRT2}} = \sqrt{2} \approx 1,414

+ +
{{EmbedInteractiveExample("pages/js/math-sqrt2.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Weil SQRT2 eine statische Eigenschaft von Math ist, muss immer Math.SQRT2 genutzt werden, ohne dass ein Math-Objekt erstellt wird (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.SQRT2

+ +

Die folgende Funktion gibt die Quadratwurzel aus 2 zurück:

+ +
function getRoot2() {
+   return Math.SQRT2
+}
+
+getRoot2() // 1.4142135623730951
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.1.8', 'Math.SQRT2')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.sqrt2', 'Math.SQRT2')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.sqrt2', 'Math.SQRT2')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.SQRT2")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/tan/index.html b/files/de/web/javascript/reference/global_objects/math/tan/index.html new file mode 100644 index 0000000000..92102e3ae2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/tan/index.html @@ -0,0 +1,102 @@ +--- +title: Math.tan() +slug: Web/JavaScript/Reference/Global_Objects/Math/tan +tags: + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/tan +--- +
{{JSRef}}
+ +

Die Math.tan() Funktion gibt den Tangens einer Zahl.

+ +
{{EmbedInteractiveExample("pages/js/math-tan.html")}}
+ + + +

Syntax

+ +
Math.tan(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl im Winkelmaß (rad).
+
+ +

Rückgabewert

+ +

Den Tangens der übergebenen Zahl.

+ +

Beschreibung

+ +

Die Math.tan() Funktion gibt einen numerischen Wert zurück, welcher den Tangens eines Winkels repräsentiert.

+ +

Weil tan() eine statische Funktion von Math ist, wird es immer als Math.tan() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.tan()

+ +
Math.tan(1); // 1.5574077246549023
+
+ +

Weil die Math.tan() Funktion Werte im Winkelmaß erwartet, es aber oftmals einfacher ist mit Winkeln zu rechnen, nutzt die folgende Funktion Winkel (in Grad) und Convertiert diese in das Winkelmaß: 

+ +
function getTanDeg(deg) {
+  var rad = deg * Math.PI/180;
+  return Math.tan(rad);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.8.2.18', 'Math.tan')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-math.tan', 'Math.tan')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-math.tan', 'Math.tan')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.tan")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/tanh/index.html b/files/de/web/javascript/reference/global_objects/math/tanh/index.html new file mode 100644 index 0000000000..7bfa025f4e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/tanh/index.html @@ -0,0 +1,93 @@ +--- +title: Math.tanh() +slug: Web/JavaScript/Reference/Global_Objects/Math/tanh +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/tanh +--- +
{{JSRef}}
+ +

Die Math.tanh() Funktion gibt den Tangens Hyperbolicus einer Zahl zurück. Dieser kann folgendermaßen errechnet werden:

+ +

tanhx=sinhxcoshx=ex-e-xex+e-x=e2x-1e2x+1\tanh x = \frac{\sinh x}{\cosh x} = \frac {e^x - e^{-x}} {e^x + e^{-x}} = \frac{e^{2x} - 1}{e^{2x}+1}

+ +
{{EmbedInteractiveExample("pages/js/math-tanh.html")}}
+ +

Syntax

+ +
Math.tanh(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den Tangens Hyperbolicus der übergebenen Zahl.

+ +

Beschreibung

+ +

Weil tanh() eine statische Funktion von Math ist, wird es immer als Math.tanh() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.tanh()

+ +
Math.tanh(0);        // 0
+Math.tanh(Infinity); // 1
+Math.tanh(1);        // 0.7615941559557649
+
+ +

Polyfill

+ +

Diese Funktion kann mit Hilfe der Funktion {{jsxref("Math.exp()")}} emuliert werden:

+ +
Math.tanh = Math.tanh || function(x){
+    var a = Math.exp(+x), b = Math.exp(-x);
+    return a == Infinity ? 1 : b == Infinity ? -1 : (a - b) / (a + b);
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.tanh', 'Math.tanh')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.tanh', 'Math.tanh')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.tanh")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/math/trunc/index.html b/files/de/web/javascript/reference/global_objects/math/trunc/index.html new file mode 100644 index 0000000000..43aa34b2d7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/math/trunc/index.html @@ -0,0 +1,125 @@ +--- +title: Math.trunc() +slug: Web/JavaScript/Reference/Global_Objects/Math/trunc +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Math/trunc +--- +
{{JSRef}}
+ +

Die Math.trunc() Funktion gibt den ganzzahligen Teil einer Zahl zurück, indem alle Nachkommastellen entfernt werden.

+ +
{{EmbedInteractiveExample("pages/js/math-trunc.html")}}
+ + + +

Syntax

+ +
Math.trunc(x)
+ +

Parameter

+ +
+
x
+
Eine Zahl.
+
+ +

Rückgabewert

+ +

Den ganzzahligen Teil der übergebenen Zahl.

+ +

Beschreibung

+ +

Im Gegensatz zu den drei Math Funktionen {{jsxref("Math.floor()")}}, {{jsxref("Math.ceil()")}} und {{jsxref("Math.round()")}} arbeitet Math.trunc() sehr einfach. Sie entfernt den Punkt und die Ziffern rechts davon, ohne zu beachten, ob es sich um eine positive oder negative Nummer handelt.

+ +

Beim übergeben eines Parameters wird dieser implizit in einen Nummern-Typ konvertiert.

+ +

Weil trunc() eine statische Funktion von Math ist, wird es immer als Math.trunc() eingesetzt, jedoch nicht als Methode eines erzeugten Math Objektes (Math ist kein Konstruktor).

+ +

Beispiele

+ +

Einsatz von Math.trunc()

+ +
Math.trunc(13.37);    // 13
+Math.trunc(42.84);    // 42
+Math.trunc(0.123);    //  0
+Math.trunc(-0.123);   // -0
+Math.trunc('-1.123'); // -1
+Math.trunc(NaN);      // NaN
+Math.trunc('foo');    // NaN
+Math.trunc();         // NaN
+
+ +

Polyfill

+ +
if(!Math.trunc) {
+  Math.trunc = function(v) {
+    v = +v;
+    if(!isFinite(v)) return v;
+
+    return (v - v % 1)   ||   (v < 0 ? -0 : v === 0 ? v : 0);
+
+    // returns:
+    //  0        ->  0
+    // -0        -> -0
+    //  0.2      ->  0
+    // -0.2      -> -0
+    //  0.7      ->  0
+    // -0.7      -> -0
+    //  Infinity ->  Infinity
+    // -Infinity -> -Infinity
+    //  NaN      ->  NaN
+    //  null     ->  0
+  };
+}
+ +

oder:

+ +
if(!Math.trunc) {
+  Math.trunc = function(v) {
+    return v < 0 ? Math.ceil(v) : Math.floor(v);
+  }
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-math.trunc', 'Math.trunc')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-math.trunc', 'Math.trunc')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Math.trunc")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/nan/index.html b/files/de/web/javascript/reference/global_objects/nan/index.html new file mode 100644 index 0000000000..434f2b811a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/nan/index.html @@ -0,0 +1,97 @@ +--- +title: NaN +slug: Web/JavaScript/Reference/Global_Objects/NaN +tags: + - JavaScript + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/NaN +--- +
{{jsSidebar("Objects")}}
+ +

Die globale NaN Eigenschaft ist ein Wert, der Not-A-Number (keine Zahl) repräsentiert.

+ +

{{js_property_attributes(0,0,0)}}

+ +
{{EmbedInteractiveExample("pages/js/globalprops-nan.html")}}
+ + + +

Syntax

+ +
NaN
+ +

Beschreibung

+ +

NaN ist eine Eigenschaft des globalen Objektes.

+ +

Der initiale Wert von NaN ist Not-A-Number — der gleiche Wert wie {{jsxref("Number.NaN")}}. In modernen Browsern ist NaN eine nicht konfigurierbare und nicht überschreibbare Eigenschaft. Immer wenn dieses nicht der Fall ist, sollte es vermieden werden, diese zu überschreiben.

+ +

Der Einsatz von NaN in Programmen ist selten. Es wird als Rückgabewert genutzt, wenn {{jsxref("Math")}} Funktionen fehlschlagen (Math.sqrt(-1)) oder wenn der Versuch, eine Zeichenkette in eine Nummer zu konvertieren, fehlschlägt (parseInt("blabla")).

+ +

Tests mit NaN

+ +

Gleichheitsoperatoren (==, !=, === und !==) können nicht genutzt werden, um auf NaN zu prüfen. Stattdessen können die Methoden {{jsxref("Number.isNaN()")}} oder {{jsxref("Global_Objects/isNaN", "isNaN()")}} eingesetzt werden. Alternativ kann ein Vergleich auf sich selbst durchgeführt werden, weil nur NaN mit sich selbst verglichen ungleich ist.

+ +
NaN === NaN;        // false
+Number.NaN === NaN; // false
+isNaN(NaN);         // true
+isNaN(Number.NaN);  // true
+
+function valueIsNaN(v) { return v !== v; }
+valueIsNaN(1);          // false
+valueIsNaN(NaN);        // true
+valueIsNaN(Number.NaN); // true
+
+ +

Die Unterschiede zwischen isNaN() and Number.isNaN() sind zu beachten: ersteres wird true zurückgeben, wenn der übergebene Wert NaN ist, oder wenn er NaN wird, nachdem er zu einer Zahl umgewandelt wurde, während letzteres nur dann true zurückgibt, wenn der aktuelle Wert NaN ist:

+ +
isNaN('hello world'); // returns 'true'.
+Number.isNaN('Hello world'); // returns 'false'.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3
{{SpecName('ES5.1', '#sec-15.1.1.1', 'NaN')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-value-properties-of-the-global-object-nan', 'NaN')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-value-properties-of-the-global-object-nan', 'NaN')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.NaN")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/null/index.html b/files/de/web/javascript/reference/global_objects/null/index.html new file mode 100644 index 0000000000..323579ee42 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/null/index.html @@ -0,0 +1,93 @@ +--- +title: 'null' +slug: Web/JavaScript/Reference/Global_Objects/null +tags: + - JavaScript + - Literal + - Primitive +translation_of: Web/JavaScript/Reference/Global_Objects/null +--- +
{{jsSidebar("Objects")}}
+ +

Der Wert null repräsentiert das absichtliche Fehlen eines Wertes. Es ist einer der {{Glossary("Primitive", "Primitiven Werte")}} in Javascript.

+ +
{{EmbedInteractiveExample("pages/js/globalprops-null.html")}}
+ + + +

Syntax

+ +
null 
+ +

Beschreibung

+ +

Der Wert null wird als Literal geschrieben: null. Der Wert null ist ein Literal (keine Eigenschaft des globalen Objektes wie {{jsxref("Global_Objects/undefined", "undefined")}}). Stattdessen drückt null einen Mangel an Identifikation aus und zeigt an, dass eine Variable auf kein Objekt zeigt. In APIs wird null oftmals an Stellen verwendet, an denen ein Objekt optional genutzt werden kann.

+ +
// foo existiert nicht. Es wurde nicht definiert und nirgendwo initialisiert:
+foo;
+"ReferenceError: foo is not defined"
+
+// foo existiert nun, aber die Variable hat keinen Typ oder Wert:
+var foo = null;
+foo;
+"null"
+
+ +

Unterschied zwischen null und undefined

+ +

Wenn auf null geprüft wird, sollte nicht der Gleichheitsvergleich ({{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}) mit dem Identitätsvergleich ({{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}) verwechselt werden, weil bei der Prüfung auf Gleichheit eine implizite Typumwandlung vorgenommen wird.

+ +
typeof null          // "object" (not "null" for legacy reasons)
+typeof undefined     // "undefined"
+null === undefined   // false
+null == undefined    // true
+null === null        // true
+null == null         // true
+!null                // true
+isNaN(1 + null)      // false
+isNaN(1 + undefined) // true
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-4.3.11', 'null value')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-null-value', 'null value')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-null-value', 'null value')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.null")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/epsilon/index.html b/files/de/web/javascript/reference/global_objects/number/epsilon/index.html new file mode 100644 index 0000000000..6259e2443f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/epsilon/index.html @@ -0,0 +1,75 @@ +--- +title: Number.EPSILON +slug: Web/JavaScript/Reference/Global_Objects/Number/EPSILON +tags: + - ECMAScript 2015 + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/EPSILON +--- +
{{JSRef}}
+ +

Die Eigenschaft Number.EPSILON beschreibt den Unterschied zwischen 1 und der kleinsten Gleitpunktzahl größer als 1.

+ +

Man muss kein Objekt von Typ {{jsxref("Number")}}  erzeugen, um auf diese statische Eigenschaft zuzugreifen. Man muss nur Number.EPSILON aufrufen.

+ +
{{EmbedInteractiveExample("pages/js/number-epsilon.html")}}
+ + + +
{{js_property_attributes(0,0,0)}}
+ +

Beschreibung

+ +

Die EPSILON Eigenschaft hat einen ungefähren Wert von 2.2204460492503130808472633361816E-16 order 2-52.

+ +

Beispiele

+ +

Testgleichung

+ +
x = 0.2;
+y = 0.3;
+z = 0.1;
+equal = (Math.abs(x - y + z) < Number.EPSILON);
+ +

Polyfill

+ +
if (Number.EPSILON === undefined) {
+    Number.EPSILON = Math.pow(2, -52);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.epsilon', 'Number.EPSILON')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.epsilon', 'Number.EPSILON')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.EPSILON")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/index.html b/files/de/web/javascript/reference/global_objects/number/index.html new file mode 100644 index 0000000000..95bcd0652f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/index.html @@ -0,0 +1,180 @@ +--- +title: Number +slug: Web/JavaScript/Reference/Global_Objects/Number +tags: + - JavaScript + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Number +--- +
{{JSRef}}
+ +

Das JavaScript Objekt Number ist ein Container Objekt (Wrapper Objekt), welches das Arbeiten mit numerischen Werten erlaubt. Ein Number Objekt wird erzeugt indem der Number() Konstruktor verwendet wird.

+ +

Syntax

+ +
new Number(value);
+ +

Parameter

+ +
+
value
+
Ein numerischer Wert, der als Objekt erstellt werden soll.
+
+ +

Beschreibung

+ +

Die hauptsächlichen Nutzungen des Number Objektes sind:

+ + + +

Eigenschaften

+ +
+
{{jsxref("Number.EPSILON")}}
+
Das kleinste Intervall zwischen zwei repräsentierbaren Zahlen.
+
{{jsxref("Number.MAX_SAFE_INTEGER")}}
+
Die größte sichere Ganzzahl in JavaScript (253 -1).
+
{{jsxref("Number.MAX_VALUE")}}
+
Die größte repräsentierbare Zahl.
+
{{jsxref("Number.MIN_SAFE_INTEGER")}}
+
Die kleinste sichere Ganzzahl in JavaScript (-(253 -1)).
+
{{jsxref("Number.MIN_VALUE")}}
+
Die kleinste positive repräsentierbare Zahl. Das ist die positive Zahl, die am nächsten an 0 ist (aber nicht 0 ist).
+
{{jsxref("Number.NaN")}}
+
Spezieller "keine Zahl" Wert.
+
{{jsxref("Number.NEGATIVE_INFINITY")}}
+
Spezieller Wert welcher negativ Unendlich repräsentiert; wird bei einem Overflow zurückgegeben.
+
{{jsxref("Number.POSITIVE_INFINITY")}}
+
Spezieller Wert welcher positiv Unendlich repräsentiert; wird bei einem Overflow zurückgegeben.
+
{{jsxref("Number.prototype")}}
+
+
+
Ermöglicht das Hinzufügen von Eigenschaften zu einem Number Objekt
+
+
+
+ +

Methoden

+ +
+
{{jsxref("Number.isNaN()")}}
+
Gibt an, ob der übergebene Wert {{jsxref("Number.NaN", "NaN")}} ist.
+
{{jsxref("Number.isFinite()")}}
+
Gibt an, ob der übergebene Wert eine endliche Zahl ist.
+
{{jsxref("Number.isInteger()")}}
+
Gibt an, ob der übergebene Wert eine ganze Zahl ist.
+
{{jsxref("Number.isSafeInteger()")}}
+
Gibt an, ob der der übergebene Wert eine sichere ganze Zahl ist (eine ganze Zahl zwischen -(253 -1) und 253 -1).
+
{{jsxref("Number.toInteger()")}} {{obsolete_inline}}
+
Wurde eingesetzt um eine Zahl zu einer ganzen Zahl zu konvertieren. Die Funktion wurde entfernt.
+
{{jsxref("Number.parseFloat()")}}
+
Der Wert ist der gleiche wie bei der {{jsxref("parseFloat", "parseFloat()")}} Funktion des globalen Objektes.
+
{{jsxref("Number.parseInt()")}}
+
Der Wert ist der gleiche wie bei der {{jsxref("parseInt", "parseInt()")}} Funktion des globalen Objektes.
+
+ +

Number Instanzen

+ +

Alle Instanzen von Number erben von {{jsxref("Number.prototype")}}. Das Prototyp Objekt des Number Konstruktors kann verändert werden, um alle Instanzen von Number zu beeinflussen.

+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Number/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Einsatz des Number Objektes zur Zuweisung von numerischen Variablen

+ +

Das folgende Beispiel benutzt Eigenschaften des Number Objektes um Werte zu numerischen Variablen zuzuweisen:

+ +
var biggestNum = Number.MAX_VALUE;
+var smallestNum = Number.MIN_VALUE;
+var infiniteNum = Number.POSITIVE_INFINITY;
+var negInfiniteNum = Number.NEGATIVE_INFINITY;
+var notANum = Number.NaN;
+
+ +

Ganzzahlbereich von Number

+ +

Das folgende Beispiel zeigt die kleinste und größte Ganzzahl, welche mit Number Objekten repräsentiert werden kann (für Details siehe im ECMAScript Standard Kapitel 6.1.6 The Number Type):

+ +
var biggestInt = 9007199254740992;
+var smallestInt = -9007199254740992;
+
+ +

Wenn Daten im JSON Format eingelesen werden und Ganzzahlen den oben gezeigten Bereich übersteigen, kann es passieren, dass Fehler beim Erstellen von Number Objekten auftreten. Mit dem Einsatz von {{jsxref("String")}} können solche Fehler umgangen werden. 

+ +

Einsatz von Number zum Konvertieren eines Date Objekts

+ +

Das folgende Beispiel konvertiert ein {{jsxref("Date")}} Objekt in einen numerischen Wert. Dazu wird Number als Funktion verwendet:

+ +
var d = new Date("December 17, 1995 03:24:00");
+print(Number(d));
+
+ +

Ausgabe: "819199440000".

+ +

Konvertiertung von Strings zu Nummern

+ +
Number('123')     // 123
+Number('12.3')    // 12.3
+Number('123e-1')  // 12.3
+Number('')        // 0
+Number('0x11')    // 17
+Number('0b11')    // 3
+Number('0o11')    // 9
+Number('foo')     // NaN
+Number('100a')    // NaN
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7', 'Number')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number-objects', 'Number')}}{{Spec2('ES6')}} +

Neue Methoden und Properties hinzugefügt: {{jsxref("Number.EPSILON", "EPSILON")}}, {{jsxref("Number.isFinite", "isFinite")}}, {{jsxref("Number.isInteger", "isInteger")}}, {{jsxref("Number.isNaN", "isNaN")}}, {{jsxref("Number.parseFloat", "parseFloat")}}, {{jsxref("Number.parseInt", "parseInt")}}

+
{{SpecName('ESDraft', '#sec-number-objects', 'Number')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.Number")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/isfinite/index.html b/files/de/web/javascript/reference/global_objects/number/isfinite/index.html new file mode 100644 index 0000000000..3db1065680 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/isfinite/index.html @@ -0,0 +1,93 @@ +--- +title: Number.isFinite() +slug: Web/JavaScript/Reference/Global_Objects/Number/isFinite +tags: + - JavaScript + - Method + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isFinite +--- +
{{JSRef}}
+ +

Die Methode Number.isFinite() stellt fest, ob ein Wert endlich ist oder nicht.

+ +
{{EmbedInteractiveExample("pages/js/number-isfinite.html")}}
+ + + +

Syntax

+ +
Number.isFinite(testWert)
+ +

Parameter

+ +
+
testWert
+
Wert, der auf Endlichkeit getestet wird.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}} der beschreibt, ob eine Zahl endlich oder nicht endlich ist.

+ +

Beschreibung

+ +

Im Vergleich zu der globalen Funktion {{jsxref("isFinite", "isFinite()")}}, werden übergeben Wert nicht in eine Zahl konvertiert. Das bedeutet, dass nur Werte vom Typ number die endlich sind true als Resultat haben.

+ +

Beispiele

+ +
Number.isFinite(Infinity);  // false
+Number.isFinite(NaN);       // false
+Number.isFinite(-Infinity); // false
+
+Number.isFinite(0);         // true
+Number.isFinite(2e64);      // true
+
+Number.isFinite('0');       // false, würde mit der globalen
+                            // Funktion isFinite('0') true ergeben
+Number.isFinite(null);      // false, würde mit der globalen
+                            // Funktion isFinite(null) true ergeben
+
+ +

Polyfill

+ +
Number.isFinite = Number.isFinite || function(value) {
+    return typeof value === 'number' && isFinite(value);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-number.isfinite', 'Number.isInteger')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.isfinite', 'Number.isInteger')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.isFinite")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/isinteger/index.html b/files/de/web/javascript/reference/global_objects/number/isinteger/index.html new file mode 100644 index 0000000000..0befee0d25 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/isinteger/index.html @@ -0,0 +1,98 @@ +--- +title: Number.isInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/isInteger +tags: + - JavaScript + - Method + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isInteger +--- +
{{JSRef}}
+ +

Die Number.isInteger() Methode prüft,  ob ein übergebener Parameter eine ganze Zahl ist.

+ +
{{EmbedInteractiveExample("pages/js/number-isinteger.html")}}
+ + + +

Syntax

+ +
Number.isInteger(value)
+ +

Parameter

+ +
+
value
+
Wert der getestet wird, ob er eine ganze Zahl ist.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}} der angibt, ob der übergebene Wert eine ganze Zahl ist oder nicht.

+ +

Beschreibung

+ +

Wenn der übergebene Wert eine ganze Zahl ist, wird true zurückgegeben, anderfalls wird false zurückgegeben. Wenn der Wert {{jsxref("NaN")}} oder Unendlich (Infinity) ist, wird false zurückgegeben.

+ +

Beispiele

+ +
Number.isInteger(0);         // true
+Number.isInteger(1);         // true
+Number.isInteger(-100000);   // true
+Number.isInteger(99999999999999999999999); // true
+
+Number.isInteger(0.1);       // false
+Number.isInteger(Math.PI);   // false
+
+Number.isInteger(NaN);       // false
+Number.isInteger(Infinity);  // false
+Number.isInteger(-Infinity); // false
+Number.isInteger('10');      // false
+Number.isInteger(true);      // false
+Number.isInteger(false);     // false
+Number.isInteger([1]);       // false
+
+ +

Polyfill

+ +
Number.isInteger = Number.isInteger || function(value) {
+  return typeof value === 'number' &&
+    isFinite(value) &&
+    Math.floor(value) === value;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-number.isinteger', 'Number.isInteger')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.isinteger', 'Number.isInteger')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.isInteger")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/isnan/index.html b/files/de/web/javascript/reference/global_objects/number/isnan/index.html new file mode 100644 index 0000000000..08d1a52303 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/isnan/index.html @@ -0,0 +1,104 @@ +--- +title: Number.isNaN() +slug: Web/JavaScript/Reference/Global_Objects/Number/isNaN +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isNaN +--- +
{{JSRef}}
+ +

Die Number.isNaN() Methode stellt fest, ob der Übergabewert {{jsxref("NaN")}} ist und der Typ des Parameters  {{jsxref("Number")}} ist . Dieses ist eine robustere Version der globalen Methode {{jsxref("isNaN", "isNaN()")}}

+ +
{{EmbedInteractiveExample("pages/js/number-isnan.html", "taller")}}
+ + + +

Syntax

+ +
Number.isNaN(testWert)
+ +

Parameter

+ +
+
testWert
+
Der Wert, der auf {{jsxref("NaN")}} getestet werden soll.
+
+ +

Rückgabewert

+ +

true wenn der Wert {{jsxref("NaN")}} und der Typ {{jsxref("Number")}} ist. Anderfalls false.

+ +

Beschreibung

+ +

Weil beide Gleichheitsoperatoren, {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} und {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}, den Vergleich, ob {{jsxref("NaN")}} gleich {{jsxref("NaN")}} ist, zu false auswerten, hat die Methode Number.isNaN() an Bedeutung gewonnen. Diese Situation ist anders als bei allen anderen Vergleichen von Werten in JavaScript.

+ +

Im Vergleich zu der globalen Methode {{jsxref("isNaN", "isNaN()")}} hat die Methode Number.isNaN() nicht das Problem, dass Werte zu einer Nummer konvertiert werden. Das bedeutet, das Werte, die normalerweise zu {{jsxref("NaN")}} konvertiert würden, aber momentan nicht dem Wert {{jsxref("NaN")}} entsprechen, ohne Probleme der Methode übergeben werden können. Das wiederum bedeutet, dass nur Werte vom Typ {{jsxref("Number")}}, die zudem {{jsxref("NaN")}} entsprechen true als Resultat haben.

+ +

Beispiele

+ +
Number.isNaN(NaN);        // true
+Number.isNaN(Number.NaN); // true
+Number.isNaN(0 / 0)       // true
+
+// Beispiele, bei denen isNaN() true zurück gibt
+Number.isNaN('NaN');      // false
+Number.isNaN(undefined);  // false
+Number.isNaN({});         // false
+Number.isNaN('blabla');   // false
+
+// Diese alle geben false zurück
+Number.isNaN(true);
+Number.isNaN(null);
+Number.isNaN(37);
+Number.isNaN('37');
+Number.isNaN('37.37');
+Number.isNaN('');
+Number.isNaN(' ');
+
+ +

Polyfill

+ +

Das Folgende funktioniert, weil NaN der einzige Wert ist, welcher nicht gleich mit sich selbst ist.

+ +
Number.isNaN = Number.isNaN || function(value) {
+    return value !== value;
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.isnan', 'Number.isnan')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.isnan', 'Number.isnan')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.isNaN")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/issafeinteger/index.html b/files/de/web/javascript/reference/global_objects/number/issafeinteger/index.html new file mode 100644 index 0000000000..9f9d35082d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/issafeinteger/index.html @@ -0,0 +1,99 @@ +--- +title: Number.isSafeInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger +--- +
{{JSRef}}
+ +

Die Number.isSafeInteger() Methode prüft, ob der übergebene Wert eine Nummer ist, die ein sichere ganze Zahl ist.

+ +
{{EmbedInteractiveExample("pages/js/number-issafeinteger.html")}}
+ + + +

Eine sichere ganze Zahl ist

+ + + +

Zum Beispiel ist 253 - 1 eine sichere ganze Zahle: sie kann exakt repräsentiert werden und keine andere ganze Zahl wird in jedem IEEE-754 Rundungsmodus zu ihr gerundet. Im gegensatz dazu ist 253 keine sichere ganze Zahl: Sie kann in IEEE-754 exakt repräsentiert werden, jedoch wird die ganze Zahl 253 + 1 kann nicht exakt repräsentiert werden und wird zu 253 in den Modus zum nächsten Runden und zu null runden gerundet. Die sicheren ganzen Zahlen sind alle ganzen Zahlen im Bereich von -(253 - 1) inklusiv und 253 - 1 inklusiv.

+ +

Der Einsatz von Zahlen größer ~9 Biliarden oder kleiner ~-9 Biliarder mit voller Präzision benötigen eine Langzahlarythmetik Bibliothek. Mehr Informationen über die Repräsentation von Gleitkommazahlen gibt es in dem Artikel What Every Programmer Needs to Know about Floating Point Arithmetic.

+ +

Syntax

+ +
Number.isSafeInteger(testValue)
+
+ +

Parameter

+ +
+
testValue
+
Wert der getestet wird, ob er ein sichere ganze Zahl ist.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}}, der angibt, ob die übergebenen Zahl eine sichere ganze Zahl ist oder nicht.

+ +

Beispiele

+ +
Number.isSafeInteger(3);                    // true
+Number.isSafeInteger(Math.pow(2, 53));      // false
+Number.isSafeInteger(Math.pow(2, 53) - 1);  // true
+Number.isSafeInteger(NaN);                  // false
+Number.isSafeInteger(Infinity);             // false
+Number.isSafeInteger('3');                  // false
+Number.isSafeInteger(3.1);                  // false
+Number.isSafeInteger(3.0);                  // true
+
+ +

Polyfill

+ +
Number.isSafeInteger = Number.isSafeInteger || function (value) {
+   return Number.isInteger(value) && Math.abs(value) <= Number.MAX_SAFE_INTEGER;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.isSafeInteger")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/max_safe_integer/index.html b/files/de/web/javascript/reference/global_objects/number/max_safe_integer/index.html new file mode 100644 index 0000000000..1254955d54 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/max_safe_integer/index.html @@ -0,0 +1,68 @@ +--- +title: Number.MAX_SAFE_INTEGER +slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER +tags: + - ECMAScript 2015 + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER +--- +
{{JSRef}}
+ +

Die Number.MAX_SAFE_INTEGER Konstante repräsentiert die größte, sichere, ganze Zahl in JavaScript (253 - 1).

+ +
{{EmbedInteractiveExample("pages/js/number-maxsafeinteger.html")}}
+ + + +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Die MAX_SAFE_INTEGER Konstante hat einen Wert von 9007199254740991 (9.007.199.254.740.991 oder ca. 9 Billiarde). Die Bedeutung hinter dieser Zahl ist, dass in JavaScript double-precision floating-point Zahlen wie sie in IEEE 754 spezifiziert sind benutzt werden. Nach dieser Spezifikation ist die sichere Repräsentation von Zahlen nur zwischen -(253 - 1) und 253 - 1 möglich.

+ +

Sicher heißt in diesem Kontext, dass es möglich ist ganze Zahlen exakt zu repräsentieren und sie korrekt zu vergleichen. Zum Beispiel wird Number.MAX_SAFE_INTEGER + 1 === Number.MAX_SAFE_INTEGER + 2 zu true ausgewertet, was mathematisch nicht richtig ist. Weiter Informationen sind im Artikel  {{jsxref("Number.isSafeInteger()")}} zu finden. 

+ +

Weil MAX_SAFE_INTEGER eine statische Eigenschaft von {{jsxref("Number")}} ist, wird sie immer mit Number.MAX_SAFE_INTEGER abgerufen, im Gegensatz zu einer Eigenschaft eines {{jsxref("Number")}} Objektes, was erstellt wurde.

+ +

Beispiele

+ +
Number.MAX_SAFE_INTEGER // 9007199254740991
+Math.pow(2, 53) - 1     // 9007199254740991
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.MAX_SAFE_INTEGER")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/max_value/index.html b/files/de/web/javascript/reference/global_objects/number/max_value/index.html new file mode 100644 index 0000000000..9cb4be1929 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/max_value/index.html @@ -0,0 +1,82 @@ +--- +title: Number.MAX_VALUE +slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE +tags: + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE +--- +
{{JSRef}}
+ +

Die Number.MAX_VALUE Eigenschaft repräsentiert den größten nummerische  Wert, der in JavaScript repräsentiert werden kann.

+ +
{{EmbedInteractiveExample("pages/js/number-maxvalue.html")}}
+ + + +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Die MAX_VALUE Eigenschaft hat einen ungefähren Wert von 1.79E+308 (1,79103081,79 \cdot 10^{308}). Werte die größer sind, werden als "Infinity" (unendlich) repräsentiert.

+ +

Weil MAX_VALUE eine statische Eigenschaft von {{jsxref("Number")}} ist, wird sie immer mit Number. MAX_VALUE abgerufen, im Gegensatz zu einer Eigenschaft eines {{jsxref("Number")}} Objektes, was erstellt wurde.

+ +

Beispiele

+ +

Einsatz von MAX_VALUE

+ +

Im folgenden Quelltext werden zwei nummerische Werte multipliziert. Wenn das Ergebnis kleiner oder gleich MAX_VALUE ist, wird func1() ausgeführt; andernfalls wird func2() ausgeführt.   

+ +
if (num1 * num2 <= Number.MAX_VALUE) {
+  func1();
+} else {
+  func2();
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.3.2', 'Number.MAX_VALUE')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.max_value', 'Number.MAX_VALUE')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.max_value', 'Number.MAX_VALUE')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.MAX_VALUE")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/min_safe_integer/index.html b/files/de/web/javascript/reference/global_objects/number/min_safe_integer/index.html new file mode 100644 index 0000000000..4440e7d913 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/min_safe_integer/index.html @@ -0,0 +1,66 @@ +--- +title: Number.MIN_SAFE_INTEGER +slug: Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER +tags: + - ECMAScript 2015 + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER +--- +
{{JSRef}}
+ +

Die Number.MIN_SAFE_INTEGER Konstante repräsentiert die kleinste sicheren ganze Zahl in JavaScript (-(253 - 1)).

+ +
{{EmbedInteractiveExample("pages/js/number-min-safe-integer.html")}}
+ + + +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Die MIN_SAFE_INTEGER Konstante hat einen Wert von - 9007199254740991 (-9.007.199.254.740.991 oder ca. -9 Billiarde). Die Bedeutung hinter dieser Zahl ist, dass in JavaScript double-precision floating-point Zahlen wie sie in IEEE 754 spezifiziert sind benutzt werden. Nach dieser Spezifikation ist die sichere Repräsentation von Zahlen nur zwischen -(253 - 1) und 253 - 1 möglich. Für mehr details Siehe im Artikel {{jsxref("Number.isSafeInteger()")}} nach.

+ +

Weil MIN_SAFE_INTEGER eine statische Eigenschaft von {{jsxref("Number")}} ist, wird sie immer mit Number.MIN_SAFE_INTEGER abgerufen, im Gegensatz zu einer Eigenschaft eines {{jsxref("Number")}} Objektes, was erstellt wurde.

+ +

Beispiele

+ +
Number.MIN_SAFE_INTEGER // -9007199254740991
+-(Math.pow(2, 53) - 1)  // -9007199254740991
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.min_safe_integer', 'Number.MIN_SAFE_INTEGER')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.min_safe_integer', 'Number.MIN_SAFE_INTEGER')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.MIN_SAFE_INTEGER")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/min_value/index.html b/files/de/web/javascript/reference/global_objects/number/min_value/index.html new file mode 100644 index 0000000000..3572b98118 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/min_value/index.html @@ -0,0 +1,83 @@ +--- +title: Number.MIN_VALUE +slug: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE +tags: + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE +--- +
{{JSRef}}
+ +

Die Number.MIN_VALUE Eigenschaft repräsentiert den kleinsten nummerische  Wert größer als 0, der in JavaScript repräsentiert werden kann.

+ +
{{EmbedInteractiveExample("pages/js/number-min-value.html")}}
+ + + +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Die MIN_VALUE Eigenschaft ist die die am nächsten an 0 liegende positive Zahl, die JavaScript repräsentieren kann (nicht die kleinste negative Zahl).

+ +

MIN_VALUE hat einen ungefähren Wert von 510-3245 \cdot 10^{-324}. Zahlen die zwischen MIN_VALUE und 0 liegen ( "underflow values" werden zu 0 konvertiert.

+ +

Weil MIN_VALUE eine statische Eigenschaft von {{jsxref("Number")}} ist, wird sie immer mit Number. MIN_VALUE abgerufen, im Gegensatz zu einer Eigenschaft eines {{jsxref("Number")}} Objektes, was erstellt wurde.

+ +

Beispiele

+ +

Einsatz von MIN_VALUE

+ +

Im folgenden Quelltext werden zwei nummerische Werte dividiert. Wenn das Ergebnis größer oder gleich MIN_VALUE ist, wird func1() ausgeführt; andernfalls wird func2() ausgeführt. 

+ +
if (num1 / num2 >= Number.MIN_VALUE) {
+  func1();
+} else {
+  func2();
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.3.3', 'Number.MIN_VALUE')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-number.min_value', 'Number.MIN_VALUE')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-number.min_value', 'Number.MIN_VALUE')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.MIN_VALUE")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/nan/index.html b/files/de/web/javascript/reference/global_objects/number/nan/index.html new file mode 100644 index 0000000000..25614786f3 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/nan/index.html @@ -0,0 +1,65 @@ +--- +title: Number.NaN +slug: Web/JavaScript/Reference/Global_Objects/Number/NaN +tags: + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/NaN +--- +
{{JSRef}}
+ +

Die Number.NaN Eigenschaft repräsentiert Not-A-Number (keine Nummer). Sie ist identisch zu {{jsxref("NaN")}}.

+ +
{{EmbedInteractiveExample("pages/js/number-nan.html")}}
+ +

Die Eigenschaft Number.NaN ist statisch, weshalb kein {{jsxref("Number")}} Objekt erstellt werden muss.

+ +

{{js_property_attributes(0, 0, 0)}}

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}} +

Initiale Definition. Implementiert in JavaScript 1.1.

+
{{SpecName('ES5.1', '#sec-15.7.3.4', 'Number.NaN')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.nan', 'Number.NaN')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.nan', 'Number.NaN')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.NaN")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/negative_infinity/index.html b/files/de/web/javascript/reference/global_objects/number/negative_infinity/index.html new file mode 100644 index 0000000000..a2cb81a0fb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/negative_infinity/index.html @@ -0,0 +1,100 @@ +--- +title: Number.NEGATIVE_INFINITY +slug: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY +tags: + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY +--- +
{{JSRef}}
+ +

Die Number.NEGATIVE_INFINITY Eigenschaft repräsentiert den Wert der negativen Unendlichkeit.

+ +
{{EmbedInteractiveExample("pages/js/number-negative-infinity.html")}}
+ + + +

Man muss kein Objekt vom Typ {{jsxref("Number")}} erzeugen, um Zugriff zu haben, weil diese Eigenschaft statisch ist (nutze  Number.NEGATIVE_INFINITY).

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Der Wert von Number.NEGATIVE_INFINITY ist der gleiche wie der negative Wert der Eigenschaft {{jsxref("Infinity")}} des globalen Objektes.

+ +

Der Wert verhält sich leicht unterschiedlich zu der mathematischen Unendlichkeit:

+ + + +

Man kann Number.NEGATIVE_INFINITY nutzen, um einen Fehlerfall zu signalisieren, wenn im Normalfall ein endliches Ergebnis erwartet werden kann. Zudem kann ein Wert mit {{jsxref("isFinite")}} auf seine Endlichkeit geprüft werden.

+ +

Beispiele

+ +

Einsatz von NEGATIVE_INFINITY

+ +

Im folgenden Beispiel wird der Variablen smallNumber ein kleinerer Wert als der minimale Wert zugewiesen. Wenn das {{jsxref("Statements/if...else", "if")}}-Statement ausgeführt wird, hat smallNumber den Wert -Infinity. In diesem Fall wird der Variablen ein endlicher Wert zugewiesen, um mit dem Wert besser umgehen zu können.

+ +
var smallNumber = (-Number.MAX_VALUE) * 2;
+
+if (smallNumber === Number.NEGATIVE_INFINITY) {
+  smallNumber = returnFinite();
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.3.5', 'Number.NEGATIVE_INFINITY')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.negative_infinity', 'Number.NEGATIVE_INFINITY')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.negative_infinity', 'Number.NEGATIVE_INFINITY')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.NEGATIVE_INFINITY")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/parsefloat/index.html b/files/de/web/javascript/reference/global_objects/number/parsefloat/index.html new file mode 100644 index 0000000000..d659260090 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/parsefloat/index.html @@ -0,0 +1,72 @@ +--- +title: Number.parseFloat() +slug: Web/JavaScript/Reference/Global_Objects/Number/parseFloat +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseFloat +--- +
{{JSRef}}
+ +

Die Number.parseFloat() Methode liest ein String-Argument ein und gibt eine Fließkommazahl zurück. Diese Methode verhält sich identisch zu der globalen Funktion {{jsxref("parseFloat", "parseFloat()")}} und ist Teil von ECMAScript 2015 (das Ziel ist die modularisierung von globalen Funktionen).

+ +
{{EmbedInteractiveExample("pages/js/number-parsefloat.html")}}
+ + + +

Syntax

+ +
Number.parseFloat(string)
+ +

Parameter

+ +

{{page("de/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Parameter")}}

+ +

Rückgabewert

+ +

{{page("de/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Rückgabewert")}}

+ +

Beschreibung

+ +

Mehr Details und Beispiele sind im Artikel {{jsxref("parseFloat", "parseFloat()")}} nachzuschlagen.

+ +

Polyfill

+ +
Number.parseFloat = parseFloat;
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-number.parsefloat', 'Number.parseFloat')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.parsefloat', 'Number.parseFloat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.parseFloat")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/parseint/index.html b/files/de/web/javascript/reference/global_objects/number/parseint/index.html new file mode 100644 index 0000000000..e9efe16f11 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/parseint/index.html @@ -0,0 +1,77 @@ +--- +title: Number.parseInt() +slug: Web/JavaScript/Reference/Global_Objects/Number/parseInt +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseInt +--- +
{{JSRef}}
+ +

Die Number.parseInt() Methode liest ein String-Argument ein und gibt eine ganze Zahl im angegebenen Zahlensystem zurück.

+ +
{{EmbedInteractiveExample("pages/js/number-parseint.html")}}
+ + + +

Syntax

+ +
Number.parseInt(string[, radix])
+ +

Parameter

+ +
{{page("de/docs/Web/JavaScript/Reference/Global_Objects/parseInt", "Parameter")}}
+ +

Rückgabewert

+ +

{{page("de/docs/Web/JavaScript/Reference/Global_Objects/parseInt", "Rückgabewert")}}

+ +

Beschreibung

+ +

Diese Methode hat den gleichen Funktionsumfang wie die globalen {{jsxref("parseInt", "parseInt()")}} Funktion:

+ +
Number.parseInt === parseInt; // true
+ +

Sie ist Teil von ECMAScript 2015 und hat als Ziel die Modularisierung von globalen Funktionen. Mehr Details und Beispiele im Artikel {{jsxref("parseInt", "parseInt()")}}.

+ +

Polyfill

+ +
if (Number.parseInt === undefined)
+    Number.parseInt = window.parseInt;
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES6', '#sec-number.parseint', 'Number.parseInt')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-number.parseint', 'Number.parseInt')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.parseInt")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/positive_infinity/index.html b/files/de/web/javascript/reference/global_objects/number/positive_infinity/index.html new file mode 100644 index 0000000000..0f9c9b1ccd --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/positive_infinity/index.html @@ -0,0 +1,100 @@ +--- +title: Number.POSITIVE_INFINITY +slug: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY +tags: + - JavaScript + - Number + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY +--- +
{{JSRef}}
+ +

Die Eigenschaft Number.POSITIVE_INFINITY repräsentiert den Wert positiv unendlich.

+ +
{{EmbedInteractiveExample("pages/js/number-positive-infinity.html")}}
+ + + +

Man muss kein Objekt vom Typ {{jsxref("Number")}} erzeugen, um Zugriff auf diese Eigenschaft zu bekommen, weil diese eine statische Eigeschaft ist (nutze POSITIVE_INFINITY).

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Der Wert Number.POSITIVE_INFINITY ist der gleich wie der der Eigenschaft {{jsxref("Infinity")}} des globalen Objektes.

+ +

Der Wert verhält sich leicht unterschiedlich zu der mathematischen Unendlichkeit:

+ + + +

Man kann Number.POSITIVE_INFINITY nutzen, um einen Fehlerfall zu signalisieren, wenn im Normalfall ein endliches Ergebnis erwartet werden kann. Zudem kann ein Wert mit {{jsxref("isFinite")}} auf seine Endlichkeit geprüft werden.

+ +

Beispiele

+ +

Einsatz von POSITIVE_INFINITY

+ +

Im folgenden Beispiel wird der Variablen bigNumber ein kleinerer Wert als der minimale Wert zugewiesen. Wenn das {{jsxref("Statements/if...else", "if")}}-Statement ausgeführt wird, hat bigNumber den Wert Infinity. In diesem Fall wird der Variablen ein endlicher Wert zugewiesen, um mit dem Wert besser umgehen zu können.

+ +
var bigNumber = Number.MAX_VALUE * 2;
+
+if (bigNumber == Number.POSITIVE_INFINITY) {
+  bigNumber = returnFinite();
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.3.6', 'Number.POSITIVE_INFINITY')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.positive_infinity', 'Number.POSITIVE_INFINITY')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.positive_infinity', 'Number.POSITIVE_INFINITY')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.POSITIVE_INFINITY")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/prototype/index.html b/files/de/web/javascript/reference/global_objects/number/prototype/index.html new file mode 100644 index 0000000000..df57903c60 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/prototype/index.html @@ -0,0 +1,89 @@ +--- +title: Number.prototype +slug: Web/JavaScript/Reference/Global_Objects/Number/prototype +tags: + - JavaScript + - Number + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number +--- +
{{JSRef}}
+ +

Die Eigenschaft Number.prototype repräsentiert den Prototypen für den {{jsxref("Number")}} Konstruktor.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref("Number")}} Instanzen erben von Number.prototype. Das prototype Objekt des {{jsxref("Number")}} Konstruktors kann verändert werden um alle Instanzen von {{jsxref( "Number")}} zu erweitern.

+ +

Eigenschaften

+ +
+
Number.prototype.constructor
+
Gibt die Funktion zurück, die die Instanz dieses Objektes erzeugt hat. Als Standardwert ist das das {{jsxref("Number")}} Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("Number.prototype.toExponential()")}}
+
Gibt eine Zeichenkette (string) zurück, die die Nummer in Exponential Notation repräsentiert.
+
{{jsxref("Number.prototype.toFixed()")}}
+
Gibt eine Zeichenkette (string) zurück, die die Nummer als Festkommazahl repräsentiert.
+
{{jsxref("Number.prototype.toLocaleString()")}}
+
Gibt eine Zeichenkette (string) zurück, die die sprachenübliche Repräsentation der Nummer repräsentiert. Überschreibt die  {{jsxref("Object.prototype.toLocaleString()")}} Methode.
+
{{jsxref("Number.prototype.toPrecision()")}}
+
Gibt eine Zeichenzette (string) zurück, die die Zahl in einer bestimmten Genauigkeit als Festkommazahl repräsentiert.
+
{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt ein Objektliteral zurück, welches das {{jsxref("Number")}} Objekt spezifiziert. Diese Methode kann genutzt werden, um ein neues Objekt zu erzeugen. Überschreibt die {{jsxref("Object.prototype.toSource()")}} Methode.
+
{{jsxref("Number.prototype.toString()")}}
+
Gibt eine Zeichenkette (string) zurück, die die Zahl in einer bestimmten Basis repräsentiert. Überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
{{jsxref("Number.prototype.valueOf()")}}
+
Gibt einen primitiven Wert des Objektes zurück. Überschreibt die {{jsxref("Object.prototype.valueOf()")}} Methode.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.4', 'Number')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-the-number-prototype-object', 'Number')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.prototype")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/toexponential/index.html b/files/de/web/javascript/reference/global_objects/number/toexponential/index.html new file mode 100644 index 0000000000..c392b7012c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/toexponential/index.html @@ -0,0 +1,108 @@ +--- +title: Number.prototype.toExponential() +slug: Web/JavaScript/Reference/Global_Objects/Number/toExponential +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toExponential +--- +
{{JSRef}}
+ +

Die toExponential() Methode gibt eine string-Repräsentation eines {{jsxref("Number")}} Objektes in Exponentialdarstellung zurück.

+ +
{{EmbedInteractiveExample("pages/js/number-toexponential.html")}}
+ + + +

Syntax

+ +
numObj.toExponential([fractionDigits])
+ +

Parameter

+ +
+
fractionDigits
+
Optional. Eine ganze Zahl, die die Anzahl der Nachkommastellen angibt. Der Standardwert ist die Anzahl der Nachkommastellen, die benötigt werden, um die Zahl genau darzustellen.
+
+ +

Rückgabewert

+ +

Eine string, der das gegebene {{jsxref("Number")}} Objekt in Exponentialdarstellung repräsentiert. Das bedeutet, dass eine Stelle vor dem Komma steht und auf fractionDigits Stellen nach dem Komma gerundet wird.

+ +

Ausnahmen

+ +
+
{{jsxref("RangeError")}}
+
Wenn fractionDigits zu klein oder groß ist. Werte zwischen 0 und 20 (inklusiv) werden keinen zu keinem {{jsxref("RangeError")}} führen. Manche Implementierungen erlauben es auch kleinere oder größere Wert einzusätzen.
+
{{jsxref("TypeError")}}
+
Wenn die Methode auf einem Objekt, welches nicht vom Typ {{jsxref("Number")}} ist, aufgerufen wird.
+
+ +

Beschreibung

+ +

Wenn das fractionDigits Argument nicht angegeben wird, ist der Standardwert die Anzahl der Stellen, die benötigt werden um die Zahl ohne Verluste darzustellen.

+ +

Wenn die toExponential() Methode für nummerische Literale engesetzt werden und das nummerische Literal keine Nachkommastellen besitzt, sollte ein Leerzeichen nach der Zahl hinzugefügt werden. Das sorgt dafür, dass der Punkt des Methodenaufrufes nicht als Dezimaltrenner (Komma) interpretiert wird.

+ +

Wenn eine Zahl mehr Stellen hat, als im fractionDigits Argument definiert wurde, wird die Zahl zur nächst liegenden Zahl gerundet, die mit fractionDigits Stellen dargestellt werden kann. Weiter Informationen zum Runden sind im Artikel {{jsxref("Number.prototype.toFixed", "toFixed()")}} zu finden, die ebenfalls auf toExponential() zutreffen.

+ +

Beispiele

+ +

Einsatz von toExponential()

+ +
var numObj = 77.1234;
+
+console.log(numObj.toExponential());  // logs 7.71234e+1
+console.log(numObj.toExponential(4)); // logs 7.7123e+1
+console.log(numObj.toExponential(2)); // logs 7.71e+1
+console.log(77.1234.toExponential()); // logs 7.71234e+1
+console.log(77 .toExponential());     // logs 7.7e+1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES5.1', '#sec-15.7.4.6', 'Number.prototype.toExponential')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-number.prototype.toexponential', 'Number.prototype.toExponential')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-number.prototype.toexponential', 'Number.prototype.toExponential')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toExponential")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/tofixed/index.html b/files/de/web/javascript/reference/global_objects/number/tofixed/index.html new file mode 100644 index 0000000000..0fe376aa4d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/tofixed/index.html @@ -0,0 +1,113 @@ +--- +title: Number.prototype.toFixed() +slug: Web/JavaScript/Reference/Global_Objects/Number/toFixed +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed +--- +
{{JSRef}}
+ +

Die toFixed() Methode formatiert eine Zahl in Festkommadarstellung.

+ +
{{EmbedInteractiveExample("pages/js/number-tofixed.html")}}
+ + + +

Syntax

+ +
numObj.toFixed([digits])
+ +

Parameter

+ +
+
digits
+
Optional: Die Anzahl der Stellen, die nach dem Komma angezeigt werden sollen. Das ist ein Wert zwischen 0 und 20 (inklusiv), jedoch gibt es Implementierungen die optional einen größeren Bereich zulassen. Wenn das Argument nicht angegeben wird, wird der Parameter mit dem Standardwert 0 gesetzt.
+
+ +

Rückgabewert

+ +

Eine String-Repräsentation der gegebenen Zahl in Festkommadarstellung.

+ +

Ausnahmen

+ +
+
{{jsxref("RangeError")}}
+
Tritt auf, wenn digits zu klein oder groß ist. Werte  digits zwischen 0 und 20 (inklusiv) ist, wird es nicht zu einem {{jsxref("RangeError")}} führen. Manche Implementierungen erlauben es auch kleinere oder größere Wert zu benutzen.
+
{{jsxref("TypeError")}}
+
Wenn die Methode auf einem Objekt, welches nicht vom Typ {{jsxref("Number")}} ist, aufgerufen wird.
+
+ +

Beschreibung

+ +

toFixed() gibt eine String-Repräsentation von numObj zurück, die keine Exponentialdarstellung benutzt und genau digits viele Nachkommastellen beseitzt. Wenn es nötig ist, wird eine Zahl gerundet oder fehlende Dezimalstellen werden mit Nullen aufgefüllt, um die gewünschten Nachkommastellen zu erreichen. Wenn numObj größer als 1021 ist, ruft diese Methode {{jsxref("Number.prototype.toString()")}} auf und gibt den string in Exponentialdarstellung zurück.

+ +
+

JavaScript Numbers können nicht alle Zahlen präzise darstellen, was zu unerwarteten Ergebnissen führen kann, wie z. B.  0.1 + 0.2 === 0.3 false ergibt.

+
+ +

Beispiele

+ +

Einsatz von toFixed

+ +
var numObj = 12345.6789;
+
+numObj.toFixed();       // Rückgabe: '12346': Gerundet, keine Nachkommastellen
+numObj.toFixed(1);      // Rückgabe: '12345.7': Gerundet
+numObj.toFixed(6);      // Rückgabe: '12345.678900': Nullen hinzugefügt
+(1.23e+20).toFixed(2);  // Rückgabe: '123000000000000000000.00'
+(1.23e-10).toFixed(2);  // Rückgabe: '0.00'
+2.34.toFixed(1);        // Rückgabe: '2.3'
+2.35.toFixed(1);        // Rückgabe: '2.4'. Aufgerundet.
+2.55.toFixed(1);        // Rückgabe: '2.5'. Abgerundet - siehe die oben stehende Warnung
+-2.34.toFixed(1);       // Rückgabe: -2.3 (Negative Nummernliterale geben kein String zurück ...)
+(-2.34).toFixed(1);     // Rückgabe: '-2.3' (... außer es werden explizit Klammern verwendet.)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES5.1', '#sec-15.7.4.5', 'Number.prototype.toFixed')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toFixed")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/tointeger/index.html b/files/de/web/javascript/reference/global_objects/number/tointeger/index.html new file mode 100644 index 0000000000..79545e9ad6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/tointeger/index.html @@ -0,0 +1,52 @@ +--- +title: Number.toInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/toInteger +tags: + - JavaScript + - Method + - Number + - Obsolete +translation_of: Archive/Web/JavaScript/Number.toInteger +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Number.toInteger() Methode wurde eingesetzt, um den übegebenen Wert zu analysieren und zu einer ganzen Zahl zu konvertieren, jedoch wurde die Implementierung entfernt.

+ +

Wenn der übergebene Wert {{jsxref("NaN")}}, {{jsxref("null")}} oder {{jsxref("undefined")}} ist, gibt die Methode 0 zurück. Wenn der Wert false ist, wird 0 und bei true wird 1 zurückgegeben.

+ +

Syntax

+ +
Number.toInteger(zahl)
+ +

Parameter

+ +
+
zahl
+
Wert der zu einer ganzen Zahl konvertiert werden soll.
+
+ +

Beispiele

+ +

Einsatz von toInteger

+ +
Number.toInteger(0.1);     // 0
+Number.toInteger(1);       // 1
+Number.toInteger(Math.PI); // 3
+Number.toInteger(null);    // 0
+
+ +

Spezifikationen

+ +

Number.toInteger() war Teil der des ECMAScript 6 Entwurfesspezifikation, jedoch wurde sie am 23. August 2013 im Draft Rev 17 entfernt.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toInteger")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/tolocalestring/index.html b/files/de/web/javascript/reference/global_objects/number/tolocalestring/index.html new file mode 100644 index 0000000000..5e5e132045 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/tolocalestring/index.html @@ -0,0 +1,192 @@ +--- +title: Number.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString +tags: + - Internationalization + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString +--- +
{{JSRef}}
+ +

Die toLocaleString() Methode gibt eine Zahl als String in sprachabhängiger Formatierung zurück.

+ +
{{EmbedInteractiveExample("pages/js/number-tolocalestring.html")}}
+ + + +

Die neuen locales und options Argumente ermöglichen es Anwendungen, sprachübliche Formatierungskonventionen zu benutzen und diese anzupassen. In älteren Implementierungen werden die locales und options Argumente ignoriert, und die Formatierung des Strings ist implementierungsabhängig.

+ +

Syntax

+ +
numObj.toLocaleString([locales [, options]])
+ +

Parameter

+ +

Prüfe die Browserkompatibilität, um zu sehen, welcher Browser den locales und options Parameter unterstützt, und das Beispiel Unterstützung für locales und options Argumente prüfen für eine Funktionalitätsprüfung.

+ +
+

Anmerkung: Die ECMAScript Internationalization API, implementiert in Firefox 29, fügte das Argument locales zur Methode Number.toLocaleString() zu. Wenn das Argument {{jsxref("undefined")}} ist, arbeitet die Methode nach der Lokalisierung des OS, während Vorgängerversionen von Firefox Western Arabic zurück geben. Diese Änderung wurde als eine Rückwärtskompatibilität gemeldet. Das Problem wurde bereits behoben ({{bug(999003)}}).

+
+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat', 'Parameter')}}
+ +

Rückgabewert

+ +

Einen String, der die gegebene Zahl in einer sprachspezifischen Formatierung repräsentiert.

+ +

Beispiele

+ +

Einsatz von toLocaleString()

+ +

Bei der Nutzung ohne Parameter wird der string in der Standardsprache ohne Optionen zurückgegeben:

+ +
var number = 3500;
+
+console.log(number.toLocaleString()); // Ausgabe: "3.500" wenn in Deutscher locale
+
+ +

Unterstützung für locales und options Argumente prüfen

+ +

Die locales und options Argumente sind noch nicht in allen Browsern unterstützt. Zur Prüfung der Unterstützung von ES5.1 und neueren Implementierungen wird vorausgesetzt, dass unbekannte Sprachen zu einem {{jsxref("RangeError")}} führen, was folgendermaßen eingesetzt werden kann:

+ +
function toLocaleStringSupportsLocales() {
+  var number = 0;
+  try {
+    number.toLocaleString('i');
+  } catch (e) {
+    return e.name === 'RangeError';
+  }
+  return false;
+}
+
+ +

Vor ES5.1 mussten die Implementierungen keinen {{jsxref("RangeError")}} erzeugen, wenn toLocaleString  mit Argumenten aufgerufen wurde.

+ +

Eine Prüfung, die in allen Browser funktioniert, auch in denen, die ECMA-262 vor ES5.1 unterstützen, ist die Prüfung auf Funktionen aus ECMA-402, welche Optionen in Number.prototype.toLocaleString direkt unterstützen:

+ +
function toLocaleStringSupportsOptions() {
+  return !!(typeof Intl == 'object' && Intl && typeof Intl.NumberFormat == 'function');
+}
+
+ +

Diese Tests auf dem globalen {{jsxref("Intl")}} Objekt prüfen, ob das Objekt existiert und die Eigenschaft vom Typ Funktion {{jsxref("Intl.NumberFormat")}} hat.

+ +

Einsatz von locales

+ +

Diese Beispiel zeigt einige der Variationen in internationalen Zahlenformaten. Um das Format der Sprache zu bekommen, welches in der Anwendung benutzt wird, spezifiziere die Sprache (und mögliche Rückfallsprachen (fallback)) mit dem locales Argument.

+ +
var number = 123456.789;
+
+// Englische Benutzer sehen ein Punkt anstatt eines Kommas als Dezimaltrenner
+console.log(number.toLocaleString('en-GB'));
+// → 123.456,789
+
+// Arabisch ist in den meisten arabisch Sprechenden Ländern eingesetzt (Eastern Arabic) Ziffern
+console.log(number.toLocaleString('ar-EG'));
+// → ١٢٣٤٥٦٫٧٨٩
+
+// Indien benutzt Tausendertrennzeichen bei Tausend und allen weiteren zwei Stellen
+console.log(number.toLocaleString('en-IN'));
+// → 1,23,456.789
+
+// Chinesisches Zahlensystem
+console.log(number.toLocaleString('zh-Hans-CN-u-nu-hanidec'));
+// → 一二三,四五六.七八九
+
+// Wenn eine Sprache übergeben werden soll, die vielleicht nicht
+// unterstützt wird (Balinesisch), nutze eine fallback Sprache (Indonesisch)
+console.log(number.toLocaleString(['ban', 'id']));
+// → 123.456,789
+
+ +

Einsatz von options

+ +

Das Ergebnis von toLocaleString  kann durch das options Argument angepasst werden.

+ +
var number = 123456.789;
+
+// Währungsformat
+console.log(number.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }));
+// → 123.456,79 €
+
+// Der Japanische Yen hat keine Unterwährung (z. B. Cent)
+console.log(number.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }))
+// → ¥123,457
+
+// Limitiert auf drei signifikante Stellen
+console.log(number.toLocaleString('en-IN', { maximumSignificantDigits: 3 }));
+// → 1,23,000
+
+// Einsatz der Host-Standard-Sprache mit Optionen für die Nummernformatierung
+var num = 30000.65;
+console.log(num.toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2}));
+// → 30,000.65 wenn Englisch die Standard-Sprache ist, oder
+// → 30.000,65 wenn Deutsch die Standard-Sprache ist, oder
+// → 30 000,65 wenn Französisch die Standard-Sprache ist
+
+ +

Performance

+ +

Wenn eine lange Zahl formatiert werden soll, ist es besser ein {{jsxref("NumberFormat")}} Objekt zu erstellen und die Funktion {{jsxref("NumberFormat.format")}} zu benutzen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES5.1', '#sec-15.7.4.3', 'Number.prototype.toLocaleString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}{{Spec2('ESDraft')}} 
{{SpecName('ES Int 1.0', '#sec-13.2.1', 'Number.prototype.toLocaleString')}}{{Spec2('ES Int 1.0')}} 
{{SpecName('ES Int 2.0', '#sec-13.2.1', 'Number.prototype.toLocaleString')}}{{Spec2('ES Int 2.0')}} 
{{SpecName('ES Int Draft', '#sec-Number.prototype.toLocaleString', 'Number.prototype.toLocaleString')}}{{Spec2('ES Int Draft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toLocaleString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/toprecision/index.html b/files/de/web/javascript/reference/global_objects/number/toprecision/index.html new file mode 100644 index 0000000000..53a27d59d2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/toprecision/index.html @@ -0,0 +1,107 @@ +--- +title: Number.prototype.toPrecision() +slug: Web/JavaScript/Reference/Global_Objects/Number/toPrecision +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision +--- +
{{JSRef}}
+ +

Die toPrecision() Methode gibt einen String zurück, der ein {{jsxref("Number")}} Objekt mit einer spezifizierten Präzision repräsentiert.

+ +
{{EmbedInteractiveExample("pages/js/number-toprecision.html")}}
+ +

Syntax

+ +
numObj.toPrecision([precision])
+ +

Parameter

+ +
+
precision
+
Optional. Eine ganze Zahl, die die signifikanten Ziffern der Zahl angibt.
+
+ +

Rückgabewert

+ +

Ein string, der ein {{jsxref("Number")}} Objekt in Fließkomma- oder Exponentialdarstellung auf die in precision angegeben Stellen gerundet zurück gibt. Weitere Informationen zum runden in dieser Methode sind in der Beschreibung von {{jsxref("Number.prototype.toFixed()")}} zu finden, die auch auf toPrecision() zutreffen.

+ +

Wenn kein precision Argument angegeben wird, ist die rückgabe wie in der {{jsxref("Number.prototype.toString()")}} Methode. Wenn die precision keine ganze Zahl ist, wird zu der am nächst liegenden ganzen Zahl gerundet.

+ +

Auftretende Fehler

+ +
+
{{jsxref("Global_Objects/RangeError", "RangeError")}}
+
Wenn precison keine Zahl zwischen 1 und 100 (inklusiv) ist, tritt ein {{jsxref("RangeError")}} auf. Es gibt implementierungen die mehr und weniger signifikante Stellen zulassen. ECMA-262 spezifiziert nur eine Präzision von 21 signifikanten Stellen.
+
+ +

Beispiele

+ +

Einsatz von toPrecision

+ +
var numObj = 5.123456;
+
+console.log(numObj.toPrecision());    // Ausgabe: 5.123456
+console.log(numObj.toPrecision(5));   // Ausgabe: 5.1235
+console.log(numObj.toPrecision(2));   // Ausgabe: 5.1
+console.log(numObj.toPrecision(1));   // Ausgabe: 5
+
+numObj = 0.000123
+
+console.log(numObj.toPrecision());    // logs 0.000123
+console.log(numObj.toPrecision(5));   // logs 0.00012300
+console.log(numObj.toPrecision(2));   // logs 0.00012
+console.log(numObj.toPrecision(1));   // logs 0.0001
+
+// In manchen Fällen wird die Exponentialdarstellung ausgegeben.
+console.log((1234.5).toPrecision(2)); // Ausgabe: 1.2e+3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES5.1', '#sec-15.7.4.7', 'Number.prototype.toPrecision')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toPrecision")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/tosource/index.html b/files/de/web/javascript/reference/global_objects/number/tosource/index.html new file mode 100644 index 0000000000..985df99c0a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/tosource/index.html @@ -0,0 +1,53 @@ +--- +title: Number.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Number/toSource +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode gibt einen string zurück, der den Quelltext des Objektes repräsentiert.

+ +

Syntax

+ +
numObj.toSource()
+Number.toSource()
+ +

Rückgabewert

+ +

Einen String, der den Quelltext des Objektes repräsentiert.

+ +

Beschreibung

+ +

Die toSource() gibt die folgenden Werte zurück:

+ +

Für das globale Standardobjekt {{jsxref("Number")}} gibt toSource() den folgenden string zurück, um anzuzeigen, dass der Quelltext nicht verfügbar ist:

+ +
function Number() {
+    [native code]
+}
+
+ +

Für Instanzen von {{jsxref("Number")}}, gibt toSource() einen string mit dem Quelltext zurück.

+ +

Diese Methode wird intern von JavaScript aufgerufen und wird nicht im Quelltext von Webseiten verwendet.

+ +

Spezifikationen

+ +

Ist in keinem Standard. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toSource")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/tostring/index.html b/files/de/web/javascript/reference/global_objects/number/tostring/index.html new file mode 100644 index 0000000000..ed5d600b3a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/tostring/index.html @@ -0,0 +1,116 @@ +--- +title: Number.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Number/toString +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString +--- +
{{JSRef}}
+ +

Die toString() Methode gibt einen string (Zeichenkette), die ein {{jsxref("Number")}} Objekt repräsentiert zurück.

+ +
{{EmbedInteractiveExample("pages/js/number-tostring.html")}}
+ + + +

Syntax

+ +
numObj.toString([radix])
+ +

Parameter

+ +
+
radix
+
Optional. Eine ganze Zahl im Bereich von 2 bis 36 welche die Basis des Zahlensystems angibt, in dem die Zahl repräsentiert werden soll.
+
+ +

Rückgabewert

+ +

Einen String, der das spezifizierte {{jsxref("Number")}} Objekt repräsentiert.

+ +

Ausnahmen

+ +
+
{{jsxref("RangeError")}}
+
Wenn toString() als radix Parameter eine Zahl kleiner 2 oder größer 36 übergeben bekommt, wird ein {{jsxref("RangeError")}} erzeugt.
+
+ +

Beschreibung

+ +

Das {{jsxref("Number")}} Objekt überschreibt die toString() Methode des {{jsxref("Object")}} Objektes. Es erbt nicht von der  {{jsxref("Object.prototype.toString()")}} Methode. Für {{jsxref( "Number")}} Objekte gibt die toString() Methode eine string-Repräsentation des Objektes in dem durch radix spezifizierten Zahlensystem zurück.

+ +

Die toString() Methode analysiert das erste Argument und versucht eine string-Repräsentation im durch radix beschriebenen Zahlensystem zurück zu geben. Für radix (Basen) größer als 10 werden Buchstaben des Alphabets genutzt um Zahlen größer als 9 darzustellen. Zum Beispiel werden im Hexadezimalsystem (Basis 16) die Buchstaben a bis f eingesetzt.

+ +

Wenn der radix Parameter nicht angegeben wird, wird 10, also das Dezimalsystem, angenommen.

+ +

Wenn das numObj Objekt negativ ist, wird das Vorzeichen beibehalten. Dieses Verhalten ist auch im Binärsystem so: Der zurückgegebene string ist eine positive Binärdarstellung des numObj Objekts mit einem vorangestellten Minus (-) Zeichen. Es wird kein Zweierkomplement verwendet.

+ +

Wenn das numObj Objekt keine ganze Zahl ist, wird ein Punkt (.) eingesetzt, um den ganzzahligen Teil von den Dezimalstellen zu trennen.

+ +

Beispiele

+ +

Einsatz von toString

+ +
var count = 10;
+
+console.log(count.toString());    // Ausgabe '10'
+console.log((17).toString());     // Ausgabe '17'
+console.log((17.2).toString());   // Ausgabe '17.2'
+
+var x = 6;
+
+console.log(x.toString(2));       // Ausgabe '110'
+console.log((254).toString(16));  // Ausgabe 'fe'
+
+console.log((-10).toString(2));   // Ausgabe '-1010'
+console.log((-0xff).toString(2)); // Ausgabe '-11111111'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.4.2', 'Number.prototype.tostring')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.prototype.tostring', 'Number.prototype.tostring')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.prototype.tostring', 'Number.prototype.tostring')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.toString")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/number/valueof/index.html b/files/de/web/javascript/reference/global_objects/number/valueof/index.html new file mode 100644 index 0000000000..1538417ebf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/number/valueof/index.html @@ -0,0 +1,85 @@ +--- +title: Number.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Number/valueOf +tags: + - JavaScript + - Method + - Number + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number/valueOf +--- +
{{JSRef}}
+ +

Die valueOf() Methode gibt den im  {{jsxref("Number")}} Objekt eingeschlossenen primitiven Wert zurück.

+ +
{{EmbedInteractiveExample("pages/js/number-valueof.html")}}
+ + + +

Syntax

+ +
numObj.valueOf()
+ +

Rückgabewert

+ +

Ein primitiver Wert (Zahl), der die Zahl des {{jsxref("Number")}} Objektes repräsentiert.

+ +

Beschreibung

+ +

Die Methode wird intern von JavaScript aufgerufen, jedoch nicht explizit in einem programmierten Quelltext für eine Webseite eingesetzt.

+ +

Beispiele

+ +

Einsatz von valueOf

+ +
var numObj = new Number(10);
+console.log(typeof numObj); // object
+
+var num = numObj.valueOf();
+console.log(num);           // 10
+console.log(typeof num);    // number
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.7.4.4', 'Number.prototype.valueOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Number.valueOf")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/__definegetter__/index.html b/files/de/web/javascript/reference/global_objects/object/__definegetter__/index.html new file mode 100644 index 0000000000..5e88304f5f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/__definegetter__/index.html @@ -0,0 +1,150 @@ +--- +title: Object.prototype.__defineGetter__() +slug: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__ +translation_of: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__ +--- +
{{JSRef}}
+ +
+

This feature is deprecated in favor of defining getters using the object initializer syntax or the {{jsxref("Object.defineProperty()")}} API. While this feature is widely implemented, it is only described in the ECMAScript specification because of legacy usage. This method should not be used since better alternatives exist.

+
+ +

Die __defineGetter__ Methode bindet eine Eigenschaft des Objects an eine Funktion, die aufgerufen wird, wenn das Object angesehen wird.

+ +

Syntax

+ +
obj.__defineGetter__(prop, func)
+ +

Parameters

+ +
+
prop
+
Ein String der den Namen der zur Funktion gebundenen Eigenschaft enthält
+
func
+
Eine Funktion die zur Eigenschaft gebunden wird.
+
+ +

Return value

+ +

{{jsxref("undefined")}}.

+ +

Description

+ +

Die __defineGetter__ erlaubt einen {{jsxref("Operators/get", "getter", "", 1)}} auf ein Object zu erstellen.

+ +

Examples

+ +
// Nicht standard und veraltete Weise
+
+var o = {};
+o.__defineGetter__('gimmeFive', function() { return 5; });
+console.log(o.gimmeFive); // 5
+
+
+// Üblicher Weg
+
+// Mithilfe der get Methode
+var o = { get gimmeFive() { return 5; } };
+console.log(o.gimmeFive); // 5
+
+// Mithilfe von Object.defineProperty
+var o = {};
+Object.defineProperty(o, 'gimmeFive', {
+  get: function() {
+    return 5;
+  }
+});
+console.log(o.gimmeFive); // 5
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ESDraft', '#sec-object.prototype.__defineGetter__', 'Object.prototype.__defineGetter__()')}}{{Spec2('ESDraft')}}Included in the (normative) annex for additional ECMAScript legacy features for Web browsers (note that the specification codifies what is already in implementations).
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatIE("11")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Compatibility notes

+ + + +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/assign/index.html b/files/de/web/javascript/reference/global_objects/object/assign/index.html new file mode 100644 index 0000000000..0359e1e5c9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/assign/index.html @@ -0,0 +1,277 @@ +--- +title: Object.assign() +slug: Web/JavaScript/Reference/Global_Objects/Object/assign +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Object + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign +--- +
{{JSRef}}
+ +

Die Methode Object.assign() kopiert die Werte aller aufzählbaren, eigenen Eigenschaften von einem oder mehreren Quellobjekten in ein Zielobjekt. Es wird das Zielobjekt zurückgegeben.

+ +
{{EmbedInteractiveExample("pages/js/object-assign.html")}}
+ + + +

Syntax

+ +
Object.assign(target, ...sources)
+ +

Parameter

+ +
+
target
+
Das Zielobjekt.
+
sources
+
Das(Die) Quellobjekt(e).
+
+ +

Rückgabewert

+ +

Das Zielobjekt.

+ +

Beschreibung

+ +

Eigenschaften in dem Zielobjekt werden von Eigenschaften aus dem Quellobjekt überschrieben, wenn sie den gleichen Schlüssel haben.

+ +

Die Methode Object.assign() kopiert nur aufzählbare und eigene Eigenschaften eines Quellobjekts ins Zielobjekt. Sie verwendet [[Get]] bei der Quelle und [[Set]] beim Ziel, d.h. es werden getters und setters aufgerufen. Daher weist es Eigenschaften zu statt sie nur zu kopieren oder neue Eigenschaften zu definieren. Daher ist die Methode ungeeignet, um neue Eigenschaften zu einem Prototypen hinzufügen wenn die Quellen getters enthalten. Zum Kopieren von Eigenschaftsdefinitionen, einschließlich ihrer Aufzählbarkeit, in Prototypen sollten daher {{jsxref("Object.getOwnPropertyDescriptor()")}} und {{jsxref("Object.defineProperty()")}} verwendet werden.

+ +

Sowohl {{jsxref("String")}}- als auch {{jsxref("Symbol")}}-Eigenschaften werden kopiert.

+ +

Im Fehlerfall, weil z.B. eine Eigenschaft schreibgeschützt ist, wird ein {{jsxref("TypeError")}} erzeugt. Das Zielobjekt kann verändert sein, wenn ein Eigenschaft schon zuvor hinzugefügt wurde.

+ +

Es gilt zu beachten, dass Object.assign() keine Ausnahme bei {{jsxref("null")}} oder {{jsxref("undefined")}} Quellwerten erzeugt.

+ +

Beispiele

+ +

Klonen eines Objekts

+ +
var obj = { a: 1 };
+var copy = Object.assign({}, obj);
+console.log(copy); // { a: 1 }
+
+ +

Warnung bei tiefem Clonen

+ +

Für tiefes Clonen müssen andere Alternativen eingesetzt werden, weil Object.assign() Werte von Eigenschaften kopiert. Wenn ein Quellwert eine Referenz zu einem Objekt ist, wird nur die Referenz kopiert.

+ +
function test() {
+  'use strict';
+
+  let obj1 = { a: 0 , b: { c: 0}};
+  let obj2 = Object.assign({}, obj1);
+  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
+
+  obj1.a = 1;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
+  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
+
+  obj2.a = 2;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
+  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
+
+  obj2.b.c = 3;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
+  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
+
+  // Deep Clone
+  obj1 = { a: 0 , b: { c: 0}};
+  let obj3 = JSON.parse(JSON.stringify(obj1));
+  obj1.a = 4;
+  obj1.b.c = 4;
+  console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}
+}
+
+test();
+ +

Objekte zusammenführen

+ +
var o1 = { a: 1 };
+var o2 = { b: 2 };
+var o3 = { c: 3 };
+
+var obj = Object.assign(o1, o2, o3);
+console.log(obj); // { a: 1, b: 2, c: 3 }
+console.log(o1);  // { a: 1, b: 2, c: 3 }, target object itself is changed.
+
+ +

Objekte mit gleichen Eigenschaften zusammenführen

+ +
var o1 = { a: 1, b: 1, c: 1 };
+var o2 = { b: 2, c: 2 };
+var o3 = { c: 3 };
+
+var obj = Object.assign({}, o1, o2, o3);
+console.log(obj); // { a: 1, b: 2, c: 3 }
+ +

Eigenschaften werden von anderen Objekten mit gleichen Eigenschaften später in Parameterreihenfolge überschrieben.

+ +

Kopieren von Symboltyp-Eigenschaften

+ +
var o1 = { a: 1 };
+var o2 = { [Symbol('foo')]: 2 };
+
+var obj = Object.assign({}, o1, o2);
+console.log(obj); // { a: 1, [Symbol("foo")]: 2 } (siehe Bug 1207182 in Firefox)
+Object.getOwnPropertySymbols(obj); // [Symbol(foo)]
+ +

Eigenschaften der Prototypkette und nicht aufzählbare Eigenschaften können nicht kopiert werden

+ +
var obj = Object.create({ foo: 1 }, { // foo is on obj's prototype chain.
+  bar: {
+    value: 2  // bar is a non-enumerable property.
+  },
+  baz: {
+    value: 3,
+    enumerable: true  // baz is an own enumerable property.
+  }
+});
+
+var copy = Object.assign({}, obj);
+console.log(copy); // { baz: 3 }
+
+ +

Primitive Datentypen werden in Objekte gepackt

+ +
var v1 = 'abc';
+var v2 = true;
+var v3 = 10;
+var v4 = Symbol('foo');
+
+var obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
+// Primitives will be wrapped, null and undefined will be ignored.
+// Note, only string wrappers can have own enumerable properties.
+console.log(obj); // { "0": "a", "1": "b", "2": "c" }
+
+ +

Fehler unterbrechen den laufenden Kopiervorgang

+ +
var target = Object.defineProperty({}, 'foo', {
+  value: 1,
+  writable: false
+}); // target.foo is a read-only property
+
+Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 });
+// TypeError: "foo" is read-only
+// The Exception is thrown when assigning target.foo
+
+console.log(target.bar);  // 2, the first source was copied successfully.
+console.log(target.foo2); // 3, the first property of the second source was copied successfully.
+console.log(target.foo);  // 1, exception is thrown here.
+console.log(target.foo3); // undefined, assign method has finished, foo3 will not be copied.
+console.log(target.baz);  // undefined, the third source will not be copied either.
+
+ +

Kopieren von Zugriffsmethoden

+ +
var obj = {
+  foo: 1,
+  get bar() {
+    return 2;
+  }
+};
+
+var copy = Object.assign({}, obj);
+console.log(copy);
+// { foo: 1, bar: 2 }, the value of copy.bar is obj.bar's getter's return value.
+
+// This is an assign function that copies full descriptors
+function completeAssign(target, ...sources) {
+  sources.forEach(source => {
+    let descriptors = Object.keys(source).reduce((descriptors, key) => {
+      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
+      return descriptors;
+    }, {});
+    // by default, Object.assign copies enumerable Symbols too
+    Object.getOwnPropertySymbols(source).forEach(sym => {
+      let descriptor = Object.getOwnPropertyDescriptor(source, sym);
+      if (descriptor.enumerable) {
+        descriptors[sym] = descriptor;
+      }
+    });
+    Object.defineProperties(target, descriptors);
+  });
+  return target;
+}
+
+var copy = completeAssign({}, obj);
+console.log(copy);
+// { foo:1, get bar() { return 2 } }
+
+ +

Polyfill

+ +

Dieses {{Glossary("Polyfill","polyfill")}} unterstützt keine Symboleigenschaften, da ES5 ohnehin keine Symbole hat:

+ +
if (typeof Object.assign != 'function') {
+  // Must be writable: true, enumerable: false, configurable: true
+  Object.defineProperty(Object, "assign", {
+    value: function assign(target, varArgs) { // .length of function is 2
+      'use strict';
+      if (target == null) { // TypeError if undefined or null
+        throw new TypeError('Cannot convert undefined or null to object');
+      }
+
+      var to = Object(target);
+
+      for (var index = 1; index < arguments.length; index++) {
+        var nextSource = arguments[index];
+
+        if (nextSource != null) { // Skip over if undefined or null
+          for (var nextKey in nextSource) {
+            // Avoid bugs when hasOwnProperty is shadowed
+            if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {
+              to[nextKey] = nextSource[nextKey];
+            }
+          }
+        }
+      }
+      return to;
+    },
+    writable: true,
+    configurable: true
+  });
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-object.assign', 'Object.assign')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-object.assign', 'Object.assign')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Object.assign")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/constructor/index.html b/files/de/web/javascript/reference/global_objects/object/constructor/index.html new file mode 100644 index 0000000000..d524a73679 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/constructor/index.html @@ -0,0 +1,192 @@ +--- +title: Object.prototype.constructor +slug: Web/JavaScript/Reference/Global_Objects/Object/constructor +tags: + - JavaScript + - Object + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/constructor +--- +
{{JSRef("Global_Objects", "Object")}}
+ +

Zusammenfassung

+ +

Gibt eine Referenz zur {{jsxref("Global_Objects/Object", "Object")}}-Funktion, welche die  Instanz vom Prototyp herstellt. Merke: Der Wert dieser Eigenschaft ist eine Referenz auf die Funktion selbst und kein String mit dem Funktionsnamen als Inhalt. Der Wert ist nur  lesbar für primitive Werte, wie 1, true und "test".

+ +

Beschreibung

+ +

Alle Objekte erben eine constructor- Eigenschaft von ihrem prototype:

+ +
var o = {};
+o.constructor === Object; // true
+
+var a = [];
+a.constructor === Array; // true
+
+var n = new Number(3);
+n.constructor === Number; // true
+
+ +

Beispiele

+ +

Beispiel: zeigen den Konstruktor von einem Objekt an

+ +

Das folgende Beispiel erzeugt einen Prototyp: Tree, und ein Objekt von jenem Typ: theTree. Das Beispiel zeigt danach die Konstruktor-Eigenschaft vom Objekt:theTree an.

+ +
function Tree(name) {
+  this.name = name;
+}
+
+var theTree = new Tree('Redwood');
+console.log('theTree.constructor is ' + theTree.constructor);
+
+ +

Das Beispiel erzeugt folgende Ausgabe:

+ +
theTree.constructor is function Tree(name) {
+  this.name = name;
+}
+
+ +

Beispiel: Veränderung des Konstruktors eines Objekts

+ +

Das folgende Beispiel zeigt, wie man den Konstruktorwert eines generischen Objekts verändert. Nur true, 1 und "test" werden nicht von der Veränderung betroffen, da sie nur lesbare (read-only) native Konstruktoren haben. Dieses Beispiel zeigt, dass es nicht immer sicher ist, sich auf die Konstruktor-Eigenschaft eines Objekts zu verlassen.

+ +
function Type () {}
+
+var types = [
+  new Array(),
+  [],
+  new Boolean(),
+  true,             // bleibt unverändert
+  new Date(),
+  new Error(),
+  new Function(),
+  function () {},
+  Math,
+  new Number(),
+  1,                // bleibt unverändert
+  new Object(),
+  {},
+  new RegExp(),
+  /(?:)/,
+  new String(),
+  'test'            // bleibt unverändert
+];
+
+for (var i = 0; i < types.length; i++) {
+  types[i].constructor = Type;
+  types[i] = [types[i].constructor, types[i] instanceof Type, types[i].toString()];
+}
+
+console.log(types.join('\n'));
+
+ +

Das Beispiel zeigt folgende Ausgabe:

+ +
function Type() {},false,
+function Type() {},false,
+function Type() {},false,false
+function Boolean() {
+    [native code]
+},false,true
+function Type() {},false,Mon Sep 01 2014 16:03:49 GMT+0600
+function Type() {},false,Error
+function Type() {},false,function anonymous() {
+
+}
+function Type() {},false,function () {}
+function Type() {},false,[object Math]
+function Type() {},false,0
+function Number() {
+    [native code]
+},false,1
+function Type() {},false,[object Object]
+function Type() {},false,[object Object]
+function Type() {},false,/(?:)/
+function Type() {},false,/(?:)/
+function Type() {},false,
+function String() {
+    [native code]
+},false,тест
+
+ +

Spezifikation

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomentar
ECMAScript 1 te Edition.StandardAusgangsdefinition: Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.2.4.1', 'Object.prototype.constructor')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype.constructor', 'Object.prototype.constructor')}}{{Spec2('ES6')}} 
+ +

Browserunterstützung

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basis- unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basis- unterstützungt{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
diff --git a/files/de/web/javascript/reference/global_objects/object/create/index.html b/files/de/web/javascript/reference/global_objects/object/create/index.html new file mode 100644 index 0000000000..824ae41561 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/create/index.html @@ -0,0 +1,268 @@ +--- +title: Object.create() +slug: Web/JavaScript/Reference/Global_Objects/Object/create +tags: + - Methode(2) + - Méthode + - Objekt + - Referenz +translation_of: Web/JavaScript/Reference/Global_Objects/Object/create +--- +
{{JSRef("Global_Objects", "Object")}}
+ +

Summary

+ +

Die Object.create() Methode erstellt ein neues Objekt mit dem angegebenen Prototype object und ggf. zusätzlichen Eigenschaften (properties).

+ +

Syntax

+ +
Object.create(proto[, propertiesObject])
+ +

Parameter

+ +
+
proto
+
Das Objekt, welches als Prototype object des zu erstellenden Objekts verwendet wird.
+
propertiesObject
+
Optional. Falls angegeben und nicht {{jsxref("Global_Objects/undefined", "undefined")}}, ein Objekt dessen aufzählbare eigene Eigenschaften (properties, d.h.: Eigenschaften, die für das Objekt selbst definiert wurden und nicht in der prototype chain) als Eigenschaften dem neu erstellten Objekt hinzugefügt werden.  Die Eigenschaften entsprechen dem zweiten Parameter von {{jsxref("Object.defineProperties()")}}.
+
+ +

Rückgabewert

+ +

Ein neu erzeugtes Objekt mit dem angegebenen Prototype object und den angebenenen Eigenschaften (properties).

+ +

Ausnahmen

+ +

Eine {{jsxref("Global_Objects/TypeError", "TypeError")}}-Ausnahme wird ausgelöst, wenn der proto-Parameter weder {{jsxref("Global_Objects/null", "null")}} noch ein Objekt ist.

+ +

Beispiele

+ +

Beispiel: Klassenbasierte Vererbung mit Object.create()

+ +

Im folgenden sehen Sie ein Beispiel wie man Object.create() verwenden kann, um klassenbasierte Vererbung zu realisieren. JavaScript unterstützt nur einzelne Vererbung.

+ +
// Shape - superclass
+function Shape() {
+  this.x = 0;
+  this.y = 0;
+}
+
+// superclass method
+Shape.prototype.move = function(x, y) {
+  this.x += x;
+  this.y += y;
+  console.info('Shape moved.');
+};
+
+// Rectangle - subclass
+function Rectangle() {
+  Shape.call(this); // call super constructor.
+}
+
+// subclass extends superclass
+Rectangle.prototype = Object.create(Shape.prototype);
+Rectangle.prototype.constructor = Rectangle;
+
+var rect = new Rectangle();
+
+console.log('Is rect an instance of Rectangle? ' + (rect instanceof Rectangle)); // true
+console.log('Is rect an instance of Shape? ' + (rect instanceof Shape)); // true
+rect.move(1, 1); // Outputs, 'Shape moved.'
+
+ +

Wenn Sie von mehreren Objekten erben wollen, können mixins verwendet werden.

+ +
function MyClass() {
+  SuperClass.call(this);
+  OtherSuperClass.call(this);
+}
+
+MyClass.prototype = Object.create(SuperClass.prototype); // inherit
+mixin(MyClass.prototype, OtherSuperClass.prototype); // mixin
+
+MyClass.prototype.myMethod = function() {
+  // do a thing
+};
+
+ +

Die mixin Funktion kopiert die Funktionen des superclass Prototypen in den subclass Prototyp. Die mixin Funktion muss vom Benutzer bereitgestellt werden. Ein Beispiel für eine mixin-ähnliche Funktion ist jQuery.extend().

+ +

Beispiel: Benutzung des propertiesObject Parameters von Object.create()

+ +
var o;
+
+// create an object with null as prototype
+o = Object.create(null);
+
+
+o = {};
+// is equivalent to:
+o = Object.create(Object.prototype);
+
+
+// Example where we create an object with a couple of sample properties.
+// (Note that the second parameter maps keys to *property descriptors*.)
+o = Object.create(Object.prototype, {
+  // foo is a regular 'value property'
+  foo: { writable: true, configurable: true, value: 'hello' },
+  // bar is a getter-and-setter (accessor) property
+  bar: {
+    configurable: false,
+    get: function() { return 10; },
+    set: function(value) { console.log('Setting `o.bar` to', value); }
+/* with ES5 Accessors our code can look like this
+    get function() { return 10; },
+    set function(value) { console.log('setting `o.bar` to', value); } */
+  }
+});
+
+
+function Constructor() {}
+o = new Constructor();
+// is equivalent to:
+o = Object.create(Constructor.prototype);
+// Of course, if there is actual initialization code in the
+// Constructor function, the Object.create() cannot reflect it
+
+
+// create a new object whose prototype is a new, empty object
+// and a adding single property 'p', with value 42
+o = Object.create({}, { p: { value: 42 } });
+
+// by default properties ARE NOT writable, enumerable or configurable:
+o.p = 24;
+o.p;
+// 42
+
+o.q = 12;
+for (var prop in o) {
+  console.log(prop);
+}
+// 'q'
+
+delete o.p;
+// false
+
+// to specify an ES3 property
+o2 = Object.create({}, {
+  p: {
+    value: 42,
+    writable: true,
+    enumerable: true,
+    configurable: true
+  }
+});
+
+ +

Polyfill

+ +

Dieser Polyfill deckt den Hauptanwendungsfall, die Erzeugung eines neuen Objektes für das ein Prototyp ausgewählt wurde, ab.

+ +

Bitte beachten Sie, dass dieses Polyfill im Gegensatz zum echten ES5 Object.create den Einsatz von null als Prototyp-Parameter aufgrund einer Einschränkung von ECMAScript vor Version 5 nicht unterstützt.

+ +
if (typeof Object.create != 'function') {
+  Object.create = (function(undefined) {
+    var Temp = function() {};
+    return function (prototype, propertiesObject) {
+      if(prototype !== Object(prototype) && prototype !== null) {
+        throw TypeError('Argument must be an object, or null');
+      }
+      Temp.prototype = prototype || {};
+      if (propertiesObject !== undefined) {
+        Object.defineProperties(Temp.prototype, propertiesObject);
+      }
+      var result = new Temp();
+      Temp.prototype = null;
+      // to imitate the case of Object.create(null)
+      if(prototype === null) {
+         result.__proto__ = null;
+      }
+      return result;
+    };
+  })();
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.5', 'Object.create')}}{{Spec2('ES5.1')}}Initial definition. Implemented in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-object.create', 'Object.create')}}{{Spec2('ES6')}} 
+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("5")}}{{CompatGeckoDesktop("2")}}{{CompatIE("9")}}{{CompatOpera("11.60")}}{{CompatSafari("5")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoDesktop("2")}}{{CompatVersionUnknown}}{{CompatOperaMobile("11.50")}}{{CompatVersionUnknown}}
+
+ +

Basierend auf Kangax's compat table.

+ +

Zusätzliches Material

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/defineproperty/index.html b/files/de/web/javascript/reference/global_objects/object/defineproperty/index.html new file mode 100644 index 0000000000..7120abb08e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/defineproperty/index.html @@ -0,0 +1,413 @@ +--- +title: Object.defineProperty() +slug: Web/JavaScript/Reference/Global_Objects/Object/defineProperty +tags: + - Méthode + - Objekt +translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperty +--- +
{{JSRef}}
+ +

Die Methode Object.defineProperty() definiert eine neue Eigenschaft direkt auf ein Objekt, oder modifiziert eine Eigenschaft. Schließlich gibt die Funktion das Objekt zurück.

+ +

Syntax

+ +
Object.defineProperty(obj, prop, descriptor)
+ +

Parameter

+ +
+
obj
+
Das Objekt, welchem die neue Eigenschaft zugewiesen werden soll.
+
prop
+
Der Name der Eigenschaft, welche hinzugefügt oder modifiziert werden soll.
+
descriptor
+
Die Beschreibung/ der Wert, welche die neue Eigenschaft annehmen soll.
+
+ +

Rückgabewert

+ +

Das Objekt, welches behandelt wurde.

+ +

Beschreibung

+ +

Diese Methode erlaubt präzises Hinzufügen oder Modifizieren von Eigenschaften eines Objektes. Normal property addition through assignment creates properties which show up during property enumeration ({{jsxref("Statements/for...in", "for...in")}} loop or {{jsxref("Object.keys")}} method), whose values may be changed, and which may be {{jsxref("Operators/delete", "deleted", "", 1)}}. This method allows these extra details to be changed from their defaults. Standardmäßig sind Werte die mit Object.defineProperty() hinzugefügt wurden unveränderbar.

+ +

Attribut Deskriptoren unterscheiden sich in zwei Varianten: Daten Deskriptoren und Zugiffsdeskriptoren. Ein Datendeskriptor ist ein Attribut welches einen Wert hat das schreibbar oder nicht schreibbar sein kann. Ein Zugriffsdeskriptor ist ein Attribut das mit einem "getter/setter Paar" beschrieben wird. Ein Deskriptor muss von einer dieser beiden Arten sein, er kann nicht beides sein.

+ +

Beide, Daten- und Zugriffsdeskriptoren sind Objekte. Sie teilen die folgenden benötigten Objektschlüssel:

+ +
+
configurable
+
true if and only if the type of this property descriptor may be changed and if the property may be deleted from the corresponding object.
+ Defaults to false.
+
enumerable
+
true if and only if this property shows up during enumeration of the properties on the corresponding object.
+ Defaults to false.
+
+ +

Ein Datendeskriptor hat außerdem die folgenden, optionalen Schlüssel:

+ +
+
value
+
The value associated with the property. Can be any valid JavaScript value (number, object, function, etc).
+ Defaults to {{jsxref("undefined")}}.
+
writable
+
true if and only if the value associated with the property may be changed with an {{jsxref("Operators/Assignment_Operators", "assignment operator", "", 1)}}.
+ Defaults to false.
+
+ +

Ein Zugriffsdeskriptor hat außerdem die folgenden, optionalen Schlüssel:

+ +
+
get
+
A function which serves as a getter for the property, or {{jsxref("undefined")}} if there is no getter. The function return will be used as the value of property.
+ Defaults to {{jsxref("undefined")}}.
+
set
+
A function which serves as a setter for the property, or {{jsxref("undefined")}} if there is no setter. The function will receive as only argument the new value being assigned to the property.
+ Defaults to {{jsxref("undefined")}}.
+
+ +

Bear in mind that these options are not necessarily the descriptor's own properties, and properties inherited from the prototype chain will be considered too. In order to ensure these defaults are preserved you might freeze the {{jsxref("Object.prototype")}} upfront or specify all options explicitly.

+ +
// being explicit
+Object.defineProperty(obj, 'key', {
+  enumerable: false,
+  configurable: false,
+  writable: false,
+  value: 'static'
+});
+
+// recycling same object
+function withValue(value) {
+  var d = withValue.d || (
+    withValue.d = {
+      enumerable: false,
+      writable: false,
+      configurable: false,
+      value: null
+    }
+  );
+  d.value = value;
+  return d;
+}
+// ... and ...
+Object.defineProperty(obj, 'key', withValue('static'));
+
+// if freeze is available, prevents adding or
+// removing the object prototype properties
+// (value, get, set, enumerable, writable, configurable)
+(Object.freeze || Object)(Object.prototype);
+
+ +

Examples

+ +

If you want to see how to use the Object.defineProperty method with a binary-flags-like syntax, see additional examples.

+ +

Creating a property

+ +

When the property specified doesn't exist in the object, Object.defineProperty() creates a new property as described. Fields may be omitted from the descriptor, and default values for those fields are imputed. All of the Boolean-valued fields default to false. The value, get, and set fields default to {{jsxref("undefined")}}. A property which is defined without get/set/value/writable is called “generic” and is “typed” as a data descriptor.

+ +
var o = {}; // Creates a new object
+
+// Example of an object property added with defineProperty with a data property descriptor
+Object.defineProperty(o, 'a', {
+  value: 37,
+  writable: true,
+  enumerable: true,
+  configurable: true
+});
+// 'a' property exists in the o object and its value is 37
+
+// Example of an object property added with defineProperty with an accessor property descriptor
+var bValue = 38;
+Object.defineProperty(o, 'b', {
+  get: function() { return bValue; },
+  set: function(newValue) { bValue = newValue; },
+  enumerable: true,
+  configurable: true
+});
+o.b; // 38
+// 'b' property exists in the o object and its value is 38
+// The value of o.b is now always identical to bValue, unless o.b is redefined
+
+// You cannot try to mix both:
+Object.defineProperty(o, 'conflict', {
+  value: 0x9f91102,
+  get: function() { return 0xdeadbeef; }
+});
+// throws a TypeError: value appears only in data descriptors, get appears only in accessor descriptors
+
+ +

Modifying a property

+ +

When the property already exists, Object.defineProperty() attempts to modify the property according to the values in the descriptor and the object's current configuration. If the old descriptor had its configurable attribute set to false (the property is said to be “non-configurable”), then no attribute besides writable can be changed. In that case, it is also not possible to switch back and forth between the data and accessor property types.

+ +

If a property is non-configurable, its writable attribute can only be changed to false.

+ +

A {{jsxref("TypeError")}} is thrown when attempts are made to change non-configurable property attributes (besides the writable attribute) unless the current and new values are the same.

+ +

Writable attribute

+ +

When the writable property attribute is set to false, the property is said to be “non-writable”. It cannot be reassigned.

+ +
var o = {}; // Creates a new object
+
+Object.defineProperty(o, 'a', {
+  value: 37,
+  writable: false
+});
+
+console.log(o.a); // logs 37
+o.a = 25; // No error thrown (it would throw in strict mode, even if the value had been the same)
+console.log(o.a); // logs 37. The assignment didn't work.
+
+ +

As seen in the example, trying to write into the non-writable property doesn't change it but doesn't throw an error either.

+ +

Enumerable attribute

+ +

The enumerable property attribute defines whether the property shows up in a {{jsxref("Statements/for...in", "for...in")}} loop and {{jsxref("Object.keys()")}} or not.

+ +
var o = {};
+Object.defineProperty(o, 'a', { value: 1, enumerable: true });
+Object.defineProperty(o, 'b', { value: 2, enumerable: false });
+Object.defineProperty(o, 'c', { value: 3 }); // enumerable defaults to false
+o.d = 4; // enumerable defaults to true when creating a property by setting it
+
+for (var i in o) {
+  console.log(i);
+}
+// logs 'a' and 'd' (in undefined order)
+
+Object.keys(o); // ['a', 'd']
+
+o.propertyIsEnumerable('a'); // true
+o.propertyIsEnumerable('b'); // false
+o.propertyIsEnumerable('c'); // false
+
+ +

Configurable attribute

+ +

The configurable attribute controls at the same time whether the property can be deleted from the object and whether its attributes (other than writable) can be changed.

+ +
var o = {};
+Object.defineProperty(o, 'a', {
+  get: function() { return 1; },
+  configurable: false
+});
+
+Object.defineProperty(o, 'a', { configurable: true }); // throws a TypeError
+Object.defineProperty(o, 'a', { enumerable: true }); // throws a TypeError
+Object.defineProperty(o, 'a', { set: function() {} }); // throws a TypeError (set was undefined previously)
+Object.defineProperty(o, 'a', { get: function() { return 1; } }); // throws a TypeError (even though the new get does exactly the same thing)
+Object.defineProperty(o, 'a', { value: 12 }); // throws a TypeError
+
+console.log(o.a); // logs 1
+delete o.a; // Nothing happens
+console.log(o.a); // logs 1
+
+ +

If the configurable attribute of o.a had been true, none of the errors would be thrown and the property would be deleted at the end.

+ +

Adding properties and default values

+ +

It's important to consider the way default values of attributes are applied. There is often a difference between simply using dot notation to assign a value and using Object.defineProperty(), as shown in the example below.

+ +
var o = {};
+
+o.a = 1;
+// is equivalent to:
+Object.defineProperty(o, 'a', {
+  value: 1,
+  writable: true,
+  configurable: true,
+  enumerable: true
+});
+
+
+// On the other hand,
+Object.defineProperty(o, 'a', { value: 1 });
+// is equivalent to:
+Object.defineProperty(o, 'a', {
+  value: 1,
+  writable: false,
+  configurable: false,
+  enumerable: false
+});
+
+ +

Custom Setters and Getters

+ +

Example below shows how to implement a self-archiving object. When temperature property is set, the archive array gets a log entry.

+ +
function Archiver() {
+  var temperature = null;
+  var archive = [];
+
+  Object.defineProperty(this, 'temperature', {
+    get: function() {
+      console.log('get!');
+      return temperature;
+    },
+    set: function(value) {
+      temperature = value;
+      archive.push({ val: temperature });
+    }
+  });
+
+  this.getArchive = function() { return archive; };
+}
+
+var arc = new Archiver();
+arc.temperature; // 'get!'
+arc.temperature = 11;
+arc.temperature = 13;
+arc.getArchive(); // [{ val: 11 }, { val: 13 }]
+
+ +

or

+ +
var pattern = {
+    get: function () {
+        return 'I always return this string, whatever you have assigned';
+    },
+    set: function () {
+        this.myname = 'this is my name string';
+    }
+};
+
+
+function TestDefineSetAndGet() {
+    Object.defineProperty(this, 'myproperty', pattern);
+}
+
+
+var instance = new TestDefineSetAndGet();
+instance.myproperty = 'test';
+console.log(instance.myproperty); // I always return this string, whatever you have assigned
+
+console.log(instance.myname); // this is my name string
+
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.6', 'Object.defineProperty')}}{{Spec2('ES5.1')}}Initial definition. Implemented in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-object.defineproperty', 'Object.defineProperty')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-object.defineproperty', 'Object.defineProperty')}}{{Spec2('ESDraft')}}
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop("2")}}{{CompatChrome("5")}}{{CompatIE("9")}} [1]{{CompatOpera("11.60")}}{{CompatSafari("5.1")}} [2]
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile("2")}}{{CompatVersionUnknown}}{{CompatIE("9")}}{{CompatOperaMobile("11.5")}}{{CompatVersionUnknown}}
+
+ +

[1] In Internet Explorer 8 only on DOM objects and with some non-standard behaviors.

+ +

[2] Also supported in Safari 5, but not on DOM objects.

+ +

Compatibility notes

+ +

Redefining the length property of an Array object

+ +

It is possible to redefine the {{jsxref("Array.length", "length")}} property of arrays, subject to the usual redefinition restrictions. (The {{jsxref("Array.length", "length")}} property is initially non-configurable, non-enumerable, and writable. Thus on an unaltered array it is possible to change the {{jsxref("Array.length", "length")}} property's value, or to make it non-writable. It is not allowed to change its enumerability or configurability, or if it is non-writable to change its value or writability.) However, not all browsers permit this redefinition.

+ +

Firefox 4 through 22 will throw a {{jsxref("TypeError")}} on any attempt whatsoever (whether permitted or not) to redefine the {{jsxref("Array.length", "length")}} property of an array.

+ +

Versions of Chrome which implement Object.defineProperty() in some circumstances ignore a length value different from the array's current {{jsxref("Array.length", "length")}} property. In some circumstances changing writability seems to silently not work (and not throw an exception). Also, relatedly, some array-mutating methods like {{jsxref("Array.prototype.push")}} don't respect a non-writable length.

+ +

Versions of Safari which implement Object.defineProperty() ignore a length value different from the array's current {{jsxref("Array.length", "length")}} property, and attempts to change writability execute without error but do not actually change the property's writability.

+ +

Only Internet Explorer 9 and later, and Firefox 23 and later, appear to fully and correctly implement redefinition of the {{jsxref("Array.length", "length")}} property of arrays. For now, don't rely on redefining the {{jsxref("Array.length", "length")}} property of an array to either work, or to work in a particular manner. And even when you can rely on it, there's really no good reason to do so.

+ +

Internet Explorer 8 specific notes

+ +

Internet Explorer 8 implemented a Object.defineProperty() method that could only be used on DOM objects. A few things need to be noted:

+ + + +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/entries/index.html b/files/de/web/javascript/reference/global_objects/object/entries/index.html new file mode 100644 index 0000000000..4ac921f62b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/entries/index.html @@ -0,0 +1,168 @@ +--- +title: Object.entries() +slug: Web/JavaScript/Reference/Global_Objects/Object/entries +tags: + - Entries + - Iterieren + - JavaScript + - Méthode + - Objekt + - Referenz + - Schleife +translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries +--- +
{{JSRef}}
+ +

Object.entries() ist eine Methode für Objekte. Zurückgegeben wird ein Array mit den Eigenschaften des Objektes. Diese Eigenschaften werden in Key-Value-Paaren als zählbare strings zurückgegeben.

+ +

Im Gegensatz zur {{jsxref("Statements/for...in", "for...in")}}-Schleife werden dabei nicht die constructor- Eigenschaften zurückgegeben, die das Objekt von seinem prototype geerbt hat.

+ +
+

Die Reihenfolge der Key-Value-Paare ist dabei die gleiche wie bei einer {{jsxref("Statements/for...in", "for...in")}}-Schleife. Sie hängt nicht davon ab, wie das ursprüngliche Objekt aufgebaut ist. Ist eine bestimmte Reihenfolge erwünscht, muss der Array sortiert werden:
+ Object.entries(obj).sort((a, b) => b[0].localeCompare(a[0]));.

+ +

 

+
+ +
{{EmbedInteractiveExample("pages/js/object-entries.html")}}
+ + + +

Syntax

+ +
Object.entries(obj)
+ +

Parameter

+ +
+
obj
+
Ein Objekt besitzt Eigenschaften in Form von Key-Value-Paaren. 
+
+ +

Rückgabewert

+ +

Zurückgegeben wird ein Array mit den Key-Value-Paaren ([key, value]) eines Objektes in Form von zählbaren strings.

+ +

Beschreibung

+ +

Object.entries() erzeugt einen Array auf Basis eines Objekts. Die Eigenschaften des Objekts werden im Array als Key-Value-Paare gespeichert.
+ Die Reihenfolge der Eigenschaften ist dabei gleich einer manuellen Iteration über das Objekt.

+ +

Beispiele

+ +
const obj = { foo: 'bar', baz: 42 };
+console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]
+
+// Array-ähnliches Objekt
+const obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]
+
+// Array-ähnliches Objekt mit zufälliger Reihenfolge der Keys
+const anObj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.entries(anObj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]
+
+// getFoo- Eigenschaft ist nicht zählbar
+const myObj = Object.create({}, { getFoo: { value() { return this.foo; } } });
+myObj.foo = 'bar';
+console.log(Object.entries(myObj)); // [ ['foo', 'bar'] ]
+
+// Das Argument, das kein Objekt ist, wird in ein Objekt umgewandelt
+console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]
+
+// Gibt einen Leeren Array zurück, da primitive Datentypen keine eigenen Eigenschaften haben
+console.log(Object.entries(100)); // [ ]
+
+// Elegant über Key-Value-Paare iterieren
+const obj = { a: 5, b: 7, c: 9 };
+for (const [key, value] of Object.entries(obj)) {
+  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
+}
+
+// Mit array extras über Key-Value-Paare iterieren
+Object.entries(obj).forEach(([key, value]) => {
+  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
+});
+
+ +

Ein Object in ein Map-Objekt umwandeln

+ +

Der {{jsxref("Map", "new Map()")}}-constructor akzeptiert zählbare entries. Mithilfe von Object.entries kann ein {{jsxref("Object")}} in ein {{jsxref("Map")}}-Objekt umgewandelt werden:

+ +
const obj = { foo: 'bar', baz: 42 };
+const map = new Map(Object.entries(obj));
+console.log(map); // Map { foo: "bar", baz: 42 }
+
+ +

Durch das Object iterieren

+ +

Mit der Technik der destrukturierenden Zuweisung kann durch Objekte iteriert werden.

+ +
const obj = { foo: 'bar', baz: 42 };
+Object.entries(obj).forEach(([key, value]) => console.log(`${key}: ${value}`)); // "foo: bar", "baz: 42"
+
+ +

Polyfill

+ +

Um Object.entries auch in älteren Umgebungen zu nutzen, die diese Methode nicht nativ unterstützen, sind Polyfills im tc39/proposal-object-values-entries (ohne IE) order im es-shims/Object.entries-Repository finden. Untenstehender Polyfill ist ebenfalls verwendbar:

+ +
if (!Object.entries) {
+  Object.entries = function( obj ){
+    var ownProps = Object.keys( obj ),
+        i = ownProps.length,
+        resArray = new Array(i); // preallocate the Array
+    while (i--)
+      resArray[i] = [ownProps[i], obj[ownProps[i]]];
+
+    return resArray;
+  };
+}
+
+ +

Sollten Sie auch IE < 9 unterstützen müssen, brauchen sie jedoch zusätzlich den Object.keys-Polyfill, zu finden auf {{jsxref("Object.keys")}}.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ESDraft', '#sec-object.entries', 'Object.entries')}}{{Spec2('ESDraft')}}Initiale Definition.
{{SpecName('ES8', '#sec-object.entries', 'Object.entries')}}{{Spec2('ES8')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Object.entries")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/freeze/index.html b/files/de/web/javascript/reference/global_objects/object/freeze/index.html new file mode 100644 index 0000000000..b0379d636c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/freeze/index.html @@ -0,0 +1,253 @@ +--- +title: Object.freeze() +slug: Web/JavaScript/Reference/Global_Objects/Object/freeze +tags: + - ECMAScript5 + - JavaScript + - Methode(2) + - Objekt +translation_of: Web/JavaScript/Reference/Global_Objects/Object/freeze +--- +
{{JSRef}}
+ +

Die Methode Object.freeze() friert ein Objekt ein. Ein eingefrorenes Objekt kann nicht mehr geändert werden. Das Einfrieren eines Objekts verhindert, dass neue Eigenschaften hinzugefügt oder existierende entfernt und die Aufzählbarkeit, Konfigurierbarkeit oder Schreibbarkeit vorhandener Eigenschaften und deren Werte geändert werden können. Durch das Einfrieren eines Objekts wird außerdem verhindert, dass der Prototyp geändert wird. freeze() gibt das gleiche Objekt zurück, das übergeben wurde.

+ +
{{EmbedInteractiveExample("pages/js/object-freeze.html")}}
+ + + +

Syntax

+ +
Object.freeze(obj)
+ +

Parameter

+ +
+
obj
+
Das einzufrierende Objekt.
+
+ +

Rückgabewert

+ +

Das Objekt, welches an die Funktion übergeben wurde.

+ +

Beschreibung

+ +

Zum Eigenschaftssatz eines eingefrorenen Objekts kann nichts hinzugefügt oder daraus entfernt werden. Jeder Versuch, dies zu tun, schlägt fehl, entweder im Hintergrund oder durch Auslösen einer {{jsxref("TypeError")}} Exception (meistens, jedoch nicht ausschließlich, wenn im {{jsxref("Strict_mode", "strikten Modus", "", 1)}}).

+ +

Bei Dateneigenschaften eines eingefrorenen Objekts können Werte nicht geändert werden. Die Attribute für Beschreibbarkeit und Konfigurierbarkeit werden auf false gesetzt. Accessor-Eigenschaften (Getter und Setter) funktionieren gleich (und lassen einen nach wie vor in dem Glauben etwas zu ändern). Beachten Sie, dass Werte, die Objekte sind, immer noch geändert werden können, es sei denn, sie werden ebenfalls eingefroren. Da ein Array ein Objekt ist, kann es eingefroren werden. Danach können seine Elemente nicht mehr geändert und keine Elemente hinzugefügt oder entfernt werden.

+ +

freeze() gibt das gleiche Objekt zurück, das an die Funktion übergeben wurde. Es wird keine eingefrorene Kopie erstellt.

+ +

Beispiele

+ +

Objekte einfrieren

+ +
var obj = {
+  prop: function() {},
+  foo: 'bar'
+};
+
+// Vor dem Einfrieren: neue Eigenschaften können hinzugefügt
+// und vorhandene Eigenschaften geändert oder entfernt werden
+obj.foo = 'baz';
+obj.lumpy = 'woof';
+delete obj.prop;
+
+// Einfrieren
+var o = Object.freeze(obj);
+
+// Der Rückgabewert ist dasselbe Objekt, das übergeben wurde
+o === obj; // true
+
+// Das Objekt ist eingefroren
+Object.isFrozen(obj); // === true
+
+// Jetzt schlagen sämtliche Änderungen fehl
+obj.foo = 'quux'; // nichts passiert, im Stillen
+// fügt die Eigenschaft nicht hinzu, im Stillen
+obj.quaxxor = 'the friendly duck';
+
+// Im strikten Modus lösen solche Versuche TypeErrors aus
+function fail(){
+  'use strict';
+  obj.foo = 'sparky'; // löst TypeError aus
+  delete obj.foo; // löst TypeError aus
+  delete obj.quaxxor; // gibt true zurück, da Attribut 'quaxxor' nie hinzugefügt wurde
+  obj.sparky = 'arf'; // löst TypeError aus
+}
+
+fail();
+
+// Versuchte Änderungen über Object.defineProperty;
+// beide Anweisungen lösen TypeError aus
+Object.defineProperty(obj, 'ohai', { value: 17 });
+Object.defineProperty(obj, 'foo', { value: 'eit' });
+
+// Der prototype kann ebenfalls nicht geändert werden
+// beide Anweisungen lösen TypeError aus
+Object.setPrototypeOf(obj, { x: 20 })
+obj.__proto__ = { x: 20 }
+
+ +

Arrays einfrieren

+ +
let a = [0];
+Object.freeze(a); // Das Array kann nicht mehr geändert werden
+
+a[0]=1; // schlägt still fehl
+a.push(2); // schlägt still fehl
+
+// Im strikten Modus lösen solche Versuche TypeErrors aus
+function fail() {
+  "use strict"
+  a[0] = 1;
+  a.push(2);
+}
+
+fail();
+ +

Das eingefrorene Objekt ist unveränderlich (engl. immutable). Es ist jedoch nicht notwendigerweise konstant. Das folgende Beispiel zeigt, dass ein eingefrorenes Objekt nicht konstant ist (Einfrieren ist flach).

+ +
obj1 = {
+  internal: {}
+};
+
+Object.freeze(obj1);
+obj1.internal.a = 'aValue';
+
+obj1.internal.a // 'aValue'
+ +

Um ein konstantes Objekt zu sein, muss der gesamte Referenzgraph (direkte und indirekte Verweise auf andere Objekte) nur unveränderliche eingefrorene Objekte referenzieren. Das eingefrorene Objekt wird als unveränderlich (immutable) bezeichnet, da der gesamte Objektzustand (Werte und Verweise auf andere Objekte) innerhalb des gesamten Objekts fix ist. Beachten Sie, dass Strings, Zahlen und Booleans immer unveränderlich (immutable) und Funktionen und Arrays Objekte sind.

+ +

Was ist "flaches Einfrieren"?

+ +

Das Ergebnis des Aufrufs von Object.freeze(object) gilt nur für die unmittelbaren Eigenschaften von object selbst und verhindert, dass zukünftige Eigenschaften hinzugefügt, entfernt oder Werte auf diesem object neu zugewiesen werden. Wenn der Wert dieser Eigenschaften selbst Objekte sind, werden diese Objekte nicht eingefroren und können das Ziel von Eigenschaftszusatz-, Entfernungs- oder Wertzuordnungsvorgängen sein.

+ +
var employee = {
+  name: "Mayank",
+  designation: "Developer",
+  address: {
+    street: "Rohini",
+    city: "Delhi"
+  }
+};
+
+Object.freeze(employee);
+
+employee.name = "Dummy"; // schlägt im nicht-strikten Modus still fehl
+employee.address.city = "Noida"; // Attribute von Kind-Objekt können geändert werden
+
+console.log(employee.address.city) // Ausgabe: "Noida"
+
+ +

Um ein Objekt unveränderlich zu machen, frieren Sie rekursiv jede Eigenschaft vom Typ object ein (deep freeze). Verwenden Sie das Muster im Einzelfall basierend auf Ihrem Entwurf, wenn Sie wissen, dass das Objekt keine {{interwiki("wikipedia", "Zyklus_(Graphentheorie)", "Zyklen")}} im Referenzgraph enthält, andernfalls kommt es zu einer Endlosschleife. Eine Verbesserung von deepFreeze() wäre eine interne Funktion, die ein Argument für einen Pfad (z. B. ein Array) empfängt, sodass Sie den Aufruf von deepFreeze() rekursiv unterdrücken können, wenn ein Objekt gerade unveränderlich gemacht wird. Es besteht weiterhin die Gefahr, dass ein Objekt eingefroren wird, das nicht eingefroren werden sollte, wie z. B. [window].

+ +
function deepFreeze(object) {
+
+  // Abrufen der definierten Eigenschaftsnamen des Objekts
+  var propNames = Object.getOwnPropertyNames(object);
+
+  // Eigenschaften vor dem eigenen Einfrieren einfrieren
+
+  for (let name of propNames) {
+    let value = object[name];
+
+    object[name] = value && typeof value === "object" ?
+      deepFreeze(value) : value;
+  }
+
+  return Object.freeze(object);
+}
+
+var obj2 = {
+  internal: {
+    a: null
+  }
+};
+
+deepFreeze(obj2);
+
+obj2.internal.a = 'anotherValue'; // schlägt im nicht-strikten Modus still fehl
+obj2.internal.a; // null
+
+ +

Nutzungshinweise

+ +

Wenn das Argument für diese Methode kein Objekt (ein Primitiv) ist, führt dies in ES5 zu einem {{jsxref("TypeError")}}. In ES2015 wird ein Nicht-Objekt-Argument wie ein eingefrorenes gewöhnliches Objekt behandelt und einfach zurückgegeben.

+ +
> Object.freeze(1)
+TypeError: 1 is not an object // ES5 Code
+
+> Object.freeze(1)
+1                             // ES2015 Code
+
+ +

Ein {{domxref("ArrayBufferView")}} mit Elementen verursacht einen {{jsxref("TypeError")}}, da diese Ansichten über den Arbeitsspeicher sind und auf jeden Fall andere mögliche Probleme verursachen können:

+ +
> Object.freeze(new Uint8Array(0)) // Keine Elemente
+Uint8Array []
+
+> Object.freeze(new Uint8Array(1)) // Hat Elemente
+TypeError: Cannot freeze array buffer views with elements
+
+> Object.freeze(new DataView(new ArrayBuffer(32))) // Keine Elemente
+DataView {}
+
+> Object.freeze(new Float64Array(new ArrayBuffer(64), 63, 0)) // Keine Elemente
+Float64Array []
+
+> Object.freeze(new Float64Array(new ArrayBuffer(64), 32, 2)) // Hat Elemente
+TypeError: Cannot freeze array buffer views with elements
+
+ +

Beachten Sie, da die drei Standard-Eigenschaften (buf.byteLength, buf.byteOffset und buf.buffer) schreibgeschützt sind (wie die Eigenschaften eines {{jsxref("ArrayBuffer")}} oder {{jsxref("SharedArrayBuffer")}}) gibt es keinen Grund, diese einzufrieren.

+ +

Vergleich zu Object.seal()

+ +

Vorhandene Eigenschaften in Objekten, die mit {{jsxref("Object.seal()")}} versiegelt wurden, können geändert werden. Vorhandene Eigenschaften in Objekten, die mit Object.freeze() eingefroren wurden, werden unveränderlich gemacht.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.9', 'Object.freeze')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-object.freeze', 'Object.freeze')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.freeze', 'Object.freeze')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Object.freeze")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/getownpropertynames/index.html b/files/de/web/javascript/reference/global_objects/object/getownpropertynames/index.html new file mode 100644 index 0000000000..1e76977b49 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/getownpropertynames/index.html @@ -0,0 +1,201 @@ +--- +title: Object.getOwnPropertyNames() +slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames +tags: + - german +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames +--- +
{{JSRef}}
+ +

Die Object.getOwnPropertyNames() Methode gibt einen Array mit allen Eigenschaftsnamen (aufzählbar oder nicht) zurück, welche direkt auf einem Objekt gefunden werden. 

+ +

Syntax

+ +
Object.getOwnPropertyNames(obj)
+ +

Parameters

+ +
+
obj
+
Das Objekt dessen aufzählbaren und nicht aufzählbaren Eigenschaftsnamen gesucht sind. 
+
+ +

Beschreibung

+ +

Object.getOwnPropertyNames () gibt ein Array zurück, dessen Elemente Strings sind, die den aufzählbar und nicht aufzählbar Eigenschaften direkt auf dem Objekt gefunden werden. Die Reihenfolge der Enumerable-Objekte im Array steht im Einklang mit der Benutzung von einer exponierten Schleife {{jsxref ("Statements / for ... in", "for ... in")}} (oder durch {{jsxref ("Object.keys () ")}}) über die Eigenschaften des Objekts. Die Reihenfolge der nicht-aufzählbar Objekte im Array, und unter den aufzählbare Eigenschaften, ist nicht definiert.

+ +

Beispiele

+ +

Benutzung von Object.getOwnPropertyNames()

+ +
var arr = ['a', 'b', 'c'];
+console.log(Object.getOwnPropertyNames(arr).sort()); // logs '0,1,2,length'
+
+// Array-like object
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.getOwnPropertyNames(obj).sort()); // logs '0,1,2'
+
+// Logging property names and values using Array.forEach
+Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
+  console.log(val + ' -> ' + obj[val]);
+});
+// logs
+// 0 -> a
+// 1 -> b
+// 2 -> c
+
+// non-enumerable property
+var my_obj = Object.create({}, {
+  getFoo: {
+    value: function() { return this.foo; },
+    enumerable: false
+  }
+});
+my_obj.foo = 1;
+
+console.log(Object.getOwnPropertyNames(my_obj).sort()); // logs 'foo,getFoo'
+
+ +

Wenn Sie nur die aufzählbare Eigenschaften möchten, kann man die Funktion {{jsxref ("Object.keys ()")}} benutzen. Alternativ können auch Schlaufen {{jsxref ("Statements / for ... in", "for ... in")}} verwendet werden (dies gibt nicht nur die aufzählbaren Eigenschaften des Objektes, sondern auch entlang der Prototypkette zurück. Behoben kann diese mit der Methode {{jsxref ("Object.prototype.hasOwnProperty ()", "hasOwnProperty ()" )}}).

+ +

Items welche sich im Prototype chain befinden, werden nicht aufgelistet.

+ +
function ParentClass() {}
+ParentClass.prototype.inheritedMethod = function() {};
+
+function ChildClass() {
+  this.prop = 5;
+  this.method = function() {};
+}
+ChildClass.prototype = new ParentClass;
+ChildClass.prototype.prototypeMethod = function() {};
+
+console.log(
+  Object.getOwnPropertyNames(
+    new ChildClass() // ['prop', 'method']
+  )
+);
+
+ +

Nur unzählige Eigenschaften

+ +

Es wird die {{jsxref("Array.prototype.filter()")}} Funktion benötigt um alle zählbaren Schlüssel (erhalten mit {{jsxref("Object.keys()")}}) von einer Liste mit allen Schlüsseln (erhalten mit Object.getOwnPropertyNames()) zu vergleichen, welches nur die unzähligen Eigenschaften zurück lässt.

+ +
var target = myObject;
+var enum_and_nonenum = Object.getOwnPropertyNames(target);
+var enum_only = Object.keys(target);
+var nonenum_only = enum_and_nonenum.filter(function(key) {
+  var indexInEnum = enum_only.indexOf(key);
+  if (indexInEnum == -1) {
+    // not found in enum_only keys mean the key is non-enumerable,
+    // so return true so we keep this in the filter
+    return true;
+  } else {
+    return false;
+  }
+});
+
+console.log(nonenum_only);
+
+ +

Notizen

+ +

Wenn bei ES5 das Argument der Methode kein primitives Objekt ist, wird der Funktionsaufruf ein {{jsxref("TypeError")}} werfen. In ES6 wird ein nicht-Objekt Argument automatisch in ein Objekt gecasted.

+ +
Object.getOwnPropertyNames('foo');
+// TypeError: "foo" is not an object (ES5 code)
+
+Object.getOwnPropertyNames('foo');
+// ['length', '0', '1', '2']  (ES6 code)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.4', 'Object.getOwnPropertyNames')}}{{Spec2('ES5.1')}}Initialdefinition. Implementiert in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-object.getownpropertynames', 'Object.getOwnPropertyNames')}}{{Spec2('ES6')}} 
+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basissupport{{CompatChrome("5")}}{{CompatGeckoDesktop("2")}}{{CompatIE("9")}}{{CompatOpera("12")}}{{CompatSafari("5")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basissupport{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

SpiderMonkey-spezifische Notizen

+ +

 

+ +

Vor SpiderMonkey 28 {{geckoRelease("28")}}, ignorierte die Funktion Object.getOwnPropertyNames unaufgelöste Eigenschaften eines {{jsxref("Error")}} Objektes. Dieser Fehler wurde in den letzten Versionen behoben ({{bug("724768")}}).

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/getprototypeof/index.html b/files/de/web/javascript/reference/global_objects/object/getprototypeof/index.html new file mode 100644 index 0000000000..cb2c6c0028 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/getprototypeof/index.html @@ -0,0 +1,133 @@ +--- +title: Object.getPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf +--- +
{{JSRef}}
+ +

Die Object.getPrototypeOf() Methode gibt den Prototyp (den Wert der internen [[Prototype]] Eigenschaft) des angegebenen Objekts obj zurück

+ +

Syntax

+ +
Object.getPrototypeOf(obj)
+ +

Parameter

+ +
+
obj
+
Das Objekt, dessen Prototyp zurückgegeben werden soll.
+
+ +

Rückgabewert

+ +

Der Prototyp des Objekts obj wird zurückgegeben. Wenn keine Eigenschaften vererbt werden, wird {{jsxref("null")}} zurück gegeben.

+ +

Beispiele

+ +
var proto = {};
+var obj = Object.create(proto);
+Object.getPrototypeOf(obj) === proto; // true
+
+ +

Notizen

+ +

In ES5 wird eine {{jsxref("TypeError")}} exception geworfen, falls der Parameter obj kein Objekt ist . In ES2015 wird der Parameter obj in ein {{jsxref("Object")}} umgewandelt.

+ +
Object.getPrototypeOf('foo');
+// TypeError: "foo" is not an object (ES5 code)
+Object.getPrototypeOf('foo');
+// String.prototype                  (ES2015 code)
+
+ +

Spezifikation

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.2', 'Object.getPrototypeOf')}}{{Spec2('ES5.1')}}Initial definition.
{{SpecName('ES6', '#sec-object.getprototypeof', 'Object.getProtoypeOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.getprototypeof', 'Object.getProtoypeOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("5")}}{{CompatGeckoDesktop("1.9.1")}}{{CompatIE("9")}}{{CompatOpera("12.10")}}{{CompatSafari("5")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Opera-spezfische Notizen

+ +

Even though older Opera versions don't support Object.getPrototypeOf() yet, Opera supports the non-standard {{jsxref("Object.proto", "__proto__")}} property since Opera 10.50.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/hasownproperty/index.html b/files/de/web/javascript/reference/global_objects/object/hasownproperty/index.html new file mode 100644 index 0000000000..1d990d3bfa --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/hasownproperty/index.html @@ -0,0 +1,203 @@ +--- +title: Object.prototype.hasOwnProperty() +slug: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty +tags: + - JavaScript + - Method + - Object + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty +--- +
{{JSRef}}
+ +

Die Methode hasOwnProperty() gibt einen boolean Wert zurück abhängig von der Existenz des gegebenen Attributs in einem Objekt.

+ +

Syntax

+ +
obj.hasOwnProperty(prop)
+ +

Parameter

+ +
+
prop
+
Der Name des Attributs auf dessen Existenz im Objekt geprüft wird
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}} der besagt, ob eine Eigenschaft in dem gegebenen Objekte vorhanden ist oder nicht.

+ +

Beschreibung

+ +

Jedes  untergeordnete Objekt / jeder untergeordneter Wert in einem Objekt trägt die hasOwnProperty Methode mit sich. Diese Methode ermöglicht das Nachfragen eines untergeordneten Wertes/Objekts innerhalb eines Objekts. Anders als die {{jsxref("Operators/in", "in")}} Methode ermöglicht die hasOwnProperty Methode keinen Zugriff auf die Kindeskinder eines Objekts.

+ +

Beispiele

+ +

Einsatz von hasOwnProperty zur Überprüfung der Existenz eines Attributs in einem Objekt

+ +

Das folgende Beispiel prüft ob das Objekt o ein Attribut mit dem Namen prop beinhaltet.

+ +
o = new Object();
+o.prop = 'exists';
+
+function changeO() {
+  o.newprop = o.prop;
+  delete o.prop;
+}
+
+o.hasOwnProperty('prop');   // gibt true zurück
+changeO();
+o.hasOwnProperty('prop');   // gibt false zurück
+
+ +

Direkter Nachfolger vs Geerbtes Attribut

+ +

Das folgende Beispiel unterscheidet zwischen direkten Kind-Attributen eines Objekts und den Attributen die durch die prototype - Verarbeitung entstehen.

+ +
o = new Object();
+o.prop = 'exists';
+o.hasOwnProperty('prop');             // gibt true zurück
+o.hasOwnProperty('toString');         // gibt false zurück
+o.hasOwnProperty('hasOwnProperty');   // gibt false zurück
+
+ +

Über die Eigenschaften eines Objektes iterieren

+ +

Das folgende Beispiel zeigt, wie man über die Eigenschaften eines Objektes iteriert ohne vererbte Eigenschaften auszuführen. Zu Beachten ist, dass eine {{jsxref("Statements/for...in", "for...in")}} Schleife nur über zählbare (enumerable) Eigenschaften iteriert, jedoch sollte man durch diese Einschränkung nicht annehmen, dass nicht-zählbare Eigenschaften gezeigt werden, denn hasOwnProperty selbst kann nur auf zählbare Eigenschaften angewendet werden (wie auch die {{jsxref("Object.getOwnPropertyNames()")}} Funktion):

+ +
var buz = {
+  fog: 'stack'
+};
+
+for (var name in buz) {
+  if (buz.hasOwnProperty(name)) {
+    console.log('this is fog (' + name + ') for sure. Value: ' + buz[name]);
+  }
+  else {
+    console.log(name); // toString or something else
+  }
+}
+
+ +

Einsatz von hasOwnProperty als Eigenschaftsname

+ +

JavaScript schützt die den Eigenschaftsnamen hasOwnProperty nicht. Dadurch ist es möglich, dass ein Objekt eine Eigenschaft mit diesem namen hat. Das ermöglicht es eine externe hasOwnProperty Funktion zu benutzen:

+ +
var foo = {
+  hasOwnProperty: function() {
+    return false;
+  },
+  bar: 'Here be dragons'
+};
+
+foo.hasOwnProperty('bar'); // always returns false
+
+// Use another Object's hasOwnProperty and call it with 'this' set to foo
+({}).hasOwnProperty.call(foo, 'bar'); // true
+
+// It's also possible to use the hasOwnProperty property from the Object prototype for this purpose
+Object.prototype.hasOwnProperty.call(foo, 'bar'); // true
+
+ +

Zu beachten ist, dass im letzten Fall kein neues Objekt erstellt wird.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.5.
{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileiOS WebKit
+ (Safari/Chrome/Firefox/etc)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/index.html b/files/de/web/javascript/reference/global_objects/object/index.html new file mode 100644 index 0000000000..55eb55035d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/index.html @@ -0,0 +1,186 @@ +--- +title: Object +slug: Web/JavaScript/Reference/Global_Objects/Object +tags: + - Constructor + - JavaScript + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object +--- +
{{JSRef}}
+ +

Zusammenfassung

+ +

Der Object-Konstruktor erstellt ein Objekt

+ +

Konstruktor

+ +
// Object Initialisierer / Literal
+{ [ NameWertPaar1 [, NameWertPaar2 [, ...NameWertPaarN] ] ] }
+
+// Konstruktor-Form
+new Object( [ Wert ] )
+ +

Parameter

+ +
+
NameWertPaar1, NameWertPaar2, ... NameWertPaarN
+
Paare von Namen (String) und Werten (eines beliebigen Typs) bei denen der Name durch ein Doppelpunkt vom Wert getrennt ist.
+
+ +
+
Wert
+
Ein Wert eines beliebigen Typs.
+
+ +

Beschreibung

+ +

Der Object Konstruktor erstellt ein Objekt für den übergebenen Wert. Wenn der Wert {{jsxref("null")}} oder {{jsxref("undefined")}} ist, wird ein leeres Object erstellt und zurückgegeben. Ansonsten wird ein Objekt des Typs erstellt, welcher dem übergebenen Wert entspricht. Sollte der Wert bereits ein vom Typ Object sein, wird dieses zurückgeggeben.

+ +

Wenn sie nicht als Konstruktor aufgerufen wird (d.h. ohne new), verhält sich die Funktion Object genau so wie new Object().

+ +

Siehe auch den Object Intialisierer / Literal Syntax.

+ +

Eigenschaften des Object Konstruktors

+ +
+
Object.length
+
Hat den Wert 1.
+
{{jsxref("Object.prototype")}}
+
Erlaubt es neue Eigenschaften zu allen Objekten des Typs Object hinzuzufügen.
+
+ +

Methoden des Object Konstruktors

+ +
+
{{jsxref("Object.assign()")}}
+
Kopiert die Werte aller eigenen, aufzählbaren Eigenschaften von einem oder mehreren Quellobjekten in ein Zielobjekt.
+
{{jsxref("Object.create()")}}
+
Erstellt ein neues Objekt mit dem angegebenen Protoyp-Objekt und optionalen Eigenschaften.
+
{{jsxref("Object.defineProperty()")}}
+
Fügt eine neue Eigenschaft einem bestimmten Objekt hinzu, welche durch Zusatzinformationen beschrieben wird.
+
{{jsxref("Object.defineProperties()")}}
+
Fügt mehrere Eigenschaften einem bestimmten Objekt hinzu, welche durch Zusatzinformationen beschrieben werden.
+
{{jsxref("Object.entries()")}}
+
Gibt ein Array zurück, welches alle eigenen, aufzählbaren String-Eigenschaften in der Form von [Name, Wert]-Paaren enthält.
+
{{jsxref("Object.freeze()")}}
+
Friert ein Objekt ein: Die Eigenschaften können nicht mehr geändert oder gelöscht werden.
+
{{jsxref("Object.fromEntries()")}}
+
Erstellt ein Objekt aus einer Liste von [Name, Wert]-Paaren (kehrt {{jsxref("Object.entries")}} um).
+
{{jsxref("Object.getOwnPropertyDescriptor()")}}
+
Gibt die Zusatzinformationen einer bestimmten eigenen Eigenschaft zurück.
+
{{jsxref("Object.getOwnPropertyDescriptors()")}}
+
Gibt ein Objekt zurück, welches die Zusatzinformationen aller eigenen Eigenschaften enthält.
+
{{jsxref("Object.getOwnPropertyNames()")}}
+
Gibt ein Array zurück, welches die Namen aller eigenen, aufzählbaren und nicht-aufzählbaren Eigenschaften enthält.
+
{{jsxref("Object.getOwnPropertySymbols()")}}
+
Gibt ein Array zurück, welches die Symbole aller eigenen Eigenschaften enthält.
+
{{jsxref("Object.getPrototypeOf()")}}
+
Gibt den Protoypen des angegebenen Objekts zurück.
+
{{jsxref("Object.is()")}}
+
Vergleicht ob zwei Werte den gleichen Wert haben.
+
{{jsxref("Object.isExtensible()")}}
+
Gibt an, ob ein Objekt erweitert werden kann (ob neue Eigenschaften angelegt werden können).
+
{{jsxref("Object.isFrozen()")}}
+
Gibt an, ob ein Objekt eingefroren ist.
+
{{jsxref("Object.isSealed()")}}
+
Gibt an, ob ein Objekt versiegelt ist.
+
{{jsxref("Object.keys()")}}
+
Gibt ein Array zurück, welches die Namen aller eigenen aufzählbaren String-Eigenschaften enthält.
+
{{jsxref("Object.preventExtensions()")}}
+
Verbietet das ein Objekt erweitert werden kann.
+
{{jsxref("Object.seal()")}}
+
Verbietet das Eigenschaften gelöscht werden können - versiegelt das Objekt.
+
{{jsxref("Object.setPrototypeOf()")}}
+
Legt den Prototyp fest (z.Bsp. die interne [[Prototype]] Eigenschaft)
+
{{jsxref("Object.values()")}}
+
Gibt ein Array zurück, welches die Werte aller eigenen aufzählbaren String-Eigenschaften enthält.
+
+ +

Object Instanzen und das Prototyp-Objekt

+ +

Alle Objekte in JavaScript stammen von Object ab; alle Objekte bekommen die Methoden und Eigenschaften vom {{jsxref("Object.prototype")}} vererbt, jedoch können sie überschrieben werden. Zum Beispiel können Prototypen andere Kontruktoren die constructor-Eigenschaft überschreiben oder aber ihre eigene toString() Methode implementieren. Änderungen am Object Prototypen wirken sich auch auf alle anderen Objekte aus, es sei denn die Eigenschaften oder Methoden sind entlang der Prototyp-Kette schon überschrieben worden.

+ +

Eigenschaften

+ +
{{ page('/de/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Attribute') }}
+ +

Methoden

+ +
{{ page('/de/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Methoden') }}
+ +

Eine Eigenschaft von einem Objekt löschen

+ +

Es gibt keine Methode von Object selbst, um eine Eigenschaft zu löschen (wie z.Bsp. Map.prototype.delete()). Um das zu erreichen, muss der delete Operator benutzt werden.

+ +

Beispiele

+ +

Object mit undefined und null Typen nutzen

+ +

Die folgenden Beispiele speichern ein leeres Object in o:

+ +
var o = new Object();
+
+ +
var o = new Object(undefined);
+
+ +
var o = new Object(null);
+
+ +

Object nutzen um  Boolean-Objekte zu erstellen

+ +

Die folgenden Beispiele speichern {{jsxref("Boolean")}}-Objekte in o:

+ +
// das gleiche wie: var o = new Boolean(true);
+var o = new Object(true);
+
+ +
// das gleiche wie: var o = new Boolean(false);
+var o = new Object(Boolean());
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
+ In JavaScript 1.0 implementiert
{{SpecName('ES5.1', '#sec-15.2', 'Object')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-object-objects', 'Object')}}{{Spec2('ES6')}} +

Object.assign, Object.getOwnPropertySymbols, Object.setPrototypeOf und Object.is hinzugefügt

+
{{SpecName('ESDraft', '#sec-object-objects', 'Object')}}{{Spec2('ESDraft')}}Object.entries, Object.values und Object.getOwnPropertyDescriptors hinzugefügt.
+ +

Browser-Kompatibilität

+ +

{{Compat("javascript.builtins.Object")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/is/index.html b/files/de/web/javascript/reference/global_objects/object/is/index.html new file mode 100644 index 0000000000..348dbeebe9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/is/index.html @@ -0,0 +1,120 @@ +--- +title: Object.is() +slug: Web/JavaScript/Reference/Global_Objects/Object/is +tags: + - ECMAScript 2015 + - Experimental + - Expérimental(2) + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/is +--- +
{{JSRef("Global_Objects", "Object")}}
+ +

Zusammenfassung

+ +

Die Object.is() Methode entscheidet, ob zwei Werte die gleichen Werte sind.

+ +

Syntax

+ +
var isSame = Object.is(value1, value2);
+ +

Parameter

+ +
+
value1
+
Der erste Wert zum vergleichen.
+
value2
+
Der zweite Wert zum vergleichen.
+
+ +

Beschreibung

+ +

Object.is() bestimmt, ob zwei Werte gleich sind. Dabei gelten zwei Werte genau dann als gleich, wenn eine der folgenden Bedingungen zutrifft:

+ + + +

Dies ist nicht das selbe wie der ==-Operator. Dieser verwendet verschiedene, situationsabhängige Typ-Umwandlungen auf beiden Seiten bevor auf Gleichheit getestet wird (was z.B. dazu führt, dass der Ausdruck "" == false zu true ausgewertet wird). Object.is hingegen wandelt keinen der beiden Werte um.

+ +

Es ist ebenfalls nicht das selbe wie der strikte ===-Operator. Dieser – ebenso wie der ==-Operator – behandelt zum Beispiel +0 und -0 als identisch während NaN und NaN als nicht identisch behandelt werden.

+ +

Beispiele

+ +
Object.is('foo', 'foo');     // true
+Object.is(window, window);   // true
+
+Object.is('foo', 'bar');     // false
+Object.is([], []);           // false
+
+var test = { a: 1 };
+Object.is(test, test);       // true
+
+Object.is(null, null);       // true
+
+// Special Cases
+Object.is(0, -0);            // false
+Object.is(-0, -0);           // true
+Object.is(NaN, 0/0);         // true
+
+ +

Polyfill

+ +

Object. ist eine vorgeschlagene Ergänzung des ECMA-262 Standard; als solcher könnte dieser nicht von allen Browser verstanden werden. Du kannst drum herum arbeiten, indem du den folgenden Code an den Anfang deines Scripts packst. Das erlaubt dir die Object.is Methode zu verwenden, auch wenn es keine eingebaute Unterstützung dafür gibt.

+ +
if (!Object.is) {
+  Object.is = function(x, y) {
+    // SameValue algorithm
+    if (x === y) { // Steps 1-5, 7-10
+      // Steps 6.b-6.e: +0 != -0
+      return x !== 0 || 1 / x === 1 / y;
+    } else {
+     // Step 6.a: NaN == NaN
+     return x !== x && y !== y;
+    }
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-object.is', 'Object.is')}}{{Spec2('ES2015')}}Initial definition.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Object.is")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/isextensible/index.html b/files/de/web/javascript/reference/global_objects/object/isextensible/index.html new file mode 100644 index 0000000000..a54bb5f6c4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/isextensible/index.html @@ -0,0 +1,153 @@ +--- +title: Object.isExtensible() +slug: Web/JavaScript/Reference/Global_Objects/Object/isExtensible +tags: + - ECMAScript 5 + - Erweiterbarkeit + - JavaScript + - Méthode + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isExtensible +--- +
{{JSRef}}
+ +

Die Methode Object.isExtensible() bestimmt, ob ein Objekt erweiterbar ist. Das heißt, es können dem Objekt neue Eigenschaften hinzugefügt werden.

+ +

Syntax

+ +
Object.isExtensible(obj)
+ +

Parameter

+ +
+
obj
+
Das Objekt, das überprüft werden soll.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}}, der angibt, ob das übergebene Objekt erweiterbar ist.

+ +

Beschreibung

+ +

Standardmäßig sind Objekte erweiterbar: Es ist möglich, ihnen neue Eigenschaften zuzuweisen und sie dadurch zu verändern. In Engines, die {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}} unterstützen, kann auch deren __proto__ Eigenschaft geändert werden. Ein Objekt kann mittels {{jsxref("Object.preventExtensions()")}}, {{jsxref("Object.seal()")}} oder {{jsxref("Object.freeze()")}} explizit als nicht-erweiterbar markiert werden.

+ +

Beispiele

+ +
// Neue Objekte sind erweiterbar.
+var empty = {};
+Object.isExtensible(empty); // === true
+
+// ...aber das kann sich ändern.
+Object.preventExtensions(empty);
+Object.isExtensible(empty); // === false
+
+// Versiegelte Objekte sind per Definition nicht erweiterbar.
+var sealed = Object.seal({});
+Object.isExtensible(sealed); // === false
+
+// Eingefrorene Objekte sind ebenfalls per Definition nicht erweiterbar.
+var frozen = Object.freeze({});
+Object.isExtensible(frozen); // === false
+
+ +

Anmerkungen

+ +

In ES5 muss das Argument der Methode ein echtes Objekt sein. Ist dies nicht der Fall, wird ein {{jsxref("TypeError")}} geworfen. In ES2015 hingegen wird ein Nicht-Objekt einfach als nicht-erweiterbares Objekt behandelt, sodass von der Methode false zurückgegeben wird.

+ +
Object.isExtensible(1);
+// TypeError: 1 is not an object (ES5 code)
+
+Object.isExtensible(1);
+// false                         (ES2015 code)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.2.3.13', 'Object.isExtensible')}}{{Spec2('ES5.1')}}Initial definition. Implemented in JavaScript 1.8.5.
{{SpecName('ES6', '#sec-object.isextensible', 'Object.isExtensible')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.isextensible', 'Object.isExtensible')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("6")}}{{CompatGeckoDesktop("2.0")}}{{CompatIE("9")}}{{CompatOpera("12")}}{{CompatSafari("5.1")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Zusätzliches Material

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/isfrozen/index.html b/files/de/web/javascript/reference/global_objects/object/isfrozen/index.html new file mode 100644 index 0000000000..fedcba2572 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/isfrozen/index.html @@ -0,0 +1,173 @@ +--- +title: Object.isFrozen() +slug: Web/JavaScript/Reference/Global_Objects/Object/isFrozen +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isFrozen +--- +
{{JSRef}}
+ +

Object.isFrozen() gibt an ob ein Objekt {{jsxref("Object.freeze()", "eingefroren", "", 1)}} ist.

+ +
{{EmbedInteractiveExample("pages/js/object-isfrozen.html")}}
+ + + +

Syntax

+ +
Object.isFrozen(obj)
+ +

Parameter

+ +
+
obj
+
Das Objekt, welches überprüft werden soll.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Boolean")}}-Wert, der angibt ob das Objekt eingefroren ist oder nicht.

+ +

Beschreibung

+ +

Ein Objekt gilt dann und nur dann als eingefroren, wenn es nicht {{jsxref("Object.isExtensible()", "erweiterbar", "", 1)}} ist, all seine Eigenschaften nicht konfigurierbar sind und all seine Daten-Eigenschaften (d.h. Eigenschaften die nicht durch Getter oder Setter definiert sind) nicht schreibbar sind.

+ +

Beispiele

+ +
// Ein neues Objekt ist erweiterbar, also nicht eingefroren.
+Object.isFrozen({}); // === false
+
+// An leeres Objekt, das nicht erweiterbar ist,
+// ist sinnlos eingefroren.
+var sinnlos = Object.preventExtensions({});
+Object.isFrozen(sinnlos); // === true
+
+// Ein neues Objekt mit einer einzelnen Eigenschaft, ist auch erweiterbar,
+// ergo nicht eingefroren.
+var eineEigenschaft = { p: 42 };
+Object.isFrozen(eineEigenschaft); // === false
+
+// Das Objekt nicht erweiterbar zu machen, friert es nicht ein,
+// da die Eigenschaft immer nocht konfigurierbar und schreibbar ist.
+Object.preventExtensions(eineEigenschaft);
+Object.isFrozen(eineEigenschaft); // === false
+
+// ...wenn man die Eigenschaft aber löscht,
+// wird das Objekt sinnlos
+delete eineEigenschaft.p;
+Object.isFrozen(eineEigenschaft); // === true
+
+// Ein nicht erweiterbares Objekt, mit einer nicht schreibbaren
+// jedoch konifgurierbaren Eigenschaft gilt als nicht eingefroren.
+var nichtSchreibbar = { e: 'plep' };
+Object.preventExtensions(nichtSchreibbar);
+Object.defineProperty(nichtSchreibbar, 'e', {
+  writable: false
+}); // `e` wird nicht schreibbar
+Object.isFrozen(nichtSchreibbar); // === false
+
+// Wird diese Eigenschaft nicht konfigurierbar,
+// so friert das Objekt ein.
+Object.defineProperty(nichtSchreibbar, 'e', {
+  configurable: false
+}); // `e` wird nicht konfigurierbar
+Object.isFrozen(nichtSchreibbar); // === true
+
+// Ein nicht erweiterbares Objekt, mit einer nicht konfigurierbaren
+// jedoch schreibbaren Eigenschaft gilt ebenfalls als nicht eingefroren.
+var nichtKonfigurierbar = { release: 'the kraken!' };
+Object.preventExtensions(nichtKonfigurierbar);
+Object.defineProperty(nichtKonfigurierbar, 'release', {
+  configurable: false
+});
+Object.isFrozen(nichtKonfigurierbar); // === false
+
+// Wird diese Eigenschaft nicht schreibbar,
+// so friert das Objekt ein.
+Object.defineProperty(nichtKonfigurierbar, 'release', {
+  writable: false
+});
+Object.isFrozen(nichtKonfigurierbar); // === true
+
+// Ein nicht erweiterbares Objekt, mit einer konfigurierbaren
+// dynamischen Eigenschaft (get/set) ist nicht eingefroren.
+var dynamisch = { get food() { return 'yum'; } };
+Object.preventExtensions(dynamisch);
+Object.isFrozen(dynamisch); // === false
+
+// ABER, wird diese Eigenschaft nicht konfigurierbar,
+// friert das Objekt ein.
+Object.defineProperty(dynamisch, 'food', {
+  configurable: false
+});
+Object.isFrozen(dynamisch); // === true
+
+// Am Ende ist die einfachste Methode um ein Objekt einzufrieren,
+// Object.freeze aufzurufen.
+var eingefroren = { 1: 81 };
+Object.isFrozen(eingefroren); // === false
+Object.freeze(eingefroren);
+Object.isFrozen(eingefroren); // === true
+
+// Per Definition ist ein eingefrorenes Objekt nicht erweiterbar.
+Object.isExtensible(eingefroren); // === false
+
+// Und es ist ebenfalls versiegelt.
+Object.isSealed(eingefroren); // === true
+
+ +

Anmerkungen

+ +

In ES5, wirft die Methode einen {{jsxref("TypeError")}}, wenn der Parameter kein primitives Objekt ist.

+ +

In ES2015 wird der Parameter, sollte er kein primitives Objekt sein, als bereits eingefrorenes Objekt betrachtet und gibt dementsprechend einfach true zurück.

+ +
Object.isFrozen(1);
+// TypeError: 1 is not an object (ES5 code)
+
+Object.isFrozen(1);
+// true                          (ES2015 code)
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.2.3.12', 'Object.isFrozen')}}{{Spec2('ES5.1')}}Initiale Definition. In JavaScript 1.8.5 implementiert.
{{SpecName('ES6', '#sec-object.isfrozen', 'Object.isFrozen')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-object.isfrozen', 'Object.isFrozen')}}{{Spec2('ESDraft')}}
+ +

Browser Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Object.isFrozen")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/keys/index.html b/files/de/web/javascript/reference/global_objects/object/keys/index.html new file mode 100644 index 0000000000..5fda29ca15 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/keys/index.html @@ -0,0 +1,206 @@ +--- +title: Object.keys() +slug: Web/JavaScript/Reference/Global_Objects/Object/keys +tags: + - ECMAScript5 + - JavaScript + - JavaScript 1.8.5 + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/keys +--- +
{{JSRef}}
+ +

Die Object.keys() Funktion gibt ein Array zurück, das die eigenen aufzählbaren Eigenschaften des Objektes in der selben Reihenfolge enthält wie in der {{jsxref("Statements/for...in", "for...in")}} Schleife (der Unterschied zwischen diesen beiden Varianten besteht darin, dass eine for-in Schleife auch die aufzählbaren Eigenschaften der Prototypen beinhaltet).

+ +

Syntax

+ +
Object.keys(obj)
+ +

Parameter

+ +
+
obj
+
ein Objekt, dessen aufzählbare eigene Eigenschaften zurückgegeben werden sollen
+
+ +

Rückgabewert

+ +

Ein Array mit Strings, die alle aufzählbare Eigenschaften des gegebenen Objektes repräsentieren.

+ +

Beschreibung

+ +

Object.keys() liefert ein Array, dessen Elemente Strings sind, welche die aufzählbaren Eigenschaften des Objekts respräsentieren. Die Reihenfolge der Eigenschaften ist die selbe wie bei einer for-in Schleife über das Objekt.

+ +

Beispiele

+ +
var arr = ['a', 'b', 'c'];
+console.log(Object.keys(arr)); // console: ['0', '1', '2']
+
+// array like object
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.keys(obj)); // console: ['0', '1', '2']
+
+// array like object with random key ordering
+var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.keys(an_obj)); // console: ['2', '7', '100']
+
+// getFoo is property which isn't enumerable
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
+my_obj.foo = 1;
+
+console.log(Object.keys(my_obj)); // console: ['foo']
+ +

Die Liste aller eigenen aufzählbaren und nicht-aufzählbaren Eigenschaften eines Objekt erhält man mit der Funktion {{jsxref("Object.getOwnPropertyNames()")}}.

+ +

Notizen

+ +

In ES5 wird, wenn das Argument für die Funktion kein Objekt ist, ein {{jsxref("TypeError")}} Fehler geworfen. In ES2015 wird das Argument, welches kein Objekt ist, in ein Objekt umgewandelt, das aber nicht mehr dem eigentlichen Wert entspricht (siehe Beispiel).

+ +
> Object.keys("foo")
+TypeError: "foo" is not an object // ES5 code
+
+> Object.keys("foo")
+["0", "1", "2"]                   // ES2015 code
+
+ +

Polyfill

+ +

Kopieren Sie das folgende Code-Schnipsel, um Object.keys() auch in älteren Umgebungen ohne native Unterstützung nutzen zu können:

+ +
// From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
+if (!Object.keys) {
+  Object.keys = (function() {
+    'use strict';
+    var hasOwnProperty = Object.prototype.hasOwnProperty,
+        hasDontEnumBug = !({ toString: null }).propertyIsEnumerable('toString'),
+        dontEnums = [
+          'toString',
+          'toLocaleString',
+          'valueOf',
+          'hasOwnProperty',
+          'isPrototypeOf',
+          'propertyIsEnumerable',
+          'constructor'
+        ],
+        dontEnumsLength = dontEnums.length;
+
+    return function(obj) {
+      if (typeof obj !== 'function' && (typeof obj !== 'object' || obj === null)) {
+        throw new TypeError('Object.keys called on non-object');
+      }
+
+      var result = [], prop, i;
+
+      for (prop in obj) {
+        if (hasOwnProperty.call(obj, prop)) {
+          result.push(prop);
+        }
+      }
+
+      if (hasDontEnumBug) {
+        for (i = 0; i < dontEnumsLength; i++) {
+          if (hasOwnProperty.call(obj, dontEnums[i])) {
+            result.push(dontEnums[i]);
+          }
+        }
+      }
+      return result;
+    };
+  }());
+}
+
+ +

Bitte beachten Sie, dass der obenstehende Code auch die Namen der nicht-aufzählbaren Eigenschaften im IE7 (und evtl. auch im IE8) berücksichtigt, wenn ein Objekt aus einem anderen Fenster übergeben wird.

+ +

Ein einfaches Polyfill finden Sie außerdem hier: Javascript - Object.keys Browser Compatibility.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommantar
{{SpecName('ES5.1', '#sec-15.2.3.14', 'Object.keys')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.5.
{{SpecName('ES2015', '#sec-object.keys', 'Object.keys')}}{{Spec2('ES2015')}} 
{{SpecName('ESDraft', '#sec-object.keys', 'Object.keys')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundlegende Unterstützung{{CompatChrome("5")}}{{CompatGeckoDesktop("2.0")}}{{CompatIE("9")}}{{CompatOpera("12")}}{{CompatSafari("5")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Grundlegende Unterstützung{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/observe/index.html b/files/de/web/javascript/reference/global_objects/object/observe/index.html new file mode 100644 index 0000000000..df68348028 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/observe/index.html @@ -0,0 +1,199 @@ +--- +title: Object.observe() +slug: Web/JavaScript/Reference/Global_Objects/Object/observe +tags: + - Beobachter + - Data-Binding + - Deprecated + - JavaScript + - Méthode + - Object + - Veraltet +translation_of: Archive/Web/JavaScript/Object.observe +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Object.observe() Methode kann genutzt werden, um auf Änderungen an einem Objekt asynchron zu reagieren. Sie bietet einen Stream der Änderungen in der Reihenfolge ihres Auftretens. Da die Methode veraltet ist und Beschränkungen aufweist, sollte lieber ein {{jsxref("Proxy")}} Objekt verwendet werden.

+ +

Syntax

+ +
Object.observe(obj, callback[, acceptList])
+ +

Parameter

+ +
+
obj
+
Das Objekt, das beobachtet werden soll.
+
callback
+
Eine Callback-Funktion, die jedes mal aufgerufen wird, wenn eine Änderung am Objekt vorgenommen wird +
+
changes
+
Ein Array von Objekten, die die vorgenommenen Änderungen repräsentieren. Die Eigenschaften der Objekte sind jeweils +
    +
  • name: Der Name der Eigenschaft, welche geändert wurde
  • +
  • object: Das (bereits) geänderte Objekt.
  • +
  • type: Ein String der Angibt, welcher Art die vorgenommene Änderung war. Entspricht "add", "update", oder "delete".
  • +
  • oldValue: Existiert nur, wenn der type "update" oder "delete" ist. Der ursprüngliche Wert vor der Änderung.
  • +
+
+
+
+
acceptList
+
Eine Liste von Änderungstypen die für das gegebene Objekt und jeweilige Callback beobachtet werden sollen. Standardmäßig ["add", "update", "delete", "reconfigure", "setPrototype", "preventExtensions"] .
+
+ +

Beschreibung

+ +

callback wird jedes mal aufgerufen, wenn das obj geändert wird. Die Funktion erhält dabei die Liste aller Änderungen in chronologischer Reihenfolge ihres Auftretens.

+ +

Beispiele

+ +

Ausgabe aller sechs Änderungsarten

+ +
var obj = {
+  foo: 0,
+  bar: 1
+};
+
+Object.observe(obj, function(changes) {
+  console.log(changes);
+});
+
+obj.baz = 2;
+// [{name: 'baz', object: <obj>, type: 'add'}]
+
+obj.foo = 'hello';
+// [{name: 'foo', object: <obj>, type: 'update', oldValue: 0}]
+
+delete obj.baz;
+// [{name: 'baz', object: <obj>, type: 'delete', oldValue: 2}]
+
+Object.defineProperty(obj, 'foo', {writable: false});
+// [{name: 'foo', object: <obj>, type: 'reconfigure'}]
+
+Object.setPrototypeOf(obj, {});
+// [{name: '__proto__', object: <obj>, type: 'setPrototype', oldValue: <prototype>}]
+
+Object.seal(obj);
+// [
+//   {name: 'foo', object: <obj>, type: 'reconfigure'},
+//   {name: 'bar', object: <obj>, type: 'reconfigure'},
+//   {object: <obj>, type: 'preventExtensions'}
+// ]
+
+ +

Data Binding

+ +
// A user model
+var user = {
+  id: 0,
+  name: 'Brendan Eich',
+  title: 'Mr.'
+};
+
+// Create a greeting for the user
+function updateGreeting() {
+  user.greeting = 'Hello, ' + user.title + ' ' + user.name + '!';
+}
+updateGreeting();
+
+Object.observe(user, function(changes) {
+  changes.forEach(function(change) {
+    // Any time name or title change, update the greeting
+    if (change.name === 'name' || change.name === 'title') {
+      updateGreeting();
+    }
+  });
+});
+
+ +

Eigens definierter Änderungstyp

+ +
// A point on a 2D plane
+var point = {x: 0, y: 0, distance: 0};
+
+function setPosition(pt, x, y) {
+  // Performing a custom change
+  Object.getNotifier(pt).performChange('reposition', function() {
+    var oldDistance = pt.distance;
+    pt.x = x;
+    pt.y = y;
+    pt.distance = Math.sqrt(x * x + y * y);
+    return {oldDistance: oldDistance};
+  });
+}
+
+Object.observe(point, function(changes) {
+  console.log('Distance change: ' + (point.distance - changes[0].oldDistance));
+}, ['reposition']);
+
+setPosition(point, 3, 4);
+// Distance change: 5
+
+ +

Spezifikationen

+ +

Strawman proposal for ECMAScript 7.

+ +

Browserunterstützung

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome("36")}}{{CompatNo}} [1]{{CompatNo}} [2]{{CompatOpera("23")}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatChrome("36")}}{{CompatNo}} [1]{{CompatNo}} [2]{{CompatOpera("23")}}{{CompatNo}}
+
+ +

[1]: See {{bug(800355)}}

+ +

[2]: See relevant MS Edge platform status entry

+ +

Siehe Auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/proto/index.html b/files/de/web/javascript/reference/global_objects/object/proto/index.html new file mode 100644 index 0000000000..6c085634e7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/proto/index.html @@ -0,0 +1,196 @@ +--- +title: Object.prototype.__proto__ +slug: Web/JavaScript/Reference/Global_Objects/Object/proto +translation_of: Web/JavaScript/Reference/Global_Objects/Object/proto +--- +
+

Achtung: Das Ändern des [[Prototype]] von einem Objekt, in der Art wie moderne JavaScript Engines den Zugriff auf Eigenschaften optimieren, ist eine sehr langsame Operation - in jedem Browser und JavaScript-Engine. Die Auswirkungen auf die Perfomance der veränderten Vererbung sind subtil und weit verstreut und sind nicht einfach auf die Zeit des Zugriffs von obj.__proto__ = ... Ausdruck limitiert, sondern können sich auf jeden Code erstrecken, der Zugriff auf ein Objekt hat, dessen [[Prototype]] geändert wurde. Wenn du dir um die Perfomance sorgen machst, dann solltest du das Setzen des [[Prototype]] auf ein Objekt vermeiden. Stattdessen kannst du ein neues Objekt mit dem gewünschten [[Prototype]] mit {{jsxref("Object.create()")}} erstellen.

+
+ +
+

Achtung: Während Object.prototype.__proto__ von den meisten Browsern unterstützt wird, ist seine Existenz und exaktes Verhalten nur in der ECMAScript 2015 Spezifikation als Vermächtnis-Funktion standardisiert, um die Kompatibilität für Web-Browser zu gewährleisten. Für bessere Unterstützung wird stattdessen empfohlen {{jsxref("Object.getPrototypeOf()")}} zu nutzen.

+
+ +
{{JSRef}}
+ +

Die __proto__ Eigenschaft von {{jsxref("Object.prototype")}} ist eine Zugriffs-Eigenschaft (ein Erhalten- und Setzen-Funktion), welche den internen [[Prototype]] (entweder ein Objekt oder {{jsxref("Global_Objects/null", "null")}}) des Objektes, auf das zugegriffen wird, freilegt.

+ +

Die Nutzung von __proto__ ist umstritten und wird nicht mehr empfohlen. Es war niemals ein Originalteil in der EcmaScript Sprach-Spezifikation, doch haben moderne Browser entschieden es trotzdem zu implementieren. Erst vor kurzem wurde die __proto__ Eigenschaft als Standard in die ECMAScript 2015 Sprach-Spezifikation aufgenommen, um die Kompatibiliät von modernen Web-Browsern sicherzustellen, sodass es in der Zukunft unterstützt wird. Es ist veraltet zu Gunsten von {{jsxref("Object.getPrototypeOf")}}/{{jsxref("Reflect.getPrototypeOf")}} und {{jsxref("Object.setPrototypeOf")}}/{{jsxref("Reflect.setPrototypeOf")}} (obgleich das Setzen des [[Prototype]] eines Objektes immer noch eine langsame Operation ist und daher vermieden werden sollte, wenn Performance eine Rolle spielt).

+ +

Die __proto__ Eigenschaft kann auch in einer Objekt-Literal-Definition verwendet werden, um das Objekt [[Prototyp]] bei der Erstellen zu setzen - als Alternative zu {{jsxref("Object.create()")}}. See: object initializer / literal syntax.

+ +

Syntax

+ +
var Circle = function () {};
+var shape = {};
+var circle = new Circle();
+
+// Setzt den Objekt Prototypen.
+// DEPRECATED. Dies ist nur eine beispielhafte Verwendung und sollte NICHT in produktivem Code verwendet werden.
+shape.__proto__ = circle;
+
+// Liefert den Objekt Prototypen zurück
+console.log(shape.__proto__ === circle); // true
+
+ +
var shape = function () {
+};
+var p = {
+    a: function () {
+        console.log('aaa');
+    }
+};
+shape.prototype.__proto__ = p;
+
+var circle = new shape();
+
+circle.a();//aaa
+
+console.log(shape.prototype === circle.__proto__);//true
+
+//oder
+
+var shape = function () {
+};
+var p = {
+    a: function () {
+        console.log('a');
+    }
+};
+
+var circle = new shape();
+circle.__proto__ = p;
+
+
+circle.a(); //  a
+
+console.log(shape.prototype === circle.__proto__);//false
+
+//oder
+
+function test() {
+}
+test.prototype.myname = function () {
+    console.log('myname');
+
+}
+var a = new test()
+
+console.log(a.__proto__ === test.prototype);//true
+
+a.myname();//myname
+
+
+//oder
+
+var fn = function () {
+};
+fn.prototype.myname = function () {
+    console.log('myname');
+}
+
+var obj = {
+    __proto__: fn.prototype
+};
+
+
+obj.myname();//myname
+
+ +

Anmerkung: das sind zwei Unterstriche, gefolgt von den fünf Zeichen "Proto", gefolgt von zwei weiteren Unterstrichen.

+ +

Beschreibung

+ +

The __proto__ getter function exposes the value of the internal [[Prototype]] of an object. For objects created using an object literal, this value is {{jsxref("Object.prototype")}}. For objects created using array literals, this value is {{jsxref("Array.prototype")}}. For functions, this value is {{jsxref("Function.prototype")}}. For objects created using new fun, where fun is one of the built-in constructor functions provided by JavaScript ({{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("String")}}, and so on — including new constructors added as JavaScript evolves), this value is always fun.prototype. For objects created using new fun, where fun is a function defined in a script, this value is the value of fun.prototype. (That is, if the constructor didn't return an other object explicitly, or the fun.prototype has been reassigned since the instance was created).

+ +

The __proto__ setter allows the [[Prototype]] of an object to be mutated. The object must be extensible according to {{jsxref("Object.isExtensible()")}}: if it is not, a {{jsxref("Global_Objects/TypeError", "TypeError")}} is thrown. The value provided must be an object or {{jsxref("Global_Objects/null", "null")}}. Providing any other value will do nothing.

+ +

To understand how prototypes are used for inheritance, see guide article Inheritance and the prototype chain.

+ +

The __proto__ property is a simple accessor property on {{jsxref("Object.prototype")}} consisting of a getter and setter function. A property access for __proto__ that eventually consults {{jsxref("Object.prototype")}} will find this property, but an access that does not consult {{jsxref("Object.prototype")}} will not find it. If some other __proto__ property is found before {{jsxref("Object.prototype")}} is consulted, that property will hide the one found on {{jsxref("Object.prototype")}}.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}{{Spec2('ES2015')}}Included in the (normative) annex for additional ECMAScript legacy features for Web browsers (note that the specification codifies what is already in implementations).
{{SpecName('ESDraft', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basis Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatIE("11")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basis Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Kompatibiliäts Notizen

+ +

Während die ECMAScript 2015-Spezifikation vorschreibt, dass die Unterstützung für __proto__ nur für Webbrowser erforderlich ist (obwohl sie bestimmend sind), können andere Umgebungen sie auch für den Gebrauch von Benutzern unterstützen

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/prototype/index.html b/files/de/web/javascript/reference/global_objects/object/prototype/index.html new file mode 100644 index 0000000000..71a504f6dd --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/prototype/index.html @@ -0,0 +1,219 @@ +--- +title: Object.prototype +slug: Web/JavaScript/Reference/Global_Objects/Object/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object +--- +
{{JSRef}}
+ +

Das Object.prototype Attribut repräsentiert das Prototype Objekt von {{jsxref("Object")}}.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle Objekte in JavaScript stammen von {{jsxref("Object")}}; alle Objekte erben Methoden und Attribute von Object.prototype, wobei diese  überschrieben werden können (mit Ausnahme von Objekten mit einem null-Prototyp, sprich Object.create(null)). Die Prototypen anderer Konstruktoren zum Beispiel, überschreiben das constructor Attribut und stellen ihre eigenen Methoden zur Verfügung {{jsxref("Object.prototype.toString()", "toString()")}}. Änderungen am  Object prototype Objekt werden an alle Objekte weitergeleitet, solange die betroffenen Attribute und Methoden nicht zuvor in der Kette der Prototypen überschrieben wurden.

+ +

Attribute

+ +
+
{{jsxref("Object.prototype.constructor")}}
+
Die Funktion, die den Prototypen eines Objekts erstellt.
+
{{jsxref("Object.prototype.__proto__")}} {{non-standard_inline}}
+
Zeigt auf das Objekt, das als bei der Initialisierung des Objektes als Prototyp diente.
+
{{jsxref("Object.prototype.__noSuchMethod__")}} {{non-standard_inline}}
+
Erlaubt das Erstellen einer Funktion, die dann ausgeführt wird, wenn ein undefiniertes Objekt als Methode aufgerufen wird.
+
{{jsxref("Object.prototype.count","Object.prototype.__count__")}} {{obsolete_inline}}
+
Wurde benutzt um die Anzahl der aufzählbaren Attribute direkt durch das Objekt zurückzugeben; mittlerweile entfernt.
+
{{jsxref("Object.prototype.parent","Object.prototype.__parent__")}} {{obsolete_inline}}
+
Wurde benutzt um auf den Kontext eines Objektes zu verweisen; mittlerweile entfernt.
+
+ +

Methoden

+ +
+
{{jsxref("Object.prototype.__defineGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Verknüpft eine Funktion mit einem Attribut, das, wenn darauf zugegriffen wird eine Funktion ausführt und deren Rückgabewert zurück gibt.
+
{{jsxref("Object.prototype.__defineSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Verknüpft eine Funktion mit einem Attribut, das, wenn dieses gesetzt werden soll, eine Funktion ausführt, die das Attribut modifiziert.
+
{{jsxref("Object.prototype.__lookupGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Gibt die Funktion zurück, die mit dem spezifizierten Attribut über die Methode {{jsxref("Object.prototype.__defineGetter__()", "__defineGetter__()")}} verknüpft ist.
+
{{jsxref("Object.prototype.__lookupSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}
+
Gibt die Funktion zurück, die mit dem spezifizierten Attribut über die Methode {{jsxref("Object.prototype.__defineSetter__()", "__defineSetter__()")}} verknüpft ist.
+
{{jsxref("Object.prototype.hasOwnProperty()")}}
+
Gibt einen Boolean Wert zurück, der anzeigt, ob ein Attribut ein direktes Attribut dieses Objekts ist, oder über Vererbung durch einen Prototypen hinzugefügt wurde.
+
{{jsxref("Object.prototype.isPrototypeOf()")}}
+
Gibt einen Boolean Wert zurück, der anzeigt, ob das spezifizierte Objekt in der Prototyp-Kette des Objekts, das diese Funktion aufruft, enthalten ist.
+
{{jsxref("Object.prototype.propertyIsEnumerable()")}}
+
Gibt einen Boolean Wert zurück, der anzeigt, ob das interne ECMAScript [[Enumerable]] attribute gesetzt ist.
+
{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}
+
Liefert einen String zurück, der die Quelle eines Objekt-Literals enthält, und das Objekt darstellt, das diese Funktion aufruft; man kann diesen Wert benutzen, um ein neues Objekt zu erstellen.
+
{{jsxref("Object.prototype.toLocaleString()")}}
+
Ruft {{jsxref("Object.toString", "toString()")}} auf.
+
{{jsxref("Object.prototype.toString()")}}
+
Gibt eine String-Darstellung des Objekts zurück.
+
{{jsxref("Object.prototype.unwatch()")}} {{non-standard_inline}}
+
Entfernt einen Kontrollpunkt von einem Attribut des Objekts.
+
{{jsxref("Object.prototype.valueOf()")}}
+
Gibt den primitiven Wert des spezifizierten Objekts zurück.
+
{{jsxref("Object.prototype.watch()")}} {{non-standard_inline}}
+
Fügt einem Attribut des Objekts einen Kontrollpunkt hinzu.
+
{{jsxref("Object.prototype.eval()")}} {{obsolete_inline}}
+
Wurde genutzt, um einen String bestehend aus JavaScript Code, im Kontext des aktuellen Objekts auszuwerten; wurde entfernt;
+
+ +

Beispiele

+ +

Weil JavaScript keine klassischen Sub-Klassen-Funktionalität hat, sind Prototypen ein guter Weg, um "Base Class" Objekte mit bestimmten Funktionen zu erstellen, die als Objekte fungieren. Zum Beispiel:

+ +
var Person = function() {
+  this.canTalk = true;
+};
+
+Person.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name);
+  }
+};
+
+var Employee = function(name, title) {
+  Person.call(this);
+  this.name = name;
+  this.title = title;
+};
+
+Employee.prototype = Object.create(Person.prototype);
+Employee.prototype.constructor = Employee;
+
+Employee.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name + ', the ' + this.title);
+  }
+};
+
+var Customer = function(name) {
+  Person.call(this);
+  this.name = name;
+};
+
+Customer.prototype = Object.create(Person.prototype);
+Customer.prototype.constructor = Customer;
+
+var Mime = function(name) {
+  Person.call(this);
+  this.name = name;
+  this.canTalk = false;
+};
+
+Mime.prototype = Object.create(Person.prototype);
+Mime.prototype.constructor = Mime;
+
+var bob = new Employee('Bob', 'Builder');
+var joe = new Customer('Joe');
+var rg = new Employee('Red Green', 'Handyman');
+var mike = new Customer('Mike');
+var mime = new Mime('Mime');
+
+bob.greet();
+// Hi, I am Bob, the Builder
+
+joe.greet();
+// Hi, I am Joe
+
+rg.greet();
+// Hi, I am Red Green, the Handyman
+
+mike.greet();
+// Hi, I am Mike
+
+mime.greet();
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.prototype', 'Object.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/tosource/index.html b/files/de/web/javascript/reference/global_objects/object/tosource/index.html new file mode 100644 index 0000000000..d7c7bcf93a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/tosource/index.html @@ -0,0 +1,169 @@ +--- +title: Object.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Object/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Object/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode liefert einen String der den Quellcode des Objekts representiert.

+ +
Object.toSource();
+obj.toSource();
+
+ +

Zurückgelieferter Wert

+ +

Ein String der den Quellcode des Objekts representiert.

+ +

Beschreibung

+ +

Die toSource() Methode liefer die folgenden Werte:

+ +

Für das eingebaute {{jsxref("Object")}} Objekt, liefert toSource() den folgenden String, welcher angibt, dass der Quellcode nicht verfügbar ist.

+ + + +

toSource() kann während der Entwicklung aufgerufen werden um die Inhalte eines Objekts zu inspizieren.

+ +

Überschreiben der toSource() Methode

+ +

Es ist sicher die toSource() Methode zu überschreiben. Zum Beispiel:

+ +
function Person(name) {
+  this.name = name;
+}
+
+Person.prototype.toSource = function Person_toSource() {
+  return 'new Person(' + uneval(this.name) + ')';
+};
+
+console.log(new Person('Joe').toSource()); // ---> new Person("Joe")
+
+ +

Eingebaute toSource() Methoden

+ +

Jeder Kern-JavaScript Typ hat seine eigene toSource() Methode. Diese sind:

+ + + +

Limits bei zyklischen Objekten

+ +

Im Falle, dass Objekte auf sich selbst referenzieren, z.B.: eine zyklisch verbundene Liste oder ein Baum der beide wege durchquert, erstellt toSource() nicht eine neue Selbst-Referenz. Dies passiert seit Firefox 24. Zum Beispiel:

+ +
var obj1 = {};
+var obj2 = { a: obj1 };
+obj1.b = obj2;
+
+console.log('Cyclical: ' + (obj1.b.a == obj1));
+
+var objSource = obj1.toSource(); // returns "({b:{a:{}}})"
+
+obj1 = eval(objSource);
+
+console.log('Cyclical: ' + (obj1.b.a == obj1));
+
+ +

Wenn eine zyklische Struktur existiert und toSource() benötigt wird, muss das Objekt eine überschriebene toSource() Methode besitzen. Entweder durch benützen einer Referenz zum Construktor oder einer anonymen Funktion.

+ +

Beispiele

+ +

Benutzen von toSource()

+ +

Der folgende Code defniert den "Dog" Objekt Typ und kreiert "theDog", welches ein Objekt des Typs "Dog" ist:

+ +
function Dog(name, breed, color, sex) {
+  this.name = name;
+  this.breed = breed;
+  this.color = color;
+  this.sex = sex;
+}
+
+theDog = new Dog('Gabby', 'Lab', 'chocolate', 'female');
+
+ +

Durch aufrufen der toSource() Methode von "theDog" liefert die JavaScript Quelle, welche das Objekt definiert.

+ +
theDog.toSource();
+// returns ({name:"Gabby", breed:"Lab", color:"chocolate", sex:"female"})
+
+ +

Spezifikationen

+ +

Kein Teil eines Standards. Implementiert seit JavaScript 1.3.

+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatNo}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/valueof/index.html b/files/de/web/javascript/reference/global_objects/object/valueof/index.html new file mode 100644 index 0000000000..1b3d561756 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/valueof/index.html @@ -0,0 +1,115 @@ +--- +title: Object.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/valueOf +tags: + - JavaScript + - Method + - Object + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/valueOf +--- +
{{JSRef}}
+ +

Die valueOf() Methode liefert den primitiven Wert des spezifizierten Objekts zurück.

+ +
{{EmbedInteractiveExample("pages/js/object-prototype-valueof.html")}}
+ + + +

Syntax

+ +
object.valueOf()
+ +

Rückgabewert

+ +

Der primitive Wert des spezifizierten Objekts.

+ +

Beschreibung

+ +

JavaScript ruft die valueOf Methode auf, um das Objekt zu einem primitiven Wert zu konvertieren. Nur in seltenen Fällen ist es nötig, selbst die valueOf Methode aufzurufen; JavaScript tut dies automatisch dann, wenn es ein Objekt vorfindet und ein primitiver Wert erforderlich ist.

+ +

Standardmäßig erbt jedes Objekt die valueOf Methode von {{jsxref("Object")}}. Jedes built-in core object überschreibt zudem diese Methode, um jeweils den geeigneten Wert zu liefern. Falls ein Objekt keinen primitiven Wert haben sollte, liefert valueOf das Objekt selbst zurück.

+ +

Die Methode valueOf kann in eigenem Code verwendet werden, um etwa ein built-in object in seinen primitiven Wert zu wandeln. Bei der Implementierung eines eigenen Objekttyps sollte die Methode Object.prototype.valueOf() entsprechend überschrieben werden, anstelle der standardmäßig durch {{jsxref("Object")}} bereitgestellten Methode.

+ +

Überschreiben von valueOf für eigene Objekttypen

+ +

Es ist möglich eine function zu implementieren, welche anstelle der standardmäßig bereit gestellten valueOf Methode aufgerufen wird. Diese empfängt und benötigt keine Argumente.

+ +

Angenommen, in einem Projekt gibt es den Objekttyp MyNumberType und für diesen soll nun eine passende valueOf Methode implementiert werden. Der folgende Code zeigt wie mit einer function die valueOf Methode des Typs implementiert wird:

+ +
MyNumberType.prototype.valueOf = function() { return customPrimitiveValue; };
+ +

Mit Hilfe dieses Codes wird JavaScript automatisch diese Funktion aufrufen, sobald ein Objekt des Typs MyNumberType in einem Kontext steht, wo es als primitiver Wert benötigt wird.

+ +

Die Methode valueOf eines Objekts wird üblicherweise nur von JavaScript selbst aufgerufen, kann aber ebenso wie folgt jederzeit aufgerufen werden:

+ +
myNumberType.valueOf()
+ +
+

Wichtig: Objekte in String-Kontexten werden über die Methode {{jsxref("Object.toString", "toString()")}} zu String umgewandelt, was etwas anderes ist als ein {{jsxref("String")}} Objekt welches über valueOf zum string primitive konvertiert wird. Alle Objekte haben eine Möglichkeit, zu einem String konvertiert zu werden, selbst wenn dies lediglich resultiert in "[object type]". Die meisten Objekte hingegen können nicht gewandelt werden zu number, boolean, oder function.

+
+ +

Beispiele

+ +

Verwendung von valueOf

+ +
function MyNumberType(n) {
+    this.number = n;
+}
+
+MyNumberType.prototype.valueOf = function() {
+    return this.number;
+};
+
+var myObj = new MyNumberType(4);
+myObj + 3; // 7
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusHinweise
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.2.4.4', 'Object.prototype.valueOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}{{Spec2('ESDraft')}} 
+ +

Browser Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Object.valueOf")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/object/values/index.html b/files/de/web/javascript/reference/global_objects/object/values/index.html new file mode 100644 index 0000000000..f3a66e5714 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/object/values/index.html @@ -0,0 +1,148 @@ +--- +title: Object.values() +slug: Web/JavaScript/Reference/Global_Objects/Object/values +translation_of: Web/JavaScript/Reference/Global_Objects/Object/values +--- +
{{JSRef}}
+ +

Die Methode Object.values() gibt ein Array mit den Eigenschaftswerten eines gegebenen Objekts in der selben Reihenfolge wie eine {{jsxref("Statements/for...in", "for...in")}}-Schleife sie geben würde zurück (Der Unterschied ist dabei, dass eine for-in Schleife zusätzlich die Eigenschaften der Protoype-Kette aufzählt).

+ +

 

+ +
{{EmbedInteractiveExample("pages/js/object-values.html")}}
+ +

Syntax

+ +
Object.values(obj)
+ +

Parameter

+ +
+
obj
+
Ein Objekt, dessen Eigenschaftswerte zurück gegeben werden sollen.
+
+ +

Rückgabewert

+ +

Ein Array, welches die Eigenschaftswerte eines gegebenen Objekts enthält.

+ +

Beschreibung

+ +

Object.values() gibt ein Array zurück, dessen Elemente mit den Werten der Eigenschaften eines gegebenen Objekts übereinstimmen. Die Reihenfolge der Eigenschaften ist die selbe, wie sie sich bei einem manuellen Durchlauf über die Eigenschaften ergeben würde.

+ +

Beispiele

+ +
var obj = { foo: 'bar', baz: 42 };
+console.log(Object.values(obj)); // ['bar', 42]
+
+// Array-ähnliches Objekt
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.values(obj)); // ['a', 'b', 'c']
+
+// Array-ähnliches Objekt mit zufälliger Sortierung der Eigenschaften
+var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.values(an_obj)); // ['b', 'c', 'a']
+
+// getFoo ist eine nicht aufzählbare Eigenschaft
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
+my_obj.foo = 'bar';
+console.log(Object.values(my_obj)); // ['bar']
+
+// non-object argument will be coerced to an object
+console.log(Object.values('foo')); // ['f', 'o', 'o']
+
+ +

Polyfill

+ +

Um Object.values auch in älteren Umgebungen zu nutzen, die diese Methode nicht nativ unterstützen, können Sie ein Polyfill im tc39/proposal-object-values-entries oder im es-shims/Object.values Repository finden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecifikationStatusKommentar
{{SpecName('ESDraft', '#sec-object.values', 'Object.values')}}{{Spec2('ESDraft')}}Erste Definition.
{{SpecName('ES8', '#sec-object.values', 'Object.values')}}{{Spec2('ES8')}} 
+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(54)}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(47)}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatSafari(10.1)}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroid WebviewChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatChrome(54)}}{{CompatChrome(54)}}{{CompatVersionUnknown}}{{CompatGeckoMobile(47)}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatSafari(10.3)}}
+
+ +

 

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/parsefloat/index.html b/files/de/web/javascript/reference/global_objects/parsefloat/index.html new file mode 100644 index 0000000000..72dddf6c5b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/parsefloat/index.html @@ -0,0 +1,147 @@ +--- +title: parseFloat() +slug: Web/JavaScript/Reference/Global_Objects/parseFloat +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat +--- +
+
+
{{jsSidebar("Objects")}}
+
+
+ +

Die parseFloat()-Funktion parst ein Zeichenketten-Argument und gibt eine Fließkommazahl zurück.

+ +
{r{EmbedInteractiveExample("pages/js/globalprops-parsefloat.html")}}
+ + + +

Syntax

+ +
parseFloat(value)
+ +

Parameter

+ +
+
value
+
Der Wert, den man parsen möchte.
+
+ +

Rückgabewert

+ +

Eine Fließkommazahl, die vom übergebenen Wert geparst wurde. Wenn der Wert nicht zu einer Zahl konvertiert werden kann, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

parseFloat ist eine Top-Level-Funktion und mit keinen Objekt assoziiert.

+ +

parseFloat übersetzt ihr Argument in eine Fließkommazahl. Trifft sie dabei auf ein anderes Zeichen als ein Vorzeichen (+ oder -), einen numerischen Werten (0-9), einen Dezimalpunkt, oder einen Exponenten, so gibt es den Wert zurück bis zu diesem Punkt und ignoriert dieses Zeichen, sowie alle nachfolgenden. Anführende und abschließende Leerzeichen sind erlaubt.

+ +

Wenn der Wert eine Zeichenkette ist und die ersten Zeichen nicht in eine Zahl konvertiert werden können, gibt parseFloat den Wert {{jsxref("NaN")}} zurück.

+ +

Für arithmetische Zwecke ist NaN keine Zahl für jede Basis eines Zahlensystems. Man kann die {{jsxref("isNaN")}}-Funktion aufrufen um festzustellen, ob NaN das Ergebnis von parseFloat ist. Wenn NaN Operand einer arithmetischen Operation ist, dann ist das Ergebnis ebenfalls NaN.

+ +

parseFloat kann ebenfalls den Wert Infinity parsen und zurückgeben. Man kann die {{jsxref("isFinite")}}-Funktion benutzen um festzustellen, ob das Ergebnis eine endliche Zahl ist (nicht Infinity,  -Infinity, oder NaN).

+ +

parseFloat kann zudem Objekte parsen, wenn diese eine toString- oder valueOf-Methode haben. Das Ergebnis ist dasselbe, als wenn parseFloat mit dem Ergebnis einer dieser beiden Methoden ausgerufen wurde.

+ +

Beispiele

+ +

parseFloat Rückgabe einer Zahl

+ +

Die folgenden Beispiele geben alle 3.14 zurück

+ +
parseFloat(3.14);
+parseFloat("3.14");
+parseFloat("314e-2");
+parseFloat("0.0314E+2");
+parseFloat("3.14mehr nicht-Ziffer-Zeichen");
+
+var foo = Object.create(null);
+foo.toString = function () { return "3.14"; };
+parseFloat(foo);
+
+var foo = Object.create(null);
+foo.valueOf = function () { return "3.14"; };
+parseFloat(foo);
+
+ +

parseFloat Rückgabe von NaN

+ +

Das folgende Beispiel gibt NaN zurück

+ +
parseFloat("FF2");
+
+ +

Eine striktere parse-Funktion

+ +

Unter bestimmten Umständen ist es hilfreich, einen strikteren Weg zu haben, um Fließkomma-Werte zu parsen. Reguläre Ausdrücke können hierbei helfen:

+ +
var filterFloat = function (value) {
+    if(/^(\-|\+)?([0-9]+(\.[0-9]+)?|Infinity)$/
+      .test(value))
+      return Number(value);
+  return NaN;
+}
+
+console.log(filterFloat('421'));               // 421
+console.log(filterFloat('-421'));              // -421
+console.log(filterFloat('+421'));              // 421
+console.log(filterFloat('Infinity'));          // Infinity
+console.log(filterFloat('1.61803398875'));     // 1.61803398875
+console.log(filterFloat('421e+0'));            // NaN
+console.log(filterFloat('421hop'));            // NaN
+console.log(filterFloat('hop1.61803398875'));  // NaN
+
+
+ +

Hinweis: Dies ist lediglich ein Beispiel, es akzeptiert keine zulässigen Zahlen wie 1. oder .5.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.1.2.3', 'parseFloat')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-parsefloat-string', 'parseFloat')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-parsefloat-string', 'parseFloat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatiblität

+ + + +

{{Compat("javascript.builtins.parseFloat")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/parseint/index.html b/files/de/web/javascript/reference/global_objects/parseint/index.html new file mode 100644 index 0000000000..39641b060a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/parseint/index.html @@ -0,0 +1,195 @@ +--- +title: parseInt() +slug: Web/JavaScript/Reference/Global_Objects/parseInt +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/parseInt +--- +
{{jsSidebar("Objects")}}
+ +

Die parseInt() Methode liest ein String-Argument ein und gibt eine ganze Zahl im angegebenen Zahlensystem zurück.

+ +
{{EmbedInteractiveExample("pages/js/globalprops-parseint.html")}}
+ + + +

Syntax

+ +
parseInt(string, radix);
+ +

Parameter

+ +
+
string
+
Umzuwandelnder Wert. Wenn string kein String ist, wird er zu einem String konvertiert (durch die abstrakte Operation ToString). Führende Leerzeichen im String werden ignoriert.
+
+ +
+
radix
+
Eine ganze Zahl zwischen 2 und 36, die die Basis eines mathematischen Zahlensystems ist, in der der String geschrieben ist. 10 steht für das gebräuchliche Dezimalsystem.
+
+ +

Rückgabewert

+ +

Eine ganze Zahl des übergebenen Strings. Wenn das erste Zeichen nicht zu einer Zahl konvertiert werden kann, wird {{jsxref("NaN")}} zurückgegeben.

+ +

Beschreibung

+ +

Die parseInt Funktion konvertiert das erste Argument zu einem String, analysiert diesen und gibt eine ganze Zahl oder NaN zurück. Wenn nicht NaN zurückgegeben wird, ist der Wert des ersten Arguments eine gültige ganze Zahl im entsprechenden Zahlensystem. Zum Beispiel wird im 10er-Zahlensystem von einer Dezimalzahl ausgegangen, im 8er-System von einer Oktalzahl, im 16er-System von einer Hexadezimalzahl und so weiter. Für die Basis eines Zahlensystems größer als 10 sind Buchstaben des Alphabets Repräsentanten für Zahlen größer als 9. Zum Beispiel werden für Hexadezimalezahlen (Basis 16) die Buchstaben A bis F eingesetzt.

+ +

Wenn parseInt ein Zeichen findet, welches keine Ziffer im spezifizierten Zahlensystem ist wird dieses und alle folgenden Zeichen ignoriert. parseInt schneidet Nachkommstellen ab. Führende und nachgestellte Leerzeichen sind erlaubt.

+ +

Weil einige Zahlen mit einem e Zeichen in ihrer String-Repräsentation (z. B. 6.022e23), führt der Einsatz von parseInt zum Abschneiden von nummerischer Wert und unerwarteten Ergebnissen, wenn große oder kleine Zahlen verwendet werden. parseInt sollte nicht als Ersatz für {{jsxref("Math.floor()")}} eingesetzt werden.

+ +

Wenn radix undefined oder 0 ist (oder fehlt), nimmt JavaScript folgendes an:

+ + + +

Wenn das erste Zeichen nicht zu einer Zahl konvertiert werden kann, gibt parseInt NaN zurück.

+ +

Für arithmetische Zwecke ist NaN in keinem Zahlensystem eine Zahl. Man kann die Funktion {{jsxref("isNaN", "isNaN()")}} aufrufen, um zu prüfen, ob das Ergebnis von parseInt NaN ist. Wenn NaN in einer arithmetischen Operation eingesetzt wird, ist das Ergebnis auch immer NaN.

+ +

Um Zahlen in String-Repräsentationen in verschiedenen Zahlensystemen zu konvertieren nutze folgendes:
+ intValue.toString(radix).

+ +

Beispiele

+ +

Einsatz von parseInt

+ +

Alle folgenden Beispiele geben 15 zurück:

+ +
parseInt(" 0xF", 16);
+parseInt(" F", 16);
+parseInt("17", 8);
+parseInt(021, 8);
+parseInt("015", 10);
+parseInt(15.99, 10);
+parseInt("15,123", 10);
+parseInt("FXX123", 16);
+parseInt("1111", 2);
+parseInt("15*3", 10);
+parseInt("15e2", 10);
+parseInt("15px", 10);
+parseInt("12", 13);
+
+ +

Alle folgenden Beispiele geben NaN zurück:

+ +
parseInt("Hello", 8); // Not a number at all
+parseInt("546", 2);   // Digits are not valid for binary representations
+
+ +

Alle folgenden Beispiele geben -15 zurück:

+ +
parseInt("-F", 16);
+parseInt("-0F", 16);
+parseInt("-0XF", 16);
+parseInt(-15.1, 10);
+parseInt(" -17", 8);
+parseInt(" -15", 10);
+parseInt("-1111", 2);
+parseInt("-15e1", 10);
+parseInt("-12", 13);
+
+ +

Die folgenden Beispiele geben 4 zurück:

+ +
parseInt(4.7, 10);
+parseInt(4.7 * 1e22, 10);       // Sehr große Zahl wird zu 4
+parseInt(0.00000000000434, 10); // Sehr kleine Zahl wird zu 4
+ +

Das folgende Beispiel gibt 224 zurück:

+ +
parseInt("0e0", 16);
+
+ +

Oktal-Interpretationen ohne radix

+ +

Obwohl ECMAScript 3 es nicht empfahl und ECMAScript 5 es verbietet, interpretieren viele Implementierungen einen mit "0" beginnende String als Oktalzahl. Das folgende Beispiel hat ein Ergebnis im Oktal- oder Dezimalsystem. Das Zahlensystem sollte immer angegeben werden, um solche Verwirrungen zu vermeiden.

+ +
parseInt("0e0"); // 0
+parseInt("08"); // 0, '8' ist keine oktale Ziffer.
+
+ +

ECMAScript 5 entfernt oktale Interpretation

+ +

Die ECMAScript 5 Spezifikation der parseInt Funktion erlaubt es nicht mehr einen mit 0 beginnenden String als Oktalzahl zu interpretieren. ECMAScript 5 Stand:

+ +

Die parseInt Funktion produziert eine ganze Zahl, indem der Inhalt vom string Argument interpretiert wird, abhängig vom in radix angegebenen Zahlensystem. Führende Whitespaces werden ignoriert. Wenn radix undefined oder 0 ist, wird von 10 ausgegangen, außer die Zahl beginnt mit den Zeichen 0x oder 0X, dann wird 16 für radix angenommen.

+ +

Das unterscheidet sich von der ECMAScript 3 Spezifikation, welche Oktalinterpretationen nicht empfiehlt, sie aber erlaubt.

+ +

Weil viele Implementierungen dieses Verhalten seit 2013 nicht geändert haben und auch ältere Browser unterstützt werden müssen, sollte immer das radix-Argument gesetzt werden.

+ +

Eine strenge parse-Funktion

+ +

Es ist manchmal nützliche eine strenge Funktion für die Umwandlung von ganzen Zahlen zu verwenden. Reguläre Ausdrücke können helfen:

+ +
filterInt = function (value) {
+  if(/^(\-|\+)?([0-9]+|Infinity)$/.test(value))
+    return Number(value);
+  return NaN;
+}
+
+console.log(filterInt('421'));               // 421
+console.log(filterInt('-421'));              // -421
+console.log(filterInt('+421'));              // 421
+console.log(filterInt('Infinity'));          // Infinity
+console.log(filterInt('421e+0'));            // NaN
+console.log(filterInt('421hop'));            // NaN
+console.log(filterInt('hop1.61803398875'));  // NaN
+console.log(filterInt('1.61803398875'));     // NaN
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.1.2.2', 'parseInt')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-parseint-string-radix', 'parseInt')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-parseint-string-radix', 'parseInt')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.parseInt")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/all/index.html b/files/de/web/javascript/reference/global_objects/promise/all/index.html new file mode 100644 index 0000000000..9753db7994 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/all/index.html @@ -0,0 +1,137 @@ +--- +title: Promise.all() +slug: Web/JavaScript/Reference/Global_Objects/Promise/all +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all +--- +
{{JSRef}}
+ +

Die Promise.all(iterable) Methode gibt einen {{jsxref("Promise")}} zurück, welcher erfüllt(resolved) wird, wenn alle Promises in dem iterable - Argument erfüllt wurden oder wenn das iterable - Argument keine Promises enthält. Eine Ablehnung (reject) erfolgt mit dem Grund des ersten Promises, das abgelehnt wurde, oder mit dem Error der von dem ersten Argument, wenn das innerhalb eines try/catch/throw blocks gefangen wurde.

+ +

Es wird typischerweise für mehrere asynchrone Aufgaben die parallel laufen und die Promises als Ergebnisse haben, so das eines warten kann, bis alle anderen Aufgaben abgeschlossen sind.

+ +
{{EmbedInteractiveExample("pages/js/promise-all.html")}}
+ + + +

Syntax

+ +
Promise.all(iterable);
+ +

Parameter

+ +
+
iterable
+
Ein iterierbares Objekt, z.B. ein {{jsxref("Array")}} oder ein {{jsxref("String")}}.
+
+ +

Rückgabe-Wert

+ + + +

Beschreibung

+ +

Diese Methode dient dem Bündeln von mehreren Promises.

+ +

Erfüllt: 
+ Wenn alle Promises erfolgreich erfüllt werden, oder keine Promises sind, wird Promise.all mit einem Array, welches die Rückgabewerte der einzelnen Promises (aber auch die nicht-Promise Werte) enthält, erfüllt. Wenn ein leeres Array übergeben wird, wird  Promise.all (synchron) sofort erfüllt. 

+ +

Abgelehnt:
+ Wenn eines der übergebenen Promises abgelehnt wird, wird Promise.all asynchron mit dem Wert des fehlgeschlagenen Promise abgelehnt, ganz egal, ob die anderen Promises erfolgreich waren oder nicht.

+ +

Beispiele

+ +

Erfolgreich:

+ +
var p1 = Promise.resolve(3);
+var p2 = 1337;
+var p3 = new Promise((resolve, reject) => {
+   setTimeout(resolve, 100, 'foo');
+});
+
+Promise.all([p1, p2, p3])
+.then(values => {
+  console.log(values); // [3, 1337, "foo"]
+});
+
+ +

Sofortige Ablehnung:

+ +
var p1 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 1000, 'one');
+});
+var p2 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 2000, 'two');
+});
+var p3 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 3000, 'three');
+});
+var p4 = new Promise((resolve, reject) => {
+  setTimeout(resolve, 4000, 'four');
+});
+var p5 = new Promise((resolve, reject) => {
+  reject('reject');
+});
+
+Promise.all([p1, p2, p3, p4, p5]).then(values => {
+  console.log(values);
+}, reason => {
+  console.log(reason)
+});
+
+//From console:
+//"reject"
+
+//You can also use .catch
+Promise.all([p1, p2, p3, p4, p5]).then(values => {
+  console.log(values);
+}).catch(reason => {
+  console.log(reason)
+});
+
+//From console:
+//"reject"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
domenic/promises-unwrappingDraftStandardization work is taking place here.
{{SpecName('ES2015', '#sec-promise.all', 'Promise.all')}}{{Spec2('ES2015')}}Initial definition in an ECMA standard.
+ +

Browserkompatiblität

+ + + +

{{Compat("javascript.builtins.Promise.all")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/finally/index.html b/files/de/web/javascript/reference/global_objects/promise/finally/index.html new file mode 100644 index 0000000000..588d00d43f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/finally/index.html @@ -0,0 +1,93 @@ +--- +title: Promise.prototype.finally() +slug: Web/JavaScript/Reference/Global_Objects/Promise/finally +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally +--- +
{{JSRef}}
+ +

finally () gibt ein {{jsxref ("Promise")}} zurück. Wenn das Promise erfüllt oder abgelehnt wird, wird die angegebene callback-Funktion ausgeführt. Dies stellt eine Möglichkeit für Code bereit, der ausgeführt werden muss, unabhängig davon, ob das Promise erfolgreich erfüllt wurde oder nicht. Auf diese Weise können Sie vermeiden, dass derselbe Code für die beiden Handlern des Promise {{jsxref ("Promise.then", "then ()")}} und {{jsxref ("Promise.catch", "catch ()")}} geschrieben werden muss.

+ +

Syntax

+ +
p.finally(onFinally);
+
+p.finally(function() {
+   // settled (fulfilled or rejected)
+});
+
+ +

Parameters

+ +
+
onFinally
+
A {{jsxref("Function")}} called when the Promise is settled.
+
+ +

Return value

+ +

Returns a {{jsxref("Promise")}} whose finally handler is set to the specified function, onFinally.

+ +

Description

+ +

The finally() method can be useful if you want to do some processing or cleanup once the promise is settled, regardless of its outcome.

+ +

The finally() method is very similar to calling .then(onFinally, onFinally) however there are couple of differences:

+ + + +
+

Note: A throw (or returning a rejected promise) in the finally callback will reject the new promise with the rejection reason specified when calling throw().

+
+ +

Examples

+ +
let isLoading = true;
+
+fetch(myRequest).then(function(response) {
+    var contentType = response.headers.get("content-type");
+    if(contentType && contentType.includes("application/json")) {
+      return response.json();
+    }
+    throw new TypeError("Oops, we haven't got JSON!");
+  })
+  .then(function(json) { /* process your JSON further */ })
+  .catch(function(error) { console.log(error); })
+  .finally(function() { isLoading = false; });
+
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
TC39 proposalStage 4
+ +

Browser compatibility

+ + + +

{{Compat("javascript.builtins.Promise.finally")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/index.html b/files/de/web/javascript/reference/global_objects/promise/index.html new file mode 100644 index 0000000000..9e9756ac65 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/index.html @@ -0,0 +1,244 @@ +--- +title: Promise +slug: Web/JavaScript/Reference/Global_Objects/Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise +--- +
{{JSRef}}
+ +

Das Promise Objekt stellt eine Repräsentation einer eventuellen Ausführung (oder eines Fehlschlags) einer asynchronen Operation und den daraus resultierenden Ergebnissen dar.

+ +

Um mehr darüber zu erfahren wie promises funktionieren und wie diese verwendet werden sollte zuerst Promises benutzen gelesen werden.

+ +
+
+ +

Beschreibung

+ +

Das Promise-Objekt (dt./deutsch Ein Versprechens-Objekt, das später eingelöst wird)wird für asynchrone Berechnungen verwendet.

+ +

Ein Promise kann sich in einem von drei Zuständen befinden:

+ + + +

Ein weiterer Begriff beschreibt den Zustand settled (erledigt aber nicht zwingend erfolgreich): Der Promise ist entweder fulfilled oder rejected, aber nicht pending.

+ +

Syntax

+ +
new Promise(executor);
+new Promise(function(resolve, reject) { ... });
+ +

Parameter

+ +
+
executor (Ausführer)
+
Funktion mit den zwei Argumenten resolve und reject. Das erste Argument führt den Promise aus, das zweite verwirft ihn. Die Funktionen können ausgeführt werden, sobald die Operation durchgeführt wurde.
+
+ +

Beschreibung

+ +

Das Promise-Interface repräsentiert einen Proxy für einen Wert, der nicht zwingend bekannt ist, wenn der Promise erstellt wird. Das erlaubt die Assoziation zwischen Handler und dem Gelingen oder Fehlschlagen einer asynchronen Aktion. Mit diesem Mechanismus können asynchrone Methoden in gleicher Weise Werte zurück geben wie synchrone Methoden: Anstelle des endgültigen Wertes wird ein Promise zurückgegeben, dass es zu einem Zeitpunkt in der Zukunft einen Wert geben wird.

+ +

Ein Promise mit dem Status pending kann entweder zu fulfilled mit Wert oder zu einem rejected mit Grund werden. Wenn einer dieser Fälle eintritt, werden die assoziierten Handler, die über die then-Methode gequeued wurde, aufgerufen. Ist ein Promise bereits in fullfilled oder rejected und wird erst dann ein entsprechender Handler hinzugefügt, dann wird dieser Handler aufgerufen. Es gibt somit keine Race Conditions zwischen der Ausführung der asynchronen Aktion und dem Hinzufügen des Handlers.

+ +

Da die Methoden Promise.prototype.then und Promise.prototype.catch Promises zurückgeben, können sie aneinander gereiht werden (Komposition).

+ +

+ +

Properties

+ +
+
Promise.length
+
Length-Attribut mit dem Wert 1 (Anzahl der Konstruktorargumente).
+
{{jsxref("Promise.prototype")}}
+
Repräsentiert den Prototyp für den Promise-Konstruktor.
+
+ +

Methoden

+ +
+
{{jsxref("Promise.all", "Promise.all(iterable)")}}
+
Gibt einen Promise zurück, der aufgelöst wird, sobald alle Promises in dem iterable-Argument aufgelöst wurden.
+
{{jsxref("Promise.race", "Promise.race(iterable)")}}
+
Gibt einen Promise zurück, der aufgelöst oder verworfen wird, sobald einer der Promises in dem iterable-Argument aufgelöst oder verworfen wurde, und den Wert oder den Grund dieses Promise enthält.
+
+ +
+
{{jsxref("Promise.reject", "Promise.reject(reason)")}}
+
Gibt einen Promise zurück, der mit dem angegeben Grund (reason) verworfen wird.
+
+ +
+
{{jsxref("Promise.resolve", "Promise.resolve(value)")}}
+
Gibt einen Promise zurück, der mit value aufgelöst wird. Falls der Wert ein thenable ist (Objekt besitzt eine then-Methode), folgt der zurückgegebene Promise dem thenable und übernimmt den Status. Andernfalls wird der zurückgegebene Promise auf fulfilled gesetzt.
+
+ +

Promise-Prototyp

+ +

Eigenschaften

+ +

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Eigenschaften')}}

+ +

Methoden

+ +

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Methoden')}}

+ +

Beispiele

+ +

Einen Promise erstellen

+ + + +

Dieses kleine Beispiel zeigt den Mechanismus eines Promise. Die Methode testPromise() wird jedes Mal aufgerufen, wenn der {{HTMLElement("button")}} geklickt wurde. Es wird ein Promise erstellt, der mithilfe von window.setTimeout nach einer zufällig gewählten Zeit (1-3 s) zu 'result' aufgelöst wird.

+ +

Die Ausführung der Promises wird mit einem fulfill-Callback unter Verwendung von p1.then gelogt. Durch ein paar Logeinträge wird gezeigt, wie der synchrone Teil der Methode von der asynchronen Vollendung des Promises abgekoppelt ist.

+ +
var promiseCount = 0;
+function testPromise() {
+  var thisPromiseCount = ++promiseCount;
+
+  var log = document.getElementById('log');
+  log.insertAdjacentHTML('beforeend', thisPromiseCount +
+      ') Started (<small>Sync code started</small>)<br/>');
+
+  // Wir erstellen einen neuen Promise: wir versprechen den String 'result' (Wartezeit max. 3s)
+  var p1 = new Promise(
+    // Resolver-Funktion kann den Promise sowohl auflösen als auch verwerfen
+    // reject the promise
+    function(resolve, reject) {
+      log.insertAdjacentHTML('beforeend', thisPromiseCount +
+          ') Promise started (<small>Async code started</small>)<br/>');
+      // nur ein Beispiel, wie Asynchronität erstellt werden kann
+      window.setTimeout(
+        function() {
+          // We fulfill the promise !
+          resolve(thisPromiseCount)
+        }, Math.random() * 2000 + 1000);
+    });
+
+  // wir bestimmen, was zu tun ist, wenn der Promise fulfilled
+  p1.then(
+    // Loggen der Nachricht und des Wertes
+    function(val) {
+      log.insertAdjacentHTML('beforeend', val +
+          ') Promise fulfilled (<small>Async code terminated</small>)<br/>');
+    });
+
+  log.insertAdjacentHTML('beforeend', thisPromiseCount +
+      ') Promise made (<small>Sync code terminated</small>)<br/>');
+}
+
+ + + +

Dieses Beispiel wird ausgeführt, wenn der Button geklickt wird. Man benötigt einen Browser, der Promise unterstützt. Durch mehrmaliges Klicken in kurzer Zeit kann beobachtet werden, wie die einzelnen Promises nacheinander fulfilled werden.

+ +

{{EmbedLiveSample("Creating_a_Promise", "500", "200")}}

+ +

Laden eines Bildes mit XHR

+ +

Ein weiteres, einfaches Beispiel für die Verwendung von Promises und XMLHTTPRequest, um ein Bild zu laden, ist in dem MDN GitHub promise-test Repository. Hier kannst du es in Aktion sehen. Jeder Schritt ist kommentiert und erlaubt die den Promises und der XHR-Architektur nachzuvollziehen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
domenic/promises-unwrappingDraftStandardisierung findet hier statt.
{{SpecName('ES6', '#sec-promise-objects', 'Promise')}}{{Spec2('ES6')}}Initiale Definition als ein ECMA-Standard.
+ +

Browserkompatiblität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic Support32{{CompatGeckoDesktop(24.0)}} als Future
+ {{CompatGeckoDesktop(25.0)}} als Promise hinter einem Flag[1]
+ {{CompatGeckoDesktop(29.0)}} per Default
{{CompatNo}}197.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic Support{{CompatNo}}{{CompatGeckoMobile(24.0)}} als Future
+ {{CompatGeckoMobile(25.0)}} als Promise hinter einem Flag[1]
+ {{CompatGeckoMobile(29.0)}} per Default
{{CompatNo}}{{CompatNo}}iOS 832
+
+ +

[1] Gecko 24 hat eine experimentelle Implementierung von Promises unter dem vorherigen Namen Future. In Gecko 25 wurde sie in ihren endgültigen Namen umbenannt, wird aber per Default durch das Flag dom.promise.enable unterdrückt. Bug 918806 aktiviert Promises per Default in Gecko 29.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/race/index.html b/files/de/web/javascript/reference/global_objects/promise/race/index.html new file mode 100644 index 0000000000..78c4d9edf2 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/race/index.html @@ -0,0 +1,184 @@ +--- +title: Promise.race() +slug: Web/JavaScript/Reference/Global_Objects/Promise/race +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race +--- +
{{JSRef}}
+ +

Promise.race(iterable) gibt ein erfolgreiches oder fehlgeschlagenes Promise zurück, sobald eines der Promises in dem iterable erfolgreich war oder fehlgeschlagen ist, entsprechend mit dem value oder dem reason dieses Promises.

+ +
{{EmbedInteractiveExample("pages/js/promise-race.html")}}
+ + + +

Syntax

+ +
Promise.race(iterable);
+ +

Parameter

+ +
+
iterable
+
Ein iterierbares Objekt, wie zum Beispiel {{jsxref("Array")}}. Siehe auch iterable.
+
+ +

Rückgabewert

+ +

Eine {{jsxref("Promise")}} im Status pending, die asynchron (sobald der Stack leer ist) einen erfolgreichen oder fehlerhaften Status annimmt, sobald die erste Promise erfolgreich, bzw. fehlerhaft ist und entsprechend diesen Wert zurückliefert.

+ +

Beschreibung

+ +

Die race Funktion gibt eine Promise zurück, die sich genauso verhält, wie die Promise aus iterable, die als erstes einen erfolgreichen oder fehlerhaften Status annimmt und entsprechend diesen Wert zurückliefert.

+ +

Wenn das übergebene iterable leer ist, wird die Promise für immer im Status pending verharren.

+ +

Wenn iterable einen oder mehrere Werte enthält, die keine Promise sind bzw. Promises die bereits einen erfolgreichen oder fehlerhaften Status angenommen haben, dann wird die zurückgegebene Promise von Promise.race entsprechend den ersten dieser Werte aus iterable annehmen.

+ +

 Beispiele

+ +

Asynchronität von Promise.race

+ +

Das folgende Beispiel demonstriert the Asynchronität von Promise.race:

+ +
// wir übergeben als Argument ein Array von Promises, die bereits einen
+// erfolgreichen Status angenommen haben, um Promise.race sofort auszulösen
+var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];
+
+var p = Promise.race(resolvedPromisesArray);
+// sofortiges Loggen des Wertes aus p
+console.log(p);
+
+// mit setTimeout wird der Code erst nachdem der Stack leer ist ausgeführt
+setTimeout(function(){
+    console.log('der Stack ist jetzt leer');
+    console.log(p);
+});
+
+// Logs, in der Reihenfolge:
+// Promise { <state>: "pending" }
+// der Stack ist jetzt leer
+// Promise { <state>: "fulfilled", <value>: 33 }
+ +

Ein leeres iterable führt zu einer Promise, die für immer im Status pending bleibt:

+ +
var foreverPendingPromise = Promise.race([]);
+console.log(foreverPendingPromise);
+setTimeout(function(){
+    console.log('der Stack ist jetzt leer');
+    console.log(foreverPendingPromise);
+});
+
+// Logs, in der Reihenfolge:
+// Promise { <state>: "pending" }
+// der Stack ist jetzt leer
+// Promise { <state>: "pending" }
+
+ +

Wenn iterable einen oder mehrere Werte enthält, die keine Promise sind bzw. Promises die bereits einen erfolgreichen oder fehlerhaften Status angenommen haben, dann wird Promise.race entsprechend den ersten dieser Werte aus iterable annehmen:

+ +
var foreverPendingPromise = Promise.race([]);
+var alreadyResolvedProm = Promise.resolve(666);
+
+var arr = [foreverPendingPromise, alreadyResolvedProm, "keine Promise"];
+var arr2 = [foreverPendingPromise, "keine Promise", Promise.resolve(666)];
+var p = Promise.race(arr);
+var p2 = Promise.race(arr2);
+
+console.log(p);
+console.log(p2);
+setTimeout(function(){
+    console.log('der Stack ist jetzt leer');
+    console.log(p);
+    console.log(p2);
+});
+
+// Logs, in der Reihenfolge:
+// Promise { <state>: "pending" }
+// Promise { <state>: "pending" }
+// der Stack ist jetzt leer
+// Promise { <state>: "fulfilled", <value>: 666 }
+// Promise { <state>: "fulfilled", <value>: "keine Promise" }
+
+ +

Benutzung von Promise.race – Beispiele mit setTimeout

+ +
var p1 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 500, 'eins');
+});
+var p2 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 100, 'zwei');
+});
+
+Promise.race([p1, p2]).then(function(value) {
+  console.log(value); // "zwei"
+  // beide erfolgreich, aber p2 ist schneller
+});
+
+var p3 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 100, 'drei');
+});
+var p4 = new Promise(function(resolve, reject) {
+    setTimeout(reject, 500, 'vier');
+});
+
+Promise.race([p3, p4]).then(function(value) {
+  console.log(value); // "drei"
+  // p3 ist schneller, also insgesamt erfolgreich
+}, function(reason) {
+  // nicht aufgerufen
+});
+
+var p5 = new Promise(function(resolve, reject) {
+    setTimeout(resolve, 500, 'fünf');
+});
+var p6 = new Promise(function(resolve, reject) {
+    setTimeout(reject, 100, 'sechs');
+});
+
+Promise.race([p5, p6]).then(function(value) {
+  // nicht aufgerufen
+}, function(reason) {
+  console.log(reason); // "sechs"
+  // p6 ist schneller, also insgesamt fehlerhaft
+});
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-promise.race', 'Promise.race')}}{{Spec2('ES2015')}}Initiale Definition eines ECMA Standards.
{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Promise.race")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/reject/index.html b/files/de/web/javascript/reference/global_objects/promise/reject/index.html new file mode 100644 index 0000000000..1b90305142 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/reject/index.html @@ -0,0 +1,74 @@ +--- +title: Promise.reject() +slug: Web/JavaScript/Reference/Global_Objects/Promise/reject +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject +--- +
{{JSRef}}
+ +
Die Promise.reject(reason) Methode gibt ein Promise Objekt zurück, das mit dem angegebenen Grund reason abgelehnt wurde.
+ +

 

+ +

Syntax

+ +
Promise.reject(reason);
+ +

Parameter

+ +
+
reason
+
Der Grund warum diese Promise abgelehnt wurde.
+
+ +

Rückgabewerte

+ +

Ein {{jsxref("Promise")}}, das mit dem angegeben Grund abgelehnt wurde

+ +

Beschreibung

+ +

Die statische Promise.reject Funktion gibt ein Promise zurück, das abgelehnt wurde. Für Debugging zwecke, sowie gezielte Fehlerverarbeitung ist es empfehlenswert, als reason eine instanceof {{jsxref("Error")}}. zu verwenden.

+ +

Beispiele

+ +

Verwendung der Promise.reject() Methode

+ +
Promise.reject(new Error('fail')).then(function(error) {
+  // nicht aufgerufen
+}, function(error) {
+  console.log(error); // Stacktrace
+});
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ES2015')}}Initial definition in an ECMA standard.
{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript/promise","Promise.reject")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/promise/then/index.html b/files/de/web/javascript/reference/global_objects/promise/then/index.html new file mode 100644 index 0000000000..3578cfcb62 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/promise/then/index.html @@ -0,0 +1,149 @@ +--- +title: Promise.prototype.then() +slug: Web/JavaScript/Reference/Global_Objects/Promise/then +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then +--- +
{{JSRef}}
+ +
Die then()-Methode gibt ein Promise-Objekt zurück. Sie benötigt zwei Argumente, jeweils eine Callback-Funktion für den Erfolg und den Fehlschlag des Promise.
+ +
 
+ +

Syntax

+ +
p.then(onFulfilled, onRejected);
+
+p.then(function(value) {
+   // fulfillment
+  }, function(reason) {
+  // rejection
+});
+
+ +

Parameter

+ +
+
onFulfilled
+
Eine {{jsxref("Function")}}, welche aufgerufen wird, wenn der Promise erfüllt wurde. Die Funktion hat ein Argument, den Rückgabewert value.
+
onRejected {{optional_inline}}
+
Eine {{jsxref("Function")}}, welche aufgerufen wird, wenn der Promise fehlschlägt. Die Funktion hat ein Argument, den Grund für den Fehlschlag: reason. Ist keine Funktion definiert, so wird sie intern durch die "Thrower" Funktion ersetzt (Dieser gibt einen Fehler als Argument zurück)
+
+ +

Beschreibung

+ +

Die then- und {{jsxref("Promise.prototype.catch()")}}-Methoden, können, da sie Promises zurückgeben, verkettetet werden — ein Vorgehen, das composition genannt wird.

+ +

Beispiele

+ +

Benutzen der then-Methode

+ +
var p1 = new Promise(function(resolve, reject) {
+  resolve("Success!");
+  // or
+  // reject ("Error!");
+});
+
+p1.then(function(value) {
+  console.log(value); // Success!
+}, function(reason) {
+  console.log(reason); // Error!
+});
+
+ +

Verketten

+ +

Da die then-Methode einen Promise zurückliefert, können then-Aufrufe leicht verkettet werden.

+ +
var p2 = new Promise(function(resolve, reject) {
+  resolve(1);
+});
+
+p2.then(function(value) {
+  console.log(value); // 1
+  return value + 1;
+}).then(function(value) {
+  console.log(value); // 2
+});
+
+p2.then(function(value) {
+  console.log(value); // 1
+});
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}{{Spec2('ES2015')}}Initiale Definition in einem ECMAScript-Standard.
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support32{{CompatGeckoDesktop(29.0)}} [1]{{CompatNo}}197.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatGeckoMobile(29.0)}} [1]{{CompatNo}}{{CompatNo}}832
+
+ +

[1] Gecko 24 besitzt, unter dem Namen Future, eine experimentielle Implementation von Promise. In Gecko 25 wurde der Name final festgelegt aber standardmäßig durch die Einstellung dom.promise.enabled deaktiviert. Durch Bug 918806 wurden Promises in Gecko 29 standardmäßig aktiviert.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/rangeerror/index.html b/files/de/web/javascript/reference/global_objects/rangeerror/index.html new file mode 100644 index 0000000000..d66cd10c55 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/rangeerror/index.html @@ -0,0 +1,174 @@ +--- +title: RangeError +slug: Web/JavaScript/Reference/Global_Objects/RangeError +tags: + - Error + - JavaScript + - NeedsTranslation + - Object + - RangeError + - TopicStub +translation_of: Web/JavaScript/Reference/Global_Objects/RangeError +--- +
{{JSRef}}
+ +

The RangeError object indicates an error when a value is not in the set or range of allowed values.

+ +

Syntax

+ +
new RangeError([message[, fileName[, lineNumber]]])
+ +

Parameters

+ +
+
message
+
Optional. Human-readable description of the error
+
fileName {{non-standard_inline}}
+
Optional. The name of the file containing the code that caused the exception
+
lineNumber {{non-standard_inline}}
+
Optional. The line number of the code that caused the exception
+
+ +

Description

+ +

A RangeError is thrown when trying to pass a number as an argument to a function that does not allow a range that includes that number. This can be encountered when attempting to create an array of an illegal length with the {{jsxref("Array")}} constructor, or when passing bad values to the numeric methods {{jsxref("Number.toExponential()")}}, {{jsxref("Number.toFixed()")}} or {{jsxref("Number.toPrecision()")}}.

+ +

Properties

+ +
+
{{jsxref("RangeError.prototype")}}
+
Allows the addition of properties to an RangeError object.
+
+ +

Methods

+ +

The global RangeError contains no methods of its own, however, it does inherit some methods through the prototype chain.

+ +

RangeError instances

+ +

Properties

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError/prototype', 'Properties')}}
+ +

Methods

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError/prototype', 'Methods')}}
+ +

Examples

+ +

Using RangeError

+ +
var check = function(num) {
+  if (num < MIN || num > MAX) {
+    throw new RangeError('Parameter must be between ' + MIN + ' and ' + MAX);
+  }
+};
+
+try {
+  check(500);
+}
+catch (e) {
+  if (e instanceof RangeError) {
+    // Handle range error
+  }
+}
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES3')}}{{Spec2('ES3')}}Initial definition.
{{SpecName('ES5.1', '#sec-15.11.6.2', 'RangeError')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-rangeerror', 'RangeError')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-rangeerror', 'RangeError')}}{{Spec2('ESDraft')}} 
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/rangeerror/prototype/index.html b/files/de/web/javascript/reference/global_objects/rangeerror/prototype/index.html new file mode 100644 index 0000000000..6dc92432bf --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/rangeerror/prototype/index.html @@ -0,0 +1,128 @@ +--- +title: RangeError.prototype +slug: Web/JavaScript/Reference/Global_Objects/RangeError/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/RangeError +--- +
{{JSRef}}
+ +

Die RangeError.prototype Eigenschaft repräsentiert den Prototypen des {{jsxref("RangeError")}} Konstruktoren.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref("RangeError")}} Instanzen erben vom RangeError.prototype. Man kann den Prototypen nutzen um Eigenschaften oder Methoden allen Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
RangeError.prototype.constructor
+
Spezifiziert die Funktion welche den Prototypen einer Instanz erschaffen hat.
+
{{jsxref("Error.prototype.message", "RangeError.prototype.message")}}
+
Fehlermeldung. Obwohl ECMA-262 angibt, dass {{jsxref("RangeError")}} seine eigene message Eigenschaft versorgen sollte, erbt es in SpiderMonkey die {{jsxref("Error.prototype.message")}}.
+
{{jsxref("Error.prototype.name", "RangeError.prototype.name")}}
+
Fehlername. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.fileName", "RangeError.prototype.fileName")}}
+
Der Dateipfad verursacht diesen Fehler. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.lineNumber", "RangeError.prototype.lineNumber")}}
+
Die Zeile in der Datei, bei der der Fehler auftritt. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.columnNumber", "RangeError.prototype.columnNumber")}}
+
Die Spaltennummer der Zeile , bei der der Fehler auftritt. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.stack", "RangeError.prototype.stack")}}
+
Stack - Ablaufverfolgung. Geerbt von {{jsxref("Error")}}.
+
+ +

Methoden

+ +

 Obwohl das {{jsxref("RangeError")}} Prototypobjekt keine eigenen Methoden beinhaltet, beerben {{jsxref("RangeError")}} Instanzen einige Methoden durch die Prototypenkette.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusBeschreibung
{{SpecName('ES3')}}{{Spec2('ES3')}}Initialdefinition.
{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}{{Spec2('ES5.1')}}Definiert als NativeError.prototype.
{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ES6')}}Definiert als NativeError.prototype.
{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ESDraft')}}Definiert als NativeError.prototype.
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
MerkmalChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
MerkmalAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/reflect/apply/index.html b/files/de/web/javascript/reference/global_objects/reflect/apply/index.html new file mode 100644 index 0000000000..bc16c4d4d8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/reflect/apply/index.html @@ -0,0 +1,98 @@ +--- +title: Reflect.apply() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/apply +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/apply +--- +
{{JSRef}}
+ +
Die statische Methode Reflect.apply() ruft eine Zielfunktion mit den spezifizierten Parametern auf.
+ +
 
+ +
{{EmbedInteractiveExample("pages/js/reflect-apply.html")}}
+ + + +

Syntax

+ +
Reflect.apply(target, thisParameter, listeDerArgumente)
+
+ +

Parameter

+ +
+
target
+
Die Funktion, die aufgerufen werden soll.
+
thisParameter
+
Der Wert von this der für den Aufruf bereitgestellt wird.
+
listeDerArgumente
+
Ein Array ähnliches Objekt welches die Parameter spezifiziert, mit denen die Zielfunktion aufgerufen wird.
+
+ +

Rückgabewert

+ +

Das Resultat des Aufruft, der Zielfunktion mit dem mitgegebenen this und den mitgegebenen Parametern.

+ +

Ausnahmen

+ +

Es wird ein {{jsxref("TypeError")}} geworfen, wenn die Zielfunktion nicht aufrufbar ist.

+ +

Beschreibung

+ +

In ES5, ruft man typischerweise {{jsxref("Function.prototype.apply()")}} auf, um eine Funktion aufzurufen, der man einen bestimmten this mitgeben und die Parameter als Array (oder einem array-like object) definieren möchte.

+ +
Function.prototype.apply.call(Math.floor, undefined, [1.75]);
+ +

Durch Reflect.apply wird dieses Vorhaben kürzer und ist leichter zu verstehen.

+ +

Beispiele

+ +

Verwendung von Reflect.apply()

+ +
Reflect.apply(Math.floor, undefined, [1.75]);
+// 1;
+
+Reflect.apply(String.fromCharCode, undefined, [104, 101, 108, 108, 111]);
+// "hello"
+
+Reflect.apply(RegExp.prototype.exec, /ab/, ['confabulation']).index;
+// 4
+
+Reflect.apply(''.charAt, 'ponies', [3]);
+// "i"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-reflect.apply', 'Reflect.apply')}}{{Spec2('ES2015')}}Ursprüngliche Definition.
{{SpecName('ESDraft', '#sec-reflect.apply', 'Reflect.apply')}}{{Spec2('ESDraft')}} 
+ +

Browser kompabilität

+ + + +

{{Compat("javascript.builtins.Reflect.apply")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/reflect/construct/index.html b/files/de/web/javascript/reference/global_objects/reflect/construct/index.html new file mode 100644 index 0000000000..29da55d15b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/reflect/construct/index.html @@ -0,0 +1,157 @@ +--- +title: Reflect.construct() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/construct +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/construct +--- +
{{JSRef}}
+ +
Die statische Methode Reflect.construct() verhält sich wie der new operator, allerdings in Form einer Funktion.
+ +
Sie ist das Equivalent zu new target(...args). Es existiert zudem die Option, einen anderen Prototyp zu definieren.
+ +
 
+ +
{{EmbedInteractiveExample("pages/js/reflect-construct.html")}}
+ + + +

Syntax

+ +
Reflect.construct(target, listeDerArgumente[, newTarget])
+
+ +

Parameter

+ +
+
target
+
Die Funktion, die aufgerufen werden soll.
+
listeDerArgumente
+
Ein Array ähnliches Objekt welches die Parameter spezifiziert, mit denen die Zielfunktion aufgerufen wird.
+
newTarget {{optional_inline}}
+
Der Construktor dessen Typ genutzt werden soll. Siehe auch den new.target Operator. Wenn newTarget nicht existiert, ist es target.
+
+ +

Rückgabewert

+ +

Eine neue Instanz des target (oder newTarget, wenn vorhanden), Initialisiert durch das target als Konstruktor mit den gegebenen Parametern.

+ +

Ausnahmen

+ +

Es wird ein {{jsxref("TypeError")}} geworfen, Wenn target or newTarget keine Konstruktoren sind.

+ +

Beschreibung

+ +

Reflect.construct erlaubt es dir, einen Konstruktor mit einer variablen Anzahl von Parametern aufzurufen. (Was auch möglich ist, bai Verwendung des spread operator in Kombination mit dem new operator).

+ +
var obj = new Foo(...args);
+var obj = Reflect.construct(Foo, args);
+
+ +

 

+ +

Reflect.construct() vs Object.create()

+ +

Befor wir mit der Einführung von Reflect beginnen. Objekte können durch von Object.create() mithilfe einer beliebigen Kombination aus Konstruktor und Prototyp erstellt werden.

+ +
function OneClass() {
+    this.name = 'one';
+}
+
+function OtherClass() {
+    this.name = 'other';
+}
+
+// Calling this:
+var obj1 = Reflect.construct(OneClass, args, OtherClass);
+
+// ...has the same result as this:
+var obj2 = Object.create(OtherClass.prototype);
+OneClass.apply(obj2, args);
+
+console.log(obj1.name); // 'one'
+console.log(obj2.name); // 'one'
+
+console.log(obj1 instanceof OneClass); // false
+console.log(obj2 instanceof OneClass); // false
+
+console.log(obj1 instanceof OtherClass); // true
+console.log(obj2 instanceof OtherClass); // true
+
+ +

Obwohl das Endergebnis das gleiche ist, gibt es einen wichtigen Unterschied im Prozess.

+ +

Wenn Object.create() und Function.prototype.apply() verwendet werden, zeigt der new.target Operator innerhalb der als Konstruktor verwendeten Funktion auf undefined, da das newTarget nicht zum Erstellen des Objekts verwendet wird.

+ +

Wenn Sie dagegen Reflect.construct() aufrufen, zeigt der new.target Operator auf den newTarget Parameter, sofern angegeben und auf target, falls nicht.

+ +
function OneClass() {
+    console.log('OneClass');
+    console.log(new.target);
+}
+function OtherClass() {
+    console.log('OtherClass');
+    console.log(new.target);
+}
+
+var obj1 = Reflect.construct(OneClass, args);
+// Output:
+//     OneClass
+//     function OneClass { ... }
+
+var obj2 = Reflect.construct(OneClass, args, OtherClass);
+// Output:
+//     OneClass
+//     function OtherClass { ... }
+
+var obj3 = Object.create(OtherClass.prototype);
+OneClass.apply(obj2, args);
+// Output:
+//     OneClass
+//     undefined
+ +

 

+ +

Beispiele

+ +

Verwendung Reflect.construct()

+ +
var d = Reflect.construct(Date, [1776, 6, 4]);
+d instanceof Date; // true
+d.getFullYear(); // 1776
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-reflect.construct', 'Reflect.construct')}}{{Spec2('ES2015')}}Ursprüngliche Definition.
{{SpecName('ESDraft', '#sec-reflect.construct', 'Reflect.construct')}}{{Spec2('ESDraft')}} 
+ +

Browser kompabilität

+ + + +

{{Compat("javascript.builtins.Reflect.construct")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/reflect/index.html b/files/de/web/javascript/reference/global_objects/reflect/index.html new file mode 100644 index 0000000000..3ba358f140 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/reflect/index.html @@ -0,0 +1,88 @@ +--- +title: Reflect +slug: Web/JavaScript/Reference/Global_Objects/Reflect +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect +--- +
{{JSRef}}
+ +
Reflect ist ein Standardobjekt, das Methoden für abfangfähige JavaScript-Operationen bereitstellt.
+ +
Die Methoden entsprechen denen des proxy handlers.
+ +
Reflect ist kein Funktionsobjekt und verfügt daher über keinen Konstruktor.
+ +

Beschreibung

+ +

Im Gegensatz zu den meisten globalen Objekten hat Reflect keinen Konstruktor. Sie können es nicht mit einem new operator verwenden, oder Reflect als Funktion aufrufen.

+ +

Alle Eigenschaften und Methoden von Reflect sind statisch (wie bei {{jsxref("Math")}}).

+ +

Methoden

+ +

Das Reflect-Objekt stellt die folgenden statischen Funktionen bereit, die dieselben Namen haben wie die Methoden des proxy handler. Einige dieser Methoden sind exakt die selben wie bei entsprechenden Methoden des {{jsxref("Object")}}.

+ +
+
{{jsxref("Reflect.apply()")}}
+
Ruft eine Zielfunktion mit Argumenten auf, die Argumente werden im Parameter args angegeben. Siehe auch {{jsxref("Function.prototype.apply()")}}.
+
{{jsxref("Reflect.construct()")}}
+
 Der new operator als Funktion. Equivalent zu new target(...args). Bietet die optionale Möglichkeit, einen anderen Prototyp anzugeben.
+
{{jsxref("Reflect.defineProperty()")}}
+
Ähnlich zu {{jsxref("Object.defineProperty()")}}. Gibt einen {{jsxref("Boolean")}} zurück.
+
{{jsxref("Reflect.deleteProperty()")}}
+
Der delete operator als Funktion. Ähnlich zu dem Aufruf delete target[name].
+
{{jsxref("Reflect.get()")}}
+
Eine Funktion, die den Wert von Eigenschaften/Properties zurückgibt.
+
{{jsxref("Reflect.getOwnPropertyDescriptor()")}}
+
Ähnlich zu {{jsxref("Object.getOwnPropertyDescriptor()")}}. Gibt einen Eigenschaftsdeskriptor der angegebenen Eigenschaft, oder {{jsxref("undefined")}} zurück.
+
{{jsxref("Reflect.getPrototypeOf()")}}
+
Gleich wie {{jsxref("Object.getPrototypeOf()")}}.
+
{{jsxref("Reflect.has()")}}
+
Der in operator als Funktion. Gibt einen booleschen Wert zurück, der angibt, ob eine eigene oder geerbte Eigenschaft vorhanden ist.
+
{{jsxref("Reflect.isExtensible()")}}
+
Gleich wie {{jsxref("Object.isExtensible()")}}.
+
{{jsxref("Reflect.ownKeys()")}}
+
Gibt ein Array der eigenen (nicht geerbten) Eigenschaftsschlüssel des Zielobjekts zurück.
+
{{jsxref("Reflect.preventExtensions()")}}
+
Ähnlich zu {{jsxref("Object.preventExtensions()")}}. Gibt einen {{jsxref("Boolean")}} zurück.
+
{{jsxref("Reflect.set()")}}
+
Eine Funktion, die den Eigenschaften/Properties Werte zuweist. Gibt einen {{jsxref("Boolean")}} zurück, der true ist, wenn die Zuweisung erfolgreich verlief.
+
{{jsxref("Reflect.setPrototypeOf()")}}
+
+

Eine Funktion, die den Prototyp eines Objekts festlegt.

+
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-reflect-object', 'Reflect')}}{{Spec2('ES2015')}}Ursprüngliche Definition.
{{SpecName('ESDraft', '#sec-reflect-object', 'Reflect')}}{{Spec2('ESDraft')}}Reflect.enumerate wurde entfernt.
+ +

Browser kompatiblität

+ + + +

{{Compat("javascript.builtins.Reflect")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/regexp/flags/index.html b/files/de/web/javascript/reference/global_objects/regexp/flags/index.html new file mode 100644 index 0000000000..65956f3c3b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/regexp/flags/index.html @@ -0,0 +1,83 @@ +--- +title: RegExp.prototype.flags +slug: Web/JavaScript/Reference/Global_Objects/RegExp/flags +tags: + - ECMAScript 2015 + - Eigenschaft + - JavaScript + - Prototyp + - Referenz + - RegExp + - Regular Expressions + - Reguläre Expressionen +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/flags +--- +
{{JSRef}}
+ +

Die flags Eigenschaft gibt einen String mit den Flags des RegExp-Objektes zurück.

+ +
{{EmbedInteractiveExample("pages/js/regexp-prototype-flags.html")}}
+ + + +
{{js_property_attributes(0, 0, 1)}}
+ +

Beschreibung

+ +

Flags in der flags Eigenschaft sind alphabetisch sortiert (von links nach rechts, z.B. "gimuy").

+ +

Beispiele

+ +

Die flags benutzen

+ +
/foo/ig.flags;   // "gi"
+/bar/myu.flags;  // "muy"
+
+ +

Polyfill

+ +
if (RegExp.prototype.flags === undefined) {
+  Object.defineProperty(RegExp.prototype, 'flags', {
+    configurable: true,
+    get: function() {
+      return this.toString().match(/[gimuy]*$/)[0];
+    }
+  });
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-get-regexp.prototype.flags', 'RegExp.prototype.flags')}}{{Spec2('ES2015')}}Initielle Definition.
{{SpecName('ESDraft', '#sec-get-regexp.prototype.flags', 'RegExp.prototype.flags')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatiblität

+ +
+ + +

 {{Compat("javascript.builtins.RegExp.flags")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/regexp/index.html b/files/de/web/javascript/reference/global_objects/regexp/index.html new file mode 100644 index 0000000000..9639ba265f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/regexp/index.html @@ -0,0 +1,560 @@ +--- +title: RegExp +slug: Web/JavaScript/Reference/Global_Objects/RegExp +tags: + - JavaScript + - Klasse + - Referenz + - RegExp + - Reguläre Ausdrücke +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp +--- +

{{JSRef}}

+ +

Der RegExp constructor erstellt ein Objekt mit regulären Werten, um diese dann als Muster an einem Text anzuwenden.

+ +

Für eine Einführung über reguläre Ausdrücke, lies das Kapitel Regular Expressions im JavaScript Guide (englisch).

+ +

Syntax

+ +
/muster/flags
+
+RegExp(muster [, flags])
+
+ +

Parameter

+ +
+
muster
+
Text des regulären Ausdrucks.
+
flags
+
+

Optional, flags kann eine Zeichenkette mit einer beliebige Kombination folgender Werte sein:

+ +
+
g
+
globale Suche (nach einem Treffer fortsetzen)
+
i
+
Groß-/Kleinschreibung ignorieren
+
m
+
multiline; behandelt den Suchkontext als Mehrfachzeilen, d.h. Anfang- und Endeanker (^ und $) entsprechen dem Anfang bzw. Ende jeder einzelnen Zeile (begrenzt durch \n oder \r), nicht nur dem Anfang und Ende der gesamten zu durchsuchenden Zeichenkette.
+
y {{Fx_minversion_inline(3)}} {{non-standard_inline}}
+
sticky; matches only from the index indicated by the lastIndex property of this regular expression in the target string (and does not attempt to match from any later indexes). This allows the match-only-at-start capabilities of the character "^" to effectively be used at any location in a string by changing the value of the lastIndex property.
+
+
+
+ +

Beschreibung

+ +

Es bestehen zwei Möglichkeiten, ein RegExp-Objekt zu erzeugen: Eine literale Notation und ein Konstruktor. In der literaren Version werden im Gegensatz zu der Konstruktorversion keine Anführungszeichen verwendet, um Zeichenketten zu kennzeichnen. Dementsprechend erzeugen beide der folgenden Zeilen den gleichen regulären Ausdruck:

+ +
/ab+c/i;
+new RegExp("ab+c", "i");
+
+ +

Die literale Notation stellt eine Kompilierung des regulären Ausdrucks während der Auswertung des Ausdrucks bereit. Nutzen Sie die literale Notation, wenn der reguläre Ausdruck unverändert bleiben wird. Wenn Sie zum Beispiel die literale Notation für die Erzeugung eines regulären Ausdruck verwenden, um ihn in einer Schleife zu anzuwenden, wird der reguläre Ausdruck nicht in jedem Schleifendurchlauf rekompiliert.

+ +

Der Konstruktor des RegExp-Objekts, z.B. new RegExp("ab+c"), stellt eine Laufzeitkompilierung des regulären Ausdrucks bereit. Nutzen Sie die Konstruktor-Funktion, wenn sich das reguläre Suchmuster ändern wird oder Sie das Muster nicht kennen und es aus einer anderen Quelle wie z.B. einer Benutzereingabe beziehen.

+ +

Bei Verwendung der Konstruktor-Funktion sind die normalen Zeichenfolgenmaskierungsregeln (Voranstellen eines Rückwärtsschrägstrichs (\) vor Sonderzeichen innerhalb von Zeichenketten) einzuhalten. Zum Beispiel sind folgende Zeilen äquivalent:

+ +
var re = /\w+/;
+var re = new RegExp("\\w+");
+
+ +

Bedeutung spezieller Zeichen in regulären Ausdrücken

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Zeichenklassen
ZeichenBedeutung
. +

(Punkt, Satzendezeichen) stimmt mit jedem Einzelzeichen außer den Zeilenvorschub- und Wagenrücklaufzeichen (\n \r \u2028 oder \u2029) überein.

+ +

Zu beachten ist, dass das m multiline flag nicht das Punktverhalten verändert. Um ein Musterentsprechung über mehrere Zeilen hinweg zu erreichen, kann die leere negative Zeichenauswahl [^] verwendet werden, sie stimmt mit jedem Zeichen einschließlich Zeilenumbrüchen überein.

+ +

/.y/ passt z.B. auf "my" und "ay", nicht aber auf "yes"  in "yes make my day".

+
\d +

Stimmt mit einer arabischen Ziffer überein. Äquivalent zu [0-9].

+ +

/\d/ or /[0-9]/ passt z.B. auf '2' in "B2 ist die Zimmernummer."

+
\D +

Stimmt mit jedem Zeichen überein, das keine arabische Ziffer ist. Äquivalent zu [^0-9].

+ +

/\D/ or /[^0-9]/ passt z.B. auf 'B' in "B2 ist die Zimmernummer."

+
\w +

Stimmt mit einem alphanumerischen Zeichen (Wortzeichen) einschließlich dem Unterstrich überein. Äquivalent zu [A-Za-z0-9_].

+ +

/\w/ passt zum Beispiel auf 'A' in "Apfel", '5' in "€5,28," und '3' in "3D."

+
\W +

Stimmt mit jedem Zeichen überein, das kein alphanumerisches Zeichen (Wortzeichen) ist. Äquivalent zu [^A-Za-z0-9_].

+ +

/\W/ or /[^A-Za-z0-9_]/ passt z.B. auf '%' in "50%."

+
\s +

Stimmt mit einem einzelnen Leerraumzeichen überein (Leerzeichen, Tabulator, Seitenvorschub, Zeilenvorschub und weitere Unicode-Zeichen). Äquivalent zu [ \f\n\r\t\v​\u00a0\u1680​\u180e\u2000​\u2001\u2002​\u2003\u2004​ \u2005\u2006​\u2007\u2008​\u2009\u200a​\u2028\u2029​​\u202f\u205f​ \u3000].

+ +

/\s\w*/ passt z.B. auf ' bar' in "foo bar."

+
\S +

Stimmt mit einem einzelnen Zeichen überein, das kein Leerraumzeichen ist. (Nicht-Leerraumzeichen).
+ Äquivalent zu [^\s] und zu [^ \f\n\r\t\v​\u00a0\u1680​\u180e\u2000​\u2001\u2002​\u2003\u2004​ \u2005\u2006​\u2007\u2008​\u2009\u200a​\u2028\u2029​​\u202f\u205f​ \u3000].

+ +

/\S\w*/ passt z.B. auf 'foo' in "foo bar."

+
\tStimmt mit einem Tabulatorzeichen überein.
\rStimmt mit einem Wagenrücklaufzeichen überein.
\nStimmt mit einem Zeilenvorschub überein.
\vStimmt mit einem vertikalen Tabulatorzeichen überein.
\fStimmt mit einem Seitenvorschub überein.
[\b] +

Stimmt mit einem Rücklöschzeichen (Backspace) überein. (Nicht zu verwechseln mit \b)

+
\0Stimmt mit einem NUL-Zeichen überein. (Keine weiteren Ziffern dürfen folgen!)
\cX +

Wobei X ein Buchstabe von A - Z ist. Stimmt mit einem Steuerzeichen überein.

+ +

/\cM/ passt z.B. auf Steuerung-M in einer Zeichenkette.

+
\xhh +

Stimmt mit einem Zeichen mit dem Code hh (zwei hexadezimale Ziffern) überein.

+ +

/foo\x20bar/ passt z.B. auf 'o b' in "foo bar".

+
\uhhhhStimmt mit einem Zeichen mit dem Unicode hhhh (vier hexadezimale Ziffern) überein.
\ +

Bei einem Zeichen, das normalerweise als Literal behandelt wird, signalisiert ein vorangestellter Rückschrägstrich, dass es als Spezialzeichen und nicht als Literal zu interpretieren ist.

+ +

Z.B. passt /b/ auf das Zeichen 'b'. Durch Voranstellen des Rückschrägstriches vor das "b", also /\b/, bekommt das Zeichen eine besondere Bedeutung und passt auf eine Wordgrenze.

+ +

oder

+ +

Bei einem Zeichen, das normalerweise als Zeichen mit spezieller Bedeutung interpretiert wird, signalisiert ein vorangestellter Rückschrägstrich, dass es ohne besondere Bedeutung als Literal interpretiert werden soll.

+ +

Zum Beispiel ist * Quantor-Spezialzeichen, das eine Übereinstimmung mit null oder mehreren Vorkommen des vorausgehenden Zeichens bedeutet; z.B. bedeutet /a*/ eine Übereinstimmung von null oder mehr "a"s. Um dem "*" als Literal zu entsprechen, wird ein Rückschrägstrich vorangestellt; z.B. passt /a\*/ auf 'a*'.

+
+

Zeichenauswahl

+
ZeichenBedeutung
[xyz] +

Zeichenauswahl, stimmt mit einem Beliebigen der eingeschlossenen Zeichen überein. Mittels eines Bindestriches kann ein Bereich von Zeichen angegeben werden.

+ +

[abcd] ist gleichbedeutend mit[a-d] und passt auf 'b' in "brisket" und 'c' in "chop".

+
[^xyz] +

Eine negative bzw. komplementäre Zeichenauswahl. Das bedeutet eine Übereinstimmung mit jedem Zeichen, das nicht in den eckigen Klammern eingeschlossen ist. Mittels eines Bindestriches kann ein Bereich von Zeichen angegeben werden.

+ +

Zum Beispiel ist [^abc] gleichbedeutend mit [^a-c]. Beides passt auf 'o' in "bacon" und 'h' in "chop."

+
Bereichsgrenzen
ZeichenBedeutung
^ +

Stimmt mit dem Anfang eines Subjekts und, wenn das multiline flag gesetzt ist, auch mit der Stelle unmittelbar nach einem Zeilenumbruchzeichen überein.

+ +

/^E/ passt z.B. nicht auf 'E' in "ein E" aber auf das erste 'E' in "Ein E."

+
$ +

Stimmt mit dem Ende eines Subjekts und, wenn das multiline flag gesetzt ist, auch mit der Stelle unmittelbar vor einem Zeilenumbruchzeichen überein.

+ +

/t$/ passt z.B. auf das 't' in "Brot", nicht aber in "Brote".

+
\b +

Stimmt mit einer null-breiten Wortgrenze wie zwischen einem Buchstaben und einem Leerzeichen überein. (Nicht zu verwechseln mit der Zeichenklasse [\b])

+ +

/\bno/ passt z.B. auf 'no' in "at noon"; /ly\b/ passt auf 'ly' in "possibly yesterday."

+
\B +

Stimmt mit einer null-breiten Nichtwortgrenze wie zwischen zwei Buchstaben oder zwischen zwei Leerzeichen überein.

+ +

/\Bon/ passt z.B. auf 'on' in "at noon" und /ye\B/ passt auf 'ye' in "possibly yesterday."

+
Gruppierung und Rückwärtsreferenz
ZeichenBedeutung
(x) +

Stimmt mit x überein und speichert die Übereinstimmung. Dies wird auch capturing parentheses (engl., aufzeichnende Klammern) genannt.

+ +

/(foo)/ passt z.B. auf 'foo' in "foo bar" und speichert die Übereinstimmung. Aufgezeichnete Teilzeichenketten können aus den Elementen [1], ..., [n] des Ergebnisfelds (Array) oder den Eigenschaften $1, ..., $9 des vordefinierten RegExp-Objekts ausgelesen werden.

+ +

Aufzeichnende Gruppierungen führen zu Performanzeinbußen. Wenn die übereinstimmenden Teilzeichenketten nicht wiederverwendet werden müssen, sind nicht aufzeichnende Klammern zu bevorzugen (siehe weiter unten).

+
\n +

Wobei n eine positive Ganzzahl ist. Ein Rückbezug auf die zuletzt gefundene Teilzeichenkette, die der Übereinstimmung mit der n-ten runden Klammer im regulären Ausdruck entspricht (öffnende Klammern gezählt).

+ +

/apple(,)\sorange\1/ passt z.B. auf 'apple, orange,' in "apple, orange, cherry, peach." und zeichnet das Komma auf. Ein umfassenderes Beispiel folgt im Anschluss an diese Tabelle.

+
(?:x)Stimmt mit x überein, speichert die Übereinstimmung aber nicht, auch non-capturing parentheses genannt. Auf die übereinstimmende Teilzeichenkette kann nicht mittels der Elemente [1], ..., [n] des Arrays oder der vordefinierten Eigenschaften $1, ..., $9 des RegExp-Objekts zugegriffen werden .
Quantoren
ZeichenBedeutung
* +

Stimmt mit dem null- oder mehrmaligen Vorkommen des voranstehenden Zeichen überein.

+ +

/bo*/ passt z.B. auf 'boooo' in "A ghost booooed" und 'b' in "A bird warbled", aber auf nichts in "A goat grunted".

+
+ +

Stimmt mit dem ein- oder mehrmaligen Vorkommen des voranstehenden Zeichen überein. Äquivalent zu {1,}

+ +

/ca+/ passt z.B. auf 'ca' in "candy" und 'caaa' in "caaandy" aber auf nichts in "cindy".

+
*?
+ +?
+

Passt wie * und+ weiter oben, aber der Ausdruck ist nicht gierig, d.h. er passt auf die kürzestmögliche Übereinstimmung.

+ +

/_.*?_/ passt z.B. auf "_foo_" in "_foo_ _bar_" aber nicht auf "_foo_ _bar_" wie der Ausdruck ohne dem ? hinterm *.

+
? +

Stimmt mit dem null- oder einmaligen Vorkommen des voranstehenden Zeichens überein.

+ +

/e?le?/ passt z.B. auf das  'el' in "angel" und auf das 'le' in "angle."

+ +

If used immediately after any of the quantifiers *, +, ?, or {}, makes the quantifier non-greedy (matching the minimum number of times), as opposed to the default, which is greedy (matching the maximum number of times).

+ +

Das Fragezeichen wird auch in lookahead assertions verwendet, welche unter (?=), (?!), sowie (?:) in dieser Tabelle beschrieben sind.

+
x(?=y)Passt nur auf x, wenn y darauf folgt. Zum Beispiel passt /Jack(?=Sprat)/ nur auf 'Jack', wenn danach 'Sprat' folgt. /Jack(?=Sprat|Frost)/ passt nur auf 'Jack', wenn 'Sprat' oder 'Frost' folgt. Allerdings ist weder 'Sprat' noch 'Frost' Teil der Übereinstimmungsresultate.
x(?!y) +

Passt nur auf x, wenn darauf nicht y folgt. /\d+(?!\.)/ z.B. stimmt nur mit einer Zahl überein, sofern kein Dezimalpunkt folgt.

+ +

/\d+(?!\.)/.exec("3.141") passt auf 141, aber nicht auf 3.

+
x|y +

Passt entweder auf x oder y.

+ +

/green|red/ passt z.B. auf 'green' in "green apple" und auf 'red' in "red apple."

+
{n} +

Wobei n eine positive Ganzzahl ist. Stimmt mit genau n Vorkommen des vorausgehenden Zeichens oder Teilausdrucks überein.

+ +

/a{2}/ passt z.B. auf beide 'a' in "caandy" und die ersten beiden 'a' in "caaandy", nicht aber auf das 'a' in "candy".

+
{n,} +

Wobei n eine positive Ganzzahl ist. Stimmt mit mindestens n Vorkommen des vorausgehenden Zeichens oder Teilausdrucks überein.

+ +

/a{2,}/ passt z.B. auf alle 'a' in "caandy" und in "caaaaaaandy.", nicht aber auf das 'a' in "candy".

+
{n,m} +

Wobei n und m positive Ganzzahlen sind. Stimmt mit mindestens n und höchstens m Vorkommen des vorausgehenden Zeichens oder Teilausdrucks überein.

+ +

/a{1,3}/ passt z.B. auf nichts in "cndy", das 'a' in "candy," die beiden 'a' in "caandy," und die ersten drei 'a' in "caaaaaaandy". Es ist zu beachten, dass bei der Übereinstimmung in "caaaaaaandy" der Treffer "aaa" ist, obwohl in der Originalzeichenkette mehr 'a' vorhanden wären.

+
+ +

Fußnoten

+ +
    +
  1. {{endnote("equivalent_s")}}Equivalent to: +

    [\t\n\v\f\r \u00a0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u2028\u2029\u3000]

    +
  2. +
  3. {{endnote("equivalent_S")}}Equivalent to: +

    [^\t\n\v\f\r \u00a0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u2028\u2029\u3000]

    +
  4. +
+ +

Eigenschaften

+ +
+
prototype
+
Erlaubt das Hinzufügen von Eigenschaften zu allen Objekten
+
+ +
{{jsOverrides("Function", "Properties", "prototype")}}
+ +

Methoden

+ +

Das globale RegExp Objekt hat keine eigenen Methoden. Es erbt allerdings manche Methoden durch die Prototypenkette.{{jsOverrides("Function", "Methods", "prototype")}}

+ +

RegExp-Instanzen

+ +

Eigenschaften

+ +
{{page('en/JavaScript/Reference/Global_Objects/RegExp/prototype','Properties')}}
+ +

Methoden

+ +
{{page('en/JavaScript/Reference/Global_Objects/RegExp/prototype','Methods')}}
+ +

Beispiele

+ +

Beispiel: Anwendung regulären Ausdrucks zur Datenformatänderung

+ +

Das folgende Script nutzt die replace Methode und nutzt die vererbte String Instanz (re) um als Rückgabewert eine Übereinstimmung des Namens (str) in dem Format erster, letzter und im Format letzter, erster zu finden. In dem zu ersetzenden Text nutzt das Script $1 und $2 um das Ergebnis der übereinstimmenden Treffer in der Klammer als Muster des regulären Ausdrucks.

+ +
var re = /(\w+)\s(\w+)/;
+var str = "John Smith";
+var newstr = str.replace(re, "$2, $1");
+print(newstr);
+ +

Das ergibt: "Smith, John".

+ +

Beispiel: Anwendung eines regulären Ausdrucks auf mehrzeilige Texte

+ +
var s = "Please yes\nmake my day!";
+s.match(/yes.*day/);
+// Returns null
+s.match(/yes[^]*day/);
+// Returns 'yes\nmake my day'
+
+ +

Beispiel: Anwendung eines regulären Ausdrucks mit dem "sticky" flag

+ +

Dieses Beispiel zeigt, wie man die feste Kennzeichung (sticky flag) an reguläre Ausdrücke nutzt, um Übereinstimmungen von individuelle Treffer von mehrzeigen Eingaben zu erhalten.

+ +
var text = "First line\nSecond line";
+var regex = /(\S+) line\n?/y;
+
+var match = regex.exec(text);
+print(match[1]);  // prints "First"
+print(regex.lastIndex); // prints 11
+
+var match2 = regex.exec(text);
+print(match2[1]); // prints "Second"
+print(regex.lastIndex); // prints "22"
+
+var match3 = regex.exec(text);
+print(match3 === null); // prints "true"
+ +

One can test at run-time whether the sticky flag is supported, using try { … } catch { … }. For this, either an eval(…) expression or the RegExp(regex-string, flags-string) syntax must be used (since the /regex/flags notation is processed at compile-time, so throws an exception before the catch block is encountered). For example:

+ +
var supports_sticky;
+try { RegExp('','y'); supports_sticky = true; }
+catch(e) { supports_sticky = false; }
+alert(supports_sticky); // alerts "true"
+ +

Beispiel: Regulärer Ausdruck und Unicode-Zeichen

+ +

Wie oben erwähnt treffen Übereinstimmugnen mit \w or \W  nur ASCII basierende Zeichen; als Beispiel: 'a' bis 'z', 'A' bis 'Z', 0 bis 9 und '_'. Um Übereinstimmungen für Zeichensätze anderer Sprachen wie Kyrillisch oder Hebräisch zu erzielen, nutze \uhhhh., während "hhhh" den Unicode-Wert des Zeichensatzes in Hexadezimal angibt. Dieses Beispiel demonstriert wie man Unicode-Zeichen aus einem Wort erhält:

+ +
var text = "Образец text на русском языке";
+var regex = /[\u0400-\u04FF]+/g;
+
+var match = regex.exec(text);
+print(match[0]);  // prints "Образец"
+print(regex.lastIndex);  // prints "7"
+
+var match2 = regex.exec(text);
+print(match2[0]);  // prints "на" [did not print "text"]
+print(regex.lastIndex);  // prints "15"
+
+// and so on
+ +

Hier ist eine externe Quelle um alle Unicode Blöcke für verschiedene Scripte zu erhalten: Regexp-unicode-block

+ +

Weitere nennenswerte Beispiele

+ +
Extrahieren eines Subdomain-Namens aus einer URL
+ +
var url = "http://xxx.domain.com";
+print(/[^.]+/.exec(url)[0].substr(7)); // prints "xxx"
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/regexp/input/index.html b/files/de/web/javascript/reference/global_objects/regexp/input/index.html new file mode 100644 index 0000000000..d173458705 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/regexp/input/index.html @@ -0,0 +1,105 @@ +--- +title: RegExp.input ($_) +slug: Web/JavaScript/Reference/Global_Objects/RegExp/input +tags: + - JavaScript + - Property + - Reference + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/input +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die nicht-standarde input Propertie ist eine statische Propertie regularer Expressionen, welche die Zeichenkette, der eine reguläre Expression entgegengestellt wird, enthält. RegExp.$_ ist ein Alias für diese Propertie.

+ +

Syntaxis

+ +
RegExp.input
+RegExp.$_
+
+ +

Beschreibung

+ +

Die input-Propertie ist statisch, ist nicht eine Propertie eines einzigen Obiectes einer regulären Expression. Stattdessen nutzt man es immer als RegExp.input oder

+ +

Der Wert der input-Propertie wird verändert, wenn die gesuchte Zeichenkette in der regulären Expression verändert wird und diese Zeichenkette passt.

+ +

Beispiele

+ +

Verwendung von input und $_

+ +
var re = /hi/g;
+re.test("hi there!");
+RegExp.input;         // "hi there!"
+re.test("foo");       // neuer Test, unpassend
+RegExp.$_;            // "hi there!"
+re.test("hi world!"); // neuer Test, passend
+RegExp.$_;            // "hi world!"
+
+ +

Specificationen

+ +

Non-standard. Nicht Teil von irgendeiner laufenden Specification.

+ +

Browsercompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basisunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basisunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/regexp/test/index.html b/files/de/web/javascript/reference/global_objects/regexp/test/index.html new file mode 100644 index 0000000000..e908792657 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/regexp/test/index.html @@ -0,0 +1,127 @@ +--- +title: RegExp.prototype.test() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/test +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test +--- +
{{JSRef}}
+ +

Die test() Methode führt eine Suche nach einer Übereinstimmung zwischen einer regular expression und einem String durch. Sie gibt  true oder false zurück.

+ +
{{EmbedInteractiveExample("pages/js/regexp-prototype-test.html", "taller")}}
+ + + +

Syntax

+ +
regexObj.test(str)
+ +

Parameter

+ +
+
str
+
Der String, mit dem die regular expression verglichen wird.
+
+ +

Rückgabewerte

+ +

true wird zurückgegeben, wenn es eine Übereinstimmung zwischen der regular expression und dem String gibt str. Anderenfalls wird false zurückgegeben.

+ +

Beschreibung

+ +

Verwenden Sie test(), wenn Sie wissen möchten, ob ein Muster auf einen String zutrifft. test() gibt einen boolschen Wert zurück, wohingegen die {{jsxref("String.prototype.search()")}} Methode den Index der Übereinstimmung, oder wenn keine Übereinstimmung gefunden wird,  -1 zurück gibt.

+ +

Um mehr Informationen zu erhalten, können Sie alternativ die langsammere {{jsxref("RegExp.prototype.exec()", "exec()")}} Methode verwenden. (Sie ähnelt {{jsxref("String.prototype.match()")}} Methode.)

+ +

As with exec() (or in combination with it), test() called multiple times on the same global regular expression instance will advance past the previous match.

+ +

Beispiele

+ +

test() anwenden

+ +

Ein einfaches Beispiel, um zu testen, ob "hello" am Anfang eines Strings enthalten ist. Die Ausgabe ist ein boole'scher Wert.  

+ +
const str = 'hello world!';
+const result = /^hello/.test(str);
+
+console.log(result); // true
+
+ +

Das folgende Beispiel logt eine Nachricht, die vom Erfolg des Tests abhängt:

+ +
function testInput(re, str) {
+  let midstring;
+  if (re.test(str)) {
+    midstring = 'contains';
+  } else {
+    midstring = 'does not contain';
+  }
+  console.log(`${str} ${midstring} ${re.source}`);
+}
+
+ +

Anwendung von test() mit dem Kennzeichen "global"

+ +

When a regex has the global flag set, test() will advance the {{jsxref("RegExp.lastIndex", "lastIndex")}} of the regex. ({{jsxref("RegExp.prototype.exec()")}} also advances the lastIndex property.)

+ +

Further calls to test(str) will resume searching str starting from lastIndex. The lastIndex property will continue to increase each time test() returns true

+ +
+

Note: As long as test() returns truelastIndex will not reset—even when testing a different string!

+
+ +

When test() returns false, the calling regex's lastIndex property will reset to 0.

+ +

The following example demonstrates this behaviour:

+ +
const regex = /foo/g; // the "global" flag is set
+
+// regex.lastIndex is at 0
+regex.test('foo')     // true
+
+// regex.lastIndex is now at 3
+regex.test('foo')     // false
+
+// regex.lastIndex is at 0
+regex.test('barfoo')  // true
+
+// regex.lastIndex is at 6
+regex.test('foobar')  //false
+
+// regex.lastIndex is at 0
+// (...and so on)
+
+ +

Spezifikationen

+ + + + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-regexp.prototype.test', 'RegExp.test')}}
+ +

Browser -Kompatibilität

+ + + +

{{Compat("javascript.builtins.RegExp.test")}}

+ +

Firefox-specific notes

+ +

Prior to Firefox 8, test() was implemented incorrectly. When called without parameters, it would match against the value of the previous input (RegExp.input property) instead of against the string "undefined".

+ +

This is fixed. Now, /undefined/.test() correctly results in true, instead of throwing an error.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/set/add/index.html b/files/de/web/javascript/reference/global_objects/set/add/index.html new file mode 100644 index 0000000000..1df111c1c5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/set/add/index.html @@ -0,0 +1,69 @@ +--- +title: Set.prototype.add() +slug: Web/JavaScript/Reference/Global_Objects/Set/add +translation_of: Web/JavaScript/Reference/Global_Objects/Set/add +--- +
{{JSRef}}
+ +

Die add() Methode fügt ein neues Element mit dem angegebenen Wert an das Ende eines Set Objekts hinzu.

+ +
{{EmbedInteractiveExample("pages/js/set-prototype-add.html")}}
+ + + +

Syntax

+ +
mySet.add(value);
+ +

Parameter

+ +
+
value
+
Der hinzufügende Wert zu dem Set Objekt.
+
+ +

Rückgabewert

+ +

Das Set Objekt.

+ +

Beispiele

+ +

Verwenden der add() Methode

+ +
var mySet = new Set();
+
+mySet.add(1);
+mySet.add(5).add('some text'); // chainable
+
+console.log(mySet);
+// Set [1, 5, "some text"]
+
+ +

Spezifikationen

+ + + + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-set.prototype.add', 'Set.prototype.add')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Set.add")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/set/delete/index.html b/files/de/web/javascript/reference/global_objects/set/delete/index.html new file mode 100644 index 0000000000..f0f4cf5f3e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/set/delete/index.html @@ -0,0 +1,84 @@ +--- +title: Set.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/Set/delete +translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete +--- +
{{JSRef}}
+ +

Die delete() Methode entfernt das angegebene Element aus einem Set Objekt.

+ +
{{EmbedInteractiveExample("pages/js/set-prototype-delete.html")}}
+ + + +

Syntax

+ +
mySet.delete(value);
+ +

Parameter

+ +
+
value
+
Der zu entfernende Wert aus mySet.
+
+ +

Rückgabewert

+ +

Rückgabewert ist true wenn value erfolgreich aus mySet entfernt wurde; ansonstenfalse.

+ +

Beispiel

+ +

Verwenden der delete() Methode

+ +
const mySet = new Set();
+mySet.add('foo');
+
+mySet.delete('bar'); // Returns false. No "bar" element found to be deleted.
+mySet.delete('foo'); // Returns true.  Successfully removed.
+
+mySet.has('foo');    // Returns false. The "foo" element is no longer present.
+
+ +

Ein Beispiel, wie ein Objekt aus einem Set entfernt werden kann.

+ +
const setObj = new Set();   // Create a New Set.
+
+setObj.add({x: 10, y: 20}); // Add object in the set.
+
+setObj.add({x: 20, y: 30}); // Add object in the set.
+
+// Delete any point with `x > 10`.
+setObj.forEach(function(point){
+  if (point.x > 10){
+    setObj.delete(point)
+  }
+})
+
+ +

Spezifikationen

+ + + + + + + + + + + + +
Specification
{{SpecName('ESDraft', '#sec-set.prototype.delete', 'Set.prototype.delete')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Set.delete")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/set/has/index.html b/files/de/web/javascript/reference/global_objects/set/has/index.html new file mode 100644 index 0000000000..6374d80bc6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/set/has/index.html @@ -0,0 +1,131 @@ +--- +title: Set.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/Set/has +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/has +--- +
{{JSRef}}
+ +

Die Methode has() prüft, ob ein Set-Objekt ein Element mit dem angegebenen Wert enthält und gibt entsprechend true oder false zurück.

+ +

Syntax

+ +
mySet.has(value);
+ +

Parameter

+ +
+
value
+
Der zu suchende Wert.
+
+ +

Rückgabewert

+ +
+
Boolean
+
Gibt true zurück, falls ein Element mit dem angegebenen Wert innerhalb des Set-Objektes existiert, ansonsten wird false zurückgegeben.
+
+ +

Beispiel

+ +

has() verwenden

+ +

Das folgende Beispiel verwendet has(), um zu prüfen, ob bestimmte Werte in einem Set enthalten sind oder nicht.

+ +
var mySet = new Set();
+mySet.add('foo');
+
+mySet.has('foo');  // returns true
+mySet.has('bar');  // returns false
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-set.prototype.has', 'Set.prototype.has')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-set.prototype.has', 'Set.prototype.has')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support38{{CompatVersionUnknown}}{{CompatGeckoDesktop("13.0")}}11257.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}38{{CompatVersionUnknown}}{{CompatGeckoMobile("13.0")}}{{CompatNo}}{{CompatNo}}8
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/set/index.html b/files/de/web/javascript/reference/global_objects/set/index.html new file mode 100644 index 0000000000..27a3b1ad3d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/set/index.html @@ -0,0 +1,264 @@ +--- +title: Set +slug: Web/JavaScript/Reference/Global_Objects/Set +tags: + - ECMAScript6 + - Global Objects + - JavaScript + - Referenz + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set +--- +
{{JSRef}}
+ +

Ein Set-Objekt speichert eindeutige Werte jedes beliebigen Typs, egal ob es sich dabei um {{Glossary("Primitive", "primitive Werte")}} oder Objektreferenzen handelt.

+ +
{{EmbedInteractiveExample("pages/js/set-prototype-constructor.html")}}
+ + + +

Syntax

+ +
new Set([iterable]);
+ +

Parameter

+ +
+
iterable
+
Ein iterierbares Objekt, dessen Elemente zum neuen Set hinzugefügt werden sollen.
+ Ist dieser Parameter nicht angegeben oder null, wird ein leeres Set erzeugt.
+
+ +

Rückgabewert

+ +

Ein neues Set Objekt.

+ +

Beschreibung

+ +

Set Objekte sind Sammlungen von Werten. Man kann über die Elemente iterieren; sie werden in der Reihenfolge ihres Hinzufügens gespeichert. Jeder Wert ist nur einmal vorhanden; er ist im Set eindeutig.

+ +

Gleichheit

+ +

Da jeder Wert innerhalb eines Sets eindeutig sein muss, werden alle Werte auf Gleichheit überprüft. In einer früheren Version der ECMAScript Spezifikation verhielt sich der Algorithmus dafür anders als der für den === Operator. Insbesondere waren für Sets +0 und -0 verschiedene Werte (obwohl sie streng gleich sind). In der ECMAScript 2015 Spezifikation wurde das geändert, so dass +0 und -0 jetzt jeweils als gleicher Wert gelten. Siehe auch den Eintrag "Key equality for -0 and 0" in der Übersicht zur Browserkompatibilität.

+ +

{{jsxref("NaN")}} und {{jsxref("undefined")}} können ebenfalls in einem Set gespeichert werden. Dabei werden alle NaN Werte gleichgesetzt, d.h. NaN gilt gleich NaN (auch wenn NaN !== NaN).

+ +

Eigenschaften

+ +
+
Set.length
+
Der Wert der Eigenschaft length ist immer 0.
+ Die Anzahl der Elemente eines Sets befindet sich in {{jsxref("Set.prototype.size")}}.
+
{{jsxref("Set.@@species", "get Set[@@species]")}}
+
Die Konstruktorfunktion, um abgeleitete Objekte zu erzeugen.
+
{{jsxref("Set.prototype")}}
+
Prototyp für den Set Konstruktor. Ermöglicht das Hinzufügen von Eigenschaften zu allen Set Objekten.
+
+ +

Set Instanzen

+ +

Alle Set Instanzen erben von {{jsxref("Set.prototype")}}.

+ +

Eigenschaften

+ +

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Properties')}}

+ +

Methoden

+ +

{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Methods')}}

+ +

Beispiele

+ +

Verwenden eines Set Objekts

+ +
var mySet = new Set();
+
+mySet.add(1);
+mySet.add(5);
+mySet.add("some text");
+var o = {a: 1, b: 2};
+mySet.add(o);
+
+mySet.has(1); // true
+mySet.has(3); // false, 3 has not been added to the set
+mySet.has(5);              // true
+mySet.has(Math.sqrt(25));  // true
+mySet.has("Some Text".toLowerCase()); // true
+mySet.has(o); // true
+
+mySet.size; // 4
+
+mySet.delete(5); // removes 5 from the set
+mySet.has(5);    // false, 5 has been removed
+
+mySet.size; // 3, we just removed one value
+
+ +

Iterieren über ein Set

+ +
// iterate over items in set
+// logs the items in the order: 1, "some text"
+for (let item of mySet) console.log(item);
+
+// logs the items in the order: 1, "some text"
+for (let item of mySet.keys()) console.log(item);
+
+// logs the items in the order: 1, "some text"
+for (let item of mySet.values()) console.log(item);
+
+// logs the items in the order: 1, "some text"
+//(key and value are the same here)
+for (let [key, value] of mySet.entries()) console.log(key);
+
+// convert set to plain Array
+var myArr = Array.from(mySet); // [1, "some text"]
+
+// the following will also work if run in an HTML document
+mySet.add(document.body);
+mySet.has(document.querySelector("body")); // true
+
+// converting between Set and Array
+mySet2 = new Set([1,2,3,4]);
+mySet2.size; // 4
+[...mySet2]; // [1,2,3,4]
+
+// intersect can be simulated via
+var intersection = new Set([...set1].filter(x => set2.has(x)));
+
+// difference can be simulated via
+var difference = new Set([...set1].filter(x => !set2.has(x)));
+
+// Iterate set entries with forEach
+mySet.forEach(function(value) {
+  console.log(value);
+});
+
+// 1
+// 2
+// 3
+// 4
+ +

Gebräuchliche Set Operationen implementieren

+ +
function isSuperset(set, subset) {
+    for (var elem of subset) {
+        if (!set.has(elem)) {
+            return false;
+        }
+    }
+    return true;
+}
+
+function union(setA, setB) {
+    var _union = new Set(setA);
+    for (var elem of setB) {
+        _union.add(elem);
+    }
+    return _union;
+}
+
+function intersection(setA, setB) {
+    var _intersection = new Set();
+    for (var elem of setB) {
+        if (setA.has(elem)) {
+            _intersection.add(elem);
+        }
+    }
+    return _intersection;
+}
+
+function symmetricDifference(setA, setB) {
+    var _difference = new Set(setA);
+    for (var elem of setB) {
+        if (_difference.has(elem)) {
+            _difference.delete(elem);
+        } else {
+            _difference.add(elem);
+        }
+    }
+    return _difference;
+}
+
+function difference(setA, setB) {
+    var _difference = new Set(setA);
+    for (var elem of setB) {
+        _difference.delete(elem);
+    }
+    return _difference;
+}
+
+//Examples
+var setA = new Set([1, 2, 3, 4]),
+    setB = new Set([2, 3]),
+    setC = new Set([3, 4, 5, 6]);
+
+isSuperset(setA, setB); // => true
+union(setA, setC); // => Set [1, 2, 3, 4, 5, 6]
+intersection(setA, setC); // => Set [3, 4]
+symmetricDifference(setA, setC); // => Set [1, 2, 5, 6]
+difference(setA, setC); // => Set [1, 2]
+ +

Array und Set

+ +
var myArray = ["value1", "value2", "value3"];
+
+// Use the regular Set constructor to transform an Array into a Set
+var mySet = new Set(myArray);
+
+mySet.has("value1"); // returns true
+
+// Use the spread operator to transform a set into an Array.
+console.log([...mySet]); // Will show you exactly the same Array as myArray
+ +

Duplikate entfernen aus einem Array

+ +
// Use to remove duplicate elements from the array 
+
+const numbers = [2,3,4,4,2,3,3,4,4,5,5,6,6,7,5,32,3,4,5]
+
+console.log([...new Set(numbers)])
+
+// [2, 3, 4, 5, 6, 7, 32]
+ +

String und Set

+ +
var text = 'India';
+
+var mySet = new Set(text);  // Set ['I', 'n', 'd', 'i', 'a']
+mySet.size;  // 5
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-set-objects', 'Set')}}{{Spec2('ES6')}}Initial definition.
{{SpecName('ESDraft', '#sec-set-objects', 'Set')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Set")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/charat/index.html b/files/de/web/javascript/reference/global_objects/string/charat/index.html new file mode 100644 index 0000000000..815eb59bba --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/charat/index.html @@ -0,0 +1,305 @@ +--- +title: String.prototype.charAt() +slug: Web/JavaScript/Reference/Global_Objects/String/charAt +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/charAt +--- +
{{JSRef}}
+ +

Die charAt()-Methode gibt das Zeichen an einer bestimmten Stelle eines Strings wieder.

+ +

Syntax

+ +
str.charAt(index)
+ +

Parameter

+ +
+
index
+
Eine Zahl zwischen 0 und str.length-1. Ist kein index gegeben, ist dieser automatisch 0.
+
+ +

Wiedergegebener Wert

+ +

Ein String, der das Zeichen an der angegebenen index-Stelle wiedergibt. Wenn index außerhalb der Reichweite liegt, wird ein leerer String zurückgegeben.
+  

+ +

Beschreibung

+ +

Zeichen in einem String werden von links nach rechts indexiert. Der Index des ersten Zeichens ist 0, der Index des letzten Zeichens eines Strings namens stringName ist stringName.length - 1.

+ +

Wenn kein Index bereitgestellt wird, ist dieser standardmäßig 0.

+ +

Beispiele

+ +

Wiedergabe von Zeichen an verschiedenen Stellen eines Strings

+ +

Das folgende Beispiel gibt Zeichen an verschiedenen Orten im String "Brave new world" wieder:

+ +
var anyString = 'Brave new world';
+console.log("Das Zeichen bei Index 0   ist '" + anyString.charAt()   + "'");
+// kein Index definiert, 0 als Standard genutzt
+
+console.log("Das Zeichen bei Index 0   ist '" + anyString.charAt(0)   + "'");
+console.log("Das Zeichen bei Index 1   ist '" + anyString.charAt(1)   + "'");
+console.log("Das Zeichen bei Index 2   ist '" + anyString.charAt(2)   + "'");
+console.log("Das Zeichen bei Index 3   ist '" + anyString.charAt(3)   + "'");
+console.log("Das Zeichen bei Index 4   ist '" + anyString.charAt(4)   + "'");
+console.log("Das Zeichen bei Index 999 ist '" + anyString.charAt(999) + "'");
+
+ +

Diese Zeilen geben folgendes wieder:

+ +
Das Zeichen bei Index 0   ist 'B'
+Das Zeichen bei Index 0   ist 'B'
+Das Zeichen bei Index 1   ist 'r'
+Das Zeichen bei Index 2   ist 'a'
+Das Zeichen bei Index 3   ist 'v'
+Das Zeichen bei Index 4   ist 'e'
+Das Zeichen bei Index 999 ist ''
+
+ +

Erhalten von vollständigen Zeichen

+ +

Der folgende Code versichert, dass der Gebrauch eines String-Loops immer das vollständige Zeichen wiedergibt - auch wenn der String Zeichen enthält, die nicht auf der mehrsprachigen Basisebene (MBE) vorhanden sind.

+ +
var str = 'A \uD87E\uDC04 Z'; // direkter Einsatz von nicht MBE-Zeichen auch möglich
+for (var i = 0, chr; i < str.length; i++) {
+  if ((chr = getWholeChar(str, i)) === false) {
+    continue;
+  }
+  // Übernehme diese Zeile zu Beginn jedes Loops,
+  // gib den kompletten String und Iterator an
+  // und gebe eine Variable wieder, die das individuelle Zeichen wiederspiegelt.
+
+  console.log(chr);
+}
+
+function getWholeChar(str, i) {
+  var code = str.charCodeAt(i);
+
+  if (Number.isNaN(code)) {
+    return ''; // Position not found
+  }
+  if (code < 0xD800 || code > 0xDFFF) {
+    return str.charAt(i);
+  }
+
+  // High surrogate (could change last hex to 0xDB7F to treat high private
+  // surrogates as single characters)
+  if (0xD800 <= code && code <= 0xDBFF) {
+    if (str.length <= (i + 1)) {
+      throw 'High surrogate without following low surrogate';
+    }
+    var next = str.charCodeAt(i + 1);
+      if (0xDC00 > next || next > 0xDFFF) {
+        throw 'High surrogate without following low surrogate';
+      }
+      return str.charAt(i) + str.charAt(i + 1);
+  }
+  // Low surrogate (0xDC00 <= code && code <= 0xDFFF)
+  if (i === 0) {
+    throw 'Low surrogate without preceding high surrogate';
+  }
+  var prev = str.charCodeAt(i - 1);
+
+  // (could change last hex to 0xDB7F to treat high private
+  // surrogates as single characters)
+  if (0xD800 > prev || prev > 0xDBFF) {
+    throw 'Low surrogate without preceding high surrogate';
+  }
+  // We can pass over low surrogates now as the second component
+  // in a pair which we have already processed
+  return false;
+}
+
+ +

In einer ECMAScript 2016-Umgebung, welche destruktive Benennung erlaubt, ist eine bündigere und  zu gewissem Grad flexiblere Alternative möglich, da es automatisch eine Erhöhung der entsprechenden Variable vornimmt (wenn das Zeichen
+ ein Ersatzpaar ist).

+ +
var str = 'A\uD87E\uDC04Z'; // direkter Einsatz von nicht MBE-Zeichen auch möglich
+for (var i = 0, chr; i < str.length; i++) {
+  [chr, i] = getWholeCharAndI(str, i);
+  // Adapt this line at the top of each loop, passing in the whole string and
+  // the current iteration and returning an array with the individual character
+  // and 'i' value (only changed if a surrogate pair)
+  // Übernehme diese Zeile zu Beginn jedes Loops,
+  // gib den kompletten String und Iterator an
+  // und gebe einen Array wieder, der die individuellen Zeichen und 'i'-Wert wiederspiegelt
+  // (nur geändert, wenn Ersatzpaar).
+
+  console.log(chr);
+}
+
+function getWholeCharAndI(str, i) {
+  var code = str.charCodeAt(i);
+
+  if (Number.isNaN(code)) {
+    return ''; // Position nicht gefunden
+  }
+  if (code < 0xD800 || code > 0xDFFF) {
+    return [str.charAt(i), i]; // Normales Zeichen, 'i' bleibt gleich
+  }
+
+  // High surrogate (could change last hex to 0xDB7F to treat high private
+  // surrogates as single characters)
+  if (0xD800 <= code && code <= 0xDBFF) {
+    if (str.length <= (i + 1)) {
+      throw 'High surrogate without following low surrogate';
+    }
+    var next = str.charCodeAt(i + 1);
+      if (0xDC00 > next || next > 0xDFFF) {
+        throw 'High surrogate without following low surrogate';
+      }
+      return [str.charAt(i) + str.charAt(i + 1), i + 1];
+  }
+  // Low surrogate (0xDC00 <= code && code <= 0xDFFF)
+  if (i === 0) {
+    throw 'Low surrogate without preceding high surrogate';
+  }
+  var prev = str.charCodeAt(i - 1);
+
+  // (could change last hex to 0xDB7F to treat high private surrogates
+  // as single characters)
+  if (0xD800 > prev || prev > 0xDBFF) {
+    throw 'Low surrogate without preceding high surrogate';
+  }
+  // Return the next character instead (and increment)
+  return [str.charAt(i + 1), i + 1];
+}
+
+ +

Korrigiere charAt(), um Zeichen der nicht mehrsprachigen Basisebene (MBE) zu unterstützen

+ +


+  Das obige Beispiel dürfte häufiger für diejenigen hilfreich sein, die nicht MBE-Zeichen unterstützen möchten (da man nicht wissen muss, wo nicht MBE-Zeichen vorkommen).  Falls man wünscht (durch Angabe eines Indexwerts) die Ersatzpaare innerhalb eines Strings als Einzelcharakter zu behandeln, kann man folgendes nutzen:

+ +
function fixedCharAt(str, idx) {
+  var ret = '';
+  str += '';
+  var end = str.length;
+
+  var surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
+  while ((surrogatePairs.exec(str)) != null) {
+    var li = surrogatePairs.lastIndex;
+    if (li - 2 < idx) {
+      idx++;
+    } else {
+      break;
+    }
+  }
+
+  if (idx >= end || idx < 0) {
+    return '';
+  }
+
+  ret += str.charAt(idx);
+
+  if (/[\uD800-\uDBFF]/.test(ret) && /[\uDC00-\uDFFF]/.test(str.charAt(idx + 1))) {
+    // Gehe eins weiter, da eins der Zeichen Teil eines Ersatzpaares ist
+    ret += str.charAt(idx + 1);
+  }
+  return ret;
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}erste Definition
{{SpecName('ES5.1', '#sec-15.5.4.4', 'String.prototype.charAt')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.charat', 'String.prototype.charAt')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.charat', 'String.prototype.charAt')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Standardunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome für AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
 Standardunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/concat/index.html b/files/de/web/javascript/reference/global_objects/string/concat/index.html new file mode 100644 index 0000000000..548135330f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/concat/index.html @@ -0,0 +1,140 @@ +--- +title: String.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/String/concat +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/concat +--- +
{{JSRef}}
+ +

Die concat() Methode vereint den Text von einem oder mehreren Strings und gibt einen neuen String zurück.

+ +

Syntax

+ +
str.concat(string2[, string3, ..., stringN])
+ +

Parameters

+ +
+
string2...stringN
+
Strings die zu einem neuen String vereint werden sollen.
+
+ +

Rückgabewert

+ +

Ein neuer String, der die Texte der Strings hintereinander enthält.

+ +

Beschreibung

+ +

Die concat() Funktion kombiniert die Texte von einem oder mehreren Strings und gibt einen neuen String zurück. Das ändern des Textes eines Strings hat keine Auswirkungen auf die anderen Strings.

+ +

Beispiele

+ +

Einsatz von concat()

+ +

Das folgende Beispiel kombiniert Strings in einen neuen String.

+ +
var hello = 'Hello, ';
+console.log(hello.concat('Kevin', ' have a nice day.'));
+
+/* Hello, Kevin have a nice day. */
+
+ +

Performance

+ +

Es wird ausdrücklich empfohlen {{jsxref("Operators/Assignment_Operators", "Zuweisungsoperatoren", "", 1)}} (+, +=) statt der concat() Methode zu benutzen. Sie hierfür diesen Performancetest.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.5.4.6', 'String.prototype.concat')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.concat', 'String.prototype.concat')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.concat', 'String.prototype.concat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/endswith/index.html b/files/de/web/javascript/reference/global_objects/string/endswith/index.html new file mode 100644 index 0000000000..73f37a9692 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/endswith/index.html @@ -0,0 +1,148 @@ +--- +title: String.prototype.endsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/endsWith +tags: + - JavaScript + - Méthode + - Prototyp + - Referenz + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/endsWith +--- +
{{JSRef}}
+ +

Die Methode endsWith() bestimmt, ob ein String das Ende eines anderen Strings ist, und liefert entsprechend true oder false zurück.

+ +

Syntax

+ +
str.endsWith(suchString[, position])
+ +

Parameter

+ +
+
suchString
+
Der String, nach dem am Ende von str gesucht wird.
+
position
+
Optional. Durchsucht str, als wäre es nur position Zeichen lang. Standardmäßig wird die Länge von str benutzt, wird automatisch auf die Länge von str gebracht, falls diese überschritten wird.
+
+ +

Rückgabewert

+ +

Falls suchString das Ende von str ist, wird true zurückgeliefert, andernfalls wird false zurückgeliefert.

+ +

Beschreibung

+ +

Diese Methode bestimmt, ob ein String das Ende eines anderen Strings ist. Die Methode unterscheidet zwischen Groß- und Kleinschreibung.

+ +

Beispiele

+ +

Benutzung von endsWith()

+ +
var str = 'To be, or not to be, that is the question.';
+
+console.log(str.endsWith('question.')); // true
+console.log(str.endsWith('to be'));     // false
+console.log(str.endsWith('to be', 19)); // true
+
+ +

Polyfill

+ +

Diese Methode wurde der ECMAScript6-Spezifikation hinzugefügt und könnte noch nicht in allen JavaScript-Implementierungen verfügbar sein. Mithilfe des folgenden Code-Stücks kann die Methode auch bei fehlender Implementierung genutzt werden:

+ +
if (!String.prototype.endsWith) {
+  String.prototype.endsWith = function(searchString, position) {
+      var subjectString = this.toString();
+      if (typeof position !== 'number' || !isFinite(position) || Math.floor(position) !== position || position > subjectString.length) {
+        position = subjectString.length;
+      }
+      position -= searchString.length;
+      var lastIndex = subjectString.indexOf(searchString, position);
+      return lastIndex !== -1 && lastIndex === position;
+  };
+}
+
+ +

Spezifikation

+ + + + + + + + + + + + + + + + + + + +
SpecifikationStatusKommentar
{{SpecName('ES6', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)EdgeInternet ExplorerOperaSafari
Grundlegende Unterstützung{{CompatChrome("41")}}{{CompatGeckoDesktop("17")}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatSafari("9")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Grundlegende Unterstützung{{CompatNo}}{{CompatChrome("36")}}{{CompatGeckoMobile("17")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/fromcharcode/index.html b/files/de/web/javascript/reference/global_objects/string/fromcharcode/index.html new file mode 100644 index 0000000000..1ddc144e28 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/fromcharcode/index.html @@ -0,0 +1,134 @@ +--- +title: String.fromCharCode() +slug: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +--- +
{{JSRef}}
+ +

Die statische Methode String.fromCharCode() gibt einen String zurück, der mit der angegebenen Folge von Unicode-Zeichen erstellt wurde.

+ +

Syntax

+ +
String.fromCharCode(num1[, ...[, numN]])
+ +

Parameters

+ +
+
num1, ..., numN
+
Eine Folge von Zahlen als Unicode-Werte. Der Wertebreich liegt zwischen 0 und 65535 (0xFFFF). Zahlen, welche größer als 0xFFFF sind werden gekürzt.
+
+ +

Rückgabewert

+ +

Ein String, der die den Unicode-Werten zugeordneten Zeichen enthält.

+ +

Beschreibung

+ +

Diese Methode gibt einen String zurück und kein {{jsxref("String")}} Objekt.

+ +

Da fromCharCode() eine statische Methode von {{jsxref("String")}} ist, wird sie immer als String.fromCharCode() angewandt und nicht als Methode eines {{jsxref("String")}} Objekts, das erstellt wurde.

+ +

Beispiele

+ +

Verwendung von fromCharCode()

+ +
String.fromCharCode(65, 66, 67);   // gibt "ABC" zurück
+String.fromCharCode(0x2014);       // gibt "—" zurück
+String.fromCharCode(0x12014);      // gibt auch "—" zurück. Die Ziffer 1 wird weggekürzt und ignoriert.
+ +

Verwendung mit höheren Werten

+ +

Die meisten Unicode-Werte können mit einer 16-bit-Nummer dargestellt werden (wie in den Anfängen der JavaScript-Standardisierung erwartet) und fromCharCode() kann verwendet werden, um ein einzelnes Zeichen für die meisten gängigen Werde (d.h. UCS-2 Werte, die ein Subset von UTF-16 mit den am häufigsten vorkommenden Zeichen bilden) darzustellen. Um jedoch ALLE gültigen Unicode-Werte (bis zu 21 bits) darzustellen, ist fromCharCode() allein nicht ausreichend. Da die höheren Code Point Zeichen zwei "Ersatznummern" (mit niedrigerem Wert) verwenden, um ein einzelnes Zeichen darzustellen, kann {{jsxref("String.fromCodePoint()")}} (Teil des ES2015 Standards) verwendet werden, um ein solches Paar und damit auch diese Zeichen mit höheren Werten darzustellen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Erstdefinition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.5.3.2', 'StringfromCharCode')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.fromcharcodes', 'String.fromCharCode')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.fromcharcodes', 'String.fromCharCode')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/includes/index.html b/files/de/web/javascript/reference/global_objects/string/includes/index.html new file mode 100644 index 0000000000..ee3aa6564c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/includes/index.html @@ -0,0 +1,131 @@ +--- +title: String.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/String/includes +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/includes +--- +
{{JSRef}}
+ +

Die includes()-Methode gibt an, ob ein String innerhalb eines anderen Strings gefunden wird und gibt dabei true oder false wieder.

+ +

Syntax

+ +
str.includes(searchString[, position])
+ +

Parameter

+ +
+
searchString
+
Ein String, der innerhalb eines anderen Strings gesucht wird.
+
position
+
Optional. Die Position innerhalb des besuchten Strings durch searchString; Standard ist 0.
+
+ +

Wertwiedergabe

+ +

true, wenn der String den gesuchten String enthält, andernfalls false.

+ +

Beschreibung

+ +

Diese Methode lässt dich feststellen, ob ein String einen anderen String beinhaltet.

+ +

Achtung auf Groß-, Kleinschreibung

+ +

Bei der includes()-Methode muss auf Groß- und Kleinschreibung geachtet werden.
+ Zum Beispiel gibt die folgende Darstellung false aus:

+ +
'Blue Whale'.includes('blue'); // gibt false wieder
+
+ +

Beispiele

+ +

Einsatz von includes()

+ +
var str = 'Sein oder nicht sein, das ist hier die Frage.';
+
+console.log(str.includes('Sein'));        // true
+console.log(str.includes('Frage'));       // true
+console.log(str.includes('nicht da'));    // false
+console.log(str.includes('Sein', 1));     // false
+console.log(str.includes('SEIN'));        // false
+
+ +

Polyfill

+ +

Diese Methode wurde den ECMAScript 6 Spezifikationen hinzugefügt und könnte nicht in allen JavaScript-Umgebunden vorhanden sein. Jedoch kann man diesen Polyfill nutzen:

+ +
if (!String.prototype.includes) {
+  String.prototype.includes = function(search, start) {
+    'use strict';
+    if (typeof start !== 'number') {
+      start = 0;
+    }
+
+    if (start + search.length > this.length) {
+      return false;
+    } else {
+      return this.indexOf(search, start) !== -1;
+    }
+  };
+}
+
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationenStatusKommentar
{{SpecName('ES2015', '#sec-string.prototype.includes', 'String.prototype.includes')}}{{Spec2('ES2015')}}erste Definition
{{SpecName('ESDraft', '#sec-string.prototype.includes', 'String.prototype.includes')}}{{Spec2('ESDraft')}}
+ +

Browser-Kompatibilität

+ + + +

{{Compat("javascript.builtins.String.includes")}}

+ +

String.prototype.contains

+ +

In Firefox 18 - 39 hieß diese Methode contains(). Es wurde zu includes() ({{bug(1102219)}}) wegen folgender Gründe umbenannt:
+
+ Es wurde gemeldet, dass manche Webseiten, die MooTools 1.2 nutzen mit Firefox 17 nicht mehr funktionieren. Diese Version von MooTools kontrolliert, ob String.prototype.contains() existiert und, wenn nicht, fügt es seine eigene Funktion hinzu.
+ Mit der Einführung dieser Funktion in Firefox 17 wurde das Verhalten dieser Kontrolle geändert, sodass auf MooTools String.prototype.contains() basierender Code funktionsunfähig wurde.
+ Aufgrund dessen wurde die Implementierung in Firefox 17 abgeschaltet und String.prototype.contains() war in Firefox 18 nutzbar. Ermöglicht wurde dies durch die Veröffentlichung von MooTools Version 1.2.6.

+ +

MooTools 1.3 erzwingt die Nutzung der eigenen Version von String.prototype.contains(), demnach sollten Webseiten, die abhängig davon sind, weiterhin funktionieren. Beachte jedoch, dass sich die MooTools 1.3 Signatur von der ECMAScript 6 Signatur für diese Methode unterscheidet.

+ +

Später änderte MooTools 1.5+ die Signatur, um sie dem ES2015 Standard anzupassen.

+ +


+ In Firefox 48 wurde String.prototype.contains() entfernt. Nutze lediglich String.prototype.includes().

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/index.html b/files/de/web/javascript/reference/global_objects/string/index.html new file mode 100644 index 0000000000..35faef0223 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/index.html @@ -0,0 +1,310 @@ +--- +title: String +slug: Web/JavaScript/Reference/Global_Objects/String +tags: + - ECMAScript 2015 + - JavaScript + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String +--- +
{{JSRef}}
+ +

Das globale String-Objekt ist ein Konstruktor für Strings, auch Zeichenketten genannt.

+ +

Syntax

+ +

String-Literale haben folgende Formen:

+ +
'string-text'
+"string-text"
+"中文 español deutsch English हिन्दी العربية português বাংলা русский 日本語 ਪੰਜਾਬੀ 한국어 தமிழ்"
+ +

Strings können auch direkt mit dem globalen String-Objekt erzeugt werden:

+ +
String(thing)
+ +

Parameter

+ +
+
thing
+
Alles, was in einen String umgewandelt werden kann.
+
+ +

Template-Literale

+ +

Ab ECMAScript 2015 können String-Literale auch durch sogenannte Template-Literale verkörpert werden:

+ +
`hallo welt`
+`hallo!
+ welt!`
+`hallo ${wer}`
+escape `${wer}`
+ +
+
+ +

Escape-Notation

+ +

Neben gewöhnlichen, druckbaren Zeichen gibt es Sonderzeichen, die mittels Escape-Notation kodiert werden können:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
CodeAusgabe
\0das NULL-Zeichen
\'einfaches Anführungszeichen
\"doppeltes Anführungszeichen
\\Rückwärtsschrägstrich (backslash)
\nZeilenumbruch (new line)
\rZeilenanfang (carriage return)
\vvertikaler Tabulator
\tTabulator
\bBackspace
\fSeitenvorschub (form feed)
\uXXXXUnicode-Codepoint
\u{X} ... \u{XXXXXX}Unicode-Codepoint {{experimental_inline}}
\xXXLatin-1-Zeichen
+ +
+

Im Gegensatz zu einigen anderen Sprachen unterscheidet JavaScript nicht zwischen mit einfachen und doppelten Anführungszeichen versehenen Strings; deswegen funktionieren die obigen Escape-Sequenzen in Strings, die entweder mit einfachen oder doppelten Anführungszeichen erstellt wurden.

+
+ +
+
+ +

Lange String-Literale

+ +

Manchmal enthält der Programm-Code Strings, die sehr lang sind. Anstatt endlose Zeilen zu bewirken, die vielleicht am Rand des Editors umbrechen, kann ein String ausdrücklich in mehrere Zeilen im Quell-Code eingepasst werden, ohne seinen Inhalt zu beeinflussen. Es gibt zwei Arten, um das zu tun.

+ +

Es kann der +-Operator benutzt werden, um auf folgende Weise mehrere Strings aneinanderzuhängen:

+ +
let langerString = "Dies ist ein sehr langer String, der über " +
+                 "mehrere Zeilen verteilt werden muss, weil " +
+                 "sonst der Code unleserlich ist.";
+
+ +

Oder der Rückwärtsschrägstrich ("\") wird am Ende jeder Zeile benutzt, um anzugeben, dass der String in der nächsten Zeile weitergeht. Es sollte sichergestellt werden, dass nach dem Rückwärtsschrägstrich (backslash) kein Leer- oder ein anderes Zeichen (außer ein Zeilenumbruch) steht oder als Einrückung dient; sonst funktioniert es nicht. Diese Form sieht wie folgt aus:

+ +
let langerString = "Dies ist ein sehr langer String, der über \
+mehrere Zeilen verteilt werden muss, weil \
+sonst der Code unleserlich ist.";
+
+ +

Beide Arten erzeugen identische Strings.

+ +

Beschreibung

+ +

Strings sind nützlich, um Daten in Textform zu speichern. Manche der meist benutzten String-Operationen sind es, die {{jsxref("String.length", "length")}} abzufragen, Strings mittels + und += String-Operatoren zu verbinden, mit der {{jsxref("String.prototype.indexOf()", "indexOf()")}} -Methode die Existenz oder Position von Sub-Strings festzustellen oder Sub-Strings mit der {{jsxref("String.prototype.substring()", "substring()")}}-Methode zu extrahieren.

+ +

Zeichenabfrage

+ +

Es gibt zwei Möglichkeiten auf ein einzelnes Zeichen in einem String zuzugreifen. Die erste ist die {{jsxref("String.prototype.charAt()", "charAt()")}}-Methode:

+ +
return 'Katze'.charAt(1); // gibt "a" zurück
+
+ +

Die andere Möglichkeit (eingeführt in ECMAScript 5) ist, den String als ein Array-ähnliches Objekt zu behandlen, in dem einzelne Zeichen zu einem numerischen Index gehören:

+ +
return 'Katze'[1]; // gibt "a" zurück
+
+ +

Bei einen Zeichenzugriff mittels Klammernotation ist es nicht möglich, einen Wert zu löschen oder zuzuweisen. Die entsprechenden Eigenschaften sind weder überschreibbar noch konfigurierbar. (Siehe {{jsxref("Object.defineProperty()")}} für mehr Informationen.)

+ +

Strings vergleichen

+ +

C-Entwicklern steht die strcmp()-Funktion zur Verfügung, um Strings zu vergleichen. In JavaScript können die kleiner-als- und größer-als-Operatoren benutzt werden:

+ +
var a = 'a';
+var b = 'b';
+if (a < b) { // true
+  console.log(a + ' ist geringer als ' + b);
+} else if (a > b) {
+  console.log(a + ' ist größer als ' + b);
+} else {
+  console.log(a + ' und ' + b + ' sind gleich.');
+}
+
+ +

Ein ähnliches Ergebnis kann durch die {{jsxref("String.prototype.localeCompare()", "localeCompare()")}}-Methode erzielt werden, die von String-Instanzen übernommen wird.

+ +

Unterscheidung von String-Primitives und String-Objekten

+ +

Es ist zu betonen, dass JavaScript zwischen String-Objekten und primitiven String-Werten unterscheidet. (Das selbe gilt für {{jsxref("Boolean")}} und {{jsxref("Global_Objects/Number", "Numbers")}}.)

+ +

String-Literale (definiert mit doppelten oder einfachen Anführungszeichen) und Strings, die von String-Aufrufen in einem Nicht-Konstruktor-Kontext (z. B. ohne das {{jsxref("Operators/new", "new")}}-Schlüsselwort zu benutzen) zurückgegeben werden, sind String-Primitives. JavaScript wandelt automatisch Primitives zu String-Objekten um, so dass es möglich ist String-Objekt-Methoden für String-Primitives zu nutzen. In Kontexten, in denen eine Methode auf ein String-Primitive bezogen aufgerufen oder eine Eigenschaft eines solchen abgefragt wird, sorgt JavaScript dafür, dass das String-Primitive wie ein Objekt behandelt wird.

+ +
var s_prim = 'foo';
+var s_obj = new String(s_prim);
+
+console.log(typeof s_prim); // Loggt "string"
+console.log(typeof s_obj);  // Loggt "object"
+
+ +

String-Primitives und String-Objekte führen auch bei der Nutzung von {{jsxref("Global_Objects/eval", "eval()")}} zu unterschiedlichen Ergebnissen. An eval übergebene Primitives werden als Quell-Code behandelt; bei String-Objekten wird wie bei allen anderen Objekten das Objekt zurückgegeben. Zum Beispiel:

+ +
var s1 = '2 + 2';             // erzeugt ein String-Primitive
+var s2 = new String('2 + 2'); // erzeugt ein String-Objekt
+console.log(eval(s1));        // gibt die Zahl 4 zurück
+console.log(eval(s2));        // gibt den String "2 + 2" zurück
+
+ +

Aus diesen Gründen kann Code aufhören zu funktionieren, wenn er String-Objekte bemerkt, obwohl ein String-Primitive erwartet wird. Trotzdem brauchen sich Autoren normalerweise nicht um diesen Unterschied zu kümmern.

+ +

Ein String-Objekt kann mit der {{jsxref("String.prototype.valueOf()", "valueOf()")}}-Methode immer zu seiner Primitive-Entsprechung konvertiert werden.

+ +
console.log(eval(s2.valueOf())); // gibt die Zahl 4 zurück
+
+ +
Bemerkung: Für ein weiteres mögliches Herantreten an Strings in JavaScript sollte der Artikel über StringView — eine C-ähnliche Representation von Strings basierend auf typisierten Arrays gelesen werden.
+ +

Eigenschaften

+ +
+
{{jsxref("String.prototype")}}
+
Ermöglicht das Hinzufügen von Eigenschaften zu einem String-Objekt.
+
+ +

Methoden

+ +
+
{{jsxref("String.fromCharCode()")}}
+
Gibt einen String zurück, der auf Basis der angegebenen Folge von Unicode-Werten erstellt wurde.
+
{{jsxref("String.fromCodePoint()")}} {{experimental_inline}}
+
Gibt einen String zurück, der auf Basis der angegebenen Folge von Code-Points erstellt wurde.
+
{{jsxref("String.raw()")}} {{experimental_inline}}
+
Gibt einen String zurück, der auf Basis eines Raw-Template-Strings erstellt wurde.
+
+ +

Generische String-Methoden

+ +
+

Generische String-Methoden sind nicht Teil des Standards und werden in naher Zukunft entfernt.

+
+ +

Die String-Instanzmethoden stehen nach JavaScript 1.6 (nicht Teil des ECMAScript-Standards) auch in Firefox beim String-Objekt zur Verfügung, um String-Methoden auf ein beliebiges Objekt anzuwenden:

+ +
var num = 15;
+console.log(String.replace(num, /5/, '2'));
+
+ +

Über die Auflösung von generischen String-Methoden: Warning: String.x is deprecated; use String.prototype.x instead.

+ +

{{jsxref("Global_Objects/Array", "Generics", "#Array_generic_methods", 1)}} stehen auch bei {{jsxref("Array")}}-Methoden zur Verfügung.

+ +

String-Instanzen

+ +

Eigenschaften

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype', 'Properties')}}
+ +

Methoden

+ +

Nicht HTML-bezogene Methoden

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype', 'Methods_unrelated_to_HTML')}}
+ +

HTML-Wrapper-Methoden

+ +
{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype', 'HTML_wrapper_methods')}}
+ +

Beispiele

+ +

String-Konvertierung

+ +

Es ist möglich, String als eine "sicherere" {{jsxref("String.prototype.toString()", "toString()")}}-Alternative zu benutzen, auch, wenn es gewöhnlich weiterhin das zugrundeliegende toString() aufruft. Es funktioniert auch für {{jsxref("null")}}, {{jsxref("undefined")}} und {{jsxref("Symbol", "symbols")}}. Zum Beispiel:

+ +
var ausgabeStrings = [];
+for (var i = 0, n = eingabeWerte.length; i < n; ++i) {
+  ausgabeStrings.push(String(eingabeWerte[i]));
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusAnmerkung
{{SpecName('ES1')}}{{Spec2('ES1')}}Anfängliche Definition
{{SpecName('ES5.1', '#sec-15.5', 'String')}}{{Spec2('ES5.1')}} 
{{SpecName('ES2015', '#sec-string-objects', 'String')}}{{Spec2('ES2015')}} 
{{SpecName('ESDraft', '#sec-string-objects', 'String')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +

{{Compat("javascript.builtins.String.String")}}

+ +

Siehe außerdem

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/indexof/index.html b/files/de/web/javascript/reference/global_objects/string/indexof/index.html new file mode 100644 index 0000000000..dc36abfae8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/indexof/index.html @@ -0,0 +1,200 @@ +--- +title: String.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/indexOf +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/indexOf +--- +
{{JSRef}}
+ +

Die indexOf() Methode gibt den Index der Zeichenkette innerhalb des aufrufenden {{jsxref("Global_Objects/String", "String")}} Objekts des ersten Vorkommnis des angegebenen Wertes beginnend bei fromIndex zurück. Gibt -1 zurück, wenn der Wert nicht gefunden wurde.

+ +

Syntax

+ +
str.indexOf(searchValue[, fromIndex])
+ +

Parameter

+ +
+
searchValue
+
Ein String der den zu suchenden Wert repräsentiert.
+
fromIndex {{optional_inline}}
+
Der Index, von dem angefangen wird vorwärts im String zu suchen. Der Standardwert ist 0, so dass der ganze String durchsucht wird. Wenn fromIndex < 0 ist, wird der ganze String durchsucht. Wenn  fromIndex >= str.length ist, wird der String nicht durchsucht und -1 wird zurückgegeben. Die Ausnahme ist, wenn für searchValue ein leeren String eingesetzt wird, dann wird str.length zurückgegeben.
+
+ +

Rückgabewert

+ +

Den Index des ersten Vorkommens des gesuchten Wertes; -1 wenn der Wert nicht gefunden wurde.

+ +

Beschreibung

+ +

Die Zeichen in einem String sind von links nach rechts nummeriert. Der Index des ersten Zeichens ist 0, und der Index des letzten Zeichens eines Strings mit Namen stringName ist stringName.length - 1.

+ +
'Blue Whale'.indexOf('Blue');     // returns  0
+'Blue Whale'.indexOf('Blute');    // returns -1
+'Blue Whale'.indexOf('Whale', 0); // returns  5
+'Blue Whale'.indexOf('Whale', 5); // returns  5
+'Blue Whale'.indexOf('', 9);      // returns  9
+'Blue Whale'.indexOf('', 10);     // returns 10
+'Blue Whale'.indexOf('', 11);     // returns 10
+
+ +

Groß- und Kleinschreibung

+ +

Die indexOf() Methode unterscheidet zwischen Groß- und Kleinschreibung. Zum Beispiel gibt die folgende Zeile -1 zurück:

+ +
'Blue Whale'.indexOf('blue'); // returns -1
+
+ +

Vorkommnisse prüfen

+ +

Zu beachten ist, dass '0' nicht zu true und '-1' nicht zu false ausgewertet wird. Deswegen ist der korrekte weg zum überprüfen, ob ein String in einem anderen String existiert, der folgende:

+ +
'Blue Whale'.indexOf('Blue') != -1; // true
+'Blue Whale'.indexOf('Bloe') != -1; // false
+
+ +

Beispiele

+ +

Einsatz von indexOf() und lastIndexOf()

+ +

Die folgenden Beispiele benutzen indexOf() und {{jsxref("String.prototype.lastIndexOf()", "lastIndexOf()")}}, um Werte im String "Brave new world" zu finden.

+ +
var anyString = 'Brave new world';
+
+console.log('The index of the first w from the beginning is ' + anyString.indexOf('w'));
+// Displays 8
+console.log('The index of the first w from the end is ' + anyString.lastIndexOf('w'));
+// Displays 10
+
+console.log('The index of "new" from the beginning is ' + anyString.indexOf('new'));
+// Displays 6
+console.log('The index of "new" from the end is ' + anyString.lastIndexOf('new'));
+// Displays 6
+
+ +

indexOf() und Groß- und Kleinschreibung

+ +

Das folgende Beispiel definiert zwei Strings. Die Variablen enthalten den selben String, außer dass der zweite String Großbuchstaben enthält. Die erste {{domxref("console.log()")}} Methode zeigt 19. Da die indexOf() Methode Groß- und Kleinschreibung unterscheidet, wird der String"cheddar" im String myCapString nicht gefunden. Deshalb gibt die zweite console.log() Methode -1 zurück.

+ +
var myString    = 'brie, pepper jack, cheddar';
+var myCapString = 'Brie, Pepper Jack, Cheddar';
+
+console.log('myString.indexOf("cheddar") is ' + myString.indexOf('cheddar'));
+// Displays 19
+console.log('myCapString.indexOf("cheddar") is ' + myCapString.indexOf('cheddar'));
+// Displays -1
+
+ +

Einsatz von indexOf(), um das Vorkommen eines Buchstaben in einem String zu zählen

+ +

Das folgende Beispiel setzt count auf die Anzahl der Vorkommnisse des Buchstaben e in dem String str:

+ +
var str = 'To be, or not to be, that is the question.';
+var count = 0;
+var pos = str.indexOf('e');
+
+while (pos != -1) {
+  count++;
+  pos = str.indexOf('e', pos + 1);
+}
+
+console.log(count); // displays 4
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.5.4.7', 'String.prototype.indexOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.indexof', 'String.prototype.indexOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.indexof', 'String.prototype.indexOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/lastindexof/index.html b/files/de/web/javascript/reference/global_objects/string/lastindexof/index.html new file mode 100644 index 0000000000..b6c6f3a548 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/lastindexof/index.html @@ -0,0 +1,148 @@ +--- +title: String.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +--- +
{{JSRef("Global_Objects", "String")}}
+ +

Zusammenfassung

+ +

Die lastIndexOf() Methode gibt den Index des letzten Vorkommnisses des angegebenen Wertes innerhalb des aufrufenden {{jsxref("Global_Objects/String", "Strings")}} Objekts zurück, oder -1, wenn der Wert nicht gefunden wurde. Der aufrufende String wird rückwärts durchsucht, beginnend beim fromIndex

+ +

Syntax

+ +
str.lastIndexOf(searchValue[, fromIndex])
+ +

Parameter

+ +
+
searchValue
+
Ein String mit dem Wert, nach dem gesucht werden soll.
+
fromIndex
+
Optional. Die Position im aufrufenden String, ab der gesucht rückwärts werden soll. The Position wird gezählt von links nach rechts. Gesucht wird von dieser Position ab nach links. Diese kann jeden Integerwert annehmen. Der Standartwert ist str.length. Wenn der Wert negativ ist, wird 0 verwendet. Wenn fromIndex > str.length, wird str.length statt fromIndex benutzt.
+
+ +

Beschreibung

+ +

Zeichen in einem String werden von links nach rechts gezählt. Der Index des ersten Zeichens ist 0, der Index des letzten Zeichens ist stringName.length - 1.

+ +
'canal'.lastIndexOf('a');     // returns 3
+'canal'.lastIndexOf('a', 2);  // returns 1
+'canal'.lastIndexOf('a', 0);  // returns -1
+'canal'.lastIndexOf('x');     // returns -1
+
+ +

Groß- und Kleinschreibung

+ +

Die lastIndexOf() Methode unterscheidet zwischen Groß- und Kleinschreibung. Der folgende Ausdruck gibt zum Beispiel -1 zurück.

+ +
'Blue Whale, Killer Whale'.lastIndexOf('blue'); // returns -1
+
+ +

Beispiele

+ +

Beispiel: Benutzung von indexOf() und lastIndexOf()

+ +

Das folgende Beispiel verwendet {{jsxref("String.prototype.indexOf()", "indexOf()")}} und lastIndexOf(), um Werte im String "Brave new world" zu finden.

+ +
var anyString = 'Brave new world';
+
+console.log('The index of the first w from the beginning is ' + anyString.indexOf('w'));
+// Displays 8
+console.log('The index of the first w from the end is ' + anyString.lastIndexOf('w'));
+// Displays 10
+
+console.log('The index of "new" from the beginning is ' + anyString.indexOf('new'));
+// Displays 6
+console.log('The index of "new" from the end is ' + anyString.lastIndexOf('new'));
+// Displays 6
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
ECMAScript 1st Edition.StandardInitial definition.
{{SpecName('ES5.1', '#sec-15.5.4.8', 'String.prototype.lastIndexOf')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.lastindexof', 'String.prototype.lastIndexOf')}}{{Spec2('ES6')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Links

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/length/index.html b/files/de/web/javascript/reference/global_objects/string/length/index.html new file mode 100644 index 0000000000..555d22094a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/length/index.html @@ -0,0 +1,87 @@ +--- +title: String.length +slug: Web/JavaScript/Reference/Global_Objects/String/length +tags: + - JavaScript + - Property + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/length +--- +
{{JSRef}}
+ +

Die length Eigenschaft repräsentiert die Länge eines Strings.

+ +

Syntax

+ +
str.length
+ +

Beschreibung

+ +

Die length Eigenschaft gibt die Anzahl der Codeteile des Strings zurück. Javascript verwendet {{interwiki("wikipedia", "UTF-16")}}. , also einen 16-Bit Code zur Kodierung der meisten Zeichen, aber zur Darstellung weniger verbreiteter Zeichen werden 2 Codes benötigt. Es ist also durchaus möglich, dass der zurückgegebene Wert nicht der Anzahl der Zeichen in einem String entspricht.

+ +

ECMAScript 2016 (ed. 7) Spezifikation definiert eine maximale Länge von 253 - 1 Elementen.
+ Vor dieser Spezifikation war keine maximale Länge an Elementen definiert.

+ +

Ein leerer String hat die Länge 0.

+ +

Die statische String-Eigenschaft gibt den Wert 1 zurück.

+ +

Beispiele

+ +

Grundlegende Nutzung

+ +
var str = 'Mozilla';
+var leerstr = '';
+
+console.log('Mozilla ist ' + str.length + ' Zeichen lang');
+/* "Mozilla ist 7 Zeichen lang" */
+
+console.log('Der leere String hat eine Länge von ' + leerstr.length + 'Zeichen');
+/* "Der leere String hat eine Länge von 0 Zeichen" */
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Deinition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.5.5.1', 'String.prototype.length')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.length")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/match/index.html b/files/de/web/javascript/reference/global_objects/string/match/index.html new file mode 100644 index 0000000000..27bfac9c75 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/match/index.html @@ -0,0 +1,140 @@ +--- +title: String.prototype.match() +slug: Web/JavaScript/Reference/Global_Objects/String/match +tags: + - JavaScript + - Method + - Property + - Reference + - Regular Expression + - String + - match + - Übereinstimmung +translation_of: Web/JavaScript/Reference/Global_Objects/String/match +--- +
{{JSRef}}
+ +

match() gibt zurück, wo ein regulärer Ausdruck in einem String enthalten ist. 

+ +

Syntax

+ +
str.match(regexp)
+ +

Parameter

+ +
+
regexp
+
Ein regulärer Ausdruck. Falls regexp kein Objekt vom Typ {{jsxref("RegExp")}} ist wird es mit Hilfe von new RegExp(obj) konvertiert. Falls dieser Parameter nicht übergeben wird, wird ein {{jsxref("Array")}} mit einem leeren {{jsxref("String")}} zurückgegben: [""].
+
+ +

Rückgabewert

+ +

Es wird ein {{jsxref("Array")}} zurückgegeben, das als erstes Element den gesamten übereinstimmenden String enthält, gefolgt von allen weiteren Treffern, die in Klammern angegeben wurden. Falls keine Übereinstimmungen gefunden wurden, wird {{jsxref("null")}} zurückgegeben.

+ +

Beschreibung

+ +

Falls der reguläre Ausdruck nicht den Modifikator g enthält, verhält sich match() wie {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}}. Im zurückgegebenen {{jsxref("Array")}} sind zusätzlich die propertys input und index  enthalten. input ist gleich dem zu durchsuchenden String, index enthält den Index der Übereinstimmung.

+ +

Falls der g Modifikator im regulären Ausdruck enthalten ist, wird ein {{jsxref("Array")}} mit allen übereinstimmenden Substrings zurückgegeben.

+ +

Beispiele

+ +

Verwendung von match()

+ +

Im folgenden Beispiel wird match() verwendet um 'Kapitel' und anschließend eine oder mehrere Zahlen, gefolgt von einem Punkt und einer Zahl, 0 oder mehrmals zu finden. Der reguläre Ausdruck enthält den i Modifikator und unterscheidet somit nicht zwischen Groß- und Kleinschreibung.

+ +
var str = 'Fuer mehr Informationen siehe Kapitel 3.4.5.1';
+var re = /siehe (kapitel \d+(\.\d)*)/i;
+var found = str.match(re);
+
+console.log(found);
+
+// gibt folgendes auf der Konsole aus:
+//   [ 'siehe Kapitel 3.4.5.1',
+//     'Kapitel 3.4.5.1',
+//     '.1',
+//     index: 22,
+//     input: 'Fuer mehr Informationen siehe Kapitel 3.4.5.1' ]
+
+ +

Verwendung von match() mit den i und g Modifikatoren

+ +

Die Buchstaben von A - E und von a - e werden auf der Konsole ausgegeben.

+ +
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
+var regexp = /[A-E]/gi;
+var matches_array = str.match(regexp);
+
+console.log(matches_array);
+// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']
+
+ +

match() ohne Parameter

+ +
var str = "Nichts kommt von nichts.";
+
+str.match();
+// [""]
+ +

Verwendung mit einem nicht regulären Ausdruck

+ +

Falls ein String oder eine Zahl anstatt eines regulären Ausdrucks übergeben wird, wird der Parameter in einen {{jsxref("RegExp", "regulären Ausdruck")}} konvertiert. Ist es eine positive Zahl mit Vorzeichen, wird das positive Vorzeichen ignoriert.

+ +
var str1 = "NaN bedeutet not a number. Infinity enthält -Infinity and +Infinity in JavaScript.",
+    str2 = "Zahlen: 1, 6, 3",
+    str3 = "null ist ein Datentyp.";
+
+str1.match("number");   // ["number"]
+str1.match(NaN);        // ["NaN"]
+str1.match(Infinity);   // ["Infinity"]
+str1.match(+Infinity);  // ["Infinity"]
+str1.match(-Infinity);  // ["-Infinity"]
+str2.match(6);          // ["6"]
+str2.match(+3);         // ["3"]
+str3.match(null);       // ["null"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusExtras
{{SpecName('ES3')}}{{Spec2('ES3')}}Anfangsdefinition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.5.4.10', 'String.prototype.match')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-string.prototype.match', 'String.prototype.match')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-string.prototype.match', 'String.prototype.match')}}{{Spec2('ESDraft')}}
+ +

Browser-Kompatibilität

+ + + +

{{Compat("javascript.builtins.String.match")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/prototype/index.html b/files/de/web/javascript/reference/global_objects/string/prototype/index.html new file mode 100644 index 0000000000..e2c896b98d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/prototype/index.html @@ -0,0 +1,189 @@ +--- +title: String.prototype +slug: Web/JavaScript/Reference/Global_Objects/String/prototype +tags: + - Eigentum + - JavaScript + - Prototyp + - Referenz + - Strang + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String +--- +
{{JSRef}}
+ +

Die String.prototypeEigenschaft repräsentiert das Prototypobjekt {{jsxref ("String")}}.

+ +
{{js_property_attributes(0, 0, 0)}}
+ +

Beschreibung

+ +

Alle {{jsxref ("String")}} Instanzen erben von String.prototypeÄnderungen am StringPrototypobjekt werden an alle Instanzen von {{jsxref ("String")}} weitergegeben.

+ +

Eigenschaften

+ +
+
String.prototype.constructor
+
Gibt die Funktion an, mit der der Prototyp eines Objekts erstellt wird.
+
{{jsxref ("String.prototype.length")}}
+
Reflektiert die Länge der Zeichenfolge.
+
N
+
Wird verwendet, um auf das Zeichen an der N- ten Position zuzugreifen, wobei N eine ganze Zahl zwischen 0 und eins ist, die kleiner als der Wert von {{jsxref ("String.length", "length")} ist. Diese Eigenschaften sind schreibgeschützt.
+
+ +

Methods

+ +

Methoden

+ +

Methoden, die nichts mit HTML zu tun haben

+ +
+
{{jsxref ("String.prototype.charAt ()")}}
+
Gibt das Zeichen (genau eine UTF-16-Codeeinheit) am angegebenen Index zurück.
+
{{jsxref ("String.prototype.charCodeAt ()")}}
+
Gibt eine Zahl zurück, die der UTF-16-Code-Einheitswert am angegebenen Index ist.
+
{{jsxref ("String.prototype.codePointAt ()")}}
+
Gibt eine nicht negative Ganzzahl zurück, die der Codepunktwert des UTF-16-codierten Codepunkts ab dem angegebenen Index ist.
+
{{jsxref ("String.prototype.concat ()")}}
+
Kombiniert den Text zweier Zeichenfolgen und gibt eine neue Zeichenfolge zurück.
+
{{jsxref ("String.prototype.includes ()")}}
+
Legt fest, ob eine Zeichenfolge in einer anderen Zeichenfolge gefunden werden darf.
+
{{jsxref ("String.prototype.endsWith ()")}}
+
Bestimmt, ob eine Zeichenfolge mit den Zeichen einer anderen Zeichenfolge endet.
+
{{jsxref ("String.prototype.indexOf ()")}}
+
Gibt den Index innerhalb des aufrufenden {{jsxref ("String")}} Objekts des ersten Vorkommens des angegebenen Werts zurück oder -1, falls nicht gefunden.
+
{{jsxref ("String.prototype.lastIndexOf ()")}}
+
Gibt den Index innerhalb des aufrufenden {{jsxref ("String")}} Objekts des letzten Vorkommens des angegebenen Werts zurück oder -1, falls nicht gefunden.
+
{{jsxref ("String.prototype.localeCompare ()")}}
+
Gibt eine Zahl zurück, die angibt, ob eine Referenzzeichenfolge vor oder nach der angegebenen Zeichenfolge in Sortierreihenfolge steht oder mit dieser übereinstimmt.
+
{{jsxref ("String.prototype.match ()")}}
+
Wird verwendet, um einen regulären Ausdruck mit einer Zeichenfolge abzugleichen.
+
{{jsxref ("String.prototype.matchAll ()")}}
+
Gibt einen Iterator aller Übereinstimmungen zurück.
+
{{jsxref ("String.prototype.normalize ()")}}
+
Gibt die Unicode-Normalisierungsform des aufrufenden Zeichenfolgenwerts zurück.
+
{{jsxref ("String.prototype.padEnd ()")}}
+
Füllt die aktuelle Zeichenfolge am Ende mit einer bestimmten Zeichenfolge auf, um aus einer bestimmten Länge eine neue Zeichenfolge zu erstellen.
+
{{jsxref ("String.prototype.padStart ()")}}
+
Füllt die aktuelle Zeichenfolge von Anfang an mit einer bestimmten Zeichenfolge auf, um aus einer bestimmten Länge eine neue Zeichenfolge zu erstellen.
+
{{jsxref ("String.prototype.quote ()")}} {{obsolete_inline}}
+
Umschließt die Zeichenfolge in doppelte Anführungszeichen (" "").
+
{{jsxref ("String.prototype.repeat ()")}}
+
Gibt eine Zeichenfolge zurück, die aus den Elementen des Objekts besteht, die zu den angegebenen Zeiten wiederholt wurden.
+
{{jsxref ("String.prototype.replace ()")}}
+
Wird verwendet, um eine Übereinstimmung zwischen einem regulären Ausdruck und einer Zeichenfolge zu finden und die übereinstimmende Teilzeichenfolge durch eine neue Teilzeichenfolge zu ersetzen.
+
{{jsxref ("String.prototype.search ()")}}
+
Führt die Suche nach einer Übereinstimmung zwischen einem regulären Ausdruck und einer angegebenen Zeichenfolge aus.
+
{{jsxref ("String.prototype.slice ()")}}
+
Extrahiert einen Abschnitt einer Zeichenfolge und gibt eine neue Zeichenfolge zurück.
+
{{jsxref ("String.prototype.split ()")}}
+
Teilt ein {{jsxref ("Global_Objects / String", "String")}} -Objekt in ein Array von Zeichenfolgen auf, indem die Zeichenfolge in Teilzeichenfolgen aufgeteilt wird.
+
{{jsxref ("String.prototype.startsWith ()")}}
+
Legt fest, ob eine Zeichenfolge mit den Zeichen einer anderen Zeichenfolge beginnt.
+
{{jsxref ("String.prototype.substr ()")}} {{deprecated_inline}}
+
Gibt die Zeichen in einer Zeichenfolge zurück, die an der angegebenen Position mit der angegebenen Anzahl von Zeichen beginnt.
+
{{jsxref ("String.prototype.substring ()")}}
+
Gibt die Zeichen in einer Zeichenfolge zwischen zwei Indizes in die Zeichenfolge zurück.
+
{{jsxref ("String.prototype.toLocaleLowerCase ()")}}
+
Die Zeichen in einer Zeichenfolge werden unter Berücksichtigung des aktuellen Gebietsschemas in Kleinbuchstaben konvertiert. Für die meisten Sprachen wird das Gleiche wie {{jsxref ("String.prototype.toLowerCase ()", "toLowerCase ()")}} zurückgegeben.
+
{{jsxref ("String.prototype.toLocaleUpperCase ()")}}
+
Die Zeichen in einer Zeichenfolge werden unter Berücksichtigung des aktuellen Gebietsschemas in Großbuchstaben umgewandelt. Für die meisten Sprachen wird das Gleiche wie {{jsxref ("String.prototype.toUpperCase ()", "toUpperCase ()")}} zurückgegeben.
+
{{jsxref ("String.prototype.toLowerCase ()")}}
+
Gibt den aufrufenden Zeichenfolgenwert zurück, der in Kleinbuchstaben konvertiert wurde.
+
{{jsxref ("String.prototype.toSource ()")}} {{non-standard_inline}}
+
Gibt ein Objektliteral zurück, das das angegebene Objekt darstellt. Mit diesem Wert können Sie ein neues Objekt erstellen. Überschreibt die Methode {{jsxref ("Object.prototype.toSource ()")}}.
+
{{jsxref ("String.prototype.toString ()")}}
+
Gibt eine Zeichenfolge zurück, die das angegebene Objekt darstellt. Überschreibt die Methode {{jsxref ("Object.prototype.toString ()")}}.
+
{{jsxref ("String.prototype.toUpperCase ()")}}
+
Gibt den aufrufenden Zeichenfolgenwert zurück, der in Großbuchstaben konvertiert wurde.
+
{{jsxref ("String.prototype.trim ()")}}
+
Schneidet Leerzeichen vom Anfang und Ende der Zeichenfolge ab. Teil des ECMAScript 5-Standards.
+
{{jsxref ("String.prototype.trimStart ()")}}
+ {{jsxref ("String.prototype.trimLeft ()")}}
+
Schneidet Leerzeichen vom Anfang der Zeichenfolge ab.
+
{{jsxref ("String.prototype.trimEnd ()")}}
+ {{jsxref ("String.prototype.trimRight ()")}
+
Schneidet Leerzeichen vom Ende der Zeichenfolge ab.
+
{{jsxref ("String.prototype.valueOf ()")}}
+
Gibt den Grundwert des angegebenen Objekts zurück. Überschreibt die Methode {{jsxref ("Object.prototype.valueOf ()")}}.
+
{{jsxref ("String.prototype. @@ iterator ()", "String.prototype [@@ iterator] ()")}}
+
Gibt ein neues IteratorObjekt zurück, das die Codepunkte eines String-Werts durchläuft und jeden Codepunkt als String-Wert zurückgibt.
+
+ +

HTML-Wrapper-Methoden

+ +

Diese Methoden sind nur eingeschränkt einsetzbar, da sie nur einen Teil der verfügbaren HTML-Tags und -Attribute bereitstellen.

+ +
+
{{jsxref ("String.prototype.anchor ()")}} {{deprecated_inline}}
+
{{htmlattrxref ("name", "a", "<a name=\"name\">")}} (Hypertext-Ziel)
+
{{jsxref ("String.prototype.big ()")}} {{deprecated_inline}}
+
{{HTMLElement ("big")}}
+
{{jsxref ("String.prototype.blink ()")}} {{deprecated_inline}}
+
{{HTMLElement ("blinken")}}
+
{{jsxref ("String.prototype.bold ()")}} {{deprecated_inline}}
+
{{HTMLElement ("b")}}
+
{{jsxref ("String.prototype.fixed ()")}} {{deprecated_inline}}
+
{{HTMLElement ("tt")}}
+
{{jsxref ("String.prototype.fontcolor ()")}} {{deprecated_inline}}
+
{{htmlattrxref ("color", "font", "<font color = \" color \ ">")}}
+
{{jsxref ("String.prototype.fontsize ()")}} {{deprecated_inline}}
+
{{htmlattrxref ("size", "font", "<font size = \" size \ ">")}}
+
{{jsxref ("String.prototype.italics ()")}} {{deprecated_inline}}
+
{{HTMLElement ("i")}}
+
{{jsxref ("String.prototype.link ()")}} {{deprecated_inline}}
+
{{htmlattrxref ("href", "a", "<a href=\"url\">")}} (Link zu URL)
+
{{jsxref ("String.prototype.small ()")}} {{deprecated_inline}}
+
{{HTMLElement ("small")}}
+
{{jsxref ("String.prototype.strike ()")}} {{deprecated_inline}}
+
{{HTMLElement ("strike")}}
+
{{jsxref ("String.prototype.sub ()")}} {{deprecated_inline}}
+
{{HTMLElement ("sub")}}
+
{{jsxref ("String.prototype.sup ()")}} {{deprecated_inline}}
+
{{HTMLElement ("sup")}}
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1')}}{{Spec2('ES1')}}Anfangsdefinition.
{{SpecName('ES5.1', '#sec-15.5.3.1', 'String.prototype')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-string.prototype', 'String.prototype')}}{{Spec2('ESDraft')}}
+ +

Browser-Kompatibilität

+ + + +

{{Compat("javascript.builtins.String.prototype")}}

+ +

Sieh auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/raw/index.html b/files/de/web/javascript/reference/global_objects/string/raw/index.html new file mode 100644 index 0000000000..4405b1b72d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/raw/index.html @@ -0,0 +1,160 @@ +--- +title: String.raw() +slug: Web/JavaScript/Reference/Global_Objects/String/raw +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/raw +--- +
{{JSRef}}
+ +
Die statische String.raw() Methode ist eine tag Funktion für template literale ähnlich dem r Präfix in Python oder dem @ Präfix in C# für String Literale (es gibt jedoch einen Unterschied: siehe in der Beschreibung dieses Issues). Es wird verwendet um rohen, unveränderten Text zu verwenden.
+ +
 
+ +

Syntax

+ +
String.raw(callSite, ...substitutions)
+String.raw`templateString`
+
+ +

Parameter

+ +
+
callSite
+
Sauber formatiertes template call object, wie { raw: 'string' }.
+
...substitutions
+
Enthält Substitutionswerte.
+
templateString
+
Ein template string, optional mit Substitutionen (${...}).
+
+ +

Rückgabewerte

+ +

Einen rohen, unveränderbaren String des template Strings.

+ +

Auftretende Errors

+ +
+
{{jsxref("TypeError")}}
+
Ein {{jsxref("TypeError")}}  wird ausgeworfen wenn das erste Argument nicht sauber formatiert ist.
+
+ +

Beschreibung

+ +

Meistens wird String.raw() mit template strings (Vorlagen-Zeichenketten) benutzt. Die erste oben beschriebene Syntax wird kaum benutzt weil die JavaScript engine die Argumente richtig aufrufen wird so wie bei anderen tag Funktionen.

+ +

String.raw() ist die einzige built-in tag function für template strings; Sie funktioniert wie eine default template function und führt concatenation (Verbindung mehrerer Strings zu einem) aus. Man kann sie sogar mit JS code neu schreiben.

+ +

Beispiele

+ +

Verwendung von String.raw()

+ +
String.raw`Hi\n${2+3}!`;
+// 'Hi\\n5!', das Zeichen nach 'Hi' ist kein newline (Zeilenumbruch) Zeichen,
+// '\' und 'n' sind zwei Zeichen.
+
+String.raw`Hi\u000A!`;
+// 'Hi\\u000A!', hier genauso, diesmal bekommen wir folgende Zeichen zurrück:
+//  \, u, 0, 0, 0, A, 6
+// Alle Typen von escape characters (besondere Steuerzeichen) sind ineffektiv
+// Backslashes werden unverändert ausgegeben.
+// Man kann dies prüfen indem man die .length property des strings abfragt
+console.log( String.raw`Hi\u000A!`.length ) // gibt 9 zurrück
+console.log( "Hi\u000A!".length ) // gibt 4 zurrück
+
+
+let name = 'Bob';
+String.raw`Hi\n${name}!`;
+// 'Hi\\nBob!', Substitutionen werden bearbeitet.
+
+// Normalerweise ruft man  String.raw() nicht als function auf aber man kann
+//folgendes:
+String.raw({ raw: 'test' }, 0, 1, 2);
+// 't0e1s2t'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-string.raw', 'String.raw')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-string.raw', 'String.raw')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support41{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}41{{CompatGeckoMobile("34")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/repeat/index.html b/files/de/web/javascript/reference/global_objects/string/repeat/index.html new file mode 100644 index 0000000000..6008654521 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/repeat/index.html @@ -0,0 +1,286 @@ +--- +title: String.prototype.repeat() +slug: Web/JavaScript/Reference/Global_Objects/String/repeat +tags: + - ECMAScript 2015 + - JavaScript + - Méthode + - Prototype + - Referenz + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/repeat +--- +
{{JSRef}}
+ +

Die repeat()-Funktion erzeugt und gibt eine Zeichenkette zurück, die die spezifizierte Anzahl von Kopien der angegebenen Zeichenkette aneinandergereiht enthält.

+ +

Syntax

+ +
str.repeat(Anzahl);
+
+ +

Parameter

+ +
+
Anzahl
+
Eine Zahl zwischen 0 und +∞: [0, +∞), die die Anzahl Kopien der Ursprungszeichenkette in der neu erzeugten Zeichenkette definiert.
+
+ +

Rückgabeergebnis

+ +

Eine neue Zeichenkette mit der angegebenen Anzahl an Kopien der vorgegebenen Zeichenkette.

+ +

Ausnahmen

+ + + +

Beispiele

+ +
'abc'.repeat(-1);   // Parameterfehler
+'abc'.repeat(0);    // ''
+'abc'.repeat(1);    // 'abc'
+'abc'.repeat(2);    // 'abcabc'
+'abc'.repeat(3.5);  // 'abcabcabc' (Anzahl wird in einen ganzzahligen Integer umgewandelt)
+'abc'.repeat(1/0);  // Parameterfehler
+
+({ toString: () => 'abc', repeat: String.prototype.repeat }).repeat(2);
+// 'abcabc' (repeat() ist eine generische Methode)
+
+ +

Polyfill

+ +

Diese Funktion wurde zur ECMAScript 2015 Spezifikation hinzugefügt und steht unter Umständen noch nicht in allen JavaScript-Implementierungen zur Verfügung. Bedarfsweise können Sie die Methode String.prototype.repeat() durch folgenden Code zur Verfügung stellen:

+ +
if (!String.prototype.repeat) {
+  String.prototype.repeat = function(count) {
+    'use strict';
+    if (this == null) {
+      throw new TypeError('can\'t convert ' + this + ' to object');
+    }
+    var str = '' + this;
+    count = +count;
+    if (count != count) {
+      count = 0;
+    }
+    if (count < 0) {
+      throw new RangeError('repeat count must be non-negative');
+    }
+    if (count == Infinity) {
+      throw new RangeError('repeat count must be less than infinity');
+    }
+    count = Math.floor(count);
+    if (str.length == 0 || count == 0) {
+      return '';
+    }
+    // Ensuring count is a 31-bit integer allows us to heavily optimize the
+    // main part. But anyway, most current (August 2014) browsers can't handle
+    // strings 1 << 28 chars or longer, so:
+    if (str.length * count >= 1 << 28) {
+      throw new RangeError('repeat count must not overflow maximum string size');
+    }
+    var rpt = '';
+    for (var i = 0; i < count; i++) {
+      rpt += str;
+    }
+    return rpt;
+  }
+}
+
+ +

Polyfill ES5

+ +
//#es5
+'use strict';
+(function(win){
+ var typeOf=(function(w){var f=function f(x){return typeof(x)},o=w.Symbol,p;if(o && typeof(o)==='function' && typeof(o.iterator)==='symbol'){p=o.prototype;f=function(x){return x && x.constructor===o && x!==p?'symbol':typeof x}};return f})(win),
+ exist=function(o,p,t){return p in o && typeOf(o[p])===t};
+ (function(w){
+    var o=w.String.prototype;
+    if(!exist(o,'repeat','function')){o.repeat=(function(A,E){return function(n){var i=n>>0,s=this,l=s.length,j;if(i===0||l<1){s=''}else{j=268435456;if(i<0||i>=j||i*l>j){throw new RE('Invalidcountvalue')}else if(i>0){s=A(++i).join(s)}};return s}})(w.Array,w.RangeError)};
+ })(win);
+})(window);
+
+//test:
+console.clear();
+console.log(
+'abc'.repeat(false),//''
+'abc'.repeat({}),//''
+'abc'.repeat([]),//''
+'abc'.repeat(['']),//''
+'abc'.repeat([0]),//''
+'abc'.repeat([0,1]),//''
+'abc'.repeat([1,1]),//''
+'abc'.repeat(0),//''
+'abc'.repeat(.6),//''
+'abc'.repeat(true),//'abc'
+'abc'.repeat(1),//'abc'
+'abc'.repeat(2),//'abcabc'
+'abc'.repeat([2]),//'abcabc'
+'abc'.repeat(3.5),//'abcabcabc'
+''.repeat(2)//''
+);
+console.log(
+'abc'.repeat(-Infinity),//RangeError: Invalid count value
+'abc'.repeat(Infinity),//RangeError: Invalid count value
+'abc'.repeat(1/0),//RangeError: Invalid count value
+'abc'.repeat(-1)//RangeError: Invalid count value
+);
+
+/*
+es5 src:
+'use strict';
+(function(win){
+
+ var typeOf=(function(w){var f=function f(x){return typeof(x)},o=w.Symbol,p;if(o && typeof(o)==='function' && typeof(o.iterator)==='symbol'){p=o.prototype;f=function(x){return x && x.constructor===o && x!==p?'symbol':typeof x}};return f})(win),
+ exist=function(o,p,t){return p in o && typeOf(o[p])===t};
+
+ (function(w){
+    var o=w.String.prototype;
+    if(!exist(o,'repeat','function')){
+        o.repeat=(function(A,E){
+            return function(n){
+                var i=n>>0,s=this,l=s.length,j;
+                if(i===0||l<1){s=''}else{
+                    j=268435456;
+                    if(i<0||i>=j||i*l>j){throw new RE('Invalidcountvalue')}else if(i>0){s=A(++i).join(s)}
+                };
+                return s
+            };
+        })(w.Array,w.RangeError);
+    };
+    //..
+ })(win);
+
+})(window);
+*/
+
+ +

Polyfill ES6

+ +
//#es6
+
+(w=>{
+
+    const typeOf=(o=>{let f=x=>typeof x;if(o && 'function'===typeof o){const s='symbol';if(s===typeof o.iterator){const p=o.prototype;f=x=>x && x.constructor===o && x!==p?s:typeof x}};return f})(w.Symbol),
+
+    exist=(o,p,t)=>p in o && typeOf(o[p])===t;
+
+    (o=>{
+
+        if(!exist(o,'repeat','function')){const A=w.Array,E=w.RangeError;o.repeat=function(n){var i=n>>0,s='';if(i!==0){let t=this;const l=t.length;if(l!==0){if(i<0||i>=(t=268435456)||i*l>t){throw new E('Invalid count value')}else if(i>0){s=A(++i).join(t)}}};return s}};
+
+    })(w.String.prototype);
+
+})(window);
+
+/*
+
+es6 src:
+
+(w=>{
+
+    const typeOf=(o=>{let f=x=>typeof x;if(o && 'function'===typeof o){const s='symbol';if(s===typeof o.iterator){const p=o.prototype;f=x=>x && x.constructor===o && x!==p?s:typeof x}};return f})(w.Symbol),
+
+    exist=(o,p,t)=>p in o && typeOf(o[p])===t;
+
+
+    (o=>{
+
+        if(!exist(o,'repeat','function')){
+
+            const A=w.Array;
+
+            o.repeat=function(n){var i=n>>0,s='';if(i!==0){let t=this;const l=t.length;if(l!==0){if(i<0||i>=(t=268435456)||i*l>t){throw new RangeError('Invalid count value')}else if(i>0){s=A(++i).join(t)}}};return s};
+
+        };
+
+        //..
+
+    })(w.String.prototype);
+
+
+})(window);
+
+*/
+
+
+//test:
+
+console.clear();
+
+console.log(
+
+'abc'.repeat(false),//''
+
+'abc'.repeat({}),//''
+
+'abc'.repeat([]),//''
+
+'abc'.repeat(['']),//''
+
+'abc'.repeat([0]),//''
+
+'abc'.repeat([0,1]),//''
+
+'abc'.repeat([1,1]),//''
+
+'abc'.repeat(0),//''
+
+'abc'.repeat(.6),//''
+
+'abc'.repeat(true),//'abc'
+
+'abc'.repeat(1),//'abc'
+
+'abc'.repeat(2),//'abcabc'
+
+'abc'.repeat([2]),//'abcabc'
+
+'abc'.repeat(3.5),//'abcabcabc'
+
+''.repeat(2)//''
+
+);
+
+console.log(
+
+'abc'.repeat(-Infinity),//RangeError: Invalid count value
+
+'abc'.repeat(Infinity),//RangeError: Invalid count value
+
+'abc'.repeat(1/0),//RangeError: Invalid count value
+
+'abc'.repeat(-1)//RangeError: Invalid count value
+
+);
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}{{Spec2('ES2015')}}Erste Definition.
{{SpecName('ESDraft', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.repeat")}}

diff --git a/files/de/web/javascript/reference/global_objects/string/replace/index.html b/files/de/web/javascript/reference/global_objects/string/replace/index.html new file mode 100644 index 0000000000..c375d3d1f6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/replace/index.html @@ -0,0 +1,344 @@ +--- +title: String.prototype.replace() +slug: Web/JavaScript/Reference/Global_Objects/String/replace +tags: + - Expressions + - JavaScript + - Method + - Prototype + - Reference + - Regular + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/replace +--- +

{{JSRef}}
+ Die replace()-Methode gibt eine neue Zeichenkette zurück, in der einige oder alle Übereinstimmungen mit einem Muster durch einen Ersatz ausgetauscht wurden. Das Muster kann eine Zeichenkette oder eine RegExp sein, als Ersatz dienen eine Zeichenkette oder eine Funktion, welche für jede Übereinstimmung aufgerufen wird.

+ +

Syntax

+ +
str.replace(regexp|substr, newSubStr|function);
+ +

Parameter

+ +
+
regexp
+
Ein {{jsxref("Global_Objects/RegExp", "RegExp")}}-Objekt. Die Übereinstimmung wird durch den Rückgabewert aus Parameter #2 ersetzt.
+
+ +
+
substr
+
Eine {{jsxref("Global_Objects/String", "Zeichenkette")}}, welche durch newSubStr ersetzt werden soll. Nur das erste Vorkommen wird ersetzt.
+
+ +
+
newSubStr
+
Die {{jsxref("Global_Objects/String", "Zeichenkette")}}, welche den Substring aus Parameter #1 ersetzt. Eine Anzahl spezieller Ersetzungsmuster wird unterstützt, siehe den "Eine Zeichenkette als Parameter angeben"-Abschnitt weiter unten.
+
+ +
+
function
+
Eine Funktion, welche aufgerufen wird, um den neuen Substring zu erzeugen, der an Stelle des gefundenen Substrings aus Parameter #1 stehen soll. Die Argumente für diese Funktion werden im "Eine Funktion als Parameter angeben"-Abschnitt unten erläutert.
+
+ +

Rückgabe

+ +

Eine neue Zeichenkette, in der einige oder alle Übereinstimmungen mit einem Muster durch einen Ersatz ausgetauscht wurden.

+ +

Beschreibung

+ +

Diese Methode ändert nicht das String-Objekt, auf welchem sie aufgerufen wird. Sie gibt lediglich einen neuen String zurück.

+ +

Um ein globales Suchen und Ersetzen durchzuführen, setzen Sie den g-Umschalter im Regulären Ausdruck.

+ +

Eine Zeichenkette als Parameter angeben

+ +

Die Ersatzzeichenkette kann folgende spezielle Ersetzungsmuster beinhalten:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PatternInserts
$$Fügt ein "$" ein.
$&Fügt den gefundenen Substring ein.
$`Fügt den Stringteil vor dem gefundenen Substring ein.
$'Fügt den Stringteil nach dem gefundenen Substring ein.
$nMit n als nicht negative ganze Zahl kleiner als 100 wird der nte eingeklammerte Submatch-String eingefügt, der im ersten Argument in der RegExp angegeben wurde.
+ +

Eine Funktion als Parameter angeben

+ +

Sie können eine Funktion als zweiten Parameter angeben. In diesem Fall wird diese Funktion aufgerufen, nachdem die Suche ausgeführt wurde. Der Rückgabewert der Funktion wird als Ersatz eingesetzt. (Anmerkung: Die oben genannten speziellen Ersetzungsmuster werden in diesem Fall nicht beachtet.) Bedenken Sie, dass die Funktion für jede Übereinstimmung erneut aufgerufen wird, wenn der reguläre Ausdruck im ersten Parameter den global-Flag gesetzt hat.

+ +

Die Argumente dieser Funktion lauten wie folgt:

+ + + + + + + + + + + + + + + + + + + + + + + + +
Möglicher NameGelieferter Wert
matchDer gefundene Substring. (Entspricht $& oben.)
p1, p2, ...Der nth eingeklammerte Submatch-String, fall im ersten Argument ein RegExp-Objekt angegeben wurde. (Entspricht $1, $2, etc. oben.) Wurde zum Beispiel /(\a+)(\b+)/ angegeben, so ist p1 die Übereinstimmung für \a+, und p2 für \b+.
offsetDie Position, an welcher der gefundene Substring innerhalb der gesamten Zeichenkette gefunden wurde. War zum Beispiel die gesamte Zeichenkette "abcd" und der gefundene Substring "bc", dann wäre das Argument 1.)
stringDie gesamte Zeichenkette, welche durchsucht wird.
+ +

(Die genaue Anzahl der Argumente hängt davon ab, ob das erste Argument eine RegExp war und wieviele eingeklammerte Submatches in diesem Fall angegeben wurden.)

+ +

Das folgende Beispiel wird newString auf "abc - 12345 - #$*%" setzen:

+ +
function replacer(match, p1, p2, p3, offset, string){
+  // p1 is nondigits, p2 digits, and p3 non-alphanumerics
+  return [p1, p2, p3].join(' - ');
+}
+newString = "abc12345#$*%".replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
+
+ +

Beispiele

+ +

Beispiel: Definieren des regulären Ausdrucks in replace

+ +

Globales Ersetzen kann nur mit einem regulären Ausdruck durchgeführt werden. Im folgenden Beispiel wird der reguläre Ausdruck in replace definiert und beinhaltet den Schalter ignore case.

+ +
var str = "Twas the night before Xmas...";
+var newstr = str.replace(/xmas/i, "Christmas");
+print(newstr);
+
+ +

Dies erzeugt die Ausgabe "Twas the night before Christmas..."

+ +

Beispiel: Nutzung von global und ignore mit replace

+ +

Das nachfolgende Beispiel enthält einen regulären Ausdruck, der sowohl das global als auch das ignore Flag gesetzt hat. Dadurch wird von replace jedes Vorkommnis von 'apples' in der Zeichenkette durch 'oranges' ersetzt.

+ +
var re = /apples/gi;
+var str = "Apples are round, and apples are juicy.";
+var newstr = str.replace(re, "oranges");
+print(newstr);
+
+ +

Dies erzeugt die Ausgabe "oranges are round, and oranges are juicy."

+ +

Beispiel: Vertausche Wörter in Strings

+ +

Im folgenden Skript werden die Wörter in dem String getauscht. Für die Vertauschung im Text nutzt das Skript die Ersetzungspatterns $1 und $2.

+ +
var re = /(\w+)\s(\w+)/;
+var str = "John Smith";
+var newstr = str.replace(re, "$2, $1");
+print(newstr);
+
+ +

Die Ausgabe ist: "Smith, John".

+ +

Beispiel: Nutzung von Inline-Funktionen, die die erkannten Zeichen modifizieren

+ +

In diesem Beispiel werden alle Großbuchstaben durch einen Bindestrich und den entsprechenden Kleinbuchstaben ersetzt. Der wichtige Punkt in dem Beispiel ist, dass der Additions-Operator (Konkatination) vor dem Zurückgeben der neuen Zeichenkette erfolgen muss.

+ +

Die Ersetzungsfunktion bekommt das erkannte Muster als Parameter übergeben und benutzt diesen, um den Buchstaben zu transformieren und ihn mit dem Bindestrich zu verbinden. Zum Schluss wird das Ergebnis zum Ersetzen zurückgegeben.

+ +
function styleHyphenFormat(propertyName) {
+  function upperToHyphenLower(match) {
+    return '-' + match.toLowerCase();
+  }
+  return propertyName.replace(/[A-Z]/g, upperToHyphenLower);
+}
+
+ +

Gegeben styleHyphenFormat('borderTop'), gibt 'border-top' zurück.

+ +

Weil das Ergebnis transformiert werden soll, bevor die finale Ersetzung durchgeführt wird, muss eine Funktion eingesetzt werden. Dieses erzwingt die Ausführung von toLowerCase(). Wenn man das gleiche versucht ohne eine Funktion zu benutzen, wird die toLowerCase() Methode ohne Wirkung sein.

+ +
var newString = propertyName.replace(/[A-Z]/g, '-' + '$&'.toLowerCase());  // won't work
+
+ +

Dieses ist weil '$&'.toLowerCase() ausgeführt wird, bevor der String als Pattern genutzt wird.

+ +

Beispiel: Grad Fahrenheit in Celsius-Grad umwandeln

+ +

Das folgende Beispiel ersetzt einen Wert in Grad Fahrenheit durch den entsprechenden Celsius-Wert. Der Fahrenheitwert sollte eine Nummer sein, die mit einem F endet. Die Funktion gibt eine Celsius-Temperatur mit der Endung C aus. Ist zum Beispiel der Eingabewert 212F, so gibt die Funktion 100C zurück. Ist die Nummer 0F, so wird -17,77777777777778C zurück gegeben.

+ +

Der reguläre Ausdruck test prüft jede Nummer, die mit F endet. Die Nummer in Grad Fahrenheit ist durch den zweiten Funktionsparameter, p1, ansprechbar. Die Funktion setzt den Celsiuswert basierend auf dem Fahrenheitwert in einer Zeichenkette in der f2c-Funktion. f2c gibt dann den Celsiuswert zurück. Diese Funktion ähnelt dem s///e-Flag in Perl.

+ +
function f2c(x) {
+  function convert(str, p1, offset, s) {
+    return ((p1-32) * 5/9) + "C";
+  }
+  var s = String(x);
+  var test = /(\d+(?:\.\d*)?)F\b/g;
+  return s.replace(test, convert);
+}
+
+ +

Beispiel: Verwenden einer inline-Funktion mit einem regulärem Ausdruck um Schleifen zu vermeiden

+ +

Das folgende Beispiel nimmt eine Zeichenkettenmuster und konvertiert es in ein Array von Objekten.

+ +

Eingabe:
+ Eine Zeichenkette, die aus den Zeichen x, - und _ besteht

+ +
x-x_
+x---x---x---x---
+x-xxx-xx-x-
+x_x_x___x___x___
+ +
Ausgabe:
+ +
Ein Array mit Objekten. Ein 'x' zeigt einen 'an'-Status an, ein '-' (Bindestrich) symbolisiert einen 'aus'-Status und ein '_' (Unterstrich) gibt die Länge des 'an'-Status an.
+ +
[
+  { on: true, length: 1 },
+  { on: false, length: 1 },
+  { on: true, length: 2 }
+  ...
+]
+ +
Ausschnitt:
+ +
+
var str = 'x-x_';
+var retArr = [];
+str.replace(/(x_*)|(-)/g, function(match, p1, p2){
+  if(p1) retArr.push({ on: true, length: p1.length });
+  if(p2) retArr.push({ on: false, length: 1 });
+});
+
+console.log(retArr);
+
+ +
Der Ausschnitt generiert ein Array mit drei Objekten im gewünschten Format, ohne eine Schleife zu verwenden.
+ +
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
+ Implementiert in JavaScript 1.2
{{SpecName('ES5.1', '#sec-15.5.4.11', 'String.prototype.replace')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-string.prototype.replace', 'String.prototype.replace')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-string.prototype.replace', 'String.prototype.replace')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
EigenschaftChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundlegende Unterstützung{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Grundlegende Unterstützung{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

Firefox-spezifische Bemerkungen

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/slice/index.html b/files/de/web/javascript/reference/global_objects/string/slice/index.html new file mode 100644 index 0000000000..d30b18e21f --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/slice/index.html @@ -0,0 +1,152 @@ +--- +title: String.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/String/slice +translation_of: Web/JavaScript/Reference/Global_Objects/String/slice +--- +
{{JSRef}}
+ +

Die slice() Methode extrahiert einen Teilbereich eines Strings und gibt einen neuen String zurück.

+ +

Syntax

+ +
str.slice(AnfangIndex[, EndIndex])
+ +

Parameters

+ +
+
AnfangIndex
+
Der nullbasierte Index von welchem mit der Extraktion begonnen wird. Wenn dieser negativ ist, wird er als strLength + AnfangIndex, wobei strLength die länge des Strings darstellt, (bspw., wenn AnfangIndex  -3 ist, wird es als strLength - 3 gewertet). Wenn beginIndex größer oder gleich length des Strings ist, gibt slice() einen leeren String zurück.
+
EndIndex
+
Optional. Der nullbasierte Index vor welchem  die Extraktion beendet wird. Der Charakter an diesem Index wird nicht mit einbezogen. Wenn EndIndex ausgelassen wird, extrahiert slice() bis zum Ende des Strings. Wenn EndIndex negativ ist, wird es wie strLength + EndIndex gewertet, wobei strLength sich auf die Länge des Strings bezieht (z.B.: wenn EndIndex  -3 ist, wird es gewertet wie strLength - 3).
+
+ +

Return value

+ +

Ein neuer String, welcher die extrahierte Sektion des Strings enthält.

+ +

Beschreibung

+ +

slice() extrahiert den Text eines Strings und gibt einen neuen zurück. Änderungen im einen String wirken sich nicht auf den anderen String aus.

+ +

slice() extrahiert bis, aber nicht einschließlich, EndIndex. str.slice(1, 4) extrahiert den zweiten Charakter bis zum vierten  (Character mit den Indexen 1, 2, und 3).

+ +

Als Beispiel, str.slice(2, -1) extrahiert den dritten Charakter bis zum zweiten, bis zum letzten Charakter im String.

+ +

Beispiele

+ +

Benutzen von slice() um einen neuen String zu erzeugen

+ +

Das folgende Beispiel benutzt slice() um einen neuen String zu erzeugen.

+ +
var str1 = 'The morning is upon us.', // the length of str1 is 23.
+    str2 = str1.slice(1, 8),
+    str3 = str1.slice(4, -2),
+    str4 = str1.slice(12),
+    str5 = str1.slice(30);
+console.log(str2); // OUTPUT: he morn
+console.log(str3); // OUTPUT: morning is upon u
+console.log(str4); // OUTPUT: is upon us.
+console.log(str5); // OUTPUT: ""
+
+ +

Benutzen von slice() mit negativen Indexen

+ +

Das folgende Beispiel benutzt slice() mit negativen Indexen.

+ +
var str = 'The morning is upon us.';
+str.slice(-3);     // returns 'us.'
+str.slice(-3, -1); // returns 'us'
+str.slice(0, -1);  // returns 'The morning is upon us'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.5.4.13', 'String.prototype.slice')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.slice', 'String.prototype.slice')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.slice', 'String.prototype.slice')}}{{Spec2('ESDraft')}} 
+ +

Browser kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/split/index.html b/files/de/web/javascript/reference/global_objects/string/split/index.html new file mode 100644 index 0000000000..cfea09cc76 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/split/index.html @@ -0,0 +1,212 @@ +--- +title: String.prototype.split() +slug: Web/JavaScript/Reference/Global_Objects/String/split +translation_of: Web/JavaScript/Reference/Global_Objects/String/split +--- +
{{JSRef}}
+ +

Die split() Methode teilt ein {{jsxref("String")}} Objekt in ein Array von Strings auf, indem der String in Teilstrings zerteilt wird, wobei ein angegebenes Trennzeichen verwendet wird, um zu bestimmen, wo die Aufteilung erfolgen soll.

+ +

{{EmbedInteractiveExample("pages/js/string-split.html")}}

+ +

Syntax

+ +
str.split([separator[, limit]])
+ +
+

Achtung: Wenn leerer ein String ("") als Trennzeichen verwendet wird, wird der String nicht zwischen jedem vom Benutzer wahrgenommenen Zeichen (Graphem-Cluster) oder zwischen jedem Unicode-Zeichen (Codepoint) aufgeteilt, sondern zwischen jeder UTF-16-Codeeinheit. Dadurch werden Ersatzpaare (surrogate pairs) zerstört. Siehe auch How do you get a string to a character array in JavaScript? auf Stack Overflow.

+
+ +

Parameter

+ +
+
separator {{optional_inline}}
+
Ein String, der die Punkte angibt, an denen jede Aufteilung erfolgen soll. separator wird als Zeichenfolge oder als {{jsxref("Global_Objects/RegExp", "regulärer Ausdruck", "", 1)}} behandelt. Wenn ein Nur-Text separator mehr als ein Zeichen enthält, muss der gesamte String gefunden werden, damit eine Trennung erfolgt. Wenn separator nicht angegeben wird oder in str nicht vorkommt, enthält das zurückgegebene Array ein Element, das den gesamten String enthält. Wenn separator ein leerer String ist, wird jedes Zeichen von str in ein Array-Element umgewandelt.
+
limit {{optional_inline}}
+
Ganzzahl, die ein Limit für die Anzahl der zu findenden Splits angibt. Wenn dieser Parameter angegeben wird, teilt die split() Methode die Zeichenfolge bei jedem Vorkommen des angegebenen separator auf, stoppt jedoch, nachdem die Anzahl von limit erreicht wurde. Es können immer noch weniger Einträge als limit enthalten sein, wenn das Ende des Strings erreicht wurde, bevor das angegebene Limit erreicht wird. Der übrig gebliebene Text wird im neuen Array nicht enthalten sein.
+
+ +

Rückgabewert

+ +

Ein {{jsxref("Array")}} mit Strings, welcher an jedem Punkt aufgeteilt wurde, an dem das Trennzeichen in der angegebenen Zeichenfolge aufgetreten ist.

+ +

Beschreibung

+ +

Wenn gefunden, wird separator aus dem String entfernt und die Teilstrings werden in einem Array zurückgegeben. Wenn separator nicht gefunden oder weggelassen wird, enthält das Array ein Element, das aus dem gesamten String besteht. Wenn separator ein leerer String ist, wird str in ein Array aus Zeichen umgewandelt. Wenn separator am Anfang, Ende oder Anfang und Ende eines Strings gefunden wird, beginnt, endet oder beginnt und endet das Array mit einem leeren String. Besteht ein String daher nur aus einem einzigen Vorkommnis von separator besteht, besteht das Array also aus zwei leeren Strings.

+ +

Wenn separator ein regulärer Ausdruck ist, der runde Klammern enthält, werden die Ergebnisse (einschließlich etwaiger undefinierter Ergebnisse) der Klammern bei jeder Übereinstimmung von separator in das ausgegebene Array eingefügt.

+ +
+

Hinweis: Wenn separator ein Array ist, wird das Array in einen String umgewandelt und als Trennzeichen verwendet.

+
+ +
+

Hinweis: Wenn der String leer ist, gibt split() ein Array zurück, das einen leeren String anstelle eines leeren Arrays enthält. Wenn sowohl der String als auch das Trennzeichen leere Zeichenfolgen sind, wird ein leeres Array zurückgegeben.

+
+ +

Beispiele

+ +

Verwendung von split()

+ +

Im folgenden Beispiel wird eine Funktion definiert, die einen String mithilfe des angegebenen Trennzeichens in ein Array aus Strings aufteilt. Nach dem Aufteilen des Strings protokolliert die Funktion Meldungen, die den ursprüngliche String angeben (vor der Aufteilung), das verwendete Trennzeichen, die Anzahl der Elemente im Array und die einzelnen Arrayelemente.

+ +
function splitString(stringToSplit, separator) {
+  var arrayOfStrings = stringToSplit.split(separator);
+
+  console.log('The original string is: "' + stringToSplit + '"');
+  console.log('The separator is: "' + separator + '"');
+  console.log('The array has ' + arrayOfStrings.length + ' elements: ' + arrayOfStrings.join(' / '));
+}
+
+var tempestString = 'Oh brave new world that has such people in it.';
+var monthString = 'Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec';
+
+var space = ' ';
+var comma = ',';
+
+splitString(tempestString, space);
+splitString(tempestString);
+splitString(monthString, comma);
+ +

Das Beispiel erzeugt den folgende Ausgabe:

+ +
The original string is: "Oh brave new world that has such people in it."
+The separator is: " "
+The array has 10 elements: Oh / brave / new / world / that / has / such / people / in / it.
+
+The original string is: "Oh brave new world that has such people in it."
+The separator is: "undefined"
+The array has 1 elements: Oh brave new world that has such people in it.
+
+The original string is: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"
+The separator is: ","
+The array has 12 elements: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec
+ +

Leerzeichen aus einem String entfernen

+ +

Im folgenden Beispiel sucht split() nach 0 oder mehr Leerzeichen, gefolgt von einem Semikolon und 0 oder mehr Leerzeichen. Wenn es sie findet, entfernt es die Leerzeichen aus dem String. nameList ist das Array, was als Ergebnis von split() zurückgegeben wird.

+ +
var names = 'Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ';
+
+console.log(names);
+
+var re = /\s*(?:;|$)\s*/;
+var nameList = names.split(re);
+
+console.log(nameList);
+ +

Dies protokolliert zwei Zeilen. Die erste Zeile protokolliert die ursprüngliche Zeichenfolge und die zweite Zeile das resultierende Array.

+ +
Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand
+[ "Harry Trump", "Fred Barney", "Helen Rigby", "Bill Abel", "Chris Hand", "" ]
+
+ +

Eine begrenzte Anzahl von Trennungen zurückgeben

+ +

Im folgenden Beispiel sucht split() nach 0 oder mehr Leerzeichen im String und gibt die ersten 3 Treffer zurück, die es findet.

+ +
var myString = 'Hello World. How are you doing?';
+var splits = myString.split(' ', 3);
+
+console.log(splits);
+ +

Dieses Skript gibt folgendes aus:

+ +
["Hello", "World.", "How"]
+
+ +

Teilen mit einer RegExp, um Teile des Trennzeichens in das Ergebnis aufzunehmen

+ +

Wenn separator ein regulärer Ausdruck ist, der runde Klammern () enthält, werden übereinstimmende Ergebnisse in das Array aufgenommen.

+ +
var myString = 'Hello 1 word. Sentence number 2.';
+var splits = myString.split(/(\d)/);
+
+console.log(splits);
+ +

Dieses Skript gibt folgendes aus:

+ +
[ "Hello ", "1", " word. Sentence number ", "2", "." ]
+ +

 

+ +

Teilen mit einem Array als Trennzeichen

+ +

 

+ +
var myString = 'this|is|a|Test';
+var splits = myString.split(['|']);
+
+console.log(splits); //["this", "is", "a", "Test"]
+
+var myString = 'ca,bc,a,bca,bca,bc';
+
+var splits = myString.split(['a','b']);
+// myString.split(['a','b']) ist dasselbe wie myString.split(String(['a','b']))
+
+console.log(splits);  //["c", "c,", "c", "c", "c"]
+ +

Einen String mit split() umkehren

+ +
+

Dies ist keine robuste Art einen String umzukehren.

+ +
var str = 'asdfghjkl';
+var strReverse = str.split('').reverse().join(''); // 'lkjhgfdsa'
+// split() returns an array on which reverse() and join() can be applied
+
+ +

Das funktioniert nicht, wenn der String Graphem-Cluster enthält, selbst wenn ein Unicode-fähiger Split verwendet wird (verwenden Sie stattdessen bspw. esrever).

+ +
var str = 'résumé';
+var strReverse = str.split(/(?:)/u).reverse().join('');
+// => "́emuśer"
+
+ +

Bonus: Verwenden Sie sen {{jsxref("Operators/Comparison_Operators", "===", "#Identity_.2F_strict_equality_(.3D.3D.3D)")}} Operator um zu testen, ob der ursprüngliche String ein Palindrom war.

+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.5.4.14', 'String.prototype.split')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.split', 'String.prototype.split')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.split', 'String.prototype.split')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{Compat("javascript.builtins.String.split")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/startswith/index.html b/files/de/web/javascript/reference/global_objects/string/startswith/index.html new file mode 100644 index 0000000000..adbb0dce44 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/startswith/index.html @@ -0,0 +1,150 @@ +--- +title: String.prototype.startsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/startsWith +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Referenz + - String + - protype +translation_of: Web/JavaScript/Reference/Global_Objects/String/startsWith +--- +
{{JSRef}}
+ +

Die startsWith()-Methode stellt fest, ob ein String mit den Zeichen eines anderen Strings beginnt, falls dies so ist, wird true, sonst wird false zurückgegeben. 

+ +
str.startsWith(searchString[, position])
+ +

Parameter

+ +
+
searchString
+
Die Zeichenfolge, nach der am Anfang des Strings gesucht wird.
+
position
+
Optional. Die Position, an der die Suche nach searchString begonnen werden soll. Der Standardwert ist 0.
+
+ +

Rückgabewert

+ +

true wenn der String mit den Zeichen aus dem übergebenen String beginnt, andernfalls false.

+ +

Beschreibung

+ +

Diese Methode dient dazu herauszufinden, ob ein String am Anfang eines anderen Strings steht. Die Methode unterscheidet Groß- und Kleinschreibung.

+ +

Beispiele

+ +

Benutzung von startsWith()

+ +
//startsWith
+var str = 'Sein oder nicht sein, das ist hier die Frage';
+
+console.log(str.startsWith('Sein oder'));      // true
+console.log(str.startsWith('nicht sein'));     // false
+console.log(str.startsWith('nicht sein', 10)); // true
+
+ +

Polyfill

+ +

Diese Methode ist Bestandteil der ECMAScript-6-Spezifikation. Dennoch kann es vorkommen, dass sie noch nicht in allen Javascript-Implementierungen vorhanden ist. Man kann ihre Funktionsweise allerdings mit folgendem Ausdruck emulieren:

+ +
if (!String.prototype.startsWith) {
+  String.prototype.startsWith = function(searchString, position) {
+    position = position || 0;
+    return this.indexOf(searchString, position) === position;
+  };
+}
+
+ +

Eine robustere und schnellerer (optimierte) Version findet sich auf GitHub, geschrieben von Mathias Bynens.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)EdgeInternet ExplorerOperaSafari
Basic support{{CompatChrome("41")}}{{CompatGeckoDesktop("17")}}{{CompatVersionUnknown}}{{CompatNo}}28{{CompatSafari("9")}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatChrome("36")}}{{CompatGeckoMobile("17")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

 

+ +

Zu beachten ist, dass die MSDN Dokumentation für diese Methode (https://msdn.microsoft.com/en-us/library/mt146831(v=vs.94).aspx) besagt, das es nicht im Internet Explorer unterstützt wird.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/substr/index.html b/files/de/web/javascript/reference/global_objects/string/substr/index.html new file mode 100644 index 0000000000..354d417ea9 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/substr/index.html @@ -0,0 +1,171 @@ +--- +title: String.prototype.substr() +slug: Web/JavaScript/Reference/Global_Objects/String/substr +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/substr +--- +
{{JSRef}}
+ +

Die Methode substr() gibt die Zeichen eines Strings in einem gegebenen Intervall zurück.

+ +

Syntax

+ +
str.substr(start[, length])
+ +

Parameter

+ +
+
start
+
Ort im String, an dem mit dem Extrahieren von Zeichen begonnen wird. Wird eine negative Zahl übergeben, wird sie als str.length - start behandelt (Wenn start z. B. -3 ist, wird es als str.length - 3 behandelt).
+
length
+
Optional. Die Anzahl der Zeichen, die extrahiert werden sollen.
+
+ +

Rückgabewert

+ +

Einen neuen String, der den extrahierten Bereich des gegebene Strings enthält. Wenn length 0 oder negativ ist, wird ein leerer String zurückgegeben.

+ +

Beschreibung

+ +

start ist ein Zeichenindex. Der Index des ersten Zeichens ist 0 und der Index des letzten Zeichens ist 1 weniger als die Länge des Strings. substr()fängt mit dem Extrahieren von Zeichen bei start an und extrahiert length Zeichen (es sei denn, es erreicht vorher das Ende des Strings, dann gibt es weniger zurück).

+ +

Wenn start positiv ist und größer gleich der Länge des Strings ist, gibt substr() einen leeren String zurück.

+ +

Wenn start negativ ist, verwendet substr() es als Zeichenindex vom Ende des Strings. Wenn start negativ ist und abs(start) größer als die Länge des Strings ist, verwendet substr() 0 als Zeichenindex. Anmerkung: Der beschriebene Umgang mit negativen Werten für start wird von Microsoft JScript nicht unterstützt.

+ +

Wenn length 0 oder negativ ist, gibt substr() einen leeren String zurück. Wenn length nicht übergeben wird, extrahiert substr() alle Zeichen bis zum Ende des Strings.

+ +

Beispiele

+ +

Verwenden von substr()

+ +
var str = 'abcdefghij';
+
+console.log('(1, 2): '   + str.substr(1, 2));   // '(1, 2): bc'
+console.log('(-3, 2): '  + str.substr(-3, 2));  // '(-3, 2): hi'
+console.log('(-3): '     + str.substr(-3));     // '(-3): hij'
+console.log('(1): '      + str.substr(1));      // '(1): bcdefghij'
+console.log('(-20, 2): ' + str.substr(-20, 2)); // '(-20, 2): ab'
+console.log('(20, 2): '  + str.substr(20, 2));  // '(20, 2): '
+
+ +

Polyfill

+ +

Microsofts JScript unterstützt keine negativen Werte für den Startindex. Der folgende Kompatibilitätscode ist ein Workaround für diesen Bug:

+ +
// Nur verwenden, wenn die substr()-Funktion nicht funktioniert
+if ('ab'.substr(-1) != 'b') {
+  /**
+   *  Einen Teilstring erhalten
+   *  @param  {integer}  start   Startindex des Teilstrings
+   *  @param  {integer}  length  Länge des Teilstrings
+   *  @return {string}
+   */
+  String.prototype.substr = function(substr) {
+    return function(start, length) {
+       // Aufruf der Originalfunktion
+       return substr.call(this,
+         // Wenn start negativ ist, berechnen wie viel start
+         // vom Anfang des Strings ist
+         start < 0 ? this.length + start : start,
+         length);
+    }
+  }(String.prototype.substr);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Im (informativen) Anhang B "Compatibility" definiert. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-B.2.3', 'String.prototype.substr')}}{{Spec2('ES5.1')}}Im (informativen) Anhang B "Compatibility" definiert.
{{SpecName('ES6', '#sec-string.prototype.substr', 'String.prototype.substr')}}{{Spec2('ES6')}}Im (normativen) Anhang B "Additional ECMAScript Features for Web Browsers" definiert.
{{SpecName('ESDraft', '#sec-string.prototype.substr', 'String.prototype.substr')}}{{Spec2('ESDraft')}}Im (normativen) Anhang B "Additional ECMAScript Features for Web Browsers" definiert.
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundlegende Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Grundlegende Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/substring/index.html b/files/de/web/javascript/reference/global_objects/string/substring/index.html new file mode 100644 index 0000000000..4ed1e33959 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/substring/index.html @@ -0,0 +1,199 @@ +--- +title: String.prototype.substring() +slug: Web/JavaScript/Reference/Global_Objects/String/substring +tags: + - Funktion + - JavaScript + - Method + - Methode(2) + - Méthode + - Prototype + - Reference + - Referenz + - Référence(2) + - String + - Zeichenkette +translation_of: Web/JavaScript/Reference/Global_Objects/String/substring +--- +
{{JSRef("Global_Objects", "String")}}
+ +

Definition

+ +

Die substring() Methode gibt einen Teilstring eines Strings zwischen einem Index und einem anderen, oder dem Ende der Zeichenkette zurück.

+ +

Syntax

+ +
str.substring(indexA[, indexB])
+ +

Parameter

+ +
+
indexA
+
Ein Integer zwischen 0 und der Länge der Zeichenkette, welcher das erste Zeichen des Teilstrings repräsentiert.
+
indexB
+
Optional. Ein Integer zwischen 0 und der Länge der Zeichenkette, welcher das erste nicht im Teilstring enthaltene Zeichen darstellt.
+
+ +

Beschreibung

+ +

substring() extrahiert Zeichen von indexA bis nicht einschließlich indexB. Im Detail:

+ + + +

Falls indexA größer als indexB ist, werden die Argumente vertauscht substring(); zum Beispiel, str.substring(1, 0) == str.substring(0, 1).

+ +

Beispiele

+ +

Beispiel: Benutzung von substring()

+ +

Das folgende Beispiel benutzt substring(), um Zeichen des Strings 'Mozilla' anzuzeigen:

+ +
var anyString = 'Mozilla';
+
+// Zeigt 'Moz'
+console.log(anyString.substring(0, 3));
+console.log(anyString.substring(3, 0));
+
+// Zeigt 'lla'
+console.log(anyString.substring(4, 7));
+console.log(anyString.substring(7, 4));
+
+// Zeigt 'Mozill'
+console.log(anyString.substring(0, 6));
+
+// Zeigt 'Mozilla'
+console.log(anyString.substring(0, 7));
+console.log(anyString.substring(0, 10));
+
+ +

Beispiel: Benutzung von substring() mit length Eigenschaft

+ +

Das folgende Beispiel benutzt die substring() Methode und die {{jsxref("String.length", "length")}} Eigenschaft, um die letzten Zeichen des Strings zu extrahieren. Diese Methode ist leichter zu merken, da die genauen Start- und Endparameter nicht bekannt sein müssen.

+ +
// Zeigt 'illa' - die letzten 4 Zeichen
+var anyString = 'Mozilla';
+var anyString4 = anyString.substring(anyString.length - 4);
+console.log(anyString4);
+
+// Zeigt 'zilla' - die letzten 5 Zeichen
+var anyString = 'Mozilla';
+var anyString5 = anyString.substring(anyString.length - 5);
+console.log(anyString5);
+
+ +

Beispiel: Ersetze ein Teilstring mit einem String

+ +

Das folgende Beispiel ersetzt ein Teilstring mit einem String. Es werden sowohhl einzelne Zeichen als auch Teilstrings ersetzt. Der Funktionsaufruf am Ende des Beispiel ändert die Zeichenkette 'Brave New World' in 'Brave New Web'.

+ +
// Ersetzt oldS mit newS in der Zeichenkette fullS
+function replaceString(oldS, newS, fullS) {
+  for (var i = 0; i < fullS.length; ++i) {
+    if (fullS.substring(i, i + oldS.length) == oldS) {
+      fullS = fullS.substring(0, i) + newS + fullS.substring(i + oldS.length, fullS.length);
+    }
+  }
+  return fullS;
+}
+
+replaceString('World', 'Web', 'Brave New World');
+
+ +

Beachte, dass dieses Beispiel auch in einer Endlosschleife resultieren kann, wenn oldS ein Teilstring von newS ist — zum Beispiel, falls 'World' mit 'OtherWorld' ersetzt wird. Der folgende Code zeigt ein bessere Methode Strings zu ersetzen:

+ +
function replaceString(oldS, newS, fullS) {
+  return fullS.split(oldS).join(newS);
+}
+
+ +

Der oben stehende Code zeigt ein Beispiel für die Verwendung der substring Operation. Falls Teilstrings ersetzt werden, kann in den meisten Fällen {{jsxref("String.prototype.replace()")}} verwendet werden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 1. Edition.StandardIn JavaScript 1.0 implementiert.
{{SpecName('ES5.1', '#sec-15.5.4.15', 'String.prototype.substring')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.substring', 'String.prototype.substring')}}{{Spec2('ES6')}} 
+ +

Browser Kompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Standard Support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Standard Support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/suchen/index.html b/files/de/web/javascript/reference/global_objects/string/suchen/index.html new file mode 100644 index 0000000000..5fb838010a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/suchen/index.html @@ -0,0 +1,105 @@ +--- +title: String.prototype.search() +slug: Web/JavaScript/Reference/Global_Objects/String/suchen +tags: + - JavaScript + - Méthode + - Prototyp + - Referenz + - Regulärer Ausdruck + - Zeichenkette +translation_of: Web/JavaScript/Reference/Global_Objects/String/search +--- +
{{JSRef}}
+ +

Die search() methode führt eine Suche für eine Übereinstimmung von einem Regulären Ausdruck und diesem {{jsxref("String")}} Objekt.

+ +
{{EmbedInteractiveExample("pages/js/string-search.html")}}
+ + + +

Syntax

+ +
str.search(regexp)
+ +

Parameter

+ +
+
regexp
+
Ein Regulär-Ausdruck Objekt. Wenn ein nicht-RegExp Objekt obj eingereicht wird, wird es durch new RegExp(obj) zu {{jsxref("RegExp")}} konvertiert.
+
+ +

Rückgabewert

+ +

Die erste übereinstimmung zwischen dem Regulären Audruck und und der gegebenen Zeichenkette; wenn nicht gefunden, -1.

+ +

Beschreibung

+ +

Wenn du wissen willst ob ein Muster gefunden wurde, und was sein Index ist nutze search() (wenn du nur wissen willst ob es das gibt nutze die ähnliche {{jsxref("RegExp.prototype.test()", "test()")}} Methode auf dem RegExp Prototyp, der einen boolean zurückgibt); für mehr informationen (aber langsamererere Ausführung) nutze {{jsxref("String.prototype.match()", "match()")}} (ähnlich zum Ausdruck {{jsxref("RegExp.prototype.exec()", "exec()")}}).

+ +

Beispiele

+ + + +

Das folgende Beispiel durchsucht eine Zeichenkette mit 2 verschiedenen regex Objekten, um eine erfolgreiche, und unerfolgreiche Suche zu zeigen.

+ +
var str = "hey LukE";
+var re = /[A-Z]/g;
+var re2 = /[.]/g;
+console.log(str.search(re)); // gibt 4 zurück, was der Index des ersten Großbuchstaben "L" ist.
+console.log(str.search(re2)); // gibt -1 zurück kann "." nicht finden
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initielle Definition. Eingeführt in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.5.4.12', 'String.prototype.search')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-string.prototype.search', 'String.prototype.search')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-string.prototype.search', 'String.prototype.search')}}{{Spec2('ESDraft')}}
+ +

Browser Kompatibilität

+ + + +

{{Compat("javascript.builtins.String.search")}}

+ +

Gecko-spezifische Hinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/tolowercase/index.html b/files/de/web/javascript/reference/global_objects/string/tolowercase/index.html new file mode 100644 index 0000000000..f3eb4d9f68 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/tolowercase/index.html @@ -0,0 +1,79 @@ +--- +title: String.prototype.toLowerCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +tags: + - JavaScript + - Method + - Prototype + - Referenz + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +--- +
{{JSRef}}
+ +

Die toLowerCase() Methode gibt den Wert des aufrufenden Strings in Kleinbuchstaben umgewandelt zurück.

+ +

Syntax

+ +
str.toLowerCase()
+ +

Rückgabewert

+ +

Ein neuer String, der den alten String konvertiert zu Kleinbuchstaben enthält.

+ +

Beschreibung

+ +

Die toLowerCase() Methode gibt den Wert des Strings in Kleinbuchstaben umgewandelt zurück. toLowerCase() hat keine Auswirkungen auf den Wert des Strings str.

+ +

Beispiele

+ +

Benutzung von toLowerCase()

+ +
console.log('ALPHABET'.toLowerCase()); // 'alphabet'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.5.4.16', 'String.prototype.toLowerCase')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.tolowercase', 'String.prototype.toLowerCase')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.tolowercase', 'String.prototype.toLowerCase')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.toLowerCase")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/touppercase/index.html b/files/de/web/javascript/reference/global_objects/string/touppercase/index.html new file mode 100644 index 0000000000..c221990e73 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/touppercase/index.html @@ -0,0 +1,127 @@ +--- +title: String.prototype.toUpperCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +--- +
+
{{JSRef}}
+ +

Die toUpperCase() Methode gibt den Wert des aufrufenden Strings in Großbuchstaben umgewandelt zurück.

+ +

Syntax

+ +
str.toUpperCase()
+ +

Rückgabewert

+ +

Ein neuer String, der den alten String konvertiert zu Großbuchstaben enthält.

+ +

Beschreibung

+ +

Die toUpperCase() Methode gibt den Wert des Strings in Großbuchstaben umgewandelt zurück. toUpperCase() hat keine Auswirkungen auf den Wert des Strings str.

+ +

Beispiele

+ +

Benutzung von toUpperCase()

+ +
console.log('alphabet'.toUpperCase()); // 'ALPHABET'
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.5.4.16', 'String.prototype.toUpperCase')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-string.prototype.touppercase', 'String.prototype.toUpperCase')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.touppercase', 'String.prototype.toUpperCase')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + +
diff --git a/files/de/web/javascript/reference/global_objects/string/trim/index.html b/files/de/web/javascript/reference/global_objects/string/trim/index.html new file mode 100644 index 0000000000..59ada93228 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/trim/index.html @@ -0,0 +1,93 @@ +--- +title: String.prototype.trim() +slug: Web/JavaScript/Reference/Global_Objects/String/Trim +tags: + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/Trim +--- +
{{JSRef}}
+ +

Die trim() Methode entfernt Leerzeichen an beiden Enden einer Zeichenfolge. Das betrifft Leerzeichen verschiedenster Art (space, tab, no-break space, etc.) und alle Zeilenumbruch einleitende Zeichen (LF, CR, etc.).

+ +

Syntax

+ +
str.trim()
+ +

Rückgabewert

+ +

Ein neuer String, der den gegebenen String ohne Whitespaces am Anfang und am Ende enthält.

+ +

Beschreibung

+ +

Die trim() Methode gibt eine Zeichenfolge ohne Leerzeichen an beiden Enden zurück. trim() beeinflusst oder verändert nicht den ursprünglichen Wert der Zeichenfolge.

+ +

Beispiele

+ +

trim() verwenden

+ +

Das folgende Beispiel zeigt die kleingeschriebene Zeichenfolge 'foo':

+ +
var orig = '   foo  ';
+console.log(orig.trim()); // 'foo'
+
+// Ein Beispiel bei dem .trim() Leerzeichen an einem Ende entfernt
+
+var orig = 'foo    ';
+console.log(orig.trim()); // 'foo'
+
+ +

Polyfill

+ +

Führe folgenden Code vor allem anderen aus um die Methode trim() zu erstellen sollte sie nativ nicht zur Verfügung stehen.

+ +
if (!String.prototype.trim) {
+  String.prototype.trim = function () {
+    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.5.4.20', 'String.prototype.trim')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.1.
{{SpecName('ES6', '#sec-string.prototype.trim', 'String.prototype.trim')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-string.prototype.trim', 'String.prototype.trim')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.trim")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/trimleft/index.html b/files/de/web/javascript/reference/global_objects/string/trimleft/index.html new file mode 100644 index 0000000000..db5dbd55cb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/trimleft/index.html @@ -0,0 +1,58 @@ +--- +title: String.prototype.trimLeft() +slug: Web/JavaScript/Reference/Global_Objects/String/TrimLeft +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimStart +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die trimLeft() Methode entfernt Leerzeichen vom linken Ende der Zeichenkette.

+ +

Syntax

+ +
str.trimLeft()
+ +

Rückgabewert

+ +

Ein neuen String, der den alten String ohne Whitespaces auf der linken Seite beinhaltet.

+ +

Beschreibung

+ +

Die trimLeft() Methode gibt die Zeichenkette ohne Leerzeichen am linken Ende zurück. trimLeft() manipuliert nicht den Wert der Zeichenkette.

+ +

Beispiel

+ +

trimLeft() verwenden

+ +

Im folgenden Beispiel wird die Funktionalität dieser Methode dargestellt.

+ +
var str = '   foo  ';
+
+console.log(str.length);  // 8
+
+str = str.trimLeft();
+console.log(str.length);  // 5
+console.log(str);         // 'foo  '
+
+ +

Spezifikationen

+ +

Gehört keinem Standard an. Hinzugefügt in JavaScript 1.8.1.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.trimLeft")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/string/trimright/index.html b/files/de/web/javascript/reference/global_objects/string/trimright/index.html new file mode 100644 index 0000000000..b66e15f474 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/string/trimright/index.html @@ -0,0 +1,58 @@ +--- +title: String.prototype.trimRight() +slug: Web/JavaScript/Reference/Global_Objects/String/TrimRight +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimEnd +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die trimRight() Methode entfernt Leerzeichen vom rechten Ende der Zeichenkette.

+ +

Syntax

+ +
str.trimRight()
+ +

Rückgabewert

+ +

Ein neuen String, der den alten String ohne Whitespaces auf der rechten Seite beinhaltet.

+ +

Beschreibung

+ +

Die trimRight() Methode gibt die Zeichenkette ohne Leerzeichen am rechten Ende zurück. trimRight() manipuliert nicht den Wert der Zeichenkette.

+ +

Beispiel

+ +

trimRight() verwenden

+ +

Im folgenden Beispiel wird die Funktionalität dieser Methode dargestellt.

+ +
var str = '   foo  ';
+
+console.log(str.length);  // 8
+
+str = str.trimRight();
+console.log(str.length);  // 6
+console.log(str);         // '   foo'
+
+ +

Spezifikationen

+ +

Gehört keinem Standard an. Hinzugefügt in JavaScript 1.8.1.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.String.trimRight")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/syntaxerror/index.html b/files/de/web/javascript/reference/global_objects/syntaxerror/index.html new file mode 100644 index 0000000000..4b4edda7c5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/syntaxerror/index.html @@ -0,0 +1,133 @@ +--- +title: SyntaxError +slug: Web/JavaScript/Reference/Global_Objects/SyntaxError +tags: + - Error + - JavaScript + - Object + - Reference + - SyntaxError +translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError +--- +
{{JSRef}}
+ +

Das SyntaxError Objekt repräsentiert einen Fehler, der auftritt, wenn versucht wird syntaktisch falschen Quelltext zu interpretieren.

+ +

Beschreibung

+ +

Ein SyntaxError wird erzeugt, wenn die JavaScript-Umgebung Quelltextstücke  entdeckt, die nicht der Syntax der Sprachdefinition von JavaScript entspricht.

+ +

Syntax

+ +
new SyntaxError([message[, fileName[, lineNumber]]])
+ +

Parameter

+ +
+
message
+
Optional. Für Menschen lesbare Beschreibung des Fehlers.
+
fileName {{non-standard_inline}}
+
Optional. Der Name der Datei, in der der Fehler erzeugt wurde.
+
lineNumber {{non-standard_inline}}
+
Optional. Die Zeilennummer, in der der Fehler erzeugt wurde.
+
+ +

Eigenschaften

+ +
+
{{jsxref("SyntaxError.prototype")}}
+
Erlaubt es Eigenschaften zu allen SyntaxError Objekten hinzuzufügen.
+
+ +

Methoden

+ +

Das globale SyntaxError-Objekt enthält keine eigenen Methoden. Jedoch erbt das Objekt einige Methoden durch die Prototypenkette.

+ +

SyntaxError Instanzen

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Auffangen eines SyntaxError

+ +
try {
+  eval('hoo bar');
+} catch (e) {
+  console.log(e instanceof SyntaxError); // true
+  console.log(e.message);                // "missing ; before statement"
+  console.log(e.name);                   // "SyntaxError"
+  console.log(e.fileName);               // "Scratchpad/1"
+  console.log(e.lineNumber);             // 1
+  console.log(e.columnNumber);           // 4
+  console.log(e.stack);                  // "@Scratchpad/1:2:3\n"
+}
+
+ +

Erzeugen eines SyntaxError

+ +
try {
+  throw new SyntaxError('Hello', 'someFile.js', 10);
+} catch (e) {
+  console.log(e instanceof SyntaxError); // true
+  console.log(e.message);                // "Hello"
+  console.log(e.name);                   // "SyntaxError"
+  console.log(e.fileName);               // "someFile.js"
+  console.log(e.lineNumber);             // 10
+  console.log(e.columnNumber);           // 0
+  console.log(e.stack);                  // "@Scratchpad/2:11:9\n"
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.11.6.4', 'SyntaxError')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.SyntaxError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/syntaxerror/prototype/index.html b/files/de/web/javascript/reference/global_objects/syntaxerror/prototype/index.html new file mode 100644 index 0000000000..10ae05f755 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/syntaxerror/prototype/index.html @@ -0,0 +1,88 @@ +--- +title: SyntaxError.prototype +slug: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype +tags: + - Error + - JavaScript + - Property + - Prototype + - SyntaxError +translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError +--- +
{{JSRef}}
+ +

Die SyntaxError.prototype Eigenschaft repräsentiert die Eigenschaft die Eigenschaft für den {{jsxref("SyntaxError")}} Konstruktor.

+ +

Beschreibung

+ +

Alle {{jsxref("SyntaxError")}} Instanzen erben von SyntaxError.prototype. Man kann den Prototypen einsetzen, um Eigenschaften oder Methoden für allen Instanzen hinzuzufügen.

+ +

Eigenschaften

+ +
+
SyntaxError.prototype.constructor
+
Spezifiziert die Funktion, die einen Instanz des Prototypen erstellt.
+
{{jsxref("Error.prototype.message", "SyntaxError.prototype.message")}}
+
Fehlermeldung. Obwohl ECMA-262 Spezifiziert, dass {{jsxref("SyntaxError")}} eine eigene message Eigenschaft haben sollte, erbt dieser in SpiderMonkey die Eigenschaft {{jsxref("Error.prototype.message")}}.
+
{{jsxref("Error.prototype.name", "SyntaxError.prototype.name")}}
+
Fehlername. Vererbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.fileName", "SyntaxError.prototype.fileName")}}
+
Pfad zur Datei, in der der Fehler erzeugt wurde. Vererbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.lineNumber", "SyntaxError.prototype.lineNumber")}}
+
Zeilennummer, in der der Fehler erzeugt wurde. Vererbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.columnNumber", "SyntaxError.prototype.columnNumber")}}
+
Spaltennummer, in der der Fehler erzeugt wurde. Vererbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.stack", "SyntaxError.prototype.stack")}} {{non-standard_inline}}
+
Stack trace. Vererbt von {{jsxref("Error")}}.
+
+ +

Methoden

+ +

Obwohl das {{jsxref("SyntaxError")}} Prototypobjekt keine Methoden enthält, haben {{jsxref("SyntaxError")}} Instanzen einige Vererbte Methoden durch die Prototypenkette.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}{{Spec2('ES5.1')}}Definiert als NativeError.prototype.
{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ES6')}}Definiert als NativeError.prototype.
{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ESDraft')}}Definiert als NativeError.prototype.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.SyntaxError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/typeerror/index.html b/files/de/web/javascript/reference/global_objects/typeerror/index.html new file mode 100644 index 0000000000..609c799d77 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/typeerror/index.html @@ -0,0 +1,133 @@ +--- +title: TypeError +slug: Web/JavaScript/Reference/Global_Objects/TypeError +tags: + - Error + - JavaScript + - Object + - Reference + - TypeError +translation_of: Web/JavaScript/Reference/Global_Objects/TypeError +--- +
{{JSRef}}
+ +

Das TypeError Objekt repräsentiert einen Fehler, wenn ein Wert nicht dem erwartetem Typ enspricht.

+ +

Syntax

+ +
new TypeError([message[, fileName[, lineNumber]]])
+ +

Parameter

+ +
+
message
+
Optional. Beschreibung des Fehlers
+
fileName {{non-standard_inline}}
+
Optional. Name der Datei, welches den Fehlerverursachenden Code beinhaltet
+
lineNumber {{non-standard_inline}}
+
Optional. Zeilennummer des Codes, welches den Fehler verursacht
+
+ +

Beschreibung

+ +

Ein TypeError wird generiert, wenn ein an eine Funktion mitgegebener Operand oder Argument, inkompatibel dem erwartetem Typ ist.

+ +

Eigenschaften

+ +
+
{{jsxref("TypeError.prototype")}}
+
Erlaubt das Hinzufügen von Eigenschaften an einem TypeError Objekt.
+
+ +

Methoden

+ +

Die Globale TypeError kennt keine eigene Methode, jedoch erbt diese einige Methoden durch die Prototype-Kette.

+ +

TypeError Instanzen

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/TypeError/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/TypeError/prototype', 'Methoden')}}
+ +

Beispiele

+ +

Abfangen eines TypeError

+ +
try {
+  null.f();
+} catch (e) {
+  console.log(e instanceof TypeError); // true
+  console.log(e.message);              // "null hat keine Eigenschaften"
+  console.log(e.name);                 // "TypeError"
+  console.log(e.fileName);             // "Scratchpad/1"
+  console.log(e.lineNumber);           // 2
+  console.log(e.columnNumber);         // 2
+  console.log(e.stack);                // "@Scratchpad/2:2:3\n"
+}
+
+ +

Erzeugen eines TypeError

+ +
try {
+  throw new TypeError('Hallo', "someFile.js", 10);
+} catch (e) {
+  console.log(e instanceof TypeError); // true
+  console.log(e.message);              // "Hallo"
+  console.log(e.name);                 // "TypeError"
+  console.log(e.fileName);             // "someFile.js"
+  console.log(e.lineNumber);           // 10
+  console.log(e.columnNumber);         // 0
+  console.log(e.stack);                // "@Scratchpad/2:2:9\n"
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3', '#sec-15.11.6.5', 'TypeError')}}{{Spec2('ES3')}}Initiale Definition
{{SpecName('ES5.1', '#sec-15.11.6.5', 'TypeError')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-typeerror', 'TypeError')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-typeerror', 'TypeError')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.TypeError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/typeerror/prototype/index.html b/files/de/web/javascript/reference/global_objects/typeerror/prototype/index.html new file mode 100644 index 0000000000..d75e8efe4d --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/typeerror/prototype/index.html @@ -0,0 +1,88 @@ +--- +title: TypeError.prototype +slug: Web/JavaScript/Reference/Global_Objects/TypeError/prototype +tags: + - Error + - JavaScript + - Property + - Prototype + - TypeError +translation_of: Web/JavaScript/Reference/Global_Objects/TypeError +--- +
{{JSRef}}
+ +

Die TypeError.prototype Eigenschaft repräsentiert den prototype des {{jsxref("TypeError")}} Konstruktors.

+ +

Beschreibung

+ +

Alle {{jsxref("TypeError")}} Instanzen erben von TypeError.prototype. Dem prototype können über alle Instanzen hinweg Eigenschaften und Methoden hinzugefügt werden.

+ +

Eigenschaften

+ +
+
TypeError.prototype.constructor
+
Spezifiziert die Instanz erstellende Funktion.
+
{{jsxref("Error.prototype.message", "TypeError.prototype.message")}}
+
Fehlermeldung. ECMA-262 spezifiziert, dass {{jsxref("TypeError")}} eine eigene message Eigenschaft zur Verfügung stellen soll. In SpiderMonkey jedoch, erbt es von {{jsxref("Error.prototype.message")}}.
+
{{jsxref("Error.prototype.name", "TypeError.prototype.name")}}
+
Fehlerbezeichnung. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.fileName", "TypeError.prototype.fileName")}}
+
Pfad zur Datei, welche den Fehler verursachte. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.lineNumber", "TypeError.prototype.lineNumber")}}
+
Zeile in welcher der Fehler verusacht wurde. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.columnNumber", "TypeError.prototype.columnNumber")}}
+
Zeichennummer der Zeile in welcher der Fehler verursacht wurde. Geerbt von {{jsxref("Error")}}.
+
{{jsxref("Error.prototype.stack", "TypeError.prototype.stack")}}
+
Stack trace. Geerbt von {{jsxref("Error")}}.
+
+ +

Methoden

+ +

Das {{jsxref("TypeError")}} prototype Objekt beinhaltet keine eigenen Methoden, jedoch erben {{jsxref("TypeError")}} Instanzen einige Methoden durch die Prototypenkette.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3', '#sec-15.11.7.6', 'NativeError.prototype')}}{{Spec2('ES3')}}Initiale Definition
{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}{{Spec2('ES5.1')}}Definiert als NativeError.prototype.
{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ES6')}}Definiert als NativeError.prototype.
{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.TypeError")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/undefined/index.html b/files/de/web/javascript/reference/global_objects/undefined/index.html new file mode 100644 index 0000000000..9c0dd8f5f7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/undefined/index.html @@ -0,0 +1,135 @@ +--- +title: undefined +slug: Web/JavaScript/Reference/Global_Objects/undefined +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/undefined +--- +
{{jsSidebar("Objects")}}
+ +

Die globale Eigenschaft undefined repräsentiert den Wert {{Glossary("Undefined", "undefined")}} . Dieser Wert ist einer der {{Glossary("Primitive", "primitiven Typen")}} in JavaScript.

+ +

{{js_property_attributes(0,0,0)}}

+ +
{{EmbedInteractiveExample("pages/js/globalprops-undefined.html")}}
+ + + +

Syntax

+ +
undefined
+ +

Beschreibung

+ +

undefined ist eine Eigenschaft des globalen Objektes, was bedeutet, dass es eine Variable im globalen Gültigkeitsbereich ist. Der initiale Wert von undefined ist der primitive Wert {{Glossary("Undefined", "undefined")}}.

+ +

In modernen Browsern (JavaScript 1.8.5 / Firefox 4+) ist undefined  eine nicht konfigurierbare und nicht beschreibbare Eigenschaft. Dieses ist in der ECMAScript 5 Spezifikation definiert. Immer wenn das nicht der Fall ist, sollte das Überschreiben von undefined  unterlassen werden.

+ +

Eine Variable, die nicht mit einem Wert beschrieben wurde, ist vom Typ undefined. Methoden oder Anweisungen geben ebenfalls undefined zurück, wenn eine Variable, die ausgewertet wird, mit keinem Wert beschrieben ist. Eine Funktion hat undefined als Rückgabewert, wenn kein Wert {{jsxref("Statements/return", "zurückgegeben")}} wird.

+ +
+

Weil es möglich ist {{Glossary("Identifier", "Bezeichner")}} (Variablennamen) in jedem anderen Scope anders zu definieren, ist es auch möglich undefined neu zu defnieren (weil undefined kein {{jsxref("Reserved_Words", "reserviertes Schlüsselwort")}}) ist). Dieses einzusetzen ist jedoch keine gute Idee, weil der Quelltext dadurch schwer zu verstehen ist.

+ +
// NICHT NACHMACHEN
+
+// gibt "foo string" aus
+(function(){ var undefined = 'foo'; console.log(undefined, typeof undefined); })();
+
+// gibt "foo string" aus
+(function(undefined){ console.log(undefined, typeof undefined); })('foo');
+
+
+ +

Beispiele

+ +

Identität und undefined

+ +

Man kann undefined in Verbindung mit dem strikten Gleichheitsoperator nutzen, um den Wert von Variablen auf undefined zu prüfen. Im folgenden Beispiel ist die Variable x nicht definiert und die if-Anweisung wird zu true ausgewertet.

+ +
var x;
+if (x === undefined) {
+   // Diese Anweisung wird ausgeführt
+}
+else {
+   // Diese Anweisung wird nicht ausgeführt
+}
+
+ +
Hinweis: Der strikte Gleichheitsoperator muss statt dem Standard-Gleichheitsoperator benutzt werden, weil x == undefined auch prüft, ob x null ist, was bei strikter Gleichheit nicht so ist. null ist nicht äquivalent zu undefined Für Details siehe {{jsxref("Operators/Comparison_Operators", "Vergleichsoperatoren")}}
+ +

Typeof Operator und undefined

+ +

Alternativ kann {{jsxref("Operators/typeof", "typeof")}} eingesetzt werden:

+ +
var x;
+if (typeof x === 'undefined') {
+   // Diese Anweisung wird ausgeführt
+}
+
+ +

Ein Grund {{jsxref("Operators/typeof", "typeof")}} zu nutzen, ist, dass diese Variante keinen Fehler erzeugt, wenn eine Variable nicht definiert ist.

+ +
// x wurde nicht definiert
+if (typeof x === 'undefined') { // wird ohne Fehler zu true ausgewertet
+   // Diese Anweisung wird ausgeführt
+}
+
+if(x === undefined){ // erzeugt einen ReferenceError
+
+}
+
+ +

Diese Technik sollte so oft es geht vermieden werden. JavaScript ist eine Sprache mit statischen Gültigkeitsbereichen, was bedeutet, dass eine Variable immer in seinem geschlossenen Kontext gelesen werden kann, egal ob sie existiert oder nicht. Die einzige Ausnahme ist der globale Gültigkeitsbereich, jedoch ist dieser an das globale Objekt gebunden, weshalb die Existenz einer Variablen auf dem globalen Objekt geprüft werden kann. Dafür kann der {{jsxref("Operators/in", "in")}}-Operator genutzt werden.

+ +

Void Operator und undefined

+ +

Der {{jsxref("Operators/void", "void")}}-Operator ist die dritte Alternative.

+ +
var x;
+if (x === void 0) {
+   // Diese Anweisung wird ausgeführt
+}
+
+// y wurde nicht definiert
+if (y === void 0) {
+   // erzeugt einen ReferenceError (im gegensatz zu `typeof`)
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1', '#sec-4.3.9', 'undefined')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.3
{{SpecName('ES5.1', '#sec-15.1.1.3', 'undefined')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-undefined', 'undefined')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-undefined', 'undefined')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.undefined")}}

diff --git a/files/de/web/javascript/reference/global_objects/unescape/index.html b/files/de/web/javascript/reference/global_objects/unescape/index.html new file mode 100644 index 0000000000..315c332a35 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/unescape/index.html @@ -0,0 +1,126 @@ +--- +title: unescape() +slug: Web/JavaScript/Reference/Global_Objects/unescape +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/unescape +--- +
+
+
{{jsSidebar("Objects")}} {{deprecated_header()}}
+
+
+ +

Zusammenfassung

+ +

Die veraltete unescape() Methode erstellt einen neuen String, in dem hexadezimal escapte Sequenzen mit den entsprechenden umgewandelten Zeichen ersetzt werden. Die escape Sequenz kann vorher durch eine Funktion wie {{jsxref("Global_Objects/escape", "escape")}} erzeugt werden. Da unescape veraltet ist, sollte {{jsxref("Global_Objects/decodeURI", "decodeURI")}} oder {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} verwendet werden.

+ +
HInweis: unescape sollte nicht verwendet werden um URIs zu decodieren, nutze stattdessen decodeURI.
+ +

Syntax

+ +
unescape(str)
+ +

Parameter

+ +
+
str
+
Ein String der decodiert werden soll.
+
+ +

Beschreibung

+ +

Die unescape Funktion ist eine Eigenschaft des global object.

+ +

Beispiele

+ +
unescape("abc123");     // "abc123"
+unescape("%E4%F6%FC");  // "äöü"
+unescape("%u0107");     // "ć"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 1st Edition.StandardInitiale Definition.
{{SpecName('ES5.1', '#sec-B.2.2', 'unescape')}}{{Spec2('ES5.1')}}Definiert im (informative) Compatibility Annex B
{{SpecName('ES6', '#sec-unescape-string', 'unescape')}}{{Spec2('ES6')}}Definiert im (normative) Annex B for Additional ECMAScript Features for Web Browsers
+ +

Browser Kompatibilität

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/uneval/index.html b/files/de/web/javascript/reference/global_objects/uneval/index.html new file mode 100644 index 0000000000..b44eccc21a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/uneval/index.html @@ -0,0 +1,109 @@ +--- +title: uneval() +slug: Web/JavaScript/Reference/Global_Objects/uneval +translation_of: Web/JavaScript/Reference/Global_Objects/uneval +--- +
{{jsSidebar("Objects")}}{{Non-standard_header}}
+ +

Die uneval() Funktion gibt den Quelltext eines Objekts als String zurück.

+ +

Syntax

+ +
uneval(object)
+ +

Parameter

+ +
+
object
+
Ein JavaScript Ausdruck oder eine Anweisung.
+
+ +

Rückgabewert

+ +

Eine String-Darstellung des Quelltexts des Objekts.

+ +
Notiz: Es wird keine gültige JSON Darstellung des Objekts zurückgegeben.
+ +

Beschreibung

+ +

uneval() ist eine Top-Level Funktion und somit mit keinem Objekt verbunden.

+ +

Beispiele

+ +
var a = 1;
+uneval(a); // gibt einen String zurück der 1 enthält
+
+var b = "1";
+uneval(b) // gibt einen String zurück der "1" enthält
+
+uneval(function foo(){}); // gibt "(function foo(){})" zurück
+
+var a = uneval(function foo(){return 'hi'});
+var foo = eval(a);
+foo(); // gibt "hi" zurück
+
+ +

Spezifikationen

+ +

Kein Bestandteil einer Spezifikation.

+ +

Browser Kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html new file mode 100644 index 0000000000..a18c69da30 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/compile/index.html @@ -0,0 +1,91 @@ +--- +title: WebAssembly.compile() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +tags: + - API + - JavaScript + - Method + - Object + - Reference + - WebAssembly + - compile +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +--- +
{{JSRef}}
+ +

Die WebAssembly.compile() Funktion kompiliert ein {{jsxref("WebAssembly.Module")}} aus WebAssembly Binärcode. Hilfreich ist diese Funktion, um ein Modul zu kompilieren, bevor es instanziiert werden kann (Andernfalls sollte die {{jsxref("WebAssembly.instantiate()")}} Funktion verwendet werden).

+ +

Syntax

+ +
Promise<WebAssembly.Module> WebAssembly.compile(bufferSource);
+ +

Parameter

+ +
+
bufferSource
+
Ein typisiertes Array oder ArrayBuffer, das den Binärcode des zu kompilierenden .wasm Moduls enthält.
+
+ +

Rückgabewert

+ +

Ein Promise, das sich in ein {{jsxref("WebAssembly.Module")}} kompiliertes Objekt auflöst.

+ +

Fehlerbehandlung

+ + + +

Beispiele

+ +

Das folgende Beispiel kompiliert den geladenen simple.wasm Bytecode unter Verwendung der  compile() Funktion und sendet ihn an einen Web Worker mittels postMessage().

+ +
var worker = new Worker("wasm_worker.js");
+
+fetch('simple.wasm').then(response =>
+  response.arrayBuffer()
+).then(bytes =>
+  WebAssembly.compile(bytes)
+).then(mod =>
+  worker.postMessage(mod)
+);
+ +
+

Hinweis: Du wirst wahrscheinlich in den meisten Fällen {{jsxref("WebAssembly.compileStreaming()")}} verwenden wollen, da es effizienter als compile() arbeitet.

+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('WebAssembly JS', '#webassemblycompile', 'compile()')}}{{Spec2('WebAssembly JS')}}Initial draft definition.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.WebAssembly.compile")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html new file mode 100644 index 0000000000..13cbbdeef4 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html @@ -0,0 +1,87 @@ +--- +title: WebAssembly.compileStreaming() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +tags: + - API + - JavaScript + - Method + - Object + - Reference + - WebAssembly + - compile + - compileStreaming + - streaming +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +--- +
{{JSRef}}
+ +

Die WebAssembly.compileStreaming() Funktion kompiliert ein {{jsxref("WebAssembly.Module")}} direkt aus einer zugrunde liegenden Quelle. Nützlich ist diese Funktion wenn ein Modul kompiliert werden muss, bevor es instanziiert werden kann. (ansonsten sollte die {{jsxref("WebAssembly.instantiateStreaming()")}} Funktion verwendet werden).

+ +

Syntax

+ +
Promise<WebAssembly.Module> WebAssembly.compileStreaming(source);
+ +

Parameter

+ +
+
source
+
Ein {{domxref("Response")}} Objekt oder ein Promise das sich zu einem solchen auflöst. Es stellt die zugrunde liegende Quelle eines .wasm Moduls dar, die gestreamt und kompiliert werden soll.
+
+ +

Rückgabewert

+ +

Ein Promise das sich in ein {{jsxref("WebAssembly.Module")}} Objekt auflöst, welche das kompilierte Modul darstellt.

+ +

Ausnahmen

+ + + +

Beispiele

+ +

Das folgende Beispiel (siehe unsere compile-streaming.html Demo auf GitHub, und siehe das live Beispiel) streamt ein .wasm Modul direkt aus der zugrunde liegenden Quelle und kompiliert es in ein {{jsxref("WebAssembly.Module")}} Objekt. Weil die compileStreaming()  Funktion ein Promise für ein {{domxref("Response")}} Objekt annimmt, kann ihr direkt ein  {{domxref("WindowOrWorkerGlobalScope.fetch()")}} Aufruf durchgereicht werden, woraufhin es die Antwort in diese Funktion abgibt, sobald das Promise sich erfüllt.

+ +
var importObject = { imports: { imported_func: arg => console.log(arg) } };
+
+WebAssembly.compileStreaming(fetch('simple.wasm'))
+.then(module => WebAssembly.instantiate(module, importObject))
+.then(instance => instance.exports.exported_func());
+ +

Das resultierende Modul wird dann mittels {{jsxref("WebAssembly.instantiate()")}} instanziiert und die bereitgestellte Funktion wird aufgerufen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationenStatusKommentar
{{SpecName('WebAssembly Embedding', '#webassemblycompilestreaming', 'compileStreaming()')}}{{Spec2('WebAssembly Embedding')}}Initial draft definition.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.WebAssembly.compileStreaming")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/webassembly/index.html b/files/de/web/javascript/reference/global_objects/webassembly/index.html new file mode 100644 index 0000000000..4681f473fd --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/webassembly/index.html @@ -0,0 +1,111 @@ +--- +title: WebAssembly +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly +tags: + - API + - JavaScript + - Objekt + - Referenz + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly +--- +
{{JSRef}}
+ +

Das WebAssembly JavaScript Objekt existiert als Namensraum für alle WebAssembly-bezogenen Funktionalitäten.

+ +

Anders als die meisten anderen globalen Objekte, ist WebAssembly kein Konstruktor (es ist kein Funktionsobjekt). Es kann mit {{jsxref("Math")}} verglichen werden, welches ebenfalls einen Namensraum für mathematische Konstanten und Funktionen bildet. Oder mit {{jsxref("Intl")}}, welches den Namensraum für die Internationalisierunges API mit sprachabhängigen Funktionen bildet. 

+ +

Beschreibung

+ +

Die primäre Verwendung des WebAssembly Objekts sind:

+ + + +

Methoden

+ +
+
{{jsxref("WebAssembly.instantiate()")}}
+
Die primäre API für das Kompilieren und Instanziieren des WebAssembly Codes. Der Rückgabewert als Promise ergibt ein Module als auch die erste Instance.
+
{{jsxref("WebAssembly.instantiateStreaming()")}}
+
Kompiliert und instanziiert ein WebAssembly-Modul direkt aus einer Streamingquelle, mit dem Rückgabewert als Promise ergibt sich ein Module als auch die erste Instance.
+
{{jsxref("WebAssembly.compile()")}}
+
Kompiliert ein {{jsxref("WebAssembly.Module")}} aus dem WebAssembly Binärcode, wodurch die Instanziierung als separater Schritt durchgeführt werden kann.
+
{{jsxref("WebAssembly.compileStreaming()")}}
+
Kompiliert ein {{jsxref("WebAssembly.Module")}} direkt aus einer Streamingquelle, wodurch die Instanziierung als separater Schritt durchgeführt werden kann.
+
{{jsxref("WebAssembly.validate()")}}
+
Validiert das gegebene, typisierte Array eines WebAssembly Binärcodes. Gibt zurück, ob die Bytes validen WebAssembly Code darstellen (true) oder nicht (false).
+
+ +

Konstruktoren

+ +
+
{{jsxref("WebAssembly.Global()")}}
+
Erzeugt ein neues WebAssembly Global Objekt.
+
{{jsxref("WebAssembly.Module()")}}
+
Erzeugt ein neues WebAssembly Module Objekt.
+
{{jsxref("WebAssembly.Instance()")}}
+
Erzeugt ein neues WebAssembly Instance Objekt.
+
{{jsxref("WebAssembly.Memory()")}}
+
Erzeugt ein neues WebAssembly Memory Objekt.
+
{{jsxref("WebAssembly.Table()")}}
+
Erzeugt ein neues WebAssembly Table Objekt.
+
{{jsxref("WebAssembly.CompileError()")}}
+
Erzeugt ein neues WebAssembly CompileError Objekt.
+
{{jsxref("WebAssembly.LinkError()")}}
+
Erzeugt ein neues WebAssembly LinkError Objekt.
+
{{jsxref("WebAssembly.RuntimeError()")}}
+
Erzeugt ein neues WebAssembly RuntimeError Objekt.
+
+ +

Beispiele

+ +

Das folgende Beispiel (siehe instantiate-streaming.html Demo auf GitHub, siehe auch live) streamt ein .wasm Modul direkt aus einer zugrunde liegenden Quelle, um es dann zu kompilieren und zu instanziieren. Das Promise erfüllt sich mit einem ResultObject. Weil die instantiateStreaming() Funktion ein Promise für ein {{domxref("Response")}} akzeptiert, kann ihr ein {{domxref("WindowOrWorkerGlobalScope.fetch()")}} direkt übergeben werden, welches die Antwort an die Funktion weitergibt, sobald das Promise sich erfüllt.

+ +
var importObject = { imports: { imported_func: arg => console.log(arg) } };
+
+WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject)
+.then(obj => obj.instance.exports.exported_func());
+
+ +

Auf die ResultObject Instanz wird damit zugegriffen und die beinhaltete, exportierte Funktion aufgerufen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}{{Spec2('WebAssembly JS')}}Initial draft definition.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.WebAssembly")}}

+
+ +

Siehe auch

+ + + + diff --git a/files/de/web/javascript/reference/index.html b/files/de/web/javascript/reference/index.html new file mode 100644 index 0000000000..cd76ed6463 --- /dev/null +++ b/files/de/web/javascript/reference/index.html @@ -0,0 +1,49 @@ +--- +title: JavaScript-Referenz +slug: Web/JavaScript/Reference +tags: + - JavaScript + - 'l10n:priority' +translation_of: Web/JavaScript/Reference +--- +
{{JsSidebar}}
+ +

Dieses Kapitel des JavaScript-Teils auf MDN dient als JavaScript-Sprachreferenz. Mehr über diese Referenz.

+ +

Globale Objekte

+ +

Dieses Kapitel dokumentiert alle JavaScript-Standardobjekte, zusammen mit ihren Methoden und Eigenschaften.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects', 'Standardobjekte (kategorisiert)')}}
+ +

Anweisungen

+ +

Dieses Kapitel dokumentiert alle JavaScript-Anweisungen und -Deklarationen.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Statements', 'Anweisungen_und_Deklarationen_nach_Kategorie')}}
+ +

Ausdrücke und Operatoren

+ +

Dieses Kapitel dokumentiert alle JavaScript-Ausdrücke und -Operatoren.

+ +
{{page('/de/docs/Web/JavaScript/Reference/Operators', 'Expressions_and_operators_by_category')}}
+ +

Funktionen

+ +

Dieses Kapitel dokumentiert den Umgang mit JavaScript-Funktionen, um eine Anwendung zu entwickeln.

+ + + +

Zusätzliche Referenzseiten

+ + diff --git a/files/de/web/javascript/reference/iteration_protocols/index.html b/files/de/web/javascript/reference/iteration_protocols/index.html new file mode 100644 index 0000000000..f1ecbe29a1 --- /dev/null +++ b/files/de/web/javascript/reference/iteration_protocols/index.html @@ -0,0 +1,349 @@ +--- +title: Iterations Protokolle +slug: Web/JavaScript/Reference/Iteration_protocols +tags: + - ECMAScript 2015 + - Intermediate + - Iterable + - Iterator + - JavaScript +translation_of: Web/JavaScript/Reference/Iteration_protocols +--- +
{{jsSidebar("More")}}
+ +

Einige Änderungen in ECMAScript 2015 sind keine neuen Objekte oder Syntax, sondern Protokolle. Diese Protokolle können von jedem Objekt implementiert werden, wenn einige Konventionen eingehalten werden.

+ +

Es gibt zwei Protokolle: Das Iterierbare (iterable) Protokoll und das Iterator Protokoll

+ +

Das Iterierbare (iterable) Protokoll

+ +

Das Iterierbare (iterable) Protokoll erlaubt es bei JavaScript-Objekten das Iterierverhalten zu definieren oder anzupassen, wie z. B. wie Werte in einem {{jsxref("Statements/for...of", "for..of")}} Konstrukt durchlaufen werden. Einige Standardtypen sind von sich aus schon Iterierbar mit einem Standarditerationsverhalten, so wie {{jsxref("Array")}} oder {{jsxref("Map")}}, wohingegen andere Typen (so wie {{jsxref("Object")}}) nicht Iterierbar sind.

+ +

Um Iterierbar zu sein, muss ein Objekt die @@iterator Methode implementieren, was bedeutet, dass das Objekte (oder ein Objekt weiter oben in der Prototypenkette) eine Eigenschaft mit dem @@iterator Schlüssel haben muss, welcher über die Konstante {{jsxref("Symbol.iterator")}} erreichbar ist:

+ + + + + + + + + + + + + + +
EigenschaftWert
[Symbol.iterator]Eine Funktion ohne Parameter, welche ein Objekt zurückgibt, welches dem Iterator Protokoll entspricht.
+ +

Immer wenn ein Objekt iteriert werden soll (z. B. am Anfang einer for..of Schleife), wird die @@iterator Methode mit keinem Argument aufgerufen und der zurückgegebene Iterator wird benutzt, um die zu iterierenden Werte zu bekommen.

+ +

Das Iterator Protokoll

+ +

Das Iterator Protokoll definiert einen Standardweg, um eine Sequenz von Werte (endlich oder unendlich lang) zu produzieren.

+ +

Ein Objekt ist ein Iterator, wenn es die Methode next() mit folgender Semantik implementiert:

+ + + + + + + + + + + + +
EigenschaftWert
next +

Eine Funktion ohne Parameter, welche ein Objekt mit zwei Eigenschaften zurückgibt:

+ +
    +
  • done (boolean) + +
      +
    • Hat den Wert true, wenn der Iterator das Ende der Iterierten Sequenz erreicht hat. In diesem Fall ist value ein optional spezifizierter Rückgabewert des Iterators. Der Rückgabewert ist hier näher erklärt.
    • +
    • Hat den Wert false, wenn der Iterator weitere Werte aus der Sequenz produzieren kann. Äquivalent ist, wenn die done Eigenschaft nicht definiert wird.
    • +
    +
  • +
  • value - ein JavaScript Wert, der vom Iterator zurückgegeben wird. Kann weggelassen werden, wenn done den Wert true hat.
  • +
+ +

Die next Methode gibt immer ein Objekt mit den Eigenschaften done und value zurück. Wird kein Objekt zurückgegeben (wie z. B. false oder undefined), wird ein {{jsxref("TypeError")}} ("iterator.next() returned a non-object value") erzeugt.

+
+ +

Einige Iteratoren sind wiederum iterierbar:

+ +
var someArray = [1, 5, 7];
+var someArrayEntries = someArray.entries();
+
+someArrayEntries.toString();           // "[object Array Iterator]"
+someArrayEntries === someArrayEntries[Symbol.iterator]();    // true
+
+ +

Beispiele für den Einsatz de Iterations Protokolle

+ +

Ein {{jsxref("String")}} ist ein Beispiel für ein standard iterierbares Objekt:

+ +
var someString = 'hi';
+typeof someString[Symbol.iterator];          // "function"
+
+ +

Der Standard Iteratior von Strings gibt die Codepoints einen nach dem anderen zurück:

+ +
var iterator = someString[Symbol.iterator]();
+iterator + '';                               // "[object String Iterator]"
+
+iterator.next();                             // { value: "h", done: false }
+iterator.next();                             // { value: "i", done: false }
+iterator.next();                             // { value: undefined, done: true }
+ +

Einige Standardkonstrukte, wie z. B. die Spread Syntax, benutzen unter der Decke das selbe Iterierbare Protokoll

+ +
[...someString]                              // ["h", "i"]
+ +

Man kann das Iterierverhalben neu definieren indem eine eigene @@iterator Eigenschaft definiert wird:

+ +
var someString = new String('hi');           // need to construct a String object explicitly to avoid auto-boxing
+
+someString[Symbol.iterator] = function() {
+  return { // this is the iterator object, returning a single element, the string "bye"
+    next: function() {
+      if (this._first) {
+        this._first = false;
+        return { value: 'bye', done: false };
+      } else {
+        return { done: true };
+      }
+    },
+    _first: true
+  };
+};
+
+ +

Zu bemerken ist, dass die Neudefinition von @@iterator hat Effekte auf Standardkonstrukte, die das Iterierbare Protokoll benutzen;

+ +
[...someString];                             // ["bye"]
+someString + '';                             // "hi"
+
+ +

Iterierbare Beispiele

+ +

Standard iterierbare Objekte

+ +

{{jsxref("String")}}, {{jsxref("Array")}}, {{jsxref("TypedArray")}}, {{jsxref("Map")}} und {{jsxref("Set")}} sind im Standard iterierbar, weil jeder Prototyp der Objekte eine @@iterator Methode definiert.

+ +

Benutzerdefiniertes Iterierbares Objekt

+ +

Man kann eigene Iterierbare Objekte wie folgt erstellen:

+ +
var myIterable = {};
+myIterable[Symbol.iterator] = function* () {
+    yield 1;
+    yield 2;
+    yield 3;
+};
+[...myIterable]; // [1, 2, 3]
+
+ +

Standard APIs akzeptieren Iterierbare Objekte

+ +

Es gibt viele APIs, die iterierbare Objekte akzeptieren, zum Beispiel: {{jsxref("Map", "Map([iterable])")}}, {{jsxref("WeakMap", "WeakMap([iterable])")}}, {{jsxref("Set", "Set([iterable])")}} and {{jsxref("WeakSet", "WeakSet([iterable])")}}:

+ +
var myObj = {};
+new Map([[1, 'a'], [2, 'b'], [3, 'c']]).get(2);               // "b"
+new WeakMap([[{}, 'a'], [myObj, 'b'], [{}, 'c']]).get(myObj); // "b"
+new Set([1, 2, 3]).has(3);                               // true
+new Set('123').has('2');                                 // true
+new WeakSet(function* () {
+    yield {};
+    yield myObj;
+    yield {};
+}()).has(myObj);                                         // true
+
+ +

Zudem sollten {{jsxref("Promise.all", "Promise.all(iterable)")}}, {{jsxref("Promise.race", "Promise.race(iterable)")}}, and {{jsxref("Array.from", "Array.from()")}} angeschaut werden.

+ +

Syntaxen die iterierbare Objekte erwarten

+ +

Einige Statements und Ausdrücke erwarten iterierbare Objekt, zum Beispiel die for-of Schleife, Spread Syntax, yield* und destrukturierende Zuweisungen:

+ +
for(let value of ['a', 'b', 'c']){
+    console.log(value);
+}
+// "a"
+// "b"
+// "c"
+
+[...'abc']; // ["a", "b", "c"]
+
+function* gen() {
+  yield* ['a', 'b', 'c'];
+}
+
+gen().next(); // { value:"a", done:false }
+
+[a, b, c] = new Set(['a', 'b', 'c']);
+a // "a"
+
+
+ +

Nicht richtig definierte iterierbare Objekte

+ +

Wenn eine iterierbare @@iterator Methode keinen Iterator Objekt zurück gibt, ist es nicht richtig definiert. Wenn es so benutzt wird, führt das zu Laufzeitfehlern oder unerwartetem Verhalten:

+ +
var nonWellFormedIterable = {}
+nonWellFormedIterable[Symbol.iterator] = () => 1
+[...nonWellFormedIterable] // TypeError: [] is not a function
+
+ +

Iterator Beispiele

+ +

Einfacher Iterator

+ +
function makeIterator(array) {
+    var nextIndex = 0;
+
+    return {
+       next: function() {
+           return nextIndex < array.length ?
+               {value: array[nextIndex++], done: false} :
+               {done: true};
+       }
+    };
+}
+
+var it = makeIterator(['yo', 'ya']);
+
+console.log(it.next().value); // 'yo'
+console.log(it.next().value); // 'ya'
+console.log(it.next().done);  // true
+
+ +

Unendlicher Iterator

+ +
function idMaker() {
+    var index = 0;
+
+    return {
+       next: function(){
+           return {value: index++, done: false};
+       }
+    };
+}
+
+var it = idMaker();
+
+console.log(it.next().value); // '0'
+console.log(it.next().value); // '1'
+console.log(it.next().value); // '2'
+// ...
+
+ +

Mit einem Generator

+ +
function* makeSimpleGenerator(array) {
+    var nextIndex = 0;
+
+    while (nextIndex < array.length) {
+        yield array[nextIndex++];
+    }
+}
+
+var gen = makeSimpleGenerator(['yo', 'ya']);
+
+console.log(gen.next().value); // 'yo'
+console.log(gen.next().value); // 'ya'
+console.log(gen.next().done);  // true
+
+
+
+function* idMaker() {
+    var index = 0;
+    while (true)
+        yield index++;
+}
+
+var gen = idMaker();
+
+console.log(gen.next().value); // '0'
+console.log(gen.next().value); // '1'
+console.log(gen.next().value); // '2'
+// ...
+
+ +

Mit ES2015 Klassen (class)

+ +
class SimpleClass {
+  constructor(data) {
+    this.index = 0;
+    this.data = data;
+  }
+
+  [Symbol.iterator]() {
+    return {
+      next: () => {
+        if (this.index < this.data.length) {
+          return {value: this.data[this.index++], done: false};
+        } else {
+          this.index = 0; //If we would like to iterate over this again without forcing manual update of the index
+          return {done: true};
+        }
+      }
+    }
+  };
+}
+
+const simple = new SimpleClass([1,2,3,4,5]);
+
+for (const val of simple) {
+  console.log(val);  //'0' '1' '2' '3' '4' '5'
+}
+
+ +

Ist ein Generator Objekt ein Iterator oder ein iterierbares Objekt?

+ +

Ein Generatorobjekt ist beides, Iterator und Iterierbar:

+ +
var aGeneratorObject = function* () {
+    yield 1;
+    yield 2;
+    yield 3;
+}();
+typeof aGeneratorObject.next;
+// "function", because it has a next method, so it's an iterator
+typeof aGeneratorObject[Symbol.iterator];
+// "function", because it has an @@iterator method, so it's an iterable
+aGeneratorObject[Symbol.iterator]() === aGeneratorObject;
+// true, because its @@iterator method returns itself (an iterator), so it's an well-formed iterable
+[...aGeneratorObject];
+// [1, 2, 3]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-iteration', 'Iteration')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-iteration', 'Iteration')}}{{Spec2('ESDraft')}}
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/klassen/constructor/index.html b/files/de/web/javascript/reference/klassen/constructor/index.html new file mode 100644 index 0000000000..5ab83ddcd5 --- /dev/null +++ b/files/de/web/javascript/reference/klassen/constructor/index.html @@ -0,0 +1,165 @@ +--- +title: Konstruktor +slug: Web/JavaScript/Reference/Klassen/constructor +tags: + - ECMAScript 2015 + - JavaScript + - Klassen +translation_of: Web/JavaScript/Reference/Classes/constructor +--- +
{{jsSidebar("Classes")}}
+ +

Die constructor Methode ist eine spezielle Methode für das erzeugen und initialisieren von Objekten, die mit dem Schlüsselwort class erzeugt wurden.

+ +

Syntax

+ +
constructor([Argumente]) { ... }
+ +

Beschreibung

+ +

In einer Klasse kann es nur eine Methode mit dem Namen "constructor" geben. Eine {{jsxref("SyntaxError")}} Fehlermeldung wird geworfen, wenn in einer Klasse die constructor Methode mehr als einmal vorhanden ist.

+ +

Die constructor Methode kann mit dem Schlüsselwort super die constructor Methode der Eltern-Klasse aufrufen.

+ +

Wenn man keine constructor Methode erzeugt, wird eine Standardkonstruktor verwendet.

+ +

Beispiele

+ +

Verwendung der constructor Methode

+ +

Dieser Quellcode Ausschnitt wurden vom  classes Beispiel (live Demo) übernommen.

+ +
class Square extends Polygon {
+  constructor(length) {
+    // Hier wird die constructor Methode der Eltern-Klasse aufgerufen,
+    // für die Parameter width und height wurde der übergebene length Parameter verwendet
+    super(length, length);
+    // Anmerkung: In abgeleiteten Klassen, muss die super() Methode aufgerufen werden,
+    // bevor man das 'this' Objekt verwenden kann, da es sonst zu einen Referenz Fehler kommt
+    this.name = 'Square';
+  }
+
+  get area() {
+    return this.height * this.width;
+  }
+
+  set area(value) {
+    this.area = value;
+  }
+}
+ +

Standardkonstruktoren

+ +

Wenn man keine constructor Methode anlegt, wird eine Standardkonstruktor verwendet. Für Basis Klassen ist der Standard Konstruktor:

+ +
constructor() {}
+
+ +

Für vererbte Klassen, ist das der Standardkonstruktor:

+ +
constructor(...args) {
+  super(...args);
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-static-semantics-constructormethod', 'Constructor Method')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-static-semantics-constructormethod', 'Constructor Method')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(42.0)}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Default constructors{{CompatUnknown}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatChrome(42.0)}}{{CompatGeckoMobile(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(42.0)}}
Default constructors{{CompatUnknown}}{{CompatUnknown}}{{CompatGeckoMobile(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/klassen/extends/index.html b/files/de/web/javascript/reference/klassen/extends/index.html new file mode 100644 index 0000000000..29ed8c5e78 --- /dev/null +++ b/files/de/web/javascript/reference/klassen/extends/index.html @@ -0,0 +1,172 @@ +--- +title: Erweitern +slug: Web/JavaScript/Reference/Klassen/extends +tags: + - Classes + - ECMAScript 2015 + - JavaScript +translation_of: Web/JavaScript/Reference/Classes/extends +--- +
{{jsSidebar("Classes")}}
+ +

Das extends Schlüsselwort wird in einer Klassendeklaration oder in einem Klassenausdruck verwendet, um eine, von einer anderen Klasse, abgeleitete Klasse zu erzeugen.

+ +

Syntax

+ +
class KindKlasse extends ElternKlasse { ... }
+ +

Beschreibung

+ +

Das Schlüsselwort extends kann verwendet werden, um von selbst erstellen Klassen als auch von standardmäßig eingebaute Objekte abzuleiten.

+ +

Das prototype Objekt, des zu erweiternden Objekt, muss entweder von Typ {{jsxref("Object")}} oder{{jsxref("null")}} sein.

+ +

Beispiele

+ +

Verwendung von extends

+ +

Das erste Beispiel erzeugt einen Klasse mit dem Namen Square, die von der Klasse Polygon abgeleitet ist. Dieses Beispiel wurde aus dieser live Demo (Quellcode) entnommen.

+ +
class Square extends Polygon {
+  constructor(length) {
+    // Hier wird die constructor Methode der Eltern-Klasse aufgerufen,
+    // für die Parameter width und height wurde der übergebene length Parameter verwendet
+    super(length, length);
+    // Anmerkung: In abgeleiteten Klassen, muss die super() Methode aufgerufen werden,
+    // bevor man das 'this' Objekt verwenden kann, da es sonst zu einen Referenz Fehler kommt
+    this.name = 'Square';
+  }
+
+  get area() {
+    return this.height * this.width;
+  }
+
+  set area(value) {
+    this.height = this.width = Math.sqrt(value);
+    this.area = value;
+  }
+}
+ +

Verwendung mit standardmäßig eingebautem Objekt

+ +

In diesem Beispiel wird das standardmäßig eingebaute {{jsxref("Date")}} Objekt erweitert. Dieses Beispiel wurde aus dieser live Demo (Quellcode) entnommen.

+ +
class myDate extends Date {
+  constructor() {
+    super();
+  }
+
+  getFormattedDate() {
+    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
+    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
+  }
+}
+ +

Ableiten von null

+ +

Das Ableiten von {{jsxref("null")}} funktioniert genauso wie mit jeder anderen Klasse, mit der Ausnahme, dass das prototype Objekt nicht von {{jsxref("Object.prototype")}} abgeleitet ist.

+ +
class nullExtends extends null {
+  constructor() {}
+}
+
+Object.getPrototypeOf(nullExtends); // Function.prototype
+Object.getPrototypeOf(nullExtends.prototype) // null
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-class-definitions', 'extends')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-class-definitions', 'extends')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(42.0)}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Array subclassing{{CompatChrome(43.0)}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatGeckoMobile(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(42.0)}}
Array subclassing{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(43.0)}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/klassen/index.html b/files/de/web/javascript/reference/klassen/index.html new file mode 100644 index 0000000000..81bec0651a --- /dev/null +++ b/files/de/web/javascript/reference/klassen/index.html @@ -0,0 +1,376 @@ +--- +title: Klassen +slug: Web/JavaScript/Reference/Klassen +tags: + - ECMAScript 2015 + - JavaScript + - Klassen + - Konstruktor + - Vererbung +translation_of: Web/JavaScript/Reference/Classes +--- +
{{JsSidebar("Classes")}}
+ +
JavaScript Klassen, eingeführt in ECMAScript 2015, sind syntaktischer Zucker für das bestehende, auf Prototypen basierende, Vererbungsmodell von JavaScript. Diese Syntaxerweiterung führt kein neues OOP-Modell in die Sprache ein. JS Klassen ermöglichen es, mit klarer und verständlicher Syntax Objekte zu erstellen und Vererbung in Javascript zu realisieren.
+ +

Klassendefinition

+ +

Klassen sind eigentlich Funktionen. Analog zu Funktionsausdrücken und Funktionsdeklarationen hat die Klassensyntax zwei Komponenten:

+ + + +

Klassendeklaration

+ +

Eine Möglichkeit, Klassen zu definieren ist eine Klassendeklaration. Diese wird eingeleitet durch das Schlüsselwort class, gefolgt vom Namen der Klasse (hier: "Rectangle").

+ +
class Rectangle {
+  constructor(height, width) {
+    this.height = height;
+    this.width = width;
+  }
+}
+ +

Hoisting

+ +

Ein wichtiger Unterschied zwischen Klassen- und Funktionsdeklarationen besteht im sogenannten {{Glossary("Hoisting")}}. Funktionsdeklarationen werden an den Anfang des Definitionsbereichs "gehoben", für Klassen gilt dies nicht. Das heißt, um auf eine Klasse zuzugreifen, muss sie zuvor definiert worden sein, sonst führt dies zu einem {{jsxref("ReferenceError")}}:

+ +
var p = new Polygon(); // ReferenceError
+
+class Polygon {}
+
+ +

Klassenausdruck

+ +

Ein Klassenausdruck ist eine weitere Möglichkeit eine Klasse zu definieren. Dabei ist es optional, hinter dem Schlüsselwort class einen Namen anzugeben. Sollte ein Name angegeben werden, so gilt dieser nur innerhalb des Klassenkörpers.

+ +
// unnamed
+var Polygon = class {
+  constructor(height, width) {
+    this.height = height;
+    this.width = width;
+  }
+};
+
+// named
+var Polygon = class Polygon {
+  constructor(height, width) {
+    this.height = height;
+    this.width = width;
+  }
+};
+
+ +

Klassenkörper und Methodendefinitionen

+ +

Der Körper der Klasse ist innerhalb der beiden geschweiften Klammern {}. Hier werden die Eigenschaften der Klasse definiert, wie Konstruktoren oder Methoden.

+ +

"Strict mode"

+ +

Der Inhalt der Klassendeklaration und des Klassenausdrucks werden im "strikten Modus" ausgeführt.

+ +

Konstruktor

+ +

Die Konstruktor-Methode ist eine spezielle Methode, um Objekte zu erzeugen und zu initialisieren. Eine Klasse kann nur eine spezielle Methode mit dem Namen "constructor" haben. Sollte es in einer Klasse mehrere "constructor"-Methoden geben, wird ein {{jsxref("SyntaxError")}} geworfen.

+ +

In der Konstruktor-Methode kann man mit dem Schlüsselwort "super", den Konstruktor der Elternklasse aufrufen.

+ +

Prototype Methoden

+ +

Siehe auch Methodendefinitionen.

+ +
class Polygon {
+  constructor(hoehe, breite) {
+    this.hoehe = hoehe;
+    this.breite = breite;
+  }
+
+  get flaeche() {
+    return this.berechneFlaeche();
+  }
+
+  berechneFlaeche() {
+    return this.hoehe * this.breite;
+  }
+}
+
+const quadrat = new Polygon(10, 10);
+
+console.log(quadrat.flaeche);
+ +

Statische Methoden

+ +

Das Schlüsselwort static definiert statische Methoden. Statische Methoden werden ohne Instanzierung einer Klasse aufgerufen und sind über eine erzeugte Instanz nicht aufrufbar. Oft werden in Applikationen statische Methoden für Hilfsfunktionen verwendet.

+ +
class Punkt {
+    constructor(x, y) {
+        this.x = x;
+        this.y = y;
+    }
+
+    static laenge(a, b) {
+        const dx = a.x - b.x;
+        const dy = a.y - b.y;
+
+        return Math.sqrt(dx*dx + dy*dy);
+    }
+}
+
+const p1 = new Punkt(5, 5);
+const p2 = new Punkt(10, 10);
+
+console.log(Punkt.laenge(p1, p2));
+ +

Boxing with prototype and static methods

+ +

Wird eine statische oder eine prototype-Methode aufgerufen, ohne dass ein Objekt in der Variable "this" liegt (oder mit "this" als Wahrheitswert, Zeichenkette, Nummer, undefiniert oder null), dann wird die Variable "this" im Funktionskörper undefined sein. Autoboxing wird nicht passieren. Das Verhalten wird das gleiche sein, sollte der Code nicht im "strict mode" geschrieben worden sein.

+ +
class Tier {
+  sprich() {
+    return this;
+  }
+  static iss() {
+    return this;
+  }
+}
+
+let obj = new Tier();
+let sprich = obj.sprich;
+sprich(); // undefined
+
+let iss = Tier.iss;
+iss(); // undefined
+ +

Falls wir den vorherigen Quelltext mit klassischen funktionsbasierten Klassen schreiben, wird Autoboxing stattfinden. Dies wird auf dem Wert passieren, der für "this" an die Funktion übergeben wurde.

+ +
function Tier() { }
+
+Tier.prototype.sprich = function() {
+  return this;
+}
+
+Tier.iss = function() {
+  return this;
+}
+
+let obj = new Tier();
+let sprich = obj.sprich;
+sprich(); // Globales Objekt
+
+let iss = Tier.iss;
+iss(); // Globales Objekt
+ +

Vererbung mittels extends

+ +

Das Schlüsselwort extends wird dafür verwendet, Klassendeklarationen und Klassenausdrücke zu erzeugen, die von einer anderen Klasse ableiten.

+ +
class Tier{
+  constructor(name) {
+    this.name = name;
+  }
+
+  sprich() {
+    console.log(this.name + ' macht ein Geräusch.');
+  }
+}
+
+class Hund extends Tier{
+  sprich() {
+    console.log(this.name + ' bellt.');
+  }
+}
+
+var h = new Hund('Wolfi');
+h.sprich();
+
+ +

Existiert in der Unterklasse ein Konstruktor, muss dieser zuerst super() aufrufen, bevor "this" verwendet werden kann.

+ +

Man kann auch traditionelle funktionsbasierte Klassen erweitern:

+ +
function Tier(name) {
+  this.name = name;
+}
+Tier.prototype.sprich = function () {
+  console.log(this.name + ' macht ein Geräusch.');
+}
+
+class Hund extends Tier {
+  sprich() {
+    super.sprich();
+    console.log(this.name + ' bellt.');
+  }
+}
+
+var h = new Hund('Wolfi');
+h.sprich();
+ +

Klassen können nicht von regulären (nicht konstruierbaren) Objekten erben. Falls von einem regulärem Objekt geerbt werden soll, kann {{jsxref("Object.setPrototypeOf()")}} verwendet werden:

+ +
var Tier = {
+  sprich() {
+    console.log(this.name + ' macht ein Geräusch.');
+  }
+};
+
+class Hund {
+  constructor(name) {
+    this.name = name;
+  }
+  sprich() {
+    console.log(this.name + ' bellt.');
+  }
+}
+
+Object.setPrototypeOf(Hund.prototype, Tier);
+
+var h = new Hund('Wolfi');
+h.sprich();
+ +

Species

+ +

Falls man zum Beispiel in einer selbst erzeugten Klasse MyArray den Konstruktor mit dem Konstruktor der {{jsxref("Array")}} Klasse überschreiben will, kann man dies mittels des species Musters erreichen.

+ +

Zum Beispiel, wenn man die {{jsxref("Array.map", "map()")}} Methode aufruft, wird der Default-Konstruktor der Klasse aufgerufen. Will man, dass stattdessen der Konstruktor der Elternklasse benutzt wird, kann man das {{jsxref("Symbol.species")}}-Symbol dafür verwenden:

+ +
class MyArray extends Array {
+  // Überschreibt species mit dem Konstruktor der Array-Klasses
+  static get [Symbol.species]() { return Array; }
+}
+var a = new MyArray(1,2,3);
+var mapped = a.map(x => x * x);
+
+console.log(mapped instanceof MyArray); // false
+console.log(mapped instanceof Array);   // true
+ +

Elternklasse Methoden mit super aufrufen

+ +

Das Schlüsselwort super kann verwendet werden, um Methoden der Elternklassen aufzurufen

+ +
class Katze{
+  constructor(name) {
+    this.name = name;
+  }
+
+  sprich() {
+    console.log(this.name + ' macht ein Geräusch.');
+  }
+}
+
+class Loewe extends Katze {
+  sprich() {
+    super.sprich();
+    console.log(this.name + ' brüllt.');
+  }
+}
+ +

Mix-ins

+ +

Abstrakte Subklassen oder mix-ins sind Vorlagen für Klassen. Eine ECMAScript-Klasse kann nur von einer einzigen Klasse ableiten, damit ist beispielsweise mehrfache Vererbung von Helferklassen nicht möglich. Die gewünschte Funktionalität muss von der Elternklasse bereitgestellt werden.

+ +

Eine Funktion die als Input eine Elternklasse nimmt und als Output eine davon abgeleitete Subklasse ausgibt, kann verwendet werden, um mix-ins in ECMAScript zu erzeugen:

+ +
var RechnerMixin = Base => class extends Base {
+  rechne() { }
+};
+
+var ZufallsGeneratorMixin = Base => class extends Base {
+  generiere() { }
+};
+ +

Eine Klasse die ein solches mix-in verwendet kann so erzeugt werden:

+ +
class Foo { }
+class Bar extends RechnerMixin(ZufallsGeneratorMixin(Foo)) { }
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ES2015')}}Ursprüngliche Definition.
{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)EdgeInternet ExplorerOperaSafari
Basic support{{CompatChrome(42.0)}}[1]
+ {{CompatChrome(49.0)}}
{{CompatGeckoDesktop(45)}}13{{CompatNo}}{{CompatNo}}{{CompatSafari(9.0)}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FunktionAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome für Android
Basis Unterstützung{{CompatNo}}{{CompatGeckoMobile(45)}}{{CompatUnknown}}{{CompatUnknown}}9{{CompatChrome(42.0)}}[1]
+ {{CompatChrome(49.0)}}
+
+ +

[1] Benötigt den strikten Modus. Der Support im nicht-strikte Modus verbirgt sich hinter der Flag "Experimentelle JavaScript-Funktionen", welche standardmäßig deaktiviert ist.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/klassen/static/index.html b/files/de/web/javascript/reference/klassen/static/index.html new file mode 100644 index 0000000000..9c13048498 --- /dev/null +++ b/files/de/web/javascript/reference/klassen/static/index.html @@ -0,0 +1,136 @@ +--- +title: Statische Methoden +slug: Web/JavaScript/Reference/Klassen/static +tags: + - Classes + - ECMAScript 2015 + - JavaScript + - Static +translation_of: Web/JavaScript/Reference/Classes/static +--- +
{{jsSidebar("Classes")}}
+ +

Das static Schüsselwort definiert statische Methoden für eine Klasse.

+ +
{{EmbedInteractiveExample("pages/js/classes-static.html")}}
+ + + +

Syntax

+ +
static methodenName() { ... }
+ +

Beschreibung

+ +

Statische Methoden werden ohne Instanzierung einer Klasse aufgerufen und sind über eine erzeugte Instanz nicht aufrufbar. Oft werden in statische Methoden für Hilfsfunktionen verwendet.

+ +

Aufruf von statischen Methoden

+ +

Von einer anderen statischen Methode

+ +

Um eine statische Methode aus einer anderen statischen Methode der gleichen Klasse aufzurufen, kann das this Schlüsselwort verwendet werden.

+ +
class StaticMethodCall {
+    static staticMethod() {
+        return 'Static method has been called';
+    }
+    static anotherStaticMethod() {
+        return this.staticMethod() + ' from another static method';
+    }
+}
+StaticMethodCall.staticMethod();
+// 'Static method has been called'
+
+StaticMethodCall.anotherStaticMethod();
+// 'Static method has been called from another static method'
+ +

Für Klassenkonstruktoren und anderen Methoden

+ +

Statische Methoden sind mit dem this Schlüsselwort nicht direkt erreichbar von nicht statischen Methoden. Man kann sie mit dem Klassennamen aufrufen: KLASSENNAME.STATISCH_METHODE_NAME oder mit der Aufrufen einer Eigenschaft von constructor: this.constructor.STATISCH_METHODE_NAME.

+ +
class StaticMethodCall{
+    constructor(){
+        console.log(StaticMethodCall.staticMethod());
+        // 'static method has been called'
+
+        console.log(this.constructor.staticMethod());
+        // 'static method has been called'
+    }
+
+    static  staticMethod(){
+        return 'static method has been called.';
+    }
+}
+ +

Beispiele

+ +

Das folgende Beispiel demonstriert mehrere Dinge:

+ +
    +
  1. Wie eine statische Methode in einer Klasse implementiert wird.
  2. +
  3. Das von einer Klasse mit statischen Eigenschaften geerbt werden kann.
  4. +
  5. Wie eine statische Methode aufgerufen werden kann und wie nicht.
  6. +
+ +
class Triple {
+  static triple(n) {
+    if (n === undefined) {
+      n = 1;
+    }
+    return n * 3;
+  }
+}
+
+class BiggerTriple extends Triple {
+  static triple(n) {
+    return super.triple(n) * super.triple(n);
+  }
+}
+
+console.log(Triple.triple());        // 3
+console.log(Triple.triple(6));       // 18
+
+var tp = new Triple();
+
+console.log(BiggerTriple.triple(3));
+// 81 (not affected by parent's instantiation)
+
+console.log(tp.triple());
+// 'tp.triple is not a function'.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.classes.static")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/lexical_grammar/index.html b/files/de/web/javascript/reference/lexical_grammar/index.html new file mode 100644 index 0000000000..1839f1e58e --- /dev/null +++ b/files/de/web/javascript/reference/lexical_grammar/index.html @@ -0,0 +1,549 @@ +--- +title: Lexikalische Grammatik +slug: Web/JavaScript/Reference/Lexical_grammar +tags: + - JavaScript + - Keyword + - Lexical Grammer + - Literal +translation_of: Web/JavaScript/Reference/Lexical_grammar +--- +
{{JsSidebar("More")}}
+ +

Diese Seite beschreibt die lexikalische Grammatik von JavaScript. Der Programmcode von ECMAScript-Skripten wird von links nach rechts gelesen und in eine Sequenz von Eingangselementen konvertiert, welche Tokens, Kontrollzeichen, Zeilentrenner, Kommentare oder Whitespaces sein können. ECMAScript definiert zudem einige Schlüsselworte und Literale und hat Regeln für automatisch eingefügte Semikolons am ende eines Statements.

+ +

Kontrollzeichen

+ +

Kontrollzeichen haben keine sichtbare Repräsentation werden aber für die Kontrolle der Interpretation des Textes benutzt.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Unicode-Formatkontrollzeichen
CodepointNameAbkürzungBeschreibung
U+200CBindehemmer<ZWNJ>Zwischen Zeichen platziert, um zu verhindern, dass sie in bestimmte Sprachen in Ligaturen eingebunden werden (Wikipedia).
U+200DBreitenloser Verbinder<ZWJ>Platziert zwischen Zeichen, die normalerweise nicht verbunden sind, um zu bewirken, dass die Zeichen mit ihrer verbundenen Form in bestimmten Sprachen angezeigt werden (Wikipedia).
U+FEFFByte Order Mark<BOM>Wird am Anfang des Skripts verwendet, um es als Unicode und die Bytereihenfolge des Texts zu markieren (Wikipedia).
+ +

Whitespaces

+ +

Mit Spacezeichen wird die Lesbarkeit des Quelltextes verbessert und sie trennen Tokens voneinander. Diese Zeichen sind bedeutungslos für die Funktionalität des Programms. Minification Tools werden oft benutzt, um Whitespaces zu entfernen, um die übertragenen Daten zu reduzieren.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Whitespacezeichen
CodepointNameAbkürzungBeschreibungMaskierte Sequenz
U+0009Zeichen Tabulator<HT>Horizontaler Tabulator\t
U+000BZeilen Tabulator<VT>Vertikaler Tabulator\v
U+000CForm feed<FF>Kontrollzeichen für den Seitenumbruch (Wikipedia).\f
U+0020Space<SP>Normales Leerzeichen 
U+00A0Nicht unterbrechenedes space<NBSP>Normal Leerzeichen, aber keine Stelle an der die Zeile unterbrochen werden kann. 
OthersAndere Unicode Spacezeichen<USP>Spaces in Unicode auf Wikipedia 
+ +

Zeilenumbruch

+ +

Neben Whitespacezeichen werden Zeilenumbrüche auch eingesetzt, um die Lesbarkeit des Programmes zu verbessern. Es gibt ein paar Fälle, bei denen ein Zeilenumbruch einen Einfluss auf die Ausführung von JavaScript Programmen kann und an wenigen Stellen sind sie verboten. Zeilenumbrüche haben zudem einen Einfluss auf den Prozess der automatischen eingefügten Semikolons. Zeilenumbrüche werden mit der \s Klasse in Regulären Ausdrücken erkannt.

+ +

Nur die folgenden Unicode Codepoints werden als Zeilenumbrüche in ECMAScript erkannt. Andere Zeilenumbruchszeichen werden als Whitespaces erkannt (zum Beispiel sind Next Line, NEL, U+0085 Whitspaces).

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Zeilenumbruchszeichen
CodepointNameAbkürzungBeschreibungMaskierte Sequenz
U+000ALine Feed<LF>Zeichen für Zeilenumbruch in UNIX Systemen.\n
U+000DCarriage Return<CR>Zeichen für Zeilenumbruch in Commodore und frühen Mac Systemen.\r
U+2028Line Separator<LS>Wikipedia 
U+2029Paragraph Separator<PS>Wikipedia 
+ +

Kommentare

+ +

Kommentare werden benutzt, um Hinweise, Notizen, Vorschläge oder Warnungen im JavaScript Programmcode zu hinterlassen. Das kann zur Lesbarkeit und Verständnis beisteuern. Sie können auch eingesetzt werden, um ein Programmzeil auszuschalten, damit es nicht ausgeführt wird; das kan ein Werkzeug zum Debuggen sein.

+ +

JavaScript kennt zwei Typen von Kommentaren.

+ +

Der erste Typ ist der // Kommentar; Dieser macht alle folgenden Zeichen in der gleichen Zeile zu einem Kommentar. Zum Beispiel:

+ +
function comment() {
+  // Dieses ist ein einzeiliger JavaScript Kommentar
+  console.log('Hello world!');
+}
+comment();
+
+ +

Der zweite Typ ist der /* */ Style, welcher deutlich flexibler ist.

+ +

Zum Beispiel kann er auf eine Zeile angewendet werden:

+ +
function comment() {
+  /* Dieses ist ein einzeiliger JavaScript Kommentar */
+  console.log('Hello world!');
+}
+comment();
+ +

Man kann aber auch mehrzeilige Kommentare wie folgenden machen:

+ +
function comment() {
+  /* Dieses ist ein mehrzeiliger Kommentar. Zu beachten ist,
+     dass wir den Kommentar erst beenden müssen, wenn wir fertig sind. */
+  console.log('Hello world!');
+}
+comment();
+ +

Man kann aber auch einen Kommentar mitten in einer Zeile machen. Diese kann die Lesbarkeit aber negativ beeinträchtigen, weshalb diese Art mit Vorsicht zu genießen ist:

+ +
function comment(x) {
+  console.log('Hello ' + x /* Fügt den Wert von x ein */ + ' !');
+}
+comment('world');
+ +

Natürlich kann diese Art auch eingesetzt werden, um Programmteile zu deaktivieren, wie es folgendes Beispiel zeigt:

+ +
function comment() {
+  /* console.log('Hello world!'); */
+}
+comment();
+ +

In diese Fall wird der Aufruf von console.log() nie ausgeführt, weil er in einem Kommentar ist. Jede Zeile im Programm kann so deaktiviert werden.

+ +

Schlüsselwörter

+ +

Reservierte Schlüsselwörter in ECMAScript 2015

+ + + +

Reservierte zukünftige Schlüsselworte

+ +

Die folgenden Schlüsselwörter sind für die Zukunft von der ECMAScript Spezifikation reserviert. Sie haben aktuell keine spezielle Funktion, können aber in Zukunft eine Funktion bekommen, weshalb sie nicht als Bezeichner verwendet werden können.

+ +

Dieses ist immer reserviert:

+ + + +

Die folgenden sind nur reserviert, wenn sie im strict mode benutzt werden:

+ + + +

Die folgenden sind nur reserviert, wenn sie im Modul-Quelltext benutzt werden:

+ + + +

Reservierte zukünftige Schlüsselwörter aus älteren Standards

+ +

Die folgenden Schlüsselwörter wurden als zukünftige Schlüsselwörter in älteren ECMAScript Spezifikationen (ECMAScript 1 bis 3) definiert.

+ + + +

Zudem können die Literale null, true, und false nicht als Bezeichner in ECMAScript verwendet werden.

+ +

Reservierte Wörter benutzen

+ +

Reservierte Wörter gelten aktuell nur für Bezeichner (vs. Bezeichnernamen). Wie im es5.github.com/#A.1 beschrieben ist, sind diese alle Bezeichnernamen welches, bei welchen die Reservierten Wörter nicht ausgenommen sind.

+ +
a.import
+a['import']
+a = { import: 'test' }.
+
+ +

Auf der anderes Seite ist das folgende nicht erlaubt, weil es ein Bezeichner ist, der welcher ein Bezeichnername ohne ein reserviertes Wort ist. Bezeichner werden für Funktionsdeklarationen, Funktionsausdrücke, Variablendeklarationen und so weiter benutzt. Bezeichnernamen werden für Eigenschaftsausdrücke, Aufrufausdrücke und so weiter eingesetzt.

+ +
function import() {} // Illegal.
+ +

Literale

+ +

Null Literal

+ +

Sie bei null für mehr Informationen.

+ +
null
+ +

Boolean Literal

+ +

Siehe bei Boolean für mehr Informationen.

+ +
true
+false
+ +

Nummerische Literale

+ +

Dezimal

+ +
1234567890
+42
+
+// Vorsicht beim Einsatz von führenden Nullen:
+0888 // 888 parsed as decimal
+0777 // parsed as octal, 511 in decimal
+
+ +

Zu bemerken ist, dass Dezimal Literale mit eine Null (0) starten können gefolgt von anderen Dezimalstellen, aber wenn alle Zifferen nach der führenden 0 kleiner als 8 sind, wird die Zahl als Oktalzahl interpretiert. Dieses erzeugt in JavaScript keinen Fehler (siehe {{bug(957513)}}). Sie zudem auch auf der Seite über parseInt().

+ +

Binär

+ +

Die Syntax für Binärzahlen setzt sich aus einer führenden Null gefolgt von einem großen oder kleinen lateinischem Buchstachen "B" (0b oder 0B). Weil dieses Syntax in ECMAScript 2015 neu ist, sollte auf die Kompatibilitätstabelle unten geschaut werden. Wenn Ziffern nach 0b nicht 0 oder 1 sind, wird folgender SyntaxError erzeugt: "Missing binary digits after 0b".

+ +
var FLT_SIGNBIT  = 0b10000000000000000000000000000000; // 2147483648
+var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040
+var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607
+ +

Oktal

+ +

Die Syntax für Oktalzahlen setzt sich aus einer führenden Null gefolgt von einem großen oder kleinen lateinischem Buchstachen "O" (0o oder 0O). Weil dieses Syntax in ECMAScript 2015 neu ist, sollte auf die Kompatibilitätstabelle unten geschaut werden. Wenn Ziffern nach 0o außerhalb der Grenzen (01234567) sind, wird folgender SyntaxError erzeugt: "Missing octal digits after 0o".

+ +
var n = 0O755; // 493
+var m = 0o644; // 420
+
+// Auch mit nur einer führenden Null möglich (siehe dazu die Bemerkung bei den Dezimalzahlen)
+0755
+0644
+
+ +

Hexadezimal

+ +

Die Syntax für Hexadezimalahlen setzt sich aus einer führenden Null gefolgt von einem großen oder kleinen lateinischem Buchstachen "X" (0x oder 0X). Wenn Ziffern nach 0x außerhalb der Grenzen (0123456789ABCDEF) sind, wird folgender SyntaxError erzeugt: "Identifier starts immediately after numeric literal".

+ +
0xFFFFFFFFFFFFFFFFF // 295147905179352830000
+0x123456789ABCDEF   // 81985529216486900
+0XA                 // 10
+
+ +

Objekt-Literale

+ +

Siehe {{jsxref("Object")}} und Objektinitialisierer für mehr Informationen.

+ +
var o = { a: 'foo', b: 'bar', c: 42 };
+
+// Kurzschreibweise. Neu in ES2015
+var a = 'foo', b = 'bar', c = 42;
+var o = {a, b, c};
+
+// stattdessen
+var o = { a: a, b: b, c: c };
+
+ +

Array Literale

+ +

Siehe {{jsxref("Array")}} für mehr Informationen.

+ +
[1954, 1974, 1990, 2014]
+ +

String Literale

+ +
'foo'
+"bar"
+ +

Hexadezimal maskierte Sequenzen

+ +

Hexadezimal maskierte Sequenzen bestehen aus \x gefolgt von exakt zwei Hexadezimalziffern, die eine Codeeinheit oder einen Codepoint in einem Bereich von 0x0000 bis 0x00FF repräsentieren.

+ +
'\xA9' // "©"
+
+ +

Unicode maskierte Sequenzen

+ +

Eine Unicode maskierte Sequenz besteht aus genau vier Hexadezimalstellen nach einem \u. Sie bestimmt ein zwei Byte Zeichen in der UTF-16 Kodierung. Für Codepoints zwischen U+0000 und U+FFFF sind die Ziffern identisch mit den Codepoints. Codepoints von U+10000 bis U+10FFFF müssen über zwei maskierte Sequenzen, einem Ersatzpaar, angegeben werden. Das Ersatzpaar unterscheidet sich vom Codepoint.

+ +

Siehe dazu auch {{jsxref("String.fromCharCode()")}} und {{jsxref("String.prototype.charCodeAt()")}}.

+ +
'\u00A9' // "©" (U+A9)
+ +

Unicode Codepointmaskierung

+ +

Mit Unicode Codepointmaskierung besteht aus \u{ gefolgt von einem Codepoint in hexadezimaler Basis gefolgt von }. Die Werte der Hexadezimalstellen müssen in einem Bereich von 0 und 0x10FFFF inklusiv sein. Codepoints in einem Bereich von U+10000 bis U+10FFFF müssen nicht als Ersatzpaar angegeben werden. Codepointsmaskierung wurde in ECMAScript 2015 (ES6) zu JavaSCript hinzugefügt.

+ +

Siehe zudem auch {{jsxref("String.fromCodePoint()")}} und {{jsxref("String.prototype.codePointAt()")}}.

+ +
'\u{2F804}' // CJK COMPATIBILITY IDEOGRAPH-2F804 (U+2F804)
+
+// Das gleiche mit einfache Unicodemaskierung
+'\uD87E\uDC04'
+ +

Reguläre Ausdrucksliterale

+ +

Siehe zudem RegExp für mehr Informationen.

+ +
/ab+c/g
+
+// Ein "leerers" Regulärers Ausdrucksliteral
+// Die leere Gruppe ist notwendig,
+// um einen einzeiligen Kommentar zu verhindern.
+/(?:)/
+ +

Template Literale

+ +

Siehe zudem Template Strings für mehr Informationen.

+ +
`string text`
+
+`string text zeile 1
+ string text zeile 2`
+
+`string text ${ausdruck} string text`
+
+tag `string text ${ausdruck} string text`
+ +

Automatisches Einfügen von Semikolons

+ +

Eine JavaScript Statements müssen durch ein Semikolon beendet werden, wodurch die automatisches Einfügen von Semikolon (ASI kurz für automatic semicolon insertion) einen Einfluss auf diese hat:

+ + + +

Die ECMAScript Spezifikation erwähnt drei Regeln für automatisches Einfügen von Semikolons.

+ +

1. Ein Semikolon wird eingefügt, bevor ein Zeilenumbruch oder "}" angegeben wird, welches nicht von der Grammatik erlaubt ist.

+ +
{ 1 2 } 3
+
+// Wird von ASI in folgendes transformiert
+
+{ 1 2 ;} 3;
+ +

2. Ein Semikolon wird am ende Eingefügt, wenn das Ende der eingehenden Tokens erkannt wurde und der Parser nicht in der Lage ist den Input als ganzes Programm zu erkennen.

+ +

Hier wird ++ nicht als Postfixoperator für die Variable b erkannt, weil ein Zeilenumbruch zwischen b und ++ ist.

+ +
a = b
+++c
+
+// Wird von ASI in folgendes transformiert
+
+a = b;
+++c;
+
+ +

3. Ein Semikolon wird am Ende eingefügt, wenn auf eine Anweisung mit eingeschränkten Produktionen in der Grammatik ein Zeilenabschlusszeichen folgt. Diese Anweisungen mit "no LineTerminator here"-Regeln lauten:

+ + + +
return
+a + b
+
+// Wird von ASI in folgendes transformiert
+
+return;
+a + b;
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2("ES1")}}Initiale Definition.
{{SpecName('ES5.1', '#sec-7', 'Lexical Conventions')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-ecmascript-language-lexical-grammar', 'Lexical Grammar')}}{{Spec2('ES6')}}Hinzugefügt: Binäre und Oktal Zahlenliterale, Unicode Codepoint-Maskierung, Templates
{{SpecName('ESDraft', '#sec-ecmascript-language-lexical-grammar', 'Lexical Grammar')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.grammar")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/addition/index.html b/files/de/web/javascript/reference/operators/addition/index.html new file mode 100644 index 0000000000..6f95df95d1 --- /dev/null +++ b/files/de/web/javascript/reference/operators/addition/index.html @@ -0,0 +1,82 @@ +--- +title: Addition (+) +slug: Web/JavaScript/Reference/Operators/Addition +tags: + - JavaScript + - Operator + - Referenz + - Sprachfeature +translation_of: Web/JavaScript/Reference/Operators/Addition +--- +
{{jsSidebar("Operators")}}
+ +

Der Addition-Operator (+) erzeugt die Summe nummerischer Operanden oder setzt Zeichenketten zusammen.

+ +
{{EmbedInteractiveExample("pages/js/expressions-addition.html")}}
+ +
+ + + +

Syntax

+ +
Operator: x + y
+
+ +

Beispiele

+ +

Nummerische Addition (Summe)

+ +
// Nummer + Nummer -> Addition (Summe)
+1 + 2 // 3
+
+// Boolean + Nummer -> Addition (Summe, da true = 1)
+true + 1 // 2
+
+// Boolean + Boolean -> Addition (Summe, da false = 0)
+false + false // 0
+
+ +

Zeichenkettenzusammensetzung

+ +
// String (Zeichenkette) + String (Zeichenkette) -> Zusammensetzung
+'foo' + 'bar' // "foobar"
+
+// Nummer + String (Zeichenkette) -> Zusammensetzung
+5 + 'foo' // "5foo"
+
+// String (Zeichenkette) + Boolean -> Zusammensetzung
+'foo' + false // "foofalse"
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-addition-operator-plus', 'Addition Operator')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.addition")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/array_comprehensions/index.html b/files/de/web/javascript/reference/operators/array_comprehensions/index.html new file mode 100644 index 0000000000..a7d34cc1ea --- /dev/null +++ b/files/de/web/javascript/reference/operators/array_comprehensions/index.html @@ -0,0 +1,200 @@ +--- +title: Array Comprehensions +slug: Web/JavaScript/Reference/Operators/Array_comprehensions +tags: + - JavaScript + - Non-standard + - Operator + - Reference +translation_of: Archive/Web/JavaScript/Array_comprehensions +--- +
Nicht standardisiert. Nicht einsetzen!
+Die Array Comprehensions Syntax ist nicht Standardisiert und wurde mit Firefox 58 entfernt. Zukünftig müssen {{jsxref("Array.prototype.map")}}, {{jsxref("Array.prototype.filter")}}, {{jsxref("Functions/Arrow_functions", "Pfeilfunktionen", "", 1)}}, und {{jsxref("Operators/Spread_operator", "Spread Syntax", "", 1)}} eingesetzt werden.
+ +
{{jsSidebar("Operators")}}
+ +

Die Array Comprehensions Syntax war ein JavaScript Ausdruck, welcher es erlaubt schnell ein neues Array auf Basis eines existierenden zu erstellen. Jedoch wurde diese vom Standard und der Firefox Implementierung entfernt. Nicht mehr einsetzen!

+ +

Syntax

+ +
[for (x of iterable) x]
+[for (x of iterable) if (condition) x]
+[for (x of iterable) for (y of iterable) x + y]
+
+ +

Beschreibung

+ +

In Array Comprehensions können zwei Arten von Komponenten eingesetzt werden:

+ + + +

Der for-of Iterator ist immer die erste Komponente. Mehrere for-of Iteratoren oder if Statements sind erlaubt.

+ +

Array Comprehension wurden zuvor für den ECMAScript 2016 Standard vorgeschlagen und ist eine nützliche Kurzform zum Erstellen von neuen Arrays auf Basis des Inhalts andere.Comprehensions können oft statt den Aufrufen {{jsxref("Array.prototype.map", "map()")}} und {{jsxref("Array.prototype.filter", "filter()")}} eingesetzt werden oder als Möglichkeit beide zu kombinieren.

+ +

Die folgende Comprehension nimmt ein Array von Zahlen und erstellt ein neues Array, dass das Doppelte jeder Zahl enthält.

+ +
var numbers = [1, 2, 3, 4];
+var doubled = [for (i of numbers) i * 2];
+console.log(doubled); // logs 2,4,6,8
+
+ +

Das ist äquivalent zu der folgenden {{jsxref("Array.prototype.map", "map()")}} Operation:

+ +
var doubled = numbers.map(i => i * 2);
+
+ +

Comprehensions können ebenfalls für das suchen bestimmter Elemente eingesetzt werden. Hier ist eine Comprehension welche nur gerade Zahlen auswählt:

+ +
var numbers = [1, 2, 3, 21, 22, 30];
+var evens = [for (i of numbers) if (i % 2 === 0) i];
+console.log(evens); // logs 2,22,30
+
+ +

{{jsxref("Array.prototype.filter", "filter()")}} kann mit dem gleichen Ergebnis benutzt werden:

+ +
var evens = numbers.filter(i => i % 2 === 0);
+
+ +

{{jsxref("Array.prototype.map", "map()")}} und {{jsxref("Array.prototype.filter", "filter()")}} Operation können in einer einzigen Array Comprehension kombiniert werden. Hier ist ein Beispiel, welches auf gerade Zahlen filtert und diese dann verdopelt:

+ +
var numbers = [1, 2, 3, 21, 22, 30];
+var doubledEvens = [for (i of numbers) if (i % 2 === 0) i * 2];
+console.log(doubledEvens); // logs 4,44,60
+
+ +

Die eckigen Klammern einer Array Comprehension führen einen impliziten Block für Gültigkeitsbereiche ein. Neue Variablen (wie i im Beispiel) werden so behandelt, als währen sie mit {{jsxref("Statements/let","let")}} deklariert. Das bedeutet, dass sie nicht außerhalb der Comprehension sichtbar sind.

+ +

Der Input einer Array Comprehension muss nicht selbst ein Array sein; Iteratoren und Generatoren könne ebenfalls benutzt werden.

+ +

Auch Strings können als Input genutzt werden;

+ +

Even strings may be used as input; um die Filter- und Map-Aktionen (unter Array-ähnlichen Objekten) oben zu erreichen:

+ +
var str = 'abcdef';
+var consonantsOnlyStr = [for (c of str) if (!(/[aeiouAEIOU]/).test(c)) c].join(''); // 'bcdf'
+var interpolatedZeros = [for (c of str) c + '0' ].join(''); // 'a0b0c0d0e0f0'
+
+ +

Auch hier wird das Eingabeformat nicht beibehalten, so dass man {{jsxref("Array.prototype.join", "join()")}} benutzen muss, um wieder einen String zu bekommen.

+ +

Beispiele

+ +

Einfache Array Comprehensions

+ +
[for (i of [1, 2, 3]) i * i ];
+// [1, 4, 9]
+
+var abc = ['A', 'B', 'C'];
+[for (letters of abc) letters.toLowerCase()];
+// ["a", "b", "c"]
+ +

Array Comprehensions mit if Statement

+ +
var years = [1954, 1974, 1990, 2006, 2010, 2014];
+[for (year of years) if (year > 2000) year];
+// [2006, 2010, 2014]
+[for (year of years) if (year > 2000) if (year < 2010) year];
+// [2006], the same as below:
+[for (year of years) if (year > 2000 && year < 2010) year];
+// [2006]
+
+ +

Array Comprehensions verglichen zu map und filter

+ +

Ein einfacher Weg um Generator Comprehension Syntax zu verstehen ist es sie mit den Array {{jsxref("Array.map", "map")}} und {{jsxref("Array.filter", "filter")}} Methoden zu vergleichen:

+ +
var numbers = [1, 2, 3];
+
+numbers.map(function (i) { return i * i });
+numbers.map(i => i * i);
+[for (i of numbers) i * i];
+// all are [1, 4, 9]
+
+numbers.filter(function (i) { return i < 3 });
+numbers.filter(i => i < 3);
+[for (i of numbers) if (i < 3) i];
+// all are [1, 2]
+
+ +

Array Comprehensions mit zwei Arrays

+ +

Einsatz von zwei for-of Iteratoren, um mit Arrays zu arbeiten:

+ +
var numbers = [1, 2, 3];
+var letters = ['a', 'b', 'c'];
+
+var cross = [for (i of numbers) for (j of letters) i + j];
+// ["1a", "1b", "1c", "2a", "2b", "2c", "3a", "3b", "3c"]
+
+var grid = [for (i of numbers) [for (j of letters) i + j]];
+// [
+//  ["1a", "1b", "1c"],
+//  ["2a", "2b", "2c"],
+//  ["3a", "3b", "3c"]
+// ]
+
+[for (i of numbers) if (i > 1) for (j of letters) if(j > 'a') i + j]
+// ["2b", "2c", "3b", "3c"], the same as below:
+
+[for (i of numbers) for (j of letters) if (i > 1) if(j > 'a') i + j]
+// ["2b", "2c", "3b", "3c"]
+
+[for (i of numbers) if (i > 1) [for (j of letters) if(j > 'a') i + j]]
+// [["2b", "2c"], ["3b", "3c"]], not the same as below:
+
+[for (i of numbers) [for (j of letters) if (i > 1) if(j > 'a') i + j]]
+// [[], ["2b", "2c"], ["3b", "3c"]]
+
+ +

Spezifikationen

+ +

War initial im ECMAScript 2015 Entwurf, wurde jedoch in der Überarbeitung 27 (August 2014) entfernt. Für Spezifikationssemantik muss in älteren Überarbeitungen von ES2015 nachgeschaut werden.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.array_comprehensions")}}

+ +

Unterschiede zu den älteren JS1.7/JS1.8 Comprehensions

+ +
JS1.7/JS1.8 Comprehensions wurden von Gecko 46 entfernt ({{bug(1220564)}}).
+ +

Alte Comprehensions Syntax (nicht mehr benutzen!):

+ +
[X for (Y in Z)]
+[X for each (Y in Z)]
+[X for (Y of Z)]
+
+ +

Unterschiede:

+ + + +

Siehe Bug 1220564, Kommentar 42 für Vorschläge zum Aktualisieren von Code.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/async_function/index.html b/files/de/web/javascript/reference/operators/async_function/index.html new file mode 100644 index 0000000000..906f82dbcb --- /dev/null +++ b/files/de/web/javascript/reference/operators/async_function/index.html @@ -0,0 +1,107 @@ +--- +title: async function Ausdruck +slug: Web/JavaScript/Reference/Operators/async_function +tags: + - Experimental + - Function + - JavaScript + - Operator + - Primary Expression +translation_of: Web/JavaScript/Reference/Operators/async_function +--- +
{{jsSidebar("Operators")}}
+ +

Das async function Schlüsselwort kann benutzt werden, um async Funktionen in Ausdrücken zu benutzen.

+ +

Man kann asynchrone Funktionen auch mit einem async Funktionsstatement definieren.

+ +

Syntax

+ +
async function [name]([param1[, param2[, ..., paramN]]]) {
+   statements
+}
+ +

Seit ES2015 kann man auch Pfeilfunktionen benutzen.

+ +

Parameter

+ +
+
name
+
Der Funktionsname. Kann weggelassen werden, wenn die Funktion anonym ist. Der Name ist nur lokal im Funktionsrumpf erreichbar.
+
paramN
+
Der Name eines Arguments, welches der Funktion übergeben wird.
+
statements
+
Die Statements, welche den Funktionsrumpf definieren.
+
+ +

Beschreibung

+ +

Ein async function Ausdruck ist sehr ähnlich zu {{jsxref('Statements/async_function', 'async Funktionsstatements')}} und haben fast die selbe Syntax. Der Hauptunterschied zwischen einem async Funktionsausdruck und einem async Funktionsstatement ist der Funktionsname, welcher bei async Funktionsausdrücken weggelassen werden kann, um anonyme Funktionen zu erstellen. Ein async Funktionsausdruck kann als {{Glossary("IIFE")}} (Immediately Invoked Function Expression) genutzt werden, welche Ausgeführt werden, nachdem sie definiert wurde. Mehr Informationen dazu gibt es im Kapitel über Funktionen.

+ +

Beispiele

+ +

Einfaches Beispiel

+ +
function resolveAfter2Seconds(x) {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve(x);
+    }, 2000);
+  });
+};
+
+
+var add = async function(x) { // async function expression assigned to a variable
+  var a = await resolveAfter2Seconds(20);
+  var b = await resolveAfter2Seconds(30);
+  return x + a + b;
+};
+
+add(10).then(v => {
+  console.log(v);  // prints 60 after 4 seconds.
+});
+
+
+(async function(x) { // async function expression used as an IIFE
+  var p_a = resolveAfter2Seconds(20);
+  var p_b = resolveAfter2Seconds(30);
+  return x + await p_a + await p_b;
+})(10).then(v => {
+  console.log(v);  // prints 60 after 2 seconds.
+});
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.operators.async_function_expression")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/await/index.html b/files/de/web/javascript/reference/operators/await/index.html new file mode 100644 index 0000000000..6684cb195c --- /dev/null +++ b/files/de/web/javascript/reference/operators/await/index.html @@ -0,0 +1,112 @@ +--- +title: await +slug: Web/JavaScript/Reference/Operators/await +tags: + - Experimental + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/await +--- +
{{jsSidebar("Operators")}}
+ +

Der await Operator wird genutzt, um auf einen {{jsxref("Promise")}} zu warten. Er kann nur in einer {{jsxref("Statements/async_function", "async Funktion")}} benutzt werden.

+ +

Syntax

+ +
[rv] = await expression;
+ +
+
expression
+
Ein {{jsxref("Promise")}} oder jeder Wert, auf den gewartet wird.
+
rv
+
+

Gibt den ermittelten Wert des Promise zurück, oder den Wert selbst, wenn es sich nicht um ein Promise handelt.

+
+
+ +

Beschreibung

+ +

Der await Ausdruck lässt async Funktionen pausieren, bis ein Promise erfüllt oder abgewiesen ist, und führt die async danach weiter aus. Wenn die Funktion weiter ausgeführt wird, ist der Wert des await Ausdrucks der Wert des erfüllten Promise.

+ +

Wenn das Promise abgewiesen wird, wirft der await Ausdruck eine Exception mit dem zurückgewiesenen Wert.

+ +

Ist der Wert des Ausdrucks, der auf den await Operator folgt, kein Promise ist, wird dieser zu einem erfüllten Promise konvertiert.

+ +

Beispiele

+ +

Wenn ein Promise im await Ausdruck genutzt wird, wartet dieser, bis das Promise fertig ist und gibt den ermittelten Wert zurück.

+ +
function resolveAfter2Seconds(x) {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve(x);
+    }, 2000);
+  });
+}
+
+async function f1() {
+  var x = await resolveAfter2Seconds(10);
+  console.log(x); // 10
+}
+f1();
+
+ +

Wenn der Wert kein Promise ist, wird dieser zu einem erfüllten Promise konvertiert und dessen Wert zurückgegeben.

+ +
async function f2() {
+  var y = await 20;
+  console.log(y); // 20
+}
+f2();
+ +

Wird ein Promise abgewiesen, so wird eine Exception mit dem zurückgewiesene Wert geworfen.

+ +
async function f3() {
+  try {
+    var z = await Promise.reject(30);
+  } catch(e) {
+    console.log(e); // 30
+  }
+}
+f3();
+ +

Abfangen von abgewiesenen Promises ohne try-Block.

+ +
var response = await promisedFunction().catch((err) => { console.log(err); });
+// response will be undefined if the promise is rejected
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-async-function-definitions', 'async functions')}}{{Spec2('ESDraft')}}Initiale Definition in ES2017.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.operators.await")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/bitwise_operatoren/index.html b/files/de/web/javascript/reference/operators/bitwise_operatoren/index.html new file mode 100644 index 0000000000..01b1ed5712 --- /dev/null +++ b/files/de/web/javascript/reference/operators/bitwise_operatoren/index.html @@ -0,0 +1,574 @@ +--- +title: Bitweise Operatoren +slug: Web/JavaScript/Reference/Operators/Bitwise_Operatoren +tags: + - JavaScript + - Operator + - Reference +translation_of: Web/JavaScript/Reference/Operators +--- +
{{jsSidebar("Operators")}}
+ +

Bitweise Operatoren werden auf Sequenzen aus 32 bit (Nullen und Einsen) angewandt im Gegensatz zu Operatoren, die mit Dezimal-, Hexadezimal- oder Oktalzahlen (numbers) arbeiten. Beispielsweise hat die Dezimalzahl neun die binäre Darstellung 1001. Auch wenn Bitweise Operatoren mit Binärdarstellungen arbeiten, sind deren Ausgabewerte Javascript Standardzahlenwerte.

+ +
{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}
+ + + +

Die folgende Tabelle fasst Javascripts Bitweise Operatoren zusammen:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OperatorEinsatzBeschreibung
Bitweises UNDa & bGibt 1 in jeder Bit Position zurück, an welcher beide Operanden 1 sind.
Bitweises ODERa | bGibt 1 in jeder Bit Position zurück, an welcher einer oder beide Operanden 1 sind.
Bitweises XORa ^ bGibt 1 in jeder Bit Position zurück, an welcher einer aber nicht beide Operanden 1 sind.
Bitweise Negation~ aInvertiert die Bits des Operanden
Linksverschiebunga << bVerschiebt a in binärer Repräsentation b (< 32) Bits nach links, von Rechts werden Nullen hereingeschoben.
Vorzeichen propagierende Rechtsverschiebunga >> bVerschiebt a in binärer Repräsentation b (< 32) Bits nach rechts, herausgeschobene Bits werden verworfen.
Null füllende Rechtsverschiebunga >>> bVerschiebt a in binärer Repräsentation b (< 32) Bits nach rechts, herausgeschobene Bits werden verworfen und Nullen werden von links hereingeschoben.
+ +

Vorzeichenbehaftete 32-Bit Integer

+ +

Die Operanden aller Bitweisen Operationen werden in vorzeichenbehaftete 32-Bit Integer im Zweierkomplementformat konvertiert. Zweierkomplementformat bedeutet, dass das Gegenstück einer negative Zahl alle Bits invertiert (Bitweise Negation einer Zahl oder auch Einerkomplement einer Zahl) plus eins ist. Zum Beispiel die codierte Integer 314:

+ +
00000000000000000000000100111010
+
+ +

Im Folgenden ist ~314 codiert, d. h. das Einerkomplement von 314:

+ +
11111111111111111111111011000101
+
+ +

Anschließend wird -314 codiert, d. h. das Zweierkomplement 314:

+ +
11111111111111111111111011000110
+
+ +

Das Zweierkomplement garantiert, dass das Bit ganz links 0 ist, wenn die Zahl Positiv ist und 1 ist, wenn die Zahl negativ ist. Dieses wird das Vorzeichenbit genannt.

+ +

Die Zahl 0 ist ein Integer, der komplett aus 0 Bits besteht.

+ +
0 (base 10) = 00000000000000000000000000000000 (base 2)
+
+ +

Die Zahl -1 ist ein Integer der komplett aus 1 Bits besteht.

+ +
-1 (base 10) = 11111111111111111111111111111111 (base 2)
+
+ +

Die Zahl -2147483648 (hexadezimale Repräsentation: -0x80000000) ist der Integer, welcher komplett aus 0 Bits besteht, außer dem ersten Bit (linkes Bit).

+ +
-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
+
+ +

Die Zahl 2147483647 (hexadezimale Repräsentation: -0x7fffffff) ist der Integer, welcher komplett aus 1 Bits besteht, außer dem ersten Bit (linkes Bit).

+ +
2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
+
+ +

Die Zahlen -2147483648 und 2147483647 sind die minimalen und Maximalen Integers, die mit 32-Bit vorzeichenbehafteten Zahlen repräsentiert werden können.

+ +

Bitweise logische Operatoren

+ +

Konzeptionell arbeiten die bitweisen logischen Operatoren wie folgt:

+ + + +

& (Bitweises UND)

+ +

Führt die UND Operation auf jedem Bitpaar durch. a UND b ergibt 1, wenn beide a und b 1 sind. Die Wahrheitstabelle für den UND Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba UND b
000
010
100
111
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 & 9 (Basis 10) = 00000000000000000000000000001000 (Basis 2) = 8 (Basis 10)
+
+ +

Bitweises verUNDen jeder Zahl x mit 0 ergibt 0. Bitweises verUNDen jeder Zahl x mit -1 ergibt x.

+ +

| (Bitweises ODER)

+ +

Führt die ODER Operation auf jedem Bitpaar durch. a ODER b ergibt 1, wenn einer, a oder b, 1 sind. Die Wahrheitstabelle für den ODER Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba ODER b
000
011
101
111
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 | 9 (Basis 10) = 00000000000000000000000000001111 (Basis 2) = 15 (Basis 10)
+
+ +

Bitweises verODERn jeder Zahl x mit 0 ergibt x. Bitweises verODERn jeder Zahl x mit -1 ergibt -1.

+ +

^ (Bitweises XOR)

+ +

Führt die XOR Operation auf jedem Bitpaar durch. a XOR b ergibt 1, wenn sich a und b, unterscheiden. Die Wahrheitstabelle für den XOR Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba XOR b
000
011
101
110
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 ^ 9 (Basis 10) = 00000000000000000000000000000111 (Basis 2) = 7 (Basis 10)
+
+ +

Bitweises verXORn jeder Zahl x mit 0 ergibt x. Bitweises verXORn jeder Zahl x mit -1 ergibt ~x.

+ +

~ (Bitweise Negation)

+ +

Führt die Negationsoperation auf jedem Bit durch. NICHT a ergibt ergibt den invertierten Wert (d. h. das Einerkomplement) von a. Die Wahrheitstabelle für den Negationsoperator ist:

+ + + + + + + + + + + + + + + + +
aNICHT a
01
10
+ +
 9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+                --------------------------------
+~9 (Basis 10) = 11111111111111111111111111110110 (Basis 2) = -10 (Basis 10)
+
+ +

Bitweises Negieren jeder Zahl x ergibt -(x + 1). Zum Beispiel ergibt ~-5 4.

+ +

Beispiel mit indexOf:

+ +
var str = 'rawr';
+var searchFor = 'a';
+
+// Das ist eine alternativer Weg um if (-1*str.indexOf('a') <= 0) zu tippen
+if (~str.indexOf(searchFor)) {
+  // searchFor is in the string
+} else {
+  // searchFor is not in the string
+}
+
+// Hier die Werte, die von (~str.indexOf(searchFor)) zurück gegeben werden
+// r == -1
+// a == -2
+// w == -3
+
+ +

Bitweise Verschiebeoperatoren

+ +

Die bitweisen Verschiebeoperatoren (shift Operatoren) haben zwei Operanden: Der erste ist der Anteil, der verschoben werden soll und der zweite ist die Anzahl der Positionen, um die der erste Operand verschoben werden soll. Die Richtung der Verschiebung wird durch den eingesetzten Operator festgelegt.

+ +

Verschiebeoperatoren konvertieren ihre Operanden in 32-Bit Integers in Bit-Endian Reihenfolge und geben als Resultat den gleichen Typ des linken Operanden zurück. Der rechte Operand sollte kleiner als 32 sein, aber wenn das nicht so ist, werden nur die kleinsten fünf Bits verwendet.

+ +

<< (Linksverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach links. Überflüssige Bits, die nach links verschoben wurden, werden verworfen. Von rechts wird mit 0-Bits aufgefüllt.

+ +

Zum Beispiel ergibt 9 << 2 36:

+ +
.    9 (Basis 10): 00000000000000000000000000001001 (Basis 2)
+                   --------------------------------
+9 << 2 (Basis 10): 00000000000000000000000000100100 (Basis 2) = 36 (Basis 10)
+
+ +

Bitweises Verschieben jeder Zahl x nach links mit y Bits ergibt x * 2 ** y.

+ +

>> (Vorzeichen propagierende Rechtsverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach rechts. Überflüssige Bits, die nach rechts verschoben wurden, werden verworfen. Kopien des linken Bits (Vorzeichenbits) werden von links hereingeschoben. Weil das neue Vorzeichenbit immer das selbe wie das alte Vorzeichenbit ist, ändert sich das linke Bit nicht. Daher kommt der Name "Vorzeichen propagierend" her.

+ +

Zum Beispiel ergibt 9 >> 2 2:

+ +
.    9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+
+ +

Likewise, -9 >> 2 yields -3, because the sign is preserved:

+ +
.    -9 (Basis 10): 11111111111111111111111111110111 (Basis 2)
+                    --------------------------------
+-9 >> 2 (Basis 10): 11111111111111111111111111111101 (Basis 2) = -3 (Basis 10)
+
+ +

>>> (Null füllende Rechtsverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach rechts. Überflüssige Bits, die nach rechts verschoben wurden, werden verworfen. Von link wird mit 0-Bits aufgefüllt. Das Vorzeichenbit wird 0, so dass das Ergebnis nie negativ ist.

+ +

Für nicht negative Zahlen ist das Ergebnis bei der Null füllenden Rechtsverschiebung und bei der Vorzeichen propagierenden Rechtsverschiebung das selbe. Zum Beispiel ergibt 9 >>> 2 2, das selbe wie 9 >> 2:

+ +
.     9 (Basis 10): 00000000000000000000000000001001 (Basis 2)
+                    --------------------------------
+9 >>> 2 (Basis 10): 00000000000000000000000000000010 (Basis 2) = 2 (Basis 10)
+
+ +

Jedoch ist das nicht der Fall für negative Zahlen. Zum Beispiel ergibt -9 >>> 2 1073741821, was sich unterschiedet von -9 >> 2 (was -3 ergibt):

+ +
.     -9 (Basis 10): 11111111111111111111111111110111 (Basis 2)
+                     --------------------------------
+-9 >>> 2 (Basis 10): 00111111111111111111111111111101 (Basis 2) = 1073741821 (Basis 10)
+
+ +

Beispiele

+ +

Flags und Bitmasken

+ +

Die bitweisen logischen Operatoren werden häufig eingesetzt, um Sequenzen von Flags zu erstellen, zu manipulieren und zu lesen, welche wie binäre Variablen sind. Variablen können statt dieser Sequenzen genutzt werden, aber binäre Flags verbrauchen weniger Speicher (um den Faktor 32).

+ +

Angenommen es gibt 4 Flags:

+ + + +

Diese Flags sind durch eine Sequenz von Bits repräsentiert: DCBA. Wenn ein Flag gesetzt wird, hat es den Wert 1. Wenn ein Flag geleert wird, hat es den Wert 0. Angenommen eine Variable flags hat den binären Wert 0101:

+ +
var flags = 5;   // binär 0101
+
+ +

Dieser Wert zeigt an:

+ + + +

Weil Bitweise Operatoren mit 32-Bit arbeiten, ist 0101 eigentlich 00000000000000000000000000000101, aber die führenden nullen können vernachlässigt werden, weil sie keine Informationen enthalten.

+ +

Eine Bitmaske ist eine Sequenz von Bits, die Flags manipulieren und/oder lesen kann. Typisch ist es, dass eine "primitive" Bitmaske für jedes Flag definiert ist:

+ +
var FLAG_A = 1; // 0001
+var FLAG_B = 2; // 0010
+var FLAG_C = 4; // 0100
+var FLAG_D = 8; // 1000
+
+ +

Neue Bitmasken können erstellt werden, indem bitweise logische Operatoren auf den primitiven Bitmasken angewendet werden. Zum Beispiel kann die Bitmaske 1011 mit VerODERn von FLAG_A, FLAG_B und FLAG_D erstellt werden:

+ +
var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 => 1011
+
+ +

Individuelle Flagwerte können durch das VerUNDen mit einer Bitmaske extrahiert werden, wobei jedes Bit mit dem Wert eins das korrespondierende Flag extrahiert. Die Bitmaske wirft nicht relevante Flags heraus, indem Nullen verUNDet werden (daher der Begriff "Bitmaske"). Zum Beispiel kann die Bitmaske 0100 genutzt werden, um zu sehen, ob Flag C gesetzt ist:

+ +
// Wenn man eine Katze besitzt
+if (flags & FLAG_C) { // 0101 & 0100 => 0100 => true
+   // tu irgendetwas
+}
+
+ +

Eine Bitmaske mit mehreren gesetzten Flags funktioniert wie ein "entweder/oder". Zum Beispiel sind die beiden folgenden Ansätze äquivalent:

+ +
// wenn man eine Fledermaus besitzt oder eine Katze besitzt
+// (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true
+if ((flags & FLAG_B) || (flags & FLAG_C)) {
+   // do stuff
+}
+
+ +
// wenn man eine Fledermaus oder eine Katze besitzt
+var mask = FLAG_B | FLAG_C; // 0010 | 0100 => 0110
+if (flags & mask) { // 0101 & 0110 => 0100 => true
+   // do stuff
+}
+
+ +

Flags können mit VerODERung mit einer Bitmaske gesetzt werden, wobei jedes Bit in der Bitmaske mit dem Wert 1 wird das korrespondierende Flag setzen, wenn es noch nicht gesetzt ist. Zum Beispiel kann die Bitmaske 1100 benutzt werden, um die Flags C und D zu setze:

+ +
// ja, man besitzt eine Katze und eine Ente
+var mask = FLAG_C | FLAG_D; // 0100 | 1000 => 1100
+flags |= mask;   // 0101 | 1100 => 1101
+
+ +

Flags können mit VerUNDung mit einer Bitmaske geleert werden, wobei jedes Bit in der Bitmaske mit dem Wert 0 wird das korrespondierende Flag geleert, wenn es noch nicht geleert ist. Die Bitmaske dafür kann mit Negation primitiver Bitmasken erstellt werden Zum Beispiel kann die Bitmaske 1010 benutzt werden, um die Flags A und C zu leeren:

+ +
// no, we don't have an ant problem or own a cat
+var mask = ~(FLAG_A | FLAG_C); // ~0101 => 1010
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

The mask could also have been created with ~FLAG_A & ~FLAG_C (De Morgan's law):

+ +
// nein, mat hat kein Problem mit Ameisen und man besitzt keine Katze
+var mask = ~FLAG_A & ~FLAG_C;
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

Flags können mit VerXORung mit einer Bitmaske umgeschaltet werden, wobei jedes Bit in der Bitmaske mit dem Wert 1 wird das korrespondierende Flag umschaltet. Zum Beispiel kann die Bitmaske 0110 benutzt werden, um die Flags B und C umzuschalten:

+ +
// wenn man keine Fledermaus besitzt und und jetzt eine bekommt
+// and wenn man eine hat und die Fledermaus verabschiedet
+// das gleiche für eine Katze
+var mask = FLAG_B | FLAG_C;
+flags = flags ^ mask;   // 1100 ^ 0110 => 1010
+
+ +

Alle Flags können mit dem Negationsoperator umgedreht werden:

+ +
// entering parallel universe...
+flags = ~flags;    // ~1010 => 0101
+
+ +

Konvertierungsbeispiele

+ +

Konvertierung eines binär String zu einer dezimal Number:

+ +
var sBinString = '1011';
+var nMyNumber = parseInt(sBinString, 2);
+alert(nMyNumber); // prints 11, i.e. 1011
+
+ +

Konvertierung einer dezimal Number zu einem binär String:

+ +
var nMyNumber = 11;
+var sBinString = nMyNumber.toString(2);
+alert(sBinString); // prints 1011, i.e. 11
+
+ +

Bitmaskenerstellung automatisieren

+ +

Man kann, wie folgt, mehrere Masken von einer Menge von Boolean Werten erstellen:

+ +
function createMask() {
+  var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length;
+  for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++);
+  return nMask;
+}
+var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
+var mask2 = createMask(false, false, true); // 4, i.e.: 0100
+var mask3 = createMask(true); // 1, i.e.: 0001
+// etc.
+
+alert(mask1); // prints 11, i.e.: 1011
+
+ +

Umgedrehter Algorithmus: Ein Array von Booleanen von einer Bitmaske

+ +

Wenn man ein Array mit Boolean Werten von einer Bitmaske haben möchte, kann man folgenden Code benutzen:

+ +
function arrayFromMask(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  if (nMask > 0x7fffffff || nMask < -0x80000000) {
+    throw new TypeError('arrayFromMask - out of range');
+  }
+  for (var nShifted = nMask, aFromMask = []; nShifted;
+       aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1);
+  return aFromMask;
+}
+
+var array1 = arrayFromMask(11);
+var array2 = arrayFromMask(4);
+var array3 = arrayFromMask(1);
+
+alert('[' + array1.join(', ') + ']');
+// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
+
+ +

Man kann beide Algorithmen gleichzeitig testen:

+ +
var nTest = 19; // our custom mask
+var nResult = createMask.apply(this, arrayFromMask(nTest));
+
+alert(nResult); // 19
+
+ +

Nur aus didaktischen Gründen (weil dort die Number.toString(2) Methode ist), zeigen wir, wie es möglich ist den arrayFromMask Algorithmus zu verändern, um einen String mit der Binärrepräsentation der Number statt eines Arrays von Booleanen:

+ +
function createBinaryString(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32;
+       nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1);
+  return sMask;
+}
+
+var string1 = createBinaryString(11);
+var string2 = createBinaryString(4);
+var string3 = createBinaryString(1);
+
+alert(string1);
+// prints 00000000000000000000000000001011, i.e. 11
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-11.7')}}{{Spec2('ES5.1')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ES6', '#sec-bitwise-shift-operators')}}{{Spec2('ES6')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ESDraft', '#sec-bitwise-shift-operators')}}{{Spec2('ESDraft')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.bitwise")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/class/index.html b/files/de/web/javascript/reference/operators/class/index.html new file mode 100644 index 0000000000..1cc8a647e3 --- /dev/null +++ b/files/de/web/javascript/reference/operators/class/index.html @@ -0,0 +1,157 @@ +--- +title: Der class-Ausdruck +slug: Web/JavaScript/Reference/Operators/class +tags: + - Classes + - ECMAScript 2015 + - Expression + - JavaScript + - Operator + - Reference +translation_of: Web/JavaScript/Reference/Operators/class +--- +
{{jsSidebar("Operators")}}
+ +

Der class-Ausdruck ist eine Methode zur Definition einer Klasse in ECMAScript 2015. Ähnlich wie beim {{jsxref("Operators/function", "function-Ausdruck")}} kann der class-Ausdruck benannt oder unbenannt sein. Ist er benannt, so gilt der Name nur lokal im Klassenkörper. JavaScript-Klassen nutzen prototyp-basierte Vererbung.

+ +

Syntax

+ +
var MyClass = class [className] [extends] {
+  // Klassenkörper
+};
+ +

Beschreibung

+ +

Ein class-Ausdruck hat die gleiche Syntax wie die {{jsxref("Statements/class", "class-Anweisung (Deklaration)")}}. Jedoch kann mit dem class-Ausdruck der Klassenname ("binding identifier") ausgelassen werden, was mit der class-Anweisung nicht möglich ist. Zusätzlich erlaubt ein class-Ausdruck das erneute Deklarieren einer Klasse, ohne dass ein Fehler wie bei der {{jsxref("Statements/class", "class-Deklaration")}} auftritt. Die constructor-Eigenschaft ist optional. Zudem wird der typeof-Operator bei so deklarierten Klassen immer den Typ "function" zurückgeben.

+ +

Genau wie mit class-Anweisungen wird der Körper der Klasse im {{jsxref("Strict_mode", "strict mode")}} ausgeführt.

+ +
'use strict';
+var Foo = class {}; // constructor-Eigenschaft ist optional
+var Foo = class {}; // erneute Deklaration is erlaubt
+
+typeof Foo;      // gibt "function" zurück
+typeof class {}; // gibt "function" zurück
+
+Foo instanceof Object;   // true
+Foo instanceof Function; // true
+class Foo {}; // erzeugt einen TypeError, weil eine erneute Deklaration nicht erlaubt ist
+
+ +

Beispiele

+ +

Ein einfacher Klassenausdruck

+ +

Dies ist nur ein einfacher anonymer class-Ausdruck der über die "Foo"-Variable angesprochen werden kann.

+ +
var Foo = class {
+  constructor() {}
+  bar() {
+    return "Hello World!";
+  }
+};
+
+var instance = new Foo();
+instance.bar(); // "Hello World!"
+Foo.name; // ""
+
+ +

Benannte class-Ausdrücke

+ +

Wenn Sie innerhalb des Klassenkörpers auf die aktuelle Klasse verweisen möchten, können Sie einen benannten class-Ausdruck verwenden. Dieser Name ist nur im Bereich der Klasse selbst gültig und sichtbar.

+ +
var Foo = class NamedFoo {
+  constructor() {}
+  whoIsThere() {
+    return NamedFoo.name;
+  }
+}
+var bar = new Foo();
+bar.whoIsThere(); // "NamedFoo"
+NamedFoo.name; // ReferenceError: NamedFoo is not defined
+Foo.name; // "NamedFoo"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ES2015')}}erstmalige Definition
{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FunktionChromeFirefox (Gecko)Internet ExplorerOperaSafari
grundlegende Unterstützung{{CompatChrome(42.0)}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FunktionAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
grundlegende Unterstützung{{CompatNo}}{{CompatChrome(42.0)}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(42.0)}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/comma_operator/index.html b/files/de/web/javascript/reference/operators/comma_operator/index.html new file mode 100644 index 0000000000..be04c939a6 --- /dev/null +++ b/files/de/web/javascript/reference/operators/comma_operator/index.html @@ -0,0 +1,107 @@ +--- +title: Kommaoperator +slug: Web/JavaScript/Reference/Operators/Comma_Operator +tags: + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Comma_Operator +--- +
{{jsSidebar("Operators")}}
+ +

Der Kommaoperator wertet jeden Operanden (von links nach rechts) aus und gibt den Wert des letzten Operanden zurück.

+ +
{{EmbedInteractiveExample("pages/js/expressions-commaoperators.html")}}
+ + + +

Syntax

+ +
ausdruck1, ausdruck2, ausdruck3...
+ +

Parameter

+ +
+
ausdruck1, ausdruck2, ausdruck3...
+
Beliebige Ausdrücke.
+
+ +

Beschreibung

+ +

Der Kommaoperator kann eingesetzt werden, um mehrere Ausdrücke an einer Stelle zu verwenden, die nur einen Ausdruck erwartet. Der häufigste Anwendungsfall für diesen Operator ist das Bereitstellen mehrerer Parameter in einer for Schleife.

+ +

Beispiele

+ +

Gegeben ist a in einem 2-dimensionalen Array mit 10 Elementen auf jeder Seite. Der folgende Code verwendet den Kommaoperator um zwei Variablen auf einmal hochzuzählen.

+ +

Der folgende Code gibt in der Konsole die Werte der diagonalen Elemente im Array aus:

+ +
for (var i = 0, j = 9; i <= 9; i++, j--)
+  console.log('a[' + i + '][' + j + '] = ' + a[i][j]);
+ +

Zu Beachten ist, dass das Komma in Zuweisungen, wie etwa bei der var Deklaration, nicht den erwarteten Effekt des Kommaoperators zu haben scheint, da Zuweisungen nicht in einem Ausdruck existieren. Im folgenden Beispiel wird a auf den Wert von b = 3 gesetzt (welcher 3 ist), aber c = 4 wird dennoch ausgewertet und dessen Ergebnis wird in der Konsole ausgegeben (i.e., 4). Das ist auf die Operator precedence zurückzuführen.

+ +
// Zu Beachten ist, dass nachfolgend globals erstellt werden,
+// die im Strict Mode nicht zulässig sind.
+
+a = b = 3, c = 4; // Rückgabe von 4 in der Konsole
+console.log(a); // 3 (ganz links)
+
+x = (y = 5, z = 6); // Rückgabe von 6 in der Konsole
+console.log(x); // 6 (ganz rechts)
+
+ +

Der Kommaoperator ist völlig anders als das Komma in Arrays, Objekten, Funktionsargumenten und -parametern.

+ +

Verarbeitung und dann zurückgeben

+ +

Ein weiteres Beispiel für die Verwendung des Kommaoperators ist die Verarbeitung vor der Rückgabe. Wie oben beschrieben, wird das letzte Element zurückgegeben, jedoch auch alle weiteren werden verarbeitet. So könnte folgendes gemacht werden:

+ +
function myFunc() {
+  var x = 0;
+
+  return (x += 1, x); // ist das Gleiche wie return ++x;
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-comma-operator', 'Comma operator')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-comma-operator', 'Comma operator')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.14', 'Comma operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1', '#sec-11.14', 'Comma operator')}}{{Spec2('ES1')}}Initiale Definition
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.comma")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/conditional_operator/index.html b/files/de/web/javascript/reference/operators/conditional_operator/index.html new file mode 100644 index 0000000000..895a2c5d55 --- /dev/null +++ b/files/de/web/javascript/reference/operators/conditional_operator/index.html @@ -0,0 +1,190 @@ +--- +title: Bedingter (ternärer) Operator +slug: Web/JavaScript/Reference/Operators/Conditional_Operator +tags: + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator +--- +
{{jsSidebar("Operators")}}
+ +

Der bedingte (ternäre) Operator ist der einzige Operator in JavaScript, der drei Operanden hat. Er wird häufig als Kurzform eines if Statements genutzt.

+ +
{{EmbedInteractiveExample("pages/js/expressions-conditionaloperators.html")}}
+ + + +

Syntax

+ +
Bedingung ? Ausdruck1: Ausdruck2
+ +

Parameter

+ +
+
Bedingung (oder Bedingungen)
+
Ein Ausdruck, der zu true oder false ausgewertet wird.
+
+ +
+
Ausdruck1, Ausdruck2
+
Ausdrücke mit Werten eines beliebigen Typs.
+
+ +

Beschreibung

+ +

Wenn Bedingung zu true ausgewertet wird, wird Ausdruck1 zurückgegeben; andernfalls wird Ausdruck2 zurückgegeben.

+ +

Ein einfaches Beispiel zeigt dieser Test, ob man in den USA alt genug ist, um Alkohol zu trinken.

+ +
var age = 26;
+var canDrinkAlcohol = (age >= 21) ? "True, 21 or older" : "False, under 21";
+console.log(canDrinkAlcohol); // "True, 21 or older"
+
+ +

Ein anderes Beispiel ist die Anzeige von verschiedenen Nachrichten, abhängig von der isMember Variable:

+ +
"The fee is " + (isMember ? "$2.00" : "$10.00")
+
+ +

Man kann auch Variablen abhängig von einem ternären Ergebnis zuweisen:

+ +
var elvisLives = Math.PI > 4 ? "Yep" : "Nope";
+ +

Mehrere ternäre Auswertungen hintereinander sind ebenfalls möglich (Beachte: der ternäre Operator ist rechtsassoziativ):

+ +
var firstCheck = false,
+    secondCheck = false,
+    access = firstCheck ? "Access denied" : secondCheck ? "Access denied" : "Access granted";
+
+console.log(access); // logt "Access granted"
+ +

Man kann ihn auch wie ein If Statement mit mehreren Bedingungen verwenden

+ +
var condition1 = true,
+    condition2 = false,
+    access = condition1 ? (condition2 ? "true true" : "true false") : (condition2 ? "false true" : "false false");
+
+console.log(access); // logt "true false"
+ +

Zu beachten ist, dass die Klammern nicht notwendig sind und das Ergebnis nicht verändern. Sie sind zur Übersichtshilfe vorhanden.

+ +

Man kann den ternären Operator alleinstehend verwenden, um verschiedene Operationen auszuführen:

+ +
var stop = false, age = 16;
+
+age > 18 ? location.assign("continue.html") : stop = true;
+
+ +

Man kann auch mehr als eine Operation pro Fall ausführen, indem die Operationen mit einem Komma getrennt und geklammert werden:

+ +
var stop = false, age = 23;
+
+age > 18 ? (
+    alert("OK, you can go."),
+    location.assign("continue.html")
+) : (
+    stop = true,
+    alert("Sorry, you are much too young!")
+);
+
+ +

Man kann auch mehrere Operationen während einer Zuweisung durchführen. In diesem Fall wird der letzte von Kommas getrennte Wert als Zuweisungswert benutzt.

+ +
var age = 16;
+
+var url = age > 18 ? (
+    alert("OK, you can go."),
+    // alert liefert "undefined" zurück, wird aber ignoriert
+    // weil es nicht der letzte Ausdruck in der Klammer ist.
+    "continue.html" // dieser Wert wird zugewiesen, wenn der
+                    //Wert > 18 ist.
+) : (
+    alert("You are much too young!"),
+    alert("Sorry :-("),
+    // etc. etc.
+    "stop.html" // dieser Wert wird zugewiesen wenn "age" <= 18 ist;
+
+location.assign(url); // "stop.html"
+ +

Rückgabe durch ternäre Statements

+ +

Der ternäre Operator ist nützlich für Funktionen, die einen Rückgabewert abhängig von einem if/else Statement zurückgeben.

+ +
var func1 = function ( .. ) {
+  if (condition1) { return value1; }
+  else { return value2; }
+}
+
+var func2 = function ( .. ) {
+  return condition1 ? value1 : value2;
+}
+ +

Ein häufiger Weg, um das legale Alter zum Trinken von Alkohol in den USA zurückzugeben:

+ +
function canDrinkAlcohol(age) {
+  return (age > 21) ? "True, over 21" : "False, under 21";
+}
+var output = canDrinkAlcohol(26);
+console.log(output); // "True, over 21"
+ +

Ein guter Weg, um herauszufinden, ob der ternäre Operator ein guter Ersatz für ein if/else Statement ist, ist wenn das return Schlüsselwort mehrfach eingesetzt wird und in jedem Block der einzige Ausdruck ist.

+ +

Beim Aufteilen des ternären Operators in mehrere Zeilen und extra Leerzeichen, kann dieser ein sehr sauberer Ersatz für eine längere Serie von if/else Statements sein. Dadurch wird ein leichter Weg für logisch gleiche Ausdrücke geschaffen:

+ +
var func1 = function ( .. ) {
+  if (condition1) { return value1; }
+  else if (condition2) { return value2; }
+  else if (condition3) { return value3; }
+  else { return value4; }
+}
+
+var func2 = function ( .. ) {
+  return condition1 ? value1
+       : condition2 ? value2
+       : condition3 ? value3
+       :              value4;
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-conditional-operator', 'Conditional Operator')}}{{Spec2('ESDraft')}}
{{SpecName('ES6', '#sec-conditional-operator', 'Conditional Operator')}}{{Spec2('ES6')}}
{{SpecName('ES5.1', '#sec-11.12', 'The conditional operator')}}{{Spec2('ES5.1')}}
{{SpecName('ES1', '#sec-11.12', 'The conditional operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.conditional")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/dekrement/index.html b/files/de/web/javascript/reference/operators/dekrement/index.html new file mode 100644 index 0000000000..16b185b35c --- /dev/null +++ b/files/de/web/javascript/reference/operators/dekrement/index.html @@ -0,0 +1,82 @@ +--- +title: Dekrement (--) +slug: Web/JavaScript/Reference/Operators/Dekrement +tags: + - Dekrement + - Dekrement-Operator + - Dekrementieren +translation_of: Web/JavaScript/Reference/Operators/Decrement +--- +
{{jsSidebar("Operators")}}
+ +

Der Dekrement-Operator (--) dekrementiert den Operanden um eins, zieht als eins vom Operanden ab und gibt einen Wert zurück.

+ +
{{EmbedInteractiveExample("pages/js/expressions-decrement.html")}}
+ +
+ + + +

Syntax

+ +
Operator: x-- or --x
+
+ +

Description

+ +

Wenn der Dekrement-Operator als Postfix benutzt wird, also der Operator hinter dem Operanden steht (z.B. x--), wird der Operand um eins reduziert aber der Wert vor dem Dekrementieren zurückgegeben. 

+ +

Wird der Dekrement-Operator als Präfix genutzt, steht also der Operator vor dem Operanden (z. B. --x), wird der Operator um eins reduziert und der Wert nach dieser Dekrementierung zurückgegeben.

+ +

Examples

+ +

Postfix decrement

+ +
let x = 3;
+y = x--;
+
+// y = 3
+// x = 2
+
+ +

Prefix decrement

+ +
let a = 2;
+b = --a;
+
+// a = 1
+// b = 1
+
+ +

Specifications

+ + + + + + + + + + +
Specification
{{SpecName('ESDraft', '#sec-postfix-decrement-operator', 'Decrement operator')}}
+ +

Browser compatibility

+ + + +

{{Compat("javascript.operators.decrement")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/operators/delete/index.html b/files/de/web/javascript/reference/operators/delete/index.html new file mode 100644 index 0000000000..dff87c8998 --- /dev/null +++ b/files/de/web/javascript/reference/operators/delete/index.html @@ -0,0 +1,295 @@ +--- +title: delete Operator +slug: Web/JavaScript/Reference/Operators/delete +tags: + - JavaScript + - Memory Management + - Object + - Operator + - Property + - Reference + - Release + - Unary + - delete +translation_of: Web/JavaScript/Reference/Operators/delete +--- +
{{jsSidebar("Operators")}}
+ +

Der JavaScript delete-Operator entfernt eine Eigenschaft eines Objekts. Wenn keine weitere Referenz auf dieselbe Eigenschaft mehr existiert, wird diese automatisch freigegeben.

+ +
{{EmbedInteractiveExample("pages/js/expressions-deleteoperator.html")}}
+ + + +

Syntax

+ +
delete Ausdruck 
+ +

wobei Ausdruck zu eine Referenz auf eine Eigenschaft ausgewertet werden sollte, z. B.:

+ +
delete object.property
+delete object['property']
+
+ +

Parameter

+ +
+
object
+
Der Name eines Objekts oder ein Ausdruck der zu einem Objekt ausgewertet wird.
+
property
+
Die zu löschende Eigenschaft.
+
+ +

Rückgabewert

+ +

true für alle Fälle, außer wenn die Eigenschaft eine eigene nicht konfigurierbare Eigenschaft ist, in diesem Fall wird im nicht strict Modus false zurückgegeben.

+ +

Fehler

+ +

Erzeugt einen {{jsxref("Global_objects/SyntaxError")}} im strict Modus, wenn die Eigenschaft eine eigene nicht konfigurierbare Eigenschaft ist.

+ +

Beschreibung

+ +

Anders als es allgemein üblich ist, hat der delete Operator nichts mit dem Freigeben von Speichers zu tun. Speicherverwaltung wird indirekt über fehlende Referenzen gemacht, dazu mehr Details auf der Seite Speicherverwaltung.

+ +

Der delete Operator entfernt eigene gegebene Eigenschaft von einem Objekt. Ist dieses Erfolgreich, wird true zurückgegeben, andernfalls false. Jedoch ist es wichtig die folgenden Szenarien zu bedenken:

+ + + +

Der folgende Ausschnitt enthält ein einfaches Beispiel:

+ +
var Employee = {
+  age: 28,
+  name: 'abc',
+  designation: 'developer'
+}
+
+console.log(delete Employee.name);  // gibt true zurück
+console.log(delete Employee.age);   // gibt true zurück
+
+// Wenn versucht wird eine Eigenschaft zu löschen,
+// die nicht existiert, wird true zurückgegeben
+console.log(delete Employee.salery) // gibt true zurück
+ +

Nicht konfigurierbare Eigenschaften

+ +

Wenn eine Eigenschaft als nicht konfigurierbar markiert ist, hat delete keinen Effekt und wird false zurückgeben. Im strict Modus wird es zu einem SyntaxError kommen.

+ +
var Employee = {};
+Object.defineProperty(Employee, 'name', {configurable: false});
+
+console.log(delete Employee.name);  // gibt false zurück
+ +

{{jsxref("Statements/var","var")}}, {{jsxref("Statements/let","let")}} und {{jsxref("Statements/const","const")}} erstellen nicht konfigurierbare Eigenschaften, die nicht mit dem delete Operator gelöscht werden können.

+ +
var nameOther = 'XYZ';
+
+// Man kann die globale Eigenschaft mit folgenden erreichen:
+Object.getOwnPropertyDescriptor(window, 'nameOther');
+
+// output: Object {value: "XYZ",
+//                  writable: true,
+//                  enumerable: true,
+//                  configurable: false}
+
+// Wenn "nameOther" mit dem Schlüsselwort var hinzugefügt
+// wird, ist sie als nicht konfigurierbar markiert
+
+delete nameOther;   // gibt false zurück
+
+ +

Im strict Modus wird diese zu einem Fehler führen.

+ +

Strict vs. nicht strict Modus

+ +

Wenn im strict Mode delete direkt auf einer Referenz einer Variablen, eines Funktionsargumentes oder eines Funktionsnamens genutzt wird, wird ein {{jsxref("SyntaxError")}} erzeugt.

+ +

Jede Variable, die mit var definiert wird, wird als nicht konfigurierbar markiert. Im folgenden Beispiel ist salary nicht konfigurierbar und kann nicht gelöscht werden. Im nicht strict Modus wird der delete Operator false zurückgeben.

+ +
function Employee() {
+  delete salary;
+  var salary;
+}
+
+Employee();
+ +

Mal sehen, wie sich der selbe Code im strict Modus verhält. Statt dem Zurückgeben von false, wird das Statement zu einem SyntaxError führen.

+ +
"use strict";
+
+function Employee() {
+  delete salary;  // SyntaxError
+  var salary;
+}
+
+Employee();
+
+// Genauso führt jeder direkte Zugriff auf
+// eine Funktion mit delete zu einem SyntaxError
+
+funciton DemoFunction() {
+  // etwas Code
+}
+
+delete DemoFunction; // SyntaxError
+ +

Beispiele

+ +
// Die Eigenschaft adminName im globalen Gültigkeitsbereich erstellen
+adminName = 'xyz';
+
+// Die Eigenschaft empCount im globalen Gültigkeitsbereich erstellen
+// Weil var genutzt wurde, ist diese als nicht konfigurierbar markiert. Das selbe gibt auch für let und const.
+var empCount = 43;
+
+EmployeeDetails = {
+  name: 'xyz',
+  age: 5,
+  designation: 'Developer'
+};
+
+// adminName ist eine Eigenschaft im globalen Gültigkeitsbereich.
+// Sie kann gelöscht werden, weil sie nicht mit var erstellt wurde.
+// Demnach ist sie konfigurierbar.
+delete adminName     // gibt true zurück
+
+// Im Gegensatz dazu ist empCount nicht konfigurierbar,
+// weil var eingesetzt wurde
+delete empCount;     // gibt false zurück
+
+// delete kann für das Löschen von Eigenschaften von Objekte eingesetzt werden.
+delete EmployeeDetails.name // gibt true zurück
+
+// Auch wenn die Eigenschaft nicht existiert, wird "true" zurückgegeben.
+delete EmployeeDetails.salary; // gibt true zurück
+
+// delete hat keinen Effekt auf statische Eigenschaften von Standardobjekten.
+delete Math.PI; // gibt false zurück
+
+// EmployeeDetails ist eine Eigenschaft im globalen Gültigkeitsbereich.
+// Weil es ohne "var" definiert wurde, ist es als Konfigurierbar markiert.
+delete EmployeeDetails;  // gibt true zurück
+
+function f() {
+  var z = 44;
+
+  // delete hat keinen Effekt auf lokale Variablen
+  delete z;     // returns false
+}
+
+ +

delete und die Prototypenkette

+ +

Im folgenden Beispiel löschen wir eine eigene Eigenschaft eines Objektes, während ein Eigenschaft mit dem selben Namen in der Prototypenkette vorhanden ist:

+ +
function Foo(){
+  this.bar = 10;
+}
+
+Foo.prototype.bar = 42;
+
+var foo = new Foo();
+
+// gibt true zurück, weil die eigene Eigenschaft
+// vom foo Objekt gelöscht wird.
+delete foo.bar;
+
+// foo.bar ist weiter verfügbar, weil es
+// in der Prototypenkette verfügbar ist.
+console.log(foo.bar);
+
+// Löschen der Eigenschaft auf dem Prototypen
+delete Foo.prototype.bar;
+
+// gibt "undefined" aus, weil die Eigenschaft
+// nicht länger vererbt wird.
+console.log(foo.bar);           
+ +

Arrayelemente löschen

+ +

Wenn ein Arrayelement gelöscht wird, hat das keinen Effekt auf die Arraylänge. Das funktioniert nur, wenn man das letzte Arrayelement lösche.

+ +

Wenn der delete Operator ein Arrayelement löscht, ist das Element nicht mehr länger im Array. Im folgenden Beispiel wird trees[3] mit delete gelöscht.

+ +
var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
+delete trees[3];
+if (3 in trees) {
+    // das wird nicht ausgeführt
+}
+ +

Wenn ein Arrayelement existent sein soll, aber den Wert undefined haben soll, benutzt man undefined statt dem delete Operator. Im folgenden Beispiel bekommt trees[3] den Wert undefined zugewiesen, aber das Arrayelement existiert noch:

+ +
var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
+trees[3] = undefined;
+if (3 in trees) {
+    // das wird ausgeführt
+}
+ +

Wenn stattdessen ein Arrayelement gelöscht werden soll, wobei auch der Inhalt des Arrays geändert werden soll, so benutzt man die {{jsxref("Array.splice", "splice")}} Methode. Das folgende Beispiel entfernt trees[3] komplett vom Array mit dem Einsatz von {{jsxref("Array.splice", "splice")}}:

+ +
var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
+trees.splice(3, 1);
+console.log(trees); // ["redwood", "bay", "cedar", "maple"];
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-delete-operator', 'The delete Operator')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-delete-operator', 'The delete Operator')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.4.1', 'The delete Operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1', '#sec-11.4.1', 'The delete Operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.2.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.delete")}}

+ +

Browserübergeifende Hinweise

+ +

Obwohl ECMAScript die Iterationsreihenfolge von Objekten, die von der Implementierung abhängig ist, vornimmt, scheint es, dass alle gängigen Browser eine Iterationsreihenfolge basierend auf der frühesten hinzugefügten Eigenschaft unterstützen (zumindest für Eigenschaften, die nicht auf dem Prototyp basieren). Wenn jedoch bei Internet Explorer delete für eine Eigenschaft verwendet wird, führt dies zu verwirrendem Verhalten und verhindert, dass andere Browser einfache Objekte wie Objektliterale als geordnete assoziative Arrays verwenden. Wenn im Explorer der Wert der Eigenschaft tatsächlich auf undefiniert festgelegt ist, wird die Eigenschaft, wenn sie später eine Eigenschaft mit demselben Namen zurückgibt, an der alten Position iteriert - nicht am Ende der Iterationssequenz, wie beim löschte und wieder einfügen der Eigenschaft erwartet.

+ +

Wenn man also ein geordnetes assoziatives Array in einer browserübergreifenden Umgebung simulieren möchten, muss man entweder zwei separate Arrays verwenden (eines für die Schlüssel und das andere für die Werte) oder ein Array von Objekten mit einer einzigen Eigenschaft erstellen. etc.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/destrukturierende_zuweisung/index.html b/files/de/web/javascript/reference/operators/destrukturierende_zuweisung/index.html new file mode 100644 index 0000000000..1ece290e90 --- /dev/null +++ b/files/de/web/javascript/reference/operators/destrukturierende_zuweisung/index.html @@ -0,0 +1,404 @@ +--- +title: Destrukturierende Zuweisung +slug: Web/JavaScript/Reference/Operators/Destrukturierende_Zuweisung +tags: + - Destructuring + - ECMAScript 2015 + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Destructuring_assignment +--- +
{{jsSidebar("Operators")}}
+ +

Die destrukturierende Zuweisung ermöglicht es, Daten aus Arrays oder Objekten zu extrahieren, und zwar mit Hilfe einer Syntax, die der Konstruktion von Array- und Objekt-Literalen nachempfunden ist.

+ +
{{EmbedInteractiveExample("pages/js/expressions-destructuringassignment.html")}}
+ + + +

Syntax

+ +
var a, b, rest;
+[a, b] = [10, 20];
+console.log(a); // 10
+console.log(b); // 20
+
+[a, b, ...rest] = [10, 20, 30, 40, 50];
+console.log(a); // 10
+console.log(b): // 20
+console.log(rest); // [30, 40, 50]
+
+({ a, b } = { a: 10, b: 20 });
+console.log(a); // 10
+console.log(b); // 20
+
+
+// Stage 3 Vorschlag
+({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40 });
+console.log(a); // 10
+console.log(b); // 20
+console.log(rest); // {c: 30, d: 40}
+
+ +

Beschreibung

+ +

Die Objekt- und Array-Literal Ausdrücke stellen einen einfachen Weg für die Erstellung von ad hoc Datenpaketen zur Verfügung.

+ +
var x = [1, 2, 3, 4, 5];
+ +

Die destrukturierende Zuweisung nutzt eine ähnliche Syntax, aber auf der linken Seite der Zuweisung, um zu definieren, welche Werte von der Quellvariablen ausgepackt werden muss.

+ +
var x = [1, 2, 3, 4, 5];
+var [y, z] = x;
+console.log(y); // 1
+console.log(z); // 2
+
+ +

Diese Fähigkeit ist so ähnlich wie in den Sprachen Perl und Python.

+ +

Array-Destrukturierung

+ +

Einfaches Variablenzuweisung

+ +
var foo = ['one', 'two', 'three'];
+
+var [one, two, three] = foo;
+console.log(one); // "one"
+console.log(two); // "two"
+console.log(three); // "three"
+
+ +

Zuweisung separat von Deklaration

+ +

Eine destrukturierende Zuweisung kann ohne Deklaration im Zuweisungsstatement vorgenommen werden.

+ +
var a, b;
+
+[a, b] = [1, 2];
+console.log(a); // 1
+console.log(b); // 2
+ +

Standardwerte

+ +

Einer Variablen kann ein Standardwert zugewiesen werden, welcher greift, wenn der Wert im Fall vom auspacken des Arrays undefined ist.

+ +
var a, b;
+
+[a=5, b=7] = [1];
+console.log(a); // 1
+console.log(b); // 7
+ +

Variablen tauschen

+ +

Zwei Variablenwerte können mit destrukturierenden Zuweisungen vertauscht werden.

+ +

Ohne destrukturierende Zuweisung benötigt man für den Tausch zweier Werte eine temporäre Variable (oder, in manchen Low-level Sprachen, den XOR-swap Trick).

+ +
var a = 1;
+var b = 3;
+
+[a, b] = [b, a];
+console.log(a); // 3
+console.log(b); // 1
+ +

Array von Funktion zurückgeben und einlesen

+ +

Es ist immer möglich einen Array von einer Funktion zurückzugeben. Destrukturierung kann mit dem Arrayrückgabewert verwendet werden um mehrerer Werte auszuwählen.

+ +

In diesem Beispiel gibt f() den Wert [1, 2] zurück, welcher in einer Zeile mittels Destrukturierung eingelesen werden kann.

+ +
function f() {
+  return [1, 2];
+}
+
+var a, b;
+[a, b] = f();
+console.log(a); // 1
+console.log(b); // 2
+
+ +

Rückgabewerte teilweise ignorieren

+ +

Man kann auch Rückgabewerte, an denen man nicht interessiert ist, ignorieren:

+ +
function f() {
+  return [1, 2, 3];
+}
+
+var [a, , b] = f();
+console.log("A ist " + a + " B ist " + b);
+
+ +

Nach Ausführung dieses Codes ist a =1 und b = 3. Der Wert 2 wird ignoriert. Auf diese Art kann man jegliche (auch alle) zurückgegebene Werte ignorieren. Zum Beispiel:

+ +
[,,] = f();
+ +

Den Rest eines Arrays einer Variablen zuweisen

+ +

Wenn ein Array destrukturiert wird, kann man beim Auspacken den restlichen Teil eines Arrays einer Varaible mit dem Restpattern zuweisen:

+ +
var [a, ...b] = [1, 2, 3];
+console.log(a); // 1
+console.log(b); // [2, 3]
+ +

Zu beachten ist, dass ein {{jsxref("SyntaxError")}} erzeugt wird, wenn auf der linken Seite des Restelements ein trennendes Komma steht:

+ +
var [a, ...b,] = [1, 2, 3];
+// SyntaxError: rest element may not have a trailing comma
+ +

Auspacken von Treffern eines regulären Ausdrucks

+ +

Wenn die Methode exec() für reguläre Ausdrücke einen Treffer findet, gibt sie ein Array zurück, das erstens, den gesamten, passenden Teil des Strings und dann die Teile des Strings enthält, die den einzelnen geklammerten Gruppen im regulären Ausdruck entsprechen. Destrukturierende erlaubt es die Teile aus diesem Array auf einfache Art herauszuziehen, wobei der String mit dem kompletten Treffer ignoriert werden kann, falls er nicht benötigt wird.

+ +
function parseProtocol(url) {
+  var parsedURL = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url);
+  if(!parsedURL) {
+    return false;
+  }
+  console.log(parsedURL); // ["https://developer.mozilla.org/en-US/Web/JavaScript", "https", "developer.mozilla.org", "en-US/Web/JavaScript"]
+
+  var [, protocol, fullhost, fullpath] = parsedURL;
+  return protocol;
+}
+
+console.log(parseProtocol('https://developer.mozilla.org/en-US/Web/JavaScript')); // "https"
+
+ +

Objektdestrukturierung

+ +

Einfache Zuweisung

+ +
var o = {p: 42, q: true};
+var {p, q} = o;
+
+console.log(p); // 42
+console.log(q); // true
+
+ +

Zuweisung ohne Deklaration

+ +

Die destrukturierende Zuweisung kann ohne eine Deklaration im Zuweisungs-Statement durchgeführt werden.

+ +
var a, b;
+
+({a, b} = {a: 1, b: 2});
+ +
+

Die runden Klammern ( ... ) wird benötigt wenn man die destrukturierende Zuweisung mit Objektliteralen ohne eine Deklaration durchführen möchte.

+ +

{a, b} = {a: 1, b: 2} ist keine valide eigenständige Syntax, weil {a, b} auf der linken Seite als ein Block und nicht als Objektliteral erkannt wird.

+ +

({a, b} = {a: 1, b: 2}) ist genauso gültig wie var {a, b} = {a: 1, b: 2}

+ +

HINWEIS: Der ( ... ) Ausdruck muss durch ein vorangestelltes Semikolen benutzt werden oder es führt eine Funktion aus der vorherigen Zeile aus.

+
+ +

Zu neuen Varaiblennamen zuweisen

+ +

Eine Eigenschaft kann aus einem Objekt ausgepackt werden und zu einer Variablen mit einem anderen Namen zugewiesen werden.

+ +
var o = {p: 42, q: true};
+var {p: foo, q: bar} = o;
+
+console.log(foo); // 42
+console.log(bar); // true
+ +

Standardwerte

+ +

Einer Variablen können Standardwerte zugewiesen werden, wenn der ausgepackte Wert aus dem Objekt undefined ist.

+ +
var {a = 10, b = 5} = {a: 3};
+
+console.log(a); // 3
+console.log(b); // 5
+ +

Zuweisen eines neuen Variablennamen und eines Standardwertes

+ +

Eine Eigenschaft kann sowohl 1) aus einem Objekt ausgepackt werden und einer Variablen mit einem andern Namen zugewiesen werden und 2) einen Standardwert unterstützen, wenn der ausgepackte Wert undefined ist.

+ +
var {a:aa = 10, b:bb = 5} = {a: 3};
+
+console.log(aa); // 3
+console.log(bb); // 5
+ +

Standardwerte für Funktionsparamter setzen

+ +

ES5 Version

+ +
function drawES5Chart(options) {
+  options = options === undefined ? {} : options;
+  var size = options.size === undefined ? 'big' : options.size;
+  var cords = options.cords === undefined ? { x: 0, y: 0 } : options.cords;
+  var radius = options.radius === undefined ? 25 : options.radius;
+  console.log(size, cords, radius);
+  // jetzt zeichnen wir endlich ein paar Charts
+}
+
+drawES5Chart({
+  cords: { x: 18, y: 30 },
+  radius: 30
+});
+ +

ES2015-Version

+ +
function drawES2015Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {})
+{
+  console.log(size, cords, radius);
+  // zeichne ein paar Graphen
+}
+
+drawES2015Chart({
+  cords: { x: 18, y: 30 },
+  radius: 30
+});
+ +
+

In der Funktionssignatur für drawES2015Chart oben ist der destrukturierten linken Seite ein leeres Objektliteral zugewiesen, auf der rechten Seite: {size = 'big', cords = {x: 0, y: 0}, radius = 25} = {}. Man kann die Funktion auch ohne die rechte Zuweisungsseite schreiben. Wenn jedoch die Zuweisung auf der rechten Seite weglassen wird, sucht die Funktion nach mindestens einem Argument, das beim Aufruf bereitgestellt wird, während man in der aktuellen Form einfach drawES2015Chart() aufrufen kann, ohne Parameter anzugeben. Das aktuelle Design ist nützlich, wenn man die Funktion, ohne Parameter anzugeben, aufrufen möchte. Das andere ist nützlich, um sicherzustellen , dass ein Objekt an die Funktion übergeben wird.

+
+ +

Destrukturierung von verschachtelten Objekten und Arrays

+ +
var metadata = {
+    title: "Scratchpad",
+    translations: [
+      {
+        locale: "de",
+        localization_tags: [ ],
+        last_edit: "2014-04-14T08:43:37",
+        url: "/de/docs/Tools/Scratchpad",
+        title: "JavaScript-Umgebung"
+      }
+    ],
+    url: "/en-US/docs/Tools/Scratchpad"
+};
+
+var { title: englishTitle, translations: [{ title: localeTitle }] } = metadata;
+
+console.log(englishTitle); // "Scratchpad"
+console.log(localeTitle);  // "JavaScript-Umgebung"
+ +

"for of" Iteration und Destrukturierung

+ +
var people = [
+  {
+    name: "Mike Smith",
+    family: {
+      mother: "Jane Smith",
+      father: "Harry Smith",
+      sister: "Samantha Smith"
+    },
+    age: 35
+  },
+  {
+    name: "Tom Jones",
+    family: {
+      mother: "Norah Jones",
+      father: "Richard Jones",
+      brother: "Howard Jones"
+    },
+    age: 25
+  }
+];
+
+for (var {name: n, family: { father: f } } of people) {
+  console.log("Name: " + n + ", Father: " + f);
+}
+
+// "Name: Mike Smith, Father: Harry Smith"
+// "Name: Tom Jones, Father: Richard Jones"
+ +

Auspacken von Objektfeldern, die als Funktionsparameter übergeben werden

+ +
function userId({id}) {
+  return id;
+}
+
+function whois({displayName: displayName, fullName: {firstName: name}}){
+  console.log(displayName + " is " + name);
+}
+
+var user = {
+  id: 42,
+  displayName: "jdoe",
+  fullName: {
+      firstName: "John",
+      lastName: "Doe"
+  }
+};
+
+console.log("userId: " + userId(user)); // "userId: 42"
+whois(user); // "jdoe is John"
+ +

Dies ermittelt id, displayName und firstName vom user Objekt und gibt sie aus.

+ +

Berechnete Objekteigenschaftsnamen und Destrukturierung

+ +

Berechnete Eigenschaftsnamen, wie bei Objektliteralen, können bei der Destruktierung verwendet werden.

+ +
let key = "z";
+let { [key]: foo } = { z: "bar" };
+
+console.log(foo); // "bar"
+
+ +

Rest in Objektdestrukturierung

+ +

Die Rest/Spread Eigenschaften für den ECMAScript Vorschlag (Stage 3) fügt die Rest-Syntax zur Destrukturierung hinzu. Rest Eigenschaften sammeln die restlichen, eigenen, aufzählbaren Eigenschaftsschlüssel, die noch nicht von der Destrukturierung erfasst wurden, auf.

+ +
var {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};
+a; // 10
+b; // 20
+rest; // { c: 30, d: 40 }
+ +

Ungültige JavaScript Bezeichner als Eigenschaftsnamen

+ +

Destrukturierung kann mit Eigenschaftsnamen benutzt werden, die keine gültigen JavaScript Bezeichner sind, indem ein alternativer valider Beizeichner angegeben wird.

+ +
const foo = { 'fizz-buzz': true }
+const { 'fizz-buzz': fizzBuzz } = foo
+
+console.log(fizzBuzz); // "true"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-destructuring-assignment', 'Destructuring assignment')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-destructuring-assignment', 'Destructuring assignment')}}{{Spec2('ESDraft')}} 
Rest/Spread Properties for ECMAScriptDraftStage 3 Entwurf.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.operators.destructuring")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/expression_closures/index.html b/files/de/web/javascript/reference/operators/expression_closures/index.html new file mode 100644 index 0000000000..16bda73cd4 --- /dev/null +++ b/files/de/web/javascript/reference/operators/expression_closures/index.html @@ -0,0 +1,76 @@ +--- +title: Ausdrucks Closures +slug: Web/JavaScript/Reference/Operators/Expression_closures +tags: + - Functions + - JavaScript + - Reference +translation_of: Archive/Web/JavaScript/Expression_closures +--- +
Nicht Standardisiert. Nicht benutzen!
+Die Ausdrucks Closure-Syntax ist eine veraltete Firefox spezifische Funktion und wurde mit Firefox 60 entfernt. In Zukunft sollten Pfeilfunktionen genutzt werden.
+ +
{{jsSidebar("Operators")}}
+ +

Ausdrucks Closures sind eine kurze Funktionssyntax für das Schreiben einfacher Funktionen.

+ +

Syntax

+ +
function [name]([param1[, param2[, ..., paramN]]])
+   expression
+
+ +

Parameter

+ +
+
name
+
Der Funktionsname. Kann bei anonymen Funktionen weggelassen werden. Der Name ist nur lokal im Funktionskörper verfügbar.
+
paramN
+
Der Name eines Arguments, welcher der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
expression
+
Der Ausdruck, welcher den Funktionskörper einer Funktion bildet.
+
+ +

Beschreibung

+ +

Diese Funktion ist nicht mehr als eine eine Kurzschreibweise für einfache Funktionen, die der Sprache einer typischen Lambda Notation ähnelt.

+ +

JavaScript 1.7 und älter:

+ +
function(x) { return x * x; }
+ +

JavaScript 1.8:

+ +
function(x) x * x
+ +

Die Syntax erlaubt es die Klammern und das 'return' Statement wegzulassen - sie sind implizit. Es gibt keine weiteren Vorteile, wenn man den Code so schreibt, außer dass es kürzer ist.

+ +

Beispiele

+ +

Eine Kurzschreibweise für Eventlistener:

+ +
 document.addEventListener('click', function() false, true);
+
+ +

Einsatz dieser Notation mit der Array Funktion some aus JavaScript 1.6:

+ +
elems.some(function(elem) elem.type == 'text');
+
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.expression_closures")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/function/index.html b/files/de/web/javascript/reference/operators/function/index.html new file mode 100644 index 0000000000..e6734ae8f8 --- /dev/null +++ b/files/de/web/javascript/reference/operators/function/index.html @@ -0,0 +1,151 @@ +--- +title: Funktionsausdruck +slug: Web/JavaScript/Reference/Operators/function +tags: + - Funktion + - JavaScript + - Operator + - Primary Expressions +translation_of: Web/JavaScript/Reference/Operators/function +--- +
{{jsSidebar("Operators")}}
+ +

Das Schlüsselwort function kann benutzt werden, um eine Funktion innerhalb eines Ausdrucks zu definieren.

+ +

Man kann Funktionen auch mit Hilfe des Function-Konstruktors oder als Funktionsdeklarationen definieren.

+ +
{{EmbedInteractiveExample("pages/js/expressions-functionexpression.html")}}
+ + + +

Syntax

+ +
var meineFunktion = function [name]([param1[, param2[, ..., paramN]]]) {
+   statements
+};
+ +

Seit ES2015 können außerdem Pfeilfunktionen benutzt werden.

+ +

Parameter

+ +
+
name
+
Der Funktionsname. Kann weggelassen werden, wenn es sich um eine anonyme Funktion handelt. Der Name ist nur im Funktionskörper referenzierbar.
+
paramN
+
Der Name eines Argumentes, welches der Funktion übergeben wird.
+
statements
+
Die Befehle, aus denen der Funktionskörper besteht.
+
+ +

Beschreibung

+ +

Ein Funktionsausdruck ist einem Funktionsstatement sehr ähnlich und hat fast die gleiche Syntax (siehe Funktionsstatement). Der größte Unterschied zwischen einem Funktionsausdruck und einem Funktionsstatement ist der Funktionsname, der in der Funktionsausdruck weggelassen werden kann, um eine anonyme Funktion zu erstellen. Ein Funktionsausdruck kann als IIFE (Immediately Invoked Function Expression) genutzt werden, die sofort nach Definition ausgeführt wird. Im Kapitel Funktionen finden sich weitere Informationen.

+ +

Hoisting von Funktionsausdrücken

+ +

Funktionsausdrücke in Javascript werden nicht automatisch an den Beginn des Scopes gehoben (hoisted), anders als {{jsxref("Statements/function", "Funktionsdeklarationen", "#Hochziehen_der_Funktionsdeklaration")}}. Funktionsausdrücke können nicht vor Definition im Code aufgerufen werden.

+ +
notHoisted(); // TypeError: notHoisted is not a function
+
+var notHoisted = function() {
+   console.log('bar');
+};
+
+ +

Benannte Funktionsausdrücke

+ +

Wenn man die aktuelle Funktion innerhalb des Funktionskörpers referenzieren will, muss ein Benannter Funktionsausdruck erstellt werden. Dieser Name ist nur im Funktionskörper referenzierbar. Das verhindert den Gebrauch der nicht standardisierten arguments.callee Eigenschaft.

+ +
var math = {
+  'fakultaet': function fakultaet(n) {
+    if (n <= 1)
+      return 1;
+    return n * fakultaet(n - 1);
+  }
+};
+
+math.fakultaet(3) //3;2;1;
+
+ +

Die Variable, der ein Funktionsausdruck zugewiesen wurde, hat eine name Eigenschaft. Wenn der Name der Funktion ausgelassen wird, wird dies der Variablenname sein (implizierter Name). Ist die Funktion benannt, wird in der Eigenschaft der Funktionsname zu finden sein (expliziter Name). Dies trifft auch auf Pfeilfunktionen zu (diese haben keinen Namen so dass der Variablenname nur implizit gesetzt werden kann)

+ +
var foo = function() {}
+foo.name // "foo"
+
+var foo2 = foo
+foo2.name // "foo"
+
+var bar = function baz() {}
+bar.name // "baz"
+
+console.log(foo === foo2); // true
+console.log(typeof baz);   // undefined
+console.log(bar === baz);  // false (Fehler, weil baz == undefined)
+
+ +

Beispiele

+ +

Das folgende Beispiel definiert eine unbenannte Funktion und weist sie x zu. Die Funktion gibt das Quadrat ihres Argumentes zurück.

+ +
var x = function(y) {
+   return y * y;
+};
+
+ +

Meistens werden Funktionsausdrücke in Callbacks genutzt:

+ +
button.addEventListener('click', function(event) {
+    console.log('button wurde geklickt!')
+})
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-function-definitions', 'Function definitions')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-function-definitions', 'Function definitions')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-13', 'Function definition')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-13', 'Function definition')}}{{Spec2('ES3')}}Initiale Fefinition. Implementiert in JavaScript 1.5.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.function")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/function_star_/index.html b/files/de/web/javascript/reference/operators/function_star_/index.html new file mode 100644 index 0000000000..578d88ccc6 --- /dev/null +++ b/files/de/web/javascript/reference/operators/function_star_/index.html @@ -0,0 +1,91 @@ +--- +title: function* Ausdruck +slug: Web/JavaScript/Reference/Operators/function* +tags: + - ECMAScript 2015 + - Function + - Iterator + - JavaScript + - Operator + - Primary Expression +translation_of: Web/JavaScript/Reference/Operators/function* +--- +
{{jsSidebar("Operators")}}
+ +

Das function* Schlüsselwort kann benutzt werden, um Generatorfunktionen in einem Ausdruck zu definieren.

+ +
{{EmbedInteractiveExample("pages/js/expressions-functionasteriskexpression.html")}}
+ + + +

Syntax

+ +
function* [name]([param1[, param2[, ..., paramN]]]) {
+   statements
+}
+ +

Parameter

+ +
+
name
+
Der Funktionsname. Kann weggelassen werden, wenn es ein anonymen Funktion ist. Der Name ist nur im Funktionskörper referenzierbar.
+
paramN
+
Der Name eines Argumentes, welches der Funktion übergeben wird. Eine Funktion kann bis zu 255 Argumente haben.
+
statements
+
Die Statements, die den Rumpf der Funktion darstellen.
+
+ +

Beschreibung

+ +

Ein function* Ausdruck sehr ähnlich zu {{jsxref('Statements/function*', 'function* Statements')}} und hat die selbe Syntax. Der Hauptunterschied zwischen einem function* Ausdruck und function* Statement ist der Funktionsname, welcher in einem function* Ausdruck weggelassen werden kann, um eine anonyme Funktion zu erstellen. Mehr Informationen sind im Kapitel Funktionen enthalten.

+ +

Beispiele

+ +

Das folgende Beispiel definiert eine namenlose Generatorfunktion und weist diese x zu. Die Funktion liefert das Quadrat ihres Argumentes:

+ +
var x = function*(y) {
+   yield y * y;
+};
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES2015', '#', 'function*')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#', 'function*')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.function_star")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/generator_comprehensions/index.html b/files/de/web/javascript/reference/operators/generator_comprehensions/index.html new file mode 100644 index 0000000000..843865b399 --- /dev/null +++ b/files/de/web/javascript/reference/operators/generator_comprehensions/index.html @@ -0,0 +1,172 @@ +--- +title: Generator Comprehensions +slug: Web/JavaScript/Reference/Operators/Generator_comprehensions +tags: + - Iterator + - JavaScript + - Non-standard + - Reference +translation_of: Archive/Web/JavaScript/Generator_comprehensions +--- +
Non standardisiert. Nicht einsetzen!
+Die Generator Comprehensions Syntax ist nicht standardisiert und wurde mit Firefox 58 entfernt. Zukünftig sollte stattdessen {{jsxref("Statements/function*", "Generatoren", "", 1)}} eingesetzt werden.
+ +
{{jsSidebar("Operators")}}
+ +

Die Generator Comprehensions Syntax war ein JavaScript Ausdruck welcher es erlaubt schnell einen neuen Generator auf Basis eines existierenden Iterable Objektes zu erstellen. Jedoch wurde diese aus dem Standard und der Firefox Implementierung entfernt. Sie soll nicht mehr eingesetzt werden!

+ +

Syntax

+ +
(for (x of iterable) x)
+(for (x of iterable) if (condition) x)
+(for (x of iterable) for (y of iterable) x + y)
+
+ +

Beschreibung

+ +

In der Generator Comprehension gibt es zwei erlaubte Arten von Komponenten:

+ + + +

Die for-of Iteration ist immer die erste Komponente. Mehrere for-of Iterationen oder if Statements sind erlaubt.

+ +

Ein signifikanter Nachteil von {{jsxref("Operators/Array_comprehensions","Array Comprehensions","","true")}} ist, dass diese ein völlig neues Array im Speicher erstellt wird. Wenn der Input für die Comprehension selbst ein kleines Array ist, ist der entstehende Overhead nicht signifikant — aber wenn der Input ein langes Array ist oder ein teurer (oder tatsächlich unendlicher) Generator ist, kann die Erstellung eines neuen Arrays problematisch werden.

+ +

Generatoren erlauben das nachträgliche Berechnen von Sequenzen, mit Elementen, die dann Berechnet werden, wenn sie benötigt werden. Generator Comprehensions sind syntaktisch fast identisch zu Array Comprehensions — sie benutzen runde Klammern statt eckigen Klammern — jedoch erstellen sie Generator statt eines Arrays, welcher dann ausgeführt werden kann, wenn es benötigt wird. Man kann diese Funktion als Kurzsyntax für das Erstellen von Generatoren sehen.

+ +

Angenommen man hat ein Iterator it welcher über eine große Sequenz von Integers iteriert. Wir wollen einen neuen Iterator erstellen, der über das Doppelte des Integers iteriert. Eine Array Comprehension würde ein volles Array im Speicher erstellen, welches die doppelten Werte enthält:

+ +
var doubles = [for (i in it) i * 2];
+
+ +

Auf der anderen Seite würde eine Generator Comprehension einen neuen Iterator erstellen, welcher die verdoppelten Werte erste dann erstellt, wenn sie benötigt werden:

+ +
var it2 = (for (i in it) i * 2);
+console.log(it2.next()); // The first value from it, doubled
+console.log(it2.next()); // The second value from it, doubled
+
+ +

Wenn eine Generator Comprehension als Argument einer Funktion eingesetzt wird, können durch die Funktionsaufrufsklammern die äußeren Klammern weggelassen werden:

+ +
var result = doSomething(for (i in it) i * 2);
+
+ +

Der signifikante Unterschied zwischen den beiden Beispiel ist beim Einsatz der Generator Comprehension, dass man nur einmal über die ganze Datenstruktur iterieren muss, während bei der Array Comprehension zweimal iteriert werden muss, beim Erstellen und beim eigentlichen Iterieren.

+ +

Beispiele

+ +

Einfache Generator Comprehensions

+ +
(for (i of [1, 2, 3]) i * i );
+// generator function which yields 1, 4, and 9
+
+[...(for (i of [1, 2, 3]) i * i )];
+// [1, 4, 9]
+
+var abc = ['A', 'B', 'C'];
+(for (letters of abc) letters.toLowerCase());
+// generator function which yields "a", "b", and "c"
+
+ +

Generator Comprehensions mit if Statement

+ +
var years = [1954, 1974, 1990, 2006, 2010, 2014];
+
+(for (year of years) if (year > 2000) year);
+// generator function which yields 2006, 2010, and 2014
+
+(for (year of years) if (year > 2000) if (year < 2010) year);
+// generator function which yields 2006, the same as below:
+
+(for (year of years) if (year > 2000 && year < 2010) year);
+// generator function which yields 2006
+
+ +

Generator Comprehensions verglichen mit Generatorfunktionen

+ +

Ein einfacher Weg um Generator Comprehension Syntax zu verstehen ist es sie mit Generatorfunktionen zu vergleichen.

+ +

Beispiel 1: Einfacher Generator:

+ +
var numbers = [1, 2, 3];
+
+// Generator function
+(function*() {
+  for (let i of numbers) {
+    yield i * i;
+  }
+})();
+
+// Generator comprehension
+(for (i of numbers) i * i );
+
+// Result: both return a generator which yields [1, 4, 9]
+
+ +

Beispiel 2: Einsatz von if in Generatoren.

+ +
var numbers = [1, 2, 3];
+
+// Generator function
+(function*() {
+  for (let i of numbers) {
+    if (i < 3) {
+      yield i * 1;
+    }
+  }
+})();
+
+// Generator comprehension
+(for (i of numbers) if (i < 3) i);
+
+// Result: both return a generator which yields [1, 2]
+ +

Spezifikationen

+ +

Generator Comprehensions waren initial in dem ECMAScript 2015 Entwurf, jedoch wurden sie in der Überarbeitung 27 (August 2014) entfernt. Für Spezifikationssemantik muss in früheren Überarbeitungen von ES2015 nachgeschaut werden.

+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.generator_comprehensions")}}

+ +

Unterschiede zu den älteren JS1.7/JS1.8 Comprehensions

+ +
JS1.7/JS1.8 Comprehensions wurden von Gecko 46 entfernt ({{bug(1220564)}}).
+ +

Alte Comprehensions Syntax (nicht mehr benutzen!):

+ +
(X for (Y in Z))
+(X for each (Y in Z))
+(X for (Y of Z))
+
+ +

Unterschiede:

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/grouping/index.html b/files/de/web/javascript/reference/operators/grouping/index.html new file mode 100644 index 0000000000..f4056fc12c --- /dev/null +++ b/files/de/web/javascript/reference/operators/grouping/index.html @@ -0,0 +1,91 @@ +--- +title: Gruppierungsoperator +slug: Web/JavaScript/Reference/Operators/Grouping +tags: + - JavaScript + - Operator + - Primary Expressions +translation_of: Web/JavaScript/Reference/Operators/Grouping +--- +
{{jsSidebar("Operators")}}
+ +

Der Gruppierungsoperator ( ) kontrolliert die Priorität beim Auswerten von Ausdrücken.

+ +
{{EmbedInteractiveExample("pages/js/expressions-groupingoperator.html")}}
+ + + +

Syntax

+ +
 ( )
+ +

Beschreibung

+ +

Der Gruppierungsoperator besteht aus einem runden Klammernpaar um einen Ausdruck oder Teilausdruck, um die normale Operator Priorität zu überschreiben, so dass Ausdrücke mit niedriger Priorität vor Ausdrücken mit hoher Priorität ausgewertet werden können. So wie es klingt, gruppiert dieser Operator alles in den Klammern.

+ +

Beispiele

+ +

Überschreiben von Multiplikation und Division zu erst, wenn Addition und Subtraktion als erstes ausgewertet werden sollen.

+ +
var a = 1;
+var b = 2;
+var c = 3;
+
+// normale Priorität
+a + b * c     // 7
+// wird wie folgt ausgewertet
+a + (b * c)   // 7
+
+// überschreiben der Priorität
+// Addition vor Multiplikation
+(a + b) * c   // 9
+
+// was äquivalent zu folgendem ist
+a * c + b * c // 9
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-grouping-operator', 'The Grouping Operator')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-grouping-operator', 'The Grouping Operator')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.1.6', 'The Grouping Operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1', '#sec-11.1.4', 'The Grouping Operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.grouping")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/in/index.html b/files/de/web/javascript/reference/operators/in/index.html new file mode 100644 index 0000000000..8cf0f27136 --- /dev/null +++ b/files/de/web/javascript/reference/operators/in/index.html @@ -0,0 +1,145 @@ +--- +title: in operator +slug: Web/JavaScript/Reference/Operators/in +tags: + - JavaScript + - Operator + - Relational Operators +translation_of: Web/JavaScript/Reference/Operators/in +--- +
{{jsSidebar("Operators")}}
+ +

Der in operator gibt true zurück, falls die gegebene Eigenschaft im gegebenen Objekt existiert.

+ +
{{EmbedInteractiveExample("pages/js/expressions-inoperator.html")}}
+ + + +

Syntax

+ +
prop in object
+ +

Parameter

+ +
+
prop
+
Ein String oder Symbol welches einen Namen einer Eigenschaft oder einen Arrayindex (nicht Symbole werden in einen String konvertiert).
+
+ +
+
object
+
Objekt, bei welchem überprüft wird, ob eine Eigenschaft mit spezifiziertem Namen enthalten ist (oder in der Prototypenkette enthalten ist).
+
+ +

Beschreibung

+ +

Die folgenden Beispiele zeigen einige Verwendungen des Operators

+ +
// Arrays
+var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+0 in trees        // gibt true zurück
+3 in trees        // gibt true zurück
+6 in trees        // gibt false zurück
+"bay" in trees    // gibt false zurück (man muss den Index
+                  // spezifizieren, nicht den Wert an dem Index)
+"length" in trees // gibt true (length ist eine Eigenschaft von Array
+Symbol.iterator in trees // gibt true zurück (Arrays sind iterable, funktioniert nur in ES2015+))
+
+// Vordefinierte Objekte
+"PI" in Math     //  gibt true zurück
+
+// Eigene Objekte
+var mycar = {make: "Honda", model: "Accord", year: 1998};
+"make" in mycar  // gibt true zurück
+"model" in mycar // gibt true zurück
+
+ +

Man muss auf der rechten Seite des in Operators ein Objekt benutzen. Zum Beispiel kann ein String, der durch einen Konstruktor erstellt wurde, benutzt werden, jedoch funktioniert kein Stringliteral.

+ +
var color1 = new String("green");
+"length" in color1 // gibt true zurück
+
+var color2 = "coral";
+// erzeugt einen Fehler (color2 ist kein String Objekt)
+"length" in color2
+
+ +

Einsatz von in mit gelöschten oder undefined Eigenschaften.

+ +

Wenn eine Eigenschaft mit dem delete Operator gelöscht wird, wird der in für diese Eigenschaft false zurückgeben.

+ +
var mycar = {make: "Honda", model: "Accord", year: 1998};
+delete mycar.make;
+"make" in mycar;  // gibt false zurück
+
+var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
+delete trees[3];
+3 in trees; // gibt false zurück
+
+ +

Wenn eine Eigenschaft auf {{jsxref("Global_Objects/undefined", "undefined")}} gesetzt wird, aber nicht gelöscht wird, wird der in Operator true zurückgeben.

+ +
var mycar = {make: "Honda", model: "Accord", year: 1998};
+mycar.make = undefined;
+"make" in mycar;  // gibt true zurück
+
+ +
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
+trees[3] = undefined;
+3 in trees; // gibt true zurück
+
+ +

Vererbte Eigenschaften

+ +

Der in Operator gibt true für Eigenschaften in der Prototype-Kette zurück.

+ +
"toString" in {}; // gibt true zurück
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}{{Spec2('ESDraft')}} 
{{SpecName('ES2015', '#sec-relational-operators', 'Relational Operators')}}{{Spec2('ES2015')}} 
{{SpecName('ES5.1', '#sec-11.8.7', 'The in Operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-11.8.7', 'The in Operator')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.4.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.in")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/index.html b/files/de/web/javascript/reference/operators/index.html new file mode 100644 index 0000000000..407f5d8c1c --- /dev/null +++ b/files/de/web/javascript/reference/operators/index.html @@ -0,0 +1,303 @@ +--- +title: Ausdrücke und Operatoren +slug: Web/JavaScript/Reference/Operators +tags: + - JavaScript + - Operators +translation_of: Web/JavaScript/Reference/Operators +--- +
{{jsSidebar("Operators")}}
+ +

Dieses Kapitel behandelt alle JavaScript Sprachoperatoren, Ausdrücke und Schlüsselwörter.

+ +

Ausdrücke und Operatoren geordnet nach Kategorie

+ +

Die alphabetische Sortierung finden Sie in der linken Seitenspalte.

+ +

Grundlegende Ausdrücke

+ +

Elementare Schlüsselwörter und allgemeine Ausdrücke in JavaScript.

+ +
+
{{jsxref("Operators/this", "this")}}
+
Das this Schlüsselwort referenziert eine spezielle Eigenschaft des Ausführungskontexts.
+
{{jsxref("Operators/function", "function")}}
+
Der function Schlüsselbegriff definiert einen Funktionsausdruck.
+
{{jsxref("Operators/class", "class")}}
+
Das class Schlüsselwort definiert einen Klassenausdruck.
+
{{jsxref("Operators/function*", "function*")}}
+
Das function* Schlüsselword definiert einen Generatorfunktionsausdruck.
+
{{jsxref("Operators/yield", "yield")}}
+
Eine Generatorfunktion anhalten und fortsetzen.
+
{{jsxref("Operators/yield*", "yield*")}}
+
Delegiert zu einer anderen Generatorfunktion oder Iterable Objekt.
+
{{experimental_inline}} {{jsxref("Operators/async_function", "async function*")}}
+
async function definiert einen asynchron Funktionsausdruck.
+
{{experimental_inline}} {{jsxref("Operators/await", "await")}}
+
Hält eine asynchrone Funktion an und setzt sie fort und wartet dabei auf ein erfolgreichen oder nicht erfolgreichen Promise.
+
{{jsxref("Global_Objects/Array", "[]")}}
+
Array-Initialisierungs/Literal-Syntax.
+
{{jsxref("Operators/Object_initializer", "{}")}}
+
Objekt-Initialisierungs/Literal-Syntax.
+
{{jsxref("Global_Objects/RegExp", "/ab+c/i")}}
+
Literal-Syntax für reguläre Ausdrücke.
+
{{jsxref("Operators/Grouping", "( )")}}
+
Gruppierungs-Operator.
+
+ +

Linke-Seite-Ausdrücke

+ +

Werte auf der linken Seite sind das Ziel einer Zuweisung.

+ +
+
{{jsxref("Operators/Property_accessors", "Eigenschaftszugriff", "", 1)}}
+
Member-Operatoren ermöglichen den Zugriff auf eine Objektvariable oder eine Methode eines Objekts (object.property und object["property"]).
+
{{jsxref("Operators/new", "new")}}
+
Der new Operator erzeugt eine Instanz über einen Konstruktor.
+
new.target
+
In Konstruktoren referenziert new.target auf den Konstruktor, welcher mit {{jsxref("Operators/new", "new")}} aufgerufen wurde.
+
{{jsxref("Operators/super", "super")}}
+
Das super Schlüsselwort ruft den Elternkonstruktor auf.
+
{{jsxref("Operators/Spread_operator", "...obj")}}
+
Der Spread-Operator ermöglicht es einem Ausdruck in Situationen erweitert zu werden, wo mehrfache Argumente (für Funktionsaufrufe) oder mehrfache Elemente (für Array-Literale) erwartet werden.
+
+ +

Inkrement und Dekrement

+ +

Postfix/Prefix-Inkrement- und Postfix/Prefix-Dekrement-Operatoren.

+ +
+
{{jsxref("Operators/Arithmetic_Operators", "A++", "#Increment")}}
+
Postfix-Inkrementoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "A--", "#Decrement")}}
+
Postfix-Dekrementoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "++A", "#Increment")}}
+
Prefix-Inkrementoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "--A", "#Decrement")}}
+
Prefix-Dekrementoperator.
+
+ +

Unäre Operatoren

+ +

Ein unärer Operation ist ein Operation mit nur einem Operanden.

+ +
+
{{jsxref("Operators/delete", "delete")}}
+
Der delete-Operator entfernt eine Eigenschaft eines Objektes.
+
{{jsxref("Operators/void", "void")}}
+
Der void-Operator verwirft den Rückgabewert eines Ausdrucks.
+
{{jsxref("Operators/typeof", "typeof")}}
+
Der typeof-Operator ermittelt den Typ des angegebenen Objekts.
+
{{jsxref("Operators/Arithmetic_Operators", "+", "#Unary_plus")}}
+
Der unäre Plusoperator wandelt seinen Operand in einen Zahlentyp um.
+
{{jsxref("Operators/Arithmetic_Operators", "-", "#Unary_negation")}}
+
Der unäre Negationsoperator wandelt seinen Operand in einen Zahlentyp um und negiert ihn.
+
{{jsxref("Operators/Bitwise_Operators", "~", "#Bitwise_NOT")}}
+
Bitweiser NICHT-Operator.
+
{{jsxref("Operators/Logical_Operators", "!", "#Logical_NOT")}}
+
Logischer NICHT-Operator.
+
+ +

Arithmetische Operatoren

+ +

Arithmetische Operatoren nehmen numerische Werte (entweder Literale oder Variablen) als ihre Operanden und geben genau einen numerischen Wert zurück.

+ +
+
{{jsxref("Operators/Arithmetic_Operators", "+", "#Addition")}}
+
Additionsoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "-", "#Subtraction")}}
+
Subtraktionsoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "/", "#Division")}}
+
Divisionsoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "*", "#Multiplication")}}
+
Multiplikationsoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "%", "#Remainder")}}
+
Restoperator.
+
{{jsxref("Operators/Arithmetic_Operators", "**", "#Exponentiation")}}
+
Potenzierungsoperator.
+
+ +

Vergleichsoperatoren

+ +

Ein Vergleichsoperator vergleicht seine Operanden und gibt einen Booleschen Wert zurück, basierend dem Ergebnis des Vergleiches.

+ +
+
{{jsxref("Operators/in", "in")}}
+
Der in-Operator ermittelt ob ein Objekt die gegebene Objektvariable enthält.
+
{{jsxref("Operators/instanceof", "instanceof")}}
+
Der instanceof-Operator ermittelt ob ein Objekt eine Instanz eines anderen Objekts ist.
+
{{jsxref("Operators/Comparison_Operators", "<", "#Less_than_operator")}}
+
Kleiner-als-Operator.
+
{{jsxref("Operators/Comparison_Operators", ">", "#Greater_than_operator")}}
+
Größer-als-Operator.
+
{{jsxref("Operators/Comparison_Operators", "<=", "#Less_than_or_equal_operator")}}
+
"Kleiner als oder gleich" - Operator.
+
{{jsxref("Operators/Comparison_Operators", ">=", "#Greater_than_or_equal_operator")}}
+
"Größer als oder gleich" - Operator.
+
+ +
+

Hinweis: => is kein Operator, aber die Notation für Pfeilfunktionen.

+
+ +

Gleichheitsoperatoren

+ +

Das Ergebnis der Auswertung eines Gleichheitoperators ist immer vom Typ Boolean, basierend auf dem Ergebnis des Vergleiches.

+ +
+
{{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}
+
Gleichheitsoperator.
+
{{jsxref("Operators/Comparison_Operators", "!=", "#Inequality")}}
+
Ungleichheitsoperator.
+
{{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}
+
Identitätsoperator.
+
{{jsxref("Operators/Comparison_Operators", "!==", "#Nonidentity")}}
+
"Nicht Identitäts"-Operator.
+
+ +

Bitweise-Verschieben-Operatoren

+ +

Operationen, die alle Bits eines Operanden verschieben.

+ +
+
{{jsxref("Operators/Bitwise_Operators", "<<", "#Left_shift")}}
+
Operator für bitweises Verschieben nach links.
+
{{jsxref("Operators/Bitwise_Operators", ">>", "#Right_shift")}}
+
Operator für bitweises Verschieben nach rechts.
+
{{jsxref("Operators/Bitwise_Operators", ">>>", "#Unsigned_right_shift")}}
+
Operator für vorzeichenloses bitweises Verschieben nach rechts.
+
+ +

Binäre bitweise Operatoren

+ +

Bitweise Operatoren behandeln ihre Operanden als eine Menge von 32 Bits und geben einen in JavaScript üblichen numerischen Werte zurück.

+ +
+
{{jsxref("Operators/Bitwise_Operators", "&", "#Bitwise_AND")}}
+
Bitweises UND.
+
{{jsxref("Operators/Bitwise_Operators", "|", "#Bitwise_OR")}}
+
Bitweises ODER.
+
{{jsxref("Operators/Bitwise_Operators", "^", "#Bitwise_XOR")}}
+
Bitweises XOR.
+
+ +

Binäre logische Operatoren

+ +

Logische Operatoren werden normalerweise mit Booleschen (logischen) Werten benutzt und sie liefern dann einen Booleschen Wert zurück.

+ +
+
{{jsxref("Operators/Logical_Operators", "&&", "#Logical_AND")}}
+
Logisches UND.
+
{{jsxref("Operators/Logical_Operators", "||", "#Logical_OR")}}
+
Logisches ODER.
+
+ +

Bedingter (ternärer) Operator

+ +
+
{{jsxref("Operators/Conditional_Operator", "(Bedingung ? wennTrue : wennFalse)")}}
+
+

Der bedingte Operator liefert einen von zwei Werten zurück, in Abhängigkeit des logischen Wertes der Bedingung.

+
+
+ +

Zuweisungsoperator

+ +

Der Zuweisungsoperator weist seinem linken Operand einen Wert zu, in Abhängigkeit des Wertes seines rechten Operanden.

+ +
+
{{jsxref("Operators/Assignment_Operators", "=", "#Assignment")}}
+
Zuweisungsoperator.
+
{{jsxref("Operators/Assignment_Operators", "*=", "#Multiplication_assignment")}}
+
Multiplikationszuweisung.
+
{{jsxref("Operators/Assignment_Operators", "/=", "#Division_assignment")}}
+
Teilungszuweisung.
+
{{jsxref("Operators/Assignment_Operators", "%=", "#Remainder_assignment")}}
+
Restzuweisung.
+
{{jsxref("Operators/Assignment_Operators", "+=", "#Addition_assignment")}}
+
Additionszuweisung.
+
{{jsxref("Operators/Assignment_Operators", "-=", "#Subtraction_assignment")}}
+
Subtraktionszuweisung.
+
{{jsxref("Operators/Assignment_Operators", "<<=", "#Left_shift_assignment")}}
+
Links-verschieben-Zuweisung.
+
{{jsxref("Operators/Assignment_Operators", ">>=", "#Right_shift_assignment")}}
+
Rechts-verschieben-Zuweisung.
+
{{jsxref("Operators/Assignment_Operators", ">>>=", "#Unsigned_right_shift_assignment")}}
+
Vorzeichenlose (unsigned) Rechts-verschieben-Zuweisung.
+
{{jsxref("Operators/Assignment_Operators", "&=", "#Bitwise_AND_assignment")}}
+
Bitweise UND-Zuweisung.
+
{{jsxref("Operators/Assignment_Operators", "^=", "#Bitwise_XOR_assignment")}}
+
Bitweise ENTWEDER-ODER-Zuweisung.
+
{{jsxref("Operators/Assignment_Operators", "|=", "#Bitwise_OR_assignment")}}
+
Bitweise ODER-Zuweisung.
+
{{jsxref("Operators/Destructuring_assignment", "[a, b] = [1, 2]")}}
+ {{jsxref("Operators/Destructuring_assignment", "{a, b} = {a:1, b:2}")}}
+
+

Destrukturierende Zuweisung ermöglicht das Zuweisen von Daten aus Arrays oder Objekten an Variablen, mit einer ähnlichen Syntax wie bei Array- oder Objekt-Literalen.

+
+
+ +

Kommaoperator

+ +
+
{{jsxref("Operators/Comma_Operator", ",")}}
+
+ +

Der Kommaoperator erlaubt es mehrere Ausdrücke innerhalb eines einzigen Ausdrucks zu evaluieren und liefert das Ergebnis des letzten Ausdrucks.

+ +

Nicht standardisierte Funktionen

+ +
+
{{non-standard_inline}} {{jsxref("Operators/Legacy_generator_function", "Legacy generator function", "", 1)}}
+
Das function Schlüsselwort kann benutzt werden, um eine veraltete Generatorfunktion in einem Ausdruck zu schreiben. Um die Funktion zu einem veralteten Generator zu machen, muss der Funktionskörper mindestens ein {{jsxref("Operators/yield", "yield")}} Ausdruck enthalten.
+
{{non-standard_inline}} {{jsxref("Operators/Expression_closures", "Expression closures", "", 1)}}
+
Die Ausdrucks Closure Syntax ist eine Kurzform für eine einfache Funktion.
+
{{non-standard_inline}} {{jsxref("Operators/Array_comprehensions", "[for (x of y) x]")}}
+
Array Comprehensions.
+
{{non-standard_inline}} {{jsxref("Operators/Generator_comprehensions", "(for (x of y) y)")}}
+
Generator Comprehensions.
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1', '#sec-11', 'Expressions')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-11', 'Expressions')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-ecmascript-language-expressions', 'ECMAScript Language: Expressions')}}{{Spec2('ES6')}}Neu: Spread Syntax, Rest Syntax, destrukturierte Zuweisungen, super Schlüsselwort.
{{SpecName('ESDraft', '#sec-ecmascript-language-expressions', 'ECMAScript Language: Expressions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/inkrement/index.html b/files/de/web/javascript/reference/operators/inkrement/index.html new file mode 100644 index 0000000000..74289b92e1 --- /dev/null +++ b/files/de/web/javascript/reference/operators/inkrement/index.html @@ -0,0 +1,80 @@ +--- +title: Inkrement (++) +slug: Web/JavaScript/Reference/Operators/Inkrement +tags: + - Inkrement + - Inkrement-Operator + - Inkrementieren +translation_of: Web/JavaScript/Reference/Operators/Increment +--- +
{{jsSidebar("Operators")}}
+ +

Der Inkrement-Operator (++) inkrementiert einen Operanden, addiert also eins hinzu und gibt einen Wert zurück.

+ +
{{EmbedInteractiveExample("pages/js/expressions-increment.html")}}
+ + + +

Syntax

+ +
Operator: x++ or ++x
+
+ +

Description

+ +

Wird der Inkrement-Operator als Postfix benutzt, wobei der Operator hinter dem Operanden steht (z.B. x++), wird der Operand um eins erhöht und der Wert vor dem Inkrementieren zurück gegeben.

+ +

Wird der Inkrement-Operator als Prefix benutzt, wobei der Operator vor dem Operanden steht (z.B. ++x), wird der Operand um eins erhöht und der Wert nach dem Inkrementieren  zurück gegeben.

+ +

Examples

+ +

Postfix increment

+ +
let x = 3;
+y = x++;
+
+// y = 3
+// x = 4
+
+ +

Prefix increment

+ +
let a = 2;
+b = ++a;
+
+// a = 3
+// b = 3
+
+ +

Specifications

+ + + + + + + + + + +
Specification
{{SpecName('ESDraft', '#sec-postfix-increment-operator', 'Increment operator')}}
+ +

Browser compatibility

+ + + +

{{Compat("javascript.operators.increment")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/operators/instanceof/index.html b/files/de/web/javascript/reference/operators/instanceof/index.html new file mode 100644 index 0000000000..a6729bb709 --- /dev/null +++ b/files/de/web/javascript/reference/operators/instanceof/index.html @@ -0,0 +1,172 @@ +--- +title: instanceof +slug: Web/JavaScript/Reference/Operators/instanceof +tags: + - JavaScript + - Object + - Operator + - Prototype + - Relational Operators + - instanceof +translation_of: Web/JavaScript/Reference/Operators/instanceof +--- +
{{jsSidebar("Operators")}}
+ +

Der instanceof Operator prüft, ob ein Objekt die prototype Eigenschaft einer Konstruktorfunktion in seiner Prototypenkette besitzt.

+ +
{{EmbedInteractiveExample("pages/js/expressions-instanceof.html")}}
+ + + +

Syntax

+ +
object instanceof constructor
+ +

Parameter

+ +
+
object
+
Das zu prüfende Objekt.
+
+ +
+
constructor
+
Gegen die zu testende Funktion.
+
+ +

Beschreibung

+ +

Der instanceof Operator prüft die Anwesenheit des constructor.prototype in der Prototypenkette eines Objekts.

+ +
// Konstruktoren definieren
+function C(){}
+function D(){}
+
+var o = new C();
+
+// true, weil: Object.getPrototypeOf(o) === C.prototype
+o instanceof C;
+
+// false, weil D.prototype nirgends in o's Prototypenkette ist
+o instanceof D;
+
+o instanceof Object; // true, weil:
+C.prototype instanceof Object // true
+
+C.prototype = {};
+var o2 = new C();
+
+o2 instanceof C; // true
+
+// false, weil C.prototype nirgends in
+// o's Prototypenkette ist
+o instanceof C;
+
+D.prototype = new C(); // Einsatz von Vererbung
+var o3 = new D();
+o3 instanceof D; // true
+o3 instanceof C; // true
+
+ +

Zu beachten ist, dass sich das Ergebnis des instanceof Tests ändern kann, wenn die prototype Eigenschaft eines Konstruktors geändert wird und auch, wenn ein Objektprototyp mit Object.setPrototypeOf geändert wird. Es ist auch möglich die nicht standardisierte Pseudoeigenschaft __proto__ zu nutzen.

+ +

instanceof und verschiedene Kontexte (z. B. Frames oder Windows)

+ +

Verschiedene Scopes haben verschiedene Ausführungsumgebungen. Das bedeutet, sie haben verschiedene Standardobjekte (verschiedene globale Objekte, verschiedene Konstruktoren, etc.). Das kann zu unerwarteten Resultaten führt. Zum Beispiel gibt [] instanceof window.frames[0].Array false zurück, weil Array.prototype !== window.frames[0].Array ist und Arrays vom Ersteren erben.

+ +

Auf den ersten Blick ergibt das nicht viel Sinn, fängt man jedoch an Objekte zwischen verschiedenen Frames oder Windows zwischen Kontexten auszutauschen, wäre das valide und ein großes Problem. Zum Beispiel kann man mit sicher testen ob ein Objekt ein Array ist, indem man Array.isArray(myObj) benutzt.

+ +

Zur Prüfung ob ein Node ein SVGElement ist kann myNode instanceof myNode.ownerDocument.defaultView.SVGElement genutzt werden.

+ +
Hinweis for Mozilla Entwickler:
+In Code mit XPCOM, hat instanceof einen speziellen Effekt: obj instanceof xpcomInterface (z. B. Components.interfaces.nsIFile) ruft obj.QueryInterface(xpcomInterface) auf und gibt true zurück, wenn QueryInterface erfolgreich war. Ein Seiteneffekt ist, dass Eigenschaften von xpcomInterface auf obj aufgerufen werden können, wenn erfolgreich mit instanceof getestet wurde. Im Gegensatz zu JavaScripts Standardobjekten, funktioniert obj instanceof xpcomInterface wie erwartet, auch wenn obj aus ein anderen Scope stammt.
+ +

Beispiele

+ +

Demonstration, dass String und Date vom Typ Object sind und Ausnahmefälle

+ +

Der folgende Quelltext nutzt instanceof, um zu demonstrieren, dass String und Date Objekte von Typ Object sind (sie sind von Object abgeleitet).

+ +

Immer, wenn ein Objekt durch die Objekt Literal Notation erstellt wird, ist das eine Ausnahme: Auch wenn der Prototype undefined ist, ergibt instanceof Object true.

+ +
var simpleStr = "This is a simple string";
+var myString  = new String();
+var newStr    = new String("String created with constructor");
+var myDate    = new Date();
+var myObj     = {};
+var myNonObj  = Object.create(null);
+
+simpleStr instanceof String; // gibt false zurück; kontrolliert die Prototypenkette und findet undefined
+myString  instanceof String; // gibt true zurück
+newStr    instanceof String; // gibt true zurück
+myString  instanceof Object; // gibt true zurück
+
+myObj    instanceof Object;    // gibt true zurück, trotz eines undefined Prototypen
+({})     instanceof Object;    // gibt true zurück, gleicher Fall wie oben
+myNonObj instanceof Object;    // gibt false zurück, ein Weg ein Objekt zu erstellen, welches keine Instanz von Object ist
+
+myString instanceof Date;   // gibt false zurück
+
+myDate instanceof Date;     // gibt true zurück
+myDate instanceof Object;   // gibt true zurück
+myDate instanceof String;   // gibt false zurück
+
+ +

Demonstration, dass mycar vom Typ Car und vom Typ Object ist

+ +

Der folgende Quelltext erstellt ein Objekttyp Car und einen Instanz dieses Typen, mycar. Der instanceof Operator demonstriert, dass das mycar Objekt vom Typ Car und Object ist.

+ +
function Car(make, model, year) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+}
+var mycar = new Car("Honda", "Accord", 1998);
+var a = mycar instanceof Car;    // gibt true zurück
+var b = mycar instanceof Object; // gibt true zurück
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-relational-operators', 'Relational Operators')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.8.6', 'The instanceof operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-11.8.6', 'The instanceof operator')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.4.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.instanceof")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/logische_operatoren/index.html b/files/de/web/javascript/reference/operators/logische_operatoren/index.html new file mode 100644 index 0000000000..89c24eb33c --- /dev/null +++ b/files/de/web/javascript/reference/operators/logische_operatoren/index.html @@ -0,0 +1,246 @@ +--- +title: Logische Operatoren +slug: Web/JavaScript/Reference/Operators/Logische_Operatoren +tags: + - JavaScript + - Logic + - Logical Operators + - Not + - Operator + - Reference + - and + - or +translation_of: Web/JavaScript/Reference/Operators +--- +
{{jsSidebar("Operators")}}
+ +

Logische Operatoren werden typischerweise im Zusammenhang mit {{jsxref("Boolean")}} (logischen) Werten verwendet. Die Operatoren && (Logisches UND) und || (Logisches ODER) geben dabei den Wert von einem der Operanden zurück. Sind die Operanden mit nicht-booleschen Werten belegt, geben diese Operatoren entsprechend nicht-boolesche Werte zurück.

+ +
{{EmbedInteractiveExample("pages/js/expressions-logicaloperator.html")}}
+ + + +

Beschreibung

+ +

In der folgenden Tabelle werden die logischen Operatoren erläutert.

+ + + + + + + + + + + + + + + + + + + + + + + + +
OperatorVerwendungBeschreibung
Logisches UND (&&)ausdruck1 && ausdruck2Gibt ausdruck1 zurück, wenn er zu false konvertiert werden kann; anderfalls wird ausdruck2 zurückgegeben. Sind beide Operanden true, gibt && true zurück, Andernfalls false.
Logisches ODER (||)ausdruck1 || ausdruck2Gibt ausdruck1 zurück, wenn er zu true konvertiert werden kann; andernfalls wird ausdruck2 zurückgegeben. Ist einer der Operanden true, gibt || true zurück.
Logisches NICHT (!)!ausdruckGibt false zurück, wenn der Operand zu true konvertiert werden kann. Andernfalls wird true zurückgegeben.
+ +

Wenn ein Wert zu true konvertiert werden kann, wird er {{Glossary("truthy")}} genannt. Wenn ein Wert zu false konvertiert werden kann, wird er {{Glossary("falsy")}} genannt.

+ +

Beispiele für Ausdrücke, die zu false konvertiert werden können:

+ + + +

Auch wenn die Operatoren && und || mit nichtbooleschen Operanden verwendet werden können, gehören sie trotzdem zur Gruppe der logischen Operatoren, da ihre Rückgabewerte immer zu booleschen Werten konvertiert werden können.

+ +

Kurschlussauswertung (Short-Circuit Evaluation)

+ +

Logische Ausdrücke werden von links nach rechts ausgewertet und hierbei wird anhand der folgenden Regeln getestet, ob Kurzschlussauswertungen möglich sind:

+ + + +

Die Regeln der Logik garantieren, dass diese Auswertungen immer korrekt sind. Zu beachten ist, dass der irgendwas Teil nicht ausgewertet wird, so dass keine Seiteneffekte die von diesem Teil ausgehen ausgeführt werden. Zu beachten ist zudem, dass der irgendwas Teil ein einzelner Ausdruck ist (wie die Klammern anzeigen).

+ +

Beispielhaft betrachten wir die folgenden äquivalenten Funktionen:

+ +
function shortCircuitEvaluation() {
+  // Logisches ODER (||)
+  doSomething() || doSomethingElse();
+
+  // Logisches UND (&&)
+  doSomething() && doSomethingElse();
+}
+
+function equivalentEvaluation() {
+
+  // Logisches ODER (||)
+  var orFlag = doSomething();
+  if (!orFlag) {
+    doSomethingElse();
+  }
+
+  // Logisches UND (&&)
+  var andFlag = doSomething();
+  if (andFlag) {
+    doSomethingElse();
+  }
+}
+
+ +

Die folgenden Ausdrücke sind aufgrund der Operatorrangfolgen nicht äquivalent und betont, wie wichtig es ist, dass der rechte Operand ein einzelner Ausdruck ist (gruppiert, falls in Klammern erforderlich).

+ +
false &&  true || true      // wird zu true
+false && (true || true)     // wird zu false
+ +

Logisches UND (&&)

+ +

Im Folgenden sind Beispiele des && (logisches UND) Operators zu sehen.

+ +
a1 = true  && true      // t && t wird zu true
+a2 = true  && false     // t && f wird zu false
+a3 = false && true      // f && t wird zu false
+a4 = false && (3 == 4)  // f && f wird zu false
+a5 = 'Cat' && 'Dog'     // t && t wird zu "Dog"
+a6 = false && 'Cat'     // f && t wird zu false
+a7 = 'Cat' && false     // t && f wird zu false
+a8 = ''    && false     // f && f wird zu ""
+a9 = false && ''        // f && f wird zu false
+
+ +

Logisches ODER (||)

+ +

Im Folgenden sind Beispiele des || (logisches ODER) Operators zu sehen.

+ +
o1 = true  || true       // t || t wird zu true
+o2 = false || true       // f || t wird zu true
+o3 = true  || false      // t || f wird zu true
+o4 = false || (3 == 4)   // f || f wird zu false
+o5 = 'Cat' || 'Dog'      // t || t wird zu "Cat"
+o6 = false || 'Cat'      // f || t wird zu "Cat"
+o7 = 'Cat' || false      // t || f wird zu "Cat"
+o8 = ''    || false      // f || f wird zu false
+o9 = false || ''         // f || f wird zu ""
+
+ +

Logisches NICHT (!)

+ +

Im Folgenden sind Beispiele des ! (logisches NICHT) Operators zu sehen.

+ +
n1 = !true              // !t wird zu false
+n2 = !false             // !f wird zu true
+n3 = !"Cat"             // !t wird zu false
+
+ +

Konvertierungsregeln

+ +

Konvertierung von UND zu ODER

+ +

Die folgende Operation nutzt Booleane:

+ +
bCondition1 && bCondition2
+ +

ist äquivalent zum folgenden Ausdruck:

+ +
!(!bCondition1 || !bCondition2)
+ +

Konvertierung von ODER zu UND

+ +

Die folgende Operation nutzt Booleane:

+ +
bCondition1 || bCondition2
+ +

ist äquivalent zu folgendem Ausdruck:

+ +
!(!bCondition1 && !bCondition2)
+ +

Negierung des logischen NICHT

+ +

Die folgende Operation nutzt Booleane:

+ +
!!bCondition
+ +

ist äquivalent mit:

+ +
bCondition
+ +

Klammern in logischen Ausdrücken auflösen

+ +

Ein logischer Ausdruck wird von links nach rechts ausgewertet. Es ist immer möglich runde Klammern von einem komplexen Ausdruck zu entfernen, wenn einige Regeln beachtet werden.

+ +

Geschachteltes AND entfernen

+ +

Die folgende Operation nutzt Booleane:

+ +
bCondition1 || (bCondition2 && bCondition3)
+ +

ist äquivalent mit:

+ +
bCondition1 || bCondition2 && bCondition3
+ +

Geschachteltes OR entfernen

+ +

Die folgende Operation nutzt Booleane:

+ +
bCondition1 && (bCondition2 || bCondition3)
+ +

ist äquivalent mit:

+ +
!(!bCondition1 || !bCondition2 && !bCondition3)
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-11.11')}}{{Spec2('ES5.1')}}Definiert in mehreren Kapiteln der Spezifikation: Logical NOT Operator, Binary Logical Operators
{{SpecName('ES6', '#sec-binary-logical-operators')}}{{Spec2('ES6')}}Definiert in mehreren Kapiteln der Spezifikation: Logical NOT Operator, Binary Logical Operators
{{SpecName('ESDraft', '#sec-binary-logical-operators')}}{{Spec2('ESDraft')}}Definiert in mehreren Kapiteln der Spezifikation: Logical NOT Operator, Binary Logical Operators
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.logical")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/modulo/index.html b/files/de/web/javascript/reference/operators/modulo/index.html new file mode 100644 index 0000000000..19403ab883 --- /dev/null +++ b/files/de/web/javascript/reference/operators/modulo/index.html @@ -0,0 +1,78 @@ +--- +title: Modulo (%) +slug: Web/JavaScript/Reference/Operators/Modulo +tags: + - Division mit Rest + - Divisionsalgorithmus + - Restwert + - Restwertberechnung +translation_of: Web/JavaScript/Reference/Operators/Remainder +--- +
{{jsSidebar("Operators")}}
+ +

Der Modulo-Operator (%) gibt den Restwert zurück, der übrig bleibt wenn ein Operand durch einen anderen geteilt wird. Das Vorzeichen ergibt sich aus der Wahl der Quotienten.

+ +
{{EmbedInteractiveExample("pages/js/expressions-remainder.html")}}
+ +
+ + + +

Syntax

+ +
Operator: var1 % var2
+
+ +

Examples

+ +

Remainder with positive dividend

+ +
 12 % 5  //  2
+ 1 % -2 //  1
+ 1 % 2  //  1
+ 2 % 3  //  2
+5.5 % 2 // 1.5
+
+ +

Remainder with negative dividend

+ +
-12 % 5 // -2
+-1 % 2  // -1
+-4 % 2  // -0
+ +

Remainder with NaN

+ +
NaN % 2 // NaN
+ +

Specifications

+ + + + + + + + + + +
Specification
{{SpecName('ESDraft', '#sec-multiplicative-operators', 'Remainder operator')}}
+ +

Browser compatibility

+ + + +

{{Compat("javascript.operators.remainder")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/operators/new.target/index.html b/files/de/web/javascript/reference/operators/new.target/index.html new file mode 100644 index 0000000000..83f4a85b1c --- /dev/null +++ b/files/de/web/javascript/reference/operators/new.target/index.html @@ -0,0 +1,102 @@ +--- +title: new.target +slug: Web/JavaScript/Reference/Operators/new.target +tags: + - Classes + - ECMAScript 2015 + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Operators/new.target +--- +
{{JSSidebar("Operators")}}
+ +

Die new.target Eigenschaft lässt erkennen, ob eine Funktion oder ein Konstruktor mit dem new Operator aufgerufen wurde. In Konstruktoren und Funktionen die mit dem new Operator instanziiert wurde, gibt new.target eine Referenz zu dem Konstruktor oder der Funktion zurück. In normalen Funktionsaufrufen hat new.target den Wert {{jsxref("undefined")}}.

+ +
{{EmbedInteractiveExample("pages/js/expressions-newtarget.html")}}
+ + + +

Syntax

+ +
new.target
+ +

Beschreibung

+ +

Die new.target Syntax besteht aus dem Schlüsselwort "new", einem Punkt und dem Eigenschaftnamen "target". Normalerweise steht "new." für einen Eigenschaftszugriff, jedoch ist "new." kein Objekt. In Konstruktoraufrufen referenziert new.target auf den Konstruktor, der mit new aufgerufen wurde und somit bekommt "new." einen virtuellen Kontext.

+ +

Die new.target Eigenschaft ist eine Metaeigenschaft, die in allen Funktionen erreichbar ist. In Pfeilfunktionen referenziert new.target zum new.target der umschließenden Funktion.

+ +

Beispiele

+ +

new.target in Funktionsaufrufen

+ +

In normalen Funktionsaufrufen (im Gegensatz zu Konstruktorfunktionsaufrufen) ist new.target {{jsxref("undefined")}}. Damit lässt sich herausfinden, ob eine Funktion mit new als Konstruktor aufgerufen wurde.

+ +
function Foo() {
+  if (!new.target) throw 'Foo() must be called with new';
+  console.log('Foo instantiated with new');
+}
+
+Foo(); // throws "Foo() must be called with new"
+new Foo(); // logs "Foo instantiated with new"
+
+ +

new.target in Konstruktoren

+ +

In Klassenkonstruktoren referenziert new.target den Konstruktor, der direkt mit new aufgerufen wurde. Das ist auch der Fall, wenn der Konstruktor in einer Elternklasse ist und vom Kinderkonstruktor weiter delegiert wurde.

+ +
class A {
+  constructor() {
+    console.log(new.target.name);
+  }
+}
+
+class B extends A { constructor() { super(); } }
+
+var a = new A(); // logs "A"
+var b = new B(); // logs "B"
+
+class C { constructor() { console.log(new.target); } }
+class D extends C { constructor() { super(); } }
+
+var c = new C(); // logs class C{constructor(){console.log(new.target);}}
+var d = new D(); // logs class D extends C{constructor(){super();}}
+ +

Aus dem obigen Beispiel der Klasse C und D scheint es also, dass new.target auf die Klassendefinition der Klasse zeigt, die initialisiert wird. Wenn beispielsweise D mit new initialisiert wurde, wurde die Klassendefinition von D ausgegeben und in ähnlicher Weise wurde im Fall von c die Klasse C ausgegeben.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-built-in-function-objects', 'Built-in Function Objects')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-built-in-function-objects', 'Built-in Function Objects')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.new_target")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/new/index.html b/files/de/web/javascript/reference/operators/new/index.html new file mode 100644 index 0000000000..b3ba18f108 --- /dev/null +++ b/files/de/web/javascript/reference/operators/new/index.html @@ -0,0 +1,190 @@ +--- +title: new Operator +slug: Web/JavaScript/Reference/Operators/new +tags: + - JavaScript + - Left-hand-side expressions + - Operator +translation_of: Web/JavaScript/Reference/Operators/new +--- +
{{jsSidebar("Operators")}}
+ +

Der new Operator erzeugt eine Instanz eines benutzerdefinierten Objekttyps oder eines Standardtyps, welcher eine Konstruktorfunktion besitzt.

+ +
{{EmbedInteractiveExample("pages/js/expressions-newoperator.html")}}
+ + + +

Syntax

+ +
new constructor[([arguments])]
+ +

Parameter

+ +
+
constructor
+
Eine Funktion, welche den Typ der Objektinstanz spezifiziert.
+
+ +
+
arguments
+
Eine Liste von Werten, die dem constructor übergeben wird.
+
+ +

Beschreibung

+ +

Das erstellen eines benutzerdefinierten Objektes benötigt zwei Schritte:

+ +
    +
  1. Definieren eines Objekttypen indem eine Funktion geschrieben wird.
  2. +
  3. Erstellen einer Instanz des Objektes mit new.
  4. +
+ +

Um ein neuen Objekttypen zu definieren, erstellt man eine Funktion für den Objekttypen, die seinen Namen und Eigenschaften spezifiziert. Ein Objekt kann Eigenschaften haben, die ebenfalls Objekte sind. Sie dazu das Beispiel unten.

+ +

Wenn der Code new Foo(...) ausgeführt wird, passieren folgende Dinge:

+ +
    +
  1. Ein neues Objekt wird erstellt, welches von Foo.prototype erbt.
  2. +
  3. Die Konstruktorfunktion Foo wird mit den spezifizierten Argumenten aufgerufen und this wird an das neu erstellte Objekt gebunden. new Foo ist gleichbedeutend mit new Foo(), d. h. wenn keine Argumentenliste spezifiziert ist, wird Foo ohne Argumente aufgerufen.
  4. +
  5. Das Objekt, welches von der Konstruktorfunktion zurückgegeben wird, ist das Resultat des ganzen new Ausdrucks. Wenn die Konstruktorfunktion nicht explizit ein Objekt zurück gibt, wird stattdessen das erstellte Objekt aus Schritt 1 zurückgegeben. (Normalerweise geben Konstruktoren keinen Wert zurück, aber sie können es tun, um den normalen Objekterstellungsprozess zu überschreiben.)
  6. +
+ +

Man kann immer eine Eigenschaft zu dem vorher erstellten Objekt hinzufügen. Zum Beispiel fügt das Statement auto1.farbe = "schwarz" die Eigenschaft farbe zu auto1 hinzu und weist dieser den Wert "schwarz" zu. Jedoch hat das keinen Effekt auf andere Objekte. Um die Eigenschaft zu allen Objekten des selben Typs hinzuzufügen, muss die Eigenschaft dem Auto Objekttypen hinzugefügt werden.

+ +

Man kann eine geteilte Eigenschaft zum vorher definierten Objekttypen hinzufügen, indem die Function.prototype Eigenschaft genutzt wird. Diese definiert eine geteilte Eigenschaft mit allen Objekten, die mit der gleichen Funktion erstellt wurde, und nicht nur bei einer Instanz des Objekttypen. Der folgende Code fügt die farbe Eigenschaft mit dem Wert "originale Farbe" zu allen Objekten des Typs Auto hinzu und überschreibt diesen Wert mit dem String "schwarz" nur in dem Instanzobjekt auto1. Für weitere Informationen siehe Prototype.

+ +
function Auto() {}
+auto1 = new Auto();
+auto2 = new Auto();
+
+console.log(auto1.farbe);    // undefined
+
+Auto.prototype.farbe = "originale Farbe";
+console.log(auto1.farbe);    // originale Farbe
+
+auto1.farbe = "schwarz";
+console.log(auto1.farbe);   // schwarz
+
+console.log(auto1.__proto__.farbe); // originale Farbe
+console.log(auto2.__proto__.farbe); // originale Farbe
+console.log(auto1.farbe);           // schwarz
+console.log(auto2.farbe);           // originale Farbe
+
+ +
+

Wenn man den new Operator nicht benutzt, wird die Konstruktorfunktion wie eine normale Funktion ausgeführt, ohne ein Objekt zu erstellen. In diesem Fall ist der Wert von this ebenfalls anders.

+
+ +

Beispiele

+ +

Objekttyp und Objektinstanz

+ +

Angenommen man möchte ein Objekttypen für Autos erstellen, man möchte den Objekttypen Auto nennen und man möchte Eigenschaften für die Marke, das Modell und das Jahr haben. Um das zu erreichen muss folgende Funktion geschrieben werden:

+ +
function Auto(marke, modell, jahr) {
+  this.marke = marke;
+  this.modell = modell;
+  this.jahr = jahr;
+}
+
+ +

Nun kann man ein Objekt mit dem Namen meinAuto wie folgt erstellen:

+ +
var meinAuto = new Auto("Eagle", "Talon TSi", 1993);
+
+ +

Dieses Statement erstellt meinAuto und wiest die spezifizierten Werte den Eigenschaften zu. Dann ist der Wert von meinAuto.marke der String "Eagle", von meinAuto.jahr die Zahl 1993 und so weiter.

+ +

Man kann beliebig viele Objekte von Auto mit new erstellen. Zum Beispiel:

+ +
var kensAuto = new Auto("Nissan", "300ZX", 1992);
+
+ +

Objekteigenschaft, die selber ein Objket

+ +

Angenommen man Definiert ein Objekt mit dem Namen Person wie folgt:

+ +
function Person(name, alter, geschlecht) {
+  this.name = name;
+  this.alter = alter;
+  this.geschlecht = geschlecht;
+}
+
+ +

Dann instantiiert man zwei neue Person Objekte wie folgt:

+ +
var rand = new Person("Rand McNally", 33, "M");
+var ken = new Person("Ken Jones", 39, "M");
+
+ +

Dann erneuert man die Definition von Auto um eine besitzer Eigenschaft , die ein Person Objekt ist, wie folgt:

+ +
function Auto(marke, modell, jahr, besitzer) {
+  this.marke = marke;
+  this.modell = modell;
+  this.jahr = jahr;
+  this.besitzer = besitzer;
+}
+
+ +

Um das neue Objekt zu instantiiert benutzt man dann folgendes:

+ +
var auto1 = new Auto("Eagle", "Talon TSi", 1993, rand);
+var auto2 = new Auto("Nissan", "300ZX", 1992, ken);
+
+ +

Statt ein Stringliteral oder einen Zahlenwert beim erstellen zu benutzen, übergibt das obere Beispiel die Objekte rand und ken als Parameter für den Besitzer. Um den Namen des Besitzers von auto2 zu erfahren, muss man die Eigenschaft wie folgt abfragen:

+ +
auto2.besitzer.name
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-new-operator', 'The new Operator')}}{{Spec2('ESDraft')}}
{{SpecName('ES6', '#sec-new-operator', 'The new Operator')}}{{Spec2('ES6')}}
{{SpecName('ES5.1', '#sec-11.2.2', 'The new Operator')}}{{Spec2('ES5.1')}}
{{SpecName('ES3', '#sec-11.2.2', 'The new Operator')}}{{Spec2('ES3')}}
{{SpecName('ES1', '#sec-11.2.2', 'The new Operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.new")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/objekt_initialisierer/index.html b/files/de/web/javascript/reference/operators/objekt_initialisierer/index.html new file mode 100644 index 0000000000..32c30b7f16 --- /dev/null +++ b/files/de/web/javascript/reference/operators/objekt_initialisierer/index.html @@ -0,0 +1,315 @@ +--- +title: Objekt Initialisierer +slug: Web/JavaScript/Reference/Operators/Objekt_Initialisierer +tags: + - ECMAScript 2015 + - JSON + - JavaScript + - Literal + - Methods + - Object + - Primary Expression + - computed + - mutation + - properties +translation_of: Web/JavaScript/Reference/Operators/Object_initializer +--- +
{{JsSidebar("Operators")}}
+ +

Objekte können mit new Object(), Object.create(), oder mit der literal Notation (Initialisierungs Notation) initialisiert werden. Ein Objekt Initialisierer ist eine Komma getrennte Liste von null oder mehreren Paaren von Eigenschafts-Namen und zugehörigen Werten eines Objektes, eingeschlossen in geschwungene Klammern ({}).

+ +
{{EmbedInteractiveExample("pages/js/expressions-objectinitializer.html")}}
+ + + +

Syntax

+ +
var o = {};
+var o = { a: "foo", b: 42, c: {} };
+
+var a = "foo", b = 42, c = {};
+var o = { a: a, b: b, c: c };
+
+var o = {
+  property: function ([parameters]) {},
+  get property() {},
+  set property(value) {},
+};
+
+ +

Neue Schreibweisen in ECMAScript 2015

+ +

Man sollte in der Kompatibilitätstabelle die Unterstützung dieser Schreibweisen nachschlagen. In Umgebungen, die diese nicht unterstützen, entstehen Syntaxfehler.

+ +
// Kurzschreibweisen für Eigenschaftsnamen (ES2015)
+var a = "foo", b = 42, c = {};
+var o = { a, b, c };
+
+// Kurzschreibweise Methoden Namen (ES2015)
+var o = {
+  property([parameters]) {}
+};
+
+// Berechnete Eigenschaftsnamen (ES2015)
+var prop = "foo";
+var o = {
+  [prop]: "hey",
+  ["b" + "ar"]: "there",
+};
+ +

Beschreibung

+ +

Ein Objekt Initialisierer ist ein Ausdruck welcher die Initialisierung eines {{jsxref("Object")}} beschreibt. Objekte bestehen aus Eigenschaften, welche verwendet werden, um ein Objekt zu beschreiben. Die Werte der Objekt Eigenschaften können {{Glossary("primitive")}} Datentypen oder andere Objekte enthalten.

+ +

Objekte erzeugen

+ +

Ein leeres Objekt ohne Eigenschaften kann wie folgt erzeugt werden:

+ +
var object = {};
+ +

Jedoch: die Vorteile der literalen oder Initialisierer Notation versetzen Sie in die Lage, Objekte inklusive Eigenschaften, innerhalb geschwungener Klammern, schneller zu erzeugen. Sie schreiben einfach eine Liste von Schlüssel:Werte Paaren, getrennt durch ein Komma. Der folgende Quellcode erzeugt ein Objekt mit drei Eigenschaften mit den Schlüsseln "foo", "age" und "baz"Die Werte dieser Schlüssel sind: die Zeichenkette "bar", die Zahl 42 und die dritte Eigenschaft hat ein anderes Objekt als Wert.

+ +
var object = {
+  foo: "bar",
+  age: 42,
+  baz: { myProp: 12 },
+}
+ +

Auf Eigenschaften zugreifen

+ +

Sobald ein Objekt erzeugt worden ist, möchte man auf seine Eigenschaften lesend oder schreibend zugreifen. Auf die Eigenschaften eines Objektes kann mit der Punktnotation oder der Klammer-Notation zugegriffen werden. Siehe Eigenschaftszugriffe für weiter Informationen.

+ +
object.foo; // "bar"
+object["age"]; // 42
+
+object.foo = "baz";
+
+ +

Eigenschaften definieren

+ +

Wir haben bereits gelernt, wie man Eigenschaften mit Hilfe der Initialisierungs Syntax schreibt. Oft gibt es Variablen im Code, die Sie in einem Objekt verwenden möchten. Man sieht oft Quellcode wie den folgenden:

+ +
var a = "foo",
+    b = 42,
+    c = {};
+
+var o = {
+  a: a,
+  b: b,
+  c: c
+};
+ +

Mit ECMAScript 2015 ist eine kürzere Schreibweise verfügbar, um das Gleiche zu erreichen:

+ +
var a = "foo",
+    b = 42,
+    c = {};
+
+// Kurzschreibweise für Eigenschaftsnamen in ES2015
+var o = { a, b, c };
+
+// In anderen Worten
+console.log(); // true
+ +

Doppelte Eigenschaftsnamen

+ +

Bei Verwendung des gleichen Namens für Ihre Eigenschaften, wird die zweite Eigenschaft die erste überschreiben.

+ +
var a = {x: 1, x: 2};
+console.log(a); // { x: 2}
+
+ +

Im strikten Modus von ECMAScript 5 wurden doppelte Eigenschaftsnamen als {{jsxref("SyntaxError")}} gewertet. Mit der Einführung von berechneten Eigenschaftsnamen in ECMAScript 2015 wurde diese Einschränkung entfernt, was Duplikate zur Laufzeit möglich macht.

+ +
function haveES2015DuplicatePropertySemantics(){
+  "use strict";
+  try {
+    ({ prop: 1, prop: 2 });
+
+    // No error thrown, duplicate property names allowed in strict mode
+    return true;
+  } catch (e) {
+    // Error thrown, duplicates prohibited in strict mode
+    return false;
+  }
+}
+ +

Methoden Definitionen

+ +

Eine Eigenschaft eines Objekts kann auch auf eine Funktion oder einen Getter oder Setter-Methode verweisen.

+ +
var o = {
+  property: function ([parameters]) {},
+  get property() {},
+  set property(value) {},
+};
+ +

In ECMAScript 2015 gibt es eine kürzere Schreibweise, mit der das Schlüsselwort "function" überflüssig wird.

+ +
// Kurzschreibweise für Methoden Namen (ES2015)
+var o = {
+  property([parameters]) {},
+  * generator() {}
+};
+ +

In ECMAScript 2015 gibt es eine Möglichkeit Eigenschaften mit einer Generatorfunktion zu definierten:

+ +
var o = {
+  *generator() {
+    ........
+  }
+};
+ +

Diese ist gleich zur ES5 ähnlichen Notation (aber ECMAScript 5 hat keine Generatorfunktionen):

+ +
var o = {
+  generator = function* () {
+    ........
+  }
+}
+ +

Für weitere Informationen und Beispiele zu Methoden, siehe Methodendefinitionen.

+ +

Berechnete Bezeichnernamen

+ +

Beginnend mit ECMAScript 2015, unterstützt die Objekt Initialisierer Syntax auch berechnete Bezeichnernamen für Objekt Eigenschaften. Das gestatt dem Programmierer einen Ausdruck in eckigen Klammern anzugeben, aus welchem der Bezeichnernamen für die Objekt Eigenschaft berechnet wird. Die Schreibweise dafür ist analog zu der Klammer-Notation für den Zugriff auf Objekt Eigenschaften welche Sie bereits benutzt haben. Dieselbe Syntax kann nun für Eigenschaften Bezeichner verwendet werden:

+ +
// Computed property names (ES2015)
+var i = 0;
+var a = {
+  ["foo" + ++i]: i,
+  ["foo" + ++i]: i,
+  ["foo" + ++i]: i
+};
+
+console.log(a.foo1); // 1
+console.log(a.foo2); // 2
+console.log(a.foo3); // 3
+
+var param = 'size';
+var config = {
+  [param]: 12,
+  ["mobile" + param.charAt(0).toUpperCase() + param.slice(1)]: 4
+};
+
+console.log(config); // { size: 12, mobileSize: 4 }
+ +

Spread Eigenschaften

+ +

Die Vorschlag von Rest/Spread Eigenschaft für ECMAScript (Stage 4) fügt Spread Eigenschaften zu Objektliteralen hinzu. Er kopiert eigene aufzählbare Eigenschaften des genutzten Objektes in ein neues Objekt.

+ +

Oberflächliches Clonen (ausgenommen Eigenschaften) oder Verschmelzen von Objekten ist nun mit einer Kürzeren Syntax als {{jsxref("Object.assign()")}} möglich.

+ +
var obj1 = { foo: 'bar', x: 42 };
+var obj2 = { foo: 'baz', y: 13 };
+
+var clonedObj = { ...obj1 };
+// Object { foo: 'bar', x: 42 };
+
+var mergeObj = { ...obj1, ...obj2 };
+// Object { foo: 'baz', x: 42, y: 13 }
+ +

Zu beachten ist, dass {{jsxref("Object.assign()")}} Setters benutzt, was der Spread Operator nicht macht.

+ +

Prototypmutationen

+ +

Eine Eigenschaft Definition der Form __proto__: Wert oder "__proto__": Wert erzeugt keine Eigenschaft mit dem Namen __proto__. Wenn der angegebene Wert ein Objekt oder null ist, wird stattdessen der [[Prototyp]] des erzeugten Objektes auf den angegebenen Wert geändert. (Das Objekt wird nicht verändert, falls der Wert kein Objekt oder null ist.)

+ +
var obj1 = {};
+assert(Object.getPrototypeOf(obj1) === Object.prototype);
+
+var obj2 = { __proto__: null };
+assert(Object.getPrototypeOf(obj2) === null);
+
+var protoObj = {};
+var obj3 = { "__proto__": protoObj };
+assert(Object.getPrototypeOf(obj3) === protoObj);
+
+var obj4 = { __proto__: "not an object or null" };
+assert(Object.getPrototypeOf(obj4) === Object.prototype);
+assert(!obj4.hasOwnProperty("__proto__"));
+
+ +

Pro Objekt-Literal ist nur eine einzelne Prototypmutation erlaubt: mehrfache Prototyp Mutationen führen zu einem Syntax Fehler.

+ +

Eigenschaftsdefinitionen welche nicht von der Doppelpunkt Notation Gebrauch machen, sind keine Prototyp Mutationen: es sind Eigenschaftsdefinitionen die sich verhalten wie jede andere Definition von Eigenschaftsbezeichnern auch.

+ +
var __proto__ = "variable";
+
+var obj1 = { __proto__ };
+assert(Object.getPrototypeOf(obj1) === Object.prototype);
+assert(obj1.hasOwnProperty("__proto__"));
+assert(obj1.__proto__ === "variable");
+
+var obj2 = { __proto__() { return "hello"; } };
+assert(obj2.__proto__() === "hello");
+
+var obj3 = { ["__prot" + "o__"]: 17 };
+assert(obj3.__proto__ === 17);
+
+ +

Objektliteral-Notation vs JSON

+ +

Die Objekt-Literal Notation ist nicht dasselbe wie die JavaScript Object Notation (JSON). Obwohl sie ähnlich aussehen, gibt es Unterschiede zwischen ihnen:

+ + + +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}{{Spec2('ES5.1')}}Getter und Setter hinzugefügt.
{{SpecName('ES2015', '#sec-object-initializer', 'Object Initializer')}}{{Spec2('ES2015')}}Kurzschreibweise für Methoden-/Eigenschaftsnamen und berechnete Eigenschaftsnamen hinzugefügt.
{{SpecName('ESDraft', '#sec-object-initializer', 'Object Initializer')}}{{Spec2('ESDraft')}}
Rest/Spread Properties for ECMAScript EntwurfStage 4 (Fertig).
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.operators.object_initializer")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/operator_precedence/index.html b/files/de/web/javascript/reference/operators/operator_precedence/index.html new file mode 100644 index 0000000000..e258a96525 --- /dev/null +++ b/files/de/web/javascript/reference/operators/operator_precedence/index.html @@ -0,0 +1,318 @@ +--- +title: Operatorenpriorität +slug: Web/JavaScript/Reference/Operators/Operator_Precedence +tags: + - JavaScript + - Operator + - precedence +translation_of: Web/JavaScript/Reference/Operators/Operator_Precedence +--- +

{{jsSidebar("Operators")}}

+ +

Die Operatorpriorität bestimmt, in welcher Reihenfolge Operatoren ausgeführt werden. Operatoren, die in der Rangfolge zuerst kommen, werden auch zuerst ausgeführt.

+ +

{{EmbedInteractiveExample("pages/js/expressions-operatorprecedence.html")}}

+ +

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

+ +

Assoziativität

+ +

Assoziativität, bestimmt in welcher Reihenfolge Operatoren der selben Rangfolge ausgeführt werden. Betrachten wir als Beispiel den folgenden Ausdruck:

+ +
a OP b OP c
+
+ +

Linksassoziativ (links nach rechts) bedeutet, dass der Code als (a OP b) OP c ausgeführt wird, während rechtssassoziativ (rechts nach links) heißt, dass der Code wie a OP (b OP c) ausgeführt wird. Zuordnungsoperatoren sind rechtssassoziativ, also kann man schreiben:

+ +
a = b = 5;
+
+ +

mit dem erwarteten Resultat, dass sowohl a als auch b den Wert 5 haben. Das liegt daran, dass Zuordnungsopertoren den Wert zurükgeben, den sie zuerst zugeordnet haben: Zuerst wird b auf 5 gesetzt; daraufhin wird a auf 5, also den Rückgabewert von b = 5, gesetzt.

+ +

Tabelle

+ +

Die nachfolgende Tabelle geordnet von der höchsten (20) bis zur kleinsten (1) Priorität.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PrioritätOperatorAssoziativitätEinzelner Operator
20{{jsxref("Operators/Grouping", "Gruppieren")}}n/a( … )
19{{jsxref("Operators/Property_Accessors", "Eigenschaftszugriff", "#Dot_notation")}}links nach rechts… . …
{{jsxref("Operators/Property_Accessors", "Berechnete Eigenschaften Access","#Bracket_notation")}}links nach rechts… [ … ]
{{jsxref("Operators/new","new")}} (mit Argumentenliste)n/anew … ( … )
Funktionsaufruflinks nach rechts… ( )
18{{jsxref("Operators/new","new")}} (ohne Argumentenliste)rechts nach linksnew …
17{{jsxref("Operators/Arithmetic_Operators","Postfix Inkrement","#Increment")}}n/a… ++
{{jsxref("Operators/Arithmetic_Operators","Postfix Dekrement","#Decrement")}}… --
16Logisches NICHTrechts nach links! …
Bitweises NICHT~ …
Unäres Plus+ …
Unäres Minus- …
Prefix Inkrement++ …
Prefix Dekrement-- …
typeoftypeof …
voidvoid …
deletedelete …
awaitawait …
15Potenzierungrechts nach links… ** …
14Multiplikationlinks nach rechts… * …
Division… / …
Rest… % …
13Additionlinks nach rechts… + …
Subtraktion… - …
12Bitweise Linksverschiebunglinks nach rechts… << …
Bitweise Rechtsverschiebung… >> …
Bitweise Vorzeichnelose Rechtsverschiebung… >>> …
11Kleiner alslinks nach rechts… < …
Kleiner als oder gleich… <= …
Größer als… > …
Größer als oder gleich… >= …
in… in …
instanceof… instanceof …
10Gleichheitlinks nach rechts… == …
Ungleichheit… != …
Strikte Gleichheit… === …
Strikte Ungleichheit… !== …
9Bitweises UNDlinks nach rechts… & …
8Bitweises Exklusiv ODER (XOR)links nach rechts… ^ …
7Bitweises ODERlinks nach rechts… | …
6Logisches UNDlinks nach rechts… && …
5Logisches ODERlinks nach rechts… || …
4Bedingtrechts nach links… ? … : …
3Zuweisungrechts nach links… = …
… += …
… -= …
… **= …
… *= …
… /= …
… %= …
… <<= …
… >>= …
… >>>= …
… &= …
… ^= …
… |= …
2yieldrechts nach linksyield …
yield*yield* …
1Spreadn/a... …
0Komma / Sequenzlinks nach rechts… , …
diff --git a/files/de/web/javascript/reference/operators/optionale_verkettung/index.html b/files/de/web/javascript/reference/operators/optionale_verkettung/index.html new file mode 100644 index 0000000000..8ef763b3cd --- /dev/null +++ b/files/de/web/javascript/reference/operators/optionale_verkettung/index.html @@ -0,0 +1,194 @@ +--- +title: Optionale Verkettung +slug: Web/JavaScript/Reference/Operators/Optionale_Verkettung +tags: + - Experimentell + - JavaScript + - Operator + - Optionale Verkettung + - Referenz + - Verkettung +translation_of: Web/JavaScript/Reference/Operators/Optional_chaining +--- +
{{JSSidebar("Operators")}}
+ +

{{SeeCompatTable}}

+ +

Der Optionale-Verkettungs-Operator (Optional Chaining) ?. ermöglicht es, einen Wert aus einer Eigenschaft tief innerhalb einer Verkettung von Objekt-Eigenschaften auszulesen, ohne dabei explizit überprüfen zu müssen, ob jede Referenz in der Kette valide ist.Der ?. Operator funktioniert ähnlich wie der . -Verkettungs Operator, außer dass er keinen Fehler bei einem {{glossary("nullish")}} ({{JSxRef("null")}} oder {{JSxRef("undefined")}}) Wert auswirft, sondern stattdessen den Ausdruck beendet und undefined zurückgibt. Wird er mit Funktionsaufrufen verwendet, wirft der Aufruf undefined zurück, wenn die Funktion nicht existiert.

+ +

Das Ergebnis sind kürzere und einfacherere Anweisungen wenn auf verkettete Eigenschaften zugegriffen wird, bei denen die Möglichkeit besteht, dass sie fehlen. Er kann außerdem hilfreich sein, wenn man den Inhalt eines Objektes erhalten möchte wenn es keine Garantie dafür gibt welche Eigenschaften benötigt werden.

+ +
{{EmbedInteractiveExample("pages/js/expressions-optionalchainingoperator.html")}}
+ +
+ + + +

Syntax

+ +
obj?.prop
+obj?.[expr]
+arr?.[index]
+func?.(args)
+
+ +

Beschreibung

+ +

Der Optionale-Verkettungs-Operator ermöglicht einen Weg auf Werte in einer Verkettung aus Eigenschaften zuzugreifen, wenn die Möglichkeit existiert, dass eine der Referenzen oder Funktionen in der Kette undefined oder null sind.

+ +

Als Beispiel nehmen wir ein Objekt obj, dass eine verschachtelte Struktur besitzt. Ohne Optionale Verkettung müssen wir beim Zugriff auf einen Wert jede Referenz innerhalb der Kette auf ihre Existenz überprüfen:

+ +
let nestedProp = obj.first && obj.first.second;
+ +

Der Wert von obj.first wird darauf geprüft nicht-null (und nicht-undefined) zu sein und erst dann greifen wir auf den Wert obj.first.second zu. Dies verhindet einen Fehler der auftreten würde wenn wir direkt obj.first.second ansprechen ohne zuvor obj.first zu prüfen.

+ +

Mit dem Optionale-Verkettungs-Operator (?.) allerdings müssen wir nicht explizit testen und können eine Abkürzung auf Basis des Wertes von obj.first nutzen bevor auf auf obj.first.second zugreifen:

+ +
let nestedProp = obj.first?.second;
+ +

Durch die Verwendung des ?.-Operators statt nur dem . stellet JavaScript sicher, dass zuvor geprüft wird ob obj.first nicht null oder undefined ist bevor auf obj.first.second zugegriffen wird. Wenn obj.first null oder undefined ist, wird der Ausdruck automatisch sofort beendet und wirft den Wert undefined zurück

+ +

Das ist dasselbe wie folgender Ausdruck:

+ +
let nestedProp = ((obj.first === null || obj.first === undefined) ? undefined : obj.first.second);
+ +

Optionale Verkettung mit Funktionsaufrufen

+ +

Optionale Verkettung kann verwendet werden um Funktionen aufzurufen, die womöglich nicht existeiren. Das kann hilfreich sein wenn man z.B. eine API verwenden möchte die möglicherweise nicht verfügbar ist, entweder durch das Alter der Implementierung oder weil die Funktionalität nicht für das Gerät verfügbar ist.

+ +

Verwendet man optionale Verkettung mit Funktionsaufrufen, wird der Ausdruck automatisch undefined zurückwerfen, sollte die Funktion nicht existieren:

+ +
let result = someInterface.customMethod?.();
+ +
+

Note: Wenn eine Eigenschaft mit dem Namen existiert, die aber keine Funktion ist, wird ?. trotzdem eine {{JSxRef("TypeError")}} Ausnahme auslösen (x.y ist keine Funktion).

+
+ +

Optionale Callbacks oder Event Handler handhaben

+ +

If you use callbacks or fetch methods from an object with a destructuring assignment, you may have non-existent values that you cannot call as functions unless you have tested their existence. Using ?., you can avoid this extra test:

+ +
// Written as of ES2019
+function doSomething(onContent, onError) {
+  try {
+    // ... do something with the data
+  }
+  catch (err) {
+    if (onError) { // Testing if onError really exists
+      onError(err.message);
+    }
+  }
+}
+
+ +
// Using optional chaining with function calls
+function doSomething(onContent, onError) {
+  try {
+   // ... do something with the data
+  }
+  catch (err) {
+    onError?.(err.message); // no exception if onError is undefined
+  }
+}
+
+ +

Optional chaining with expressions

+ +

You can also use the optional chaining operator when accessing properties with an expression using the bracket notation of the property accessor:

+ +
let nestedProp = obj?.['prop' + 'Name'];
+
+ +

Array item access with optional chaining

+ +
let arrayItem = arr?.[42];
+ +

Examples

+ +

Basic example

+ +

This example looks for the value of the name property for the member bar in a map when there is no such member. The result is therefore undefined.

+ +
let myMap = new Map();
+myMap.set("foo", {name: "baz", desc: "inga"});
+
+let nameBar = myMap.get("bar")?.name;
+ +

Short-circuiting evaluation

+ +

When using optional chaining with expressions, if the left operand is null or undefined, the expression will not be evaluated. For instance:

+ +
let potentiallyNullObj = null;
+let x = 0;
+let prop = potentiallyNullObj?.[x++];
+
+console.log(x); // 0 as x was not incremented
+
+ +

Stacking the optional chaining operator

+ +

With nested structures, it is possible to use optional chaining multiple times:

+ +
let customer = {
+  name: "Carl",
+  details: {
+    age: 82,
+    location: "Paradise Falls" // detailed address is unknown
+  }
+};
+let customerCity = customer.details?.address?.city;
+
+// … this also works with optional chaining function call
+let duration = vacations.trip?.getTime?.();
+
+ +

Combining with the nullish coalescing operator

+ +

The nullish coalescing operator may be used after optional chaining in order to build a default value when none was found:

+ +
let customer = {
+  name: "Carl",
+  details: { age: 82 }
+};
+const customerCity = customer?.city ?? "Unknown city";
+console.log(customerCity); // Unknown city
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
Proposal for the "optional chaining" operatorStage 4
+ +

Browser compatibility

+ +
+ + +

{{Compat("javascript.operators.optional_chaining")}}

+
+ +

Implementation Progress

+ +

The following table provides a daily implementation status for this feature, because this feature has not yet reached cross-browser stability. The data is generated by running the relevant feature tests in Test262, the standard test suite of JavaScript, in the nightly build, or latest release of each browser's JavaScript engine.

+ +
{{EmbedTest262ReportResultsTable("optional-chaining")}}
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/operators/pipeline_operator/index.html b/files/de/web/javascript/reference/operators/pipeline_operator/index.html new file mode 100644 index 0000000000..653e1a859d --- /dev/null +++ b/files/de/web/javascript/reference/operators/pipeline_operator/index.html @@ -0,0 +1,67 @@ +--- +title: Pipeline Operator +slug: Web/JavaScript/Reference/Operators/Pipeline_operator +tags: + - Experimental + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Pipeline_operator +--- +
{{jsSidebar("Operators")}} {{SeeCompatTable}}
+ +

Der experimentelle Pipline Operator |> (aktuell in Stage 1) erlaubt es verkettete Funktionsaufrufe in einer Lesbaren form zu erstellen. Grundsätzlich ist der Pipline Operator syntaktischer Zucker für den Aufruf einer Funktion mit einem Argument. Er erlaubt es

+ +

'%21' |> decodeURI statt decodeURI('%21') zu schreiben.

+ +

Syntax

+ +
expression |> function
+ +

Beispiele

+ +

Verkettete Funktionsaufrufe

+ +

Der Pipline Operator kann die Lesbarkeit von verketteten Funktionsaufrufen verbessern.

+ +
const double = (n) => n * 2;
+const increment = (n) => n + 1;
+
+// Ohne Pipeline Operator
+double(increment(double(double(5)))); // 42
+
+// mit Pipeline Operator
+5 |> double |> double |> increment |> double; // 42
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Pipeline operator draftStage 1Kein Teil der ECMAScript Spezifikation.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.operators.pipeline")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/property_accessors/index.html b/files/de/web/javascript/reference/operators/property_accessors/index.html new file mode 100644 index 0000000000..9dac328d6a --- /dev/null +++ b/files/de/web/javascript/reference/operators/property_accessors/index.html @@ -0,0 +1,150 @@ +--- +title: Eigenschaftszugriff +slug: Web/JavaScript/Reference/Operators/Property_Accessors +tags: + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Property_Accessors +--- +
{{jsSidebar("Operators")}}
+ +

Eigenschaftszugriffe erlauben den Zugriff auf Eigenschaften eines Objekts, indem die Punktnotation oder Klammernotation benutzt wird.

+ +
{{EmbedInteractiveExample("pages/js/expressions-propertyaccessors.html")}}
+ + + +

Syntax

+ +
object.property
+object['property']
+
+ +

Beschreibung

+ +

Man kann ein Objekt wie ein assoziatives Array (auch bekannt als Map, Dictionary, Hash, lookup table) vorstellen. Die Schlüssel im Array sind die Namen der Eigenschaften des Objekts. Es ist typisch, wenn man von Eigenschaften eines Objekts spricht, zwischen Eigenschaften und Methoden zu unterscheiden. Die Eigenschaften/Methoden-Unterscheidung ist jedoch nur eine Konvention. Eine Methode ist einfach eine Eigenschaft die aufgerufen werden kann, zum Beispiel wenn sie als Wert eine Referenz auf eine Funktions Instanz hat.

+ +

Es gibt zwei Wege auf Eigenschaften zuzugreifen: Die Punktnotation und die Klammernotation.

+ +

Punktnotation

+ +
get = object.property;
+object.property = set;
+
+ +

In diesem Quelltext muss property ein gültiger Bezeichner ein, d. h. eine Sequenz von alphanumerischen Zeichen inklusive Unterstrich (_) und Dollarzeichen ($) die nicht mit einer Nummer beginnen können. Zum Beispiel ist object.$1 gültig währenddem object.1 nicht gültig ist.

+ +
document.createElement('pre');
+
+ +

Hier wird die Methode namens "createElement" von document erfragt und aufgerufen.

+ +

Wenn man eine Methode für ein numerisches Literal nutzt, das keinen Exponenten und keine Kommastelle besitzt, können vor dem Punkt, der vor dem Methodenaufruf steht, Whitespaces stehen, um die Interpretation des Punktes als Komma zu verhindern.

+ +
77 .toExponential();
+// oder
+77
+.toExponential();
+// oder
+(77).toExponential();
+// oder
+77..toExponential();
+// oder
+77.0.toExponential();
+// weil 77. === 77.0, keine Zweideutigkeit
+ +

Klammernotation

+ +
get = object[property_name];
+object[property_name] = set;
+
+ +

property_name ist ein String. Der String muss kein gültiger Bezeichner sein; er kann einen beliebigen Wert haben, z. B. "1foo", "!bar!" oder sogar " "  (ein Leerzeichen).

+ +
document['createElement']('pre');
+
+ +

Dieses macht genau dasselbe wie das vorherige Beispiel.

+ +

Ein Leerzeichen vor der Klammernotation ist erlaubt.

+ +
document ['createElement']('pre');
+ +

Eigenschaftensnamen

+ +

Eigenschaftsnamen müssen Strings sein. Das bedeutet dass Objekte, die kein String sind, nicht als Schlüssel in einem Objekt verwendet werden können. Jedes Objekt das keine String ist, inklusive Zahlen, wird mittels toString in einen String umgewandelt.

+ +
var object = {};
+object['1'] = 'value';
+console.log(object[1]);
+
+ +

Dies gibt "value" aus, weil 1 in '1' umgewandelt wird.

+ +
var foo = {unique_prop: 1}, bar = {unique_prop: 2}, object = {};
+object[foo] = 'value';
+console.log(object[bar]);
+
+ +

Dies gibt auch "value" aus, weil beide Objekte, foo und bar, in den gleiche String umgewandelt werden. In der SpiderMonkey JavaScript Engine ist dieser String "['object Object']".

+ +

Methodenbindung

+ +

Eine Methode ist nicht an ein Objekt gebunden zu dem sie gehört. Vor allem this ist nicht an eine Methode gebunden, d. h. this muss nicht unbedingt auf das Objekt verweisen das die Methode enthält. this wird stattdessen vom Funktionsaufruf gesetzt. Siehe auch this dazu.

+ +

Hinweis zu eval

+ +

JavaScript-Anfänger machen oft den Fehler eval zu nutzen wo die Klammernotation verwendet werden kann. Zum Beispiel sieht man folgende Syntax häufig in vielen Skripten.

+ +
x = eval('document.forms.form_name.elements.' + strFormControl + '.value');
+
+ +

eval ist langsam und sollte wenn möglich vermieden werden. Außerdem würde strFormControl auch einen Bezeichner beinhalten müssen der für Namen und IDs von Formularelementen nicht benötigt wird. Es ist besser die Klammernotation zu verwenden.

+ +
x = document.forms['form_name'].elements[strFormControl].value;
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-property-accessors', 'Property Accessors')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-property-accessors', 'Property Accessors')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.2.1', 'Property Accessors')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1', '#sec-11.2.1', 'Property Accessors')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.property_accessors")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/spread_operator/index.html b/files/de/web/javascript/reference/operators/spread_operator/index.html new file mode 100644 index 0000000000..13b3070be5 --- /dev/null +++ b/files/de/web/javascript/reference/operators/spread_operator/index.html @@ -0,0 +1,219 @@ +--- +title: Spread-Operator +slug: Web/JavaScript/Reference/Operators/Spread_operator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Spread_syntax +--- +
{{jsSidebar("Operators")}}
+ +

Mit der Spread-Syntax kann ein einzelner Ausdruck dort expandiert werden, wo mehrere Argumente (bei Funktionsaufrufen), mehrere Elemente (für Array-Literale) oder mehrere Variablen (für destrukturierende Anweisungen) erwartet werden.

+ +

Syntax

+ +

Für Funktionsaufrufe:

+ +
myFunction(...iterableObj);
+
+ +

Für Array-Literale:

+ +
[...iterableObj, 4, 5, 6]
+ +

Beispiele

+ +

Ein besseres "apply"

+ +

Beispiel: Für gewöhnlich wird {{jsxref( "Function.prototype.apply")}} verwendet, wenn man die Elemente eines Arrays als Argumente eines Funktionsaufrufs nutzen möchte:

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction.apply(null, args);
+ +

Mit dem ES2015 Spread-Operator kann das nun wie folgt geschrieben werden:

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction(...args);
+ +

Die Spread-Syntax kann für jedes beliebige Argument der Argumentliste verwendet werden, und sie kann auch mehrmals verwendet werden:

+ +
function myFunction(v, w, x, y, z) { }
+var args = [0, 1];
+myFunction(-1, ...args, 2, ...[3]);
+ +

Ein mächtigeres Array-Literal

+ +

Beispiel: Wenn man ohne den Spread-Operator ein neues Array erstellen will, bei dem ein Teil davon ein bereits bestehendes Array sein soll, dann ist die Array-Literal-Syntax nicht mehr ausreichend und man muss auf imperative Programmierung mit einer Kombination aus push, splice, concat, etc. zurückgreifen. Mit der Spread-Syntax jedoch kann das viel prägnanter ausgedrückt werden:

+ +
var parts = ['shoulders', 'knees'];
+var lyrics = ['head', ...parts, 'and', 'toes']; // ["head", "shoulders", "knees", "and", "toes"]
+
+ +

Genau wie der Spread-Operator für Argumentlisten kann ... überall im Array-Literal verwendet werden, auch mehrmals.

+ +

"Apply" für "new"

+ +

Beispiel: In ES5 kann new nicht mit apply kombiniert werden (nach den ES5-Regeln führt apply einen [[Call]] aus, keinen [[Construct]]). Die Spread-Syntax von ES2015 unterstützt dies auf ganz natürliche Weise:

+ +
var dateFields = readDateFields(database);
+var d = new Date(...dateFields);
+ +

Ein Array kopieren

+ +
var arr = [1,2,3];
+var arr2 = [...arr]; // wie arr.slice()
+arr2.push(4);        // arr2 wird [1,2,3,4], arr bleibt unverändert.
+ +

Ein besseres "push"

+ +

Beispiel: {{jsxref("Global_Objects/Array/push", "push")}} wird oft verwendet um alle Elemente eines Arrays an das Ende eines bestehenden Arrays anzuhängen. Das wird in ES5 oft wie folgt umgesetzt:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Append all items from arr2 onto arr1
+Array.prototype.push.apply(arr1, arr2);
+ +

Mit dem Spread-Operator von ES2015 wird daraus:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1.push(...arr2);
+ +

Nur "apply" für iterables

+ +
var obj = {"key1":"value1"};
+function myFunction(x) {
+    console.log(x) // undefined
+}
+myFunction(...obj);
+var args = [...obj];
+console.log(args, args.length); // [] 0
+ +

Rest-Syntax (Parameter)

+ +

Rest-Syntax sieht genauso aus wie die Spread-Syntax und wird für das Destrukturieren von Arrays und Objekten eingesetzt. Rest-Syntax ist sozusagen das Gegenteil von Spread-Syntax:  Spread klappt die einzelnen Bestandteile eines Arrays aus, während Rest verschiedene einzelne Elemente zu einem Array zusammenfasst.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array-initializer')}}{{Spec2('ES2015')}}Definiert in verschiedenen Abschnitten der Spezifikation: Array Initializer, Argument Lists
{{SpecName('ESDraft', '#sec-array-initializer')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Spread-Operation innerhalb von Array-Literalen{{CompatChrome("46")}}{{CompatGeckoDesktop("16")}}{{CompatIE("Edge")}}{{CompatNo}}7.1
Spread-Operation innerhalb von Funktionsaufrufen{{CompatChrome("46")}}{{CompatGeckoDesktop("27")}}{{CompatIE("Edge")}}{{CompatNo}}7.1
Spread-Operation beim Destrukturieren ("destructuring"){{CompatChrome("49")}}{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Spread-Operation innerhalb von Array-Literalen{{CompatNo}}{{CompatChrome("46")}}{{CompatGeckoMobile("16")}}{{CompatNo}}{{CompatNo}}8{{CompatChrome("46")}}
Spread-Operation innerhalb von Funktionsaufrufen{{CompatNo}}{{CompatChrome("46")}}{{CompatGeckoMobile("27")}}{{CompatNo}}{{CompatNo}}8{{CompatChrome("46")}}
Spread-Operation beim Destrukturieren ("destructuring"){{CompatNo}}{{CompatNo}}{{CompatGeckoDesktop("34")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/spread_syntax/index.html b/files/de/web/javascript/reference/operators/spread_syntax/index.html new file mode 100644 index 0000000000..cf1e6da016 --- /dev/null +++ b/files/de/web/javascript/reference/operators/spread_syntax/index.html @@ -0,0 +1,236 @@ +--- +title: Spread syntax +slug: Web/JavaScript/Reference/Operators/Spread_syntax +translation_of: Web/JavaScript/Reference/Operators/Spread_syntax +--- +
{{jsSidebar("Operators")}}
+ +
Die Spread-Syntax erlaubt es, einen einzelnen Array-Ausdruck oder String an Stellen zu expandieren, an denen Null oder mehr Argumente (für Funktionsaufrufe) oder Elemente (für Array-Literale) erwartet werden, oder einen Objekt-Ausdruck an Stellen zu expandieren, an denen Null oder mehr Schlüssel-Wert-Paare (für Objektliterale) erwartet werden.
+ +
{{EmbedInteractiveExample("pages/js/expressions-spreadsyntax.html")}}
+ + + +

Syntax

+ +

Für Funktionsaufrufe:

+ +
myFunction(...iterableObj);
+
+ +

Für Array-Literale oder Strings:

+ +
[...iterableObj, '4', 'fünf', 6];
+ +

Für Objektliterale (neu in ECMAScript 2018):

+ +
let objClone = { ...obj };
+ +

Beispiele

+ +

Spread in Funktionsaufrufen

+ +

Apply ersetzen

+ +

Es ist üblich {{jsxref( "Function.prototype.apply")}} zu benutzen, wenn man die Elemente eines Arrays als Argumente eines Funktionsaufrufs nutzen möchte.

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction.apply(null, args);
+ +

Mit der Spread-Syntax lässt sich das ganze wie folgt schreiben:

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction(...args);
+ +

Jedes Argument der Argumentliste kann die Spread-Syntax verwenden, und sie kann auch mehrfach verwendet werden.

+ +
function myFunction(v, w, x, y, z) { }
+var args = [0, 1];
+myFunction(-1, ...args, 2, ...[3]);
+ +

Apply bei new

+ +

Beim Aufruf eines Konstruktors mit new, ist es nicht möglich ein Array und apply direkt zu benutzen (apply führt [[Call]] und nicht [[Construct]] aus). Allerdings kann dank der Spread-Syntax ein Array mit new verwendet werden:

+ +
var dateFields = [1970, 0, 1];  // 1. Januar 1970
+var d = new Date(...dateFields);
+
+ +

Um new mit einem Array ohne die Spread-Syntax zu nutzen, müsste man das indirekt mit Partial Application umsetzen:

+ +
function applyAndNew(constructor, args) {
+  function partial () {
+    return constructor.apply(this, args);
+  };
+  if (typeof constructor.prototype === "object") {
+    partial.prototype = Object.create(constructor.prototype);
+  }
+  return partial;
+}
+
+
+function myConstructor () {
+  console.log("arguments.length: " + arguments.length);
+  console.log(arguments);
+  this.prop1="val1";
+  this.prop2="val2";
+};
+
+var myArguments = ["hi", "wie", "geht's", "dir", "kumpel", null];
+var myConstructorWithArguments = applyAndNew(myConstructor, myArguments);
+
+console.log(new myConstructorWithArguments);
+// (internal log of myConstructor):           arguments.length: 6
+// (internal log of myConstructor):           ["hi", "wie", "geht's", "dir", "kumpel", null]
+// (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"}
+ +

Spread bei Array-Literalen

+ +

Ein mächtigeres Array-Literal

+ +

Ohne Spread-Syntax ist die Array-Literal-Syntax nicht ausreichend, um ein neues Array zu erzeugen, das aus einem bereits existierenden Array besteht. Man muss dann auf imperative Programmierung mit einer Kombination aus push, splice, concat, etc. umsteigen. Mit Spread-Syntax wird der Code kurz und bündig:

+ +
var parts = ['Schultern', 'Knie'];
+var lyrics = ['Kopf', ...parts, 'und', 'Zehen'];
+// ["Kopf", "Schultern", "Knie", "und", "Zehen"]
+
+ +

Genau wie bei Argumentlisten von Funktionsaufrufen kann ... überall und mehrach bei Array-Literalen benutzt werden.

+ +

Ein Array kopieren

+ +
var arr = [1, 2, 3];
+var arr2 = [...arr]; // wie arr.slice()
+arr2.push(4);
+
+// arr2 enthält[1, 2, 3, 4]
+// arr bleibt unverändert
+
+ +

Bemerkung: Spread-Syntax geht beim Kopieren eines Arrays effektiv eine Ebene tief. Daher kann es für das Kopieren mehrdimensionaler Arrays ungeeignet sein, wie das folgende Beispiel zeigt (dasselbe gilt für {{jsxref("Object.assign()")}} und Spread-Syntax).

+ +
var a = [[1], [2], [3]];
+var b = [...a];
+b.shift().shift(); // 1
+// Auch Array a wurde verändert. [[], [2], [3]]
+
+ +

Eine bessere Möglichkeit, Arrays zu verketten

+ +

{{jsxref("Array.concat")}} wird oft verwendet, um ein Array an das Ende eines bestehenden Arrays anzuhängen. Ohne Spread-Syntax wird dies wie folgt gemacht:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Hänge alle Elemente von arr2 an arr1
+arr1 = arr1.concat(arr2);
+ +

Mit Spread-Syntax wird daraus:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1 = [...arr1, ...arr2];
+
+ +

{{jsxref("Array.unshift")}} wird oft verwendet, um ein Array von Werten am Anfang eines bestehenden Arrays einzufügen. Ohne Spread-Syntax wird dies wie folgt gemacht:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Alle Items von arr2 auf arr1 voranstellen
+Array.prototype.unshift.apply(arr1, arr2) // arr1 ist jetzt [3, 4, 5, 0, 1, 2]
+ +

Bei der Spread-Syntax wird dies zu [Beachten Sie jedoch, dass dies ein neues Array arr1 erzeugt. Im Gegensatz zu {{jsxref("Array.unshift")}} ändert es nicht das ursprüngliche Array arr1 in-place]:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1 = [...arr2, ...arr1]; // arr1 ist jetzt [3, 4, 5, 0, 1, 2]
+
+ +

Spread für Objektliterale

+ +

Der Vorschlag zu Rest-/Spread-Attributen für ECMAScript (Stufe 4) fügt Spread-Attribute zu Objektliteralen hinzu. Dadurch werden die abzählbaren Attribute von einem gegebenen Objekt zu einem neuen hinzugefügt.

+ +

Flaches Klonen (ohne prototype) oder Zusammenführen von Objekten ist nun mit einer kürzeren Syntax als {{jsxref("Object.assign()")}} möglich.

+ +
var obj1 = { foo: 'bar', x: 42 };
+var obj2 = { foo: 'baz', y: 13 };
+
+var clonedObj = { ...obj1 };
+// Object { foo: "bar", x: 42 }
+
+var mergedObj = { ...obj1, ...obj2 };
+// Object { foo: "baz", x: 42, y: 13 }
+ +

Beachten Sie, dass {{jsxref("Object.assign()")}}} im Gegensatz zur Spread-Syntax Setter auslöst.

+ +

Beachten Sie, dass Sie die Funktion {{jsxref("Object.assign()")}} weder ersetzen noch nachahmen können:

+ +
var obj1 = { foo: 'bar', x: 42 };
+var obj2 = { foo: 'baz', y: 13 };
+const merge = ( ...objects ) => ( { ...objects } );
+
+var mergedObj = merge ( obj1, obj2);
+// Object { 0: { foo: 'bar', x: 42 }, 1: { foo: "baz", y: 13 } }
+
+var mergedObj = merge ( {}, obj1, obj2);
+// Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: "baz", y: 13 } }
+ +

Im obigen Beispiel funktioniert der Spread-Operator nicht wie erwartet: er klappt ein Array von Argumenten aus und liefert ein Array dieser, aufgrund des rest Parameters.

+ +

Nur für iterierbare Objekte

+ +

Spread-Syntax (anders als bei Spread-Eigenschaften) kann nur auf iterierbare Objekte angewendet werden:

+ +
var obj = {'key1': 'value1'};
+var array = [...obj]; // TypeError: obj is not iterable
+
+ +

Spread mit mehreren Werten

+ +

Beachten Sie bei der Verwendung von Spread-Syntax für Funktionsaufrufe die Möglichkeit der Überschreitung der Argumentlängenbegrenzung der JavaScript-Engine. Siehe apply() für weitere Details.

+ +

Rest-Syntax (Parameter)

+ +

Rest-Syntax sieht genauso aus wie die Spread-Syntax und wird für das Destrukturieren von Arrays und Objekten eingesetzt. Rest-Syntax ist sozusagen das Gegenteil von Spread-Syntax: Spread klappt die einzelnen Bestandteile eines Arrays aus, während Rest verschiedene einzelne Elemente zu einem Array zusammenfasst. Siehe Rest-Parameter.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array-initializer')}}{{Spec2('ES2015')}}Definiert in mehreren Abschnitten der Spezifikation: Array Initializer, Argument Lists
{{SpecName('ESDraft', '#sec-array-initializer')}}{{Spec2('ESDraft')}}Keine Änderungen
{{SpecName('ESDraft', '#sec-object-initializer')}}{{Spec2('ESDraft')}}Definiert in Object Initializer
+ +

Browser-Kompatibilität

+ + + +

{{Compat("javascript.operators.spread")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/super/index.html b/files/de/web/javascript/reference/operators/super/index.html new file mode 100644 index 0000000000..44e7cf8b8f --- /dev/null +++ b/files/de/web/javascript/reference/operators/super/index.html @@ -0,0 +1,184 @@ +--- +title: super +slug: Web/JavaScript/Reference/Operators/super +tags: + - Classes + - ECMAScript 2015 + - JavaScript + - Left-hand-side expression + - Operator +translation_of: Web/JavaScript/Reference/Operators/super +--- +
{{jsSidebar("Operators")}}
+ +
Das super Schlüsselwort wird verwendet, um Funktionen in einem Vaterobjekt auszuführen.
+ +
 
+ +
Die super.prop und super[expr] Ausdrücke sind in allen Methodendefinitionen von Klassen und Objekt Literalen verfügbar.
+ +

Syntax

+ +
super([arguments]); // calls the parent constructor.
+super.functionOnParent([arguments]);
+
+ +

Beschreibung

+ +

Wenn ein Konstruktor verwendet wird, muss das super Schlüsselwort verwendet werden, bevor das this Schlüsselwort verwendet werden kann. Mit dem super Schlüsselwort kann man auch Funktionen im Vaterobjekt ausführen.

+ +

Beispiel

+ +

super in Klassen verwenden

+ +

Der Codeabschnitt ist vom classes Beispiel (Live Demo). Hier wird super() aufgerufen, um das duplizieren von Teilen des Konstruktors zu vermeiden, was zwischen Rectangle und Square üblich ist.

+ +
class Rectangle {
+  constructor(height, width) {
+    this.name = 'Rectangle';
+    this.height = height;
+    this.width = width;
+  }
+  sayName() {
+    console.log('Hi, I am a ', this.name + '.');
+  }
+  get area() {
+    return this.height * this.width;
+  }
+  set area(value) {
+    this.height = this.width = Math.sqrt(value);
+  }
+}
+
+class Square extends Rectangle {
+  constructor(length) {
+    this.height; // ReferenceError, super needs to be called first!
+
+    // Here, it calls the parent class' constructor with lengths
+    // provided for the Polygon's width and height
+    super(length, length);
+
+    // Note: In derived classes, super() must be called before you
+    // can use 'this'. Leaving this out will cause a reference error.
+    this.name = 'Square';
+  }
+}
+ +

super Aufruf in statischen Methoden

+ +

super kann auch in statischen Methoden verwendet werden.

+ +
class Rectangle {
+  constructor() {}
+  static logNbSides() {
+    return 'I habe 4 sides';
+  }
+}
+
+class Square extends Rectangle {
+  constructor() {}
+  static logDescription() {
+    return super.logNbSides() + ' wich are all equal';
+  }
+}
+Square.logDescription(); // 'I habe 4 sides wich are all equal'
+
+ +

Das Löschen von Supereigenschaften erzeugt einen Fehler

+ +

Man kann den delete Operator in Verbindung mit super.prop oder super[expr] nicht einsetzen, um Eigenschaften zu löschen, es führt zu einem {{jsxref("ReferenceError")}}.

+ +
class Base {
+  constructor() {}
+  foo() {}
+}
+class Derived extends Base {
+  constructor() {}
+  delete() {
+    delete super.foo;
+  }
+}
+
+new Derived().delete(); // ReferenceError: invalid delete involving 'super'. 
+ +

super.prop kann keine schreibgeschützten Eigenschaften überschreiben

+ +

Wenn eine schreibgeschützte Eigenschaft mit z.B. {{jsxref("Object.defineProperty")}}" erzeugt wird, kann der Wert nicht mit super überschrieben werden.

+ +
class X {
+  constructor() {
+    Object.defineProperty(this, "prop", {
+      configurable: true,
+      writable: false,
+      value: 1
+    });
+  }
+}
+
+class Y extends X {
+  constructor() {
+    super();
+  }
+  foo() {
+    super.prop = 2;  // Der Wert kann nicht überschrieben werden
+  }
+}
+
+var y = new Y();
+x.foo(); // TypeError: "prop" is read-only
+console.log(y.prop); // 1
+
+ +

Nutzen von super.prop in Objektliteralen

+ +

super kann auch in der object initializer / literal Notation verwendet werden. In diesem Beispiel definieren zwei Objekte eine Methode. Im zweiten Beispiel wird mit super die Funktion im ersten Objekt aufgerufen. Das funktioniert mit Hilfe von {{jsxref("Object.setPrototypeOf()")}}. Damit ist es möglich den Prototypen von obj2 auf obj1 zu setzen, damit super method1 in obj1 findet.

+ +
var obj1 = {
+  method1() {
+    console.log("method 1");
+  }
+}
+
+var obj2 = {
+  method2() {
+   super.method1();
+  }
+}
+
+Object.setPrototypeOf(obj2, obj1);
+obj2.method2(); // logs "method 1"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-super-keyword', 'super')}}{{Spec2('ES2015')}}Initiale Definition
{{SpecName('ESDraft', '#sec-super-keyword', 'super')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.super")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/this/index.html b/files/de/web/javascript/reference/operators/this/index.html new file mode 100644 index 0000000000..d9c36c61d6 --- /dev/null +++ b/files/de/web/javascript/reference/operators/this/index.html @@ -0,0 +1,394 @@ +--- +title: this +slug: Web/JavaScript/Reference/Operators/this +tags: + - JavaScript + - Operator + - Primary Expressions + - Reference +translation_of: Web/JavaScript/Reference/Operators/this +--- +
{{jsSidebar("Operators")}}
+ +

Das this Schlüsselwort einer Funktion in JavaScript verhält sich verglichen mit anderen Sprachen ein bisschen anders. Es gibt zudem Unterschiede zwischen dem strict Modus und nicht strict Modus.

+ +

In den meisten Fällen ist der Wert von this der Aufrufer der Funktion. Der Wert kann nicht während der Ausführung zugewiesen werden und kann sich jedes Mal, wenn die Funktion aufgerufen wird unterscheiden. ES5 führte die bind Methode ein, um den Wert vom this einer Funktion zu setzen (egal, wie sie aufgerufen wird). ECMAScript 2015 hat die Pfeilfunktionen implementiert, die kein eigenes this besitzt (this verweist auf das this des umschließenden Ausführungskontextes).

+ +
{{EmbedInteractiveExample("pages/js/expressions-this.html")}}
+ + + +

Syntax

+ +
this
+ +

Globaler Kontext

+ +

Im globalen Ausführungskontext (außerhalb jeder Funktion), referenziert this auf das globale Objekt, egal ob im strict Modus oder nicht.

+ +
// Im Webbrowser ist das window Objekt das globale Objekt:
+console.log(this === window); // true
+
+a = 37;
+console.log(window.a); // 37
+
+this.b = "MDN";
+console.log(window.b);  // "MDN"
+console.log(b);         // "MDN"
+
+ +

Funktionskontext

+ +

Innerhalb einer Funktion hängt der Wert von this davon ab, wie die Funktion aufgerufen wird.

+ +

Einfacher Aufruf

+ +

Weil der folgende Code nicht im strict Modus ist und weil this nicht vom Aufruf gesetzt wird, referenziert this das globale Objekt, welches in einem Browser window ist.

+ +
function f1(){
+  return this;
+}
+
+// In einem Browser:
+f1() === window; // true
+
+// In Node:
+f1() === global; // true
+ +

Im strict Modus bleibt der Wert von this jedoch auf dem Wert, auf den er beim Eingeben des Ausführungskontextes festgelegt wurde. Im folgenden Fall wird dies standardmäßig auf undefined sein:

+ +
function f2(){
+  "use strict"; // see strict mode
+  return this;
+}
+
+f2() === undefined; // true
+
+ +

Wenn this im strict Modus nicht vom Ausführungskontext definiert wird, bleibt dieser undefined.

+ +
Im zweiten Beispiel sollte this undefined sein, weil f2 direkt und nicht als eine Methode oder Eigenschaft eines Objektes (z. B. window.f2()) aufgerufen wird. Diese Funktionalität war noch nicht in allen Browsern implementiert, als der Support für den strict Modus gestartet wurde. Als Folge, gaben diese fälschlicherweise das window Objekt zurück.
+ +

Um den Wert von this von einem in den anderen Kontext zu überführen, benutzt man call oder apply:

+ +
// Ein Objekt kann als erstes Argument beim Aufruf von call oder apply benutzt werden
+// welches an den Aufruf gebunden wird.
+var obj = {a: 'Custom'};
+
+// Dieses Objekt wird auf dem globalen Objekt definiert
+var a = 'Global';
+
+function whatsThis() {
+  return this.a; // Der Wert von this hängt davon ab, wie die Funktion aufgerufen wird.
+}
+
+whatsThis();          // 'Global'
+whatsThis.call(obj);  // 'Custom'
+whatsThis.apply(obj); // 'Custom'
+ +

Wenn eine Funktion das this Schlüsselwort im Körper verwendet, kann dessen Wert an ein Objekt gebunden werden, wenn die call oder apply Methode genutzt wird, die alle Funktion von Function.prototype erben.

+ +
function add(c, d) {
+  return this.a + this.b + c + d;
+}
+
+var o = {a: 1, b: 3};
+
+// Der erste Parameter ist das Objekt, welches als
+// 'this' genutzt wird. Alle weiteren Parameter werden als
+// Argumente für den Funktionsaufruf benutzt.
+add.call(o, 5, 7); //16
+
+// Der erste Parameter ist das Objekt, welches als
+// 'this' genutzt wird. Der zweite Parameter ist ein Array.
+// Dessen Elemente werden als Argumente für den Funktionsaufruf benutzt.
+add.apply(o, [10, 20]); // 34
+ +

Bei call und apply ist zu beachten, dass wenn der für this übergebene Wert kein Objekt ist, wird dieser mit der internen Operation ToObject zu einem Objekt konvertiert. Ist der übergebene Wert ein primitiver Typ wie 7 oder 'foo', wird dieser mit einem zugehörigen Konstruktor zu einem Objekt konvertiert, so dass die primitive Nummer 7 mit new Number(7) und 'foo' mit new String('foo') zu ein Objekt konvertiert wird.

+ +
function bar() {
+  console.log(Object.prototype.toString.call(this));
+}
+
+bar.call(7);     // [object Number]
+bar.call('foo'); // [object String]
+ +

Die bind Methode

+ +

ECMAScript 5 hat Function.prototype.bind eingeführt. Der Aufruf von f.bind(someObject) erstellt eine neue Funktion mit dem selben Körper und Gültigkeitsbereich von f, aber this unterscheidet sich zur original Funktion. In der neuen Funktion ist this permanent mit dem Parameter von bind gebunden, egal wie die Funktion benutzt wird.

+ +
function f(){
+  return this.a;
+}
+
+var g = f.bind({a: 'azerty'});
+console.log(g()); // azerty
+
+var h = g.bind({a: 'yoo'}); // bind funktioniert nur einmal!
+console.log(h()); // azerty
+
+var o = {a: 37, f: f, g: g, h: h};
+console.log(o.f(), o.f(), o.g(), o.h()); // 37, 37, azerty, azerty
+ +

Pfeilfunktionen

+ +

In Pfeilfunktionen, wird this auf das this des umschließenden lexikalischen Kontextes gesetzt. In globalem Code wird es auf das globale Objekt gesetzt.

+ +
var globalObject = this;
+var foo = (() => this);
+console.log(foo() === globalObject); // true
+ +
+

Hinweis: Wenn das this Argument von call, bind oder apply auf einer Pfeilfunktion benutzt werden, wird dieser ignoriert. Man kann dem Aufruf weitere Argumente hinzufügen, das erste Argument (thisArg) sollte aber null sein.

+
+ +
// Aufruf als Methode eines Objektes
+var obj = {foo: foo};
+console.log(obj.foo() === globalObject); // true
+
+// Versuch this mit call zu setzen
+console.log(foo.call(obj) === globalObject); // true
+
+// Versuch this mit bind zu setzen
+foo = foo.bind(obj);
+console.log(foo() === globalObject); // true
+ +

Es ist egal, auf welches this für foo beim erstellen gesetzt wurde (im Beispiel oben das globale Objekt). Das selbe gilt für Pfeilfunktionen, die in einer anderen Funktion erstellt werden: ihr this wird auf das this des äußeren Ausführungskontext gesetzt.

+ +
// Erstellt obj mit einer Methode bar, die eine Funktion zurück gibt,
+// die ihr this zurück gibt. Die zurückgegebene  Funktion wird als
+// Pfeilfunktion erstellt, so dass ihr this permanent an die umschließende
+// Funktion gebunden ist. Der Wert von bar kann im Aufruf festgelegt werden,
+// der wiederum den Wert der zurückgegebenen Funktion festlegt.
+var obj = { bar : function() {
+                    var x = (() => this);
+                    return x;
+                  }
+          };
+
+// Der Aufruf von bar als Methode von obj, setzt das this auf obj,
+// Weist eine Referenz der zurückgegebenen Funktion fn zu.
+var fn = obj.bar();
+
+// Aufruf von fn ohne this zu setzen, wird normalerweise zum
+// golbalen Objekt oder undefined im strict Modus führen.
+console.log(fn() === obj); // true
+
+// Aber achtung, wenn man die Methode von obj referenziert ohne sie aufzurufen
+var fn2 = obj.bar;
+// Wenn dann die Pfeilfunktion aufgerufen wird, ist this gleich dem globalen Objekt,
+// weil es dem this von bar folgt.
+console.log(fn2()() == window); // true
+
+ +

Im oberen Beispiel, gibt die Funktion (nennen wir sie anonyme Funktion A), die zu obj.bar zugewiesen ist, gibt eine andere Funktion (nennen wir sie anonyme Funktion B) zurück, die als Pfeilfunktion erstellt wurde. Als Ergebnis ist das this von B permanent das this von obj.bar (Funktion A) beim Aufruf. Wenn die zurückgegebene Funktion (Funktion B) aufgerufen wird, ist der this Wert immer der, der er initial war. Im obigen Beispielcode ist das this der Funktion B auf das this der Funktion A gesetzt, welches obj ist, so dass es auf obj gesetzt bleibt, während hingegen normalerweise this undefined oder das globale Objekt (oder jede andere Methode wie im vorherigen Beispiel im globalen Ausführungskontext) ist.

+ +

Alseine Objektmethode

+ +

Wenn eine Funktion als Methode eines Objektes aufgerufen wird, hat this eine Referenz auf das Objekt, auf dem die Methode aufgerugen wurde.

+ +

Im folgenden Beispiel ist this innerhalb der Funktion auf o gebunden, wenn o.f() ausgeführt wird.

+ +
var o = {
+  prop: 37,
+  f: function() {
+    return this.prop;
+  }
+};
+
+console.log(o.f()); // 37
+
+ +

Zu beachten ist, dass dieses Verhalten nicht davon beeinflusst ist wie und wo die Funktion definiert ist. Im folgenden Beispiel definierten wir eine Inlinefunktion f als Eigenschaft von o. Man könnte auch einfach die Funktion zuerst definieren und diese dann o.f zuweisen. Dieses hat das selbe Ergebnis zur Folge:

+ +
var o = {prop: 37};
+
+function independent() {
+  return this.prop;
+}
+
+o.f = independent;
+
+console.log(o.f()); // logs 37
+
+ +

Das demonstriert, dass es nur wichtig ist, dass die Funktion als Eigenschaft f des Objektes o aufgerufen wurde.

+ +

Genauso ist die this Bindung nur von der unmittelbaren Mitgliederreferent beeinflusst. Im folgenden Beispiel, wenn die Funktion aufgerufen wird, wird diese als Methode g des Objektes o.b aufgerufen. Während der Ausführung referenziert this in der Funktion o.b. Der Fakt, dass das Objekt selbst eine Eigenschaft von o ist, hat keine Konsequenz, nur die unmittelbare Referenz ist wichtig.

+ +
o.b = {g: independent, prop: 42};
+console.log(o.b.g()); // logs 42
+
+ +

this auf der Objektprototypenkette

+ +

Das selbe gilt für Methoden, die irgendwo auf der Objektprototypenkette definiert werden. Wenn die Methode auf einer Objektprototypenkette ist, referenziert this zu dem Objekte, auf dem die Methode aufgerufen wurde, so als währe die Methode auf dem Objekt.

+ +
var o = {f: function() { return this.a + this.b; }};
+var p = Object.create(o);
+p.a = 1;
+p.b = 4;
+
+console.log(p.f()); // 5
+
+ +

In diesem Beispiel hat das Objekt, welches der Variablen p zugewiesen wird, nicht ihre eigene f Eigenschaft, es erbt sie von seinem Prototyp. Aber es spielt keine Rolle, ob die Suche nach f eventuell eine Eigenschaft/Methode auf dem Objekt o findet; Die Suche begann als eine Referenz zu p.f, so hat this in der Funktion eine Referenz zu dem Objekt p. Weil f als Methode von p aufgerufen wurde, referenziert this p. Dieses ist eine interessante Funktion von JavaScripts's Prototypenvererbung.

+ +

this mit Gettern oder Settern

+ +

Wieder das selbe gilt für für Funktionen, die als Getter oder Setter aufgerufen werden. Eine Funktion, die als Getter oder Setter benutzt wird, hat this zu dem Objekt gebunden, auf dem der Getter oder Setter aufgerufen wurde.

+ +
function sum(){
+  return this.a + this.b + this.c;
+}
+
+var o = {
+  a: 1,
+  b: 2,
+  c: 3,
+  get average(){
+    return (this.a + this.b + this.c) / 3;
+  }
+};
+
+Object.defineProperty(o, 'sum', {
+    get: sum, enumerable:true, configurable:true});
+
+console.log(o.average, o.sum); // logs 2, 6
+
+ +

Als ein Konstruktor

+ +

Wenn eine Funktion als Konstruktor verwendet wird (mit dem new Schlüsselwort), ist this an das neu erstellte Objekt gebunden.

+ +
+

Weil der Standard für einen Konstruktor besagt, dass das Objekt, welches auf this referenziert, zurückgegeben wird, kann stattdessen ein anderes Objekt zurückgegeben werden (wenn der Rückgabewert kein Objekt ist, wird this zurückgegeben).

+
+ +
/*
+ * Constructors work like this:
+ *
+ * function MyConstructor(){
+ *   // Actual function body code goes here.
+ *   // Create properties on |this| as
+ *   // desired by assigning to them.  E.g.,
+ *   this.fum = "nom";
+ *   // et cetera...
+ *
+ *   // If the function has a return statement that
+ *   // returns an object, that object will be the
+ *   // result of the |new| expression.  Otherwise,
+ *   // the result of the expression is the object
+ *   // currently bound to |this|
+ *   // (i.e., the common case most usually seen).
+ * }
+ */
+
+function C(){
+  this.a = 37;
+}
+
+var o = new C();
+console.log(o.a); // logs 37
+
+
+function C2(){
+  this.a = 37;
+  return {a:38};
+}
+
+o = new C2();
+console.log(o.a); // logs 38
+
+ +

Im letzen Beispiel (C2) wird das gebundene this Objekt verworfen, weil während des Erstellens ein anderes Objekt zurückgegeben wird. (Das macht das Statement this.a = 37; zu todem Code. Er ist nicht ganz tod, weil er ausgeführt wird, aber entfernt werden kann ohne einen Effekt zu haben.)

+ +

Als ein DOM Eventhandler

+ +

Wenn eine Funktion als Eventhandler genutzt wird, wird sein this auf das Element, welches das Event feuert, gesetzt (manche Browser folgen dieser Konvention nicht für das dynamische hinzufügen von Methoden nicht über addEventListener).

+ +
// When called as a listener, turns the related element blue
+function bluify(e){
+  // Always true
+  console.log(this === e.currentTarget);
+  // true when currentTarget and target are the same object
+  console.log(this === e.target);
+  this.style.backgroundColor = '#A5D9F3';
+}
+
+// Get a list of every element in the document
+var elements = document.getElementsByTagName('*');
+
+// Add bluify as a click listener so when the
+// element is clicked on, it turns blue
+for(var i=0 ; i<elements.length ; i++){
+  elements[i].addEventListener('click', bluify, false);
+}
+ +

In einem Inlineeventhandler

+ +

Wenn Code in einem inline on-event Handler aufgerufen wird, wird this auf das DOM Element gesetzt, auf dem der Listener aufgerufen wird:

+ +
<button onclick="alert(this.tagName.toLowerCase());">
+  Show this
+</button>
+
+ +

Der obere Alert zeigt button. Zu beachten ist, dass nur bei äußerem Code das this so gesetzt wird:

+ +
<button onclick="alert((function(){return this}()));">
+  Show inner this
+</button>
+
+ +

In diesem Fall ist das this der inneren Funktion nicht gesetzt, so dass das globale/window Objekt zurückgegeben wird (z. B. das Standardobjekt in nicht strict Modus, wo this nicht vom Aufruf gesetzt wird).

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-this-keyword', 'The this keyword')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-this-keyword', 'The this keyword')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-11.1.1', 'The this keyword')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-11.1.1', 'The this keyword')}}{{Spec2('ES3')}} 
{{SpecName('ES1', '#sec-11.1.1', 'The this keyword')}}{{Spec2('ES1')}}Erste Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.this")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/typeof/index.html b/files/de/web/javascript/reference/operators/typeof/index.html new file mode 100644 index 0000000000..9ff39613d8 --- /dev/null +++ b/files/de/web/javascript/reference/operators/typeof/index.html @@ -0,0 +1,259 @@ +--- +title: typeof +slug: Web/JavaScript/Reference/Operators/typeof +tags: + - JavaScript + - Operator + - Unary +translation_of: Web/JavaScript/Reference/Operators/typeof +--- +
{{jsSidebar("Operators")}}
+ +

Der typeof Operator gibt einen String zurück, der den Typ des unausgewerteten Operanden beschreibt.

+ +
{{EmbedInteractiveExample("pages/js/expressions-typeof.html")}}
+ + + +

Syntax

+ +

Dem typeof Operator folgt sein Operand:

+ +
typeof Operand
+ +

Parameter

+ +

Operand ist ein Ausdruck, dessen Typ zurückgegeben werden soll. Dies kann ein Objekt oder ein {{Glossary("Primitiv", "primitive")}} sein.

+ +

Klammern sind optional.

+ +

Beschreibung

+ +

Die folgende Tabelle fasst die möglichen Rückgabewerte von typeof zusammen. Mehr Informationen zu Typen und primitiven Datentypen sind auf der Seite JavaScript Datentypen und Datenstrukturen zu finden.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TypRückgabewert
Undefined"undefined"
Null"object" (see below)
Boole'scher Wert"boolean"
Zahl"number"
Zeichenkette"string"
Symbol (neu in ECMAScript 2015)"symbol"
Host-Objekt (von der JS-Umgebung bereitgestellt)implementierungsabhängig
Funktionsobjekt (implementiert [[Call]] nach ECMA-262)"function"
Alle anderen Objekte"object"
+ +

Beispiele

+ +
// Zahlen
+typeof 37 === 'number';
+typeof 3.14 === 'number';
+typeof(42) === 'number';
+typeof Math.LN2 === 'number';
+typeof Infinity === 'number';
+typeof NaN === 'number'; // obwohl es "Not-A-Number" ist
+typeof Number(1) === 'number'; // niemals so verwenden!
+
+
+// Zeichenketten
+typeof '' === 'string';
+typeof 'bla' === 'string';
+typeof `template literal` === 'string'
+typeof '1' === 'string' // Eine Zahl in einem String ist ein String
+typeof (typeof 1) === 'string'; // typeof gibt immer einen String zurück
+typeof String(1) === 'string'; // String konvertiert alles in einen String
+
+
+// Boole'sche Werte
+typeof true === 'boolean';
+typeof false === 'boolean';
+typeof Boolean(true) === 'boolean'; // niemals so verwenden!
+
+
+// Symbols
+typeof Symbol() === 'symbol'
+typeof Symbol('foo') === 'symbol'
+typeof Symbol.iterator === 'symbol'
+
+
+// Undefined
+typeof undefined === 'undefined';
+typeof declaredBugUndefinedVariable === 'undefined'
+typeof undeclaredVariable === 'undefined';
+
+
+// Objekte
+typeof {a:1} === 'object';
+
+// Array.isArray oder Object.prototype.toString.call verwenden,
+// um reguläre Objekte von Arrays zu unterscheiden
+typeof [1, 2, 4] === 'object';
+
+typeof new Date() === 'object';
+typeof /regex/ === 'object'; // Siehe im Artikel Reguläre Ausdrücke für Historisch bedingte Ergebnisse
+
+
+// Folgende Beispiele sind verwirrend, nicht verwenden!
+typeof new Boolean(true) === 'object';
+typeof new Number(1) === 'object';
+typeof new String("abc") === 'object';
+
+
+// Funktionen
+typeof function(){} === 'function';
+typeof class C {} === 'function';
+typeof Math.sin === 'function';
+
+ +

null

+ +
// This stands since the beginning of JavaScript
+typeof null === 'object';
+
+ +

In der ersten JavaScript-Implementierung bestanden JavaScript-Werte aus einem Typenbezeichner und dem eigentlichen Wert. Der Typenbezeichner für Objekte war 0. null wurde durch den NULL-Zeiger dargestellt (auf den meisten Plattformen 0x00). Infolgedessen besaß null den Typenbezeichner 0, wodurch der seltsame Rückgabewert für typeof entstand. (Quelle)

+ +

Es gab einen Korrekturvorschlag für ECMAScript, der aber abgelehnt wurde. Dadurch wäre typeof null === 'null' gewesen.

+ +

Einsatz des new Operators

+ +
// Alle Konstruktorfunktionen, welche mit dem 'new' Schlüsselwort benutzt werden,
+// haben als ergebnis ein Objekte mit typeof 'object'
+var str = new String('String');
+var num = new Number(100);
+
+typeof str; // It will return 'object'
+typeof num; // It will return 'object'
+
+// Es gibt die Ausnahme mit Objekten des Function-Konstruktors in Javascript
+
+var func = new Function();
+
+typeof func; // gibt 'function' zurück
+
+ +

Notwendigkeit von Klammern in der Syntax

+ +
// Klammern sind sehr hilfreich beim ermitteln von Datentypen.
+var iData = 99;
+
+typeof iData + ' Wisen'; // It will return 'number Wisen'
+typeof (iData + ' Wisen'); // It will return 'string'
+
+ +

Reguläre Ausdrücke

+ +

Aufrufbare reguläre Ausdrücke waren eine nicht standardkonforme Erweiterung in manchen Browsern.

+ +
typeof /s/ === 'function'; // Chrome 1-12, nicht ECMAScript 5.1-konform
+typeof /s/ === 'object';   // Firefox 5+, ECMAScript 5.1-konform
+
+ +

Temporal Dead Zone errors

+ +

Vor ECMAScript 2015 war bei typeof immer garantiert, dass ein String in jeder Lage zurückgegeben wird. Mit dem Hinzufügen von nicht hochgezogenen, blockweisen let and const Variablen, kann es zu ReferenceErrors kommen, wenn die Variablen nicht nicht definiert sind. Das steht im Kontrast zu nicht definierten Variablen, welche mit typeof 'undefined' zurück geben. Blockvariablen haben eine temporäre tote Zone vom Start des Blockes bis zum Durchführen der Initialisierung. In dieser Zeit kann dieser Fehler auftreten.

+ +
typeof undeclaredVariable === 'undefined';
+typeof newLetVariable; let newLetVariable; // ReferenceError
+typeof newConstVariable; const newConstVariable = 'hello'; // ReferenceError
+
+ +

Ausnahmen

+ +

Alle aktuellen Browser zeigen ein nicht standardisiertes hochgezogenes Objekt {{domxref("document.all")}} mit dem Typ Undefined.

+ +
typeof document.all === 'undefined';
+
+ +

Obwohl die Spezifikation benutzerdefinierte Typen-Tags für nicht standardmäßige exotische Objekte zulässt, müssen diese Typ-Tags sich von den vordefinierten unterscheiden. document.all hat das Typ-Tag 'undefined' und wird alsAusnahmeverstoß der Regeln klassifiziert.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-typeof-operator', 'The typeof Operator')}}{{Spec2('ESDraft')}}
{{SpecName('ES6', '#sec-typeof-operator', 'The typeof Operator')}}{{Spec2('ES6')}}
{{SpecName('ES5.1', '#sec-11.4.3', 'The typeof Operator')}}{{Spec2('ES5.1')}}
{{SpecName('ES3', '#sec-11.4.3', 'The typeof Operator')}}{{Spec2('ES3')}}
{{SpecName('ES1', '#sec-11.4.3', 'The typeof Operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.typeof")}}

+ +

IE-Spezifischer Hinweis

+ +

In IE 6, 7 und 8 sind viele Hostobjekte als Objekte statt Funktionen typisiert, zum Beispiel:

+ +
typeof alert === 'object'
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/vergleichsoperatoren/index.html b/files/de/web/javascript/reference/operators/vergleichsoperatoren/index.html new file mode 100644 index 0000000000..2f4baae5a3 --- /dev/null +++ b/files/de/web/javascript/reference/operators/vergleichsoperatoren/index.html @@ -0,0 +1,243 @@ +--- +title: Vergleichsoperatoren +slug: Web/JavaScript/Reference/Operators/Vergleichsoperatoren +tags: + - JavaScript + - Operator + - Reference +translation_of: Web/JavaScript/Reference/Operators +--- +
{{jsSidebar("Operators")}}
+ +

JavaScript kennt sowohl den strikten als auch den Typ konvertierenden Vergleich. Ein strikter Vergleich (z. B. ===) gibt nur true zurück, wenn der gleiche Typ und der gleiche Wert vorhanden sind. Der häufiger verwendete abstrakte Vergleich (z. B. ==) wandelt die Operanden in den gleichen Typen um, bevor sie verglichen werden. Bei relationalen Vergleichsoperatoren (z. B. <=) werden die Operanden vor dem Vergleich zuerst in elementare Datentypen konvertiert und dann in gleiche Typen umgewandelt.

+ +

Strings werden entsprechend der lexikographischen Ordnung, basierend auf den Unicode, verglichen.

+ +
{{EmbedInteractiveExample("pages/js/expressions-comparisonoperators.html")}}
+ + + +

Merkmale von Vergleichen:

+ + + +

Gleichheitsoperatoren

+ +

Gleichheit (==)

+ +

Der Gleichheitsoperator konvertiert die Operanden, wenn sie nicht vom gleichen Typs sind und prüft dann auf strikte Gleichheit. Sind beide Operanden Objekte, vergleicht JavaScript die Referenzen; Referenzen gelten als gleich, wenn sie auf das gleiche Objekt im Speicher zeigen.

+ +

Syntax

+ +
x == y
+
+ +

Beispiele

+ +
1    ==  1     // true
+'1'  ==  1     // true
+1    == '1'    // true
+0    == false  // true
+0    == null   // false
+var object1 = {'key': 'value'}, object2 = {'key': 'value'}
+object1 == object2 // false
+0    == undefined  // false
+null == undefined  // true
+
+ +

Ungleichheit (!=)

+ +

Der Ungleichheitsoperator gibt true zurück, wenn die Operanden nicht gleich sind. Wenn die beiden Operanden nicht vom gleichen Typ sind, versucht JavaScript die Operanden in einen, für den Vergleich passenden Typ, umzuwandeln. Wenn beide Operanden Objekte sind, vergleicht JavaScript die Referenzen; Referenzen sind ungleich, wenn sie auf verschiedene Objekte im Speicher verweisen.

+ +

Syntax

+ +
x != y
+ +

Beispiele

+ +
1 !=   2     // true
+1 !=  "1"    // false
+1 !=  '1'    // false
+1 !=  true   // false
+0 !=  false  // false
+
+ +

Identität / strikte Gleichheit (===)

+ +

Der Identitätsoperator gibt true zurück, wenn die Operanden strikt gleich sind (siehe oben) ohne eine Typkonvertierung

+ +

Syntax

+ +
x === y
+ +

Beispiele

+ +
3 === 3   // true
+3 === '3' // false
+var object1 = {'key': 'value'}, object2 = {'key': 'value'}
+object1 === object2 // false
+
+ +

Nicht identisch / Strikte Ungleichheit (!==)

+ +

Der strikte Ungleichheitsoperator gibt true zurück, wenn die Operanden nicht vom gleichen Typ sind bzw. ungleich sind.

+ +

Syntax

+ +
x !== y
+ +

Beispiele

+ +
3 !== '3' // true
+4 !== 3   // true
+
+ +

Relationale Operatoren

+ +

Jeder dieser Operatoren wird die valueOf() Funktion aufrufen, bevor ein Vergleich durchgeführt wird.

+ +

Größer-als-Operator (>)

+ +

Der Größer-als-Operator gibt true zurück, wenn der linke Operand größer als der rechte Operand ist.

+ +

Syntax

+ +
x > y
+ +

Beispiele

+ +
4 > 3 // true
+
+ +

Größer-oder-gleich-Operator (>=)

+ +

Der Größer-oder-gleich-Operator gibt true zurück, wenn der linke Operand größer als oder gleich dem rechten Operanden ist.

+ +

Syntax

+ +
 x >= y
+ +

Beispiele

+ +
4 >= 3 // true
+3 >= 3 // true
+
+ +

Kleiner-als-Operator (<)

+ +

Der Kleiner-als-Operator gibt true zurück, wenn der linke Operand kleiner als der rechte Operand ist.

+ +

Syntax

+ +
 x < y
+ +

Beispiele

+ +
3 < 4 // true
+
+ +

Kleiner-oder-gleich-Operator (<=)

+ +

Der Kleiner-oder-gleich-Operator gibt true zurück, wenn der linke Operand kleiner oder gleich dem rechten Operanden ist.

+ +

Syntax

+ +
 x <= y
+ +

Beispiele

+ +
3 <= 4 // true
+
+ +

Die Gleichheitsoperatoren anwenden

+ +

Die Standard-Gleichheitsoperatoren (== und !=) benutzen den Abstract Equality Comparison Algorithmus, um zwei Operanden zu vergleichen. Sind die Operanden unterschiedlichen Typs, wird vor dem Vergleich zuerst versucht sie in gleiche Typen umzuwandeln; z.B. wird beim Ausdruck 5 == '5'  das Zeichen auf der rechten Seite in eine Zahl konvertiert.

+ +

Die strikten Gleichheitsoperatoren (=== und !==) benutzen den Strict Equality Comparison Algorithmus und sind dafür gedacht, Operanden des gleichen Typs zu vergleichen. Wenn die Operanden von unterschiedlichen Typen sind, ist das Ergebnis immer false, wie 5 !== '5'.

+ +

Strikte Gleichheitsoperatoren sollten verwendet werden, wenn die Operanden sowohl einen bestimmten Typen als auch Wert haben sollen. Ansonsten benutzt man die abstrakten Gleichheitsoperatoren, die es einem erlauben Operanden unterschiedlicher Typen zu vergleichen.

+ +

Wenn beim Vergleich eine Typkonvertierung vorgenommen wird (z.B. beim nicht-strikten Vergleich), konvertiert JavaScript in die Typen {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}} und {{jsxref("Object")}} und führt den Vergleich dann aus:

+ + + +
Hinweis: String Objekte sind vom Typ Objekte, nicht String! String Objekte werden selten eingesetzt, so dass das folgende Ergebnis überraschend sein kann:
+ +
// true, da beide Operanden vom Typ String sind (string primitives)
+'foo' === 'foo'
+
+var a = new String('foo');
+var b = new String('foo');
+
+// false, da a und b auf verschiedene Objekte zeigen
+a == b
+
+// false, da a und b auf verschiedene Objekte zeigen
+a === b
+
+// true, da a und 'foo' verschiedene Typen sind und das Objekt (a)
+// vor dem Vergleich zum String 'foo' umgewandelt wird
+a == 'foo' 
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initial Definition. Implementiert in JavaScript 1.0
{{SpecName('ES3')}}{{Spec2('ES3')}}Fügt === und !== Operatoren hinzu. Implementiert in JavaScript 1.3
{{SpecName('ES5.1', '#sec-11.8')}}{{Spec2('ES5.1')}}In verschiedenen Kapiteln der Spezifikation definiert: Relational Operators, Equality Operators
{{SpecName('ES6', '#sec-relational-operators')}}{{Spec2('ES6')}}In verschiedenen Kapiteln der Spezifikation definiert: Relational Operators, Equality Operators
{{SpecName('ESDraft', '#sec-relational-operators')}}{{Spec2('ESDraft')}}In verschiedenen Kapiteln der Spezifikation definiert: Relational Operators, Equality Operators
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.comparison")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/void/index.html b/files/de/web/javascript/reference/operators/void/index.html new file mode 100644 index 0000000000..4b61c153bd --- /dev/null +++ b/files/de/web/javascript/reference/operators/void/index.html @@ -0,0 +1,108 @@ +--- +title: void Ausdruck +slug: Web/JavaScript/Reference/Operators/void +tags: + - JavaScript + - Operator + - Unary +translation_of: Web/JavaScript/Reference/Operators/void +--- +
{{jsSidebar("Operators")}}
+ +

Der void Operator evaluiert einen gegebenen Ausdruck und gibt dann {{jsxref("Global_Objects/undefined", "undefined")}} zurück.

+ +
{{EmbedInteractiveExample("pages/js/expressions-voidoperator.html")}}
+ + + +

Syntax

+ +
void Ausdruck
+ +

Beschreibung

+ +

Der Operator erlaubt es, Ausdrücke mit Seiteneffekten an Stellen zu benutzen, an denen ein Ausdruck, der zu {{jsxref("Global_Objects/undefined", "undefined")}} ausgewertet wird, benötigt wird.

+ +

Der void Ausdruck wird oft nur deswegen verwendet, um den primitiven Wert undefined zu erhalten. In diesen Fällen kann auch die globale Variable {{jsxref("Global_Objects/undefined", "undefined")}} benutzt werden (wenn der Wert für diese auf den default-Wert zeigt und nicht geändert wurde)

+ +

Immediately Invoked Function Expressions

+ +

Wenn man eine immediately-invoked function expression verwendet, dann kann void benutzt werden, um das keyword function als Ausdruck und nicht als Deklaration auswerten zu lassen.

+ +
void function iife() {
+    var bar = function () {};
+    var baz = function () {};
+    var foo = function () {
+        bar();
+        baz();
+     };
+    var biz = function () {};
+
+    foo();
+    biz();
+}();
+
+ +

JavaScript URIs

+ +

Wenn ein Browser einer javascript: URI folgt, wird zuerst der Code innerhalb der URI ausgewertet und dann der Inhalt der Seite mit dem Rückgabewert ersetzt. Das ist nicht der Fall, wenn der Rückgabewert {{jsxref("Global_Objects/undefined", "undefined")}} ist. Der void Ausdruck kann dazu benutzt werden in diesen Fällen {{jsxref("Global_Objects/undefined", "undefined")}} zurückzugeben. Zum Beispiel:

+ +
<a href="javascript:void(0);">
+  Click here to do nothing
+</a>
+
+<a href="javascript:void(document.body.style.backgroundColor='green');">
+  Click here for green background
+</a>
+
+ +

Anmerkung: Die Verwendung des javascript: pseudo Protokolls wird gegenüber anderen nicht invasiven Maßnahmen wie Event Handlern nicht empfohlen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1', '#sec-11.4.2', 'The void Operator')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1
{{SpecName('ES3', '#sec-11.4.2', 'The void Operator')}}{{Spec2('ES3')}} 
{{SpecName('ES5.1', '#sec-11.4.2', 'The void Operator')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-void-operator', 'The void Operator')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-void-operator', 'The void Operator')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.void")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/yield/index.html b/files/de/web/javascript/reference/operators/yield/index.html new file mode 100644 index 0000000000..973ec506c4 --- /dev/null +++ b/files/de/web/javascript/reference/operators/yield/index.html @@ -0,0 +1,119 @@ +--- +title: yield +slug: Web/JavaScript/Reference/Operators/yield +tags: + - ECMAScript 2015 + - Generators + - Iterator + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/yield +--- +
{{jsSidebar("Operators")}}
+ +

Das yield Schlüsselwort wird eingesetzt zum Anhalten und Fortsetzen einer Generatorfunktion ({{jsxref("Statements/function*", "function*")}} oder veralteten Generatorfunktion) eingesetzt.

+ +
{{EmbedInteractiveExample("pages/js/expressions-yield.html")}}
+ + + +

Syntax

+ +
[rv] = yield [expression];
+ +
+
expression
+
Definiert den Wert, der von der Generatorfunktion über das Iterator Protokoll zurückgegeben wird. wird dieser weggelassen, wird undefined zurückgegeben.
+
rv
+
+

Gibt den optionalen Wert zurück, der der next() Methode des Generators übergeben wird, damit dieser weiter verarbeitet werden kann.

+
+
+ +

Beschreibung

+ +

Das yield Schlüsselwort hält die Ausführung der Generatorfunktion an und gibt den Wert des Ausdrucks nach dem yield Schlüsselwort an den Aufrufer des Generators zurück. Es kann als die generatorbasierte Version des return Schlüsselwortes gesehen werden.

+ +

Das yield Schlüsselwort gibt ein IteratorResult Objekt mit zwei Eigenschaften, value und done, zurück. Die value Eigenschaft ist das Ergebnis des ausgewerteten yield Ausdrucks und done ist false, was gedeutet, dass der Generator noch nicht fertig ist.

+ +

Solange ein yield Ausdruck pausiert, wird die Codeausführung des Generators pausiert, bis die next() Methode des Generators aufgerufen wird. Mit jedem Aufruf der Generator next() Methode läuft der Generator weiter, bis einer der folgenden Punkte eintritt:

+ + + +

Wenn ein optionaler Wert der next() Methode des Generators übergeben wird, wird der Wert es der aktuelle Rückgabewert der yield Operation sein.

+ +

Durch den Generatorcodepfad, seinem yield Operator und der Möglichkeit einen neuen Startwert zu spezifizierten, indem dieser an {{jsxref("Generator.prototype.next()")}} übergeben wird, sind Generatoren sehr leistungsstark und kontrollierbar.

+ +

Beispiele

+ +

Der folgende Code ist die Deklaration einer Beispielgeneratorfunktion.

+ +
function* countAppleSales () {
+  var saleList = [3, 7, 5];
+  for (var i = 0; i < saleList.length; i++) {
+    yield saleList[i];
+  }
+}
+ +

Wenn eine Generatorfunktion definiert ist, kann dieser benutzt werden, um einen Iterator, wie gezeigt, zu erstellen.

+ +
var appleStore = countAppleSales(); // Generator { }
+console.log(appleStore.next()); // { value: 3, done: false }
+console.log(appleStore.next()); // { value: 7, done: false }
+console.log(appleStore.next()); // { value: 5, done: false }
+console.log(appleStore.next()); // { value: undefined, done: true }
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#', 'Yield')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#', 'Yield')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.yield")}}

+ +

Firefox spezifische Hinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/yield_star_/index.html b/files/de/web/javascript/reference/operators/yield_star_/index.html new file mode 100644 index 0000000000..e0229f4c15 --- /dev/null +++ b/files/de/web/javascript/reference/operators/yield_star_/index.html @@ -0,0 +1,164 @@ +--- +title: yield* +slug: Web/JavaScript/Reference/Operators/yield* +tags: + - ECMAScript 2015 + - Generators + - Iterable + - Iterator + - JavaScript + - Operator + - Reference +translation_of: Web/JavaScript/Reference/Operators/yield* +--- +
{{jsSidebar("Operators")}}
+ +

Der yield* Ausdruck wird eingesetzt um an einen anderen {{jsxref("Statements/function*", "Generator")}} oder iterierbares Objekt zu delegieren.

+ +
{{EmbedInteractiveExample("pages/js/expressions-yieldasterisk.html")}}
+ + + +

Syntax

+ +
 yield* [[expression]];
+ +
+
expression
+
Der Ausdruck, der ein Iterierbares Objekt zurückgibt.
+
+ +

Beschreibung

+ +

Das yield* Ausdrucksliteral iteriert über den Operanden und gibt jeden zurückgegebenen Wert zurück.

+ +

Der Wert von yield* Ausdrücken selbst ist der Wert der vom Iterator zurückgegeben wird, wenn der geschlossen wird (z. B., wenn done true ist).

+ +

Beispiele

+ +

Zu einem anderen Generator delegieren

+ +

Im folgenden Code werden Werte von g1() und g2() beim Aufruf von next() zurückgegeben.

+ +
function* g1() {
+  yield 2;
+  yield 3;
+  yield 4;
+}
+
+function* g2() {
+  yield 1;
+  yield* g1();
+  yield 5;
+}
+
+var iterator = g2();
+
+console.log(iterator.next()); // {value: 1, done: false}
+console.log(iterator.next()); // {value: 2, done: false}
+console.log(iterator.next()); // {value: 3, done: false}
+console.log(iterator.next()); // {value: 4, done: false}
+console.log(iterator.next()); // {value: 5, done: false}
+console.log(iterator.next()); // {value: undefined, done: true}
+
+ +

Andere Iterable Objekte

+ +

Neben Generatorobjekten kann yield* auch andere Iterable Objekte wie Arrays, Strings oder Arguments-Objekte zurückgeben.

+ +
function* g3() {
+  yield* [1, 2];
+  yield* '34';
+  yield* Array.from(arguments);
+}
+
+var iterator = g3(5, 6);
+
+console.log(iterator.next()); // {value: 1, done: false}
+console.log(iterator.next()); // {value: 2, done: false}
+console.log(iterator.next()); // {value: "3", done: false}
+console.log(iterator.next()); // {value: "4", done: false}
+console.log(iterator.next()); // {value: 5, done: false}
+console.log(iterator.next()); // {value: 6, done: false}
+console.log(iterator.next()); // {value: undefined, done: true}
+
+ +

Der Wert des yield* Ausdrucks selbst

+ +

yield* ist ein Ausdruck, kein Statement, weshalb es zu einem Wert ausgewertet wird.

+ +
function* g4() {
+  yield* [1, 2, 3];
+  return 'foo';
+}
+
+var result;
+
+function* g5() {
+  result = yield* g4();
+}
+
+var iterator = g5();
+
+console.log(iterator.next()); // {value: 1, done: false}
+console.log(iterator.next()); // {value: 2, done: false}
+console.log(iterator.next()); // {value: 3, done: false}
+console.log(iterator.next()); // {value: undefined, done: true},
+                              // g4() returned {value: 'foo', done: true} at this point
+
+console.log(result);          // "foo"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#', 'Yield')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#', 'Yield')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.yield_star")}}

+ +

Firefox spezifische Hinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/operators/zuweisungsoperator/index.html b/files/de/web/javascript/reference/operators/zuweisungsoperator/index.html new file mode 100644 index 0000000000..f0ab62f255 --- /dev/null +++ b/files/de/web/javascript/reference/operators/zuweisungsoperator/index.html @@ -0,0 +1,412 @@ +--- +title: Zuweisungsoperator +slug: Web/JavaScript/Reference/Operators/Zuweisungsoperator +tags: + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators#Assignment_operators +--- +
{{jsSidebar("Operators")}}
+ +

Ein Zuweisungsoperator weist dem linken Operanten einen Wert auf Basis des rechten Operanten zu.

+ +
{{EmbedInteractiveExample("pages/js/expressions-assignment.html")}}
+ + + +

Überblick

+ +

Der Basiszuweisungsoperator ist das Gleich (=), welches den Wert des rechten Operanten dem linken Operanten zuweist. So wird bei x = y der Wert von y x zugewiesen. Die anderen Zuweisungsoperatoren sind Kurzformen für Standardoperationen, wie es in den folgenden Definition und Beispielen gezeigt wird.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameKurzformoperatorBedeutung
Zuweisungx = yx = y
Additionszuweisungx += yx = x + y
Subtraktionszuweisungx -= yx = x - y
Multiplikationszuweisungx *= yx = x * y
Divisionszuweisungx /= yx = x / y
Restzuweisungx %= yx = x % y
Potenzierungszuweisungx **= yx = x ** y
Links verschiebende Zuweisungx <<= yx = x << y
Rechts verschiebende Zuweisungx >>= yx = x >> y
Vorzeichenlose rechts verschiebende Zuweisungx >>>= yx = x >>> y
Bitweise AND Zuweisungx &= yx = x & y
Bitweise XOR Zuweisungx ^= yx = x ^ y
Bitweise OR Zuweisungx |= yx = x | y
+ +

Zuweisung

+ +

Einfacher Zuweisungsoperator, welcher den Wert zu einer Variablen zuweist. Der Zuweisungsoperator gibt den zugewiesenen Wert zurück. Eine Verkettung der Zuweisungsoperatoren ist möglich, um einen Wert mehreren Variablen zuzuweisen. Sie in den Beispielen.

+ +

Syntax

+ +
Operator: x = y
+
+ +

Beispiele

+ +
// Folgende Variablen sind vorausgesetzt
+//  x = 5
+//  y = 10
+//  z = 25
+
+x = y     // x ist 10
+x = y = z // x, y und z sind alle 25
+
+ +

Additionszuweisung

+ +

Der Additionszuweisungsoperator addiert den Wert des rechten Operanten zu einer Variablen und weist das Ergebnis der Variablen zu. Die Typen der Operanten entscheiden über das Verhalten des Additionszuweisungsoperator. Addition oder Konkatination sind möglich. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Additionsoperator", "#Addition", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x += y
+Bedeutung: x  = x + y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  foo = 'foo'
+//  bar = 5
+//  baz = true
+
+
+// Number + Number -> Addition
+bar += 2 // 7
+
+// Boolean + Number -> Addition
+baz += 1 // 2
+
+// Boolean + Boolean -> Addition
+baz += false // 1
+
+// Number + String -> Konkationation
+bar += 'foo' // "5foo"
+
+// String + Boolean -> Konkatination
+foo += false // "foofalse"
+
+// String + String -> Konkationation
+foo += 'bar' // "foobar"
+
+ +

Subtraktionszuweisung

+ +

Der Subtraktionszuweisungsoperator subtahiert den Wert des rechten Operanten von einer Variablen und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Subraktionsoperator", "#Subtraction", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x -= y
+Bedeutung: x  = x - y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  bar = 5
+
+bar -= 2     // 3
+bar -= 'foo' // NaN
+
+ +

Multiplikationszuweisung

+ +

Der Multiplikationszuweisungsoperator multipliziert den Wert des rechten Operanten zu einer Variablen und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Multiplikationsoperator", "#Multiplication", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x *= y
+Bedeutung: x  = x * y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  bar = 5
+
+bar *= 2     // 10
+bar *= 'foo' // NaN
+
+ +

Divisionszuweisung

+ +

Der Divisionszuweisungsoperator dividiert eine Variable durch den rechten Operanten zu und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Divisionsoperator", "#Division", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x /= y
+Bedeutung: x  = x / y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  bar = 5
+
+bar /= 2     // 2.5
+bar /= 'foo' // NaN
+bar /= 0     // Infinity
+
+ +

Restzuweisung

+ +

Der Restzuweisungsoperator dividiert einer Variable durch den rechten Operanten und weist den Rest des Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Restoperator", "#Remainder", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x %= y
+Bedeutung: x  = x % y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  bar = 5
+
+bar %= 2     // 1
+bar %= 'foo' // NaN
+bar %= 0     // NaN
+
+ +

Potenzierungszuweisung

+ +

Der Potenzierungszuweisungsoperator potenziert einer Variable mit den rechten Operanten und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Arithmetic_Operators", "Exponentialoperator", "#Exponentiation", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x **= y
+Bedeutung: x  = x ** y
+
+ +

Beispiele

+ +
// Die folgenden Variablen werden vorausgesetzt
+//  bar = 5
+
+bar **= 2     // 25
+bar **= 'foo' // NaN
+ + + +

Der links verschiebende Zuweisungsoperator verschiebt um die Anzahl Bits im rechten Operanten in der Variablen und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "links verschiebenden Operator", "#Left_shift", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x <<= y
+Bedeutung: x   = x << y
+
+ +

Beispiele

+ +
var bar = 5; //  (00000000000000000000000000000101)
+bar <<= 2; // 20 (00000000000000000000000000010100)
+
+ +

Rechts verschiebende Zuweisung

+ +

Der rechts verschiebende Zuweisungsoperator verschiebt um die Anzahl Bits im rechten Operanten in der Variablen und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "rechts verschiebenden Operator", "#Right_shift", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x >>= y
+Bedeutung: x   = x >> y
+
+ +

Beispiele

+ +
var bar = 5; //   (00000000000000000000000000000101)
+bar >>= 2;   // 1 (00000000000000000000000000000001)
+
+var bar -5; //    (-00000000000000000000000000000101)
+bar >>= 2;  // -2 (-00000000000000000000000000000010)
+
+ +

Vorzeichenlose rechts verschiebende Zuweisung

+ +

Der vorzeichenlose rechts verschiebende Zuweisungsoperator verschiebt um die Anzahl Bits im rechten Operanten in der Variablen und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "vorzeichenlose rechts verschiebenden Operator", "#Unsigned_right_shift", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x >>>= y
+Bedeutung: x    = x >>> y
+
+ +

Beispiele

+ +
var bar = 5; //   (00000000000000000000000000000101)
+bar >>>= 2;  // 1 (00000000000000000000000000000001)
+
+var bar = -5; // (-00000000000000000000000000000101)
+bar >>>= 2; // 1073741822 (00111111111111111111111111111110)
+ +

Bitweise UND Zuweisung

+ +

Der bitweise UND Zuweisungsoperator nutzt die Bitrepräsentation beider Operanten, führt eine bitweises UND Operation aus und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "bitweisen UND Operator", "#Bitwise_AND", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x &= y
+Bedeutung: x  = x & y
+
+ +

Beispiele

+ +
var bar = 5;
+// 5:     00000000000000000000000000000101
+// 2:     00000000000000000000000000000010
+bar &= 2; // 0
+
+ +

Bitweise XOR Zuweisung

+ +

Der bitweise XOR Zuweisungsoperator nutzt die Bitrepräsentation beider Operanten, führt eine bitweises XOR Operation aus und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "bitweisen XOR Operator", "#Bitwise_XOR", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x ^= y
+Bedeutung: x  = x ^ y
+
+ +

Beispiele

+ +
var bar = 5;
+bar ^= 2; // 7
+// 5: 00000000000000000000000000000101
+// 2: 00000000000000000000000000000010
+// -----------------------------------
+// 7: 00000000000000000000000000000111
+
+ +

Bitweise ODER Zuweisung

+ +

Der bitweise ODER Zuweisungsoperator nutzt die Bitrepräsentation beider Operanten, führt eine bitweises ODER Operation aus und weist das Ergebnis der Variablen zu. Siehe beim {{jsxref("Operators/Bitwise_Operators", "bitweisen ODER Operator", "#Bitwise_OR", 1)}} für mehr Details nach.

+ +

Syntax

+ +
Operator:  x |= y
+Bedeutung: x  = x | y
+
+ +

Beispiele

+ +
var bar = 5;
+bar |= 2; // 7
+// 5: 00000000000000000000000000000101
+// 2: 00000000000000000000000000000010
+// -----------------------------------
+// 7: 00000000000000000000000000000111
+
+ +

Beispiele

+ +

Linker Operant mit anderem Zuweisungsoperator

+ +

In ungewöhnlichen Situationen kann ein Zuweisungsoperator (z. B. x += y) nicht identisch mit der äquivalenten Zuweisung (hier x = x + y). Wenn der linke Operant einer Zuweisung selbst eine Zuweisung enthält, wird der linke Operant nur einem ausgewertet. Zum Beispiel:

+ +
a[i++] += 5         // i wird einmal ausgewertet
+a[i++] = a[i++] + 5 // i wird zweimal ausgewertet
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-assignment-operators', 'Assignment operators')}}{{Spec2('ESDraft')}} 
{{SpecName('ES2015', '#sec-assignment-operators', 'Assignment operators')}}{{Spec2('ES2015')}} 
{{SpecName('ES5.1', '#sec-11.13', 'Assignment operators')}}{{Spec2('ES5.1')}} 
{{SpecName('ES1', '#sec-11.13', 'Assignment operators')}}{{Spec2('ES1')}}Initiale Definition.
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.assignment")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/async_function/index.html b/files/de/web/javascript/reference/statements/async_function/index.html new file mode 100644 index 0000000000..1179b3f924 --- /dev/null +++ b/files/de/web/javascript/reference/statements/async_function/index.html @@ -0,0 +1,223 @@ +--- +title: async function +slug: Web/JavaScript/Reference/Statements/async_function +tags: + - Example + - JavaScript +translation_of: Web/JavaScript/Reference/Statements/async_function +--- +
+
{{jsSidebar("Statements")}}
+ +

 Die async function Deklaration definiert eine asynchrone Funktion, die ein {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}} Objekt zurück gibt. Asynchrone Funktionen laufen über den Event Loop außerhalb des üblichen Kontrollflusses, und geben als Ergebnis ein implizites {{jsxref("Promise")}} Objekt zurück. Die Syntax und der Aufbau des Codes bei einer asynchronen Funktion ähnelt allerdings der den standardmässigen synchronen Funktionen.

+ +
+

Eine async function kann auch durch den {{jsxref("Operators/async_function", "async function expression", "", 1)}} Ausdruck definiert werden.

+
+
+ +
{{EmbedInteractiveExample("pages/js/statement-async.html", "taller")}}
+ + + +

Syntax

+ +
async function name([param[, param[, ... param]]]) {
+   statements
+}
+
+ +

Die Parameter

+ +
+
name
+
Der Name der Funktion.
+
+ +
+
param
+
Der Name eines Arguments, welches der Funktion übergeben wird.
+
+ +
+
statements
+
Die Ausdrücke, aus denen der Funktionskörper besteht.
+
+ +

Der zurückgegebene Wert

+ +

Ein Promise Objekt. Das Promise wird entweder mit dem zurück gelieferten Wert der asnychronen Funktion eingehalten (Engl: "resolved"), oder mit einem unbehandelten Fehler innerhalb der asynchronen Funktion verworfen (Engl: "rejected").

+ +

Beschreibung

+ +

Eine async Funktion darf einen {{jsxref("Operators/await", "await")}} Ausdruck enthalten, der die Ausführung der asynchronen Funktion anhält. Die Funktion wartet auf die Entscheidung des übergebenen Promise, setzt dann die Ausführung der asynchronen Funktionen fort und wird als eingehaltener (Engl: "resolved") Wert ausgewertet.

+ +

Das Schlüsselwort await gilt nur innerhalb der async Funktionen. Die Verwendung außerhalb solcher Funktion wirft einen SyntaxError auf.

+ +
+

Das Ziel der async/await Funktionen ist zweifach. Erstens vereinfachen sie die Anwendung von Promises im Rahmen eines synchronen Verfahrens. Zweitens ermöglichen sie die kollektive Verarbeitung einer Gruppe von Promises. Genau wie die Promises dem Verhalten von callbacks ("Rückruffunktionen") ähneln, so ähnelt die async/await Methode der Zusammensetzung von Generatoren und Promises.

+
+ +

Beispiele

+ +

Einfaches Beispiel

+ +
var resolveAfter2Seconds = function() {
+  //nach 2 Sek. einlösen
+  console.log("langsames Promise beginnt");
+  return new Promise(resolve => {
+    setTimeout(function() {
+      resolve(20); //"20" taucht als der zurückgegebene Wert der Fkn. auf
+      console.log("langsames Promise fertig");
+    }, 2000);
+  });
+};
+
+var resolveAfter1Second = function() {
+  //nach 1 Sek. einlösen
+  console.log("schnelles Promise beginnt");
+  return new Promise(resolve => {
+    setTimeout(function() {
+      resolve(10); //"10" taucht als der zurückgegebene Wert der Fkn. auf
+      console.log("schnelles Promise fertig");
+    }, 1000);
+  });
+};
+
+var sequentialStart = async function() {
+  console.log('==NACHEINANDER STARTEN==');
+  // Falls der dem await Operator folgende Ausdruck kein Promise ist,
+  // wird jener Ausdruck in ein eingehaltenes ("resolved") Promise umgewandelt
+
+  // 1. die Ausführung erfolgt fast sofort
+  const slow = await resolveAfter2Seconds();
+  console.log(slow); // 2. das hier startet 2 Sekunden nach 1.
+
+  const fast = await resolveAfter1Second();
+  console.log(fast); // 3. das hier startet 3 Sekunden nach 1.
+}
+
+var concurrentStart = async function() {
+  console.log('==ZEITGLEICH ANFANGEN mit await==');
+  const slow = resolveAfter2Seconds(); // startet den Timer sofort
+  const fast = resolveAfter1Second(); // startet den Timer sofort
+
+  // 1. die Ausführung erfolgt fast sofort
+  console.log(await slow); // 2. das hier startet 2 Sekunden nach 1.
+  console.log(await fast); // 3. das hier startet 2 Sekunden nach 1., also sofort nach 2., da "fast" bereits aufgelöst ist
+}
+
+var stillConcurrent = function() {
+  console.log('==ZEITGLEICH ANFANGEN mit Promise.all==');
+  Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then((messages) => {
+    console.log(messages[0]); // "slow"
+    console.log(messages[1]); // "fast"
+  });
+}
+
+var parallel = function() {
+  console.log('==PARALLEL mit Promise.then==');
+  resolveAfter2Seconds().then((message)=>console.log(message));
+  resolveAfter1Second().then((message)=>console.log(message));
+}
+
+sequentialStart(); // loggt "slow" nach 2 Sek., dann "fast" nach einer weiteren Sek.
+
+// wartet, bis das obige Verfahren abschließt
+setTimeout(concurrentStart, 4000); // loggt nach 2 Sek. erst "slow", dann "fast"
+
+// wieder warten
+setTimeout(stillConcurrent, 7000); // genau wie concurrentStart
+
+// wieder warten
+setTimeout(parallel, 10000); // echt parallel: loggt "fast" nach 1 Sek., dann "slow" nach einer weiteren Sek.
+
+ +

await und Parallelität

+ +

In der Funktion sequentialStart wird die Ausführung wegen dem ersten await für 2 Sekunden angehalten, und dann nochmal eine weitere Sekunde wegen dem zweiten await. Der zweite Timer wird erst erzeugt, sobald der erste durch ist, daher wird der Code nach 3 Sekunden durchgelaufen sein.

+ +

In der Funktion concurrentStart werden beide Timer erzeugt und dann darauf gewartet (await). Die beiden Timer laufen zur selben Zeit, was bedeutet, dass der Code in 2 Sekunden statt 3 durchläuft, also wie der langsamste Timer. Trotzdem laufen die await Aufrufe immer noch nacheinander, was bedeutet, dass das zweite await auf das Ende des ersten Timers warten wird. In diesem Fall wird das Ergebnis des schnellsten Timers erst nach dem des langsamsten Timers verarbeitet.

+ +

Wenn du wirklich zwei oder mehr Jobs gleichzeitig, also parallel, ausführen willst, musst du await Promise.all([job1(), job2()]) wie in der parallel Funktion gezeigt verwenden.

+ +
+

Merke: await mit Promise#then nicht verwechseln

+ +

Bei sequentialStart wird die Programmausführung auf 2 Sek. aufgehalten wegen des ersten await, dann wieder auf 1 Sek. wegen des zweiten await. Die zweite Stoppuhr wird erst nach Ablauf der ersten Stoppuhr erstellt.

+ +

Bei concurrentStart werden beide Stoppuhren gleichzeitig erstellt, dann in await versetzt. Obwohl beide Uhren nebeneinander laufen, laufen die await Abrufe serienweise. Das bedeutet, dass die zweite await Anweisung auf Ablauf der ersten wartet. Die Laufzeit dieses Abschnitts lautet daher 2--nicht 3--Sekunden, weil das langsamere Verfahren 2 Sek. braucht. Das Gleiche ereignet sich bei stillConcurrent, welcher Abschnitt die Promise.all Methode verwendet.

+ +

Wenn man auf mehrfache Promises parallel warten (await) will, muss man Promise#then verwenden, gerade wie die parallel Funktion am Ende dieses Beispiels.

+
+ +

Umschreiben einer Promise-Kette mittels einer async Funktion

+ +

Eine API die ein {{jsxref("Promise")}} zurückgibt resultiert in einer vielteiligen Promise-Kette. Man beachte den folgenden Code:

+ +
function getProcessedData(url) {
+  return downloadData(url) // returns a promise
+    .catch(e => {
+      return downloadFallbackData(url)  // returns a promise
+    })
+    .then(v => {
+      return processDataInWorker(v); // returns a promise
+    });
+}
+
+ +

das kann mit einer async Funktion folgendermaßen umgeschrieben werden:

+ +
async function getProcessedData(url) {
+  let v;
+  try {
+    v = await downloadData(url);
+  } catch(e) {
+    v = await downloadFallbackData(url);
+  }
+  return processDataInWorker(v);
+}
+
+ +

Im obigen Beispiel ist zu beachten, dass es keinen await Ausdruck auf dem return Ausdruck gibt, weil der Rückgabewert einer async function implizit im {{jsxref("Promise.resolve")}} eingeschlossen ist.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}{{Spec2('ESDraft')}}Initial definition in ES2017.
{{SpecName('ES8', '#sec-async-function-definitions', 'async function')}}{{Spec2('ES8')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.statements.async_function")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/block/index.html b/files/de/web/javascript/reference/statements/block/index.html new file mode 100644 index 0000000000..788082aeae --- /dev/null +++ b/files/de/web/javascript/reference/statements/block/index.html @@ -0,0 +1,115 @@ +--- +title: block +slug: Web/JavaScript/Reference/Statements/block +tags: + - Anweisung + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/block +--- +

{{jsSidebar("Statements")}}

+ +

Eine Blockanweisung (oder in anderen Sprachen Verbundanweisung) wird genutzt, um Anweisungen zu gruppieren. Ein Block wird durch ein Paar geschweifte Klammern abgegrenzt. Optional kann ihm ein {{jsxref("Statements/label", "Label")}} zugewiesen werden.

+ +

{{EmbedInteractiveExample("pages/js/statement-block.html", "taller")}}

+ +

Syntax

+ +
[label:] {
+  anweisung_1;
+  anweisung_2;
+  ...
+  anweisung_n;
+}
+
+ +
+
anweisung1, anweisung2, anweisungN
+
Anweisungen, die zu einer Blockanweisung gruppiert werden.
+
label
+
Ein optionales {{jsxref("Statements/label", "Label")}}, entweder nur als Kennzeichnung oder als Referenz für die Verwendung in einer {{jsxref("Statements/break", "break")}}-Anweisung.
+
+ +

Beschreibung

+ +

Eine Blockanweisung wird meistens in Verbindung mit Komtrollfluss-Anweisungen (z. B. {{jsxref("Statements/if...else", "if…else")}}, {{jsxref("Statements/for", "for")}}, {{jsxref("Statements/while", "while")}}) genutzt. Zum Beispiel:

+ +
while (x < 10) {
+  x++;
+}
+
+ +

Zu beachten ist, dass eine Blockanweisung nicht mit einem Semikolon endet.

+ +

In anderen Sprachen wird eine Blockanweisung auch oftmals Verbundanweisung genannt. Dieser erlaubt den Einsatz mehrerer Anweisungen an Stellen, an denen JavaScript nur eine Anweisung erwartet. Das Kombinieren von Anweisungen in Blöcken ist in Javascript gängige Praxis. Mit einer {{jsxref("Statements/empty", "empty")}}-Anweisung ist auch der gegenteilige Fall umsetzbar (keine Anweisung an Stellen, an denen Anweisungen erwartet werden).

+ +

Variablen in Blockgültigkeitsbereichen

+ +

Wichtig: Variablen, die mit {{jsxref("Statements/var", "var")}} deklariert werden, haben keinen Blockgültigkeitsbereich. Sie sind an den Gültigkeitsbereich der umschließenden Funktion oder des Skripts gebunden. Variablen sind folglich auch außerhalb des Blocks verfügbar, in dem sie deklariert wurden. Beispiel:

+ +
var x = 1;
+{
+  var x = 2;
+}
+console.log(x); // Ausgabe: 2
+
+ +

Die Ausgabe zeigt 2, weil die Anweisungen var x außerhalb des Blocks und innerhalb des Blocks den gleichen Gültigkeitsbereich haben. In anderen Sprachen würde dieser Code 1 ausgeben.

+ +

Um die Gültigkeit auf den Block zu begrenzen, muss {{jsxref("Statements/let", "let")}} eingesetzt werden:

+ +
let x = 1;
+{
+  let x = 2; // dieses x ist nur in diesem Block sichtbar
+}
+console.log(x); // Ausgabe: 1
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-block', 'Block statement')}}{{Spec2('ESDraft')}}
{{SpecName('ES6', '#sec-block', 'Block statement')}}{{Spec2('ES6')}}
{{SpecName('ES5.1', '#sec-12.1', 'Block statement')}}{{Spec2('ES5.1')}}
{{SpecName('ES3', '#sec-12.1', 'Block statement')}}{{Spec2('ES3')}}
{{SpecName('ES1', '#sec-12.1', 'Block statement')}}{{Spec2('ES1')}}Erste Definition. Implementiert in JavaScript 1.0.
+ +

Browserkompatibilität

+ +

{{Compat("javascript.statements.block")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/break/index.html b/files/de/web/javascript/reference/statements/break/index.html new file mode 100644 index 0000000000..350ba91400 --- /dev/null +++ b/files/de/web/javascript/reference/statements/break/index.html @@ -0,0 +1,164 @@ +--- +title: break +slug: Web/JavaScript/Reference/Statements/break +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/break +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Die break Anweisung beendet die aktuelle Schleife, {{jsxref("Statements/switch", "switch")}}-Anweisung oder Anweisungen die mit einem {{jsxref("Statements/label", "label")}} versehen sind und sorgt dafür, dass das Programm mit der Anweisung weiterläuft, die auf die beendete Anweisung folgt.

+ +

Syntax

+ +
break [Label];
+ +
+
Label
+
Optional. Ein Bezeichner, der mit einem {{jsxref("Statements/label", "Label")}} einer Anweisung in Verbindung gebracht werden kann. Es wird vorausgesetzt, dass die Anweisung, die beendet wird, eine Schleife oder ein {{jsxref("Statements/switch", "switch")}}-Statement ist.
+
+ +

Beschreibung

+ +

Die break Anweisung enthält ein optionales {{jsxref("Statements/label", "Label")}}, mit dem es möglich ist, eine mit einem {{jsxref("Statements/label", "Label")}} versehene Anweisung zu beenden. Dabei muss sich die break Anweisung innerhalb der Anweisung, die mit einem {{jsxref("Statements/label", "Label")}} versehen ist, befinden. Die Anweisung, die mit einem Label versehen ist, kann jede {{jsxref("Statements/block", "Block")}}-Anweisung sein und muss nicht zwingend eine Schleife sein.

+ +

Beispiele

+ +

Die folgende Funktion nutzt eine break Anweisung die die {{jsxref("Statements/while", "while")}} Schleife beendet, wenn i gleich 3 ist. Danach gibt die Funktion 3 * x zurück.

+ +
function testBreak(x) {
+   var i = 0;
+
+   while (i < 6) {
+      if (i == 3) {
+         break;
+      }
+      i += 1;
+   }
+   return i * x;
+}
+ +

Der folgende Quelltext benutzt die break Anweisungen mit einem {{jsxref("Statements/label", "Label")}} auf einem {{jsxref("Statements/block", "Block")}}. Weil inner_block innerhalb vom {{jsxref("Statements/block", "Block")}} mit dem outer_block {{jsxref("Statements/label", "Label")}} ist, funktioniert break fehlerfrei.

+ +
outer_block:{
+  inner_block:{
+    console.log ('1');
+    break outer_block;      // breaks out of both inner_block and outer_block
+    console.log (':-(');    // skipped
+  }
+
+  console.log ('2');        // skipped
+}
+
+ +

Der folgende Quelltext benutzt eine break Anweisung, die nicht auf ein {{jsxref("Statements/label", "Label")}} verweist, in dem sich das break befindet. Dieses ist nicht möglich, weshalb ein {{jsxref("Global_Objects/SyntaxError", "SyntaxError")}} erzeugt wird.

+ +
block_1:{
+  console.log ('1');
+  break block_2;            // SyntaxError: Label nicht gefunden
+}
+
+block_2:{
+  console.log ('2');
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. nur die Version ohne Labels hinzugefügt.
{{SpecName('ES3')}}{{Spec2('ES3')}}Version mit Labels hinzugefügt.
{{SpecName('ES5.1', '#sec-12.8', 'Break statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-break-statement', 'Break statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-break-statement', 'Break statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/class/index.html b/files/de/web/javascript/reference/statements/class/index.html new file mode 100644 index 0000000000..48fda4c9bb --- /dev/null +++ b/files/de/web/javascript/reference/statements/class/index.html @@ -0,0 +1,192 @@ +--- +title: Klasse +slug: Web/JavaScript/Reference/Statements/class +tags: + - Deklaration + - ECMAScript 2015 + - JavaScript + - Klasse + - Klassen + - Ref + - Statement +translation_of: Web/JavaScript/Reference/Statements/class +--- +
{{jsSidebar("Statements")}}
+ +
Die Klassendeklaration erstellt eine neue Klasse mit einem Namen unter Verwendung von prototypen Vererbung.
+ +
 
+ +
+

Sie können eine Klasse auch mit Hilfe einer {{jsxref("Operators/class", "class expression", "", 1)}} definieren. Unglücklicherweise ist es mit diesen class-Ausdrücken nicht möglich eine existierende Klasse erneut zu deklarieren. Dieses führt zu einem TypeError.

+
+ +

Syntax

+ +
class name [extends] {
+  // class body
+}
+
+ +

Beschreibung

+ +

Genau wie mit class expressions, wird der body der Klassendeklaration im strict mode ausgeführt. Die constructor Eigenschaft ist optional.

+ +

Klassendeklarationen sind nicht {{Glossary("Hoisting", "hoisted")}} (im Gegensatz zu function declarations).

+ +

Beispiele

+ +

Eine einfache Klassendeklaration

+ +

Im folgenden Beispiel definieren wir zuerst eine Klasse mit dem Namen Polygon. Diese wird danach erweitert, um eine Klasse mit dem Namen Square zu erstellen. Beachten Sie, dass die Anweisung super() nur im Konstruktor verwendet werden kann und vor dem this Schlüsselwort verwendet werden kann.

+ +
class Polygon {
+  constructor(height, width) {
+    this.name = 'Polygon';
+    this.height = height;
+    this.width = width;
+  }
+}
+
+class Square extends Polygon {
+  constructor(length) {
+    super(length, length);
+    this.name = 'Square';
+  }
+}
+ +
+

Versuch eine Klasse zweimal zu deklarieren

+ +

Neudeklarieren einer Klasse unter Einsatz von Klassendeklarationen führt zu einem TypeError.

+ +
class Foo {};
+class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
+
+ +

Der gleiche Fehler tritt auch auf, wenn eine Klasse zuvor mit einem class-Ausdruck definiert wurde.

+ +
var Foo = class {};
+class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
+
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ES2015')}}Erste Definition
{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(42.0)}}{{CompatGeckoDesktop(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Array subclassing{{CompatChrome(43.0)}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Allowed in sloppy mode{{CompatChrome(49.0)}}    
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatChrome(42.0)}}{{CompatGeckoMobile(45)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(42.0)}}
Array subclassing{{CompatNo}}{{CompatChrome(43.0)}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(43.0)}}
Allowed in sloppy mode{{CompatNo}}{{CompatChrome(49.0)}}    {{CompatChrome(49.0)}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/const/index.html b/files/de/web/javascript/reference/statements/const/index.html new file mode 100644 index 0000000000..2bd5b39928 --- /dev/null +++ b/files/de/web/javascript/reference/statements/const/index.html @@ -0,0 +1,170 @@ +--- +title: const +slug: Web/JavaScript/Reference/Statements/const +tags: + - ECMAScript 2015 + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/const +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Zusammenfassung

+ +

Die const-Deklaration erstellt eine Konstante. Wie bei der Deklaration einer Variablen mit {{jsxref("Statements/let", "let")}} ist der Gültigkeitsbereich auf den lokalen Block begrenzt. Der Wert einer Konstanten kann nicht verändert werden durch Zuweisung oder Neudeklaration.

+ +

{{EmbedInteractiveExample("pages/js/statement-const.html")}}

+ +

Syntax

+ +
const name1 = wert1 [, name2 = wert2 [, ... [, nameN = wertN]]];
+ +
+
nameN
+
Name der Konstanten. Dieser kann jeder gültige {{Glossary("Identifier", "Bezeichner")}} sein.
+
wertN
+
Wert der Konstanten. Dieser kann jeder gültige {{Glossary("Expression", "Ausdruck")}} sein, einschließlich einer Funktion.
+
+ +

Beschreibung

+ +

Die const-Deklaration erstellt eine Konstante, die entweder global sichtbar oder nur lokal in dem {{jsxref("Statements/Block", "Anweisungsblock")}}, in der sie deklariert wird, sichtbar ist.

+ +

Die Konstante muss bei ihrer Definition mit einem Wert belegt werden. Eine spätere Zuweisung ist logischerweise nicht möglich, denn Sinn einer Konstanten ist, dass nach ihrer Definition keine Änderungen mehr vorgenommen werden können.

+ +

Die const-Deklaration erzeugt eine nicht veränderbare Referenz auf einen Wert. Dies bedeutet aber nicht, dass dieser Wert an sich unveränderlich ist, sondern nur, dass der Konstanten kein anderer Wert zugewiesen werden kann. Ist der Wert einer Konstanten zum Beispiel ein Objekt vom Typ {{jsxref("Global_Objects/Array", "Array")}}, können dessen Einträge durchaus verändert werden. Die Beispiele unten verdeutlichen dies.

+ +

Eine Konstante kann nicht den gleichen Namen einer Funktion oder einer Variablen im gleichen Gültigkeitsbereich führen. Der Versuch, den Namen einer Konstanten nochmals zu verwenden, führt ebenso zu einem Fehler wie der Versuch, den Namen eines bestehenden Objektes für eine Konstante zu verwenden.

+ +

Für const gelten die gleichen Regel hinsichtlich der toten Zone wie für {{jsxref("Statements/let", "let")}}. Auch Konstanten sind erst nach ihrer Deklaration verfügbar, nicht jedoch zwischen dem Beginn des Blocks und der Deklaration.
+ Dies ist ein Unterschied zur Variablendeklaration mit {{jsxref("Statements/var", "var")}}. Mit var deklarierte Variablen sind in der gesamten Funktion verfügbar, in der sie deklariert wurden, selbst falls die Variablendeklaration die letzte Anweisung der Funktion war.

+ +

Beispiele

+ +

Die nachfolgenden Beispiele bauen aufeinander auf und sollten funktionell als ein Skript betrachtet werden. Sie sind lediglich in mehrere Absätze aufgeteilt, um die Teilaspekte der Konstantenbenutzung abzugrenzen.

+ +

Grundlagen

+ +

Konstanten müssen bei Deklaration mit einem Wert belegt werden und sind danach nicht mehr änderbar.

+ +
// Definiert my_fav als eine Konstante und weist ihr den Wert 7 zu.
+const MY_FAV = 7;
+
+// Ein Versuch, der Konstanten einen anderen Wert zuzuweisen, ergibt
+// einen Fehler.
+MY_FAV = 20;
+
+// Schreibt 7 auf die Konsole.
+console.log("my favorite number is: " + MY_FAV);
+
+// Der Versuch, eine existierende Konstante neu zu definieren,
+// erzeugt einen Fehler
+const MY_FAV = 20;
+
+// Der Name my_fav ist für die obige Konstante reserviert, weshalb
+// dieses ebenfalls einen Fehler erzeugt.
+var MY_FAV = 20;
+// Auch dies ergibt einen Fehler.
+let MY_FAV = 20;
+
+// Konstanten benötigten einen Initialwert, weshalb hier ein SyntaxError
+// erzeugt wird.
+const FOO;
+
+// Konstanten sind erst nach ihrer Deklaration verfügbar,
+// anders als var-Variablen.
+console.log("konstante = " + KONST); // Fehler, KONST existiert noch nicht
+console.log("variable = " + VAR); // VAR hingegen schon
+const KONST = "23";
+var VAR = "32";
+console.log("konstante = " + KONST); // KONST existiert erst jetzt
+
+
+ +

Der Block als Gültigkeitsbereich

+ +

Konstanten sind nur innerhalb des Blocks aus geschweiften Klammern sichtbar, in dem sie deklariert wurden.

+ +
// MY_FAV, in vorigem Beispiel erstellt, ist immer noch 7
+if (MY_FAV === 7) {
+    // Innerhalb dieses if-Blocks kann eine neue Konstante MY_FAV
+    // erzeugt werden, die nur für diesen Block gültig ist.
+    const MY_FAV = 20;
+
+    // MY_FAV ist nun 20
+    console.log("my favorite number is " + MY_FAV);
+
+    // var-Variablen werden hingegen immer in den übergeordneten
+    // Funktions- oder den globalen Kontext eingebettet, weshalb
+    // dies zu einer Kollision mit der globalen Konstante MY_FAV
+    // aus vorigem Beispiel führen wird:
+    var MY_FAV = 20;
+}
+// MY_FAV ist immer noch 7, denn wir haben den if-Block verlassen.
+console.log("my favorite number is " + MY_FAV);
+
+
+ +

Die Konstante und der Wert einer Konstante

+ +

Obwohl Konstanten selbst nicht geändert werden können, kann sich der Wert des Objektes, auf das die Konstante verweist, ändern.

+ +
// Konstanten können auch komplexe Objekte sein.
+const MY_OBJECT = {"key": "value"};
+
+// Ein Versuch, der Konstanten ein anderes Objekt zuzuweisen, ergibt
+// einen Fehler.
+MY_OBJECT = {"OTHER_KEY": "value"};
+
+// Das Objekt selber hingegen ist nicht vor Veränderungen geschützt.
+// Die folgende Anweisung wird ohne Probleme ausgeführt.
+MY_OBJECT.key = "otherValue";
+
+// Das Gleiche gilt für Felder:
+const MY_ARRAY = [];
+// Es ist möglich, neue Einträge an das Feld anzufügen.
+MY_ARRAY.push("A"); // ["A"]
+// Jedoch führt der Versuch, der Konstanten ein anderes Feld
+// zuzuweisen, zu einem Fehler.
+MY_ARRAY = ["B"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}{{Spec2('ES2015')}} +

Erste Definition.

+
{{SpecName('ESDraft', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

{{Compat("javascript.statements.const")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/continue/index.html b/files/de/web/javascript/reference/statements/continue/index.html new file mode 100644 index 0000000000..b6b00242de --- /dev/null +++ b/files/de/web/javascript/reference/statements/continue/index.html @@ -0,0 +1,165 @@ +--- +title: continue +slug: Web/JavaScript/Reference/Statements/continue +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/continue +--- +
{{jsSidebar("Statements")}}
+ +

Die continue Anweisung beendet die Ausführung von Anweisungen im aktuellen Durchlauf der aktuellen oder benannten Schleife und setzt die Schleife mit der nächsten Iteration fort.

+ +
{{EmbedInteractiveExample("pages/js/statement-continue.html")}}
+ + + +

Syntax

+ +
continue [label];
+ +
+
label
+
Bezeichner mit dem Namen der verbundenen Anweisung.
+
+ +

Beschreibung

+ +

Im Gegensatz zur {{jsxref("Statements/break", "break")}} Anweisung, beendet continue die Ausführung der Schleife nicht komplett sondern:

+ + + + + +

Die continue Anweisung kann optional den Namen beinhalten und erlaubt dem Programm zum nächsten Durchlauf einer benannten Schleife zu springen anstatt der aktuellen. In diesem Fall muss die continue Anweisung innerhalb der benannten Anweisung liegen.

+ +

Beispiele

+ +

Verwendung von continue mit while

+ +

Das folgende Beispiel zeigt eine {{jsxref("Statements/while", "while")}} Schleife mit einer continue Anweisung, die ausgeführt wird, wenn i den Wert 3 hat. Daher nimmt n die Werte 1, 3, 7, und 12 an.

+ +
var i = 0;
+var n = 0;
+
+while (i < 5) {
+  i++;
+
+  if (i === 3) {
+    continue;
+  }
+
+  n += i;
+}
+
+ +

Verwendung von continue mit einem Bezeichner

+ +

Im folgenden Beispiel enthält die checkiandj benannte Anweisung eine benannte Anweisung namens checkj. Wenn continue erreicht wird, wird das Programm am Beginn der checkj Anweisung fortgesetzt. Jedes mal wenn continue erreicht wird, beginnt checkj einen neuen Durchlauf, bis die Bedingung false zurückgibt. Wenn false zurückgegeben wird, wird der Rest der checkiandj Anweisung ausgeführt.

+ +

Falls continue einen Bezeichner checkiandj hätte, dann würde das Programm am Beginn der checkiandj Anweisung fortgesetzt.

+ +

Siehe auch {{jsxref("Statements/label", "label")}}.

+ +
var i = 0;
+var j = 8;
+
+checkiandj: while (i < 4) {
+  console.log('i: ' + i);
+  i += 1;
+
+  checkj: while (j > 4) {
+    console.log('j: '+ j);
+    j -= 1;
+
+    if ((j % 2) == 0)
+      continue checkj;
+    console.log(j + ' is odd.');
+  }
+  console.log('i = ' + i);
+  console.log('j = ' + j);
+}
+
+ +

Ausgabe:

+ +
i: 0
+
+// start checkj
+j: 8
+7 is odd.
+j: 7
+j: 6
+5 is odd.
+j: 5
+// end checkj
+
+i = 1
+j = 4
+
+i: 1
+i = 2
+j = 4
+
+i: 2
+i = 3
+j = 4
+
+i: 3
+i = 4
+j = 4
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatuskommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Unbenannte Version.
{{SpecName('ES3')}}{{Spec2('ES3')}}Benannte Version hinzugefügt.
{{SpecName('ES5.1', '#sec-12.7', 'Continue statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-continue-statement', 'Continue statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-continue-statement', 'Continue statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.continue")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/debugger/index.html b/files/de/web/javascript/reference/statements/debugger/index.html new file mode 100644 index 0000000000..0beef2ded9 --- /dev/null +++ b/files/de/web/javascript/reference/statements/debugger/index.html @@ -0,0 +1,52 @@ +--- +title: debugger +slug: Web/JavaScript/Reference/Statements/debugger +translation_of: Web/JavaScript/Reference/Statements/debugger +--- +
{{jsSidebar("Statements")}}
+ +

Die Anweisung debugger ruft eine nicht näher bestimmte Debugging-Funktionalität des Interpreters auf. Naheliegend, jedoch nicht vorgeschrieben, ist das Pausieren des Programmablaufs und Öffnen des Debuggers an dieser Stelle.
+ Stellt der Interpreter keine Debugging-Möglichkeiten zur Verfügung, hat die Anweisung keine Auswirkungen.

+ +

Syntax

+ +
debugger;
+ +

Beispiel

+ +

Dieses Beispiel zeigt eine Funktion, die mit der debugger-Anweisung beginnt.

+ +
function potentiallyBuggyCode() {
+    debugger;
+    // do potentially buggy stuff to examine, step through, etc.
+}
+ +

Bei Aufruf der Funktion wird das Skript pausiert und der Debugger öffnet sich, um den weiteren Ablauf gezielt kontrollieren zu können.

+ +

Paused at a debugger statement.

+ +

Spezifikation

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-debugger-statement', 'debugger')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.debugger")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/default/index.html b/files/de/web/javascript/reference/statements/default/index.html new file mode 100644 index 0000000000..3d078df932 --- /dev/null +++ b/files/de/web/javascript/reference/statements/default/index.html @@ -0,0 +1,120 @@ +--- +title: default +slug: Web/JavaScript/Reference/Statements/default +tags: + - JavaScript + - Keyword +translation_of: Web/JavaScript/Reference/Statements/switch +--- +
{{jsSidebar("Statements")}}
+ +

Das default Schlüsselwort kann in JavaScript in zwei Situationen verwendet werden: Innerhalb eines {{jsxref("Statements/switch", "switch")}} Statements, oder mit einem {{jsxref("Statements/export", "export")}} Statement.

+ +
{{EmbedInteractiveExample("pages/js/statement-default.html")}}
+ + + +

Syntax

+ +

Innerhalb eines {{jsxref("Statements/switch", "switch")}} Statements:

+ +
switch (expression) {
+  case value1:
+    // Das Statement wird ausgeführt, wenn das Ergebnis der expression mit value1 übereinstimmt
+    [break;]
+  default:
+    // Das Statement wird ausgeführt, wenn keiner Werte mit dem Wert der expression übereinstimmt
+    [break;]
+}
+ +

Mit dem {{jsxref("Statements/export", "export")}} Statement:

+ +
export default nameN 
+ +

Beschreibung

+ +

Für mehr Informationen, siehe die

+ + + +

Beispiele

+ +

Verwenden von default in switch Statements

+ +

Wenn im folgenden Beispiel expr den Wert "Oranges" oder "Apples" hat, wird das Programm die jeweiligen Werte abgleichen und das dazugehörige Statement ausführen. Das default Schlüsselwort hilft, alle übrigen (nicht speziell behandelten) Fälle zu behandeln.

+ +
switch (expr) {
+  case 'Oranges':
+    console.log('Oranges are $0.59 a pound.');
+    break;
+  case 'Apples':
+    console.log('Apples are $0.32 a pound.');
+    break;
+  default:
+    console.log('Sorry, we are out of ' + expr + '.');
+}
+ +

Verwenden von default mit export

+ +

Wenn Sie einen einzelnen Wert oder einen "fallback" Wert für ein Modul brauchen, können Sie einen default export verwenden:

+ +
// module "my-module.js"
+let cube = function cube(x) {
+  return x * x * x;
+}
+export default cube;
+ +

Dann kann der default export in einem anderen Skript direkt importiert werden:

+ +
// module "my-module.js"
+import myFunction from 'my-module';
+console.log(cube(3)); // 27
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-switch-statement', 'switch statement')}}{{Spec2('ES6')}} 
{{SpecName('ES6', '#sec-exports', 'Exports')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}{{Spec2('ESDraft')}} 
{{SpecName('ESDraft', '#sec-exports', 'Exports')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.default")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/do...while/index.html b/files/de/web/javascript/reference/statements/do...while/index.html new file mode 100644 index 0000000000..80dbf27192 --- /dev/null +++ b/files/de/web/javascript/reference/statements/do...while/index.html @@ -0,0 +1,132 @@ +--- +title: do...while +slug: Web/JavaScript/Reference/Statements/do...while +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/do...while +--- +
{{jsSidebar("Statements")}}
+ +

Das do...while statement erstellt eine Schleife, die einen bestimmten Ausdruck ausführt, bis die zu überprüfende Aussage falsch wird. Die Aussage wird überprüft, nachdem der Ausdruck ausgeführt wurde, sodass der Ausdruck mindenstens einmal ausgeführt wird.

+ +

Syntax

+ +
do
+   statement
+while (condition);
+
+ +
+
statement
+
Ein Ausdruck, welcher mindestens einmal ausgeführt wird und jedes Mal, wenn die Aussage wahr ist, wieder ausgeführt wird. Um mehrere Ausdrücke in der Schleife auszuführen,  nutzen Sie eine {{jsxref("Statements/block", "block")}} - Aussage ({ ... }) um diese Aussagen zu gruppieren.
+
+ +
+
condition
+
Eine Aussage, die nach jedem Durchgang durch die Schleife überprüft wird. Falls condition wahr ist, wird das statement wieder ausgeführt. Wenn condition falsch wird, geht das Programm zu dem Ausdruck nach dem do...while über.
+
+ +

Beispiele

+ +

do...while benutzen

+ +

 In dem folgendem Beispiel wird die do...while - Schleife mindestens einmal ausgeführt und wird wieder ausgeführt, bis i nicht länger weniger als 5 ist.

+ +
var i = 0;
+do {
+   i += 1;
+   console.log(i);
+} while (i < 5);
+
+ +

Spezialisierungen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezialisierungStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2
{{SpecName('ES5.1', '#sec-12.6.1', 'do-while statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-do-while-statement', 'do-while statement')}}{{Spec2('ES6')}}Trailing ; ist jetzt optional.
{{SpecName('ESDraft', '#sec-do-while-statement', 'do-while statement')}}{{Spec2('ESDraft')}} 
+ +

Browser compatibility

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basisunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}6{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basisunterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/empty/index.html b/files/de/web/javascript/reference/statements/empty/index.html new file mode 100644 index 0000000000..d31a88d0bb --- /dev/null +++ b/files/de/web/javascript/reference/statements/empty/index.html @@ -0,0 +1,147 @@ +--- +title: empty +slug: Web/JavaScript/Reference/Statements/Empty +tags: + - Anweisung + - JavaScript +translation_of: Web/JavaScript/Reference/Statements/Empty +--- +
{{jsSidebar("Statements")}}
+ +

Eine leere Anweisung dient der Angabe keiner Anweisung, obwohl die JavaScript Syntax eine erwarten würde.

+ +

Syntax

+ +
;
+
+ +

Beschreibung

+ +

Die leere Anweisung ist ein Semikolon (;) und zeigt an, dass keine Anweisung ausgeführt wird, selbst wenn die JavaScript Syntax eine erfordert. Das gegenteilige Verhalten, bei dem man mehrere Anweisungen haben will, aber JavaScript nur eine einzelne erlaubt, ist die Verwendung einer Blockanweisung; sie kombiniert mehrere Anweisungen in einer einzelnen.

+ +

Beispiele

+ +

Die leere Anweisung wird manchmal in Schleifenanweisungen verwendet. Siehe dazu das folgende Beispiel mit einem leeren Schleifenkörper:

+ +
var arr = [1, 2, 3];
+
+// Alle Arraywerte auf 0 setzen
+for (i = 0; i < arr.length; arr[i++] = 0) /* leere Anweisung */ ;
+
+console.log(arr)
+// [0, 0, 0]
+
+ +

Hinweis: Es ist gute Praxis, die beabsichtigte Verwendung der leeren Anweisung durch einen Kommentar zu erklären, da der Unterschied zu einem normalen Semikolon nicht offensichtlich ist. In dem folgenden Beispiel ist die Verwendung möglicherweise nicht beabsichtigt:

+ +
if (condition);       // Achtung, der "if" Zweig tut nichts!
+   killTheUniverse()  // Daher wird dies hier immer ausgeführt!!!
+
+ +

Ein anderes Beispiel: Eine if...else Anweisung ohne geschweifte Klammern ({}). Falls three wahr ist, geschieht nichts, four trifft nicht zu und auch die launchRocket() Funktion im else Zweig wird nicht ausgeführt.

+ +
if (one)
+  doOne();
+else if (two)
+  doTwo();
+else if (three)
+  ; // nothing here
+else if (four)
+  doFour();
+else
+  launchRocket();
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-empty-statement', 'Empty statement')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-empty-statement', 'Empty statement')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-12.3', 'Empty statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-12.3', 'Empty statement')}}{{Spec2('ES3')}} 
{{SpecName('ES1', '#sec-12.3', 'Empty statement')}}{{Spec2('ES1')}}Initiale Definition.
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/export/index.html b/files/de/web/javascript/reference/statements/export/index.html new file mode 100644 index 0000000000..ffeec6b683 --- /dev/null +++ b/files/de/web/javascript/reference/statements/export/index.html @@ -0,0 +1,126 @@ +--- +title: export +slug: Web/JavaScript/Reference/Statements/export +tags: + - ECMAScript 2015 + - JavaScript + - Modules + - Statement + - export +translation_of: Web/JavaScript/Reference/Statements/export +--- +
{{jsSidebar("Statements")}}
+ +

Das export-Statement wird verwendet, um Funktionen und Objekte aus einer gegebenen Datei (oder Modul) zu exportieren.

+ +

Syntax

+ +
export { name1, name2, …, nameN };
+export { variable1 as name1, variable2 as name2, …, nameN };
+export let name1, name2, …, nameN; // oder: var
+export let name1 = …, name2 = …, …, nameN; // oder: var, const
+
+export default expression;
+export default function (…) { … } // oder: class, function*
+export default function name1(…) { … } // oder: class, function*
+export { name1 as default, … };
+
+export * from …;
+export { name1, name2, …, nameN } from …;
+export { import1 as name1, import2 as name2, …, nameN } from …;
+ +
+
nameN
+
Bezeichner der exportiert werden soll (damit er in einem anderen Script via import importiert werden kann).
+
+ +

Beschreibung

+ +

Es gibt zwei verschiedene Arten von Exports, die jeweils der oben angegebene Syntax entsprechen:

+ + + +

Benannte Exports sind nützlich um mehrere Werte zu exportieren. Beim Import kann man den selben Namen verwenden um auf den entsprechenden Wert zu verweisen.

+ +

Bezüglich Default-Export: es kann nur einen einzigen Default-Export pro Modul geben. Ein Default-Export kann eine Funktion sein, eine Klasse, ein Objekt oder irgendetwas anderes. Da dieser Wert am einfachsten importiert werden kann wird er als der "Haupt-Export" des Moduls angesehen.

+ +

Beispiele

+ +

Benannte Exports

+ +

Im Modul können wir den folgenden Code verwenden:

+ +
// Modul "my-module.js"
+function cube(x) {
+  return x * x * x;
+}
+const foo = Math.PI + Math.SQRT2;
+export { cube, foo };
+
+ +

Daraufhin könnten wir nun in einem anderen Script (cf. import) wie folgt vorgehen:

+ +
import { cube, foo } from 'my-module';
+console.log(cube(3)); // 27
+console.log(foo);    // 4.555806215962888
+ +

Standard-Export

+ +

Wenn wir nur einen einzelnen Wert exportieren wollen, oder einen Fallback-Wert für unser Modul zur Verfügung haben möchten, können wir einen Default-Export verwenden:

+ +
// Modul "my-module.js"
+export default function cube(x) {
+  return x * x * x;
+}
+
+ +

In einem anderen Script kann dieser Default-Export dann unkompliziert importiert werden:

+ +
import myFunction from 'my-module';
+console.log(myFunction(3)); // 27
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-exports', 'Exports')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-exports', 'Exports')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.export")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/for...in/index.html b/files/de/web/javascript/reference/statements/for...in/index.html new file mode 100644 index 0000000000..228f21927c --- /dev/null +++ b/files/de/web/javascript/reference/statements/for...in/index.html @@ -0,0 +1,227 @@ +--- +title: for...in +slug: Web/JavaScript/Reference/Statements/for...in +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/for...in +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Die Schleife for…in durchläuft alle aufzählbaren Eigenschaften eines Objekts (mit Ausnahme jener, deren Name ein Symbol ist) in willkürlicher Reihenfolge und führt für jede ihren Anweisungsblock aus.

+ +

Syntax

+ +
for (variable in object) {... }
+ +
+
variable
+
Bei jedem Schleifendurchlauf wird der Name der aktuellen Eigenschaft variable zugewiesen.
+
object
+
Das Objekt, dessen Eigenschaften durchlaufen werden sollen.
+
+ +

Beschreibung

+ +

Die Schleife for…in durchläuft alle eigenen und geerbten Eigenschaften, die als aufzählbar gekennzeichnet sind und deren Name kein Symbol ist, in einer nicht festgelegten Reihenfolge.

+ +

Aufzählbare Eigenschaften

+ +

Die Eigenschaften eines Javascript-Objekts können anhand ihres internen Statusfeldes enumerable als aufzählbar oder nicht aufzählbar gekennzeichnet werden.

+ +

Insbesondere erben manche eingebaute Objekte wie Array und Object nicht-aufzählbare Eigenschaften von Object.prototype and String.prototype, unter anderem die Methoden {{jsxref("String.indexOf")}} und {{jsxref("Object.toString")}}.

+ +

Nicht-aufzählbare Eigenschaften werden von for…in ignoriert.

+ +

Reihenfolge

+ +

Obwohl die Reihenfolge bei Ausführung innerhalb desselben Interpreters als festgelegt erscheinen kann, darf von diesem Umstand nicht ausgegangen werden. Andere Versionen und insbesondere andere Javascript-Interpreter werden die Eigenschaften in einer anderen Reihenfolge durchlaufen.
+ Die Gründe sind in der Beschreibung des Operators {{jsxref("Operators/delete", "delete")}} näher erklärt.

+ +

Gelöschte, hinzugefügte oder modifizierte Eigenschaften

+ +

Änderungen der Eigenschaften eines Objekts, während dieses Objekt von for…in durchlaufen wird, haben nachfolgende Auswirkungen:

+ + + +

Im Allgemeinen ist es ratsam, innerhalb einer Schleife keine Änderungen an den Eigenschaften des durchlaufenden Objekts vorzunehmen. Eine Ausnahme bildet lediglich die derzeit bearbeitete Eigenschaft.
+ Es gibt keine Garantie, dass eine hinzugefügte Eigenschaft von der Schleife noch aufgerufen wird, ob eine geänderte (außer der aktuellen) Eigenschaft vor oder nach der Änderung aufgerufen wird oder ob eine gelöschte Eigenschaft aufgerufen wird, bevor sie gelöscht wird.

+ +

Array und for…in

+ +
+

Hinweis: for…in sollte nicht für den Durchlauf eines {{jsxref("Array", "Arrays")}} verwendet werden, bei dem die Indexreihenfolge wichtig ist.

+
+ +

Anders als vielleicht von vielen anderen Programmiersprachen gewohnt sind bei Javascript die Indizes eines Feldes normale Objekt-Eigenschaften mit Ganzzahlen als Namen.

+ +

Wie oben bereits erwähnt, ist nicht sichergestellt, dass for…in Eigenschaften eines Objektes in einer bestimmten Reihenfolge durchläuft. Dies gilt, da sie normale Eigenschaften sind, auch für die Feldindizes. Zudem durchläuft for…in auch alle anderen (aufzählbaren) Eigenschaften, einschließlich derer mit nicht ganzzahligen Namen sowie geerbte.

+ +

for…in ist daher nicht geeignet, um die Felder eines Objekts vom Typ Array von 0 bis Array.length der Reihenfolge nach zu durchlaufen.
+ Zu diesem Zweck kann entweder auf eine {{jsxref("Statements/for", "for-Schleife")}} mit numerischem Zähler, die Array-eigene Methode {{jsxref("Array.prototype.forEach()", "forEach()")}} oder eine {{jsxref("Statements/for...of", "for...of-Schleife")}} verwendet werden.

+ +

Durchlauf nur über eigene Eigenschaften

+ +

Sollen nur Eigenschaften berücksichtigen möchten, die direkt mit dem Objekt verknüpft und nicht von dessen Prototypen geerbt sind, bietet sich {{jsxref("Object.getOwnPropertyNames", "getOwnPropertyNames()")}} an. Die Zugehörigkeit auf einer bestimmten Eigenschaft kann mit {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} geprüft werden.
+ Alternativ können eingebaute Prototypen mit einer Prüfmethode erweitert werden, sofern sichergestellt ist, dass es nicht zu einer Beeinflussung von externem Code kommt.

+ +

Beispiele

+ +

Die folgende Funktion erwartet ein Objekt als Argument. Es werden dann alle aufzählbaren Eigenschaften des Objekts durchlaufen und der Name der Eigenschaft mit dem entsprechenden Wert ausgegeben.

+ +
var obj = {a:1, b:2, c:3};
+
+for (var prop in obj) {
+  console.log("o." + prop + " = " + obj[prop]);
+}
+
+// Ausgabe:
+// "o.a = 1"
+// "o.b = 2"
+// "o.c = 3"
+ +

Die folgende Funktion verdeutlicht die Verwendung von {{jsxref("Object.hasOwnProperty", "hasOwnProperty()")}}: die geerbten Eigenschaften werden nicht angezeigt.

+ +
var triangle = {a:1, b:2, c:3};
+
+function ColoredTriangle() {
+  this.color = "red";
+}
+
+ColoredTriangle.prototype = triangle;
+
+var obj = new ColoredTriangle();
+
+for (var prop in obj) {
+  if( obj.hasOwnProperty( prop ) ) {
+    console.log("o." + prop + " = " + obj[prop]);
+  }
+}
+
+// Ausgabe:
+// "o.color = red"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...in statement')}}{{Spec2('ESDraft')}}
{{SpecName('ES6', '#sec-for-in-and-for-of-statements', 'for...in statement')}}{{Spec2('ES6')}}
{{SpecName('ES5.1', '#sec-12.6.4', 'for...in statement')}}{{Spec2('ES5.1')}}
{{SpecName('ES3', '#sec-12.6.4', 'for...in statement')}}{{Spec2('ES3')}}
{{SpecName('ES1', '#sec-12.6.3', 'for...in statement')}}{{Spec2('ES1')}}Initiale Definition.
+ +

Browserkompatibilität

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}6{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Kompatibilität: Initialisierender Ausdruck

+ +

Vor SpiderMonkey 40 {{geckoRelease(40)}}, war es möglich einen initialisierenden Ausdruck (i=0) in einer for…in-Schleife zu benutzen:

+ +
var obj = {a:1, b:2, c:3};
+for(var i=0 in obj) {
+  console.log(obj[i]);
+}
+// 1
+// 2
+// 3
+
+ +

Dieses nicht standardisierte Verhalten wird ab der Version 40 ignoriert und führt im strict-Modus zu einem {{jsxref("SyntaxError")}}, "for-in loop head declarations may not have initializers" (siehe {{bug(748550)}} und {{bug(1164741)}}).

+ +

Andere Umgebungen wie v8 (Chrome), Chakra (IE/Edge), und JSC (WebKit/Safari) prüfen ebenfalls die Möglichkeit, dieses Verhalten zu entfernen.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/for...of/index.html b/files/de/web/javascript/reference/statements/for...of/index.html new file mode 100644 index 0000000000..4010e660e3 --- /dev/null +++ b/files/de/web/javascript/reference/statements/for...of/index.html @@ -0,0 +1,183 @@ +--- +title: for...of +slug: Web/JavaScript/Reference/Statements/for...of +tags: + - ECMAScript 2015 + - Experimental + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/for...of +--- +
{{jsSidebar("Statements")}}
+ +

Mit dem for...of statement können sogenannte iterable objects durchlaufen werden ({{jsxref("Array")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, das arguments Objekt und weitere eingeschlossen), wobei auf jeden gefundenen Wert eigene Statements ausgeführt werden können.

+ +

Syntax

+ +
for (variable of iterable) {
+  statement
+}
+
+ +
+
variable
+
Bei jedem Durchlauf wird variable der jeweils gefundene Wert zugewiesen.
+
iterable
+
Objekt, dessen aufzählbare Eigenschaften durchlaufen werden.
+
+ +

Beispiele

+ +

Unterschied zwischen for...of und for...in

+ +

Das folgende Beispiel zeigt den Unterschied zwischen einer for...of und einer for...in Schleife. Während for...in über die Namen der Eigenschaften läuft, geht for...of über deren Werte:

+ +
let arr = [3, 5, 7];
+arr.foo = "hallo";
+
+for (let i in arr) {
+   console.log(i); // logs "0", "1", "2", "foo"
+}
+
+for (let i of arr) {
+   console.log(i); // logs "3", "5", "7"
+}
+
+ +

Nutzen von Array.prototype.forEach()

+ +

Um dieselben Werte zu bekommen, die eine for...of Schleife zurückgeben würde, kann man auch die {{jsxref("Array.prototype.forEach()")}} Methode nutzen:

+ +
let arr = [3, 5, 7];
+arr.foo = "hallo";
+
+arr.forEach(function (element, index) {
+    console.log(element); // logs "3", "5", "7"
+    console.log(index);   // logs "0", "1", "2"
+});
+
+// or with Object.keys()
+
+Object.keys(arr).forEach(function (element, index) {
+    console.log(arr[element]); // logs "3", "5", "7", "hallo"
+    console.log(arr[index]);   // logs "3", "5", "7"
+});
+ +

Durchlaufen von DOM collections 

+ +

DOM collections wie {{domxref("NodeList")}} durchlaufen: Das folgende Beispiel fügt eine read class zu allen Paragraphen hinzu, die direkte Nachfolger eines Artikels sind:

+ +
// Notiz: Das wird nur auf Plattformen funktionieren, die
+// NodeList.prototype[Symbol.iterator] implementiert haben
+let articleParagraphs = document.querySelectorAll("article > p");
+
+for (let paragraph of articleParagraphs) {
+  paragraph.classList.add("read");
+}
+
+ +

Durchlaufen von Generatoren

+ +

Man kann auch Generatoren durchlaufen:

+ +
function* fibonacci() { // ein Generator
+    let [prev, curr] = [0, 1];
+    for (;;) {
+        [prev, curr] = [curr, prev + curr];
+        yield curr;
+    }
+}
+
+for (let n of fibonacci()) {
+    // die Sequence bei 1000 abbrechen
+    if (n > 1000)
+        break;
+    console.log(n);
+}
+
+ +

Spezifikation

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-for-in-and-for-of-statements', 'for...of statement')}}{{Spec2('ES2015')}}Initial definition.
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(29)}}[1]
+ {{CompatChrome(38)}}
{{CompatGeckoDesktop("13")}}
+ {{CompatGeckoDesktop("17")}} (.iterator)
+ {{CompatGeckoDesktop("27")}} ("@@iterator")
+ {{CompatGeckoDesktop("36")}} (Symbol.iterator)
{{CompatNo}}257.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatUnknown}}{{CompatChrome(29)}}[1]
+ {{CompatChrome(38)}}
{{CompatGeckoMobile("13")}}
+ {{CompatGeckoMobile("17")}} (.iterator)
+ {{CompatGeckoMobile("27")}} ("@@iterator")
+ {{CompatGeckoMobile("36")}} (Symbol.iterator)
{{CompatUnknown}}{{CompatUnknown}}iOS 8
+
+ +

[1] Dieses Feature ist als Option enthalten. In chrome://flags/#enable-javascript-harmony muss der Eintrag “Enable Experimental JavaScript” aktiviert werden.

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/statements/for/index.html b/files/de/web/javascript/reference/statements/for/index.html new file mode 100644 index 0000000000..d77a89b846 --- /dev/null +++ b/files/de/web/javascript/reference/statements/for/index.html @@ -0,0 +1,201 @@ +--- +title: for +slug: Web/JavaScript/Reference/Statements/for +tags: + - Anweisung + - JavaScript + - Loop + - for +translation_of: Web/JavaScript/Reference/Statements/for +--- +
{{jsSidebar("Anweisungen")}}
+ +

Die for Anweisung beschreibt eine Schleife mit drei optionalen Ausdrücken und einer oder mehreren Anweisungen.

+ +

Syntax

+ +
for ([initialization]; [condition]; [final-expression])
+   statement
+
+ +
+
initialization
+
Ein Ausdruck (inklusive Zuweisungen) oder eine Variablendeklaration. Normalerweise wird ein Schleifenzähler initialisiert. Neu deklarierte Variablen haben denselben Geltungsbereich wie die for Schleife (d.h. sie sind nicht lokal auf die Schleife begrenzt). Die Initialisierung ist optional.
+
condition
+
Die Bedingung wird vor jedem Schleifendurchlauf ausgewertet. Ergibt die Auswertung true, dann wird die Answeisung (statement) ausgeführt. Die Bedingung ist optional. Bei fehlender Bedingung gilt immer true. Bei false wird die Schleife verlassen (und bei der nächsten Anweisung, die dem Schleifenende folgt, weitergemacht).
+
final-expression
+
Dieser Ausdruck wird nach jedem Schleifendurchlauf ausgewertet. Dies findet vor der nächsten Auswertung der Schleifenbedinung statt. Üblicherweise wird der Schleifenzähler inkrementiert oder dekrementiert.
+
statement
+
Der Ausdruck wird ausgeführt solange die Bedingung erfüllt ist (true). Man kann mehrere Anweisungen ausführen, indem man sie in einer block Anweisung  ({ ... }) zusammenfasst. Eine leere Anweisung (empty statement), markiert durch semikolon, kann auch ausgeführt werden.
+
+ +

Beispiele

+ +

Verwendung der for Schleife

+ +

Die folgende for Anweisung initialisiert die Variable i mit null. Die Bedingung prüft ob i kleiner neun ist, führt den Code in der block Anweisung aus und erhöht i um eins nach jedem Schleifendurchlauf.

+ +
for (var i = 0; i < 9; i++) {
+   console.log(i);
+   // more statements
+}
+
+ +

Optionale for Ausdrücke

+ +

Alle drei for Ausdrücke sind optional.

+ +

Z.B. kann der Initialisierungsblock leer sein:

+ +
var i = 0;
+for (; i < 9; i++) {
+    console.log(i);
+    // more statements
+}
+
+ +

Die Schleifenbedinung ist auch optional. Man muss jedoch darauf achten, dass in der Schleife eine Austrittsbedingung (break Anweisung) vorkommt, um nicht in eine Endlosschleife zu geraten.

+ +
for (var i = 0;; i++) {
+   console.log(i);
+   if (i > 3) break;
+   // more statements
+}
+ +

Das gleiche gilt selbstverständlich wenn man alle drei Blöcke leer lässt. Hier wird i in der Schleife inkrementiert, um sicherzustellen, dass nach endlich vielen Durchläufen die Schleife abgebrochen wird.

+ +
var i = 0;
+
+for (;;) {
+  if (i > 3) break;
+  console.log(i);
+  i++;
+}
+
+ +

Verwendung von for Schleife mit leerer Anweisung

+ +

Das folgende Beispiel zeigt eine leere Anweisung im Schleifenkörper. Die Berechnungen finden im Ausdruck [final-expression] statt. Die Schleife wird solange durchlaufen bis die Bedingung nicht mehr erfüllt ist.

+ +
function showOffsetPos (sId) {
+  var nLeft = 0, nTop = 0;
+
+  for (var oItNode = document.getElementById(sId); // initialization
+       oItNode; // condition
+       nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent) // final-expression
+       /* empty statement */ ;
+
+  console.log("Offset position of \"" + sId + "\" element:\n left: " + nLeft + "px;\n top: " + nTop + "px;");
+}
+
+// Example call:
+
+showOffsetPos("content");
+
+// Output:
+// "Offset position of "content" element:
+// left: 0px;
+// top: 153px;"
+ +
Beachte: Die leere Anweisung folgt der Schleife und besteht lediglich aus einem Semikolon.
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusBemerkung
{{SpecName('ES1', '#sec-12.6.2', 'for statement')}}{{Spec2('ES1')}}Ursprüngliche Definition.
{{SpecName('ES3', '#sec-12.6.3', 'for statement')}}{{Spec2('ES3')}} 
{{SpecName('ES5.1', '#sec-12.6.3', 'for statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-for-statement', 'for statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-for-statement', 'for statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Unterstützung{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/for_each...in/index.html b/files/de/web/javascript/reference/statements/for_each...in/index.html new file mode 100644 index 0000000000..34a52f5397 --- /dev/null +++ b/files/de/web/javascript/reference/statements/for_each...in/index.html @@ -0,0 +1,122 @@ +--- +title: for each...in +slug: Web/JavaScript/Reference/Statements/for_each...in +tags: + - Deprecated + - JavaScript + - Statement +translation_of: Archive/Web/JavaScript/for_each...in +--- +
{{jsSidebar("Statements")}}
+ +
+

The for each...in statement is deprecated as the part of ECMA-357 (E4X) standard. E4X support has been removed, but for each...in will not be disabled and removed because of backward compatibility considerations. Consider using {{jsxref("Statements/for...of", "for...of")}} instead. (Please refer to {{bug("791343")}}.)

+
+ +

Die for each...in Schleife wiederholt die definierteVariable in jeder Instanz eines Objekts. Für jedes einzelne Vorkommen wird der bestimmte Befehl ausgeführt.

+ +

Syntax

+ +
for each (variable in object) {
+  statement
+}
+ +
+
variable
+
die Variable, die innerhalb des durchsuchten Projekts gesucht wird. Diese kann durch das Schlüsselwort var bestimmt werden. Die Variable wird Lokal innerhalb der Funktion definiert, nicht für die ganze Schleife.
+
+ +
+
object
+
das Objekt, innerhalb dessen die Werte gesucht werden.
+
+ +
+
statement
+
am Befehl, der bei jedem auftreten der gesuchten Eigenschaft ausgeführt wird. Um mehrere Befehle innerhalb der Schleife auszuführen, nutzen Sie für deren Gruppierung das {{jsxref("Statements/block", "Block")}} statement ({ ... }) .
+
+ +

Beschreibung

+ +

einige Eigenschaften werden nicht in der Schleife durchsucht. Diese umfassen alle standardmäßigen Methoden von Objekten, beispielsweise die String-Methode indexOf. Es werden jedoch alle vom Nutzer definierten Werte durchsucht.

+ +

Beispiele

+ +

Nutzung von for each...in

+ +

Warnung: Nutzen Sie eine derartige Schleife niemals in Arrays. Nutzen Sie diese nur für Objekte. Weitere Einzelheiten bei {{jsxref("Statements/for...in", "for...in")}}.

+ +

der folgende Code Ausschnitt durchsucht die Eigenschaften eines Objektes und errechnet ihre Summe:

+ +
var sum = 0;
+var obj = {prop1: 5, prop2: 13, prop3: 8};
+
+for each (var item in obj) {
+  sum += item;
+}
+
+console.log(sum); // logs "26", which is 5+13+8
+ +

Spezifikationen

+ +

Kein teil der ECMA-262 Spezifikation. Implementiert in JavaScript 1.6 und deprecated.

+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatNo}}{{CompatGeckoDesktop("1.8")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile("1.0")}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/statements/function_star_/index.html b/files/de/web/javascript/reference/statements/function_star_/index.html new file mode 100644 index 0000000000..a8b2982dce --- /dev/null +++ b/files/de/web/javascript/reference/statements/function_star_/index.html @@ -0,0 +1,200 @@ +--- +title: function* +slug: Web/JavaScript/Reference/Statements/function* +tags: + - ECMAScript 2015 + - Function + - Iterator + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/function* +--- +
{{jsSidebar("Statements")}}
+ +

Die function*-Deklaration ( Schlüsselwort function gefolgt von einem Stern) definiert eine Generatorfunktion, welche ein  {{jsxref("Global_Objects/Generator","Generator")}}-Objekt zurückgibt.

+ +
{{EmbedInteractiveExample("pages/js/statement-functionasterisk.html")}}
+ + + +
+

Eine Generatorfunktion kann auch mittels des {{jsxref("GeneratorFunction")}}-Konstruktors definiert werden.

+
+ +

Syntax

+ +
function* name([param[, param[, ... param]]]) {
+   statements
+}
+
+ +
+
name
+
Der Name der Funktion.
+
+ +
+
param
+
Der Name eines an die Funktion zu übergebenden Arguments. Eine Funktion kann bis zu 255 Argumente haben.
+
+ +
+
statements
+
Die den Körper der Funktion ergebenden Anweisungen.
+
+ +

Beschreibung

+ +

Generatoren sind Funktionen, die verlassen und später wieder betreten werden können. Ihr Kontext (Variablenbindung) bleibt über die Wiedereintritte hinweg erhalten.

+ +

Der Aufruf einer Generatorfunktion führt ihren Körper nicht sofort aus; stattdessen wird ein Iterator-Objekt einer Funktion zurückgegeben. Wenn die next()-Methode des Iterators aufgerufen wird, wird der Körper der Generatorfunktion bis zum ersten {{jsxref("Operators/yield", "yield")}}-Ausdruck ausgeführt, der den vom Iterator zurückzugebenden Wert spezifiziert oder mittels {{jsxref("Operators/yield*", "yield*")}} an eine andere Generatorfunktion weitergibt. Die Methode next() gibt ein Objekt mit einer value-Eigenschaft zurück, die den zurückgegebenen Wert enthält, und eine Eigenschaft done, die anzeigt, ob der Generator seinen letzten Wert zurückgegeben hat (boolescher Wert). Beim Aufrufen der next()-Methode mit einem Argument wird die Generatorfunktion weiter ausgeführt.

+ +

Ein return-Statement in einer Generatorfunktion sorgt dafür, dass der Generator fertig ist (Status done). Falls ein Wert zurückgegeben wird, dann wird dieser als value zurückgegeben. Anschließend wird kein weiterer Wert mehr zurückgegeben.

+ +

Beispiele

+ +

Einfaches Beispiel

+ +
function* idMaker(){
+  var index = 0;
+  while(index < index+1)
+    yield index++;
+}
+
+var gen = idMaker();
+
+console.log(gen.next().value); // 0
+console.log(gen.next().value); // 1
+console.log(gen.next().value); // 2
+console.log(gen.next().value); // 3
+// ...
+ +

Beispiel mit yield*

+ +
function* anotherGenerator(i) {
+  yield i + 1;
+  yield i + 2;
+  yield i + 3;
+}
+
+function* generator(i) {
+  yield i;
+  yield* anotherGenerator(i);
+  yield i + 10;
+}
+
+var gen = generator(10);
+
+console.log(gen.next().value); // 10
+console.log(gen.next().value); // 11
+console.log(gen.next().value); // 12
+console.log(gen.next().value); // 13
+console.log(gen.next().value); // 20
+
+ +

Übergeben von Argumenten in Generatoren

+ +
function* logGenerator() {
+  console.log(0);
+  console.log(1, yield);
+  console.log(2, yield);
+  console.log(3, yield);
+}
+
+var gen = logGenerator();
+
+// the first call of next executes from the start of the function
+// until the first yield statement
+gen.next();             // 0
+gen.next('pretzel');    // 1 pretzel
+gen.next('california'); // 2 california
+gen.next('mayonnaise'); // 3 mayonnaise
+
+ +

Return Statement in einem Generator

+ +
function* yieldAndReturn() {
+  yield "Y";
+  return "R";
+  yield "unreachable";
+}
+
+var gen = yieldAndReturn()
+console.log(gen.next()); // { value: "Y", done: false }
+console.log(gen.next()); // { value: "R", done: true }
+console.log(gen.next()); // { value: undefined, done: true }
+
+ +

Generatoren haben keinen Konstruktor

+ +
function* f() {}
+var obj = new f; // throws "TypeError: f ist kein Konstruktor"
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#', 'function*')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ES2016', '#', 'function*')}}{{Spec2('ES2016')}}Änderung, dass Generatoren nicht über [[Construct]] trap verfügen und eine Ausnahme bei der Verwendung von new erzeugen.
{{SpecName('ESDraft', '#', 'function*')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.statements.generator_function")}}

+
+ +

Firefox-spezifische Hinweise

+ +

Generatoren und Iteratoren in Firefox-Versionen vor 26

+ +

Ältere Firefox-Versionen implementierten eine ältere Version des Generatorenentwurfs. In den älteren Versionen wurden Generatoren, neben anderen Abweichungen, mit dem normalen Schlüsselwort function (ohne den Stern) definiert. Siehe veraltete Generatorfunktion für weitere Informationen.

+ +

IteratorResult-Objekt zurückgegeben anstatt Ausnahme erzeugt

+ +

Beginnend mit Gecko 29 {{geckoRelease(29)}} erzeugt die ausgeführte Generatorfunktion keine {{jsxref("TypeError")}} "generator has already finished"-Ausnahme mehr. Stattdessen gibt sie ein IteratorResult-Objekt mit { value: undefined, done: true } ({{bug(958951)}}) zurück.

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/funktion/index.html b/files/de/web/javascript/reference/statements/funktion/index.html new file mode 100644 index 0000000000..64a54347bc --- /dev/null +++ b/files/de/web/javascript/reference/statements/funktion/index.html @@ -0,0 +1,190 @@ +--- +title: Funktion +slug: Web/JavaScript/Reference/Statements/funktion +translation_of: Web/JavaScript/Reference/Statements/function +--- +
{{jsSidebar("Statements")}}
+ +

Die Funktionsdeklaration definiert eine Funktion mit den angegebenen Parametern.

+ +

Es kann auch eine Funktion mit dem {{jsxref("Function")}}-Konstruktor und einem {{jsxref("Operators/function", "Funktionsausdruck")}} deklariert werden.

+ +

Syntax

+ +
function name([param,[, param,[..., param]]]) {
+   [statements]
+}
+
+ +
+
name
+
Der Funktionsname.
+
+ +
+
param
+
Der Name des Arguments, der an die Funktion übergeben werden soll. Eine Funktion kann bis zu 255 Argumente haben.
+
+ +
+
statements
+
Die Ausdrücke, aus denen der Funktionskörper besteht.
+
+ +

Beschreibung

+ +

Eine Funktion, die mit der Funktionsdeklaration erstellt wurde, ist ein Function -Objekt und hat alle Eigenschaften, Methoden und Verhalten des Function-Objekts. Siehe {{jsxref("Function")}} für detaillierte Information über Funktionen.

+ +

Eine Funktion kann auch mit einem Ausdruck erzeugt werden (siehe {{jsxref("Operators/function", "function expression")}}).

+ +

Standardmäßig geben Funktionen undefined zurück. Um einen beliebigen anderen Wert zurückzugeben muss die Funktion einen {{jsxref("Statements/return", "return")}}-Ausdruck haben, der den Wert der Rückgabe angibt.

+ +

Bedingungskreierte Funktionen

+ +

Funktionen können bedingungskreiert werden. Das heißt: Eine Funktionsanweisung kann innerhalb einer if-Anweisung verschachtelt werden. Die meisten modernen Browser, abseits von Mozilla, werden solche konditionsbasierten Deklarationen als unkonditionelle Deklarationen behandeln und die Funktion erstellen, ob wahr oder nicht, siehe dieser Artikel für eine Übersicht. Deshalb sollten sie so nicht verwendet werden. Stattdessen sollten Funktionsausdrücke für eine konditionelle Erstellung verwendet werden.

+ +

Hochziehen der Funktionsdeklaration

+ +

Funktionsdeklarationen in Javascript ziehen die Funktionsdefinition hoch. D. h. Funktionen können benutzt werden noch bevor sie deklariert wurden:

+ +
hochgezogen(); // loggt "foo"
+
+function hochgezogen() {
+  console.log("foo");
+}
+
+ +

Zu beachten ist aber, dass {{jsxref("Operators/function", "Funktionsausdrücke")}} nicht hochgezogen werden:

+ +
nichtHochgezogen(); // TypeError: nichtHochgezogen is not a function
+
+var nichtHochgezogen = function() {
+   console.log("bar");
+};
+
+ +

Beispiele

+ +

Mit function

+ +

Der folgende Code deklariert eine Funktion, die die Summe aller Verkäufe zurückgibt, wenn sie die Anzahl der verkauften Einheiten a, b, und c übergeben bekommt.

+ +
function berechne_verkäufe(einheit_a, einheit_b, einheit_c) {
+   return einheit_a*79 + einheit_b * 129 + einheit_c * 699;
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-function-definitions', 'Function definitions')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-13', 'Function definition')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-13', 'Function definition')}}{{Spec2('ES3')}} 
{{SpecName('ES1', '#sec-13', 'Function definition')}}{{Spec2('ES1')}}Initial definition. Implemented in JavaScript 1.0.
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
Allowed in sloppy mode{{CompatChrome(49.0)}}    
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
Allowed in sloppy mode{{CompatNo}} +

{{CompatChrome(49.0)}}

+
    
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/if...else/index.html b/files/de/web/javascript/reference/statements/if...else/index.html new file mode 100644 index 0000000000..f0d95829cf --- /dev/null +++ b/files/de/web/javascript/reference/statements/if...else/index.html @@ -0,0 +1,168 @@ +--- +title: if...else +slug: Web/JavaScript/Reference/Statements/if...else +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/if...else +--- +
{{jsSidebar("Statements")}}
+ +

Die if-Anweisung führt Anweisungen aus, wenn eine bestimmte Bedingung zu true ausgewertet wird. Wird die Bedingung zu false ausgewertet, können andere Anweisungen ausgeführt werden.

+ +
{{EmbedInteractiveExample("pages/js/statement-ifelse.html")}}
+ + + +

Syntax

+ +
if (bedingung) anweisung1 [else anweisung2]
+
+ +
+
bedingung
+
Ein Ausdruck, der zu true oder false ausgewertet wird.
+
+ +
+
anweisung1
+
Eine Anweisung, die ausgeführt wird, wenn bedingung zu true ausgewertet wird. Diese Anweisung kann jede gültige Anweisung sein, auch eine if-Anweisung. Um mehrere Anweisungen auszuführen, muss eine {{jsxref("Statements/block", "block")}}-Anweisung ({...}) genutzt werden, um die Anweisungen zu gruppieren. Wenn keine Anweisung ausgeführt werden soll, muss die {{jsxref("Statements/empty", "empty")}}-Anweisung genutzt werden.
+
+ +
+
anweisung2
+
Eine Anweisung, die ausgeführt wird, wenn bedingung zu false ausgewertet wird und die else Klausel existiert. Auch hier können alle Anweisungen, egal ob {{jsxref("Statements/block", "block")}}-Anweisung ({...}) oder weitere if-Anweisungen genutzt werden.
+
+ +

Beschreibung

+ +

Mehrere if...else-Anweisungen können verschachtelt werden, wenn eine else if-Klausel erstellt wird. Zu beachten ist, dass es in JavaScript kein Schlüsselwort elseif (in einem Wort) gibt.

+ +
if (bedingung1)
+   anweisung1
+else if (bedingung2)
+   anweisung2
+else if (bedingung3)
+   anweisung3
+...
+else
+   anweisungN
+
+ +

Um zu sehen wie das funktioniert, ist es hilfreich, die verschachtelten Anweisungen einzurücken:

+ +
if (bedingung1)
+   anweisung1
+else
+   if (bedingung2)
+      anweisung2
+   else
+      if (bedingung3)
+...
+
+ +

Um mehrere Anweisungen in einer Klausel auszuführen, muss eine {{jsxref("Statements/block", "block")}}-Anweisung genutzt werden. Allgemein ist es immer gute Praxis (best practice) eine {{jsxref("Statements/block", "block")}}-Anweisung zu nutzen, besonders bei verschachtelten if-Anweisungen.

+ +
if (bedingung) {
+  anweisung1
+} else {
+  anweisung2
+}
+
+ +

Man sollte den primitiven boolean-Datentyp nicht mit dem {{jsxref("Global_Objects/Boolean", "Boolean")}}-Objekt verwechseln. Jeder Wert, der nicht undefined, null, 0, NaN, oder der leere string ("") ist, wird zu true ausgewertet. Dabei ist auch ein {{jsxref("Global_Objects/Boolean", "Boolean")}}-Objekt mit dem Wert false inbegriffen.

+ +
var b = new Boolean(false);
+if (b) // wird zu true ausgewertet
+
+ +

Beispiele

+ +

Einsatz von if...else

+ +
if (cipher_char === from_char) {
+  result = result + to_char;
+  x++;
+} else {
+  result = result + clear_char;
+}
+
+ +

Einsatz von else if

+ +

Zu beachten ist, dass in JavaScript kein elseif-Schlüsselwort existiert. Man kann jedoch immer ein Leerzeichen zwischen else und if benutzen.

+ +
if (x > 5) {
+
+} else if (x > 50) {
+
+} else {
+
+}
+ +

Zuweisungen in der Bedingung

+ +

Es ist nicht ratsam einfache Zuweisungen in die Bedingung zu schreiben, weil sie zu Verwechselungen mit dem Gleichheit-Operator führen kann. Zum Beispiel führt folgender Quelltext, der eine Zuweisung enthält immer zu 'true' und sollte daher so nicht benutzt werden:

+ +
if (x = y) {
+   /* tu das richtige */
+}
+
+ +

Wenn es nötig ist, eine Zuweisung in einer Bedingungs-Anweisunge zu benutzen, dann sollten Klammern um die Zuweisung gesetzt werden. Der Effekt ist jedoch derselbe, wie im vorangegangenen Code. Zum Beispiel:

+ +
if ((x = y)) {
+   /* tu das richtige */
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-if-statement', 'if statement')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-if-statement', 'if statement')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-12.5', 'if statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-12.5', 'if statement')}}{{Spec2('ES3')}} 
{{SpecName('ES1', '#sec-12.5', 'if statement')}}{{Spec2('ES1')}}Initiale Definition
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.if_else")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/import/index.html b/files/de/web/javascript/reference/statements/import/index.html new file mode 100644 index 0000000000..07e1b12a7d --- /dev/null +++ b/files/de/web/javascript/reference/statements/import/index.html @@ -0,0 +1,151 @@ +--- +title: import +slug: Web/JavaScript/Reference/Statements/import +tags: + - ECMAScript 2015 + - JavaScript + - Module + - Statement +translation_of: Web/JavaScript/Reference/Statements/import +--- +
{{jsSidebar("Statements")}}
+ +

Das import Statement wird verwendet um Funktionen, Objekte und Primitives zu importieren die von einem externen Modul, einem anderen Script, etc. exportiert wurden.

+ +

{{noteStart}}Zur Zeit wird dieses Feature nicht von jedem Browser nativ unterstützt. Viele Transpiler implementieren es, wie beispielsweise der Traceur CompilerBabelRollup oder Webpack.{{noteEnd}}

+ +

Syntax

+ +
import name from "module-name";
+import * as name from "module-name";
+import { member } from "module-name";
+import { member as alias } from "module-name";
+import { member1 , member2 } from "module-name";
+import { member1 , member2 as alias2 , [...] } from "module-name";
+import defaultMember, { member [ , [...] ] } from "module-name";
+import defaultMember, * as alias from "module-name";
+import defaultMember from "module-name";
+import "module-name";
+ +
+
name
+
Name des Objekts, das die importierten Daten empfängt
+
+ +
+
member, memberN
+
Namen der exportierten Member, die importiert werden
+
defaultMember
+
Name des exportierten Defaults, das importiert wird
+
alias, aliasN
+
Name des Objekts, das die importierte Property empfängt
+
module-name
+
Der Name des Moduls, das importiert wird. Also der Dateiname.
+
+ +

Beschreibung

+ +

Der Parameter name ist der Name des Objekts, das die exportierten Member empfängt. Die member-Parameter legen einzelne Einheiten fest, während der name Parameter alles importiert. name kann auch eine Funktion sein, wenn das Modul nur eine Einheit hat. Es folgen ein paar Beispiele für die Syntax:

+ +

Importieren der gesamten Inhalte des Moduls. Folgendes fügt myModule in den aktuellen Namensraum ein, mit allen exportierten Verbindungen von "my-module" bzw. "my-module.js".

+ +
import * as myModule from "my-module";
+
+ +

Einfügen einer einzelnen Einheit eines Moduls. Folgendes fügt myMember in den aktuellen Namensraum ein.

+ +
import {myMember} from "my-module";
+ +

Einfügen von mehreren Einheiten eines Moduls. Folgendes fügt foo und bar in den aktuellen Namensraum ein.

+ +
import {foo, bar} from "my-module";
+ +

Einfügen und Vergeben eines Alias. Folgendes fügt shortName in den aktuellen Namensraum ein.

+ +
import {reallyReallyLongModuleMemberName as shortName} from "my-module";
+ +

Einfügen und Vergeben von mehreren Aliasen

+ +
import {reallyReallyLongModuleMemberName as shortName, anotherLongModuleName as short} from "my-module";
+ +

Einfügen eines ganzen Moduls, ohne dessen Namensbindungen zu importieren.

+ +
import 'my-module';
+ +

Defaults importieren

+ +

Ein Standardexport ist möglich (egal, ob es sich um ein Objekt, eine Funktion, eine Klasse oder anderes handelt). Dementsprechend ist es auch möglich einen Standard-import zu benutzen, um diese Standards zu importieren.

+ +

Die einfachste Version importiert die Standards direkt:

+ +
import myModule from "my-module";
+ +

Man kann diese Syntax auch benutzen, um die oben genannten imports durchzufüren. In diesem Fall müssen die Standards aber wie folgt definiert werden:

+ +
import myDefault, * as myModule from "my-module";
+// myModule wird als namespace benutzt
+ +

oder

+ +
import myDefault, {foo, bar} from "my-module";
+// spezifische Imports nach Namen
+
+ +

Beispiele

+ +

Importieren einer weiteren Datei um AJAX JSON-Anfragen zu bearbeiten:

+ +
// --file.js--
+function getJSON(url, callback) {
+  let xhr = new XMLHttpRequest();
+  xhr.onload = function () {
+    callback(this.responseText)
+  };
+  xhr.open("GET", url, true);
+  xhr.send();
+}
+
+export function getUsefulContents(url, callback) {
+  getJSON(url, data => callback(JSON.parse(data)));
+}
+
+// --main.js--
+import { getUsefulContents } from "file";
+getUsefulContents("http://www.example.com", data => {
+  doSomethingUseful(data);
+});
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-imports', 'Imports')}}{{Spec2('ES2015')}}Initiale Definition
{{SpecName('ESDraft', '#sec-imports', 'Imports')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{Compat("javascript.statements.import")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/index.html b/files/de/web/javascript/reference/statements/index.html new file mode 100644 index 0000000000..a460b954d2 --- /dev/null +++ b/files/de/web/javascript/reference/statements/index.html @@ -0,0 +1,148 @@ +--- +title: Anweisungen und Deklarationen +slug: Web/JavaScript/Reference/Statements +tags: + - JavaScript + - Reference + - statements +translation_of: Web/JavaScript/Reference/Statements +--- +
{{jsSidebar("Statements")}}
+ +

JavaScript Anwendungen bestehen aus Anweisungen mit bestimmter Syntax. Eine Anweisung kann mehrere Zeilen umfassen und mehrere Anweisungen können in einer einzigen Zeile stehen, wenn sie mittels Semikolon voneinander getrennt sind.

+ +

Anweisungen und Deklarationen nach Kategorie

+ +

Für eine alphabetische Auflistung, siehe Sidebar auf der linken Seite.

+ +

Kontrollfluss

+ +
+
{{jsxref("Statements/block", "Block")}}
+
Anweisungsblöcke werden genutzt um ein oder mehrere Anweisungen zu gruppieren. Der Block wird von geschweiften Klammern umfasst.
+
{{jsxref("Statements/break", "break")}}
+
Beendet die aktuelle Schleifen-, Switch-, oder mit Label versehene Anweisung und das Programm wird hinter dieser fortgesetzt.
+
{{jsxref("Statements/continue", "continue")}}
+
Beendet den Durchlauf der aktuellen, bzw. der mittels Label angesprochenen Schleife und fährt mit dem nächsten Schleifendurchlauf fort.
+
{{jsxref("Statements/Empty", "Empty")}}
+
Man verwendet empty anstatt einer echten Anweisung, um keine Anweisung zu geben, an stellen an denen nach JavaScript-Syntax eine erwartet wird.
+
{{jsxref("Statements/if...else", "if...else")}}
+
Führt eine Anweisung aus wenn eine zuvor festgelegte Bedingung erfüllt (als true gewertet) wird. Ist die Bedingung false, kann eine andere Anweisung ausgeführt werden.
+
{{jsxref("Statements/switch", "switch")}}
+
Nach Auswertung eines Ausdrucks, wird anhand des Ergebnisses eine Fallunterscheidung durchgeführt und die entsprechende durch ein case-Label markierte Anweisung ausgeführt.
+
{{jsxref("Statements/throw", "throw")}}
+
Leitet das Auswerfen eines Fehlerausdrucks ein.
+
{{jsxref("Statements/try...catch", "try...catch")}}
+
Ein Anweisungsblock wird "ausprobiert" (try) und ein eventuell auftretender Fehler abgefangen (catch) und gegebenenfalls behandelt.
+
+ +

Deklarationen

+ +
+
{{jsxref("Statements/var", "var")}}
+
Deklariert eine Variable und initialisiert sie optional mit einem Wert.
+
{{experimental_inline()}} {{jsxref("Statements/let", "let")}}
+
Deklariert eine Blocklokale variable und initialisiert sie optional mit einem Wert.
+
{{experimental_inline()}} {{jsxref("Statements/const", "const")}}
+
Deklariert eine Konstante auf welche nur lesend zugegriffen werden kann.
+
+ +

Funktionen und Klassen

+ +
+
{{jsxref("Statements/function", "function")}}
+
Deklariert eine Funktion mit festgelegten Parametern.
+
{{experimental_inline()}} {{jsxref("Statements/function*", "function*")}}
+
Erzeugt Funktionen mit denen  Schleifen leichter zu schreiben sind.
+
{{jsxref("Statements/async_function", "async function")}}
+
Deklariert eine asynchrone Funktion mit festgelegten Parametern.
+
{{jsxref("Statements/return", "return")}}
+
Legt den Rückgabewert einer Funktion fest.
+
{{jsxref("Statements/class", "class")}}
+
Deklariert eine Klasse.
+
+ +

Schleifen

+ +
+
{{jsxref("Statements/do...while", "do...while")}}
+
Eine Schleife die solange ausgeführt wird bis die Bedingung false ist. Die Bedingung wird erst am Ende eines Durchgangs überprüft.
+
{{jsxref("Statements/for", "for")}}
+
Erstellt eine von drei unerforderlichen, zwischen Parenthesen geklammerten, durch Semikola getrennten Ausdrücken geregelte Schleife, gefolgt von einem Anweisungsblock innerhalb der Schleife.
+
{{deprecated_inline()}} {{non-standard_inline()}} {{jsxref("Statements/for_each...in", "for_each...in")}}
+
Iterates a specified variable over all values of object's properties. For each distinct property, a specified statement is executed.
+
{{jsxref("Statements/for...in", "for...in")}}
+
Stellt die aufzählbaren Eigenschaften eines Objektes in einer unbestimmten Reihenfolge zur Verfügung. Jede Eigenschaft kann durch Anweisungen in der Schleife ausgewertet werden.
+
{{experimental_inline()}} {{jsxref("Statements/for...of", "for...of")}}
+
Durchläuft die Werte eines iterationsfähigen Objektes, wie zum Beispiel eines arrays, eines Array-ähnlichen Objektes, oder eines Iterators oder Generators. Für jeden Wert des Objektes können Anweisungen ausgewertet werden.
+
 
+
{{jsxref("Statements/while", "while")}}
+
Erstellt eine Schleife, die solange durchlaufen wird, wie die Schleifenbedingung wahr ist. Die Schleifenbedingung wird am Anfang der Schleife (vor dem ersten Durchlauf des inneren Befehlsblocks) ausgewertet.
+
+ +

Weiteres

+ +
+
{{jsxref("Statements/debugger", "debugger")}}
+
Ruft irgendwelches verfügbare Fehlerentdeckungsvermögen auf. Steht keines zur Verfügung, hat dieser Befehl keine Wirkung.
+
{{experimental_inline()}} {{jsxref("Statements/export", "export")}}
+
Stellt eine Funktion zur Anwendung in anderen Modulen bereit. Dieser Ausdruck wird in dem Quellenmodul verwendet. Steht in Zusammenhang mit import auf der anderen Seite des Wechsels.
+
{{experimental_inline()}} {{jsxref("Statements/import", "import")}}
+
Importiert eine aus einem anderen Modul stammende Funktion, oder den gesamten Modul. Dieser Ausdruck wird in dem Entleihermodul verwendet, und arbeitet in Zusammenhang mit export.
+
{{jsxref("Statements/label", "label")}}
+
Hängt ein Etikett an eine Anweisung an. Auf dieses Etikett können  break (aussteigen) oder continue (fortsetzen) hinweisen, um den Kontrollfluss mit einer größeren Genauigkeit zu steuern.
+
+ +
+
{{deprecated_inline()}} {{jsxref("Statements/with", "with")}}
+
Extends the scope chain for a statement.
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES1', '#sec-12', 'Statements')}}{{Spec2('ES1')}}Initial Definition
{{SpecName('ES3', '#sec-12', 'Statements')}}{{Spec2('ES3')}} 
{{SpecName('ES5.1', '#sec-12', 'Statements')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}{{Spec2('ES6')}}Neu: function*, let, for...of, yield, class
{{SpecName('ESDraft', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/statements/label/index.html b/files/de/web/javascript/reference/statements/label/index.html new file mode 100644 index 0000000000..e9fcae4b50 --- /dev/null +++ b/files/de/web/javascript/reference/statements/label/index.html @@ -0,0 +1,205 @@ +--- +title: label +slug: Web/JavaScript/Reference/Statements/label +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/label +--- +
{{jsSidebar("Statements")}}
+ +

Ein Statement kann ein Label erhalten und zusammen mit dem {{jsxref("Statements/break", "break")}} oder {{jsxref("Statements/continue", "continue")}} Statements verwendet werden. Das Label ist das Präfix von einem Statement mit einer Bezeichner zum referenzieren.

+ +

Syntax

+ +
label : statement
+
+ +
+
label
+
Jeder JavaScript Bezeichner, welches kein reserviertes Wort ist.
+
statement
+
Statements. break kann mit jedem gelabelten Statement und continue kann mit Schleifen-Statements verwendet werden.
+
+ +

Beschreibung

+ +

Sie können ein Label verwenden, um eine Schleife zu identifizieren und danach einen break oder continue Statement verwenden, um anzugeben ob ein Programm die Schleife abbrechen oder weiter abarbeiten soll.

+ +
+

Hinweis: JavaScript hat KEINE goto Statements. Sie können die Labels nur mit break oder continue verwenden.

+
+ +

Beispiele

+ +

Verwenden eines continue mit Labels in for-Schleifen

+ +
var i, j;
+
+loop1:
+for (i = 0; i < 3; i++) {      // Das erste for Statement hat den Label "loop1"
+   loop2:
+   for (j = 0; j < 3; j++) {   // Das zweite for Statement hat den Label "loop2"
+      if (i === 1 && j === 1) {
+         continue loop1;
+      }
+      console.log("i = " + i + ", j = " + j);
+   }
+}
+
+// Ausgabe ist:
+//   "i = 0, j = 0"
+//   "i = 0, j = 1"
+//   "i = 0, j = 2"
+//   "i = 1, j = 0"
+//   "i = 2, j = 0"
+//   "i = 2, j = 1"
+//   "i = 2, j = 2"
+// Schau, wie "i = 1, j = 1" und"i = 1, j = 2" übersprungen werden
+
+ +

Verwenden eines continue Statements mit Label

+ +

Gegeben sei ein Array von Elementen und ein Array von Tests. Dieses Beispiel zählt die Anzahl von Elemente, die alle Tests bestehen.

+ +
var itemsPassed = 0;
+var i, j;
+
+top:
+for (i = 0; i < items.length; i++){
+  for (j = 0; j < tests.length; j++) {
+    if (!tests[j].pass(items[i])) {
+      continue top;
+    }
+  }
+
+  itemsPassed++;
+}
+ +

Verwenden eines breaks mit Labels für for-Schleifen

+ +
var i, j;
+
+loop1:
+for (i = 0; i < 3; i++) {      // Das erste for Statement hat den Label "loop1"
+   loop2:
+   for (j = 0; j < 3; j++) {   // Das zweite for Statement hat den Label "loop2"
+      if (i === 1 && j === 1) {
+         break loop1;
+      }
+      console.log("i = " + i + ", j = " + j);
+   }
+}
+
+// Ausgabe ist:
+//   "i = 0, j = 0"
+//   "i = 0, j = 1"
+//   "i = 0, j = 2"
+//   "i = 1, j = 0"
+// Schau den Unterschied zu dem vorigen continue Beispiel an
+ +

Verwenden eines Labels im break Statement

+ +

Gegeben ist ein Array von Items und ein Array von Tests. Dieses Beispiel bestimmt, ob alle Items alle Tests bestehen.

+ +
var allPass = true;
+var i, j;
+
+top:
+for (i = 0; items.length; i++)
+  for (j = 0; j < tests.length; i++)
+    if (!tests[j].pass(items[i])){
+      allPass = false;
+      break top;
+    }
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2
{{SpecName('ES5.1', '#sec-12.12', 'Labelled statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-labelled-statements', 'Labelled statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-labelled-statements', 'Labelled statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/let/index.html b/files/de/web/javascript/reference/statements/let/index.html new file mode 100644 index 0000000000..5c68f5eb96 --- /dev/null +++ b/files/de/web/javascript/reference/statements/let/index.html @@ -0,0 +1,454 @@ +--- +title: let +slug: Web/JavaScript/Reference/Statements/let +tags: + - ECMAScript 2015 + - JavaScript + - Statement + - Variable declaration + - Variables + - let +translation_of: Web/JavaScript/Reference/Statements/let +--- +
+
+
{{jsSidebar("Statements")}}
+
+
+ +

Das Schlüsselwort let deklariert eine Variable im Gültigkeitsbereich des lokalen Blocks. Optional wird die Variable mit einem Wert initialisiert. let leitet sich vom englischen Verb "to let" ab, so daß man die Zeile "let x = 3" lesen kann als: "lassen wir x 3 sein" (let x be three), bekannt aus der Programmiersprache BASIC.

+ +

Syntax

+ +
let var1 [= wert1] [, var2 [= wert2]] [, ..., varN [= wertN]];
+ +

Parameter

+ +
+
var1, var2, …, varN
+
Variablenname. Jeder legale Bezeichner ist erlaubt.
+
wert1, wert2, …, wertN
+
Initialwerte der Variablen. Jeder legale Ausdruck ist erlaubt.
+
+ +

Beschreibung

+ +

let ermöglicht es Variablen zu deklarieren, deren Gültigkeitsbereich auf den Block, den Befehl oder den Ausdruck beschränkt ist, in dem sie deklariert sind. Der Unterschied zum var Schlüsselwort ist, dass der Gültigkeitsbereich auf Blöcke und nicht auf Funktionen bzw. Global beschränkt ist.

+ +

Regeln für Gültigkeitsbereiche

+ +

Variablen, die mit let deklariert werden, haben als Gültigkeitsbereich den Block in dem sie definiert wurden und alle weiteren Unterblöcke in denen sie nicht neu definiert werden. In dieser Hinsicht funktioniert let ähnlich wie var. Der Unterschied besteht darin, dass der Gültigkeitbereich bei var Deklarierten Variablen die umschließende Funktion ist:

+ +
function varTest() {
+  var x = 31;
+  if (true) {
+    var x = 71;  // gleiche Variable!
+    console.log(x);  // 71
+  }
+  console.log(x);  // 71
+}
+
+function letTest() {
+  let x = 31;
+  if (true) {
+    let x = 71;  // andere variable
+    console.log(x);  // 71
+  }
+  console.log(x);  // 31
+}
+ +

Auf der ersten Ebene von Programmen und Funktionen erzeugt let im globalen Objekt keine Property, var hingegen schon. Deshalb ist this.y im folgenden Beispiel undefined.

+ +
var x = 'global';
+let y = 'global';
+console.log(this.x); // "global"
+console.log(this.y); // undefined
+ +

Private Eigenschaften emulieren

+ +

Beim Einsatz von Konstruktoren können let-Deklarationen (alternativ zu Closures) genutzt werden, um private Eigenschaften in mehreren Methoden zu verwenden.

+ +
var Thing;
+
+{
+  let privateScope = new WeakMap();
+  let counter = 0;
+
+  Thing = function() {
+    this.someProperty = 'foo';
+
+    privateScope.set(this, {
+      hidden: ++counter,
+    });
+  };
+
+  Thing.prototype.showPublic = function() {
+    return this.someProperty;
+  };
+
+  Thing.prototype.showPrivate = function() {
+    return privateScope.get(this).hidden;
+  };
+}
+
+console.log(typeof privateScope);
+// "undefined"
+
+var thing = new Thing();
+
+console.log(thing);
+// Thing {someProperty: "foo"}
+
+thing.showPublic();
+// "foo"
+
+thing.showPrivate();
+// 1
+ +

Das selbe Kapselungsmuster mit Funktionsabschlüssen über lokale Variablen kann mit var erstellt werden, aber dieses benötigt dann funktionsweite Sichtbarkeit (üblicherweise eine IIFE im Modulmuster) anstatt nur blockweite Sichtbarkeit wie das obenstehende Beispiel.

+ +

Redeklarationen

+ +

Erneute Deklaration derselben Variable innerhalb desselben Gültigkeitsbereiches erzeugt einen Syntaxfehler ({{jsxref("SyntaxError")}}).

+ +
if (x) {
+  let foo;
+  let foo; // SyntaxError thrown.
+}
+ +

Der Körper einer switch-Anweisung ist nur ein einzelner Block, weshalb das folgende Beispiel einen Fehler verursacht.

+ +
let x = 1;
+switch(x) {
+  case 0:
+    let foo;
+    break;
+
+  case 1:
+    let foo; // SyntaxError for redeclaration.
+    break;
+}
+ +

Ist innerhalb einer case-Klausel jedoch ein innerer Block eingebettet, erzeugt dieser seinen eigenen lexikalischen Gültigkeitsbereich. Das folgende Beispiel erzeugt deshalb keine solchen Redeklarations-Fehler, wie sie im vorangegangenen Beispiel auftraten.

+ +
let x = 1;
+
+switch(x) {
+  case 0: {
+    let foo;
+    break;
+  }
+  case 1: {
+    let foo;
+    break;
+  }
+}
+ +

Sauberer Quelltext in inneren Funktionen

+ +

let macht den Programmcode manchmal leserlicher, wenn innere Funktionen eingesetzt werden.

+ +
var list = document.getElementById("list");
+
+for (var i = 1; i <= 5; i++) {
+  var item = document.createElement("li");
+  item.appendChild(document.createTextNode("Item " + i));
+
+  let j = i;
+  item.onclick = function (ev) {
+    console.log("Item " + j + " is clicked.");
+  };
+  list.appendChild(item);
+}
+
+ +

Dieses Beispiel funktioniert wie erwartet, weil alle fünf Instanzen der anonymen inneren Funktionen auf verschiedene Instanzen der Variable j zugreifen. Wenn stattdessen var verwendet wird oder in der inneren Funktion statt j zu deklarieren i benutzt wird, funktioniert dies nicht.

+ +

Zeitweilig tote Zonen und Fehler mit let

+ +

In ECMAScript 2015, werden Deklarationen mit let nicht an den Anfang des Blocks verschoben (hoist). Wird eine Variable vor der Deklaration in einem Block referenziert, führt dies zu einem ReferenceError, weil sich die Variable bei Eintritt in den Block bis zur Verarbeitung der Deklaration in einer "zeitweilig toten Zone" (temporal dead zone) befindet.

+ +
function do_something() {
+  console.log(foo); // ReferenceError
+  let foo = 2;
+}
+ +

Ein switch Block besteht nur aus einem Block, so dass Fehler wie im folgenden Beispiel auftreten können.

+ +
switch (x) {
+  case 0:
+    let foo;
+    break;
+
+  case 1:
+    let foo; // SyntaxError für erneute Deklaration
+    break;
+}
+ +

Ein weiteres Beispiel zeitweilig toter Zonen mit lexikalischen Gültigkeitsbereichen

+ +

Aufgrund seines lexikalischen Gültigkeitsbereiches wird der Bezeichner "foo" im untenstehenden Ausdruck (foo + 55) als das foo des if-Blocks interpretiert, nicht aber als die verdeckte Variable foo mit dem Wert 33.
+ Bei Auswertung des Ausdrucks existiert das foo des if-Blocks bereits im lexikalischen Gültigkeitsbereich, hat seine Initialisierung (welche Teil derselben Anweisung ist) aber noch nicht erreicht (und auch nicht abgeschlossen). Folglich ist es noch immer in seiner zeitweilig toten Zone.

+ +
function test(){
+   var foo = 33;
+   if (true) {
+      let foo = (foo + 55); // ReferenceError
+   }
+}
+test();
+ +

Dieses Phänomen kann in einer Situation wie der folgenden verwirren. Die Anweisung let n of n.a gehört bereits zum eigenen Gültigkeitsbereich des Blocks der for-Schleife. Der Bezeichner "n.a" wird als Eigenschaft 'a' des Objektes 'n' interpretiert, welches im ersten Teil derselben Anweisung deklariert wird ("let n"). Dieses befindet sich noch immer in seiner zeitweilig toten Zone, da bei Auswertung des Ausdrucks die Deklarationsanweisung als noch nicht erreicht und abgeschlossen gilt.

+ +
function go(n) {
+  // n here is defined!
+  console.log(n); // Object {a: [1,2,3]}
+
+  for (let n of n.a) { // ReferenceError
+    console.log(n);
+  }
+}
+
+go({a: [1, 2, 3]});
+ +

Nicht-standardisierte let Ausdrücke

+ +

let Blöcke

+ +
+

Die Unterstützung für let Blöcke wurde in Gecko 44 entfernt ({{bug(1167029)}}).

+
+ +

let Blöcke ermöglichen es Werte von Variablen in einem Block zu bearbeiten, ohne gleichnamige Variablen außerhalb des Blocks zu beeinflussen.

+ +

Syntax

+ +
let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) block;
+ +

Beschreibung

+ +

Der let Block unterstützt lokales Scoping für Variablen. Es funktioniert mit dem Binden von keiner oder mehreren Variablen im lexikalischen Scope eines einzigen Blocks. Ansonsten ist es genau das selbe wie ein Block Statement. Zu beachten ist, dass Variablen, die innerhalb des let Blocks mit var definiert werden auch außerhalb des Blocks verfügbar sind, weil diese an die Funktion gebunden werden. Wenn ein let Block-Syntax benutzt wird, ist das let gefolgt von runden Klammern zwingend notwendig. Fehler beim benutzen führen zu einem Syntaxerror.

+ +

Beispiel

+ +
var x = 5;
+var y = 0;
+
+let (x = x+10, y = 12) {
+  console.log(x+y); // 27
+}
+
+console.log(x + y); // 5
+
+ +

Die Regeln für den Codeblock sind die gleichen wie für alle anderen Blöcke in JavaScript. Er hat seine Eigenen lokalen Variablen, die mit let deklariert sind.

+ +

Regeln für Gültigkeitsbereiche

+ +

Die Sichtbarkeit von mit let definierten Variablen ist der let Block selbst und auch jeder weitere innere Block in diesem Block, wenn die inneren Blöcke keine Variablen mit dem gleichen Namen definieren.

+ +

let Ausdrücke

+ +
+

Die Unterstützung für let Blöcke wurde in Gecko 41 entfernt ({{bug(1023609)}}).

+
+ +

Der let Ausdruck setzt die Sichtbarkeit einer Variablen auf nur einen Ausdruck.

+ +

Syntax

+ +
let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) expression;
+ +

Beispiel

+ +

Man kann let benutzen, um Variablen nur für einen Ausdruck zu benutzen:

+ +
var a = 5;
+let(a = 6) console.log(a); // 6
+console.log(a); // 5
+ +

Regeln für Gültigkeitsbereiche

+ +

Gegeben ist folgender let Ausdruck:

+ +
let (decls) expr
+
+ +

Es wird ein impliziter Block um expr erstellt.

+ +

Name

+ +

Die Erklärung, daß let von englisch "to let sth. be sth." abgeleitet ist und so "let" als Name (reserviertes Wort) ausgewählt wurde, ist hier (englisch) zu finden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}{{Spec2('ES2015')}}Initiale Definition. Definiert keine let Ausdrücke und let Blöcke.
{{SpecName('ESDraft', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(41.0)}}12{{ CompatGeckoDesktop(44) }}1117{{CompatUnknown}}
Temporal dead zone{{CompatUnknown}}12{{ CompatGeckoDesktop(35) }}11{{CompatUnknown}}{{CompatUnknown}}
let expression {{non-standard_inline}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
let block {{non-standard_inline}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Allowed in {{Glossary("sloppy mode")}}{{CompatChrome(49.0)}}{{CompatUnknown}}{{CompatGeckoDesktop(44)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatUnknown}}{{CompatChrome(41.0)}}{{ CompatGeckoMobile(44) }}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(41.0)}}
Temporal dead zone{{CompatUnknown}}{{CompatUnknown}}{{ CompatGeckoMobile(35) }}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
let expression {{non-standard_inline}}{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
let block {{non-standard_inline}}{{CompatNo}}{{CompatUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Allowed in {{Glossary("sloppy mode")}}{{CompatNo}}{{CompatChrome(49.0)}}{{CompatGeckoDesktop(44)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(49.0)}}
+
+ +

Firefox-spezifische Hinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/return/index.html b/files/de/web/javascript/reference/statements/return/index.html new file mode 100644 index 0000000000..aff9552712 --- /dev/null +++ b/files/de/web/javascript/reference/statements/return/index.html @@ -0,0 +1,192 @@ +--- +title: return +slug: Web/JavaScript/Reference/Statements/return +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/return +--- +
{{jsSidebar("Statements")}}
+ +

Die return Anweisung beendet einen Funktionsaufruf und spezifiziert einen Wert, der von der Funktion zum Aufrufer zurückgegeben wird.

+ +

Syntax

+ +
return [[expression]]; 
+ +
+
expression
+
Ausdruck, der zurückgegeben wird. Wenn er weggelassen wird, wird undefined zurückgegeben.
+
+ +

Beschreibung

+ +

Wenn in einer Funktion eine return Anweisung aufgerufen wird, wird der Aufruf der Funktion gestoppt. Wenn ein Rückgabewert spezifiziert ist, wird dieser zu der aufrufenden Funktion zurückgegeben. Wenn kein Rückgabewert angegeben wird, wird stattdessen undefined zurückgegeben. Die folgenden return Anweisungen unterbrechen alle den Funktionsaufruf:

+ +
return;
+return true;
+return false;
+return x;
+return x + y / 3;
+
+ +

Automatische Semikolon-Einfügung

+ +

Die return Anweisung wird von der automatischen Semikolon-Einfügung (Automatic semicolon insertion, kurz ASI) beeinflusst. Es ist kein Zeilenumbruch zwischen dem return Schlüsselwort und dem nachfolgenden Ausdruck erlaubt.

+ +
return
+a + b;
+
+ +

wird durch ASI umgewandelt in:

+ +
return;
+a + b;
+
+ +

Die Konsole wird folgende Warnung ausgeben: "unreachable code after return statement".

+ +
Mit Gecko 40 {{geckoRelease(40)}}, wird eine Warnung in der Konsole ausgegeben, wenn Quelltext gefunden wird, der nach einer return Anweisung steht.
+ +

Beispiele

+ +

return

+ +

Die folgende Funktion gibt das Quadrat von x zurück. Dabei ist x eine Zahl.

+ +
function square(x) {
+   return x * x;
+}
+
+ +

Unterbrechen einer Funktion

+ +

Eine Funktion stoppt die Ausführung, wenn return aufgerufen wird.

+ +
function counter() {
+  for (var count = 1; ; count++) {  // infinite loop
+    console.log(count + "A"); // until 5
+      if (count === 5) {
+        return;
+      }
+      console.log(count + "B");  // until 4
+    }
+  console.log(count + "C");  // never appears
+}
+
+counter();
+
+// Output:
+// 1A
+// 1B
+// 2A
+// 2B
+// 3A
+// 3B
+// 4A
+// 4B
+// 5A
+
+ +

Funktion als Rückgabewert

+ +

Sie dazu auch im Artikel Closures.

+ +
function magic(x) {
+  return function calc(x) { return x * 42 };
+}
+
+var answer = magic();
+answer(1337); // 56154
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-12.9', 'Return statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-return-statement', 'Return statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-return-statement', 'Return statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/switch/index.html b/files/de/web/javascript/reference/statements/switch/index.html new file mode 100644 index 0000000000..e53dc84fbe --- /dev/null +++ b/files/de/web/javascript/reference/statements/switch/index.html @@ -0,0 +1,289 @@ +--- +title: switch +slug: Web/JavaScript/Reference/Statements/switch +tags: + - JavaScript + - Reference + - Statement +translation_of: Web/JavaScript/Reference/Statements/switch +--- +
{{jsSidebar("Statements")}}
+ +

Die switch Anweisung wertet einen Ausdruck aus. Diese Auswertung wird mit einer case Klausel verglichen und (bei Übereinstimmung) die entsprechenden Anweisungen ausgeführt.

+ +

Syntax

+ +
switch (expression) {
+  case value1:
+    // Anweisungen werden ausgeführt,
+    // falls expression mit value1 übereinstimmt
+    [break;]
+  case value2:
+    // Anweisungen werden ausgeführt,
+    // falls expression mit value2 übereinstimmt
+    [break;]
+  ...
+  case valueN:
+    // Anweisungen werden ausgeführt,
+    // falls expression mit valueN übereinstimmt
+    [break;]
+  default:
+    // Anweisungen werden ausgeführt,
+    // falls keine der case-Klauseln mit expression übereinstimmt
+    [break;]
+}
+ +
+
expression
+
Ausdruck, der mit jeder case Klausel verglichen wird.
+
case valueN
+
Der Wert einer case Klausel wird mit expression verglichen.
+
+ +

Beschreibung

+ +

Ein switch Statement wertet als erstes den Ausdruck aus. Danach wird nach der ersten case Klausel gesucht, die zu dem gleichen Wert ausgewertet wird wie der erste Ausdruck im switch (mit striktem Vergleich, === ) und springt im Kontrollfluss zu der Klausel und führt die dort geschriebenen Statements aus. (Bei mehrfachen Übereinstimmungen springt das Programm zu der ersten gefundenen Klausel, auch wenn die gefunden Klausen nicht gleich sind.) Falls keine übereinstimmende case Klausel gefunden wird, sucht das Programm die optionale default Klausel und führt, wenn diese Klausel existiert, die Anweisungen in der Klausel aus. Wenn keine default Klausel vorhanden ist, wird das Programm nach dem switch Statement fortgesetzt. Konventionell ist die default Klausel die letzte Klausel, das muss aber nicht so sein.

+ +

Die optionale break Anweisung in jedem case Block weist das Programm an die switch Anweisung zu beenden. Das Programm macht dann mit der Anweisung weiter, die dem Ende der switch Anweisung folgt. Wird die break Anweisung weggelassen, dann macht das Programm linear weiter; es wird die nächste Anweisung ausgeführt.

+ +

Beispiele

+ +

Verwendung von switch

+ +

Betrachten wir das folgende Beispiel. Falls expr zu "Bananas" ausgewertet wird, dann springt das Programm zu der case Klausel "Bananas" und führt die entsprechenden Anweisungen aus. Die break Anweisung füht dazu, dass das Programm die switch Anweisung verlässt und mit der ersten Anweisung weitermacht, die dem Ende der switch Anweisung folgt.
+ Hätte man break weggelassen, dann hätte das Programm die Anweisungen der case Klausel "Cherries" ausgeführt.

+ +
switch (expr) {
+  case "Oranges":
+    console.log("Oranges are $0.59 a pound.");
+    break;
+  case "Apples":
+    console.log("Apples are $0.32 a pound.");
+    break;
+  case "Bananas":
+    console.log("Bananas are $0.48 a pound.");
+    break;
+  case "Cherries":
+    console.log("Cherries are $3.00 a pound.");
+    break;
+  case "Mangoes":
+  case "Papayas":
+    console.log("Mangoes and papayas are $2.79 a pound.");
+    break;
+  default:
+    console.log("Sorry, we are out of " + expr + ".");
+}
+
+console.log("Is there anything else you'd like?");
+
+ +

Was passiert, falls man eine break Anweisung weglässt?

+ +

Falls man eine break Anweisung vergisst, dann führt das Programm sowohl die übereinstimmende case Klausel als auch die darauf folgende case Klausel aus, unabhängig des Wertes der case Klausel.

+ +

Im Allgemeinen fährt das Programm linear fort bis es auf eine break Anweisung stößt. Falls keine break Anweisung vorhanden ist, dann werden alle Anweisungen bis zum Ende der switch Anweisung ausgeführt.

+ +
var foo = 0;
+switch (foo) {
+  case -1:
+    console.log('negative 1');
+    break;
+  case 0: // foo ist 0 - diese case-Klausel wird ausgeführt
+    console.log(0)
+    // HINWEIS: break Anweisung wurde hier weggelassen
+  case 1: // Da keine break Anweisung in 'case 0:'
+          // wird diese Klausel ebenfalls ausgeführt,
+          // obwohl der Wert nicht mit dem Ausdruck von
+          // switch übereinstimmt
+    console.log(1);
+    break; // das Programm verlässt die switch Anweisung.
+           // 'case 2:' wird nicht ausgeführt
+  case 2:
+    console.log(2);
+    break;
+  default:
+    console.log('default');
+}
+ +

Techniken für case Klauseln mit mehr als einem Kriterium

+ +

Die Quelle der erwähnten Methode kann hier aufgerufen werden (auf Englisch):
+ Switch statement multiple cases in JavaScript (Stack Overflow)

+ +

Mehrere case Klauseln mit einer einfachen Anweisung

+ +

Diese Technik macht es sich zum Vorteil, dass das Programm einfach bei der nächsten case Klausel weitermacht, wenn man die break Anweisung weglässt. Siehe Abschnitt "Was passiert, falls ich eine break Anweisung weglasse?"

+ +

Dieses Beispiel zeigt eine einfache Operation, die für alle entsprechenden case Klauseln ausgeführt wird ('Cow', 'Giraffe', 'Dog', 'Pig').

+ +
var Animal = 'Giraffe';
+switch (Animal) {
+  case 'Cow':
+  case 'Giraffe':
+  case 'Dog':
+  case 'Pig':
+    console.log('This animal will go on Noah\'s Ark.');
+    break;
+  case 'Dinosaur':
+  default:
+    console.log('This animal will not.');
+}
+ +

Mehrere case Klauseln mit mehreren Anweisungen

+ +

Dieses Beispiel zeigt wie mehrere Anweisungen verschiedener case Klauseln ausgeführt werden.
+ Die case Klauseln werden in geschriebener Reihenfolge ausgeführt, also unabhängig jeglicher Ordnung der Ausdrücke der case Klauseln.

+ +
var foo = 1;
+var output = 'Output: ';
+switch (foo) {
+  case 10:
+    output += 'So ';
+  case 1:
+    output += 'What ';
+    output += 'Is ';
+  case 2:
+    output += 'Your ';
+  case 3:
+    output += 'Name';
+  case 4:
+    output += '?';
+    console.log(output);
+    break;
+  case 5:
+    output += '!';
+    console.log(output);
+    break;
+  default:
+    console.log('Please pick a number from 0 to 6!');
+}
+ +

Mögliche Ergebnisse:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
WertAusgabe
10Output: So What Is Your Name?
1Output: What Is Your Name?
2Output: Your Name?
3Output: Name?
4Output: ?
5Output: !
Alle anderen WertePlease pick a number from 0 to 6!
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition.
+ Implementiert in JavaScript 1.2
{{SpecName('ES5.1', '#sec-12.11', 'switch statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-switch-statement', 'switch statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Unterstützt{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Unterstützt{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/throw/index.html b/files/de/web/javascript/reference/statements/throw/index.html new file mode 100644 index 0000000000..e022b01b54 --- /dev/null +++ b/files/de/web/javascript/reference/statements/throw/index.html @@ -0,0 +1,256 @@ +--- +title: throw +slug: Web/JavaScript/Reference/Statements/throw +tags: + - Ausnahmen + - JavaScript + - exceptions + - throw +translation_of: Web/JavaScript/Reference/Statements/throw +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Zusammenfassung

+ +

Die throw Anweisung "wirft" eine benutzerdefinierte Exception (Ausnahme). Die Programmausführung der aktuellen Funktion bzw. des globalen Codes wird angehalten (Anweisungen nach throw werden dann nicht mehr ausgeführt), und die Programmausführung wird an den nächsthöheren catch Block in der Ausführungshierarchie übergeben. Falls in der gesamten Ausführungschierarchie kein catch Block definiert wurde, wird das Programm komplett angehalten.

+ +

Syntax

+ +
throw ausdruck; 
+ +
+
ausdruck
+
Die zu werfende Ausnahme.
+
+ +

Beschreibung

+ +

Verwenden Sie die throw Anweisung, um eine Ausnahme zu werfen. Wenn Sie eine Ausnahme werfen,  bestimmt ausdruck den Typ der Ausnahme. Als Typ können Objekte (siehe Beispiel unten), als auch skalare Werte, wie Zeichenketten, Zahlen und boolesche Werte verwendet werden. Folgende Beispiele werfen jeweils eine Ausnahme:

+ +
throw "Fehler"; // erzeugt Ausnahme mit dem Wert "Fehler" (als String)
+throw 42;       // erzeugt Ausnahme mit dem Wert 42 (als Integer)
+throw true;     // erzeugt Ausnahme mit dem Wert TRUE (als boolescher Wert)
+ +

Beachten Sie auch, dass die throw-Anweisung von der automatic semicolon insertion (ASI) betroffen ist und daher kein Zeilenumbruch zwischen dem throw Schlüsselwort und dem Ausdruck zulässig ist.

+ +

Beispiele

+ +

Objekt als Ausnahme werfen

+ +

Als Ausnahme kann auch ein Objekt geworfen werden. Auf Eigenschaften des geworfenen Objektes kann dann im catch Block zugegriffen werden. Im folgenden Beispiel wird in der Funktion divide versucht Zahl n durch m zu dividieren. Falls m die Zahl 0 ist, wird ein Objekt (als Funktion) vom Typ DivisionException erzeugt und als Ausnahme geworfen, da Teilen durch 0 nicht möglich ist.

+ +
function DivisionException(message) {
+  this.message = message;
+  this.name = "DivisionException";
+}
+
+function divide(n, m) {
+  if (m == 0) {
+    throw new DivisionException("Teilen durch Null nicht möglich");
+  }
+
+  return n / m;
+}
+
+try {
+  // versuche 5 / 2 zu teilen
+  alert(divide(5, 2));  // 2.5
+
+  // versuche 5 / 0 zu teilen
+  var ausgabe = divide(5, 0);
+
+  // diese Zeile wird nie erreicht
+  alert(ausgabe);
+}
+catch (e) {
+  // "DivisionException: Teilen durch Null nicht möglich"
+  alert(e.name + ": " + e.message);
+}
+
+ +

Ausnahmen werden in der Regel als Funktionen definiert und mit dem new Schlüsselwort als Objekte instantiiert, da es in JavaScript kein direktes Konzept von Konstruktoren gibt, wie in anderen Programmiersprachen. Die Funktion dient dann selbst als Konstruktor. Falls in der catch Anweisung keine Unterscheidung der Ausnahme benötigt wird (z. B. mit Hilfe des instanceof Operators - siehe Beispiel unten), kann das Objekt direkt übergeben werden. Aus praktischen Gründen kann im geworfenen Objekt die Methode toString definiert werden, um es später einfacher ausgeben zu können:

+ +
try {
+  throw {
+    name: "MyException",
+    message: "Something is wrong",
+    toString: function() {
+      return this.name + ": " + this.message;
+    }
+  };
+}
+catch (e) {
+  alert(e); // "MyException: Something is wrong"
+}
+ +

Unterschiedliche Ausnahmen werfen und unterscheiden

+ +

Es ist möglich unterschiedliche Ausnahmen in einem try Block zu werfen und im dazugehörigen catch Block abzufangen. Dies erlaubt ein gezielteres Abfangen von Ausnahmen.

+ +
function myException(message) {
+  this.message = message;
+};
+
+function myOtherException(text) {
+  this.text = text;
+};
+
+var exceptions = [
+  "Don't panic! Where is my towel?",
+  42,
+  new myException("So long, and thanks for all the fish!"),
+  new myOtherException("Deep Thought is still watching..."),
+];
+
+for (var i=0; i < exceptions.length; i++) {
+  try {
+    throw exceptions[i];
+  }
+  catch (e) {
+    if (typeof e === "string") {
+      alert('String exception: ' + e);
+    }
+    else if (typeof e === "number") {
+      alert('Number exception: ' + e);
+    }
+    else if (typeof e === "object")
+    {
+      if (e instanceof myException) {
+        alert("myException: " + e.message);
+      }
+      else if (e instanceof myOtherException) {
+        alert("myOtherException: " + e.text);
+      }
+    }
+  }
+}
+
+ +

Abgefangene Ausnahmen neu werfen

+ +

Die throw Anweisung kann auch innerhalb eines catch Blocks verwendet werden, um eine neue oder die bereits abgefangene Ausnahme erneut zu werfen. Alle Anweisungen folgenden Anweisungen im catch Block werden wieder nicht ausgeführt und die neu geworfene Ausnahme wird an die nächsthöheren catch Block übergeben. Somit können "Ebenen" entworfen werden, die jeweils nur bestimmte Ausnahmen behandeln.

+ +

Folgender Quelltext zeigt "myException: This is an exception!" an, da der innere catch Block nicht für Ausnahmen vom Typ myOtherException zuständig ist und daher diese eine Ebene nach oben weiterleitet.

+ +
function myException(message) {
+  this.message = message;
+};
+
+function myOtherException(text) {
+  this.text = text;
+};
+
+try {
+  try {
+    throw new myOtherException("This is an exception!");
+  }
+  catch (e) {
+    if (e instanceof myException) {
+      alert("myException: " + e.message);  // wird nicht ausgeführt
+    } else {
+      throw e;  // eine Ebene nach oben weiterleiten
+    }
+  }
+}
+catch (e) {
+  alert("myException: " + e.text);
+}
+
+ +
+

Falls eine Exception durch keinen catch Block abgefangen wird, wird die Ausnahme in der JavaScript Konsole ausgegeben und die Programmausführung komplett unterbrochen.

+
+ +

 

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.4
{{SpecName('ES5.1', '#sec-12.13', 'throw statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-throw-statement', 'throw statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-throw-statement', 'throw statement')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/try...catch/index.html b/files/de/web/javascript/reference/statements/try...catch/index.html new file mode 100644 index 0000000000..d86c0c8120 --- /dev/null +++ b/files/de/web/javascript/reference/statements/try...catch/index.html @@ -0,0 +1,382 @@ +--- +title: try...catch +slug: Web/JavaScript/Reference/Statements/try...catch +translation_of: Web/JavaScript/Reference/Statements/try...catch +--- +
{{jsSidebar("Statements")}}
+ +

Die try...catch-Anweisung (sinngemäß: testen und verarbeiten) rahmt einen Block von Anweisungen (try statements) ein und legt Reaktionen (catch statementes) fest, die im Fehlerfall ausgeführt werden.

+ +

Syntax

+ +
try {
+   try_Anweisungen
+}
+[catch (Fehler_var_1 if Bedingung_1) { // nicht Standard
+   catch_Anweisungen
+}]
+...
+[catch (Fehler_var_2) {
+   catch_Anweisungen_2
+}]
+[finally {
+   finally_Anweisungen
+}]
+
+ +
+
try_Anweisungen
+
Die auszuführenden Anweisungen.
+
+ +
+
catch_Anweisungen_1, catch_Anweisungen_2
+
Anweisungen, die ausgeführt werden, wenn bei den try-Anweisungen ein Fehler auftritt.
+
+ +
+
Fehler_var_1, Fehler_var_2
+
Ein Bezeichner der das Fehlerobjekt des zugehörigen catch-Abschnitts enthält.
+
+ +
+
Bedingung_1
+
Ein Bedingungsausdruck.
+
+ +
+
finally_Anweisungen
+
Die Schlussanweisungen werden nach den try-Anweisungen ausgeführt. Die Anweisungen werden immer ausgeführt, auch wenn ein Fehler ausgegeben wurde. 
+
+ +

Beschreibung

+ +

Der try-Block besteht aus einer oder mehreren Anweisungen (der Absschnitt steht – auch bei nur einer Zeile – immer in geschweiften Klammern {}), mindestens einem catch- oder einem finally-Abschnitt oder beiden. Es gibt also drei Arten von try-Anweisungen:

+ +
    +
  1. try...catch
  2. +
  3. try...finally
  4. +
  5. try...catch...finally
  6. +
+ +

Der catch-Abschnitt enthält Anweisungen, die ausgeführt werden, wenn im try-Abschnitt ein Fehler auftritt. Bei einer fehlerhaften Anweisung im Block im try-Abschnitt – oder in Funktionen, die von dort aufgerufen werden – geht die Kontrolle sofort an den catch-Abschnitt über. Wird kein Fehler gemeldet wird der catch-Abschnitt nicht ausgeführt.

+ +

Der finally-Abschnitt wird nach dem try- und catch-Abschnitt ausgeführt. Der Abschnitt wird immer ausgeführt, egal ob ein Fehler aufgetreten ist oder nicht.

+ +

Mehrere try-Anweisungen können verschachtelt werden. Wenn ein innerer try-Block keinen catch-Abschnitt hat, wird der catch-Abschnitt des nächsthöheren try-Blocks ausgeführt.

+ +

Mit der try-Anweisungen können auch JavaScript-Fehler bearbeitet werden. Mehr zur Fehlerbearbeitung in JavaScript steht im JavaScript Guide.

+ +

Unbhängiger catch-Abschnitt

+ +

Wenn mit einem einzelnen, ungebundenen catch-Abschnitt gearbeitet wird, dann wird der catch-Block bei jedem Fehler durchlaufen. Wenn der Fehler im folgenden Beispiel-Code auftritt geht die Kontrolle an den catch-Abschnitt über.

+ +
try {
+   throw "myException"; // Fehler wird ausgelöst
+}
+catch (e) {
+   // Anweisungen für jeden Fehler
+   logMyErrors(e); // Fehler-Objekt an die Error-Funktion geben
+}
+
+ +

Im catch-Block wird ein Bezeichner festgelegt (e im Beispiel), die den Wert enthält, der durch die throw-Anweisung entstanden ist. Der catch-Block ist besonders, weil er zu Beginn der Ausführung einen Bezeichner anlegt, der für den gesamten Block gilt. Wenn der catch-Block abgearbeitet ist steht der Bezeichner nicht mehr zur Verfügung.

+ +

Abhängige catch-Abschnitte

+ +

{{non-standard_header}}

+ +

Mehrere abhängige catch-Abschnitte können spezifische Fehler bearbeiten. In diesem Fall wird der passende catch-Abschnitt aufgerufen, wenn der zugehörige Fehler aufgetreten ist. Im folgenden Beispiel kann der Code im try-Block drei mögliche Fehler ausgeben: {{jsxref("TypeError")}}, {{jsxref("RangeError")}}, and {{jsxref("EvalError")}} (Typ-Fehler, Bereich-Fehler und Rechenfehler). Wenn ein Fehler auftritt geht die Kontrolle an den zugehörigen catch-Abschnitt. Wenn dem Fehler kein catch-Abschnitt entspricht und ein unabhäniger catch-Abschnitt vorhanden ist, geht die Kontrolle an ihn.

+ +

Wenn mehrere abhängige catch-Abschnitt mit einem unabhängigen kombiniert werden, muss der unabhängige Abschnitt am Ende stehen: er fängt sonst alle Fehlertypen ab bevor sie die eigenen, abhängigen Abschnitte erreichen.

+ +

Zu Erinnerung: diese Funktionalität ist kein Teil der ECMAScript-Spezifikation.

+ +
try {
+    myroutine(); // erzeugt drei mögliche Fehlertypen
+} catch (e if e instanceof TypeError) {
+    // Anweisungen für die verschiedenen Fehlertypen
+} catch (e if e instanceof RangeError) {
+    // Anweisungen für Bereichsfehler
+} catch (e if e instanceof EvalError) {
+    // Anweisungen für Berechnungsfehler
+} catch (e) {
+    // Anweisungen für nicht festgelegte Fehlertypen
+    logMyErrors(e); // Objekt an die Fehler-Funktion geben
+}
+
+ +

Das nächste Beispiel zeigt, wie die gleichen "abhängigen catch-Abschnitte" aussehen, wenn einfaches JavaScript benutzt wird, das den ECMAScript-Spezifikationen entspricht (etwas umfangreicher, funktioniert aber genauso).

+ +
try {
+    myroutine(); // erzeugt drei mögliche Fehlertypen
+} catch (e) {
+    if (e instanceof TypeError) {
+        // Anweisungen für die verschiedenen Fehlertypen
+    } else if (e instanceof RangeError) {
+        // Anweisungen für Bereichsfehler
+    } else if (e instanceof EvalError) {
+        // Anweisungen für Berechnungsfehler
+    } else {
+       // Anweisungen für nicht festgelegte Fehlertypen
+       logMyErrors(e); // Objekt an die Fehler-Funktion geben
+    }
+}
+
+ +

Der Fehler-Bezeichner

+ +

Wenn im try-Block ein Fehler auftritt, enthält die exception_var (z.B. das e in catch(e)) den Wert, der durch die throw-Anweisung erzeugt wird. Mit diesem Bezeichner können also Informationen über den Fehler gewonnen werden.

+ +

Der Bezeichner gilt nur innerhalb des catch-Abschnitts. Er wird zu Beginn des Abschnitts angelegt und steht nach der Abarbeitung nicht mehr zur Verfügung.

+ +

Der finally-Abschnitt

+ +

Zum Abschluss-Abschnitt (finally) gehören die Anweisungen, die nach dem try- und dem catch-Block ausgeführt werden, noch bevor irgenwelche Anweisugnen nach den try-/catch-/finally-Abschnitten ausgeführt werden. Der finally-Abschnitt wird immer ausgeführt, auch wenn bei der Verarbeitung ein Fehler aufgetreten ist. Er wird auch ausgeführt, wenn kein catch-Abschnitt den Fehler bearbeitet. Der finally-Abschnitt kann dabei helfen, das eigene Script im Fehlerfall anständig zu beenden. Dort können zum Beispiel für ein übergreifendes Aufräumen Ressourcen wieder freigegeben werden, die durch das Script gebunden wurden.

+ +

Vielleicht sieht ein Abschnitt, der sich auf Fehler bezieht, aber UNABHÄNGIG vom tatsächlichen Auftreten eines Fehlers immer ausgeführt wird, merkwürdig aus. Aber dieses Konstrukt dient tatsächlich einem Zweck. Wichtig dabei ist nicht, dass der finally-Abschnitt immer aussgeführt wird, sonder das der normale Code nach einem try...catch NICHT ausgeführt wird. Wenn zum Beispiel in einem catch-Abschnitt, der zu einem try-Block gehört, ein Fehler auftritt, dann wird nichts von dem umgebenden Code ausgeführt, gleichgültig ob es ein umgebende try-catch-Blöcke oder normale Anweisungen sind. Die Kontrolle wird stattdessen an den catch-Abschnitt übergeben, der zum umgebenden try-Abschnitt gehört oder – wenn es den nicht gibt – an die interne Fehlerroutine. 

+ +

Auf diese Weise wird jeder nachfolgende Aufräum-Code im eingeschlossenen Abschnitt oder im normalen Programmablauf übersprungen. Wenn aber zum try-Abschnitt ein finally-Abschnitt gehört, dann kann in diesem Abschnitt aufgeräumt werden, bevor es in einen umgebenden catch-Abschnitt (oder den Fehlergenerator) geht, der dann den zweiten Fehler bearbeitet. 

+ +

Wenn unabhängig vom Erfolg des try...catch-Blocks aufgeräumt werden muss und der finally-Abschnitt nur nach einem Fehler ausgeführt würde, dann müsste der Aufräum-Code doppelt verwendet werden, innerhalb und außerhalb des finally-Abschnitts. Deshalb wird der finally-Block unabhängig von auftretenden Fehlern ausgeführt.

+ +

Das folgende Beispiel öffnet eine Datei und führt dann Anweisungen aus, die mit der Datei arbeiten (server-seitiges JavaScript lässt den Zugriff auf Dateien zu).  Wenn ein Fehler ausgegeben wird solange die Datei geöffnet ist, dann schließt der finally-Abschnitt diese Datei bevor das Script stoppt. Der Code im Abschnitt wird auch bei Returns aus try- oder catch-Blöcken ausgeführt.

+ +
openMyFile()
+try {
+   // bindet eine Ressource
+   writeMyFile(theData);
+}
+finally {
+   closeMyFile(); // Ressource immer wieder frei geben
+}
+
+ +

Examples

+ +

Verschachtelte try-Blöcke

+ +

Zuerst einmal untersuchen wir diese Beispiele:

+ +
try {
+  try {
+    throw new Error("oops");
+  }
+  finally {
+    console.log("finally");
+  }
+}
+catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Output:
+// "finally"
+// "outer" "oops"
+
+ +

Wenn wir den Fehler im inneren try-Block mit einem catch-Abschnitt bearbeiten

+ +
try {
+  try {
+    throw new Error("oops");
+  }
+  catch (ex) {
+    console.error("inner", ex.message);
+  }
+  finally {
+    console.log("finally");
+  }
+}
+catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Output:
+// "inner" "oops"
+// "finally"
+
+ +

Und jetzt wird der Fehler im catch-Abschnitt noch einmal produziert:

+ +
try {
+  try {
+    throw new Error("oops");
+  }
+  catch (ex) {
+    console.error("inner", ex.message);
+    throw ex;
+  }
+  finally {
+    console.log("finally");
+  }
+}
+catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Output:
+// "inner" "oops"
+// "finally"
+// "outer" "oops"
+
+ +

Jeder auftretende Fehler wird nur einmal bearbeitet, durch den nächsten umgebenden catch-Block (es sei denn, er wird erneut ausgegeben). Natürlich werden alle im inneren Abschnitt neu auftretenden Fehler durch den umschließenden Block bearbeitet.

+ +

Rückgaben aus einem finally-Block

+ +

Wenn der finally-Abschnitt ein Wert  zurückgibt, wird dieser Wert zum Rückgabewert der gesamten try-catch-finally-Veranstaltung, unabhänig von allen return-Anweisungen in den try- oder catch-Blöcken. Das gilt auch für Fehler im catch-Block:

+ +
try {
+  try {
+    throw new Error("oops");
+  }
+  catch (ex) {
+    console.error("inner", ex.message);
+    throw ex;
+  }
+  finally {
+    console.log("finally");
+    return;
+  }
+}
+catch (ex) {
+  console.error("outer", ex.message);
+}
+
+// Output:
+// "inner" "oops"
+// "finally"
+
+ +

Der äußere "oops"-Fehler wird nicht ausgelöst wegen des return im finally-Block. Das gleiche gilt für alle Werte, die aus dem catch-Abschnitt zurück gegeben werden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Erste Definition. Implementiert in JavaScript 1.4
{{SpecName('ES5.1', '#sec-12.14', 'try statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-try-statement', 'try statement')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-try-statement', 'try statement')}}{{Spec2('ESDraft')}} +

Fällt nicht unter den aktuellen ECMA-262-Standard: Mehrfache catch-Abschnitte und abhängige Abschnitte (SpiderMonkey extension, JavaScript 1.5).

+
+ +

Browser-Verträglichkeit

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FunktionChromeFirefox (Gecko)Internet ExplorerOperaSafari
Grundunter-stützung{{CompatVersionUnknown}}{{CompatGeckoDesktop("6")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
Abhängige Abschnitte
+ (Non-Standard)
{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FunktionAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
+ + + + + + + +
Grundunter-stützung 
+
{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+ + + + + + + +
Abhängige Abschnitte
+ (Non-Standard)
 
+
{{CompatNo}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/var/index.html b/files/de/web/javascript/reference/statements/var/index.html new file mode 100644 index 0000000000..bd11e7efd0 --- /dev/null +++ b/files/de/web/javascript/reference/statements/var/index.html @@ -0,0 +1,243 @@ +--- +title: var +slug: Web/JavaScript/Reference/Statements/var +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/var +--- +
+
{{jsSidebar("Statements")}}
+
+ +

Mit dem Schlüsselwort var deklariert man Variablen und initialisiert diese optional.

+ +

Syntax

+ +
var varname1 [= wert1] [, varname2 [= wert2] ... [, varnameN [=wertN]]];
+ +
+
varnameN
+
Variablenname. Jeder legale Bezeichner ist erlaubt.
+
+ +
+
wertN
+
Initialwert der Variablen. Jeder legale Ausdruck ist erlaubt.
+
+ +

Beschreibung

+ +

Variablendeklarationen werden immer ausgeführt bevor Programmcode ausgeführt wird, egal wo sie im Programmcode vorkommen. Der Gültigkeitsbereich einer Variablendeklaration mit var ist der aktuelle Kontext. Dieser ist der Kontext der umschließenden Funktion oder für Deklarationen außerhalb von Funktionen der globale Kontext.

+ +

Das Zuweisen eines Wertes zu einer nicht deklarierten Variablen führt immer dazu, dass eine globale Variable erstellt wird (die Variable wird auf dem globalen Objekt erstellt). Die Unterschiede zwischen deklarierten und nicht deklarierten Variablen sind:

+ +

1. Deklarierte Variablen sind immer in dem Kontext gültig, in dem sie deklariert wurden. Undeklarierte Variablen sind immer globale Variablen.

+ +
function x() {
+  y = 1;   // erzeugt einen ReferenceError im strict mode
+  var z = 2;
+}
+
+x();
+
+console.log(y); // gibt "1" aus
+console.log(z); // erzeugt einen ReferenceError: z ist nur in x verfügbar.
+
+ +

2. Deklarierte Variablen werden erstellt bevor Programmcode ausgeführt wird. Undeklarierte Variablen existieren nicht bevor die Zuweisung ausgeführt wurde.

+ +
console.log(a);                // erzeugt einen ReferenceError.
+console.log('still going...'); // wird nie ausgeführt
+ +
var a;
+console.log(a);                // gibt "undefined" oder "" aus, abhängig vom Browser.
+console.log('still going...'); // gibt "still going..." aus.
+ +

3. Deklarierte Variablen sind nicht konfigurierbare Attribute des ausführenden Kontexts (Funktion oder globaler Kontext). Undeklarierte Variablen sind konfigurierbar (z. B. sie können gelöscht werden).

+ +
var a = 1;
+b = 2;
+
+delete this.a; // erzeugt einen TypeError im strict mode. Andernfalls wird es ignoriert
+delete this.b;
+
+console.log(a, b); // erzeugt einen ReferenceError.
+// Das 'b' Attribut wurde gelöscht und existiert nicht länger.
+ +

Wegen dieser drei Unterschiede führt das Fehlen der Variablendeklaration zu unerwarteten Ergebnissen. Deswegen ist es empfohlen immer Variablen zu deklarieren, unabhängig davon, ob sie sich in einer Funktion oder im globalen Kontext befinden. Zudem wird im ECMAScript 5 {{jsxref("Functions_and_function_scope/Strict_mode", "strict mode")}} ein Fehler erzeugt, wenn einer nicht deklarierten Variablen ein Wert zugewiesen wird.

+ +

var hoisting

+ +

Weil Variablendeklarationen (und Deklarationen im Allgemeinen) vor dem Ausführen von Programmcode geschieht, ist das Deklarieren einer Variable irgendwo im Programmcode das gleiche, als würde sie am Anfang deklariert werden. Das bedeutet, dass eine Variable benutzt werden kann bevor sie im Programmcode deklariert wurde. Dieser Umstand wird "hoisting" genannt und wird möglich, weil die Deklaration der Variablen an den Anfang der Funktion oder den Anfang des globalen Programmcodes verschoben wird.

+ +
bla = 2
+var bla;
+// ...
+
+// Implizit wird Folgendes gemacht:
+
+var bla;
+bla = 2;
+
+ +

Aus diesem Grund ist es empfohlen Variablen immer am Anfang ihres Gültigkeitsbereiches zu definieren. Dadurch wird klarer, welche Variable vom lokalen Gültigkeitsbereich stammt und welche über die Gültigkeitsbereichekette gefunden werden muss.

+ +

Beispiele

+ +

Deklarieren und initialisieren zweier Variablen

+ +
var a = 0, b = 0;
+ +

Zuweisung zweier Variablen mit einer Zeichenkette

+ +
var a = "A";
+var b = a;
+
+// Das gleiche wie:
+
+var a, b = a = "A";
+
+ +

Sei aufmerksam mit der Reihenfolge:

+ +
var x = y, y = 'A';
+console.log(x + y); // undefinedA
+
+ +

x und y werden deklariert bevor Programmcode ausgeführt wird. Die Zuweisungen geschehen später. Wenn "x = y" ausgeführt wird, existiert y schon mit dem Wert undefined, weshalb kein Fehler erzeugt wird. x wird der Wert undefined zugewiesen. Dann wird y der Wert 'A' zugewiesen. Nach dieser einen Zeile ist demnach das Resultat x === undefined && y === 'A'.

+ +

Initialisierung mehrerer Variablen

+ +
var x = 0;
+
+function f(){
+  var x = y = 1; // x ist lokal Deklariert. y nicht!
+}
+f();
+
+console.log(x, y); // 0, 1
+// Nicht im strict-mode:
+// x ist die erwartetete globale Variable und nicht die lokale.
+// y wird global angelegt und der Wert 1 zugewiesen! 
+ +

Implizierte globale Variablen und Gültigkeitsbereiche äußerer Funktionen

+ +

Variablen die scheinbar global verfügbar sind, stammen manchmal aus dem Gültigkeitsbereich einer äußeren Funktion:

+ +
var x = 0;  // x ist global deklariert und mit dem Wert 0 initialisiert.
+
+console.log(typeof z); // undefined, solange z noch nicht existiert
+
+function a() { // Wenn a aufgerufen wird,
+  var y = 2;   // wird y in der Funktion a deklariert und der Wert 2 wird zugewiesen
+
+  console.log(x, y);   // 0 2
+
+  function b() {       // Wenn b aufgerufen wird,
+    x = 3;  // wird 3 der globalen Variablen x zugewiesen
+            // (es wird keine neue globale Variable erstellt)
+    y = 4;  // wird 4 der Variablen y (äußere Funktion) zugewiesen
+            // (es wird keine neue globale Variable erstellt)
+    z = 5;  // wird eine globale Variable z erstellt und der Wert 5 wird zugewiesen.
+  }         // (erzeugt einen ReferenceError im strict mode.)
+
+  b();     // Aufruf von b (erstellt z als globale Variable)
+  console.log(x, y, z);  // 3 4 5
+}
+
+a();                   // Aufruf von a und somit auch von b
+console.log(x, z);     // 3 5
+console.log(typeof y); // undefined weil y local in der Funktion a deklariert wurde.
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
+ Implementiert in JavaScript 1.0
{{SpecName('ES5.1', '#sec-12.2', 'var statement')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-variable-statement', 'variable statement')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-variable-statement', 'variable statement')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/statements/while/index.html b/files/de/web/javascript/reference/statements/while/index.html new file mode 100644 index 0000000000..d391fdbab1 --- /dev/null +++ b/files/de/web/javascript/reference/statements/while/index.html @@ -0,0 +1,102 @@ +--- +title: while +slug: Web/JavaScript/Reference/Statements/while +tags: + - JavaScript + - Statement +translation_of: Web/JavaScript/Reference/Statements/while +--- +
{{jsSidebar("Anweisungen")}}
+ +

Die while-Anweisung (Engl. statement) beschreibt eine Schleife, die solange durchlaufen wird wie die Schleifenbedingung wahr (Engl. true) ergibt. Die Schleifenbedingung (Engl. condition) wird am Anfang der Schleife ausgewertet.

+ +
{{EmbedInteractiveExample("pages/js/statement-while.html")}}
+ + + +

Syntax

+ +
while (condition) {
+  statement
+}
+ +
+
condition
+
Die Schleifenbedinung wird zu Anfang eines Schleifendurchlaufs ausgewertet. Ergibt die Auswertung wahr (true), dann wird der Schleifenkörper durchlaufen (statement wird ausgeführt). Ist die Bedingung falsch (false), dann fährt das Program mit der ersten Anweisung nach der while Schleife fort.
+
statement
+
Eine optionale Anweisung wird ausgeführt solange die Bedingung wahr (true) ist. Mehrere Anweisungen müssen in einer block Anweisung ({ ... }) gruppiert werden.
+
+ Bemerkung: Ein break-Statement kann eingesetzt werden, um die Schleife vorzeitig zu beenden, bevor die Bedingung auf false wechselt.
+
+ +

Beispiele

+ +

Die folgende while Schleife wird so oft durchlaufen wie n kleiner drei ist.

+ +
var n = 0;
+var x = 0;
+
+while (n < 3) {
+  n++;
+  x += n;
+}
+ +

In jedem Durchlauf wird n inkrementiert und zu x addiert. Die Schleifendurchläufe können wie folgt beschrieben werden:

+ + + +

Nach dem dritten Durchlauf ist die Schleifenbedingung nicht mehr wahr, und die Schleife wird beendet.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusBemerkung
{{SpecName('ESDraft', '#sec-while-statement', 'while statement')}}{{Spec2('ESDraft')}} 
{{SpecName('ES6', '#sec-while-statement', 'while statement')}}{{Spec2('ES6')}} 
{{SpecName('ES5.1', '#sec-12.6.2', 'while statement')}}{{Spec2('ES5.1')}} 
{{SpecName('ES3', '#sec-12.6.2', 'while statement')}}{{Spec2('ES3')}} 
{{SpecName('ES1', '#sec-12.6.1', 'while statement')}}{{Spec2('ES1')}}Initiale Definition
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.statements.while")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/strict_mode/index.html b/files/de/web/javascript/reference/strict_mode/index.html new file mode 100644 index 0000000000..84a7143787 --- /dev/null +++ b/files/de/web/javascript/reference/strict_mode/index.html @@ -0,0 +1,401 @@ +--- +title: Strict mode +slug: Web/JavaScript/Reference/Strict_mode +tags: + - ECMAScript5 + - JavaScript + - NeedsTranslation + - Strict Mode + - TopicStub +translation_of: Web/JavaScript/Reference/Strict_mode +--- +
{{JsSidebar("More")}}
+ +
Der normale, nicht-strikte Modus wird manchmal auch "{{Glossary("Sloppy Mode")}}" (schlampiger Modus) genannt. Das ist zwar keine offizielle Bezeichnung, aber behalten Sie das für den Fall der Fälle im Hinterkopf.
+ +

Der in ECMAScript 5 eingeführte strikte Modus von JavaScript ist eine Möglichkeit, sich für eine eingeschränkte Variante von JavaScript zu entscheiden, wodurch der "{{Glossary("Sloppy Mode")}}" implizit deaktiviert wird. Der strikte Modus ist nicht nur eine Teilmenge: Er hat absichtlich eine andere Semantik als normaler Code. Browser, die den strikten Modus nicht unterstützen, führen Code im strikten Modus anders aus, als Browser, die ihn unterstützen. Verlassen Sie sich daher nicht auf den strikten Modus, ohne vorher die relevanten Aspekte des strikten Modus zu testen. Code im strikten Modus und Code im nicht-strikten Modus können beidermaßen vorhanden sein, sodass Skripte nach und nach in den strikten Modus überführt werden können.

+ +

Der strikte Modus nimmt einige Änderungen an der normalen JavaScript-Semantik vor:

+ +
    +
  1. Bisher still ignorierte Fehler führen zum Skriptabbruch.
  2. +
  3. Behebt Fehler, die Optimierungen durch JavaScript-Interpreter erschweren oder verhindern. Code im strikten Modus kann manchmal schneller ausgeführt werden als identischer Code im nicht-strikten Modus.
  4. +
  5. Verbietet Syntax, die in zukünftigen Versionen von ECMAScript wahrscheinlich definiert wird.
  6. +
+ +

Siehe Wechsel zum Strict Mode, falls Ihr Code im eingeschränken Modus von JavaScript funktionieren soll.

+ +

In den strikten Modus schalten

+ +

Der strikte Modus gilt entweder für ganze Skripte oder einzelne Funktionen. Er kann nicht auf einen Anweisungsblock innerhalb geschweifter Klammern {} angewendet werden; bei einem solchen Versuch wird nichts passieren. Code, der an eval, Function oder Event-Handler-Attribute übergeben wird, sowie an {{domxref("WindowTimers.setTimeout()")}} übergebene Strings und dergleichen sind ganze Skripte, in denen das Einschalten des strikten Modus wie erwartet funktioniert.

+ +

Strikter Modus für Skripte

+ +

Um ein ganzes Skript in den strikten Modus zu schalten geben Sie genau die Anweisung "use strict"; (oder 'use strict';) als erste Anweisung, noch vor allen anderen Anweisungen an.

+ +
// Strikter Modus für komplettes Skript
+'use strict';
+var v = 'Hi!  Ich bin ein Skript im strikten Modus!';
+
+ +

Diese Syntax hat eine Falle, in die bereits auch eine große Seite getappt ist: Mehrere Skript-Dateien können nicht einfach aneinander gehängt werden.
+ Wird ein Skript B, das im strikten Modus laufen soll, an ein Skript A, das nicht im strikten Modus laufen soll, angehängt, erscheint das "use strict"; des angehängtes Skriptes B de facto in der Mitte der zusammengeführten Datei AB und wird folglich vom Interpreter ignoriert.
+ Ebenso wird im umgekehrten Fall ein eigentlich nicht-striktes Skript, das an ein striktes angehängt wurde, auch im vom ersten Skript gewünschten strikten Modus ausgeführt werden.

+ +

Die Verkettung von Skripten ist im Grunde nie ratsam, falls es aber nicht anders geht, ziehen Sie in Betracht den strikten Modus immer nur für einzelne Funktionen zu aktivieren.
+ Sie können auch den gesamten Inhalt eines Skripts in eine selbstausführende, anonyme Funktion einschließen und für diese den gewünschten Modus festlegen. Dadurch wird das Verkettungsproblem beseitigt, und Sie müssen alle gemeinsam genutzten Variablen explizit aus dem Geltungsbereich der Funktion exportieren.

+ +

Strikter Modus für Funktionen

+ +

Um eine Funktion in den strikten Modus zu schalten geben Sie genau die Anweisung "use strict"; (oder 'use strict';) im Rumpf der Funktion als erste Anweisung an, vor allen anderen.

+ +
function strict(){
+  // Syntac im strikten Modus auf Funktions-Ebene
+  'use strict';
+  function nested() { return 'Und ich auch!'; }
+  return 'Hi! Ich bin eine Funktion im strikten Modus! ' + nested();
+}
+function notStrict() { return 'Ich bin nicht strikt.'; }
+
+ +

Strikter Modus für Module

+ +

In ECMAScript 2015 wurden JavaScript-Module eingeführt und damit eine weitere Möglichkeit, in den strikten Modus zu schalten. Der gesamte Inhalt von JavaScript-Modulen wird per Definition im strikten Modus ausgeführt, ein ausdrückliches Einschalten ist nicht nötig.

+ +
function strict() {
+    // da ich ein Modul bin, bin ich standardmäßig strikt
+}
+export default strict;
+ +

Änderungen im strikten Modus

+ +

Der strikte Modus ändert sowohl die Syntax als auch das Laufzeitverhalten. Änderungen fallen im Allgemeinen in folgende Kategorien:

+ + + +

Versehen in Fehler umwandeln

+ +

Der strikte Modus wandelt einige zuvor still akzeptierte Versehen in ausdrückliche Fehler um. JavaScript wurde konzipiert, um Anfängern den Einstieg zu erleichtern und ignoriert Operationen, die eigentlich Fehler sind, stillschweigend. Manchmal wird dadurch das unmittelbare Problem behoben, das kann später jedoch größeren Problemen führen. Der strikte Modus behandelt diese Versehen als Fehler, so dass sie entdeckt und unverzüglich behoben werden können.

+ +

Erstens ist es im strikten Modus nicht mehr möglich, versehentlich eine globale Variable zu erstellen. Vertippt man sich bei einer Zuweisung einer Variable in normalem JavaScript wird eine neue Eigenschaft im globalen Objekt erstellt und alles "funktioniert" noch (es kann in Zukunft jedoch trotzdem schiefgehen: wahrscheinlich in modernem JavaScript). Im strikten Modus lösen Zuweisungen, die versehentlich globale Variablen erzeugen würden, einen Fehler aus:

+ +
'use strict';
+                     // Angenommen eine globale Variable mit dem Namen
+vertipeVaiable = 17; // vertippteVariable existiert, verursacht diese Zeile einen
+                     // ReferenceError, weil die Variable falsch geschrieben wurde
+
+ +

Zweitens löst der strikte Modus bei Zuweisungen, die sonst im Stillen fehlschlagen, eine Exception aus. NaN ist beispielsweise eine nicht beschreibbare globale Variable. Bei normalem Code passiert bei der Zuweisung zu NaN nichts weiter, insbesondere wird keine Fehlermeldung ausgegeben. Im strikten Modus löst die Zuweisung an NaN eine Exception aus. Jede Zuweisung, die im normalen Code unbemerkt fehlschlägt (Zuweisung an ein nicht beschreibbares globales Objekt oder an eine Eigenschaft, Zuweisung an eine Eigenschaft die nur einen Getter hat, Zuweisung an eine neue Eigenschaft eines nicht-existierenden Objekts), löst im strikten Modus eine Exception aus:

+ +
'use strict';
+
+// Zuweisung an ein nicht-beschreibbares, globales Objekt
+var undefined = 5; // verursacht TypeError
+var Infinity = 5; // verursacht TypeError
+
+// Zuweisung an eine nicht-beschreibbare Eigenschaft
+var obj1 = {};
+Object.defineProperty(obj1, 'x', { value: 42, writable: false });
+obj1.x = 9; // verursacht TypeError
+
+// Zuweisung an eine Eigenschaft, die nur einen Getter hat
+var obj2 = { get x() { return 17; } };
+obj2.x = 5; // verursacht TypeError
+
+// Zuweisung einer neuen Eigenschaft an ein nicht-erweiterbares Objekt
+var fixed = {};
+Object.preventExtensions(fixed);
+fixed.newProp = 'ohai'; // verursacht TypeError
+ +

Drittens löst der strikte Modus beim Versuch unlöschbare Eigenschaften zu löschen ebenfalls eine Exception aus:

+ +
'use strict';
+delete Object.prototype; // verursacht TypeError
+
+ +

Viertens erforderte der strikte Modus bis ECMAScript 2015 (vor Gecko 34), dass alle in einem Objekt-Literal aufgeführten Eigenschaften eindeutig definiert werden. Normaler Code kann Eigenschaften mehrfach definieren, wobei die letzte Definition den Wert der Eigenschaft bestimmt.

+ +
+

Dies ist seit ECMAScript 2015 nicht mehr der Fall ({{bug(1041128)}}).

+
+ +
'use strict';
+var o = { p: 1, p: 2 }; // !!! Syntaxfehler
+
+ +

Fünftens erfordert der strikte Modus, dass die Namen der Funktionsparameter eindeutig sind. Im normalen Code verbirgt das letzte duplizierte Argument vorherige gleichnamige Argumente. Diese vorherigen Argumente sind weiterhin durch arguments[i] verfügbar, sodass sie nicht gänzlich unzugänglich sind. Dieses Verstecken ist jedoch wenig sinnvoll und wahrscheinlich unerwünscht (z. B. bei einem Tippfehler), sodass im strikten Modus doppelte Argumentnamen einen Syntaxfehler darstellen:

+ +
function sum(a, a, c) { // !!! Syntaxfehler
+  'use strict';
+  return a + a + c; // falsch, wenn dieser Code ausgeführt würde
+}
+
+ +

Sechstens verbietet der strikte Modus seit ECMAScript 5 die allein führende Null als Syntax für Oktalzahlen, zum Beispiel ist 0644 === 420 oder "\ 045" === "%". Diese oktale Syntax ist nicht Teil von ECMAScript 5, wird jedoch von allen Browsern unterstützt. In ECMAScript 2015 werden oktalen Zahlen stattdessen die Zeichen 0o vorangestellt:

+ +
var a = 0o10; // ES2015: Octal
+
+ +

Anfänger glauben manchmal, dass führende Nullen entsprechend der landläufigen Nutzung des Dezimalsystems keine semantische Bedeutung für den Wert der Zahl an sich hat – und verwenden sie zur Ausrichtung. Dies führt in Javascript jedoch unweigerlich zum Wechsel vom Dezimal- in das Oktalsystem und ergibt mithin einen völlig anderen Wert! Daher sind führende Nullen im strikten Modus ein Syntaxfehler:

+ +
'use strict';
+var sum = 015 + // !!! Syntaxfehler
+          197 +
+          142;
+
+var sumWithOctal = 0o10 + 8;
+console.log(sumWithOctal); // 16
+
+ +

Siebtens verbietet der strikte Modus in ECMAScript 2015 das Zuweisen von Eigenschaften an {{Glossary("primitive")}} Werte. Ohne den strikten Modus wird das einfach ignoriert (no-op), mit dem strikten Modus wird jedoch ein {{jsxref("TypeError")}} ausgelöst.

+ +
(function() {
+'use strict';
+
+false.true = '';         // TypeError
+(14).sailing = 'home';   // TypeError
+'with'.you = 'far away'; // TypeError
+
+})();
+
+ +

Vereinfachung der Verwendung von Variablen

+ +

Der strikte Modus vereinfacht die Zuordnung von Variablennamen zu bestimmten Variablendefinitionen im Code. Viele Compiler-Optimierungen setzen voraus, dass die Variable X an diesem Ort gespeichert wird. Dies ist für die vollständige Optimierung von JavaScript-Code von entscheidender Bedeutung. JavaScript macht es manchmal unmöglich, diese grundlegende Zuordnung von Name zu Variablendefinition im Code bis zur Laufzeit durchzuführen. Der strikte Modus entfernt die meisten Fälle, in denen dies geschieht, sodass der Compiler den Code im strikten Modus besser optimieren kann.

+ +

Erstens verbietet der strikte Modus with. Das Problem bei with ist, dass ein beliebiger Name innerhalb des Blocks entweder

+ + + +

Es ist unmöglich vorher zu wissen, welcher Fall eintritt. Der strikte Modus macht aus with einen Syntaxfehler, sodass keine Möglichkeit besteht, dass ein Name innerhalb von with zur Laufzeit auf einen unbekannten Ort verweist:

+ +
'use strict';
+var x = 17;
+with (obj) { // !!! Syntaxfehler
+  // Wenn dies nicht der strikte Modus wäre, wäre dies var x
+  // oder wäre es stattdessen obj.x? Es ist im Allgemeinen unmöglich,
+  // dies ohne Ausführen des Codes vorherzusagen, daher kann der Name
+  // nicht optimiert werden.
+  x;
+}
+
+ +

Die simple Alternative, ein Objekt einer Variablen mit kurzem Namen zuzuweisen, um dann auf die entsprechende Eigenschaft dieser Variable zuzugreifen, macht with überflüssig.

+ +

Zweitens führt eval im strikten Modus keine neuen Variablen in den umgebenden Geltungsbereich ein. In normalem Code fügt eval("var x;") eine Variable x in die umgebende Funktion oder den globalen Gültigkeitsbereich ein. Das bedeutet im Allgemeinen, dass in einer Funktion, die einen eval-Aufruf enthält, jeder Name, der sich nicht auf ein Argument oder eine lokale Variable bezieht, zur Laufzeit einer bestimmten Definition zugeordnet werden muss (da eval eine neue Variable eingeführt haben könnte, die die äußere Variable verbirgt). Im strikten Modus erstellt eval nur Variablen für den auszuwertenden Code. Daher kann eval nicht beeinflussen, ob ein Name auf eine äußere oder eine lokale Variable verweist:

+ +
var x = 17;
+var evalX = eval("'use strict'; var x = 42; x;");
+console.assert(x === 17);
+console.assert(evalX === 42);
+
+ +

Wenn die Funktion eval von einem Ausdruck der Form eval(...) in Code im strikten Modus aufgerufen wird, wird der Code ebenfalls im strikten Modus ausgewertet. Der Code kann zwar explizit den strikten Modus aufrufen, dies ist jedoch überflüssig.

+ +
function strict1(str) {
+  'use strict';
+  return eval(str); // str wird als Code im strikten Modus betrachtet
+}
+function strict2(f, str) {
+  'use strict';
+  return f(str); // kein eval(...): str ist nur dann strikt wenn
+                 // es den strikten Modus aufruft
+}
+function nonstrict(str) {
+  return eval(str); // str ist nur dann strikt wenn
+                    // es den strikten Modus aufruft
+}
+
+strict1("'Code im strikten Modus!'");
+strict1("'use strict'; 'Code im strikten Modus!'");
+strict2(eval, "'Code im nicht-strikten Modus.'");
+strict2(eval, "'use strict'; 'Code im strikten Modus!'");
+nonstrict("'Code im nicht-strikten Modus.'");
+nonstrict("'use strict'; 'Code im strikten Modus!'");
+
+ +

Daher verhalten sich Namen in eval-Code im strikten Modus identisch zu solchen die in regulärem Code im strikten Modus geschrieben wurden, welche kein Ergebnis eines eval-Ausdrucks sind.

+ +

Drittens verbietet der strikte Modus das Löschen bloßer Namen. delete name ist im strikten Modus ein Syntaxfehler:

+ +
'use strict';
+
+var x;
+delete x; // !!! Syntaxfehler
+
+eval('var y; delete y;'); // !!! Syntaxfehler
+
+ +

Vereinfachung von eval und arguments

+ +

Der strikte Modus macht arguments und eval weniger bizarr. Beide haben in normalem Code ein erhebliches Maß an fragwürdigem Verhalten: eval fügt Bindungen hinzu, entfernt sie oder ändert ihre Werte, während arguments durch seine indizierten Eigenschaften benannten Argumenten Aliase gibt. Der strikte Modus versucht eval und arguments möglichst als Schlüsselwörter zu behandeln, obwohl vollständige Korrekturen erst in einer zukünftigen Ausgabe von ECMAScript verfügbar sein werden.

+ +

Erstens können eval und arguments nicht mit Sprachsyntax gebunden oder zugewiesen werden. Sämtliche Versuche dies zu tun verursachen Syntaxfehler:

+ +
'use strict';
+eval = 17;
+arguments++;
+++eval;
+var obj = { set p(arguments) { } };
+var eval;
+try { } catch (arguments) { }
+function x(eval) { }
+function arguments() { }
+var y = function eval() { };
+var f = new Function('arguments', "'use strict'; return 17;");
+
+ +

Zweitens vergibt Code im strikten Modus Eigenschaften keine Aliase, die in arguments-Objekten erstellt wurden. In normalem Code innerhalb einer Funktion, deren erstes Argument arg ist, setzt das Festlegen von arg auch arguments[0] und umgekehrt (sofern keine Argumente angegeben wurden oder arguments[0] gelöscht wird). arguments-Objekte für Funktionen im strikten Modus speichern die ursprünglichen Argumente, wenn die Funktion aufgerufen wird. arguments[i] verfolgt weder den Wert des entsprechenden benannten Arguments, noch verfolgt ein benanntes Argument den Wert im entsprechenden arguments[i].

+ +
function f(a) {
+  'use strict';
+  a = 42;
+  return [a, arguments[0]];
+}
+var pair = f(17);
+console.assert(pair[0] === 42);
+console.assert(pair[1] === 17);
+
+ +

Drittens wird arguments.callee nicht mehr unterstützt. In normalem Code bezieht sich arguments.callee auf die umschließende Funktion. Dieser Anwendungsfall ist schwach: benennen Sie einfach die umschließende Funktion! Darüber hinaus behindert arguments.callee Optimierungen wie das Inlining von Funktionen im Wesentlichen, da es möglich sein muss, einen Verweis auf die nicht Inline-Funktion bereitzustellen, wenn auf arguments.callee zugegriffen wird. arguments.callee für Funktionen im strikten Modus ist eine nicht löschbare Eigenschaft, die beim Zuweisen oder Abrufen eine Exception auslöst:

+ +
'use strict';
+var f = function() { return arguments.callee; };
+f(); // verursacht TypeError
+
+ +

JavaScript "absichern"

+ +

Der strikte Modus erleichtert das Schreiben von "sicherem" JavaScript. Einige Websites bieten Benutzern heute die Möglichkeit, JavaScript zu schreiben, das von der Website für andere Benutzer ausgeführt wird. JavaScript in Browsern kann auf die privaten Informationen des Benutzers zugreifen. Daher muss JavaScript vor der Ausführung teilweise transformiert werden, um den Zugriff auf verbotene Funktionalität zu sperren. Ohne viele Laufzeitüberprüfungen macht die Flexibilität von JavaScript dies praktisch unmöglich. Bestimmte Sprachfunktionen sind so tiefgreifend, dass die Durchführung von Laufzeitüberprüfungen erhebliche Leistungseinbußen nach sich zieht. Ein paar Feinjustierungen im strikten Modus sowie die Notwendigkeit, dass vom Benutzer eingegebenes JavaScript im strikten Modus läuft und auf bestimmte Weise aufgerufen wird, reduzieren die Laufzeitprüfungen erheblich.

+ +

Erstens wird der als this übergebene Wert an eine Funktion im strikten Modus nicht zwingend zu einem Objekt (auch "boxed" genannt). Bei einer normalen Funktion ist this immer ein Objekt: Entweder das bereitgestellte Objekt, wenn this mit einem Objektwert aufgerufen wird; der boxed Wert, wenn mit this mit einem Boolean, einem String oder Number aufgerufen wird; oder das globale Objekt, wenn es mit einem undefined oder null this aufgerufen wird (verwenden Sie call, apply oder bind, um ein bestimmtes zu this spezifizieren). Automatisches Boxing ist nicht nur mit Leistungseinbußen verbunden, es ist darüber hinaus ein Sicherheitsrisiko das globale Objekt in Browsern verfügbar zu machen, da das globale Objekt Zugriff auf Funktionen bietet, die "geschützte" JavaScript-Umgebungen einschränken müssen. Für eine Funktion im strikten Modus wird das übergebene this nicht in ein Objekt geboxed, und wenn keine Angabe erfolgt, wird this zu undefined:

+ +
'use strict';
+function fun() { return this; }
+console.assert(fun() === undefined);
+console.assert(fun.call(2) === 2);
+console.assert(fun.apply(null) === null);
+console.assert(fun.call(undefined) === undefined);
+console.assert(fun.bind(true)() === true);
+
+ +

Das bedeutet unter anderem, dass es in Browsern nicht mehr möglich ist, das window-Objekt innerhalb einer Funktion im strikten Modus durch this zu referenzieren.

+ +

Zweitens ist es im strikten Modus nicht mehr möglich, den JavaScript-Stack über allgemein implementierte Erweiterungen von ECMAScript zu "durchwandern". Ist in normalem Code eine Funktion namens fun mitten in der Ausführung ist fun.caller die Funktion die zuletzt fun aufgerufen hat und fun.arguments ist das arguments des Aufrufs von fun. Beide Erweiterungen sind für "sicheres" JavaScript problematisch, weil sie es "sicherem" Code erlauben auf "priviligierte" Funktionen und ihre (potentiell ungesicheren) argumente zuzugreifen. Wenn fun im strikten Modus ist, sind sowohl fun.caller als auch fun.argument nicht-löschbare Eigenschaften, die eine Exception auslösen wenn man versucht auf sie zuzugreifen:

+ +
function restricted() {
+  'use strict';
+  restricted.caller;    // verursacht TypeError
+  restricted.arguments; // verursacht TypeError
+}
+function privilegedInvoker() {
+  return restricted();
+}
+privilegedInvoker();
+
+ +

Drittens gewährt arguments in Funktionen im strikten Modus keinen Zugriff mehr auf die entsprechenden Variablen des Funktionsaufrufs. In einigen ECMAScript-Implementierungen war arguments.caller ein Objekt, dessen Eigenschaften Aliase zu Funktions-Variablen darstellten. Dies ist ein Sicherheitsrisiko, da es die Möglichkeit priviligierte Werte durch Funktionsabstraktion auszublenden einschränkt; es schließt darüber hinaus die meisten Optimierungen aus. Aus diesen Gründen implementieren aktuellen Browser es auch nicht. Aufgrund seiner historischen Funktionalität ist arguments.caller jedoch für eine Funktion im strikten Modus auch eine nicht-löschbare Eigenschaft, die beim Zuweisen oder Abrufen eine Exception auslöst:

+ +
'use strict';
+function fun(a, b) {
+  'use strict';
+  var v = 12;
+  return arguments.caller; // verursacht TypeError
+}
+fun(1, 2); // gibt v nicht preis (oder a oder b)
+
+ +

Wegbereiter für zukünftige ECMAScript-Versionen

+ +

Zukünftige ECMAScript-Versionen werden wahrscheinlich eine neue Syntax einführen, und der strikte Modus in ECMAScript 5 enthält einige Einschränkungen, um den Übergang zu erleichtern. Es ist einfacher, einige Änderungen vorzunehmen, wenn die Grundlagen dieser Änderungen im strikten Modus verboten sind.

+ +

Erstens wird im strikten Modus eine kleine Anzahl von Bezeichnern reservierte Schlüsselwörter. Diese sind implements, interface, let, package, private, protected, public, static und yield. Im strikten Modus können Sie daher keine Variablen oder Argumente mit diesen Namen benennen oder verwenden.

+ +
function package(protected) { // !!!
+  'use strict';
+  var implements; // !!!
+
+  interface: // !!!
+  while (true) {
+    break interface; // !!!
+  }
+
+  function private() { } // !!!
+}
+function fun(static) { 'use strict'; } // !!!
+
+ +

Zwei Mozilla-spezifische Vorbehalte:

+ + + +

Zweitens verbietet der strikte Modus Funktionsanweisungen, die nicht auf der obersten Ebene eines Skripts oder einer Funktion stehen. Im normalen Modus sind Funktionsanweisungen in Browsern "überall" zulässig. Dies ist nicht Teil von ES5 (oder gar ES3)! Es ist eine Erweiterung mit inkompatibler Semantik in verschiedenen Browsern. Beachten Sie, dass Funktionsanweisungen außerhalb der obersten Ebene in ES2015 zulässig sind.

+ +
'use strict';
+if (true) {
+  function f() { } // !!! Syntaxfehler
+  f();
+}
+
+for (var i = 0; i < 5; i++) {
+  function f2() { } // !!! Syntaxfehler
+  f2();
+}
+
+function baz() { // koscher
+  function eit() { } // ebenfalls koscher
+}
+
+ +

Dieses Verbot ist eigentlich nicht Teil des strikten Modus, da solche Funktionsanweisungen eine Erweiterung von grundlegendem ES5 sind. Dies ist jedoch die Empfehlung des ECMAScript-Komitees und Browser werden es implementieren.

+ +

Strikter Modus in Browsern

+ +

Die wichtigsten Browser implementieren heute den strikten Modus. Verlassen Sie sich jedoch nicht blind darauf, da in freier Wildbahn immer noch zahlreiche Browser-Versionen verwendet werden, die den strikten Modus nur teilweise oder gar nicht unterstützen (z. B. Internet Explorer vor Version 10!). Strikter Modus ändert die Semantik. Sich auf diese Änderungen zu verlassen, führt zu Versehen und Fehlern in Browsern, die den strikten Modus nicht implementieren. Seien Sie vorsichtig im strikten Modus und erhöhen Sie die Verlässlichkeit des strikten Modus mit Funktionstests, die prüfen, ob die für Ihren Code relevante Teile des strikten Modus implementiert sind. Testen Sie Ihren Code in Browsern, die den strikten Modus unterstützen und nicht unterstützen. Wenn Sie nur in Browsern testen, die den strikten Modus nicht unterstützen, bekommen Sie wahrscheinlich Probleme in Browsern, die ihn unterstützen, und umgekehrt.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-10.1.1', 'Strict Mode Code')}}{{Spec2('ES5.1')}}Erste Definition. Siehe: Strict mode restriction and exceptions
{{SpecName('ES6', '#sec-strict-mode-code', 'Strict Mode Code')}}{{Spec2('ES6')}}Strict mode restriction and exceptions
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/template_strings/index.html b/files/de/web/javascript/reference/template_strings/index.html new file mode 100644 index 0000000000..54885ed5a3 --- /dev/null +++ b/files/de/web/javascript/reference/template_strings/index.html @@ -0,0 +1,219 @@ +--- +title: Template-Strings +slug: Web/JavaScript/Reference/template_strings +translation_of: Web/JavaScript/Reference/Template_literals +--- +
{{JsSidebar("More")}}
+ +

Template-Strings sind {{jsxref("String", "String-Symbole")}}, die über mehrere Zeilen gehende Zeichenketten sowie eingebettete Javascript-Ausdrücke ermöglichen.

+ +

Syntax

+ +
`string text`
+
+`string text line 1
+ string text line 2`
+
+`string text ${expression} string text`
+
+tag `string text ${expression} string text`
+
+ +

Beschreibung

+ +

Template-Strings sind anstelle von doppelten bzw. einfachen Anführungszeichen in zwei Akzente Gravis ` (Französisch: accent grave, Englisch: backtick) eingeschlossen.

+ +

Sie können Platzhalter beinhalten, die durch das Dollarsymbol gefolgt von geschweiften Klammern gekennzeichnet sind (${expression}). Auf diese Weise dienen sie als Vorlagen (Englisch: template), die, zentral definiert, während des Programmablaufs an verschiedenen Stellen individuell eingesetzt werden können.

+ +

Die Ausdrücke in den Platzhaltern sowie der Text selbst können an eine optionale Funktion übergeben werden. Falls vor dem Template-String ein Ausdruck vorhanden ist (hier als tag bezeichnet), wird der Template-String „Tagged Template String“ genannt. In diesem Fall wird der tag-Ausdruck (üblicherweise eine Funktion) mit dem verarbeiteten Template-String aufgerufen, um den Text vor der Ausgabe zu bearbeiten.

+ +

Ein Gravis kann in einen Template-String durch Maskieren mit dem Rückstrich \ eingefügt werden:

+ +
`\`` === '`' // --> true
+ +

Der Gravis und das einfache Anführungszeichen

+ +

Der Gravis befindet sich auf deutschen Tastaturen rechts neben dem ß und ist nur zusammen mit der Hochstelltaste und einer anschließenden Betätigung der Leertaste zu erreichen.

+ +

Das Zeichen wird gelegentlich mit dem einfachen Anführungszeichen ' verwechselt; dieses befindet sich rechts neben dem Ä.

+ +

Im normalen Sprachgebrauch wird es meist zusammen mit den Tasten e oder a genutzt um è bzw. à zu schreiben, analog zur Notwendigkeit einer zusätzlichen Betätigung der Leertaste für ` alleine.

+ +

Mehrzeilige Zeichenketten

+ +

In normale Zeichenketten sind Zeilenumbrüche nur durch Einfügen der Sequenz \n zu erreichen:

+ +
console.log("string text line 1\nstring text line 2");
+// Ausgabe:
+// string text line 1
+// string text line 2
+
+// Identische Ausgabe, jedoch deutlicher durch Trennung:
+console.log("string text line 1\n" +
+"string text line 2");
+
+ +

Das gleiche Ergebnis kann mit Template-Strings einfacher und übersichtlicher erreicht werden, indem der Text so, wie er erscheinen soll, über mehrere Zeilen geschrieben wird:

+ +
console.log(`string text line 1
+string text line 2`);
+// Ausgabe:
+// string text line 1
+// string text line 2
+ +

Ausdrücke in Zeichenketten

+ +

Um Javascript-Ausdrücke in normale Strings einzufügen, müsste die folgende Syntax genutzt werden:

+ +
var a = 5;
+var b = 10;
+console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
+// Ausgabe:
+// Fifteen is 15 and
+// not 20.
+ +

Mit Template-Strings können nun die syntaktischen Vorteile genutzt werden um solche Ersetzungen leserlicher zu machen:

+ +
var a = 5;
+var b = 10;
+console.log(`Fifteen is ${a + b} and
+not ${2 * a + b}.`);
+// Ausgabe:
+// Fifteen is 15 and
+// not 20.
+ +

Verschachtelte Vorlagen

+ +

Das Verschachteln von Template-Strings ist manchmal die einfachste und lesbarste Möglichkeit, konfigurierbare Vorlagen zu erhalten, denn auch innerhalb von ${ } können Template-Strings verwendet werden

+ +

Die nachfolgenden drei Beispiele haben eine identische Funktion:

+ +

ECMAScript 5:

+ +
let classes = 'header';
+classes += (isLargeScreen() ?
+  '' : item.isCollapsed ?
+    ' icon-expander' : ' icon-collapser');
+
+ +

Eine nicht verschachtelte Vorlage mit ECMAScript 2015:

+ +
const classes = `header ${ isLargeScreen() ? '' :
+  (item.isCollapsed ? 'icon-expander' : 'icon-collapser') }`;
+ +

Verschachtelte Vorlage mit ECMAScript 2015:

+ +
const classes = `header ${ isLargeScreen() ? '' :
+  `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;
+ +

Tagged Template-Strings

+ +

Eine erweiterte Form der Template-Strings sind Tagged Template-Strings. Mit ihnen kann die Ausgabe von Template-Strings mit einer Funktion ändern.

+ +

Das erste Argument enthält ein Array von Strings ("Hello" und "world" in diesem Beispiel). Alle Argumente nach dem ersten sind die Werte der verarbeiteten (manchmal auch cooked genannt, „vorgekocht“) Ausdrücke (hier: "15" und "50").

+ +

Im folgenden Beispiel heißt die Funktion tag, was aber keinen besonderen Grund hat, da sie jeden gewünschten Namen haben kann.

+ +
var a = 5;
+var b = 10;
+
+function tag(strings, ...values) {
+  console.log(strings[0]); // "Hello "
+  console.log(strings[1]); // " world "
+  console.log(values[0]);  // 15
+  console.log(values[1]);  // 50
+
+  return "Bazinga!";
+}
+
+tag`Hello ${ a + b } world ${ a * b}`;
+// "Bazinga!"
+
+ +

Tag-Funktionen müssen keinen String zurückgeben, wie das folgende Beispiel zeigt.

+ +
function template(strings, ...keys) {
+  return (function(...values) {
+    var dict = values[values.length - 1] || {};
+    var result = [strings[0]];
+    keys.forEach(function(key, i) {
+      var value = Number.isInteger(key) ? values[key] : dict[key];
+      result.push(value, strings[i + 1]);
+    });
+    return result.join('');
+  });
+}
+
+var t1Closure = template`${0}${1}${0}!`;
+t1Closure('Y', 'A');  // "YAY!"
+var t2Closure = template`${0} ${'foo'}!`;
+t2Closure('Hello', {foo: 'World'});  // "Hello World!"
+
+ +

Raw Strings

+ +

Die Eigenschaft raw, verfügbar für das erste Argument eines Tagged Template-Strings, erlaubt den Zugriff auf den unverarbeiteten String, also ohne Escape-Sequenzen auszuwerten.

+ +
function tag(strings, ...values) {
+  console.log(strings.raw[0]);
+  // "string text line 1 \\n string text line 2"
+}
+
+tag`string text line 1 \n string text line 2`;
+
+ +

Zusätzlich exisitert die Methode {{jsxref("String.raw()")}} um unverarbeitete Strings zu erstellen, genauso wie sie die vorgegebene Template-Funktion und String-Verknüpfung erstellen würde.

+ +
String.raw`Hi\n${2+3}!`;
+// "Hi\\n5!"
+
+str.length;
+// 6
+
+str.split('').join(',');
+// "H,i,\,n,5,!"
+
+ +

Sicherheit

+ +

Template-Strings SOLLTEN NIEMALS von Nutzern erstellt werden, denen nicht vertraut werden kann, da diese Zugriff auf Variablen und Funktionen haben.

+ +
`${console.warn("this is",this)}`; // "this is" Window
+
+let a = 10;
+console.warn(`${a+=20}`); // "30"
+console.warn(a); // 30
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-template-literals', 'Template Literals')}}{{Spec2('ES6')}}Erste Definition. Definiert in mehreren Abschnitten der Spezifikation: Template Literals, Tagged Templates
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.grammar.template_literals")}}

+ +

See also

+ + diff --git a/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/index.html b/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/index.html new file mode 100644 index 0000000000..412bddc553 --- /dev/null +++ b/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/index.html @@ -0,0 +1,291 @@ +--- +title: Veraltete und abgeschaffte Features +slug: Web/JavaScript/Reference/Veraltete_und_abgeschaffte_Features +translation_of: Web/JavaScript/Reference/Deprecated_and_obsolete_features +--- +
{{JsSidebar("More")}}
+ +

Diese Seite listet die Features JavaScriptes auf, die veraltet sind( das bedeutet, dass noch benutzbar, aber Entfernung geplant) und abgeschafft sind( das bedeutet: nicht länger benutzbar).

+ +

Veraltete Features

+ +

Diese veralteten Features können noch benutzt werden, aber sollten mit Vorsicht benutzt werden, da erwartet wird, dass sie in Futura endgültig abgeschafft werden. Man sollte daran arbeiten, sie von seinem Code zu entfernen.

+ +

RegExp-Eigenschaften

+ +

The following properties are deprecated. This does not affect their use in {{jsxref("String.replace", "replacement strings", "", 1)}}:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyDescription
{{jsxref("RegExp.n", "$1-$9")}} +

Parenthesized substring matches, if any.
+ Warning: Using these properties can result in problems, since browser extensions can modify them. Avoid them!

+
{{jsxref("RegExp.input", "$_")}}See input.
{{jsxref("RegExp.multiline", "$*")}}See multiline.
{{jsxref("RegExp.lastMatch", "$&")}}See lastMatch.
{{jsxref("RegExp.lastParen", "$+")}}See lastParen.
{{jsxref("RegExp.leftContext", "$`")}}See leftContext.
{{jsxref("RegExp.rightContext", "$'")}}See rightContext.
{{jsxref("RegExp.input", "input")}}The string against which a regular expression is matched.
{{jsxref("RegExp.lastMatch", "lastMatch")}}The last matched characters.
{{jsxref("RegExp.lastParen", "lastParen")}}The last parenthesized substring match, if any.
{{jsxref("RegExp.leftContext", "leftContext")}}The substring preceding the most recent match.
{{jsxref("RegExp.rightContext", "rightContext")}}The substring following the most recent match.
+ +

The following are now properties of RegExp instances, no longer of the RegExp object:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyDescription
{{jsxref("RegExp.global", "global")}}Whether or not to test the regular expression against all possible matches in a string, or only against the first.
{{jsxref("RegExp.ignoreCase", "ignoreCase")}}Whether or not to ignore case while attempting a match in a string.
{{jsxref("RegExp.lastIndex", "lastIndex")}}The index at which to start the next match.
{{jsxref("RegExp.multiline", "multiline")}}Whether or not to search in strings across multiple lines.
{{jsxref("RegExp.source", "source")}}The text of the pattern.
+ +

RegExp methods

+ + + +

Function properties

+ + + +

Legacy generator

+ + + +

Iterator

+ + + +

Object methods

+ + + +

Date methods

+ + + +

Functions

+ + + +

Proxy

+ + + +

let

+ + + +

Escape sequences

+ + + +

String methods

+ + + +

Obsolete features

+ +

These obsolete features have been entirely removed from JavaScript and can no longer be used as of the indicated version of JavaScript.

+ +

Object

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyDescription
{{jsxref("Global_Objects/Object/count", "__count__")}}Returns the number of enumerable properties directly on a user-defined object.
{{jsxref("Global_Objects/Object/Parent", "__parent__")}}Points to an object's context.
{{jsxref("Global_Objects/Object/eval", "Object.prototype.eval()")}}Evaluates a string of JavaScript code in the context of the specified object.
{{jsxref("Object.observe()")}}Asynchronously observing the changes to an object.
{{jsxref("Object.unobserve()")}}Remove observers.
{{jsxref("Object.getNotifier()")}}Creates an object that allows to synthetically trigger a change.
+ +

Function

+ + + + + + + + + + + + +
PropertyDescription
{{jsxref("Global_Objects/Function/arity", "arity")}}Number of formal arguments.
+ +

Array

+ + + + + + + + + + + + + + + + +
PropertyDescription
{{jsxref("Array.observe()")}}Asynchronously observing changes to Arrays.
{{jsxref("Array.unobserve()")}}Remove observers.
+ +

Number

+ + + +

ParallelArray

+ + + +

Statements

+ + + +

E4X

+ +

See E4X for more information.

+ +

Sharp variables

+ +

See Sharp variables in JavaScript for more information.

diff --git a/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/the_legacy_iterator_protocol/index.html b/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/the_legacy_iterator_protocol/index.html new file mode 100644 index 0000000000..017dcea16a --- /dev/null +++ b/files/de/web/javascript/reference/veraltete_und_abgeschaffte_features/the_legacy_iterator_protocol/index.html @@ -0,0 +1,78 @@ +--- +title: The legacy Iterator protocol +slug: >- + Web/JavaScript/Reference/Veraltete_und_abgeschaffte_Features/The_legacy_Iterator_protocol +tags: + - ES2015 + - JavaScript + - Obsolet + - next() + - veralteter Iterator +translation_of: >- + Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol +--- +
{{jsSidebar("More")}}
+ +
Kein Standard. Das veraltete Iterator-Protokoll war ein SpiderMonkey-spezifisches Feature, welches in Firefox 58 entfernt wurde. Als Alternative werden for..of Schleifen und das iterator protocol empfohlen.
+ +

Das veraltete Iterator-Protokoll

+ +

Vor Version 26 implementierte Firefox ein anderes Iterator-Protokoll, welches dem ES2015 Iterator protocol Standard entspricht.

+ +

Ein Objekt ist ein veralteter Iterator, wenn es eine next()  Methode mit den folgenden Semantiken implementiert, welches zum Ende der Iteration {{jsxref("Global_Objects/StopIteration", "StopIteration")}} wirft.

+ + + + + + + + + + + + +
PropertyValue
nextEine Funktion ohne Argumente, welche einen Wert zurückgibt.
+ +

Unterschied zwischen dem veralteten und dem ES2015 Iterator-Protokoll

+ + + +

Einfaches Beispiel mit dem alten Protokoll

+ +
function kreiereIterator(array){
+    var nextIndex = 0;
+
+    return {
+       next: function(){
+           if(nextIndex < array.length){
+               return array[nextIndex++];
+           else
+               throw new StopIteration();
+       }
+    }
+}
+
+var it = kreiereIterator(['yo', 'ya']);
+
+console.log(it.next()); // 'yo'
+console.log(it.next()); // 'ya'
+try{
+    console.log(it.next());
+}
+catch(e){
+    if(e instanceof StopIteration){
+         // Iteration beendet.
+    }
+}
+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/speicherverwaltung/index.html b/files/de/web/javascript/speicherverwaltung/index.html new file mode 100644 index 0000000000..82f8977c23 --- /dev/null +++ b/files/de/web/javascript/speicherverwaltung/index.html @@ -0,0 +1,184 @@ +--- +title: Speicherverwaltung +slug: Web/JavaScript/Speicherverwaltung +tags: + - JavaScript +translation_of: Web/JavaScript/Memory_Management +--- +
{{JsSidebar("Advanced")}}
+ +

Einleitung

+ +

Bei Low-Level Programmiersprachen wie C, die zur systemnahen Programmierung eingesetzt werden, existieren Funktionen - wie z. B. malloc() und free() - womit explizit Speicher angefordert und wieder freigegeben werden kann. Bei JavaScript gibt es keine solchen Funktionen, sondern der benötigte Speicher wird bei der Erzeugung neuer Objekte (z. B. benutzerdefinierte Objekte oder vordefinierte Objekte wie String) zugewiesen. Die Speicherfreigabe erfolgt automatisch im Hintergrund durch die Garbage Collection (wörtlich: "Müllabfuhr"; automatische Speicherbereinigung). Dieser Automatismus führt oft zu Verwirrung und lässt so manchen Entwicklern irrtümlich glauben, man müsse sich über die Speicherverwaltung keine Gedanken machen.

+ +

Zyklus der Speichernutzung

+ +

Unabhängig von der eingesetzten Programmiersprache läuft der Zyklus für die Speichernutzung immer ungefähr gleich ab:

+ +
    +
  1. Alloziierung/Zuweisung des benötigten Speichers.
  2. +
  3. Benutzung des Speichers (lesen, schreiben).
  4. +
  5. Freigabe des alloziierten Speichers, wenn er nicht mehr benötigt wird.
  6. +
+ +

Der erste und zweite Schritt erfolgt bei allen Programmiersprachen explizit. Der letzte Schritt, die Freigabe des Speichers, wird bei Low-Level-Sprachen explizit und bei höheren Programmiersprachen wie JavaScript meist implizit vorgenommen.

+ +

Speicherzuweisung bei JavaScript

+ +

Initialisierung von Werten

+ +

Um dem Programmierer die Arbeit zu erleichtern, weist JavaScript bei der Zuweisung von Werten je nach Typ automatisch die benötigte Menge an Speicher zu:

+ +
+
var n = 123; // alloziiert Speicher für eine Number
+var s = "azerty"; // alloziiert Speicher für einen String
+
+var o = {
+  a: 1,
+  b: null
+}; // alloziiert Speicher für das Objekt und enthaltene Werte
+
+var a = [1, null, "abra"]; // (wie bei Objekten) alloziiert Speicher für das Array und enthaltene Werte
+
+function f(a){
+  return a + 2;
+} // alloziiert eine Function (die ein aufrufbares Objekt ist)
+
+// Funktions-Ausdrücke alloziieren ebenfalls ein Objekt
+someElement.addEventListener('click', function(){
+  someElement.style.backgroundColor = 'blue';
+}, false);
+
+
+ +

Allokation über Funktionsaufrufe

+ +

Einige Funktionen allozieren Objekte:

+ +
var d = new Date();
+var e = document.createElement('div'); // alloziiert ein DOM-Element
+
+ +

Andere Methoden allozieren neue Werte oder Objekte:

+ +
var s = "azerty";
+var s2 = s.substr(0, 3); // s2 ist ein neuer String
+// Da Strings immutable sind, weist JavaScript evtl. hier
+// keinen neuen Speicher zu, sondern merkt sich nur [0, 3],
+// dass s2 die ersten beiden Elemente von s enthält
+
+var a = ["ouais ouais", "nan nan"];
+var a2 = ["generation", "nan nan"];
+var a3 = a.concat(a2); // neues Array mit den 4 Elementen von a und a2
+
+ +

Werte

+ +

Bei der Zuweisung von Werten wird in den Speicher geschrieben und beim Abfragen von Werten der Speicher ausgelesen. Weist man also z. B. einer Objekteigenschaft einen Wert zu oder übergibt einen Wert als Argument an eine Funktion, wird dieser in den Speicher geschrieben und beim Abfragen des Werts der Speicher ausgelesen.

+ +

Freigabe des Speichers, wenn dieser nicht mehr benötigt wird

+ +

Bei diesem Vorgang tauchen am häufigsten Probleme mit der Speicherverwaltung auf, da es keine leichte Aufgabe ist, zu entscheiden, wann der benötigte Speicher tatsächlich nicht mehr gebraucht wird. Oftmals muss der Entwickler selbst bestimmen, an welcher Stelle die Freigabe eines Speicherbereichs erfolgen soll.

+ +

Höhere Programmiersprachen setzten häufig eine Softwarekomponente namens Garbage Collector ein, dessen Aufgabe darin besteht, die Speicherallokation zu überwachen und nicht mehr benötigten Speicher wieder freizugeben. Dieser Prozess basiert auf einer Abschätzung, da das zugrundeliegende Problem - zu entscheiden, wann Speicher nicht mehr benötigt wird - unentscheidbar ist (nicht durch einen Algorithmus lösbar).

+ +

Garbage Collection

+ +

Wie oben schon erwähnt, gibt es keine eindeutige Lösung für das zugrunde liegende Problem. Aus diesem Grund implementieren Garbage Collections einen beschränkten Algorithmus. Dieser Abschnitt liefert Informationen zum Verständnis der wichtigsten Algorithmen der Garbage Collection und deren Beschränkungen.

+ +

Referenzen

+ +

Der Grundgedanke auf dem Garbage Collection-Algorithmen hauptsächlich basieren, ist die Idee der Referenz. Im Zusammenhang mit der Speicherverwaltung spricht man davon, dass ein Objekt ein anderes Objekt referenziert, wenn ersteres (entweder implizit oder explizit) Zugriff auf letzteres hat. Zum Beispiel hat ein JavaScript-Objekt eine Referenz auf dessen Prototype (implizite Referenz) und dessen Eigenschaftswerte (explizite Referenz).

+ +

In diesem Kontext wird also der Begriff Objekt etwas breiter aufgefasst, als im Zusammenhang mit JavaScript-Objekten und beinhaltet außerdem auch Sichtbarkeitsbereiche von Funktionen (bzw. den globalen Sichtbarkeitsbereich).

+ +

Referenzzählung der Garbage Collection

+ +

Dies ist der naivste Algorithmus der Garbage Collection. Er reduziert einfach "ein Objekt wird nicht mehr benötigt" auf "kein anderes Objekt referenziert auf das Objekt". Ein Objekt wird also dann von der Garbage Collection entsorgt, wenn keine Referenzen auf das Objekt existieren.

+ +

Beispiel

+ +
var o = {
+  a: {
+    b:2
+  }
+}; // 2 Objekte wurden erstellt. Das eine referenziert auf das andere als dessen Eigenschaft.
+// Das Objekt a wird referenziert, weil es der Variablen o zugewiesen wurde.
+// Da auf alle Objekte irgendwie referenziert wird, kann keines entsogt werden
+
+var o2 = o; // Die Variable 'o2' ist das zweite Objekt mit einer Referenz auf das Objekt
+o = 1; // nun hat das Objekt, das sich ursprünglich in o befand eine einzige Referenz durch 'o2'
+
+var oa = o2.a; // Referenz auf die Eigenschaft 'a' des Objekts.
+// Nun hat das Objekt 2 Referenzen: Eine als Eigenschaft, die andere als Variable 'oa'
+
+o2 = "yo"; // Das objekt, welches sich anfangs in 'o' befand hat nun keine Referenzen mehr
+// und kann von der Garbage Collection entsorgt werden.
+// Jedoch wird die Eigenschaft 'a' noch immer durch die Variable 'oa' referenziert und kann daher nicht freigegeben werden
+
+oa = null; // Nun existieren keine Refrenzen mehr auf die Eigenschaft 'a'
+// und das Objekt kann entsorgt werden.
+
+ +

Beschränkung: gegenseitige Referenzen

+ +

Dieser naive Algorithmus ist deshalb beschränkt, weil Objekte, die gegenseitig aufeinender referenzieren, gar nicht mehr benötigt werden könnten, aber nicht entsorgt werden dürfen, da noch auf sie referenziert wird.

+ +
function f(){
+  var o = {};
+  var o2 = {};
+  o.a = o2; // o referenziert o2
+  o2.a = o; // o2 referenziert o
+
+  return "azerty";
+}
+
+f();
+// die Objekte werden erzeugt und referenzieren gegenseitig aufeinander.
+// Sie werden außerhalb des Sichtbarkeitsbereichs der Funktion nicht verwendet
+// und könnten daher nach der Funktionsausführung freigegeben werden
+// Der Referenzzählungsalgorithmus erkennt jedoch nur, dass auf beide Objekte
+// noch referenziert wird und entsorgt daher keines der beiden
+
+ +

Praxisbeispiel

+ +

Bei Internet Explorer 6, 7 ist bekannt, dass sie einen Garbage Collector mit Referenzzählung für DOM-Objekte einsetzen. Es gibt daher ein bekanntes Muster für die systematische Erzeugung von Speicherlecks:

+ +
var div = document.createElement("div");
+div.onclick = function(){
+  doSomething();
+}; // Das div hat eine Referenz über die Event-Handler-Eigenschaft 'onclick'.
+// Der Handler hat auch eine Referenz auf das div, da die div-Variable
+// innerhalb Sichtbarkeitsbereich der Funktion ansprechbar ist.
+// Dieser Kreislauf sorgt dafür, dass beide Objekte nicht entsorgt werden
+// und ein Speicherleck entsteht
+
+ +

Mark-and-Sweep-Algorithmus

+ +

Dieser Algorithmus reduziert die Definition "ein Objekt wird nicht mehr gebraucht" auf "ein Objekt ist nicht erreichbar".

+ +

Der Algorithmus nimmt an, dass ein Satz von root-Objekten (bei JavaScript das globale Objekt) existiert. Der Algorithmus sucht dann von diesen Anfangsobjekten aus alle referenzierten Objekte, dann von den referenzierten Objekten alle Objekte, die auf andere Objekte referenzieren und so weiter. Auf diese Weise erkennt der Algorithmus alle erreichbaren Objekte und sammelt alle unerreichbaren Objekte.

+ +

Dieser Algorithmus ist besser als der vorherige, da Objekte, die nicht referenziert sind als unerreichbar gelten, jedoch Objekte, die unerreichbar sind, nicht unbedingt keine Referenzen haben (gegenseitige Referenz).

+ +

Im Jahr 2012 arbeiten alle modernen Browser mit einem Mark-and-Sweep-Garbage Collector. Alle Verbesserungen der letzen Jahre im Bereich der Garbage Collection bei JavaScript (generational/incremental/concurrent/parallel garbage collection) sind Verbesserungen der Implementierung des Algorithmus, jedoch keine Änderungen des Algorithmus selbst oder der Definition von "ein Objekt wird nicht mehr gebraucht".

+ +

Gegenseitige Verweise stellen kein Problem mehr dar

+ +

Bei dem Beispiel oben zu gegenseitigen Verweisen wird auf die beiden Objekte nicht mehr von einem Objekt aus verwiesen, welches über das globale Objekt erreichbar ist. Daher werden sie vom Garbage Collector als unerreichbar angesehen.

+ +

Dasselbe gilt für das nächste Beispiel. Sobald das div und der Handler unerreichbar geworden sind, werden sie vom Gabage Collector entsorgt, obwohl sie noch gegenseitig aufeinander verweisen.

+ +

Einschränkung: Objekte müssen explizit unerreichbar gemacht werden

+ +

Obwohl dies als Einschränkung gilt, gibt es in der Praxis kaum solche Situationen und deshalb denkt kaum jemand über die Garbage Collection nach.

+ +

Weitere Informationen

+ + diff --git a/files/de/web/javascript/typed_arrays/index.html b/files/de/web/javascript/typed_arrays/index.html new file mode 100644 index 0000000000..d9d5654667 --- /dev/null +++ b/files/de/web/javascript/typed_arrays/index.html @@ -0,0 +1,230 @@ +--- +title: JavaScript typed arrays +slug: Web/JavaScript/Typed_arrays +tags: + - Guide + - JavaScript +translation_of: Web/JavaScript/Typed_arrays +--- +
{{JsSidebar("Advanced")}}
+ +
 
+ +
Typisierte Arrays (Typed Arrays) in JavaScript sind Array-ähnliche Objekte, die den Zugriff auf binäre Rohdaten ermöglichen. {{jsxref("Array")}}-Objekte wachsen und verkleinern sich dynamisch und können jeden beliebigen JavaScript-Wert aufnehmen. JavaScript-Engines führen Optimierungen durch, damit diese Arrays schnell verarbeitet werden können. Da aber Applikationen immer mächtiger werden und neue Features wie Audio- und Videobearbeitung oder der Zugriff auf Rohdaten mit WebSockets hinzugefügt werden, gibt es Situationen, in denen es hilfreich ist diese binären Rohdaten schnell und einfach über typisierte Arrays im JavaScript-Code zu manipulieren.
+ +
 
+ +
Typisierte Arrays sollten nicht mit den normalen Arrays verwechselt werden. Ein Aufruf von {{jsxref("Array.isArray()")}} liefert false zurück. Außerdem werden nicht alle Array-Methoden wie beispielsweise push und pop unterstützt.
+ +
 
+ +

Puffer und Sichten: Architektur typisierter Arrays

+ +

Um maximale Flexibilität und Effizienz zu schaffen, spalten typisierte Arrays in JavaScript die Durchführung in Puffer und Sichten. Ein Puffer (vom {{jsxref("ArrayBuffer")}}-Objekt durchgeführt) ist ein Objekt, das eine Menge von Daten verkörpert. Dazu gehört kein echtes Format und es wird kein Mechanismus angeboten, um auf den Inhalt zuzugreifen. Um Zugang zu diesem Speicher zu schaffen, muss man eine Sicht benutzen. Eine Sicht liefert einen Kontext, der diese Daten in ein echtes, typisiertes Array umwandelt. Genauer gesagt gibt dieser Kontext einen Datentypen, einen Versatz und die Anzahl der Elemente an.

+ +

Typed arrays in an ArrayBuffer

+ +

ArrayBuffer

+ +

Der {{jsxref("ArrayBuffer")}} ist ein Datentyp, der einen generischen, binären Datenpuffer mit festgelegter Länge darstellt. Es ist nicht möglich den Inhalt dieses Puffers (ArrayBuffer) direkt zu bearbeiten; stattdessen erstellt man selbst eine Sicht durch ein typisiertes Array oder eine {{jsxref("DataView")}}. Dadurch wird der Puffer als ein spezifisches Format dargestellt, das benutzt wird, um den Inhalt des Puffers zu modifizieren und lesen.

+ +

Sichten von typisierten Arrays

+ +

Sichten, die durch typisierte Arrays erstellt wurden, haben selbst beschreibende Namen, und bieten Sichten für alle gebräuchlichen numerischen Typen wie Int8Uint32Float64 usw. an. Es gibt auch eine spezielle Sicht von typisierten Arrays, nämlich das Uint8ClampedArray. Dieses begrenzt die Werte auf 0 bis 255, was nützlich beispielsweise für die Datenverarbeitung einer Leinwand ist.

+ +

{{page("/de/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects")}}

+ +

DataView

+ +

Die {{jsxref("DataView")}} (zu deutsch "Daten-Sicht") ist ein low-level Interface, das Getter und Setter zum Lesen und Schreiben beliebiger Daten in den Buffer anbietet. Das ist beispielsweise nützlich wenn man mit verschiedenen Datentypen arbeiten muss. Sichten von typisierten Arrays sind in der nativen Byte-Reihenfolge Ihrer Plattform (siehe {{Glossary("Endianness")}}. Mit einem DataView können Sie die Byte-Reihenfolge kontrollieren. Standardmässig ist Big-Endian eingestellt, Sie können es in den Gettern und Settern auf Little-Endian umstellen.

+ +

Web APIs mit typisierten Arrays

+ +
+
FileReader.prototype.readAsArrayBuffer()
+
Die FileReader.prototype.readAsArrayBuffer() Methode liest den Inhalt aus einem gegebenen Blob oder einer Datei.
+
XMLHttpRequest.prototype.send()
+
Die send() Methode einer XMLHttpRequest-Instanz unterstützt nun Typed Arrays und {{jsxref("ArrayBuffer")}} Objekte als Argument.
+
ImageData.data
+
Ein {{jsxref("Uint8ClampedArray")}} welches die Daten in der RGBA-Reihenfolge enthält, mit Integer-Werten zwischen 0 und 255 inklusiv.
+
+ +

Beispiele

+ +

Sichten als Puffer benutzen

+ +

Als erstes muss ein Puffer erstellt werden, hier mit einer festgelegten Länge von 16 Bytes:

+ +
var buffer = new ArrayBuffer(16);
+
+ +

Jetzt haben wir einen Speicherblock mit Bytes, die mit 0 vorinitialisiert sind. Darüber hinaus lässt sich nicht viel damit anstellen. Wir können überprüfen, ob er wirklich 16 Bytes lang ist, und das war's auch schon.

+ +
if (buffer.byteLength === 16) {
+  console.log("Yes, it's 16 bytes.");
+} else {
+  console.log("Oh no, it's the wrong size!");
+}
+
+ +

Bevor wir wirklich damit arbeiten können, müssen wir eine Sicht erzeugen. Wir erstellen eine Sicht, der die Daten in dem Puffer als ein Array von vorzeichenbehafteten 32-Bit-Integern sieht.

+ +
var int32View = new Int32Array(buffer);
+
+ +

Jetzt können wir auf die Elemente in dem Array wie in jedem normalen Array zugreifen.

+ +
for (var i = 0; i < int32View.length; i++) {
+  int32View[i] = i * 2;
+}
+
+ +

Der obige Code füllt die 4 Einträge in dem Array (4 Einträge mit je 4 Bytes ergeben 16 Bytes insgesamt) mit den Werten 0, 2, 4 und 6.

+ +

Multiple views on the same data

+ +

Things start to get really interesting when you consider that you can create multiple views onto the same data. For example, given the code above, we can continue like this:

+ +
var int16View = new Int16Array(buffer);
+
+for (var i = 0; i < int16View.length; i++) {
+  console.log("Entry " + i + ": " + int16View[i]);
+}
+
+ +

Here we create a 16-bit integer view that shares the same buffer as the existing 32-bit view and we output all the values in the buffer as 16-bit integers. Now we get the output 0, 0, 2, 0, 4, 0, 6, 0.

+ +

You can go a step farther, though. Consider this:

+ +
int16View[0] = 32;
+console.log("Entry 0 in the 32-bit array is now " + int32View[0]);
+
+ +

The output from this is "Entry 0 in the 32-bit array is now 32". In other words, the two arrays are indeed simply views on the same data buffer, treating it as different formats. You can do this with any view types.

+ +

Working with complex data structures

+ +

By combining a single buffer with multiple views of different types, starting at different offsets into the buffer, you can interact with data objects containing multiple data types. This lets you, for example, interact with complex data structures from WebGL, data files, or C structures you need to use while using js-ctypes.

+ +

Consider this C structure:

+ +
struct someStruct {
+  unsigned long id;
+  char username[16];
+  float amountDue;
+};
+ +

You can access a buffer containing data in this format like this:

+ +
var buffer = new ArrayBuffer(24);
+
+// ... read the data into the buffer ...
+
+var idView = new Uint32Array(buffer, 0, 1);
+var usernameView = new Uint8Array(buffer, 4, 16);
+var amountDueView = new Float32Array(buffer, 20, 1);
+ +

Then you can access, for example, the amount due with amountDueView[0].

+ +
Note: The data structure alignment in a C structure is platform-dependent. Take precautions and considerations for these padding differences.
+ +

Conversion to normal arrays

+ +

After processing a typed array, it is sometimes useful to convert it back to a normal array in order to benefit from the {{jsxref("Array")}} prototype. This can done using {{jsxref("Array.from")}}, or using the following code where Array.from is unsupported.

+ +
var typedArray = new Uint8Array([1, 2, 3, 4]),
+    normalArray = Array.prototype.slice.call(typedArray);
+normalArray.length === 4;
+normalArray.constructor === Array;
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('Typed Array')}}{{Spec2('Typed Array')}}Abgelöst von ECMAScript 6.
{{SpecName('ES6', '#sec-typedarray-objects', 'TypedArray Objects')}}{{Spec2('ES6')}}Initiale Definition im ECMA-Standard.
{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}{{Spec2('ESDraft')}} 
+ +

Browser compatibility

+ +

Chrome 7 includes support for ArrayBuffer, Float32Array, Int16Array, and Uint8Array. Chrome 9 and Firefox 15 add support for DataView objects. Internet Explorer 10 supports all types except Uint8ClampedArray and ArrayBuffer.prototype.slice which are present starting in Internet Explorer 11.

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support7.0{{ CompatGeckoDesktop("2") }}1011.65.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support4.0{{CompatVersionUnknown}}{{ CompatGeckoMobile("2") }}1011.64.2
+
+ +

See also

+ + diff --git a/files/de/web/javascript/vergleiche_auf_gleichheit_und_deren_verwendung/index.html b/files/de/web/javascript/vergleiche_auf_gleichheit_und_deren_verwendung/index.html new file mode 100644 index 0000000000..2b9be0a283 --- /dev/null +++ b/files/de/web/javascript/vergleiche_auf_gleichheit_und_deren_verwendung/index.html @@ -0,0 +1,424 @@ +--- +title: Vergleiche auf Gleichheit und deren Verwendung +slug: Web/JavaScript/Vergleiche_auf_Gleichheit_und_deren_Verwendung +translation_of: Web/JavaScript/Equality_comparisons_and_sameness +--- +
{{jsSidebar("Intermediate")}}
+ +
+

JavaScript bietet drei verschiedene Operationen an, um Werte zu vergleichen:

+ + + +

Die Wahl der Operation hängt von der Art des gewünschten Vergleichs auf Gleichheit ab.

+
+ +

Kurz gesagt nimmt double equals eine Typkonvertierung der Operanden vor, bevor der Vergleich der Werte gemacht wird. Bei triple equals werden die Werte ohne vorherige Typkonvertierung miteinander verglichen. Wenn sich die Datentypen der beiden Operanden unterscheiden liefert triple equals immer false zurück. Object.is verhält sich wie triple equals und bietet darüber hinaus eine spezielle Behandlung für NaN und -0 und +0 an. -0 und +0 sind für Object.is ungleich während Object.is(NaN, NaN) true ist. Laut IEEE 754 ergibt ein Vergleich von zwei NaN mit double equals oder triple equals false. Diese drei Operationen unterscheiden sich ihrere Behandlung von primitiven Datentypen. Es wird nicht geprüft, ob die beiden Operanden konzeptionell diesselbe Struktur besitzen. Für die nichtprimitiven Objekte x und y, welche diesselbe Struktur besitzen aber zwei unterschiedliche Objekte sind, ergeben die drei Operationen false.

+ +

Strikte Gleichheit mit ===

+ +

Strikte Gleichheit prüft zwei Werte auf Gleichheit. Keiner der Werte wird vor dem Vergleich implizit konvertiert. Wenn die Werte verschiedene Datentypen haben, werden die Werte als ungleich betrachtet. Anderenfalls, wenn die Werte denselben Datentyp haben und keine Zahlen sind, werden sie als gleich betrachtet, solange sie denselben Wert haben. Wenn beide Werte Zahlen sind, werden sie als gleich betrachtet, solange beide nicht NaN sind und denselben Wert haben oder der eine Wert +0 und der andere Wert -0 ist.

+ +
var num = 0;
+var obj = new String("0");
+var str = "0";
+var b = false;
+
+console.log(num === num); // true
+console.log(obj === obj); // true
+console.log(str === str); // true
+
+console.log(num === obj); // false
+console.log(num === str); // false
+console.log(obj === str); // false
+console.log(null === undefined); // false
+console.log(obj === null); // false
+console.log(obj === undefined); // false
+
+ +

Strikte Gleichheit ist fast immer die am meisten geeignete Vergleichsoperation. Für alle Werte, die keine Zahlen sind, verwendet sie die naheliegende Semantik: ein Wert ist nur mit sich selbst gleich. Für Zahlen kommt eine leicht unterschiedliche Semantik zum Einsatz, da zwei Grenzfälle berücksichtigt werden müssen.  Im ersten Grenzfall kann die Zahl 0 als Gleitkommazahl ein positives oder negatives Vorzeichen haben. Dies kann zur Repräsentation von bestimmten mathematischen Lösungen nützlich sein. Da aber in den meisten Situationen nicht zwischen +0 und -0 unterschieden wird, behandelt die strikte Gleichheit diese zwei Werte als gleich. Der zweite Grenzfall ergibt sich dadruch, dass Gleitkommazahlen einen keine-Zahl Wert haben, NaN (not-a-number). Dadurch können Lösungen für schlecht definierte mathematische Probleme dargestellt werden (z.B.: negativ unendlich plus positiv undendlich). Strikte Gleichheit behandelt NaN als ungleich zu jedem anderen Wert und sich selbst. Der einzige Fall, in dem (x !== x) true ergibt, ist, wenn x den Wert NaN hat.

+ +

Lose Gleichheit mit ==

+ +

Lose Gleichheit vergleicht zwei Werte auf deren Gleichheit, nachdem beide zu demselben Datentyp konvertiert wurden. Nach der Konvertierung (ein oder beide Werte können konvertiert werden) wird der finale Vergleich wie bei === ausgeführt.  Lose Gleichheit ist symmetrisch: A == B hat immer dieselbe Semantik wie B == A für alle Werte von A und B.

+ +

Der Vergleich auf Gleichheit wird wie folgt für Operanden mit den verschiedenen Datentypen ausgeführt:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 Operand B
  UndefinedNullNumberStringBooleanObject
Operand AUndefinedtruetruefalsefalsefalseIsFalsy(B)
NulltruetruefalsefalsefalseIsFalsy(B)
NumberfalsefalseA === BA === ToNumber(B)ToNumber(B) === AToPrimitive(B) == A
StringfalsefalseB === ToNumber(A)A === BToNumber(A) === ToNumber(B)ToPrimitive(B) == A
BooleanfalsefalseToNumber(A) === BToNumber(A) === ToNumber(B)A === Bfalse
ObjectIsFalsy(A)IsFalsy(A)ToPrimitive(A) == BToPrimitive(A) == Bfalse +

A === B

+
+ +

In der oberen Tabelle versucht ToNumber(A) sein Argument vor dem Vergleich in eine Zahl zu konvertieren. Das Verhalten ist äquivalent zu +A (der unäre + Operator).  ToPrimitive(A) versucht sein Argument, das ein Objekt ist, in einen primitiven Wert zu konvertieren. Dazu wird eine unterschiedliche Sequenz von A.toString und A.valueOf Methoden von A aufzurufen.

+ +

Traditionell und laut ECMAScript sind alle Objekte lose ungleich zu undefined und null. Aber die meisten Webbbrowser erlauben einer sehr kleinen Menge von Objekten (speziell das document.all Objekt für jede Seite), dass sie sich in bestimmten Kontexten so verhalten, als ob sie den Wert undefined emulieren.  Lose Gleichheit ist ein derartiger Kontext. Daher ergibt die Methode IsFalsy(A) genau dann true, wenn A ein Objekt ist, das undefined emuliert. In allen anderen Fällen ist ein Objekt nie lose gleich zu undefined oder null.

+ +
var num = 0;
+var obj = new String("0");
+var str = "0";
+var b = false;
+
+console.log(num == num); // true
+console.log(obj == obj); // true
+console.log(str == str); // true
+
+console.log(num == obj); // true
+console.log(num == str); // true
+console.log(obj == str); // true
+console.log(null == undefined); // true
+
+// both false, except in rare cases
+console.log(obj == null);
+console.log(obj == undefined);
+
+ +

Manche Entwickler haben die Ansicht, dass die Verwendung der losen Gleichheit fast nie eine gute Idee ist. Das Resultat des Vergleichs mit strikter Gleichheit ist einfacher vorherzusagen und die Auswertung ist schneller, da keine Konvertierung der Werte stattfindet.

+ +

Same-value Gleichheit

+ +

Same-value Gleichheit adressiert den dritten Fall: Bestimmung, ob zwei Werte in allen Kontexten funktional identisch sind. Dieser Anwendungsfall demonstriert eine Instanz des Liskovschen Substitutionsprinzip. Eine Instanz tritt auf, wenn versucht wird ein nicht veränderbares Property zu verändern:

+ +
// Add an immutable NEGATIVE_ZERO property to the Number constructor.
+Object.defineProperty(Number, "NEGATIVE_ZERO",
+                      { value: -0, writable: false, configurable: false, enumerable: false });
+
+function attemptMutation(v)
+{
+  Object.defineProperty(Number, "NEGATIVE_ZERO", { value: v });
+}
+
+ +

Object.defineProperty wird eine Exception werfen, wenn ein Versuch zum Verändern eines unveränderbares Property es verändern würde. Es passiert nichts, solange keine Veränderung stattfinden soll.  Wenn v -0 ist, wurde keine Veränderung angefragt und somit wird keine Exception geworfen. Wenn v aber +0 ist, hätte Number.NEGATIVE_ZERO nicht länger seinen unveränderbaren Wert. Wenn ein unveränderbares Property neudefiniert wird, wird der neu spezifizierte Wert intern mittels der Same-value Gleichheit mit dem aktuellen Wert verglichen.

+ +

Die Same-value Gleichheit wird von der Object.is Methode angeboten.

+ +

Abstrakte Gleichheit, strikte Gleichheit und same-value Gleichheit in der Spezifikation

+ +

In ECMAScript 5 wird der Vergleich mit == in Section 11.9.3, The Abstract Equality Algorithm beschrieben. Der === Vergleich ist in 11.9.6, The Strict Equality Algorithm zu finden. (Diese beiden Abschnitte sind kurz und verständlich. Hinweis: zuerst den Abschnitt Strict Equality Algorithm lesen) ECMAScript 5 beschreibt auch die same-value Gleichheit in Section 9.12, The SameValue Algorithm für die interne Verwendung in der JavaScript Engine. Dieser Abschnitt ist hauptsächlich derselbe wie Strict Equality Algorithm mit der Ausnahme, dass sich 11.9.6.4 und 9.12.4 in der Behandlung von Zahlen (Number) unterscheiden. ECMAScript 2015 schlägt vor, dass dieser Algorithmus über Object.is angeboten wird.

+ +

Wir können erkennen, dass mit double und triple equals, mit der Ausnahme der vorhergehenden Typkonvertierung in 11.9.6.1, der Strict Equality Algorithm eine Teilmenge des Abstract Equality Algorithm ist, weil 11.9.6.2–7 dem Abschnitt 11.9.3.1.a–f entspricht.

+ +

A model for understanding equality comparisons?

+ +

Prior to ES2015, you might have said of double equals and triple equals that one is an "enhanced" version of the other. For example, someone might say that double equals is an extended version of triple equals, because the former does everything that the latter does, but with type conversion on its operands. E.g., 6 == "6". (Alternatively, someone might say that double equals is the baseline, and triple equals is an enhanced version, because it requires the two operands to be the same type, so it adds an extra constraint. Which one is the better model for understanding depends on how you choose to view things.)

+ +

However, this way of thinking about the built-in sameness operators is not a model that can be stretched to allow a place for ES2015's Object.is on this "spectrum". Object.is isn't simply "looser" than double equals or "stricter" than triple equals, nor does it fit somewhere in between (i.e., being both stricter than double equals, but looser than triple equals). We can see from the sameness comparisons table below that this is due to the way that Object.is handles NaN. Notice that if Object.is(NaN, NaN) evaluated to false, we could say that it fits on the loose/strict spectrum as an even stricter form of triple equals, one that distinguishes between -0 and +0. The NaN handling means this is untrue, however. Unfortunately, Object.is simply has to be thought of in terms of its specific characteristics, rather than its looseness or strictness with regard to the equality operators.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Sameness Comparisons
xy=====Object.is
undefinedundefinedtruetruetrue
nullnulltruetruetrue
truetruetruetruetrue
falsefalsetruetruetrue
"foo""foo"truetruetrue
{ foo: "bar" }xtruetruetrue
00truetruetrue
+0-0truetruefalse
0falsetruefalsefalse
""falsetruefalsefalse
""0truefalsefalse
"0"0truefalsefalse
"17"17truefalsefalse
[1,2]"1,2"truefalsefalse
new String("foo")"foo"truefalsefalse
nullundefinedtruefalsefalse
nullfalsefalsefalsefalse
undefinedfalsefalsefalsefalse
{ foo: "bar" }{ foo: "bar" }falsefalsefalse
new String("foo")new String("foo")falsefalsefalse
0nullfalsefalsefalse
0NaNfalsefalsefalse
"foo"NaNfalsefalsefalse
NaNNaNfalsefalsetrue
+ +

When to use Object.is versus triple equals

+ +

Aside from the way it treats NaN, generally, the only time Object.is's special behavior towards zeros is likely to be of interest is in the pursuit of certain meta-programming schemes, especially regarding property descriptors when it is desirable for your work to mirror some of the characteristics of Object.defineProperty. If your use case does not require this, it is suggested to avoid Object.is and use === instead. Even if your requirements involve having comparisons between two NaN values evaluate to true, generally it is easier to special-case the NaN checks (using the isNaN method available from previous versions of ECMAScript) than it is to work out how surrounding computations might affect the sign of any zeros you encounter in your comparison.

+ +

Here's an in-exhaustive list of built-in methods and operators that might cause a distinction between -0 and +0 to manifest itself in your code:

+ +
+
- (unary negation)
+
+ +
+
+

It's obvious that negating 0 produces -0. But the abstraction of an expression can cause -0 to creep in when you don't realize it. For example, consider:

+ +
let stoppingForce = obj.mass * -obj.velocity
+ +

If obj.velocity is 0 (or computes to 0), a -0 is introduced at that place and propogates out into stoppingForce.

+
+
+ +
+
Math.atan2
+
Math.ceil
+
Math.pow
+
Math.round
+
+ +
+
It's possible for a -0 to be introduced into an expression as a return value of these methods in some cases, even when no -0 exists as one of the parameters. E.g., using Math.pow to raise -Infinity to the power of any negative, odd exponent evaluates to -0. Refer to the documentation for the individual methods.
+
+ +
+
Math.floor
+
Math.max
+
Math.min
+
Math.sin
+
Math.sqrt
+
Math.tan
+
+ +
+
It's possible to get a -0 return value out of these methods in some cases where a -0 exists as one of the parameters. E.g., Math.min(-0, +0) evalutes to -0. Refer to the documentation for the individual methods.
+
+ +
+
~
+
<<
+
>>
+
Each of these operators uses the ToInt32 algorithm internally. Since there is only one representation for 0 in the internal 32-bit integer type, -0 will not survive a round trip after an inverse operation. E.g., both Object.is(~~(-0), -0) and Object.is(-0 << 2 >> 2, -0) evaluate to false.
+
+ +

Relying on Object.is when the signedness of zeros is not taken into account can be hazardous. Of course, when the intent is to distinguish between -0 and +0, it does exactly what's desired.

+ +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf