🗊Презентация Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17)

Нажмите для полного просмотра!
Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №1Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №2Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №3Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №4Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №5Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №6Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №7Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №8Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №9Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №10Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №11Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №12Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №13Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №14Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №15Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №16Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №17Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №18Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №19Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №20Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №21Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №22Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №23Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №24Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №25Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №26Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №27Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №28Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №29Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №30Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №31Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №32Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №33Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №34Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №35Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №36Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №37Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №38Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №39Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №40Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №41Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №42Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №43Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №44Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №45Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №46Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №47Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №48Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №49Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №50Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №51Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №52Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17), слайд №53

Содержание

Вы можете ознакомиться и скачать презентацию на тему Веб-технологии в промышленности и образовании. Типы данных и операторы в JavaScript. (Лекция 17). Доклад-сообщение содержит 53 слайдов. Презентации для любого класса можно скачать бесплатно. Если материал и наш сайт презентаций Mypresentation Вам понравились – поделитесь им с друзьями с помощью социальных кнопок и добавьте в закладки в своем браузере.

Слайды и текст этой презентации


Слайд 1





Веб-технологии в промышленности и образовании
Лекция 17
Типы данных и операторы в JavaScript
Описание слайда:
Веб-технологии в промышленности и образовании Лекция 17 Типы данных и операторы в JavaScript

Слайд 2





Введение
Как и любой другой язык программирования, JavaScript поддерживает встроенные структуры и типы данных. Все их многообразие подразделяется на:
литералы;
переменные;
массивы;
функции;
объекты.
При этом все они делятся на встроенные и определяемые программистом. Функции и объекты будут рассмотрены в следующей лекции.
Описание слайда:
Введение Как и любой другой язык программирования, JavaScript поддерживает встроенные структуры и типы данных. Все их многообразие подразделяется на: литералы; переменные; массивы; функции; объекты. При этом все они делятся на встроенные и определяемые программистом. Функции и объекты будут рассмотрены в следующей лекции.

Слайд 3





Литералы
Литералом называют данные, которые используются в программе непосредственно. При этом под данными понимаются числа или строки текста. Все они рассматриваются в JavaScript как элементарные типы данных. Приведем примеры литералов:
числовой литерал: 10
числовой литерал: 2.310
числовой литерал: 2.3e+2
строковый литерал: 'Это строковый литерал'
строковый литерал: "Это строковый литерал"
Описание слайда:
Литералы Литералом называют данные, которые используются в программе непосредственно. При этом под данными понимаются числа или строки текста. Все они рассматриваются в JavaScript как элементарные типы данных. Приведем примеры литералов: числовой литерал: 10 числовой литерал: 2.310 числовой литерал: 2.3e+2 строковый литерал: 'Это строковый литерал' строковый литерал: "Это строковый литерал"

Слайд 4





Литералы
Литералы используются в операциях присваивания значений переменным или в операциях сравнения:
var a=10;
var str = 'Строка';
if(x=='test') alert(x);
Описание слайда:
Литералы Литералы используются в операциях присваивания значений переменным или в операциях сравнения: var a=10; var str = 'Строка'; if(x=='test') alert(x);

Слайд 5





Литералы
Оператор присваивания ( переменная = выражение ) возвращает результат вычисления выражения, поэтому ничто не мешает полученное значение присвоить еще и другой переменной. Таким образом, последовательность операторов присваивания выполняется справа налево:
result = x = 5+7;
Описание слайда:
Литералы Оператор присваивания ( переменная = выражение ) возвращает результат вычисления выражения, поэтому ничто не мешает полученное значение присвоить еще и другой переменной. Таким образом, последовательность операторов присваивания выполняется справа налево: result = x = 5+7;

Слайд 6





Литералы
Два варианта строковых литералов необходимы для того, чтобы использовать вложенные строковые литералы. Если в строковом литерале требуется использовать одинарную кавычку, то сам литерал можно заключить в двойные кавычки: "It's cool!". Верно и обратное. Но если есть необходимость использовать в строковом литерале оба вида кавычек, то проще всего всех их "экранировать" символом обратной косой черты \, при этом саму строку можно заключить в любую пару кавычек.
Описание слайда:
Литералы Два варианта строковых литералов необходимы для того, чтобы использовать вложенные строковые литералы. Если в строковом литерале требуется использовать одинарную кавычку, то сам литерал можно заключить в двойные кавычки: "It's cool!". Верно и обратное. Но если есть необходимость использовать в строковом литерале оба вида кавычек, то проще всего всех их "экранировать" символом обратной косой черты \, при этом саму строку можно заключить в любую пару кавычек.

Слайд 7





Литералы
Например:
команда:
document.write("It\'s good to say \"Hello\" to someone!");
выдаст:
It's good to say "Hello" to someone!
Описание слайда:
Литералы Например: команда: document.write("It\'s good to say \"Hello\" to someone!"); выдаст: It's good to say "Hello" to someone!

