js-turtle֊ը հատուկ միջավայր է JavaScript լեզվով ծրագրավորում սովորելու/ուսուցանելու համար։ Սկզբնական գաղափարը պատկանում է Սեյմուր Պեյպերտին.
Turtle-ի այս JavaScript տարբերակի սկիզբը դրել է bjpop֊ը, հետո hanumanum ֊ը ֆորքել և զարգացրել է այն։

1․ Աշխատել անցանց

1. Ներբեռնի՛ր արխիվը
2. Հանի՛ր արխիվի պարունակությունը
3. Բացի՛ր turtle.js֊ը որևէ տեքստային խմբագրիչում (Visual Studio Code, Notepad++, Geany, Sublime Text ...)
4. Բացի՛ր turtle.html֊ը քո դիտարկիչում (browser)
5. Գրի՛ր կոդը turtle.js֊ում, պահպանի՛ր(save) և վերագործարկի՛ր (reload browser)

2․ Աշխատել առցանց

Նույնպես կարող ես աշխատել codepan֊ում js-turtle֊ը արդեն ինտեգրված է հետևյալ codepan֊ում։

js֊turtle codepan-ում

forward()

Forward բառն անգլերենից թարգմանաբար նշանակում է «առաջ»։ Այս ֆունկցիան կրիային մղում է առաջ՝ տրված քայլերի քանակով։ Այսինքն, եթե փակագծերի մեջ գրաված է 100, ապա կրիան 100 միավոր առաջ կշարժվի։

forward(steps)

int: steps

Օրինակ`

forward(100)

Արդյունք`

left()

Left բառն անգլերենից թարգմանաբար նշանակում է ձախ։ Կրիան «քիթը» պտտում է տրված աստիճանով դեպի ձախ։ Եթե փակագծերի մեջ գրանք 30, ապա կրիան 30 աստիճանով ձախ կթեքվի։

left(degrees)

int: degrees

Օրինակ 1.

left(30)
left(60)
left(90)
                                                

Արդյունք`

Օրինակ 2.

forward(100)
left(30)
forward(100)
left(50)
                                                    

Արդյունք`

Երկրաչափություն

Հիշիր!

left() ֆունկցիայի միջոցով կրիան ոչ թե ստանում է անկյուն, այլ թեքվում է նշված անկյունով։

Կարող ես խաղալ այստեղ։

Արդյունք`

right()

Ամեն ինչն ինչպես left()֊ի ժամանակ, սակայն դեպի աջ :)

Տես` left()

width()

Width բառը թարգմանաբար նշանակում է լայնություն․ width() ֆունկցիան կարգավորում է հաջորդող գծերի լայնությունը։

width(thickness)

int: thickness

Օրինակ`

width(3)
forward(100)
                                                       
width(15)
forward(100)

width(6)
forward(100)

Արդյունք`

color()

Color (գույն):color() ֆունկցիան որոշում է հաջորդող գծերի գույնը:

color(r [, g [, b ]]])

string: a (գույնի անունը)
int: a, b, c (RGB)
string: a (գույնի hex կոդը)
array: [a,b,c]

Օրինակ 1. (գույնի անունով)

color("red")
forward(100)

color("green")
forward(60)

color("dodgerblue")
forward(120)

Տե՛ս հասանելի գույների անունները։

Արդյունք`

Օրինակ 2. (RGB)

color(255,15,20)
forward(100)

color(12,250,65)
forward(60)

color(89,100,36)
forward(120)

Կարող ես վերցնել քեզ հետաքրքրող գույնի կոդն այստեղից։

Արդյունք`

Օրինակ 3. (HEX)

color("#3EEF0F")
forward(100)

color("#ED16A2")
forward(60)

color("#EDCD16")
forward(120)

Կարող ես վերցնել քեզ հետաքրքրող գույնի կոդն այստեղից։

Արդյունք`

Օրինակ 4. (զանգածով RGB)

color([15,20,200])
forward(100)

color([65,250,150])
forward(60)

color([255,100,200])
forward(120)

Կարող ես վերցնել քեզ հետաքրքրող գույնի կոդն այստեղից։

Արդյունք`

goto()

Տեղափոխում է կրիան x,y կորդինատները ունեցող կետ, սակայն տեղափոխման ընթացքում գիծ չի գծում։

goto(x,y)

int: x, int: y

Օրինակ`

color("red")
goto(-213,128)
forward(100)

color("blue")
goto(-7,105)
forward(60)

color("green")
goto(238,-182)
forward(120)

Արդյունք`

penup() & pendown()

"pen up"֊ն անգլերեն՝ բարձրացնել մատիտը, "pen down"֊ը ՝ իջեցնել։ Այս ֆունկցիաները կարգավորում են forward()-ով շարժման ընթացքում գծել֊չգծելու հարցը։

penup()

pendown()

Արգումենտներ չունեն

Օրինակ`

color("red")
forward(100)

penup()
forward(60)

pendown()
color("blue")
forward(100)

Արդյունք`

clear()

Մաքրում է կտավը(canvas). հիմնականում օգտագործվում է անիմացիաներ անելիս։

clear()

Արգումենտներ չունի

clear()

Կրիան ունի նաև հետաքրքիր և օգտակար ֆունկցիաներ այլ։

showGrid()

Ցուցադրում է կորդինատական առանցքները։ Արգումենտով կարգավորվում է ցանցի խտությունը։

showGrid(scale)

int: scale

Օրինակ 1.

showGrid(50)

Արդյունք`

Օրինակ 2.

showGrid(20)

Արդյունք`

randomColor_h()

Ստեղծում է պատահական գույն։

randomColor_h()

Արգումենտներ չունի

Օրինակ`

width(4)

setInterval(function(){
    goto(0,0)
    randomColor_h()
    forward(100)
    left(10)
},300)

Արդյունք`

strangeLine()

strangeLine() նման է forward()֊ին, սակայն գիծը գծում է պատահական կտորներով։

strangeLine([steps])

int: steps

Օրինակ`

color("red")
strangeLine(200)

goto(186,-164)

color("blue")
strangeLine(250)

Արդյունք`

strangeSquare()

strangeSquare() գծում է «քառակուսի»՝ մասնիկներով։

strangeSquare(length[,step])

Արգումենտներ

int: length
int: step

Օրինակ`

goto(-206,169)
color("red")
strangeSquare(200,15)

goto(138,98)
color("blue")
strangeSquare(100,5)

Արդյունք`

strangeCircle()

strangeCircle() գծում է «շրջանագիծ»՝ մասնիկներով։

strangeCircle(radius)

Արգումենտներ

int: radius

Օրինակ`

goto(-15,-26)
color("red")
strangeCircle(200)

goto(37,-63)
color("blue")
strangeCircle(100)

Արդյունք`

strangeGalaxy()

strangeGalaxy() գծում է «գալակտիկա»՝ մասնիկներով։

strangeGalaxy(radius)

Արգումենտներ

int: radius

Օրինակ`

goto(-158,167)
color("red")
strangeGalaxy(180)

goto(149,-165)
color("blue")
strangeGalaxy(100)

Արդյունք`