1

I am a newbie in Javascript. I thought of downloading websites and try to understand the javascript inside it, but to my disappointment, I was unable to understand a single code snippet in random websites in spite of just completing a full course of web development in Javascript. Here is one of the code snippets I tried to understand

!function(e){function a(a){for(var t,i,o=a[0],d=a[1],f=a[2],l=0,b=[];l<o.length;l++)i=o[l],Object.prototype.hasOwnProperty.call(n,i)&&n[i]&&b.push(n[i][0]),n[i]=0;for(t in d)Object.prototype.hasOwnProperty.call(d,t)&&(e[t]=d[t]);for(s&&s(a);b.length;)b.shift()();return c.push.apply(c,f||[]),r()}function r(){for(var e,a=0;a<c.length;a++){for(var r=c[a],t=!0,i=1;i<r.length;i++){var d=r[i];0!==n[d]&&(t=!1)}t&&(c.splice(a--,1),e=o(o.s=r[0]))}return e}var t={},i={194:0},n={194:0},c=[];function o(a){if(t[a])return t[a].exports;var r=t[a]={i:a,l:!1,expo;rts:{}};return e[a].call(r.exports,r,r.exports,o),r.l=!0,r.exports}o.e=function(e){var a=[];i[e]?a.push(i[e]):0!==i[e]&&{1:1,2:1,4:1,5:1,6:1,7:1,8:1,9:1,10:1,11:1,12:1,13:1,14:1,16:1,17:1,18:1,19:1,20:1,21:1,22:1,23:1,24:1,25:1,26:1,27:1,28:1,29:1,30:1,31:1,32:1,33:1,34:1,35:1,36:1,37:1,38:1,39:1,40:1,41:1,42:1,43:1,44:1,45:1,46:1,47:1,48:1,49:1,50:1,51:1,52:1,53:1,54:1,55:1,56:1,57:1,58:1,59:1,61:1,62:1,63:1,64:1,65:1,66:1,67:1,68:1,69:1,70:1,71:1,72:1,74:1,75:1,76:1,77:1,78:1,79:1,80:1,81:1,82:1,83:1,84:1,85:1,86:1,87:1,88:1,89:1,90:1,91:1,92:1,93:1,94:1,95:1,96:1,97:1,98:1,99:1,100:1,101:1,102:1,103:1,104:1,105:1,106:1,107:1,108:1,109:1,110:1,111:1,112:1,113:1,114:1,115:1,116:1,117:1,118:1,119:1,120:1,121:1,122:1,123:1,124:1,125:1,126:1,127:1,129:1,130:1,131:1,132:1,133:1,134:1,135:1,136:1,138:1,139:1,140:1,141:1,142:1,143:1,144:1,145:1,146:1,147:1,148:1,149:1,150:1,151:1,152:1,153:1,154:1,155:1,156:1,157:1,158:1,159:1,160:1,161:1,162:1,163:1,164:1,165:1,166:1,167:1,168:1,169:1,170:1,171:1,172:1,173:1,174:1,175:1,176:1,177:1,178:1,179:1,180:1,181:1,182:1,183:1,187:1,188:1,189:1,190:1,195:1,203:1}[e]

My question is: Why I am not able to understand the code even though I know basic Javascript?

3 Answers 3

5

The code you posted appears to be minified.

The original developer likely wrote more or less readable JavaScript code, but when they put it online they ran it through a minifier which removed all comments and unnecessary whitespaces and replaced all the names with single letters.

The usual reason for that is to improve the loading times of the website by reducing the size of the javascript files and making it slightly easier for the Javascript interpreter (but not for a human) to parse the code.

If you want to make at least a bit sense out of minified JS code, then it can help to run it through a javascript beautifier. You still won't get meaningful names, but it will add line-breaks and indentate which at least allows you to follow the structure of the code.

Sign up to request clarification or add additional context in comments.

Comments

3

Most of the webpages use minification and obfuscation to prevent people from understanding their code. A beautifier will not really work, because the variables and function names are changed too.

If you want to see some real world JS i would recomend to go to Github and inspect some projects.

1 Comment

+1 for recommending GitHub, but preventing people from reading your code is usually a secondary concern or no concern at all. It doesn't work anyway, because a prettyfier and a bit of manual search&replace can turn that code readable again. The primary reason is usually to improve loading times and reduce traffic costs.
2

You should use something like https://beautifier.io/ to make those snippets readable.

Also you'll learn more stuff doing something on your own, that's a better way to improve.

Reading someone else code is not trivial, especially if the code is not documented and var/functions naming is meaningless like in this code you posted

1 Comment

By the way, the developer tools of Chromium-based browsers has a JS pretty printer built in. It automatically asks you if you want to beautify minified code when you view it in the dev tools.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.