Я учу JavaScript
Здравствуйте, меня зовут Женя
Уже довольно долго я работаю с 2д/3д/видео/музыкой и т.д., так сказать креативностью. Но во что то в моей жизни всё таки не хватало. И вот тут то я и познакомился с html 4.01, css2 и начинаю потихоньку осваивать js(уже неделя). Почему именно js а не пхп? Ну пхп мне тоже нравится, кажется легким языком, книжка вот рядом лежит, легко читается, легко понимаю, с моим то правополушарным сознанием :lol: но js мне как то больше нравится в плане дизайна, то есть написал скрипт, а он же клиент сайд (может и сервер сайд есть но я еще об этом не знаю), быстро грузится и графика потрясающая, можно делать красивые вещи. Ну а теперь главный вопрос. Зачем же мне, человеку который всю жизнь занимался искусством, вдруг начал осваивать программирование. Так вот, цель моя совместить все мои навыки 2д, 3д и музыки с программированием, что бы в будущем я мог делать красивые веб приложения, и очень надеюсь, верю, игрушки. Собственно всё :D В основном эта тема будет мой блог+вопрос (извиняюсь если тема не в том разделе). ------------ Сейчас я обучаюсь по видеокурсу Русакова (сцлк) JS. Прошел: Основы JavaScript, Hello World, Переменные, Типы переменных, Операции, Условные операторы. И тут у меня возник один вопрос. Код очень длинный, как можно сделать вот это, короче? Вообще можно сделать его короче?)) var age = 23;
if(age <= 18){
document.write("За границей говорят что я стар");
}
else if (age>18 && age<=30){
document.write("Да");
}
else if (age>31 && age<=50){
document.write("Я стар");
}
else if (age>51 && age<=80){
document.write("Я очень стар");
}
else if (age > 81){
document.write("Я superstar");
}
else{
document.write("No age");
}
}
|
document.write((age<19)?'За границей говорят что я стар':(age<31)?'Да':(age<51)?'Я стар':(age<81)?'Я очень стар':'Я superstar'); |
Можно придумать некий декларативный способ описания интервалов. Правда получается немаленький оверхед и операторы сравнения фиксированы (хотя можно учесть и это):
var age = 23;
var stages = {
"За границей говорят что я стар": [-Infinity, 18],
"Да": [18, 30],
"Я стар": [30, 50],
"Я очень стар": [50, 80],
"Я superstar": [80, Infinity]
};
var message = "No age";
for (var key in stages)
if (age > stages[key][0] && age <= stages[key][1]) {
message = key;
break;
}
//document.write(message);
alert(message);
|
Еще вариант:
document.write((age<19)&&'За границей говорят что я стар'||(age<31)&&'Да'||(age<51)&&'Я стар'||(age<81)&&'Я очень стар'||'Я superstar'); |
Цитата:
Как записать это в развернутом варианте? так var age = 100; document.write( (age<19)?'За границей говорят что я стар' :(age<31)?'Да' :(age<51)?'Я стар' :(age<81)?'Я очень стар' :'Я superstar'); или так var age = 100; document.write( (age<19)?'За границей говорят что я стар': (age<31)?'Да': (age<51)?'Я стар': (age<81)?'Я очень стар': 'Я superstar'); |
Antarius, "(выражение) ? (действие, если true) : (действие, если false)" - тернарный оператор, аналог if...else
|
Загрузил)))
Смотри, у меня тут парочка вопросов сразу появилась) Это массив? var stages = {
"За границей говорят что я стар": [-Infinity, 18],
"Да": [18, 30],
"Я стар": [30, 50],
"Я очень стар": [50, 80],
"Я superstar": [80, Infinity]
};
Мы такое не проходили еще :D var message = "No age";
for (var key in stages)
if (age > stages[key][0] && age <= stages[key][1]) {
message = key;
break;
}
//document.write(message);
alert(message);
"For" это цикл, а "var key in stages" это даже не могу найти в гугле, но по логике это "этапные ключи" (первый раз слышу про var key in stages), я так полагаю что в учебнике есть эта инфа) Спасибо, движемся дальше :) |
Цитата:
(age < 81 ) ? document.write("Я очень стар") : document.write("Я суперстар");
//если переменная "age" меньше 81 то выходит сообщение "я очень стар", в противном случае "я суперстар"
Сейчас попробую сделать побольше вариантов. |
Цитата:
Можно было так: var stages = new Object(); stages.Да = [18, 30]; // тоже что и stages["Да"] stages["Я стар"] = [30, 50]; // тут пробел в ключе, так что вариант с точкой не канает // и т.д... Также ты мог слышать про JSON. Собсно вот это: {
"За границей говорят что я стар": [-Infinity, 18],
"Да": [18, 30],
"Я стар": [30, 50],
"Я очень стар": [50, 80],
"Я superstar": [80, Infinity]
};
и есть объект, описанный в JSON-нотации (токо Infinity в JSON не проканает, надо поубирать). Цитата:
Это же for..in цикл. Проходит по всем (почти) ключам объекта. stages - это же наш объект, который мы объявили выше. А var key - это мы объявили переменную, в которой и будут итерироваться ключи (как var i в обычном цикле). Прочитать можно как «для каждого свойства в объекте "stages" выполнить: пусть key будет именем текущего свойства...» |
Короче его делать просто не нужно. Для такой задачи — адекватный, хорошо читаемый код. Пусть его длина вас не смущает. Попытки сократить приведут к тому, что читаться будет хуже.
|
Antonius, верно. Еще бы хорошо вместо document.write просто менять значение переменной и делать document.write вконце.
|
2 danik.js
Почти всё понял, уверен спустя месяц перечитаю всё и пойму еще лучше)) Спасибо большое что отвечаешь) Цитата:
2 Antonius Ничего себе, похожие ники, похожие :) Ну мне было просто интересно, как можно сократить код, ведь как по мне, чем короче код тем быстрее он работает, я прав да?) Цитата:
|
Цитата:
Цитата:
document.write(age < 81 ? "Я очень стар" : "Я суперстар"); //или var str = age < 81 ? "Я очень стар" : "Я суперстар"; document.write(str); |
Цитата:
Но ведь глупо говорить о "скорости" в конексте твоего примера, который при любой из трех реализаций отработает менее чем за миллисекунду. Поэтому нужно выбирать наиболее читаемый и поддерживаемый способ, а не быстрый. |
Цитата:
|
Дорогие товарищи, работая в notepad++ и постоянно перескакивая в браузер, который зависает сразу если неправильно написал цикл, возник новый вопрос.
Какой IDE посоветуете для работы с JS? Написал код, тут же его проверил. Написал бесконечный цикл, тут тебе выскочила ошибка "сынок, у тебя бесконечный цикл, проснись" :D Что вы можете сказать про JetBrains Webstorm? |
Цитата:
|
Цитата:
|
Цитата:
http://habrahabr.ru/company/codeorchestra/blog/204538/ |
Цитата:
|
бесплатная версия только окошко выкидывает периодически
шторм тоже платный кстати |
Цитата:
|
Цитата:
|
Товарищи, я остановился на Sublime Text. Очень удобный интерфейс, со сниппетами до конца еще не разобрался но программка в целом очень нравится :) Сейчас у меня была задача сделать таблицу умножения.
В примечании написано: Использовать цикл в цикле. for (var i = 1; i < 10; i++) {
for (var j = 1; j < 10; j++) {
var result = i * j;
}
}
Вот само решение, конечно, без помощи гугла я бы не сдвинулся дальше, но сейчас я хорошо понимаю что тут написано. <table border="1">
<script type="text/javascript">
for (var i = 1; i < 10; i++) {
document.write("<tr>");
for (var j = 1; j < 10; j++) {
var result = i * j;
document.write("<td>"+result+"</td>");
}
document.write("</tr>");
}
</script>
</table>
Возникли проблемы решения такой же задачи с Do While, через пол часа отпишусь если не смогу сам решить :D да в любом случае я сюда всё выкладываю, ОпенСорс фор зе вин! :lol: |
Цитата:
|
Граждане! Сейчас изучаю While и For. Это два цикла.
For я больше понимаю чем While. Но вот тут главный вопрос: Есть ли какая либо задача без которой нельзя обойтись без While? |
Цитата:
Цитата:
|
Товарищи офицеры, у меня возник маленький баг и я не в курсе как его решить. Вроде всё понятно, но цикл работает не правильно.
Да и в конце выводит не 5, а 6...я не знаю где я напортачил.. Нужно чтобы выскакивало сообщение до тех пор пока юзер не напишет число больше 5. :help: for (var i = 0; i <= 5; i++) {
i = Number(prompt("Введите любое число больше 5"));
if (i <= 5){
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
}
else{
alert("Спасибо, вы ввели "+i);
break;
}
}
document.write("Число "+i);
|
Цитата:
Цитата:
Цитата:
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
-->
<style type="text/css">
</style>
<script type="text/javascript">
while (true) {
var i = Number(prompt("Введите любое число больше 5"));
if (i <= 5){
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
} else {
alert("Спасибо, вы ввели "+i);
break;
};
}
document.write("Число "+i);
</script>
</head>
<body>
</body>
</html>
|
Другой вариант (насколько я знаю за while(true) в некоторых местах могут наругать, правда за присвоение в условии тоже наругают :) )
var promptNumber = function() {
return Number(prompt("Введите любое число больше 5"));
}
var i;
while ( (i = promptNumber()) <= 5) {
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
}
alert("Спасибо, вы ввели "+i);
//document.write("Число "+i);
|
Цитата:
do {
var i = Number(prompt("Введите любое число больше 5"));
if (i <= 5){
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
} else {
alert("Спасибо, вы ввели "+i);
};
} while (i<=5);
alert("Число "+i);
//document.write("Число "+i);
|
Вариант учитывает ввод ошибочных данных к примеру букв
for (var getNumber = function () {
return prompt("Введите любое число больше 5")
}, i; i = getNumber(), 5 >= i || isNaN(i);)
//закончили объявление переменных и условие цикла, ниже строчка одна - тело цикла как видите можно без {}
alert("Вы ввели " + (isNaN(i) ? 'не число': i) + ". Пожалуйста введите число больше 5");
alert("Спасибо, вы ввели " + i);
Цитата:
стандартный цикл это объявление переменных var a, b, c...; выполнение действий можно в цепочку, последнее условие a++, b -=1, !с; выполнение действий после выполнения прохода тела цикла --g, d=0, z-- for (var i = 3, b = 0; alert('i - ' + i--), i; alert('b - ' + b++))console.log(i, b);
|
Вот за такое и ругают :)
Если можно — не значит, что нужно. А тут человек явно написал, что только учится. Не учите плохому сразу — сам научится. |
Цитата:
В нашем случае на не совсем "правильном" оформлении кода. |
Цитата:
Стандарты? Удобство читаемости? Стиль написания? Какие ошибки. Ошибки в ваших примерах логические Возьмите код for(var i = 0; i < 5; i += 1){alert(i)}
Закиньте его в компилятор от Google http://closure-compiler.appspot.com/home |
И тут я познакомился с функциями :) переварив код, вопросов не появилось :)))
Цитата:
ksa а как сделать тоже самое с циклом for ? Ведь мой вариант выводит не всё так четко как в твоем случае. Просто for мне больше нравится :D Цитата:
Спасибо!! Интересно) Цитата:
Плохого не пожелают :lol: Цитата:
|
Цитата:
for (;true;) {
var i = Number(prompt("Введите любое число больше 5"));
if (i <= 5){
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
} else {
alert("Спасибо, вы ввели "+i);
break;
};
};
alert("Число "+i);
//document.write("Число "+i);
Но это уже полный изврат... :D Цитата:
|
Вот как я представляю алгоритм реализации:
введенное_число = спросить_число() пока (введенное_число <= 5) { рапортуем("не канает!") введенное_число = спросить_число() } соответственно мой немного измененный вариант: var promptNumber = function() {
return Number(prompt("Введите любое число больше 5"));
}
var i = promptNumber();
while (i <= 5) {
alert("Вы ввели "+i+" , Пожалуйста введите число больше 5");
i = promptNumber();
}
alert("Спасибо, вы ввели "+i);
//document.write("Число "+i);
Помоему это самый простой, легко читаемый, очевидный и сам собой напрашивающийся вариант. В первом варианте я просто укоротил запись, и впринципе код так же укладывается в алгоритм. Найду странным если другие сомной не согласятся :) |
danik.js, цикл с постусловием тут больше подходит... ;)
http://javascript.ru/forum/misc/4335...tml#post284829 |
ksa, у тебя дублируется проверка условия. Это не хорошо.
|
| Часовой пояс GMT +3, время: 02:08. |