Javascript vs ECMAScript

Javascript = ECMAScript ?

최초의 Javascript는 넷스케이프의 웹 브라우저에서 정적 HTML페이지를 동적으로 표현하기 위하여 탄생하였다.

그리고 마이크로소프트에서 이 Javascript의 파생 버전인 JScript를 만들었다.

당시 웹브라우저 시장은 넷스케이프가 압도적이었으나 MS사가 Windows에 자신들의 웹브라우저를 끼워팔면서 점유율은 역전되었다.

이 때 많은 웹브라우저 제조사들은 자사의 브라우저에서만 동작하는 기능을 경쟁적으로 만들면서 Javascript의 파편화가 극심해졌다.

이런 각 벤더 사마다 다른 Javascript를 표준화하기 위하여 넷스케이프가 ECMA 인터내셔널에 표준화를 요청하였고 그렇게 탄생한 것이 ECMAScript이다.

그러나 당시 막강한 점유율로 시장에서 압도적 우위에 있던 MS사의 미온한 참여로 당시 ECMAScript 버전은 많은 문제가 있었다.

그 후 Google의 Chrome이 IE의 점유율을 끌어내리면서 ESMAScript5(ES5)가 제정되면서 표준화 문제가 어느정도 해결되기 시작하였다.

이렇게 여러 밴드사가 공통으로 지원하는 Javascript의 Core를 ES = ESMAScript라고 한다.

그 외에 각 벤더의 브라우저가 별도로 지원하는 Web API는 어전히 존재하고 있다.
즉,

자바스크립트 = ES + Web API

와 같다.

call_by_Value, call_by_Reference

Call by Value 와 Call by Reference

Call by Value

1
2
3
4
5
6
7
8
9
10
void change_value(int x, int val) {
x = val;
printf("x : %d in change_value \n", x);
}

int main(void) {
int x = 10;
change_value(x, 20);
printf("x : %d in main \n", x);
}

위 소스는 main에서 선언된 변수 x에 값 10을 주고 변수 x와 정수 val 매개변수로 하여 change_value를 호출한 후 change_value에서 x의 값을 val로 변경하는 소스이다.

image

실행을 하면 change_value에서 x의 값은 20으로 변경되었지만 main에서는 여전히 10이다.

이는 main에서 넘긴 x는 x의 값 10을 의미하기 때문에 이것을 바꾸어도 main의 x는 영향을 받지 않는다.

그래서 Call by Value이다.


codility Lesson2 CyclicRotation

CyclicRotation

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
An array A consisting of N integers is given. Rotation of the array means that each element is shifted right by one index, and the last element of the array is moved to the first place. For example, the rotation of array A = [3, 8, 9, 7, 6] is [6, 3, 8, 9, 7] (elements are shifted right by one index and 6 is moved to the first place).

The goal is to rotate array A K times; that is, each element of A will be shifted to the right K times.

Write a function:

def solution(A, K)

that, given an array A consisting of N integers and an integer K, returns the array A rotated K times.

For example, given
A = [3, 8, 9, 7, 6]
K = 3

the function should return [9, 7, 6, 3, 8]. Three rotations were made:
[3, 8, 9, 7, 6] -[6, 3, 8, 9, 7]
[6, 3, 8, 9, 7] -[7, 6, 3, 8, 9]
[7, 6, 3, 8, 9] -[9, 7, 6, 3, 8]

For another example, given
A = [0, 0, 0]
K = 1

the function should return [0, 0, 0]

Given
A = [1, 2, 3, 4]
K = 4

the function should return [1, 2, 3, 4]

Assume that:

N and K are integers within the range [0..100];
each element of array A is an integer within the range [−1,000..1,000].

In your solution, focus on correctness. The performance of your solution will not be the focus of the assessment.
Copyright 2009–2019 by Codility Limited. All Rights Reserved. Unauthorized copying, publication or disclosure prohibited.

codility Lesson2 OddOccurrencesInArray

OddOccurrencesInArray

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
A non-empty array A consisting of N integers is given. The array contains an odd number of elements, and each element of the array can be paired with another element that has the same value, except for one element that is left unpaired.

For example, in array A such that:
A[0] = 9 A[1] = 3 A[2] = 9
A[3] = 3 A[4] = 9 A[5] = 7
A[6] = 9

the elements at indexes 0 and 2 have value 9,
the elements at indexes 1 and 3 have value 3,
the elements at indexes 4 and 6 have value 9,
the element at index 5 has value 7 and is unpaired.

Write a function:

function solution(A);

that, given an array A consisting of N integers fulfilling the above conditions, returns the value of the unpaired element.

For example, given array A such that:
A[0] = 9 A[1] = 3 A[2] = 9
A[3] = 3 A[4] = 9 A[5] = 7
A[6] = 9

the function should return 7, as explained in the example above.

Write an efficient algorithm for the following assumptions:

N is an odd integer within the range [1..1,000,000];
each element of array A is an integer within the range [1..1,000,000,000];
all but one of the values in A occur an even number of times.

Copyright 2009–2019 by Codility Limited. All Rights Reserved. Unauthorized copying, publication or disclosure prohibited.

box-sizing

box-sizing과 box model

box의 크기를 어떤 기준으로 계산 할 것인가?

HTML은 Box로 이루어져 있으며 문서의 레이아웃을 계산 할 때 박스 모델에 따라 박스의 사이즈가 달라지게 됨


box의 크기는 어떤 요소들로 이루어 지는가?

box의 크기에 영향을 주는 요소는 box의 width, height, border, padding, margin이 됨


각 요소의 값이 동일 할 때 box의 크기는 달라지는가?

1
2
<div class="div content">content-box</div>
<div class="div border">border-box</div>

codility Lesson1 BinaryGap

BinaryGap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
A binary gap within a positive integer N is any maximal sequence of consecutive zeros that is surrounded by ones at both ends in the binary representation of N.

For example, number 9 has binary representation 1001 and contains a binary gap of length 2. The number 529 has binary representation 1000010001 and contains two binary gaps: one of length 4 and one of length 3. The number 20 has binary representation 10100 and contains one binary gap of length 1. The number 15 has binary representation 1111 and has no binary gaps. The number 32 has binary representation 100000 and has no binary gaps.

Write a function:

function solution(N);

that, given a positive integer N, returns the length of its longest binary gap. The function should return 0 if N doesn't contain a binary gap.

For example, given N = 1041 the function should return 5, because N has binary representation 10000010001 and so its longest binary gap is of length 5. Given N = 32 the function should return 0, because N has binary representation '100000' and thus no binary gaps.

Write an efficient algorithm for the following assumptions:

N is an integer within the range [1..2,147,483,647].

Copyright 2009–2019 by Codility Limited. All Rights Reserved. Unauthorized copying, publication or disclosure prohibited.

2019-04-16 TIL

picture

<picture> 내에 <img>를 사용하는 것은 필수

1
2
3
4
5
<div class="rwd-wrapper">
<picture>
<source srcset="images/image-1x.png 1x, images/image-2x.png 2x"
</picture>
</div>

2019-04-15 TIL

footer

img

image


마크업

내 마크업

1
2
3
4
5
6
7
8
9
10
11
12
13
14
div.footer-bg
footer.footer
a
img

ul.footer-menu
li
div.copyright
p
a
p
div.badge
img.badge-html
img.badge-css

2019-04-12 TIL

인기 사이트

image

마크업

내 마크업

1
2
3
4
5
6
7
section.favorite
h2.favorite-heading
ol.favorite-list
li
a
strong
a.favorite-more

강사님 마크업
1
2
3
4
5
6
7
section.favorite
h2.favorite=heading
ol
li.no1
a
em.up, em.down, em.stop
favorite-more

2019-04-11 TIL

새소식

image

마크업

내 마크업

1
2
3
4
5
6
7
8
9
10
section.news
h2.news-header
a.news-link
article.news-item
h3.news-item-subject
time
p.news-item-brief
span
img
a.news-more

강사님 마크업

1
2
3
4
5
6
7
8
9
10
section.news
h2.news-heading
article.news-item
h3.news-item-subject
time.news-item-date
p.news-item-brief
figure.news-item-thumbnail
img
figcaption
a.news-more

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×