Слайд 8





Литералы
Помимо строковых литералов (последовательностей символов, заключенных в кавычки) есть еще строковые объекты ; они создаются конструктором: 
var s = new String(). 
У этого объекта существует много методов (об объектах и методах пойдет речь в следующей лекции). Следует понимать, что строковый литерал и строковый объект - далеко не одно и то же. Но зачастую мы этого не замечаем, т.к. при применении к строчным литералам методов строчных объектов происходит преобразование первых в последние.
Описание слайда:
Литералы Помимо строковых литералов (последовательностей символов, заключенных в кавычки) есть еще строковые объекты ; они создаются конструктором: var s = new String(). У этого объекта существует много методов (об объектах и методах пойдет речь в следующей лекции). Следует понимать, что строковый литерал и строковый объект - далеко не одно и то же. Но зачастую мы этого не замечаем, т.к. при применении к строчным литералам методов строчных объектов происходит преобразование первых в последние.

Слайд 9





Литералы
Например, можно сначала присвоить 
var s='abra-kadabra', 
а затем применить метод: 
var m=s.split('b'), который неявно преобразует строковый литерал s в строковый объект и затем разбивает строку в тех местах, где встречается подстрока 'b', возвращая массив строк-кусков: массив m будет состоять из строк 'a', 'ra-kada' и 'ra' (массивы рассматриваются ниже).
Описание слайда:
Литералы Например, можно сначала присвоить var s='abra-kadabra', а затем применить метод: var m=s.split('b'), который неявно преобразует строковый литерал s в строковый объект и затем разбивает строку в тех местах, где встречается подстрока 'b', возвращая массив строк-кусков: массив m будет состоять из строк 'a', 'ra-kada' и 'ra' (массивы рассматриваются ниже).

Слайд 10





Переменные
Переменная - это область памяти, имеющая свое имя и хранящая некоторые данные. Переменные в JavaScript объявляются с помощью оператора var, при этом можно давать или не давать им начальные значения:
var k;
var h='Привет!';
Описание слайда:
Переменные Переменная - это область памяти, имеющая свое имя и хранящая некоторые данные. Переменные в JavaScript объявляются с помощью оператора var, при этом можно давать или не давать им начальные значения: var k; var h='Привет!';

Слайд 11





Переменные
Можно объявлять сразу несколько переменных в одном операторе var (тем самым уменьшая размер кода), но тогда их надо писать через запятую. При этом тоже можно давать или не давать начальные значения:
var k, h='Привет!';
var t=37, e=2.71828;
Описание слайда:
Переменные Можно объявлять сразу несколько переменных в одном операторе var (тем самым уменьшая размер кода), но тогда их надо писать через запятую. При этом тоже можно давать или не давать начальные значения: var k, h='Привет!'; var t=37, e=2.71828;

Слайд 12





Переменные
Тип переменной определяется по присвоенному ей значению. Язык JavaScript - слабо типизирован: в разных частях программы можно присваивать одной и той же переменной значения различных типов, и интерпретатор будет "на лету" менять тип переменной.
Описание слайда:
Переменные Тип переменной определяется по присвоенному ей значению. Язык JavaScript - слабо типизирован: в разных частях программы можно присваивать одной и той же переменной значения различных типов, и интерпретатор будет "на лету" менять тип переменной.

Слайд 13





Переменные
Узнать тип переменной можно с помощью оператора typeof():
var i=5;          alert(typeof(i));
i= new Array();   alert(typeof(i));
i= 3.14;          alert(typeof(i));
i= 'Привет!';     alert(typeof(i));
i= window.open(); alert(typeof(i));
Описание слайда:
Переменные Узнать тип переменной можно с помощью оператора typeof(): var i=5; alert(typeof(i)); i= new Array(); alert(typeof(i)); i= 3.14; alert(typeof(i)); i= 'Привет!'; alert(typeof(i)); i= window.open(); alert(typeof(i));

Слайд 14





Переменные
Переменная, объявленная оператором var вне функций, является глобальной - она "видна" всюду в скрипте. Переменная, объявленная оператором var внутри какой-либо функции, является локальной - она "видна" только в пределах этой функции. Подробнее о функциях будет рассказано в следующем разделе этой лекции.
Описание слайда:
Переменные Переменная, объявленная оператором var вне функций, является глобальной - она "видна" всюду в скрипте. Переменная, объявленная оператором var внутри какой-либо функции, является локальной - она "видна" только в пределах этой функции. Подробнее о функциях будет рассказано в следующем разделе этой лекции.

Слайд 15





