Explore
For Enterprise
Join for Free
Log In

Обзор
Поиск
Для организаций
Войти
Присоединиться бесплатно

Thinking Critically about Your Program

Loading...

Programming Foundations with JavaScript, HTML and CSS

Университет Дьюка

4.6 (оценок: 5,786) | Зарегистрировано учащихся: 190K

Курс 1 из 5 — Java Programming and Software Engineering Fundamentals Специализация

Learn foundational programming concepts (e.g., functions, for loops, conditional statements) and how to solve problems like a programmer. In addition, learn basic web development as you build web pages using HTML, CSS, JavaScript. By the end of the course, will create a web page where others can upload their images and apply image filters that you create. After completing this course, you will be able to: 1. Think critically about how to solve a problem using programming; 2. Write JavaScript programs using functions, for loops, and conditional statements; 3. Use HTML to construct a web page with paragraphs, divs, images, links, and lists; 4. Add styles to a web page with CSS IDs and classes; and 5. Make a web page interactive with JavaScript commands like alert, onClick, onChange, adding input features like an image canvas, button, and slider.

Просмотреть программу курса

Получаемые навыки

Html, JavaScript, Cascading Style Sheets (CCS), Html5

Рецензии

4.6 (оценок: 5,786)

5 stars
4,143 ratings
4 stars
1,200 ratings
3 stars
278 ratings
2 stars
75 ratings
1 star
90 ratings

WN

Mar 17, 2018

My first Coursera course I've ever done and I was very impressed with the platform on which it was presented. My experience was a positive one and I will definitely continue to pursue other courses.

AN

Nov 02, 2016

I've been learning Javascript with lots of different online courses over the last 2 years and this is the first one that presented the information in such a way that I could understand it. Thanks!

Из урока

Algorithms and Programming Concepts

Translating to Code10:12

Thinking Critically about Your Program4:08

Finding Bugs in Code9:34

Преподаватели

Susan H. Rodger
Professor of the Practice
Robert Duvall
Lecturer
Owen Astrachan
Professor of the Practice
Andrew D. Hilton
Associate Professor of the Practice

Текст видео

Now you're going to think about what it would take to turn the Blue Devil into a Green Devil. For example, to celebrate an environmental initiative on campus. What code would go into the for loop to make the Devil green? Specifically, we want to end up with a background still being white and the foreground having a 0 for red, a 255 for green, and a 100 for blue. Take a few moments to think about how to do this. A first thought might be code that looks like this. Here we set the red, green, and blue components of each pixel directly to the values we want. However, as the loop goes through each and every pixel, it turned them all green. If instead you only set the green of each pixel to 255 and the blue to 100, you get an image that looks like this. This code made the foreground the right color, but now we have a yellow background. Take a few minutes to think about why this happened. Did you realize that the background is yellow because it has a red value of 255, making the overall color value of the background red 255, green 255, blue 100? Because we did not change its red value, it kept the original one. And since the background was originally white, that value is 255. To make this work, we're going to need code that makes a decision, using a conditional statement like we've seen before. So that it can change the foreground, but not the background. Here is one possible idea for an if statement. If the blue is 255, this seems like a logical choice because the foreground is blue, and we want to change only the blue pixels to green pixels. Take a moment to think about what this code does. Do you think it will accomplish what we want it to? This code actually turns the background green but left the foreground blue. That behavior is the opposite of what we wanted. Doesn't that seem surprising? It is important to remember that the computer only does what you tell it to. Anytime your program does seem to behave oddly there is a good reason behind it. We're going to take a closer look to understand what happened. The white pixels in the image have 255 for red, 255 for green and 255 for blue. Because each white pixel, has blue equal to 255. Those pixels are set to green by this piece of code. However, the blue pixels in this image are not pure blue. They have 45 for red, 39 for green, and 225, not 255, for blue. Accordingly, the condition is not true for the blue pixels, and they are left unchanged. To fix this program, you would need a condition that distinguishes the foreground pixels, 45 red, 39 green, 225 blue, from the background pixels, 255 red, 255 green, 255 blue. There are many possible conditions we could write. You could check if red is less than 200. If green is 150, if blue is equal to 255. Or many other possibilities. Here, we made one such change. We changed the code to check if red is less than 200. This code produced a Green, Blue Devil image that we wanted. Whenever your code does not do what you want, thinking about why it is behaving a particular way is an important part of fixing it. We'll talk more about debugging codes soon and teach you how to apply a version of the scientific method to fix problematic code. We'll also teach you how to invest some planning time at the start of the programming task so you can write better code the first time and spend less time fixing it at the end.

Ознакомьтесь с нашим каталогом

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

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

© Coursera Inc., 2019 Все права защищены.

Загрузить в Google Play

Coursera
О проекте
Руководство
Карьера
Каталог
Сертификаты
Сертификаты MasterTrack™
Степени
Для организаций
Для правительственных организаций
Для стационара

Сообщество
Learners
Partners
Developers
Beta Testers
Translators

На связи
Блог
Facebook
LinkedIn
Twitter
Instagram
YouTube
Технический блог

Еще
Условия
Конфиденциальность
Помощь
Доступность
Пресса
Контакты
Справочник
Филиалы