- Object-Oriented JavaScript(Second Edition)
- Stoyan Stefanov Kumar Chetan Sharma
- 783字
- 2021-08-13 16:19:29
Code blocks
In the preceding examples, you saw the use of code blocks. Let's take a moment to clarify what a block of code is, because you use blocks extensively when constructing conditions and loops.
A block of code consists of zero or more expressions enclosed in curly brackets:
{ var a = 1; var b = 3; }
You can nest blocks within each other indefinitely:
{ var a = 1; var b = 3; var c, d; { c = a + b; { d = a - b; } } }
Tip
Best practice tips
- Use end-of-line semicolons, as discussed previously in the chapter. Although the semicolon is optional when you have only one expression per line, it's good to develop the habit of using them. For best readability, the individual expressions inside a block should be placed one per line and separated by semicolons.
- Indent any code placed within curly brackets. Some programmers like one tab indentation, some use four spaces, and some use two spaces. It really doesn't matter, as long as you're consistent. In the preceding example, the outer block is indented with two spaces, the code in the first nested block is indented with four spaces, and the innermost block is indented with six spaces.
- Use curly brackets. When a block consists of only one expression, the curly brackets are optional, but for readability and maintainability, you should get into the habit of always using them, even when they're optional.
Checking if a variable exists
Let's apply the new knowledge about conditions for something practical. It's often necessary to check whether a variable exists. The laziest way to do this is to simply put the variable in the condition part of the if
, for example, if (somevar) {...}
. But, this is not necessarily the best method. Let's take a look at an example that tests whether a variable called somevar
exists, and if so, sets the result
variable to yes
:
> var result = ''; > if (somevar) { result = 'yes'; } ReferenceError: somevar is not defined > result; ""
This code obviously works because the end result was not "yes". But firstly, the code generated an error: somevar
is not defined, and you don't want your code to behave like that. Secondly, just because if (somevar)
returns false
doesn't mean that somevar
is not defined. It could be that somevar
is defined and initialized but contains a falsy value like false
or 0
.
A better way to check if a variable is defined is to use typeof
:
> var result = "";
> if (typeof somevar !== "undefined") {
result = "yes";
}
> result;
""
typeof
always returns a string, and you can compare this string with the string "undefined"
. Note that the variable somevar
may have been declared but not assigned a value yet, and you'll still get the same result. So, when testing with typeof
like this, you're really testing whether the variable has any value other than the value undefined
:
> var somevar; > if (typeof somevar !== "undefined") { result = "yes"; } > result; "" > somevar = undefined; > if (typeof somevar !== "undefined") { result = "yes"; } > result; ""
If a variable is defined and initialized with any value other than undefined
, its type returned by typeof
is no longer "undefined"
:
> somevar = 123;
> if (typeof somevar !== "undefined") {
result = 'yes';
}
> result;
"yes"
Alternative if syntax
When you have a simple condition, you can consider using an alternative if
syntax. Take a look at this:
var a = 1; var result = ''; if (a === 1) { result = "a is one"; } else { result = "a is not one"; }
You can also write this as:
> var a = 1; > var result = (a === 1) ? "a is one" : "a is not one";
You should only use this syntax for simple conditions. Be careful not to abuse it, as it can easily make your code unreadable. Here's an example.
Let's say you want to make sure a number is within a certain range, say between 50 and 100:
> var a = 123;
> a = a > 100 ? 100 : a < 50 ? 50: a;
> a;
100
It may not be clear how this code works exactly because of the multiple ?
. Adding parentheses makes it a little clearer:
> var a = 123; > a = (a > 100 ? 100 : a < 50) ? 50 : a; > a; 50 > var a = 123; > a = a > 100 ? 100 : (a < 50 ? 50 : a); > a; 100
?:
is called a ternary operator because it takes three operands.
- Learning Real-time Processing with Spark Streaming
- What's New in TensorFlow 2.0
- Python數(shù)據(jù)分析基礎(chǔ)
- C# 2012程序設(shè)計(jì)實(shí)踐教程 (清華電腦學(xué)堂)
- Android 應(yīng)用案例開發(fā)大全(第3版)
- Learning SciPy for Numerical and Scientific Computing(Second Edition)
- OpenCV with Python By Example
- Android Studio Cookbook
- Android應(yīng)用開發(fā)實(shí)戰(zhàn)(第2版)
- 跟戴銘學(xué)iOS編程:理順核心知識(shí)點(diǎn)
- Scratch從入門到精通
- Web前端開發(fā)最佳實(shí)踐
- Python數(shù)據(jù)科學(xué)實(shí)踐指南
- 征服C指針(第2版)
- 循序漸進(jìn)Vue.js 3前端開發(fā)實(shí)戰(zhàn)