Переменные
Например, в следующем фрагменте ничего не будет выведено на экран, несмотря на то, что мы обращаемся к переменной k после описания функции, и даже после ее вызова:
function f()
{ var k=5; }
f(); alert(k);
Причина в том, что переменная k является локальной, и она существует только в процессе работы функции f(), а по окончании ее работы уничтожается.
Описание слайда:
Переменные Например, в следующем фрагменте ничего не будет выведено на экран, несмотря на то, что мы обращаемся к переменной k после описания функции, и даже после ее вызова: function f() { var k=5; } f(); alert(k); Причина в том, что переменная k является локальной, и она существует только в процессе работы функции f(), а по окончании ее работы уничтожается.

Слайд 16





Переменные
Если имеется глобальная переменная k, а внутри функции объявляется локальная переменная с тем же именем (оператором var k ), то это будет другая переменная, и изменение ее значения внутри функции никак не повлияет на значение глобальной переменной с тем же именем. Например, этот скрипт выдаст 7, поскольку вызов функции f() не затронет значения глобальной переменной k:
var k=7;
function f()
{ var k=5; }
f(); alert(k);
Описание слайда:
Переменные Если имеется глобальная переменная k, а внутри функции объявляется локальная переменная с тем же именем (оператором var k ), то это будет другая переменная, и изменение ее значения внутри функции никак не повлияет на значение глобальной переменной с тем же именем. Например, этот скрипт выдаст 7, поскольку вызов функции f() не затронет значения глобальной переменной k: var k=7; function f() { var k=5; } f(); alert(k);

Слайд 17





Переменные
То же касается и аргументов при описании функций (с той лишь разницей, что перед ними не нужно ставить var ): если имеется глобальная переменная k, и мы опишем функцию function f(k) {...}, то переменная k внутри {...} никак не связана с одноименной глобальной переменной. В этом плане JavaScript не отличается от других языков программирования.
Описание слайда:
Переменные То же касается и аргументов при описании функций (с той лишь разницей, что перед ними не нужно ставить var ): если имеется глобальная переменная k, и мы опишем функцию function f(k) {...}, то переменная k внутри {...} никак не связана с одноименной глобальной переменной. В этом плане JavaScript не отличается от других языков программирования.

Слайд 18





Переменные
Примечание. Объявлять переменные можно и без оператора var, просто присваивая переменной начальное значение. Так зачастую делают с переменными циклов. В следующем примере, даже если переменная i не была объявлена ранее, все будет работать корректно:
for(i=0; i<8; i++) { ... }
Однако опускать var не рекомендуется.
Описание слайда:
Переменные Примечание. Объявлять переменные можно и без оператора var, просто присваивая переменной начальное значение. Так зачастую делают с переменными циклов. В следующем примере, даже если переменная i не была объявлена ранее, все будет работать корректно: for(i=0; i<8; i++) { ... } Однако опускать var не рекомендуется.

Слайд 19





Переменные
Вне функций объявление переменной без оператора var равносильно объявлению с оператором var - в обоих случаях переменная будет глобальной. Внутри же функции объявление переменной без оператора var делает переменную глобальной (а не локальной, как можно было бы предположить), и значит, ее значение могут "видеть" и менять другие функции или операторы вне этой функции. При этом такая переменная становится глобальной не после описания, а после вызова этой функции. Пример:
function f()
{ var i=5; k=7; }
f(); alert(k);
Описание слайда:
Переменные Вне функций объявление переменной без оператора var равносильно объявлению с оператором var - в обоих случаях переменная будет глобальной. Внутри же функции объявление переменной без оператора var делает переменную глобальной (а не локальной, как можно было бы предположить), и значит, ее значение могут "видеть" и менять другие функции или операторы вне этой функции. При этом такая переменная становится глобальной не после описания, а после вызова этой функции. Пример: function f() { var i=5; k=7; } f(); alert(k);

Слайд 20





Переменные
В приведённом примере после i=5 стоит точка с запятой (а не запятая). Значит, k=7 - это отдельное объявление переменной, уже без оператора var. Поэтому переменная k "видна" снаружи и ее значение ( 7 ) будет выведено оператором alert(k). Чтобы скрыть переменную k, нужно было после i=5 поставить запятую.
Описание слайда:
Переменные В приведённом примере после i=5 стоит точка с запятой (а не запятая). Значит, k=7 - это отдельное объявление переменной, уже без оператора var. Поэтому переменная k "видна" снаружи и ее значение ( 7 ) будет выведено оператором alert(k). Чтобы скрыть переменную k, нужно было после i=5 поставить запятую.

Слайд 21





