阅读 232

你真的会用JS写Hello World么?

自古,三百六十行,每一行入行的时候都有个仪式。现如今编程这个行当,也约定俗成出了一个入行仪式,就是选你将要使用的编程语言,写段代码输出hello world!,这片文章讲的就是这么个事——写个函数输出hello world,请真的不要觉得很简单。

先立一个flag

软件开发这个行业里面,有这么一句挺牛逼的话:“人生苦短,我用Python”,虽然Python我会用,也确实发自内心地觉得,在言简意赅这条路上,它配得上这句话。但今天我就想用JavaScriptpython叫叫板,比比更“”。问题只有一个:请使用JavaScript语言编写一个函数,返回hello world!

但是我有些个附加条件,嘿嘿嘿

题目 1. 每行代码不超过3个字符,总行数不超过9行

我先来做个示范,先抛开这条的附加条件,实现起来那就太简单了

function f(){
    return "hello world!"
}
复制代码

OK, 然后在控制台用console.log(f())打印就可以看到hello world!了。

当加上这个附加条件,传统的函数定义方式显然行不通了。

当然现在,ES6已经相当普及,能想到箭头函数应在情理之中。其次就是一行字符串如何写成多行,这也应该是编程基础,不绕弯子了,直接上代码:

f=(
)=>
"h\
el\
lo\
 w\
or\
ld\
!"
复制代码

涉及的JavaScript知识点:箭头函数字符串换行

题目 2. 每行代码不超过2个字符,总行数不超过30行

每行两个字符,你是不是连函数都不会定义了,反正箭头函数是行不通了 总行数不超过30行,有点残忍,算了40行也行吧

如果只出题目和贴答案,对于各位看官来说,这也只能算是奇技淫巧。所以本着阅有所得得出发点,我还是简略剖析下我的思路,希望能给你些启发:

  1. 在每行两个字符的限时下,考虑到字符串换行符\的存在,所要返回的hello world!字符串还是可以输出的,只不过多些几行的事,问题不大。
  2. 基于第一步中的方法,在不考虑总行数限制的情况下,其实什么字符串都是可以分拆成多行写的。但每行两个字符的限制,是把函数创建的生门堵死了。
  3. 想到JavaScript中一起皆对象,不同类型的对象都有些许内置的属性和方法,与此同时,最精妙绝伦的是,函数的调用除了用.符号外,还可以用数组的方式,即可以在数组符号[]中,写方法名的字符串进行方法的调用。可使用的方法,仅供参考:''.trim()''.slice()[].join()
  4. 如此我们便可用些内置的函数,来代替创建新函数。可想而知,在每行两个字符的限制下,无论是箭头函数,还是function()什么的,都显得太过无力了。
  5. 你以为到此为止,问题就解决了么?不,你会立马遇到另一个问题——每行两个字符限制下,调用函数时怎么传参? 我只能说,ES6中有个好东西——带标签的模板字符串

不说啥了,看代码吧

f=
''
[
'\
t\
r\
i\
m'
][
'\
b\
i\
n\
d'
]`
H\
e\
l\
l\
o\
,\
 \
w\
o\
r\
l\
d!
`
复制代码

涉及的JavaScript知识点:字符串换行trim()join()bind()模板字符串

激不激动,刺不刺激。

其实还不够,我是个有时间,就想把事情做到极致的人

握紧方向盘,系好安全带,我们继续

题目 3. 每行代码不超过1个字符,总行数不超过120行

有没有世界观快要崩塌了,是不是开始觉得,自己从来没学过真的JavaScript。 有没有不仅函数不会创建使用了,没有字符串换行符,是不是连字符串都不会写了。

好了,言归正传,

如果你想挑战一下自己,那么就请先不要继续往下阅读,直接在浏览器的Console中尝试一下。

[
,
j
,
,
o
,
,
i
,
,
n
,
,
b
,
,
d
,
,
s
,
,
p
,
,
l
,
,
t
]
=
`
j
o
i
n
b
d
s
p
l
t
`
f
=
[
]
[
j
+
o
+
i
+
n
]
[
b
+
i
+
n
+
d
]
(
`
H
e
l
l
o
,
 
w
o
r
l
d
!
`
[
s
+
p
+
l
+
i
+
t
]
`
`
,
[
]
+
[
]
)
复制代码

在问题2时,已较为详细的分析了思路,问题3问题难度虽然加大,但思路基本不变,这里为了便于理解,仅汇总一下涉及到的知识点:

  1. 模板字符串,可以自由换行,但换行处会有一个换行符\n
  2. 解构赋值,字符串可以看成是单个字符组成的数组,由于数组的定义可以换行,通过将模板字符串解构赋值给数组,便可获得初始化为单个字符的变量。
  3. 一些字符串和数组的内置方法:join()splite()
  4. 改变函数执行上下文的方法:bind(),同时可复习与apply()call()的区别和联系。
  5. 这或许算是一条奇技淫巧:[]+[]表示空字符''

其实我就一个想法,看过之后不要觉得这是篇讲述什么奇技淫巧的文章,倘若能帮你回顾复习了些JavaScript的基础知识,便就善莫大焉了。

关注下面的标签,发现更多相似文章
评论