ГЛАВНАЯ     АРХИВ     НАПИСАТЬ АДМИНУ     ПОДПИСАТЬСЯ НА RSS     ВОЙТИ      

Поиск

Категории

Облако тегов

  << Предыдущий пост       Следующий пост >>  
От: inbruk
22. сентября 2012 23:42

JavaScript

1. Write a javascript function getObject(id) compatible with every browser.

function getObject(the_id)
{
  if (typeof the_id != 'string')
  {
    return the_id;
  }
  if (typeof document.getElementById != 'undefined') {
    return document.getElementById(the_id);
  } else if (typeof document.all != 'undefined') {
    return document.all[the_id];
  } else if (typeof document.layers != 'undefined') {
    return document.layers[the_id];
  } else {
    return null;
  }
}

2. What is a prototype in javascript?

В общих чертах prototype - это свойство позволяющее добавлять уже существующим объектам свойства, также используется для эмуляции наследования классов в JavaScript. Подробный ответ написан здесь . Еще как вариант, можно упомянуть о Prototype.js. Это популярная библиотека добавляющая удобные ООП возможности в программы на JavaScript-е.

3.1. Describe the differences between IE and W3C event models

В браузерах, работающих по рекомендациям W3C, объект события всегда передается в обработчик первым параметром. Например:

	function doSomething(event) {
	    // event - будет содержать объект события
	}

	element.onclick = doSomething;
При вызове обработчика объект события event будет передан ему первым аргументом. Можно назначить и вот так:

        element.onclick = function(event) 
        {
            // event - объект события
        }
Интересный побочный эффект - в возможности использования переменной event при назначении обработчика в HTML:

< input type="button" onclick="alert(event)" />

Это работает благодаря тому, что браузер автоматически создает функцию-обработчик с данным телом, в которой первый аргумент event.

А в Internet Explorer существует глобальный объект window.event, который хранит в себе информацию о последнем событии. А первого аргумента обработчика просто нет. То есть, все должно работать так:

	// обработчик без аргументов
	function doSomething() {
	    // window.event - объект события
	}
	 
	element.onclick = doSomething;
Обратите внимание, что доступ к event при назначении обработчика в HTML (см. пример выше) по-прежнему будет работать. Такой вот надежный и простой кросс-браузерный доступ к объекту события.

Можно кросс-браузерно получить объект события, использовав такой приём:

	function doSomething(event) {
	    event = event || window.event
	 
	    // Теперь event - объект события во всех браузерах.
	}
	 
	element.onclick = doSomething


3.1. Какие способы навешивания обработчиков событий вы знаете ?

События можно добавлять тремя способами:

htmlElement.onclick = function(event) { .... } - так можно добавить только один обработчик

htmlElement.addEventListener( "click", ... ) - так можно навесить несколько обработчиков, сохраняет порядок обработчиков

htmlElement.attachEvent( "on"+имя_события, обработчик) - тоже можно навесить несколько, не сохраняет порядок обработчиков, нет доступа к элементу на котором сработало событие

4. Write JavaScript code that implements the following C++ concepts as close as possible:

4.1. Instance methods

4.2. Class methods

4.3. Inheritance

4.4. Base constructor call

4.5. Method overloads

4.6. Private properties and methods

4.7. Static properties and methods

4.8. Privileged methods

5. You have a ready HTML page on a server. You can only add new files or change <head> section of this page. Show what is needed to be changed in order to display a small image after each hyperlink on the page in question.

Сделать можно приблизительно так:

< script type='text/javascript' src='my.js'/ >

my.js:

	var coll = window.getElementsByTagName(‘A’);
	for( var i=0;i< coll.length; i++)
	{
	    var curr_a = coll[i];
	    var parent  = curr_a.parentNode;
            var new_img =  document.createElement(‘IMG’);
               ...
               ...
            parent.insertBefore(new_img, curr_a);
            parent.removeChild(curr_a) ;
            parent.insertBefore(curr_a, new_img);
        }
     