Массивы
Массивы делятся на встроенные ( document.links[], document.images[] и т.п. - их еще называют коллекциями ) и определяемые пользователем (автором документа). Коллекции будут обсуждаться в следующей лекции. Здесь же мы подробно остановимся на массивах, определяемых пользователем. Для массивов определено несколько методов: join(), reverse(), sort() и другие, а также свойство length, которое позволяет получить число элементов массива.
Описание слайда:
Массивы Массивы делятся на встроенные ( document.links[], document.images[] и т.п. - их еще называют коллекциями ) и определяемые пользователем (автором документа). Коллекции будут обсуждаться в следующей лекции. Здесь же мы подробно остановимся на массивах, определяемых пользователем. Для массивов определено несколько методов: join(), reverse(), sort() и другие, а также свойство length, которое позволяет получить число элементов массива.

Слайд 22





Массивы
Для определения массива пользователя существует специальный конструктор Array. Если ему передается единственный аргумент, причем целое неотрицательное число, то создается незаполненный массив соответствующей длины. Если же передается один аргумент, не являющийся числом, либо более одного аргумента, то создается массив, заполненный этими элементами:
Описание слайда:
Массивы Для определения массива пользователя существует специальный конструктор Array. Если ему передается единственный аргумент, причем целое неотрицательное число, то создается незаполненный массив соответствующей длины. Если же передается один аргумент, не являющийся числом, либо более одного аргумента, то создается массив, заполненный этими элементами:

Слайд 23





Массивы
a = new Array(); // пустой массив (длины 0) 
b = new Array(10); // массив длины 10 
c = new Array(10,'Привет'); // массив из двух элементов: числа и строки 
d = [5, 'Тест', 2.71828, 'Число e']; // краткий способ создать массив из 4 элементов
Описание слайда:
Массивы a = new Array(); // пустой массив (длины 0) b = new Array(10); // массив длины 10 c = new Array(10,'Привет'); // массив из двух элементов: числа и строки d = [5, 'Тест', 2.71828, 'Число e']; // краткий способ создать массив из 4 элементов

Слайд 24





Массивы
Элементы массива нумеруются с нуля. Поэтому в последнем примере значение d[0] равно 5, а значение d[1] равно 'Тест'. Как видим, массив может состоять из разнородных элементов. Массивы не могут быть многомерными, однако ничто не мешает завести массив, элементами которого будут тоже массивы.
Описание слайда:
Массивы Элементы массива нумеруются с нуля. Поэтому в последнем примере значение d[0] равно 5, а значение d[1] равно 'Тест'. Как видим, массив может состоять из разнородных элементов. Массивы не могут быть многомерными, однако ничто не мешает завести массив, элементами которого будут тоже массивы.

Слайд 25





Метод join()
Метод join() позволяет объединить элементы массива в одну строку. Он является обратным к методу split(), который разрезает объект типа String на куски и составляет из них массив. Кстати, метод split() демонстрирует тот факт, что массив можно получить и без конструктора массива.
Описание слайда:
Метод join() Метод join() позволяет объединить элементы массива в одну строку. Он является обратным к методу split(), который разрезает объект типа String на куски и составляет из них массив. Кстати, метод split() демонстрирует тот факт, что массив можно получить и без конструктора массива.

Слайд 26





Метод join()
Рассмотрим пример преобразования локального URL в глобальный URL, где в качестве адреса сервера будет выступать www.vsu.by. Пусть в переменной localURL хранится локальный URL некоторого файла:
localURL = "file:///C:/department/internet/js/2/2.html"
Описание слайда:
Метод join() Рассмотрим пример преобразования локального URL в глобальный URL, где в качестве адреса сервера будет выступать www.vsu.by. Пусть в переменной localURL хранится локальный URL некоторого файла: localURL = "file:///C:/department/internet/js/2/2.html"

Слайд 27





Метод join()
Разрежем строку в местах вхождения комбинации символов " :/ ", выполнив команду: b = localURL.split(':/'). Получим массив:
b[0] = "file";
b[1] = "//C";
b[2] = "department/internet/js/2/2.html";
Описание слайда:
Метод join() Разрежем строку в местах вхождения комбинации символов " :/ ", выполнив команду: b = localURL.split(':/'). Получим массив: b[0] = "file"; b[1] = "//C"; b[2] = "department/internet/js/2/2.html";

Слайд 28





Метод join()
Заменяем 0-й и 1-й элементы на требуемые:
b[0] = "http:";
b[1] = "/www.vsu.by";
Наконец, склеиваем полученный массив, вставляя косую черту в местах склейки: globalURL = b.join("/"). В итоге мы получаем требуемый глобальный URL - значение globalURL будет равно: http://www.vsu.by/department/internet/js/2/2.html.
Описание слайда:
Метод join() Заменяем 0-й и 1-й элементы на требуемые: b[0] = "http:"; b[1] = "/www.vsu.by"; Наконец, склеиваем полученный массив, вставляя косую черту в местах склейки: globalURL = b.join("/"). В итоге мы получаем требуемый глобальный URL - значение globalURL будет равно: http://www.vsu.by/department/internet/js/2/2.html.

