Область переменных javascript в выражении IF
Являются ли переменные, объявленные и назначенные в выражении "if", видимыми только внутри этого блока "if" или внутри целой функции?
Я делаю это правильно в следующем коде? (похоже, работает, но объявление "структуры var" несколько раз кажется неудобным) любые более чистые решения?
function actionPane(state) {
if(state === "ed") {
var structure = {
"element" : "div",
"attr" : {
"class" : "actionPane"
},
"contains" : [{
"element" : "a",
"attr" : {
"title" : "edit",
"href" : "#",
"class" : "edit"
},
"contains" : ""
}, {
"element" : "a",
"attr" : {
"title" : "delete",
"href" : "#",
"class" : "delete"
},
"contains" : ""
}]
}
} else {
var structure = {
"element" : "div",
"attr" : {
"class" : "actionPane"
},
"contains" : [{
"element" : "a",
"attr" : {
"title" : "save",
"href" : "#",
"class" : "save"
},
"contains" : ""
}, {
"element" : "a",
"attr" : {
"title" : "cancel",
"href" : "#",
"class" : "cancel"
},
"contains" : ""
}]
}
}
return structure;
}
Ответы
Ответ 1
1) Переменные видимы для всей области функций. Поэтому вы должны объявлять их только один раз.
2) Вы не должны объявлять переменную дважды в своем примере. Я бы рекомендовал объявить переменную в верхней части функции, а затем просто установить значение позже:
function actionPane(state) {
var structure;
if(state === "ed") {
structure = {
...
Для отличной обратной связи по JavaScript я настоятельно рекомендую использовать JSLint Дугласом Крокфордом. Он сканирует ваш код на наличие распространенных ошибок и находит предложения по очистке.
Я также рекомендую прочитать небольшую книгу JavaScript: The Good Parts. Он содержит много советов по написанию поддерживаемого JS-кода.
Ответ 2
JavaScript не имеет "области блока", он имеет только область функций - поэтому переменные, объявленные внутри оператора if (или любого условного блока), "поднимаются" во внешнюю область.
if(true) {
var foo = "bar";
}
alert(foo); // "bar"
Это на самом деле рисует более четкую картину (и появляется в интервью, по опыту:)
var foo = "test";
if(true) {
alert(foo); // Interviewer: "What does this alert?" Answer: "test"
var foo = "bar";
}
alert(foo); // "bar" Interviewer: Why is that? Answer: Because JavaScript does not have block scope
Область функций в JavaScript обычно относится к закрытию.
var bar = "heheheh";
var blah = (function() {
var foo = "hello";
alert(bar); // "heheheh"
alert(foo); // "hello" (obviously)
});
blah(); // "heheheh", "hello"
alert(foo); // undefined, no alert
Внутренняя область действия функции имеет доступ к среде, в которой она содержится, но не наоборот.
Чтобы ответить на ваш второй вопрос, оптимизация может быть достигнута путем первоначального построения "минимального" объекта, который удовлетворяет всем условиям, а затем дополняет или модифицирует его на основе определенных условий (состояний), которые/были выполнены.
Ответ 3
Переменные, объявленные внутри оператора if, будут доступны outisde, если они находятся в одной и той же функции.
В вашем случае лучшим способом было бы объявить структуру, а затем изменить части объекта, которые отличаются в любом случае:
var structure = {
"element" : "div",
"attr" : {
"class" : "actionPane"
},
"contains" : [{
"element" : "a",
"attr" : {
"title" : "edit",
"href" : "#",
"class" : "edit"
},
"contains" : ""
}, {
"element" : "a",
"attr" : {
"title" : "delete",
"href" : "#",
"class" : "delete"
},
"contains" : ""
}]
}
if(state != "ed") {
// modify appropriate attrs of structure (e.g. set title and class to cancel)
}
Ответ 4
- переменные, объявленные и назначенные только в выражении "if" внутри этого блока "if" или внутри всей функции?
В Javascript все переменные либо
- глобальная область
- локальная область действия (целая) - Javascript не имеет "области блока", где переменные доступны только с меньшим блоком локальной области (функции)
Я делаю это правильно в следующем коде? (похоже, работает, но объявление "структура var" несколько раз кажется akward) любой уборщик решения?
Да. Более чистым решением может быть создание базового класса structure
и изменение в каждом случае другого.
Ответ 5
ECMAScript 2015 (ES6) включает в себя два новых ключевых слова, которые, наконец, позволяют JavaScript выполнять правильное определение области без необходимости использования рабочего цикла, разговорного синтаксиса: