# Comment annotations

You can use comments inside the code to make the focus relative.

```js
function lorem(ipsum, dolor = 1) {
  const sit = ipsum == null && 0
  dolor = sit - amet(dolor)
  // focus
  return sit ? consectetur(ipsum) : []
}

// focus(1:4)
function adipiscing(...elit) {
  console.log(elit)
  return elit.map((ipsum) => ipsum.sit)
}

// focus[13:17]
console.log("hey")
```

Same with other annotations like `mark`.

```js
function foo() {
  // mark
  console.log("lorem ipsum")
  return 8
}
```

You can pass a string parameter to comment annotations

```js index.js
function lorem(ipsum, dolor = 1) {
  // mark(1:3) line-through
  const sit = ipsum == null && 0
  dolor = sit - amet(dolor)
  return sit ? consectetur(ipsum) : []
}

function adipiscing(...elit) {
  console.log(elit)
  // withClass[19:38] line-through
  return elit.map((ipsum) => ipsum.sit)
}
```

## Links and labels

And now we introduce two more annotations: `link` and `label`

```js focus=4,8
function lorem(ipsum, dolor = 1) {
  const sit = ipsum == null && 0
  dolor = sit - amet(dolor)
  // link[16:26] https://github.com/code-hike/codehike
  return sit ? consectetur(ipsum) : []
}

function adipiscing(...elit) {
  // label something something
  console.log("hover me")
  return elit.map((ipsum) => ipsum.sit)
}
```
This demo is sponsored by
Stefan Judis
Frazer
Cody
Rich Haines
Glenn Gillen

Comment annotations

You can use comments inside the code to make the focus relative.


function lorem(ipsum, dolor = 1) {
const sit = ipsum == null && 0
dolor = sit - amet(dolor)
return sit ? consectetur(ipsum) : []
}
function adipiscing(...elit) {
console.log(elit)
return elit.map((ipsum) => ipsum.sit)
}
console.log("hey")

Same with other annotations like mark.


function foo() {
console.log("lorem ipsum")
return 8
}

You can pass a string parameter to comment annotations

index.js

function lorem(ipsum, dolor = 1) {
const sit = ipsum == null && 0
dolor = sit - amet(dolor)
return sit ? consectetur(ipsum) : []
}
function adipiscing(...elit) {
console.log(elit)
return elit.map((ipsum) => ipsum.sit)
}

Links and labels

And now we introduce two more annotations: link and label


function lorem(ipsum, dolor = 1) {
const sit = ipsum == null && 0
dolor = sit - amet(dolor)
return sit ? consectetur(ipsum) : []
}
function adipiscing(...elit) {
console.log("hover me")
return elit.map((ipsum) => ipsum.sit)
}