Слайд 29





Метод reverse()
Метод reverse() применяется для изменения порядка элементов массива на противоположный. Предположим, массив упорядочен следующим образом:
a = new Array('мать','видит','дочь');
Описание слайда:
Метод reverse() Метод reverse() применяется для изменения порядка элементов массива на противоположный. Предположим, массив упорядочен следующим образом: a = new Array('мать','видит','дочь');

Слайд 30





Метод reverse()
Упорядочим его в обратном порядке, вызвав метод a.reverse(). Тогда новый массив a будет содержать:
a[0]='дочь';
a[1]='видит';
a[2]='мать';
Описание слайда:
Метод reverse() Упорядочим его в обратном порядке, вызвав метод a.reverse(). Тогда новый массив a будет содержать: a[0]='дочь'; a[1]='видит'; a[2]='мать';

Слайд 31





Метод sort()
Метод sort() интерпретирует элементы массива как строковые литералы и сортирует массив в алфавитном (т.н. лексикографическом) порядке. Обратите внимание: метод sort() меняет массив. В предыдущем примере, применив a.sort(), мы получим на выходе:
a[0]='видит';
a[1]='дочь';
a[2]='мать';
Описание слайда:
Метод sort() Метод sort() интерпретирует элементы массива как строковые литералы и сортирует массив в алфавитном (т.н. лексикографическом) порядке. Обратите внимание: метод sort() меняет массив. В предыдущем примере, применив a.sort(), мы получим на выходе: a[0]='видит'; a[1]='дочь'; a[2]='мать';

Слайд 32





Метод sort()
Однако, это неудобно, если требуется отсортировать числа, поскольку согласно алфавитному порядку 40 идет раньше чем 5. Для этих целей у метода sort() имеется необязательный аргумент, являющийся именем функции, согласно которой требуется отсортировать массив, т.е. в этом случае вызов метода имеет вид: a.sort(myfunction). Эта функция должна удовлетворять определенным требованиям:
у нее должно быть ровно два аргумента;
функция должна возвращать число;
если первый аргумент функции должен считаться меньшим (большим, равным) чем второй аргумент, то функция должна возвратить отрицательное (положительное, ноль) значение.
Описание слайда:
Метод sort() Однако, это неудобно, если требуется отсортировать числа, поскольку согласно алфавитному порядку 40 идет раньше чем 5. Для этих целей у метода sort() имеется необязательный аргумент, являющийся именем функции, согласно которой требуется отсортировать массив, т.е. в этом случае вызов метода имеет вид: a.sort(myfunction). Эта функция должна удовлетворять определенным требованиям: у нее должно быть ровно два аргумента; функция должна возвращать число; если первый аргумент функции должен считаться меньшим (большим, равным) чем второй аргумент, то функция должна возвратить отрицательное (положительное, ноль) значение.

Слайд 33





Метод sort()
Например, если нам требуется сортировать числа, то мы можем описать следующую функцию:
function compar(a,b)
{
 if(a < b)  return -1;
 if(a > b)  return  1;
 if(a == b) return  0;
}
Описание слайда:
Метод sort() Например, если нам требуется сортировать числа, то мы можем описать следующую функцию: function compar(a,b) { if(a < b) return -1; if(a > b) return 1; if(a == b) return 0; }

Слайд 34





Метод sort()
Теперь, если у нас есть массив b = new Array(10,6,300,25,18);, то можно сравнить результаты сортировки без аргумента и с функцией compar в качестве аргумента:
document.write("Алфавитный порядок:<BR>");
document.write(b.sort());
document.write("<BR>Числовой порядок:<BR>");
document.write(b.sort(compar));
Описание слайда:
Метод sort() Теперь, если у нас есть массив b = new Array(10,6,300,25,18);, то можно сравнить результаты сортировки без аргумента и с функцией compar в качестве аргумента: document.write("Алфавитный порядок:<BR>"); document.write(b.sort()); document.write("<BR>Числовой порядок:<BR>"); document.write(b.sort(compar));

Слайд 35





Метод sort()
В результате выполнения этого кода получим следующее:
Алфавитный порядок:
10,18,25,300,6
Числовой порядок:
6,10,18,25,300
Обратите внимание: метод sort() интерпретирует элементы массива как строки (и производит лексикографическую сортировку), но не преобразует их в строки. Если в массиве были числа, то они числами и останутся. В этом легко убедиться, если в конце последнего примера выполнить команду document.write(b[3]+1): результат будет 26 (т.е. 25+1 ), а не 251 (т.е. "25"+"1" ).
Описание слайда:
Метод sort() В результате выполнения этого кода получим следующее: Алфавитный порядок: 10,18,25,300,6 Числовой порядок: 6,10,18,25,300 Обратите внимание: метод sort() интерпретирует элементы массива как строки (и производит лексикографическую сортировку), но не преобразует их в строки. Если в массиве были числа, то они числами и останутся. В этом легко убедиться, если в конце последнего примера выполнить команду document.write(b[3]+1): результат будет 26 (т.е. 25+1 ), а не 251 (т.е. "25"+"1" ).