6. What is the conceptual difference between <div> and <span> ?

<div> - блочный контейнер прямоугольного вида, ограничивает пространство в виде прямоугольника

<span> - inline контейнер ограничивает текст, возможно многострочный, в виде части строки, которая вливается в окружающий текст, возможно разнообразной формы, не обязательно прямойгольной

7. What is cross-domain vulnerability ? How it can be prevented ?

Internet Explorer не адекватно проверяет безопасность содержимого фреймов на которое может быть произведен переход с веб сервера. Хакер может эксплуатировать эту уязвимость для выполнения скрипта в других доменах безопасности. Таким образом, если скрипт выполнится в Local Machine Zone, то нападающий сможет выполнить код с привилегиями пользователя запустившего IE. Решение: сейчас в современных IE эта ошибка в простейшем виде исправлена, как вариант, можно отключить Active scripting и ActiveX, еще можно поставить антивирус, который будет все время мониторить браузер.

8. How to avoid loading the page on link click? Can you come up with more than one way to do it?

Первый способ - заменить href ссылки на такой href=’javascript:void(0);’

Второй способ, повесить на анкор следующий обработчик: onclick="javascript:return false;"

9. Write a function that generates functions.

Для этого удобно использовать конкатенацию строк и eval, например, так:
        var strFunc = 'function generatedFunc() { alert("geterated func invoked");  }'
        function runFunc() {
            //alert(generatedFunc); // здесь будет ошибка, так как функция еще не определена
            eval(strFunc);
            alert(generatedFunc); // тут все сработает
            generatedFunc();      // и тут тоже все сработает
        }
     
10. Assume func1 and func2 are already defined. In a page like this:


<body onload=”func1()”>
… content …
</body>
<script>func2()</script>
Which function will run first? Why?


Сначала сработает func2(). Так как она срабатывает во время загрузки страницы. А func1 после нее. Так как обработчик onload вызывается только по завершении загрузки всей страницы.

11. What is JavaScript closure? Write minimal code to demonstrate its effect.

Замыкание (closure) - это функция внутри другой функции, которая использует переменные и параметры из внешней. JavaScript разрешает создавать функции по ходу выполнения скрипта. И эти функции имеют доступ к переменным внешней функции. В этом примере создается внутренняя функция func, изнутри которой доступны как локальные переменные, так и переменные внешней функции outer:

        function outer() {
	    var outerVar;
	 
	    var func = function() {
	        var innerVar
	        ...
	        x = innerVar + outerVar
	    }
	    return func
	}

     
Когда заканчивает работать функция outer, внутренняя функция func остается жить, ее можно запускать в другом месте кода. Получается, что при запуске func используется переменная уже отработавшей функции outer, т.е самим фактом своего существования, func замыкает на себя переменные внешней функции (а точнее - всех внешних функций). Замыкания могут приводить к утечкам памяти.

12. What !DOCTYPE do you usually use? Why? What effect it has on the browser?

Тег DOCTYPE (что означает «объявление типа документа») сообщает валидатору, какую именно версию (X)HTML вы используете в своей странице. Этот тег должен всегда находиться в первой строке каждой страницы. Тег DOCTYPE — ключевой компонент web-страниц, претендующих на соответствие стандартам: без него ваш код и CSS не пройдут проверку валидатором. Тег DOCTYPE также важен и для правильного отображения и работы страницы в броузерах, соответствующих стандартам. Именно он ответственен за то, чтобы HTML и JavaScript были правильно интерпретированы браузером и корректно работали.

13. In most general case, is JavaScript single-threaded or multi-threaded?

