На цьому занятті поговоримо про таке:

• 1. Важливі моменти

  2. Змінні

  3. Типи даних

  4. Масиви

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=tB1w8OPyUUA

https://www.youtube.com/watch?v=K1GpvzPeHH0

https://www.youtube.com/watch?v=BMonOVU72ho

Важливо!

1. 1. Для деяких завдань надано частину коду, не видаляйте та не змінюйте його, адже це вплине на перевірку, результат буде некоректним. None - не є частиною коду, необхідно видалити.

   2. Не пишіть зайвого коду, реалізуйте лише вимоги завдання.

   3. Всі стрічки повинні бути лише латинкою, кирилиця призведе до помилки!

   4. Рекомендуємо перевіряти результат виконання завдання в браузері (консоль) або ж в онлайн-редакторах, де є така можливість. Лише після цього копіюйте текст в поле та відправляйте на перевірку. Не залишайте в коді для перевірки console.log() чи alert(), використовйте ці методи лише для перевірки роботи коду в консолі!

   5. Не публікуте правильну реалізацію на форумі - такі пости будемо видаляти без попередження.

   6. Якщо при перевірці практичного завдання виникла помилка - задавайте запитання на форумі, однак спочатку пошукайте серед вже створених розділів, щоб не дублювати теми.

Опис завдання:

Оголосити змінну «name» та призначити їй значення "Peter", а також змінну «age» і значення 20.

Перевіряються всі змінні на коректність присвоєних значень.

CТВОРЕННЯ СИСТЕМИ РЕЄСТРАЦІЇ ТА АВТОРИЗАЦІЇ КОРИСТУВАЧІВ ЗА ДОПОМОГОЮ PHP І MYSQL.

На цьому занятті поговоримо про таке:

1. 1. Умови

   2. Цикли

   3. Switch

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=AdgMNkbcKic

https://www.youtube.com/watch?v=VLTiiS0qrmo

Практичне завдання

Важливо!

1. 1. Для деяких завдань надано частину коду, не видаляйте та не змінюйте його, адже це вплине на перевірку, результат буде некоректним. None - не є частиною коду, необхідно видалити.

   2. Не пишіть зайвого коду, реалізуйте лише вимоги завдання.

   3. Всі стрічки повинні бути лише латинкою, кирилиця призведе до помилки!

   4. Рекомендуємо перевіряти результат виконання завдання в браузері (консоль) або ж в онлайн-редакторах, де є така можливість. Лише після цього копіюйте текст в поле та відправляйте на перевірку. Не залишайте в коді для перевірки console.log() чи alert(), використовйте ці методи лише для перевірки роботи коду в консолі!

   5. Не публікуте правильну реалізацію на форумі - такі пости будемо видаляти без попередження.

   6. Якщо при перевірці практичного завдання виникла помилка - задавайте запитання на форумі, однак спочатку пошукайте серед вже створених розділів, щоб не дублювати теми.

Опис завдання:

1. Оголосити змінну «name» та призначити їй значення "Peter", а також змінну «age» і значення 20.

Перевіряються всі змінні на коректність присвоєних значень.

2. Оголосити змінні «first» та «second» призначити їм значення 10 та 20, а потім змінну «result», а їй суму значень змінних «first» та «second».

Перевіряються всі змінні на коректність присвоєних значень.

3. Змінній «result» має присвоюватись значення "Good" якщо «check» == true та "Bad", якщо «check» == false.

Перевіряється змінна «result» на коректність присвоєння значення.

4. Створити змінну «resultArray» (масив). Створити змінні «first» = 1, «second» = 2, «senseOfLife» = 42. За допомогою методу масива .push() додати в масив спочатку «first» потім «second». Після цього, за допомогою методу .unshift() додати змінну «senseOfLife».

Перевіряються всі змінні на коректність присвоєних значень та правильна послідовність змінних в масиві.

На цьому заняття поговоримо про таке:

1. 1. 1. Функції

      2. Область видимості

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=3WRm6meDJkk

https://www.youtube.com/watch?v=VriukrD7BBg

Для перевірки та закріплення пройденого матеріалу пройдіть тест за посиланням:

https://courses.prometheus.org.ua/courses/course-v1:LITS+114+2017_T4/courseware/dce31ca2bda747b7b3f34df1e84d6cae/22d6e08771604b81b2c972b2883c3979/?activate_block_id=block-v1%3ALITS%2B114%2B2017_T4%2Btype%40sequential%2Bblock%4022d6e08771604b81b2c972b2883c3979

На цьому занятті поговоримо про таке:

1. 1. 1. DOM part

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=xAItEGhfy-0

https://www.youtube.com/watch?v=dNeU06zEFI8

Практичне завдання

Всі завдання лабораторних робіт призначені для закріплення знань і впливають на загальний результат оцінки курсу.

Важливо!

1. 1. Для деяких завдань надано частину коду, не видаляйте та не змінюйте його, адже це вплине на перевірку, результат буде некоректним. None - не є частиною коду, необхідно видалити.

   2. Не пишіть зайвого коду, реалізуйте лише вимоги завдання.

   3. Всі стрічки повинні бути лише латинкою, кирилиця призведе до помилки!

   4. Рекомендуємо перевіряти результат виконання завдання в браузері (консоль) або ж в онлайн-редакторах, де є така можливість. Лише після цього копіюйте текст в поле та відправляйте на перевірку. Не залишайте в коді для перевірки console.log() чи alert(), використовйте ці методи лише для перевірки роботи коду в консолі!

   5. Не публікуте правильну реалізацію на форумі - такі пости будемо видаляти без попередження.

   6. Якщо при перевірці практичного завдання виникла помилка - задавайте запитання на форумі, однак спочатку пошукайте серед вже створених розділів, щоб не дублювати теми.

Завдання №1

1 можливий бал (оцінюється)

Опис завдання:

Правильно підключіть jQuery до HTML сторінки, використовуючи CDN (http://code.jquery.com/jquery-1.9.1.min.js).

Для виконання завдання скопіюйте шаблон в робочу область.

Завдання №2

1 можливий бал (оцінюється)

Опис завдання:

Виберіть три DOM елемента за допомогою jQuery. Для пошуку елементів використовуйте $:

1. Зверніться до елемента <div id="test"></div> за id = "test" та присвойте вибраний елемент змінній id.

2. Зверніться до елемента <div class ="test"></div> за класом class = "test" та присвойте вибрані елементи змінній className

3. Зверніться до елемента <span></span> за тегом та присвойте вибрані елементи змінній tag

Завдання №3

1 можливий бал (оцінюється)

Опис завдання:

Задано параграф: <p>Hello, World!!!</p>

Реалізуйте функцію, використовуючи jQuery, яка спрацює на click подію по тексту. Функція має змінити колір тексту на "red" та розмір тексту на "30px". Для пошуку елементів використовуйте $

В реалізації необхідно використати chaining

На цьому занятті поговоримо про таке:

1. 1. 1. Події

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=vXP3gWHoIOA

https://www.youtube.com/watch?v=5m93W5Jth3g

Практичне завдання

Для закріплення пройденого матеріалу пройдіть, будь ласка тест за посиланням:

https://courses.prometheus.org.ua/courses/course-v1:LITS+114+2017_T4/courseware/53435b438e4940ae86aa3e8498ef53ba/e705e1a31e0d4cee8741fc577c51c37f/?activate_block_id=block-v1%3ALITS%2B114%2B2017_T4%2Btype%40sequential%2Bblock%40e705e1a31e0d4cee8741fc577c51c37f

На цьому занятті поговоримо про таке:

1. 1. 1. Навіщо дебажити код

      2. Web Development Tools

      3. Console.log(); Debugger; Alert();

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=F3Gzd5FHoD0

https://www.youtube.com/watch?v=qPpPW9readM

Завдання 1.

Створити кнопку на веб сторінці, при натисканні на кнопку має виводитись alert з фразою: «Привіт!»

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/XQgbZE

Завдання 2.

Створити форму з кнопкою та полем вводу. При натисканні на кнопку має виводитись вміст поля вводу через alert.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/LvLVrq

Завдання 3.

Створити форму з кнопкою та двома полями вводу. Написати скрипт, який здійснює обмін вмістом між полями вводу, по натисканні на кнопку.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/LvLVMv

Завдання 4.

Створити кнопку, по натисканню на кнопку текст на ній має змінюватись.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/ZZyGNo

Завдання 5.

Створити веб сторінку з одним блоком та кнопкою.

Написати скрипт, який, при натисканні на кнопку, буде надавати блоку наступні стилі: width – 200px; height – 200px; background-color: magenta; text-align: center;

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/NmvvbB

Завдання 6*.

Додати ще одну кнопку до попередньої веб-сторінки. При натисканні на яку, колір блоку буде змінюватись на green.

Завдання 7.

Створити веб сторінку з заголовком, трьома абзацами з довільним текстом та кнопкою.

По кліку на кнопку зміст абзаців має змінитись на їх порядковий номер.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/MRvvxY

Для успішної здачі лабораторної роботи, надішліть у відповідь посилання на виконані вами завдання у середовищи CodePen або самі коди виконаних завдань.

Завдання 1.

Створити веб-сторінку з таблицею, що складається з п’яти рядків та п’яти стовпичків.

Виділити комірки по діагоналі, тобто написати скрипт, який змінить фон відповідних комірок, як показано на рисунку нижче.

Вам потрібно буде отримати з таблиці table все діагональні td.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/QPMMee

Завдання 2*.

Змінити код з попереднього завдання таким чином, щоб виділялась інша діагональ. Підказка – треба ввести додатковий лічильник у циклі for. Наприклад додати лічильник j (вказується через кому).

Завдання 3.

Створити калькулятор, який буде додавати і віднімати числа. Приклад реалізації на рисунку нижче.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/BEdwLe

Завдання 4*.

Розширте можливості калькулятор, додавши функції віднімання та ділення.

Завдання 5.

Створити цифровий годинник за допомогою js. Для цього використовувати вбудовані функції роботи з датою та часом у JS. Має вийти щось таке:

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/jRLGxr

Завдання 6*.

Додати до створенного годинника відображення секунд.

Завдання 7.

Написати скрипт - гру “Вгадай число”. Скрипт має генерувати випадкове число від 1 до 100. Для цього можна використовувати вбудовану функції ​ random ​ ​ та ​ floor ​ ​ із пакета Math. Почитати про них тут:

Завдання користувача відгадати число та записати його у textbox.

Скрипт має виводити підказки (більше/менше). У випадку якщо користувач вгадав число скрипт має виводити: “Вітаю, ви вгадали!”.

Також реалізувати кнопку “Зіграти ще”, яка буде стирати весь текст підказок та змінювати значення числа на нове.

Має вийти щось таке:

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/eoEGqy

Для успішної здачі лабораторної роботи, надішліть у відповідь посилання на виконані вами завдання у середовищи CodePen або самі коди виконаних завдань.

На цьому занятті поговоримо про таке:

Об’єкти у функція,. Конструктори

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=k4EjhGXr_dI&feature=youtu.be

Завдання 1.

Створити кнопку на веб сторінці, при натисканні на кнопку має виводитись alert з фразою: «Привіт!»

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/XQgbZE

Завдання 2.

Створити форму з кнопкою та полем вводу. При натисканні на кнопку має виводитись вміст поля вводу через alert.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/LvLVrq

Завдання 3.

Створити форму з кнопкою та двома полями вводу. Написати скрипт, який здійснює обмін вмістом між полями вводу, по натисканні на кнопку.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/LvLVMv

Завдання 4.

Створити кнопку, по натисканню на кнопку текст на ній має змінюватись.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/ZZyGNo

Завдання 5.

Створити веб сторінку з одним блоком та кнопкою.

Написати скрипт, який, при натисканні на кнопку, буде надавати блоку наступні стилі: width – 200px; height – 200px; background-color: magenta; text-align: center;

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/NmvvbB

Завдання 6*.

Додати ще одну кнопку до попередньої веб-сторінки. При натисканні на яку, колір блоку буде змінюватись на green.

Завдання 7.

Створити веб сторінку з заголовком, трьома абзацами з довільним текстом та кнопкою.

По кліку на кнопку зміст абзаців має змінитись на їх порядковий номер.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/MRvvxY

Для успішної здачі лабораторної роботи, надішліть у відповідь посилання на виконані вами завдання у середовищи CodePen або самі коди виконаних завдань.

Виконайте наступні завдання:

Завдання 1.

Створити веб-сторінку з таблицею, що складається з п’яти рядків та п’яти стовпичків.

Виділити комірки по діагоналі, тобто написати скрипт, який змінить фон відповідних комірок, як показано на рисунку нижче.

Вам потрібно буде отримати з таблиці table все діагональні td.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/QPMMee

Завдання 2*.

Змінити код з попереднього завдання таким чином, щоб виділялась інша діагональ. Підказка – треба ввести додатковий лічильник у циклі for. Наприклад додати лічильник j (вказується через кому).

Завдання 3.

Створити калькулятор, який буде додавати і віднімати числа. Приклад реалізації на рисунку нижче.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/BEdwLe

Завдання 4*.

Розширте можливості калькулятор, додавши функції віднімання та ділення.

Завдання 5.

Створити цифровий годинник за допомогою js. Для цього використовувати вбудовані функції роботи з датою та часом у JS. Має вийти щось таке:

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/jRLGxr

Завдання 6*.

Додати до створенного годинника відображення секунд.

Завдання 7.

Написати скрипт - гру “Вгадай число”. Скрипт має генерувати випадкове число від 1 до 100. Для цього можна використовувати вбудовану функції ​ random ​ ​ та ​ floor ​ ​ із пакета Math. Почитати про них тут:

Завдання користувача відгадати число та записати його у textbox.

Скрипт має виводити підказки (більше/менше). У випадку якщо користувач вгадав число скрипт має виводити: “Вітаю, ви вгадали!”.

Також реалізувати кнопку “Зіграти ще”, яка буде стирати весь текст підказок та змінювати значення числа на нове.

Має вийти щось таке:

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/eoEGqy

Для успішної здачі лабораторної роботи, надішліть у відповідь посилання на виконані вами завдання у середовищи CodePen або самі коди виконаних завдань.

Перегляньте наступні відео за посиланням:

https://www.youtube.com/watch?v=GEWG4ROD4tU&feature=youtu.be

Практичне заняття.

console.log('*** PERSON ***');

function Person (name) {

this.name = name;

}

// визначаємо властивості, методи

Person.prototype = {

eyes: 2,

mouth: 1,

sleep: function () {

return 'zzz';

}

};

// створюємо людину (Person)

const p1 = new Person('Nick');

// and we can do:

console.log(

`name: ${p1.name}`,

`eyes: ${p1.eyes}`,

`mouth: ${p1.mouth}`,

p1.sleep()

);

console.log('*** EMPLOYEE ***')

// Тепер, якщо у нас є «клас» співробітника, то можна успадковувати його властивості.

function Employee (name, salary) {

this.name = name;

this.salary = salary;

}

// прототип успадкування

Employee.prototype = Object.create(Person.prototype);

Employee.prototype.constructor = Employee; // Устанавливаем его конструктор

// Повторюємо те ж саме

// створюємо співробітника

const em1 = new Employee('John', 3000);

// і прописуємо наступне:

console.log(

`name: ${em1.name}`,

`salary: ${em1.salary} USD`,

`eyes: ${em1.eyes}`,

`mouth: ${em1.mouth}`,

em1.sleep()

);

Зареєструйтеся в онлайн редакторі коду https://codepen.io/trending

Робота з масивами та числами в JS. Створюємо власний калькулятор.

Завдання 1.

Створити змінну «resultArray» (масив). Створити змінні «first» = 1, «second» = 2, «senseOfLife» = 42. За допомогою методу масива .push() додати в масив спочатку «first» потім «second». Після цього, за допомогою методу .unshift() додати змінну «senseOfLife». Вивести значення масиву на сторінку за допомогою функції document.write();

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут – https://codepen.io/bazvlamar/pen/oOLyOE

Завдання 2.

Створити змінну «start» = 100 та пустий масив «result». Створити цикл, який заповнить масив «result» значеннями від 100 до 0 включно за допомогою декремента. Вивести значення масиву на сторінку за допомогою функції document.write().

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут -https://codepen.io/bazvlamar/pen/VNKEZa

Завдання 3.

Створити функцію з назвою isEven, яка буде приймати число і повертати булевий результат (True/False). True – число парне, False – число не парне. Для виконання нам знадобиться оператор залишок від ділення. Результат повернути за допомогою ключового слова "return". Вивести результат на сторінку за допомогою функції document.write().

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/eodPda

Завдання 4*.

Модифікувати попереднє завдання наступним чином:

Додати форму на веб сторінку з одним input та однією кнопкою з написом «Перевірити». Користувач буде вводити число в input, а натискання кнопки буде запускати скрипт, який визначить введене число парне чи ні, та виведе результат на веб сторінку.

Завдання 5.

Створити масив numbers з довільним числом елементів. Створити два пустих масива odd та even. Написати скрипт, який буде переносити числа з масиву numbers в odd, якщо вони не парні, або в масив even якщо вони парні. Результат виводити на веб-сторінку.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/XQjGye

/*

принцип дії такої програми: https://media.giphy.com/media/kWlFRjghngxxK/giphy.gif

*/

Завдання 6.

Створити функцію – калькулятор. Функція приймає 3 параметра:

перший параметр типу Number,

другий парамерт типу Number,

третій параметр типу String, в якому передається значення операції. Значеннями операції можуть бути: «+», «-» , «*» і «/».

Функція повинна повернути результат виконаної операції за допомогою return.

Спробуйте це зробити самостійно. Якщо не вийде, або для перевірки можете переглянути підказку тут - https://codepen.io/bazvlamar/pen/wZzOba

Завдання 7*.

Створити скрипт, який буде працювати як калькулятор з попереднього завдання. Параметри num1, num2, mark має задавати користувач через модальні вікна (prompt(title,default)) або через форму. Результат виконання має виводитись через alert() або на веб-сторінку.

Для успішної здачі лабораторної роботи, надішліть у відповідь посилання на виконані вами завдання у середовищи CodePen або самі коди виконаних завдань.

В рамках сьогоднішнього заняття Вам необхідно виконати наступні дії:

1. Скачати та встановити XAMPP.

2. Запустити phpMyAdmin та ознайомитись з його інтерфейсом.

3. Створитив власну базу даних.

4. Створити дві таблиці (Students та Groups). Структуру таблиць наведено на рисунку нижче.

5. Створити зв'язок між таблицями.

6. Заповнити таблиці тестовими данниими (2-3 записи в кожній таблиці).

В рамках ціє лабораторної роботи Вам необхідно виконати наступні дії:

1. Скачати та встановити XAMPP.

2. Запустити phpMyAdmin та ознайомитись з його інтерфейсом.

3. Створитив власну базу даних.

4. Створити дві таблиці (Students та Groups). Структуру таблиць наведено нижче.

5. Створити зв'язок між таблицями.

6. Заповнити таблиці тестовими данниими (2-3 записи в кожній таблиці).

CТВОРЕННЯ СИСТЕМИ РЕЄСТРАЦІЇ ТА АВТОРИЗАЦІЇ КОРИСТУВАЧІВ ЗА ДОПОМОГОЮ PHP І MYSQL.

Дмитро Мехед запрошує вас на заплановану конференцію: Zoom.

Тема: CТВОРЕННЯ СИСТЕМИ РЕЄСТРАЦІЇ ТА АВТОРИЗАЦІЇ КОРИСТУВАЧІВ ЗА ДОПОМОГОЮ PHP І MYSQL

Время: 18 дек. 2020 06:00 PM Хельсинки

Подключиться к конференции Zoom

https://us04web.zoom.us/j/72727665528?pwd=dHVBQ0Vlb2xsQTZzU2RsNHdLVlpQZz09

Идентификатор конференции: 727 2766 5528

Код доступа: nfX0Cd

Практичне заняття

В якості відповіді на це завдання, вам треба завантажити скріншот з вікном привітання вашої веб-форми з вашим ім'ям. Як показано на рисунку нижче.

CТВОРЕННЯ СИСТЕМИ РЕЄСТРАЦІЇ ТА АВТОРИЗАЦІЇ КОРИСТУВАЧІВ ЗА ДОПОМОГОЮ PHP І MYSQL.



Дмитро Мехед приглашает вас на запланированную конференцию: Zoom.

Подключиться к конференции Zoom

https://us04web.zoom.us/j/74264291093?pwd=ZEJzbStqcjZiTFNPK0hYcFQ4TGdIUT09

Идентификатор конференции: 742 6429 1093

Код доступа: PN3j6i

Практичне заняття

В якості відповіді на це завдання, вам треба завантажити скріншот з вікном привітання вашої веб-форми з вашим ім'ям. Як показано на рисунку нижче.

Форми та їх елементи

Робота в сервісі Zoom. Відеоконференція за попереднім запрошенням (Дмитро Мехед доцент кафедри Кібербезпеки та ММ приглашает вас на запланированную конференцию: Zoom.

Тема: Zoom meeting invitation - Zoom Meeting Дмитро Мехед доцент кафедри Кібербезпеки та ММ

Время: 30 дек. 2020 06:00 PM Хельсинки

Подключиться к конференции Zoom

https://us04web.zoom.us/j/73055805158?pwd=UkpjSkpwWGV6VGY4YXQzam1Uc290UT09

Идентификатор конференции: 730 5580 5158

Код доступа: PvK6b3).

Практична робота

Завдання

Створити документ form1.html, в якому створити власну форму (за варіантами) з

• обов’язковим використанням наступних елементів:

• введення тексту (text)

• введення паролю (password)

• прапорці (checkbox)

• радіокнопки (radio)

• кнопки («відправити», «очистити», «перейти») (button)

• малюнок (image)

• FIELDSET та LEGEND

Варіанти

1. Форма відвідувача лікарні

2. Форма відвідувача бібліотеки

3. Форма студентської анкети

4. Форма клієнта туристичної фірми

5. Форма відвідувача спортзала

6. Форма замовлення книжок

7. Форма замовлення авіаквитків

8. Форма замовлення товарів поштою

9. Форма покупці комп’ютерної техніки

10. Форма замовлення побутової техніки

Основи програмування

Сьогодні говоритимо про наступне:

• Двійкова система
• Подання даних
• Алгоритми
• Псевдокод
• Scratch

Дмитро Мехед приглашает вас на запланированную конференцию: Zoom.

Тема: Zoom meeting invitation - Zoom Meeting Дмитро Мехед

Время: 6 янв. 2021 06:00 PM Хельсинки

Подключиться к конференции Zoom

https://us04web.zoom.us/j/76332639494?pwd=d0MzckJkLy9ZQnU5RWFlRmhEcG9tUT09

Идентификатор конференции: 763 3263 9494

Код доступа: J2HYDU

Опис завдання

1. Завантажте та встановіть останню версію Chrome, якщо вона у вас й досі не встановлена.
2. Створіть свій власний проект на Скретч. На допомогу вам ось ця інструкція.

1. Scratch for Budding Computer Scientists
2. Getting Started with Scratch
3. Scratch Cards

• У вашому проекті має бути хоча би два спрайти і хоча б один із них повинен бути чимось, окрім кота.
• У вашому проекті повинні бути використані хоча б три скрипти загалом (не обов’язково три на один спрайт).
• У вашому проекті повинна бути використана хоча б одна умова, один цикл та одна змінна.
• У вашому проекті повинен бути хоча б один звук.
• Ваш проект має бути складнішими за продемонстровані у лекції (багато з них були дуже короткими), але може бути не таким складним, як «Найважча гра Ліги Плюща». У вашому проекті має бути десь з дюжину блоків.

Ми вже дізналися, що завдяки безлічі рівнів абстрагування та тим, хто до нас займався цією темою, ми можемо легко писати програми, які в остаточному підсумку будуть просто двійковими, 0 і 1.

Розв’язання задачі можна описати як прийом вхідних даних (задачі) та використання алгоритму для пошуку вихідних даних (розв’язку).

Комп'ютери представляють вхідні та вихідні дані за допомогою значної кількості бітів, двійкових цифр, 0 та 1, що увімкнені або вимкнекні. Із достатньою кількістю бітів ми можемо представляти не тільки великі числа, а й текст, зображення та відео.

Можна використати різні алгоритми, які будуть розв’язувати одну і ту саму задачу, але з різним часом виконання.

Ми можемо запусувати алгоритми точніше за допомогою псевдокоду, а також використовувати концепції функцій, циклів та умов.

За допомогою добровольців в аудиторії ми зробили бутерброди з арахісовим маслом та желе, хоча кожен з нас інтерпретував інструкції по-різному!

Виявляється, ми (люди), природно, робимо припущення та абстракції під час виконання інструкцій або навіть псевдокоду. Але, як ми бачили в мові програмування Scratch, а також побачимо в мові програмування С, тепер так робити не вдасться, і нам доведеться думати уважніше про кроки та випадки, з якими доведеться працювати нашим програмам.

Завдяки Scratch ми скористались напрацюваннями хлопців з MIT, які створили блоки та спрайти для створення власних програм. І ми також зробили власні блоки, такі як функція cough («кашель), це була наша власна абстракція.

Ми будемо використовувати нову мову C – це повністю текстова мова, яка містить складні службові слова та пунктуацію:

#include <stdio.h>

int main(void)

{

printf("hello, world\n");

}

Це еквівалентно блоку «коли натиснуто зелений прапорець» та «сказати «Привіт, світ!»:

Ми можемо порівняти багато конструкцій в мові програмування C з блоками, які ми вже бачили та використовували у Scratch. Синтаксис тут грає значно меншу роль, ніж принципи, з якими ми вже ознайомилися.

Блок «Сказати «Привіт, світ!» - це функція, вона відповідає printf("hello, world\n");. У C функція виводу на екран виглядає як printf, де f означає «форматування», тобто ми можемо форматувати рядок різними способами. Потім ми використовуємо круглі дужки, щоб передати те, що ми хочемо вивести. Використовуються подвійні лапки, щоб виокремити текст або рядок і додати \n що означає новий рядок на екрані. (Наступного разу, коли ми використаємо функцію printf, наш текст буде розташований у новому рядку). Нарешті, ми додаємо крапку з комою ; щоб закінчити цей рядок коду в C.

Блок «встановити [counter] у (0)» створює змінну, а в C ми б сказали int counter = 0;, де int вказує, що тип нашої змінної є цілим числом:

«Змінити [counter] на (1)» — це counter = counter + 1; в C. (У C = не є знаком «дорівнює», де ми стверджуємо, що counter це те ж, що і counter + 1. На відміну від цього, = означає «скопіювати значення праворуч у значення ліворуч».) Можна також сказати counter += 1; або counter++; обидва з яких — «синтаксичний цукор», скорочення, що дозволяє писати менше слів чи знаків, але виконувати ті самі речі.

Умова буде відповідна до

if (x < y)

{

printf("x is less than y\n");

}

Зверніть увагу, що в C ми використовуємо фігурні дужки { і } (а також відступи) щоб вказати, як мають бути вкладені рядки коду.

Також можливі умови «if-else» (якщо-інакше)

if (x < y)

{

printf("x is less than y\n");

}

else

{

printf("x is not less than y\n");

}

З іншого боку, пробіли, нові рядки та відступи, як правило, не є синтаксично важливими в C, тобто вони не впливають на те, як наша програма в кінцевому підсумку працює, але для нашого коду дуже важливо дотримуватися домовленостей і мати гарний «стиль», аби код був читабельним для людей.

І навіть else if

if (x < y)

{

printf("x is less than y\n");

}

else if (x > y)

{

printf("x is greater than y\n");

}

else if (x == y)

{

printf("x is equal to y\n");

}

Зверніть увагу, для порівняння двох значень у мові програмування C ми використовуємо ==, два знаки дорівнює.

Отже, за логікою, нам не потрібно if (x == y) в останній умові, оскільки це єдиний випадок, що лишився, і ми можемо просто використати else.

Цикли можна задавати ось так

while (true)

{

printf("hello, world\n");

}

Ключове слово while (поки) також вимагає певної умови, тому ми використовуємо true (істина) як булевий вираз, аби переконатися, що наш цикл буде працювати постійно. Наша програма перевірить, чи значення виразу вираховується як true (в цьому випадку це завжди істина), а потім запустить рядки всередині фігурних дужок. А потім буде повторюватися доти, поки вираз не перестане бути істинним (в цьому випадку він не зміниться).

for (int i = 0; i < 50; i++)

{

printf("hello, world\n");

}

Щоб написати цикл, який буде працювати визначену кількість разів, ми використовуємо ключове слово for і спочатку ми створюємо змінну i та присвоюємо їй значення 0. i традиційна назва для змінної, яка відстежує, скільки ітерацій циклів ми вже пройшли. Далі, ми перевіряємо, чи i < 50, щоразу, коли ми повертаємося вгору циклу, перш ніж запускати код усередині. Якщо цей вираз — true, ми запускаємо код всередині. Нарешті, після виконання коду, ми використовуємо i++ щоб додати одиницю до i, і цикл повторюється.

Ми також можемо отримати вхідні дані від користувача

Сьогодні говоритемемо про наступне:

• Компіляція

• Дебаггінг

• Пам’ять

• Ми почали курс з вивчення Scratch, а потім перейшли на мову програмування С.

• Нагадаємо, що ми пишемо вихідний код мовою програмування C, але ми маємо його спомпілювати на машинний код у двійковій системі, аби запустити на комп'ютері.

  1. clang це компілятор, з яким ми вже познайомилися, а make – це утіліта, яка допомагає нам запускати clang автоматично.

  2. Якщо б ми захотіли використати бібліотеку CS50 за допомогою #include <cs50.h>, та застосувати clang замість make, потрібно додати прапорець: clang hello.c -lcs50. Прапорець -l підключає файл cs50, який було встановлено у CS50 Sandbox.

• Компіляція вихідного коду на машинний відбувається у такі кроки:

  1. препроцессінг

  2. компіляція

  3. збирання

  4. компонування

• Препроцессінг складається з перегляду рядків, які починаються з #, як-от #include, перед тим, як виконувати все інше. Наприклад, #include <cs50.h> скаже clang знайти спочатку цей заголовковий файл, оскільки там міститься контент, який ми хочемо використати у нашій програмі. Потім, clang замінить вміст цих файлів в нашій програмі:

...

string get_string(string prompt);

int printf(const char *format, ...);

...

int main(void)

{

string name = get_string("Name: ");

printf("hello, %s\n", name);

}

• Компіляція бере наш вихідний код на С та конвертує на код асемблера, який виглядає ось так:

...

main: # @main

.cfi_startproc

# BB#0:

pushq %rbp

.Ltmp0:

.cfi_def_cfa_offset 16

.Ltmp1:

.cfi_offset %rbp, -16

movq %rsp, %rbp

.Ltmp2:

.cfi_def_cfa_register %rbp

subq $16, %rsp

xorl %eax, %eax

movl %eax, %edi

movabsq $.L.str, %rsi

movb $0, %al

callq get_string

movabsq $.L.str.1, %rdi

movq %rax, -8(%rbp)

movq -8(%rbp), %rsi

movb $0, %al

callq printf

...

• 1. Це низькорівневі інструкції, тому краще зрозумілі центральному процессору, і вцілому працюють з байтами, а не з такими абстракціями, як назви змінних.

• Наступний крок – взяти код асемблера та перекласти його на інструкції у двійковій системі – це називається збирання.

• І наостанок потрібно все скомпонувати, коли вміст пов'язаних бібліотек, як cs50.c, фактично включаються до нашої програми у двійковому вигляді.

Дебаггінг

• Уявімо, ми написали програму buggy0:

int main(void)

{

printf("hello, world\n")

}

• • Ми бачимо помилку, коли намагаємось скомпілювати цю програму за допомогою make про те, що ми не додали заголовковий файл.

  • Ми можемо запустити help50 make buggy0, що врешті-решт повідомить нам про необхідність додати #include <stdio.h>, який містить printf.

  • Ми все зробили, а тепер бачимо ще одну помилку та розуміємо, що ми забули поставити крапку з комою в кінці рядка.

• Давайте розглянемо іншу програму:

#include <stdio.h>

int main(void)

{

for (int i = 0; i <= 10; i++)

{

printf("#\n");

}

}

• • Хм, ми думали, що буде лише 10 символів #, але їх вийшло 11. Якби ми не знали, в чому полягає проблема (оскільки наша програма працює так, як ми її написали), то могли б додати ще один рядок print на допомогу:

#include <stdio.h>

int main(void)

{

for (int i = 0; i <= 10; i++)

{

printf("i is %i\n", i);

printf("#\n");

}

}

• • Тепер, ми бачимо, що i почалась з 0 і продовжувалась до 10, але ми повинні його зупинити на 9.

• Якби ми записали нашу програму без пробілів, як подано нижче, то вона все одно була б правильна:

#include <stdio.h>

int main(void)

{

for (int i = 0; i < 10; i++)

{

printf("i is %i\n", i);

printf("#\n");

}

}

• • Однак, читати в такому вигляді складно, це поганий дизайн. Набагато легше буде побачити вкладеність, якщо ми використаємо відступи для циклів.

  • Ми можемо запустити style50 buggy2.c, і побачити рекомендації, що нам слід змінити.

• Отже, нагадаємо, ми маємо три інструменти, які допоможуть нам покращити код:

  • help50

  • printf

  • style50

Пам’ять

• В середині наших комп`ютерів містяться чіпи RAM, тобто оперативна пам'ять, що зберігає дані для короткочасного використання. Можна зберігати файли на жорсткому диску (або SSD) для довготривалого зберігання, але коли ми його відкриємо та будемо вносити зміни, все копіюється до RAM. Попри те, що обсяг RAM значно менший та вона є тимчасовою (поки не буде вимкнене живлення), вона значно швидша.

• Можна розглядати байти, які зберігаються в RAM, у вигляді сітки:

  • Насправді там розташовані мільйони або навіть мільярди байтів на кожному чіпі.

• У мові програмування С коли ми створюєму змінну типу char розміром в один байт, вона буде фізично збережена в одній із таких комірок у RAM. Ціле число на чотири байти займе чотири таких комірки.

Розв’яжіть наведені задачі:

• Caesar (на оцінку)

• Vigenère (на оцінку)

• Crack (додатково, не оцінюється)

Сьогодні говоритемемо про наступне:

• Масиви

• Рядки

• Аргументи командного рядка

• Шифрування

Масиви

• У пам’яті ми можемо зберігати змінні послідовно, одна за одною. І в мові програмування С список збережених змінних, які розташовуються у суміжних комірках пам'яті, називається масивом.

• Виявляється, що з самими тільки масивами можна робити дуже цікаві речі.

• Розглянемо scores0.c:

#include <cs50.h>

#include <stdio.h>

int main(void)

{

// Get scores from user

int score1 = get_int("Score 1: ");

int score2 = get_int("Score 2: ");

int score3 = get_int("Score 3: ");

// Generate first bar

printf("Score 1: ");

for (int i = 0; i < score1; i++)

{

printf("#");

}

printf("\n");

// Generate second bar

printf("Score 2: ");

for (int i = 0; i < score2; i++)

{

printf("#");

}

printf("\n");

// Generate third bar

printf("Score 3: ");

for (int i = 0; i < score3; i++)

{

printf("#");

}

printf("\n");

}

• 
  

  • Ми отримуємо 3 результати (scores) від користувача та виводимо графічне позначення для кожного з них.

  • Наші 3 цілих числа, score1, score2, та score3 будуть збережені десь у пам’яті.

• Ми можемо використати цикл, або почнемо розділяти на частини:

#include <cs50.h>

#include <stdio.h>

void chart(int score);

int main(void)

{

// Get scores from user

int score1 = get_int("Score 1: ");

int score2 = get_int("Score 2: ");

int score3 = get_int("Score 3: ");

// Chart first score

printf("Score 1: ");

chart(score1);

// Chart second score

printf("Score 2: ");

chart(score2);

// Chart third score

printf("Score 3: ");

chart(score3);

}

// Generate bar

void chart(int score)

{

// Output one hash per point

for (int i = 0; i < score; i++)

{

printf("#");

}

printf("\n");

}

• 
  

  • Тепер маємо функцію chart яка буде виводити кожен результат.

  • Пам'ятайте, що нам потрібно мати на початку прототип, void chart(int score);. Ми моглиб мати всю функцію chart вгорі перед її використанням, але врешті наша функція main буде спускатись все нижче і шукати її буде все складніше.

• За допомогою масивів ми можемо зібрати результати в циклі, а потім одержати до них доступ, також в циклі:

// Generates a bar chart of three scores using an array

#include <cs50.h>

#include <stdio.h>

void chart(int score);

int main(void)

{

// Get scores from user

int scores[3];

for (int i = 0; i < 3; i++)

{

scores[i] = get_int("Score %i: ", i + 1);

}

// Chart scores

for (int i = 0; i < 3; i++)

{

printf("Score %i: ", i + 1);

chart(scores[i]);

}

}

// Generate bar

void chart(int score)

{

// Output one hash per point

for (int i = 0; i < score; i++)

{

printf("#");

}

printf("\n");

}

• 
  

  • Зверніть увагу, що ми застосовуємо int scores[3] для ініціалізації масиву з трьома цілими числами. Потім ми використовуємо scores[i] = ..., щоб зберегти значення в цьому масиві, використовуючи для цього індекс i від 0 до 2 (оскільки в нас три елементи).

  • Після цього ми використовуємо scores[i] для доступу до усіх значень в масиві за кожним індексом.

• У нас повторюється число 3 кілька разів, тому ми можемо виокремити його у константу, тобто число, яке ми можемо один раз задати й використовувати глобально:

#include <cs50.h>

#include <stdio.h>

const int COUNT = 3;

void chart(int score);

int main(void)

{

// Get scores from user

int scores[COUNT];

for (int i = 0; i < COUNT; i++)

{

scores[i] = get_int("Score %i: ", i + 1);

}

// Chart scores

for (int i = 0; i < COUNT; i++)

{

printf("Score %i: ", i + 1);

chart(scores[i]);

}

}

// Generate bar

void chart(int score)

{

// Output one hash per point

for (int i = 0; i < score; i++)

{

printf("#");

}

printf("\n");

}

• 
  

  • На початку ми використовуємо ключове слово const щоб визначити, що це незмінне значення. Його можна використовувати по всьому коду, і якщо ми захочемо щось змінити, достатньо змінити лише один раз. Врешті, назва COUNT написана великими літерами, щоб показати, що це константа (за домовленістю).

• Ми можемо за допомогою функції chart вивести всі результати, а не по одному стовпчику за раз:

#include <cs50.h>

#include <math.h>

#include <stdio.h>

const int COUNT = 3;

void chart(int count, int scores[]);

int main(void)

{

// Get scores from user

int scores[COUNT];

for (int i = 0; i < COUNT; i++)

{

scores[i] = get_int("Score %i: ", i + 1);

}

// Chart scores

chart(COUNT, scores);

}

// Generate bars

void chart(int count, int scores[])

{

// Output one hash per point

for (int i = 0; i < count; i++)

{

for (int j = 0; j < scores[i]; j++)

{

printf("#");

}

printf("\n");

}

}

• 
  

  • Передавши весь масив scores та кількість результатів count які ми хочемо вивести, ми можемо використати функцію chart для ітерування крізь масив scores. Фактично, chart наскільки великим є масив scores, тож ми обов'язково маємо передавати й count.

Рядки

• Рядки – це насправді просто масиви символів. Це можна побачити у string0.c:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

string s = get_string("Input: ");

printf("Output: ");

for (int i = 0; i < strlen(s); i++)

{

printf("%c\n", s[i]);

}

}

• 
  

  • Спочатку нам знадобиться нова бібліотека, string.h, для strlen, що показує нам довжину рядка. Далі ми використовуємо той же синтаксис для доступу до елементів масиву, s[i], аби вести окремі символи рядка s.

• Ми можемо покращити дизайн нашої програми. string0 була не надто ефективна, оскільки перевіряємо довжину рядка після введення кожного символу, в нашій умові. Проте оскільки довжина рядка не змінюється, то ми можемо перевіряти її лише один раз:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

string s = get_string("Input: ");

printf("Output:\n");

for (int i = 0, n = strlen(s); i < n; i++)

{

printf("%c\n", s[i]);

}

}

• 
  

  • Зараз, на початку нашого циклу, ми ініціалізуємо дві змінні i та n та записуємо довжину рядка у n. Далі ми можемо щоразу перевіряти значення без вираховування довжини рядка.

  • n буде доступна виключно в межах циклу for хоча ми можемо ініціалізувати її і поза ним, якщо нам потрібно буде її повторне використання.

• Коли рядок зберігається у пам’яті, кожен символ розміщується в одному байті в таблиці байтів. Десь, наприклад, слово Zamyla збережено у 6 байтах. Але нам потрібен ще один байт, для позначення кінця рядка:

  • Байт пам'яті, де збережено перший символ рядка, Z, позначено як s, оскільки ми назвали наш рядок s у коді вище. Далі, після останнього символу, a, ми маємо один байт з усіма 0 для позначення кінця рядку. І ьайт з усіма 0 називається нульовим символом, який можна також позначати як \0.

• Якби ми хотіли написати власну версію strlen, наприклад, то нам треба знати наступне:

#include <cs50.h>

#include <stdio.h>

int main(void)

{

// Prompt for user's name

string s = get_string("Name: ");

// Count number of characters up until '\0' (aka NUL)

int n = 0;

while (s[n] != '\0')

{

n++;

}

printf("%i\n", n);

}

• 
  

  • Тут ми перебираємо кожен символ рядка s, використовуючи той же синтаксис, що й для доступу до елементів масивів, і ми інкрементуємо лічильник, n, поки символ не дорівнюватиме нульовому символу, \0. Якщо він дорівнює, значить, ми в кінці рядка й можемо вивести значення n.

• Оскільки ми знаємо, що кожен символ має числове, ASCII значення, то можна вивести й таке:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

string s = get_string("String: ");

for (int i = 0; i < strlen(s); i++)

{

int c = (int) s[i];

printf("%c %i\n", s[i], c);

}

}

• 
  

  • За допомогою (int) s[i], wми беремо значення s[i] та перетворюємо символьний тип на цілочисельний. Після цього ми можемо вивести як символи, так і їхні числові значення.

  • Технічно ми навіть можемо зробити printf("%c %i\n", s[i], s[i]);, а printf розпізнає значення s[i] як ціле число.

• Тепер ми можемо поєднати те, що ми розглянули, аби створити програму, яка замінює маленькі літери на великі:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

string s = get_string("Before: ");

printf("After: ");

for (int i = 0, n = strlen(s); i < n; i++)

{

if (s[i] >= 'a' && s[i] <= 'z')

{

printf("%c", s[i] - ('a' - 'A'));

}

else

{

printf("%c", s[i]);

}

}

printf("\n");

}

• 
  

  • Спочатку ми отримуємо рядок s. Тоді, для кожного символу в рядку, якщо він в нижньому регістрі (його значення знаходиться між a та z), ми конвертуємо його на велику літеру. В іншому випадку, ми його просто виводимо.

  • Ми можемо перетворити малі літери у великі шляхом віднімання різниці між малою a та великою A. (Ми знаємо, що у малих літер більші значення, тому можна відняти різницю між ними та перетворити малі літери на великі.)

• Також є функції з бібліотек, які ми можемо використати для досягнення того ж ефекту:

#include <cs50.h>

#include <ctype.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

string s = get_string("Before: ");

printf("After: ");

for (int i = 0, n = strlen(s); i < n; i++)

{

if (islower(s[i]))

{

printf("%c", toupper(s[i]));

}

else

{

printf("%c", s[i]);

}

}

printf("\n");

}

• 
  

  • Можна використати функції islower() та toupper() з бібліотеки ctype. (Про це можна довідатись виключно з документації до бібліотеки, яку інші люди написали задовго до нас.)

  • Ми можемо використовувати програму командного рядка, man, щоб прочитати інструкцію з використання інших програм, якщо така існує. Наприклад, ми можемо запустити man toupper для перегляду документації для цієї функції. Ми побачимо, що toupper повертає символ таким, яким він є, якщо він не написаний маленькими літерами, тож отримаємо:

for (int i = 0, n = strlen(s); i < n; i++)

{

printf("%c", toupper(s[i]));

}

Аргументи командного рядка

• Ми використовували такі програми як make та clang, які приймають додаткові слова після своєї назви в командному рядку. Але насправді, наші програми також можуть приймати аргументи командного рядка.

• У argv0.c, ми змінюємо вигляд нашої функції main:

#include <cs50.h>

#include <stdio.h>

int main(int argc, string argv[])

{

if (argc == 2)

{

printf("hello, %s\n", argv[1]);

}

else

{

printf("hello, world\n");

}

}

• 
  

  • argc та argv - це дві змінні, які одержить функція main коли ми запустимо нашу програму з командного рядка. argcargc – це лічильник аргументів, тобто їх кількість, а argv - масив рядків, що є аргументами. Найперший аргумент, argv[0], буде назвою нашої програми (найперше надруковане слово, наприклад, ./hello). У цьому прикладі ми перевіримо, чи маємо ми два аргументи, і, якщо так, виведемо другий.

• Ми можемо вивести кожен аргумент, один за одним:

#include <cs50.h>

#include <stdio.h>

int main(int argc, string argv[])

{

for (int i = 0; i < argc; i++)

{

printf("%s\n", argv[i]);

}

}

• 
  

• Ми також можемо вивести кожен символ кожного аргументу:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(int argc, string argv[])

{

for (int i = 0; i < argc; i++)

{

for (int j = 0, n = strlen(argv[i]); j < n; j++)

{

printf("%c\n", argv[i][j]);

}

printf("\n");

}

}

• 
  

  • За допомогою argv[i], ми отримуємо поточний аргумент із масиву аргументів, а з argv[i][j], символ з цього рядка.

Шифрування

• Якби ми хотіли надіслати комусь повідомлення, ми б, можливо, захотіли його зашифрувати, тобто певним чином змінити повідомлення, щоб іншим було важко його прочитати. Оригінальний текст тоді ми назвемо звичайний текст, а текст після шифрування - зашифрований текст.

• Таке повідомлення, як HI! може бути перетворене в ASCII, 72 73 33. Проте, кожен може з легкістю виконати цю дію і в зворотному порядку.

• Розглянемо приклади шифрів з історії, починаючи ще з Першої світової війни, до поеми про поїздку Пола Рівера.

• Загалом шифрування потребує не тільки самого тексту на вхід, а й додаткової інформації. Потрібен ключ, іноді це просто секретне число. Відкритий текст може бути зашифрований та розшифрований за допомогою ключа за певним алгоритмом.

• Наприклад, якщо ми хочемо надіслати текст I L O V E Y O U, ми спочатку можемо його перетворити на ASCII: 73 76 79 86 69 89 79 85. Тоді, ми можемо зашифрувати його ключем 1 простим алгоритмом, де ми лише додаємо ключ до значення кожного елемента: 74 77 80 87 70 90 80 86. Після цього, якщо хтось перетворить ASCII назад в текст, то отримає J M P W F Z P V. Для розшифровки потрібно буде здогадатися значення кожної букви, методом спроб та поразок, але напевне знати без ключа неможливо. Цей алгоритм відомий під назвою шифр Цезаря.

Коди виходу

• Виявляється, що ми можемо вказувати на помилки в нашій програмі, повертаючи значення з функції main:

#include <cs50.h>

#include <stdio.h>

int main(int argc, string argv[])

{

if (argc != 2)

{

printf("missing command-line argument\n");

return 1;

}

printf("hello, %s\n", argv[1]);

return 0;

}

• 
  

  • Значення, що повертається main в нашій програмі, називається кодом виходу, і ми можемо це побачити в командному рядку. Якщо ми запустимо нашу програму через ./exit, можемо потім набрати echo $?, яка виведе повернене останньою програмою значення.

  • Коли ми почнемо писати складніші прошрами, то такі коди виходу допоможуть нам вчасно зрозуміти, що пішло не так, навіть якщо вони невидимі або незрозумілі для користувача.

Сьогодні говоритимемо про наступне:

Сьогодні говоритемемо про наступне:

• Коди виходу

• Сортування

Коди виходу

• Виявляється, що ми можемо вказувати на помилки в нашій програмі, повертаючи значення з функції main:

#include <cs50.h>

#include <stdio.h>

int main(int argc, string argv[])

{

if (argc != 2)

{

printf("missing command-line argument\n");

return 1;

}

printf("hello, %s\n", argv[1]);

return 0;

}

• 
  

  • Значення, що повертається main в нашій програмі, називається кодом виходу, і ми можемо це побачити в командному рядку. Якщо ми запустимо нашу програму через ./exit, можемо потім набрати echo $?, яка виведе повернене останньою програмою значення.

  • Коли ми почнемо писати складніші прошрами, то такі коди виходу допоможуть нам вчасно зрозуміти, що пішло не так, навіть якщо вони невидимі або незрозумілі для користувача.

Сортування

• З масивами ми можемо розв’язувати значно цікавіші задачі. Наприклад, ми можемо розглядати масиви як шафки, за дверима кожної з яких знаходиться якесь значення – ціле число чи символ. До того ж, комп’ютер здатний розглядати одну шафку або значення за раз.

• Якби ми мали список чисел та хотіли знайти в ньому певне число, найкраще що можна зробити, це переглянути його значення один за одним або в довільному порядку.

• Проте якби ми знали, що список був відсортований, то спочатку могли б поглянути в його середину і, відповідно, потім рухались би вліво або вправо.

• Разом з добровольцями ми розглянули, як можна відсортувати список.

• Наші добровольці почали у такому довільному порядку:

6 5 1 3 7 8 4 2

• 
  

• Ми поглянули на перші два числа та переставили їх, щоб вони були у правильному порядку:

5 6 1 3 7 8 4 2

• 
  

• • Потім ми розглянули наступну пару чисел, 6 та 1, та переставили їх місцями:

5 1 6 3 7 8 4 2

• 
  

• Ми повторюємо цю дію, поки найбільше число після першого проходу не опиниться з правого боку в кінці рядка:

5 1 6 3 7 4 2 8

• 
  

  • (У лекції, цифра 1 була випадково поставлена занадто далеко!)

• Ми повторюємо і щоразу, коли ми робимо один прохід, наступне найбільше число стає справа в кінці:

1 5 3 6 4 2 7 8

• 
  

• Нарешті наш список повністю відсортований. Спочатку ми порівняли 7 пар чисел, потім – 6 пар.

• Ми повторно перемішали числа:

2 4 8 5 7 1 3 6

• 
  

• І цього разу ми шукали найменше число в списку та переміщували його в лівий бік:

1 4 8 5 7 2 3 6

1 2 8 5 7 4 3 6

1 2 3 5 7 4 8 6

• 
  

  • Щоразу ми обирали найменше число і переставляли його з числом, яке знаходиться зліва у невідсортованій частині списку.

• За допомогою цього алгоритму ми все ще проглядаємо список n - 1 разів, де n кількість людей, та нам потрібно порівняти кожне число, з найменшим.

• Давайте спробуємо розв’язати це формальніше. Перший алгоритм, сортування бульбашкою, складається з порівнювання пар чисел, що знаходяться безпосередньо одна біля одної, поки найбільше число буде знаходитися справа в кінці. Ми можемо це записати в псевдокоді:

повторити поки не залишиться пробілів

для i від 0 до n-2

якщо i-ий та i+1-ий елементи не відсортовані

поміняти їх місцями

• 
  

• А сортування вибором може виглядати ось так:

для i від 0 до n-1

знайти найменший елемент між i-им та n-1-им

поміняти місцями найменший та i-ий елементи

• 
  

• Для першої перестановки нам потрібно зробити n - 1 порівнянь, щоб знайти найменше число. В кожному наступному проході ми зробили меншу кількість порівнянь, оскільки ми вже перемістили деякі цифри ліворуч:

(n – 1) + (n – 2) + ... + 1

n(n – 1)/2

(n^2 – n)/2

n^2 / 2 – n/2

• 
  

  • Кожен наступний рядок стає простіше, і врешті ми отримуємо n^2 / 2 – n/2 як кількість порівнянь, які треба виконати. В комп'ютерних науках ми використовуємо O, нотація велике O для більшого спрощення, щоб сказати, що наш алгоритм має O(n^2) кроків, “порядку n в квадраті”. Це через те, що з ростом n лише n^2 має значення.

  • Наприклад, якщо б n був 1,000,000, ми б отримали:

n^2 / 2 – n/2

1,000,000^2 / 2 – 1,000,000/2

500,000,000,000 – 500,000

499,999,500,000

• • 
    

    • що є того ж порядку, що й n².

• • Виявляється, що є інші поширені порядки величин складності:

  • O(n²)

  • O(n log n)

  • O(n)

  • O(log n)

  • O(1)

• Пошук в телефонній книзі по одній сторінці за раз має тривалість роботи O(n), оскільки для кожної сторінки потрібна одна дія. Використання бінарного пошуку могло б мати тривалість роботи O(log n), оскільки ми б розділяли задачу навпіл щоразу.

• Давайте візьмемо інший масив чисел, але цього разу використаємо пустий масив такого ж розміру, як наш робочий:

4 2 7 5 6 8 3 1

_ _ _ _ _ _ _ _

• 
  

• Оскільки у нас 8 чисел, давайте поглянемо на першу половину, тобто на перші 4. Відсортуємо це рекурсивно, подивимося на ліву половину. Маючи 2 числа, 4 2, дивимося на ліву половину (відсортовану), та праву (відсортовану), та об'єднаємо їх, відсортувавши: 2 4. Ми перенесемо їх у наш другий масив:

_ _ 7 5 6 8 3 1

2 4 _ _ _ _ _ _

• 
  

• Повторимо це для правої частини першої половини:

_ _ | _ _ 6 8 3 1

2 4 | 5 7 _ _ _ _

• 
  

• потім об'єднаємо ці половини, щоб отримати відсортовану ліву частину:

_ _ _ _ 6 8 3 1

_ _ _ _ _ _ _ _

2 4 5 7 _ _ _ _

• 
  

• Повторимо те саме для правої частини:

_ _ _ _ | _ _ _ _

_ _ _ _ | _ _ _ _

2 4 5 7 | 1 3 6 8

• 
  

• Тепер можемо об'єднати обидві половини:

_ _ _ _ _ _ _ _

_ _ _ _ _ _ _ _

_ _ _ _ _ _ _ _

1 2 3 4 5 6 7 8

• 
  

• Кожне число було переставлене тричі, через те що ми поділили 8 на 2 три рази, або log n раз. Тому цей алгоритм займає O(n log n) часу щоб відсортувати список.

• Розгляньте приклад Sorting Algorithms Animations та відео What different sorting algorithms sound like.

Сьогодні говоритемемо про підвищення якості зображення.

• Ми детально розглянули процес компіляції, що складається з чотирьох кроків:

  • Спершу наш вихідний код попередньо оброблюється – відбувається препроцесінг, таким чином будь-які заголовкові файли на кшталт stdio.h які ми включаємо до коду, насправді включаються.

  • На наступному етапі наш код компілюється в код асемблера, тобто такі команди, які наш процесор може зрозуміти.

  • Далі цей код асемблера збирається у двійковий файл, що відповідає вище зазначеним командам асемблера.

  • o На кінцевому етапі ті скомпільовані файли бібліотеки, які ми хочемо включити, наприклад cs50.c або printf.c, лінкуються, або зв'язуються з нашою програмою.

• Ми також розглянули кілька корисних інструментів:

  • help50, допомагає зрозуміти повідомлення про помилки

  • printf, допомагає зрозуміти програму під час її виконання

  • style50, перевіряє стиль написання нашого коду, щоб він легше читався та був краще узгодженим

Опис завдання

Перше завдання цього тижня ми виконуємо у CS50 Lab. Нагадуємо, що для використання цього середовища вам знадобиться обліковий запис у GitHub. Для виконання інших завдань тижня вам знадобиться CS50 IDE.

Розв’яжіть наведені задачі:

1. Whodunit (на оцінку)

2. Використовуючи CS50 IDE, виконайте одне з наступних завдань (на оцінку):

   • Resize (простіший варіант)

   • Resize (складніший варіант)

3. Recover (на оцінку)

Перекладені пояснення до завдань, відео з українськими субтитрами та можливість надіслати завдання нам на перевірку ви знайдете у наступних вкладинках цього розділу.

• CS50 IDE схожий на CS50 Sandbox, проте має більше можливостей. CS50 IDE – це онлайн середовище розробки з редактором коду та вікном термінала, а також інструментами для дебаггінга та колаборації:
  

• Після того, як ми авторизуємося у середовищі, з’являється робочий простір, що схожий на CS50 Sandbox, проте тепер він зберігається в нашому обліковому записі.

• Ми можемо створити новий файл, виконавши такі команди File > New File (або натиснути на зелений плюс), потім виконуємо такі команди File > Save для того, щоб зберегти цей файл як hello.c у теці ~/workspace/. А тепер можемо написати просту програму:

#include <stdio.h>

int main(void)

{

printf("hello, world\n");

}

• 
  

  • Ми повинні вручну зберегти це, виконавши такі команди File > Save або за допомогою гарячих клавіш.

• Тепер у вікні термінала, що розташоване нижче, ми вводимо make hello і ./hello, щоб побачити, як працює наша програма.

• Значок теки, розташований у верхньому лівому куті робочої області, показує усі файли, що знаходяться у каталозі (теці) з іменем ~/workspace/, ми можемо створювати теки і файли у цій теці. Значок ~ позначає наш домашній каталог у цьому середовищі, тобто всі файли що, пов’язані із нашим обліковим записом; а workspace - це тека всередині ~, яку ми можемо використовувати. (У каталозі ~ також знаходяться інші конфігураційні файли нашого облікового запису, проте нам не варто звертати на них увагу.)

• У терміналі ми бачимо ~/workspace/ $ . Як і у попередніх випадках, частина запиту командного рядка $ дозволяє вводити після неї будь-яку команду, проте перша частина вказує, в якому каталозі знаходиться наш термінал. Наприклад, якщо ми надрукуємо ls, то побачимо текстову версію каталогу workspace. А команда ./hello, в свою чергу, відповідає файлу з іменем hello у ., тобто у поточній папці.

• Ми можемо змінити наш каталог за допомогою команди cd, і якщо ми вводимо cd src3 (припускаємо, що в нас уже є тека з назвою src3), то побачимо що запит командного рядка змінився на ~/workspace/src3/ $ .

• Ми можемо видалити файл і теки у графічному дереві файлів натиском правої кнопки миші по ним, як нам може бути вже відомо. Проте ми можемо зробити те ж саме у командному рядку командою rm hello, яка видалить файли. Команда видасть запит підтвердження: ми можемо надрукувати yes чи y (або ж n, якщо ми передумали).

• Ми можемо створювати каталоги за допомогою команди mkdir test, або ж видаляти їх командою rmdir.

Інструменти

• У CS50 IDE ми додали ще один новий інструмент, check50. Як і у випадку зі style50, ми використовуємо цей інструмент для автоматичної перевірки коректності вашої програми шляхом передачі в програму вхідних даних і аналізу вихідних даних.

• Після того, як ви виконали задачі з домашніх завдань та власноруч перевірили з кількома варіантами вхідних даних, ми можемо ввести check50 cs50/2018/fall/hello. cs50/2018/fall/hello – індикатор тієї програмної специфікації, яка повинна бути перевірена check50. Щойно ми виконаємо цю команду, то побачимо, що check50 завантажує наш код і перевіряє його.

• Тепер ми також зможемо застосовувати вбудований у CS50 IDE інструмент під назвою debugger.

• Після компіляції коду ми можемо запустити команду debug50 ./hello, яка спочатку скаже нам встановити точку переривання. Точка переривання позначає той рядок коду, на якому debugger повинен призупинити нашу програму до того, як ми вирішимо її продовжувати. Наприклад, ми можемо натиснути зліва від рядка нашого коду, і там з’явиться червоне коло:
  

• Після цього, якщо ми знову запустимо debug50 ./hello то побачимо, що справа відчиниться панель debugger:
  

• Ми бачимо, що змінна name, яку ми створили, знаходиться у секції Local Variables, що її значення 0x0 (тобто null), і тип string, як ми й очікували.

• Наша точка переривання призупинила програму перед 6 рядком, для продовження виконання на панелі debugger присутні кілька засобів управління. Блакитний трикутник продовжить роботу нашої програми до наступної точки переривання. Вигнута стрілка справа від трикутника перестрибне через рядок: виконає його і зупинить програму одразу ж після цього. Спрямована вниз стрілка «зайде» в рядок, якщо він містить викликану функцію. А стрілка, спрямована вгору і направо «вийде» з функції, якщо ми знаходимося в якійсь з них.

• Отже, ми використовуємо вигнуту стрілку, щоб запустити наступний рядок і побачити, що після цього зміниться. Після того, як ми вводимо своє ім’я, то бачимо, що змінна name також оновлюється у debugger.

• Ми можемо зберегти собі багато часу у майбутньому, якщо виділимо трохи цього ресурсу зараз для вивчення роботи debugger!

Сьогодні говоритимо про наступне:

• Інструменти

• Рядки

• Пам’ять

• Розподіл пам’яті

• Структури

• Підвищення якості зображення?

Інструменти

• У CS50 IDE ми додали ще один новий інструмент, check50. Як і у випадку зі style50, ми використовуємо цей інструмент для автоматичної перевірки коректності вашої програми шляхом передачі в програму вхідних даних і аналізу вихідних даних.

• Після того, як ви виконали задачі з домашніх завдань та власноруч перевірили з кількома варіантами вхідних даних, ми можемо ввести check50 cs50/2018/fall/hello. cs50/2018/fall/hello – індикатор тієї програмної специфікації, яка повинна бути перевірена check50. Щойно ми виконаємо цю команду, то побачимо, що check50 завантажує наш код і перевіряє його.

• Тепер ми також зможемо застосовувати вбудований у CS50 IDE інструмент під назвою debugger.

• Після компіляції коду ми можемо запустити команду debug50 ./hello, яка спочатку скаже нам встановити точку переривання. Точка переривання позначає той рядок коду, на якому debugger повинен призупинити нашу програму до того, як ми вирішимо її продовжувати. Наприклад, ми можемо натиснути зліва від рядка нашого коду, і там з’явиться червоне коло:
  

• Після цього, якщо ми знову запустимо debug50 ./hello то побачимо, що справа відчиниться панель debugger:
  

• Ми бачимо, що змінна name, яку ми створили, знаходиться у секції Local Variables, що її значення 0x0 (тобто null), і тип string, як ми й очікували.

• Наша точка переривання призупинила програму перед 6 рядком, для продовження виконання на панелі debugger присутні кілька засобів управління. Блакитний трикутник продовжить роботу нашої програми до наступної точки переривання. Вигнута стрілка справа від трикутника перестрибне через рядок: виконає його і зупинить програму одразу ж після цього. Спрямована вниз стрілка «зайде» в рядок, якщо він містить викликану функцію. А стрілка, спрямована вгору і направо «вийде» з функції, якщо ми знаходимося в якійсь з них.

• Отже, ми використовуємо вигнуту стрілку, щоб запустити наступний рядок і побачити, що після цього зміниться. Після того, як ми вводимо своє ім’я, то бачимо, що змінна name також оновлюється у debugger.

• Ми можемо зберегти собі багато часу у майбутньому, якщо виділимо трохи цього ресурсу зараз для вивчення роботи debugger!

Рядки

• До цього ми використовували так корисні функції з бібліотеки CS50, як get_int чи get_string, щоб отримати вхідні дані певного типу від користувача. Ці функції загалом непросто написати, тому що ми хочемо запитувати користувачів знову і знову, якщо їхні вхідні дані не є допустимими.

• Сьогодні ми розглянемо тип string. Як ми вже дізналися, рядок – це просто масив символів, розташованих послідовно. Але давайте дізнаємося, що ж таке насправді змінна string.

• Відкриємо compare0.c:

#include <cs50.h>

#include <stdio.h>

int main(void)

{

// Get two integers

int i = get_int("i: ");

int j = get_int("j: ");

// Compare integers

if (i == j)

{

printf("same\n");

}

else

{

printf("different\n");

}

}

• 
  

  • Як і можна було очікувати, якщо ми введемо однакові значення для i та j, то побачимо, що вони однакові.

• У compare1.c, спробуємо виконати те ж саме, але вже з рядками:

#include <cs50.h>

#include <stdio.h>

int main(void)

{

// Get two strings

string s = get_string("s: ");

string t = get_string("t: ");

if (s == t)

{

printf("same\n");

}

else

{

printf("different\n");

}

}

• 
  

  • Хмммм, незалежно від того, що ми вводимо у наших рядках, програма вважає, що вони відрізняються.

• Виявляється, що насправді string не є типом даних у С. Слово «рядок» використовується у комп’ютерних науках, проте зберігати рядки у С неможливо жодним чином. Натомість, ми визначаємо цей тип у бібліотеці CS50.

• Пам’ятайте, що рядки – просто масив символів, тому коли ми виконуємо програму compare1, то вхідними даними користувача будуть два рядки, які у пам’яті можуть зберігатися ось так:
  

  • Кожний символ – один байт; і десь у нашій пам’яті зберігаються байти, які містять значення для кожного рядка.

• Виявляється, кожний байт у пам’яті має числове розташування або ж адресу. Наприклад, символ B може мати адресу 100, а V може опинитися у 900 (це залежить від того, які частини пам’яті були доступні, тобто вільні):
  

  • Зауважте, що оскільки кожен рядок – масив символів, то усі символи в межах певного рядка мають послідовні адреси, оскільки вони зберігаються поряд у пам’яті. Проте власне рядки можуть мати адреси, які дуже сильно відрізняються.

• Отже, get_string насправді повертає лише адресу першого символу в рядку. (Ми можемо сказати, де він закінчується, поглянувши на символ null, або \0.) Тепер ми можемо зробити висновок, що порівняння двох «рядків» насправді порівнює дві адреси (які завжди будуть відрізнятися, оскільки get_string зберігає вхідні дані щоразу у новому місці), навіть якщо символи, що зберігаються за цими адресами, однакові.

• Інші типи даних у С, як int чи float, зазвичай передаються і зберігаються у вигляді їхніх значень, оскільки вони завжди представлені фіксованим числом байтів. А рядки, на противагу, передаються у вигляді власних адрес, оскільки вони можуть бути дуже довгими.

• Якщо ми хочемо порівняти два рядки, то, здається, нам потрібно порівнювати кожний символ окремо:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

bool compare_strings(string a, string b);

int main(void)

{

// Get two strings

string s = get_string("s: ");

string t = get_string("t: ");

// Compare strings for equality

if (compare_strings(s, t))

{

printf("same\n");

}

else

{

printf("different\n");

}

}

bool compare_strings(string a, string b)

{

// Compare strings' lengths

if (strlen(a) != strlen(b))

{

return false;

}

// Compare strings character by character

for (int i = 0, n = strlen(a); i < n; i++)

{

// Different

if (a[i] != b[i])

{

return false;

}

}

// Same

return true;

}

• 
  

  • Ми пишемо функцію під назвою compare_strings, яка приймає два рядки як аргументи та повертає bool, тобто булевий вираз.

  • Спершу ми порівнюємо довжину двох рядків і робимо return false якщо вони не однакові. Після цього ми можемо перевірити кожен символ і робимо return false якщо ми дійдемо до пари символів, які не збігаються.

  • Ми також повинні не забути додати вгору прототип bool compare_strings(string a, string b); .

• string – синонім до char *. * у С (що також залежно від контексту позначає множення) означає, що типом даних є адреса. Таким чином char * – адреса для char. Більш формально такий тип змінної називається вказівник.

• Тепер ми можемо замінити char * там, де ми використовували string:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

bool compare_strings(char *a, char *b);

int main(void)

{

// Get two strings

char *s = get_string("s: ");

char *t = get_string("t: ");

// Compare strings for equality

if (compare_strings(s, t))

{

printf("same\n");

}

else

{

printf("different\n");

}

}

bool compare_strings(char *a, char *b)

{

// Compare strings' lengths

if (strlen(a) != strlen(b))

{

return false;

}

// Compare strings character by character

for (int i = 0, n = strlen(a); i < n; i++)

{

// Different

if (a[i] != b[i])

{

return false;

}

}

// Same

return true;

}

• 
  

• Виявляється, що у string.h включена бібліотечна функція під назвою strcmp, написана іншими багато років тому, що порівнює два рядки:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

// Get two strings

char *s = get_string("s: ");

char *t = get_string("t: ");

// Compare strings for equality

if (strcmp(s, t) == 0)

{

printf("same\n");

}

else

{

printf("different\n");

}

}

• 
  

  • Значення, що повертає strcmp, на основі документації на кшталт CS50 Reference, буде 0 якщо рядки рівні, або інші значення, якщо вони відрізняються.

• Ми також повинні проводити перевірку на помилки, на які ми раніше не звертали увагу.

• get_string повинна повертати адресу до першого байту рядка, але іноді вона може повертати NULL, недійсну адресу, яка позначає, що щось пішло не так. (І ця адреса має значення 0, спеціальна адреса, що не використовується для зберігання жодних даних.)

• Для перевірки наявності помилок ми можемо зробити таке:

#include <cs50.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

// Get a string

char *s = get_string("s: ");

if (s == NULL)

{

return 1;

}

// Get another string

char *t = get_string("t: ");

if (t == NULL)

{

return 1;

}

// Compare strings for equality

if (strcmp(s, t) == 0)

{

printf("same\n");

}

else

{

printf("different\n");

}

return 0;

}

• 
  

  • Якщо з якоїсь причини get_string не повертає дійсну адресу, ми власноруч повернемо код виходу 1, щоб указати, що відбулася помилка. Якщо ми продовжимо, то можливо відбудеться помилка сегментації, ми намагалися отримати доступ до пам’яті, до якої доступу не маємо (наприклад, до адреси NULL).

  • Ми можемо спростити умову до просто if (!s), оскільки «не s» буде «не 0», коли s – це NULL, що врешті вираховується у true.

• Тепер давайте спробуємо скопіювати рядок:

#include <cs50.h>

#include <ctype.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

// Get a string

string s = get_string("s: ");

// Copy string's address

string t = s;

// Capitalize first letter in string

if (strlen(t) > 0)

{

t[0] = toupper(t[0]);

}

// Print string twice

printf("s: %s\n", s);

printf("t: %s\n", t);

}

• 
  

  • Ми беремо рядок s, копіюємо значення s у t. Після цього ми замінюємо великою першу літеру у рядку t.

  • Проте коли ми запускаємо нашу програму, то бачимо, що і s, і t тепер починаються з великих літер.

  • Оскільки ми надали однакового значення s і t, то вони стали покажчиками одного й того ж символу, тому ми замінили великими літерами один і той самий символ:
    

• Для того, щоб насправді скопіювати рядок, попрацювати доведеться більше:

#include <cs50.h>

#include <ctype.h>

#include <stdio.h>

#include <string.h>

int main(void)

{

// Get a string

char *s = get_string("s: ");

if (!s)

{

return 1;

}

// Allocate memory for another string

char *t = malloc((strlen(s) + 1) * sizeof(char));

if (!t)

{

return 1;

}

// Copy string into memory

for (int i = 0, n = strlen(s); i <= n; i++)

{

t[i] = s[i];

}

// Capitalize first letter in copy

if (strlen(t) > 0)

{

t[0] = toupper(t[0]);

}

// Print strings

printf("s: %s\n", s);

printf("t: %s\n", t);

// Free memory

free(t);

return 0;

}

• 
  

  • Ми створюємо нову змінну t типу char * за допомогою char *t. Тепер ми хочемо, щоб вона вказувала на новий блок пам’яті, що є достатньо великим для збереження копії рядка. За допомогою malloc, ми можемо виділити певну кількість байтів у пам’яті (яка ще не використовується для збереження інших даних), і ми передаємо ту кількість байтів, яку хочемо. Ми вже знаємо довжину s, тому ми додаємо 1 до термінального нуль-символу і множимо отримане на sizeof(char) (в результаті чого ми отримуємо кількість байтів для кожного окремого символу) для того, щоб запевнитися, що ми маємо достатньо пам’яті. Отже, наш остаточний рядок коду виглядає наступним чином char *t = malloc((strlen(s) + 1) * sizeof(char));.

  • Тепер ми копіюємо кожний символ окремо, тому тепер ми можемо замінити великою літерою лише першу літеру рядка t. Ми використовуємо i <= n, оскільки хочемо піднятися до однієї останньої n, щоб запевнитися, що ми копіюємо термінальний символ у рядку. Врешті-решт, після завершення попередніх дій, ми викликаємо free(t), яка сигналізує нашому комп’ютеру, що ці байти більш не використовуються програмою, тому ці байти у пам’яті можуть бути знову використані.

  • Ми також можемо використовувати бібліотечну функцію strcpy про яку можна дізнатися з документації, для копіювання рядка.

• Витік пам’яті відбувається, коли ми виділяємо все більше і більше пам’яті для використання, проте не звільняємо її. В результаті наш комп’ютер починає працювати все повільніше і повільніше (оскільки він повинен компенсувати скорочення вільної пам’яті).

• Давайте поглянемо, чому можуть виникати труднощі з отриманням вхідних даних від користувача:

#include <stdio.h>

int main(void)

{

int x;

printf("x: ");

scanf("%i", &x);

printf("x: %i\n", x);

}

• 
  

  • scanf – функція, що отримує вхідні дані від користувача відповідно до певного формату. Ми передаємо %i на позначення того, що ми очікуємо на ціле число, &x ми використовуємо для отримання адреси x, тобто scanf може розмістити значення у правильному місці пам’яті.

• Давайте тепер спробуємо отримати рядок:

#include <stdio.h>

int main(void)

{

char *s;

printf("s: ");

scanf("%s", s);

printf("s: %s\n", s);

}

• 
  

  • Оскільки ми не виділили пам’яті для байтів рядка, scanf не має місця для збереження вхідних даних.

• Ми можемо виділити певну кількість байтів у вигляді масиву символів:

#include <stdio.h>

int main(void)

{

char s[5];

printf("s: ");

scanf("%s", s);

printf("s: %s\n", s);

}

• 
  

  • Тепер у нас є 5 байтів, в яких ми можемо зберігати вхідні дані.

  • Зауважте, що ми можемо передавати s як адресу, оскільки масиви можуть розглядатися як вказівники на перший елемент масиву.

  • Але якщо ми хочемо ввести значно довший рядок, врешті-решт відбудеться «помилка сегментації», за якої ми намагаємося отримати доступ до пам’яті, до якої доступу не маємо або не повинні мати. Виявляється, що scanf не знає скільки пам’яті виділено, отже, вона продовжує запис до пам’яті, починаючи з адреси s, такого об’єму вхідних даних, який був введений, навіть якщо було виділено менший об’єм пам’яті. get_string вирішує для нас цю проблему і виділяє достатній об’єм пам’яті. (І якщо вас це надзвичайно зацікавило, вихідний код для бібліотеки CS50 є у відкритому доступі!)