Слайд 36





Операторы языка
В этом разделе будут рассмотрены операторы JavaScript. Основное внимание при этом мы уделим операторам декларирования и управления потоком вычислений. Без них не может быть написана ни одна JavaScript-программа.
Общий перечень этих операторов выглядит следующим образом (сразу оговоримся, что этот список неполный):
{...}
if ... else ...
()?
while
for
break
continue
return
Описание слайда:
Операторы языка В этом разделе будут рассмотрены операторы JavaScript. Основное внимание при этом мы уделим операторам декларирования и управления потоком вычислений. Без них не может быть написана ни одна JavaScript-программа. Общий перечень этих операторов выглядит следующим образом (сразу оговоримся, что этот список неполный): {...} if ... else ... ()? while for break continue return

Слайд 37





Операторы языка
{...}
Фигурные скобки определяют составной оператор JavaScript - блок . Основное назначение блока - определение тела цикла, тела условного оператора или функции.
Описание слайда:
Операторы языка {...} Фигурные скобки определяют составной оператор JavaScript - блок . Основное назначение блока - определение тела цикла, тела условного оператора или функции.

Слайд 38





Операторы языка
if ... else ...
Условный оператор применяется для ветвления программы по некоторому логическому условию. Есть два варианта синтаксиса:
if (логическое_выражение) оператор;
if (логическое_выражение) оператор_1; else оператор_2;
Описание слайда:
Операторы языка if ... else ... Условный оператор применяется для ветвления программы по некоторому логическому условию. Есть два варианта синтаксиса: if (логическое_выражение) оператор; if (логическое_выражение) оператор_1; else оператор_2;

Слайд 39





Операторы языка
Логическое выражение - это выражение, которое принимает значение true или false. В первом варианте синтаксиса: если логическое_выражение равно true, то выполняется указанный оператор. Во втором варианте синтаксиса: если логическое_выражение равно true, то выполняется оператор_1, если же оно равно false оператор_2. Пример использования (об объекте navigator читай лекцию ):
if (navigator.javaEnabled())
 alert('Ваш браузер поддерживает Java');
else
 alert('Ваш браузер НЕ поддерживает Java');
Описание слайда:
Операторы языка Логическое выражение - это выражение, которое принимает значение true или false. В первом варианте синтаксиса: если логическое_выражение равно true, то выполняется указанный оператор. Во втором варианте синтаксиса: если логическое_выражение равно true, то выполняется оператор_1, если же оно равно false оператор_2. Пример использования (об объекте navigator читай лекцию ): if (navigator.javaEnabled()) alert('Ваш браузер поддерживает Java'); else alert('Ваш браузер НЕ поддерживает Java');

Слайд 40





Операторы языка
()?
Этот оператор, называемый условным выражением, выдает одно из двух значений в зависимости от выполнения некоторого условия. Синтаксис его таков:
(логическое_выражение)? значение_1 : значение_2
Описание слайда:
Операторы языка ()? Этот оператор, называемый условным выражением, выдает одно из двух значений в зависимости от выполнения некоторого условия. Синтаксис его таков: (логическое_выражение)? значение_1 : значение_2

Слайд 41





Операторы языка
Если логическое_выражение равно true, то возвращается значение_1, в противном случае значение_2. Условное выражение легко имитируется оператором if...else, однако оно позволяет сделать более компактным и легко воспринимаемым код программы. Например, следующие два фрагмента равносильны:
TheFinalMessage = (k>5)? 'Готово!' : 'Подождите...';
 if(k>5) TheFinalMessage = 'Готово!';
 else    TheFinalMessage = 'Подождите...';
Описание слайда:
Операторы языка Если логическое_выражение равно true, то возвращается значение_1, в противном случае значение_2. Условное выражение легко имитируется оператором if...else, однако оно позволяет сделать более компактным и легко воспринимаемым код программы. Например, следующие два фрагмента равносильны: TheFinalMessage = (k>5)? 'Готово!' : 'Подождите...'; if(k>5) TheFinalMessage = 'Готово!'; else TheFinalMessage = 'Подождите...';

Слайд 42