В обычных ситуациях однозадачный, из-за того что у него нет (говорим не про HTML5 JS) менеджера задач. Но, если есть обработчики асинхронных AJAX запросов или обработчики setTimeOut, то скрипты должны писаться с учетом эффектов вытесняющей многозадачности, так как в этом случае исполнение основного потока или других обработчиков может быть прервано. И поток исполнения переключится на асинхронные обработчики. Таким образом надо будет учитывать такие эффекты как захват одних и тех же данных, не оконченные операции и т.п. Если это может приводить к проблемам в интерфейсе, то нужно вводить средства синхронизации. Также иногда для асинхронных ajax запросов делают мини менеджер задач, который превращает многозадачность из вытесняющей в невытесняющую. Что решает часть проблем с блокировкой данных, но не решает проблем связанных с очередностью вызова обработчиков (прихода ответов с сервера).

14. You want to play some music on a web page. List as many solutions as you can how to achieve this.

Первый способ - использовать плагины, через теги <object> и <embed>, как при переносе клипа с youtube.com.

Второй способ - использовать iframe, в котором будет страница с плеером с др. сайта, как при переносе клипа с youtube.com (еще один способ).

Третий способ - использовать теги <object> и <embed> для не HTML контента на сервере, работает только с HTML5, например, <embed height="100" width="100" src="horse.mp3">.

Четвертый способ - использовать HTML5 тег <audio>

Пятый способ - использовать гиперссылку <a href="horse.mp3">Play the sound</a>, в большинстве браузеров работает,
если не работает, можно подключить бесплатный Yahoo проигрыватель <script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>

Шестой способ - использовать тег <bgsound> для фоновых звуков.

Седьмой способ - использовать тег <img> <img dynsrc="horse.wav" />

15. How would you convert existing HTML files to XHTML?

16. Are there any problems with PNG files in Internet Explorer 6? If yes, how to solve them? What about IE7?

Были проблемы с прозрачностью. Решения: заменить PNG на GIF, или перейти на более новую версию браузера, или подключить на страницу кусок JavaScript, который решает проблему (не всегда). 17. What do you know about memory leaks in JavaScript? Write sample code to demonstrate the problem and some code to demonstrate a solution.

Замыкания могут приводить к утечкам памяти. Циклические ссылки в сборщике мусора (особенно старых версий IE) могут приводить к утечкам памяти. Пример кода дающего утечки памяти:

     	    document.write("Circular references between JavaScript and DOM!");
     	    var obj;
     	    window.onload = function () {
     	        obj = document.getElementById("DivElement");
     	        document.getElementById("DivElement").expandoProperty = obj;
     	        obj.bigString = new Array(1000).join(new Array(2000).join("XXXXX"));
     	    };
По мере сил и времени буду добавлять ответы. Ответы не окончательные и обсуждаются. Жду интересного обсуждения в комментариях.

Похожие записи


Вопросы на собеседовании C#, Net, ASP.NET, SQL
Продолжая тему вопросов на собеседовании. Нашел еще одну подборку. Оригинал лежит здесь . Перенес, чтобы не затерялось. Есть вполне вменяемые ответы (хотя, на некоторые вопросы ответил бы по-другому). Ответы находятся после списка вопросов, я их не менял. 23. Что такое шаблон проектирования Model/View/Controller? Как и зачем его применяют? 2...

Способы заработка на сайте
На этом блоге было много постов про производство и раскрутку сайтов. Но пока не было про заработок на них. Пора исправить этот недочет. Здесь будут описаны по возможности не фантастичные, и не супер низко прибыльные способы. Также упор будет сделан именно на организацию процесса, а не технических деталях, которых в обилии в интернете. Несмотря на то, что как пр...

Silverlight, HTML5 и непрозрачная стратегия развития Microsoft
Оригинал статьи взят отсюда: Silverlight, HTML5 и непрозрачная стратегия развития Microsoft Автор: Peter Bright Переводчик: Mairon     По непонятным мне на данный момент причинам, похоже, что многие разработчики, присутствовавшие на недавней конференции PDC-2010 (Крупнейшая конференция Microsoft для разработчиков — Прим. переводчика), были сильн...

Добавить комментарий




biuquote
  • Комментарий
  • Предпросмотр
Loading


  Сохранить комментарий