Операторы языка
while
Оператор while задает цикл. Определяется он в общем случае следующим образом:
while (условие_продолжения_цикла) тело_цикла;
Тело цикла может быть как простым, так и составным оператором. Составной оператор, как всегда, заключается в фигурные скобки. Рекомендуется и простой оператор заключать в них, чтобы программу можно было легко модифицировать.
Описание слайда:
Операторы языка while Оператор while задает цикл. Определяется он в общем случае следующим образом: while (условие_продолжения_цикла) тело_цикла; Тело цикла может быть как простым, так и составным оператором. Составной оператор, как всегда, заключается в фигурные скобки. Рекомендуется и простой оператор заключать в них, чтобы программу можно было легко модифицировать.

Слайд 43





Операторы языка
Условие_продолжения_цикла является логическим выражением. 
Тело исполняется до тех пор, пока верно логическое условие. Формально, цикл while работает следующим образом:
проверяется условие_продолжения_цикла:
если оно ложно ( false ), цикл закончен,
если же истинно ( true ), то продолжаем далее;
выполняется тело_цикла ;
переходим к пункту 1.
Описание слайда:
Операторы языка Условие_продолжения_цикла является логическим выражением. Тело исполняется до тех пор, пока верно логическое условие. Формально, цикл while работает следующим образом: проверяется условие_продолжения_цикла: если оно ложно ( false ), цикл закончен, если же истинно ( true ), то продолжаем далее; выполняется тело_цикла ; переходим к пункту 1.

Слайд 44





Операторы языка
Такой цикл используется, когда заранее неизвестно количество итераций, например, в ожидании некоторого события. Пример:
var s='';
while (s.length<6)
{
 s=prompt('Введите строку длины не менее 6:','');
}
alert('Ваша строка: ' + s + '. Спасибо!');
Описание слайда:
Операторы языка Такой цикл используется, когда заранее неизвестно количество итераций, например, в ожидании некоторого события. Пример: var s=''; while (s.length<6) { s=prompt('Введите строку длины не менее 6:',''); } alert('Ваша строка: ' + s + '. Спасибо!');

Слайд 45





Операторы языка
for
Оператор for - это еще один оператор цикла. В общем случае он имеет вид:
for (инициализация_переменных_цикла; условие_продолжения_цикла; модификация_переменных_цикла) 
тело_цикла;
Описание слайда:
Операторы языка for Оператор for - это еще один оператор цикла. В общем случае он имеет вид: for (инициализация_переменных_цикла; условие_продолжения_цикла; модификация_переменных_цикла) тело_цикла;

Слайд 46





Операторы языка
Тело цикла может быть как простым, так и составным оператором (составной необходимо заключать в фигурные скобки). Операторы инициализация_переменных_цикла и модификация_переменных_цикла могут состоять из нескольких простых операторов, в этом случае простые операторы должны быть разделены запятой.
Описание слайда:
Операторы языка Тело цикла может быть как простым, так и составным оператором (составной необходимо заключать в фигурные скобки). Операторы инициализация_переменных_цикла и модификация_переменных_цикла могут состоять из нескольких простых операторов, в этом случае простые операторы должны быть разделены запятой.

Слайд 47





Операторы языка
Условие_продолжения_цикла является логическим выражением. Цикл for работает следующим образом:
    выполняется инициализация_переменных_цикла ;
    проверяется условие_продолжения_цикла:
        если оно ложно ( false ), цикл закончен,
        если же истинно ( true ), то продолжаем далее;
    выполняется тело_цикла ;
    выполняется модификация_переменных_цикла ;
    переходим к пункту 2.
Описание слайда:
Операторы языка Условие_продолжения_цикла является логическим выражением. Цикл for работает следующим образом: выполняется инициализация_переменных_цикла ; проверяется условие_продолжения_цикла: если оно ложно ( false ), цикл закончен, если же истинно ( true ), то продолжаем далее; выполняется тело_цикла ; выполняется модификация_переменных_цикла ; переходим к пункту 2.

Слайд 48





Операторы языка
Рассмотрим типичный пример использования этого оператора:
document.write('Кубы чисел от 1 до 100:');
for (n=1; n<=100; n++)
 document.write('<BR>'+n+'<sup>3</sup> = '+ Math.pow(n,3));
Здесь Math - встроенный объект, предоставляющий многочисленные математические константы и функции, а Math.pow(n,m) вычисляет степенную функцию nm. Результат работы скрипта получите самостоятельно.
Описание слайда:
Операторы языка Рассмотрим типичный пример использования этого оператора: document.write('Кубы чисел от 1 до 100:'); for (n=1; n<=100; n++) document.write('<BR>'+n+'<sup>3</sup> = '+ Math.pow(n,3)); Здесь Math - встроенный объект, предоставляющий многочисленные математические константы и функции, а Math.pow(n,m) вычисляет степенную функцию nm. Результат работы скрипта получите самостоятельно.

Слайд 49





Операторы языка
break
Оператор break позволяет досрочно покинуть тело цикла. Возвращаясь к нашему примеру с кубами чисел, распечатаем только кубы, не превышающие 5000.
document.write('Кубы чисел, меньшие 5000:');
for (n=1; n<=100; n++)
{  
 s=Math.pow(n,3);
 if(s>5000) break;
 document.write('<BR>'+n+'<sup>3</sup> = '+s);
}
Описание слайда:
Операторы языка break Оператор break позволяет досрочно покинуть тело цикла. Возвращаясь к нашему примеру с кубами чисел, распечатаем только кубы, не превышающие 5000. document.write('Кубы чисел, меньшие 5000:'); for (n=1; n<=100; n++) { s=Math.pow(n,3); if(s>5000) break; document.write('<BR>'+n+'<sup>3</sup> = '+s); }

Слайд 50





Операторы языка
continue
Оператор continue позволяет перейти к следующей итерации цикла, пропустив выполнение всех нижестоящих операторов в теле цикла. Если нам нужно вывести кубы чисел от 1 до 100, превышающие 10 000, то мы можем составить такой цикл:
document.write('Кубы чисел от 1 до 100, большие 10 000:');
for (n=1; n<=100; n++){  
 s=Math.pow(n,3);
 if(s <= 10000) continue;
 document.write('<BR>'+n+'<sup>3</sup> = '+s);}
Описание слайда:
Операторы языка continue Оператор continue позволяет перейти к следующей итерации цикла, пропустив выполнение всех нижестоящих операторов в теле цикла. Если нам нужно вывести кубы чисел от 1 до 100, превышающие 10 000, то мы можем составить такой цикл: document.write('Кубы чисел от 1 до 100, большие 10 000:'); for (n=1; n<=100; n++){ s=Math.pow(n,3); if(s <= 10000) continue; document.write('<BR>'+n+'<sup>3</sup> = '+s);}

Слайд 51





Операторы языка
return
Оператор return используют для возврата значения из функции или обработчика события. Рассмотрим пример с функцией:
function  sign(n)
{ 
 if (n>0) return 1;
 if (n<0) return -1;
 return 0;
}
alert( sign(-3) );
Обратите внимание: оператор return не только указывает, какое значение должна вернуть функция, но и прекращает выполнение дальнейших операторов в теле функции.
Описание слайда:
Операторы языка return Оператор return используют для возврата значения из функции или обработчика события. Рассмотрим пример с функцией: function sign(n) { if (n>0) return 1; if (n<0) return -1; return 0; } alert( sign(-3) ); Обратите внимание: оператор return не только указывает, какое значение должна вернуть функция, но и прекращает выполнение дальнейших операторов в теле функции.

Слайд 52





Операторы языка
При использовании в обработчиках событий оператор return позволяет отменить или не отменять действие по умолчанию, которое совершает браузер при возникновении данного события. Отменить его, однако, можно не для всех событий. Рассмотрим пример:
<FORM ACTION="newpage.html" METHOD=post> <INPUT TYPE=submit VALUE="Отправить?" onClick="alert('Не отправим!'); return false;"> </FORM>
В этом примере без оператора return false пользователь увидел бы окно предупреждения "Не отправим!" и далее был бы перенаправлен на страницу newpage.html. Оператор же return false позволяет отменить отправку формы, и пользователь лишь увидит окно предупреждения.
Описание слайда:
Операторы языка При использовании в обработчиках событий оператор return позволяет отменить или не отменять действие по умолчанию, которое совершает браузер при возникновении данного события. Отменить его, однако, можно не для всех событий. Рассмотрим пример: <FORM ACTION="newpage.html" METHOD=post> <INPUT TYPE=submit VALUE="Отправить?" onClick="alert('Не отправим!'); return false;"> </FORM> В этом примере без оператора return false пользователь увидел бы окно предупреждения "Не отправим!" и далее был бы перенаправлен на страницу newpage.html. Оператор же return false позволяет отменить отправку формы, и пользователь лишь увидит окно предупреждения.

Слайд 53





Операторы языка
Аналогично, чтобы отменить действие по умолчанию для параметров событий onClick, onKeyDown, onKeyPress, onMouseDown, onMouseUp, onSubmit, onReset, нужно использовать return false. Для события onMouseOver с этой же целью нужно использовать оператор return true. Для некоторых же событий, например onMouseOut, onLoad, onUnload, отменить действие по умолчанию невозможно.
Описание слайда:
Операторы языка Аналогично, чтобы отменить действие по умолчанию для параметров событий onClick, onKeyDown, onKeyPress, onMouseDown, onMouseUp, onSubmit, onReset, нужно использовать return false. Для события onMouseOver с этой же целью нужно использовать оператор return true. Для некоторых же событий, например onMouseOut, onLoad, onUnload, отменить действие по умолчанию невозможно.



Похожие презентации
Mypresentation.ru
Загрузить презентацию