前端小白凭什么杀进 BAT?

 

七天国庆黄金周转眼即逝,退散的除了出游的热情,还有一波求职热潮...
IT 行业的技术者,时常被称为“码农、IT民工” 虽然行业内巨大的人才需求和相对容易得到的高薪,在源源不断的吸引各路人马加入,但它依旧在全球最缺人的十大行业中位居榜首。

 

遇到很多小伙伴问我这样一个问题:
大学计算机技术相关专业 加上 IT 培训机构的输出,每年培养出来的技术人才加起来少数也有10多万,为什么还会有这么大的人才缺口呢?

首先,2017年的“一带一路”建设在为 IT 行业开拓新市场,打造新格局,信息化建设~~
其次,无人驾驶、AI智能、机器人搬运、无人超市、区块链、大数据 都在需求 IT 人才...

 

IT 技术应用已经渗透到社会的各行各业的各个角落;
21 世纪已经全面进入信息时代,IT 互联网缩短了我们与世界的距离;
不管你是选择出游,还是宅在家里煲剧,都离不开互联网;
企业都会创建官网,建立数据库,存储用户信息、企业信息等;
这些就是职位需求。

 

言归正传,JavaScript 到底在 IT 行业里面是什么呢?我们要怎么去学习它呢?
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习。

案例代码:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        #box{
            width: 100px;
            height: 100px;
            background: #f00;
            position: absolute;
            left: 0;
            top: 100px;
        }
    </style>
</head>
<body>
    <div id="box"></div>
    <script>
        // function move( obj,attr,target,duration,callback ){
        //  var b = parseInt(getComputedStyle(obj)[attr]);
        //  var c = target - b; 
        //  var d = duration;
        //  var temp = new Date().getTime();
        //  var timer = setInterval( function(){
        //      var t = new Date().getTime()-temp;
        //      if( t >= d ){
        //          clearInterval( timer );
        //          t = d;
        //      }
        //      var v = c/d*t+b ;
        //      obj.style[attr] = v + "px";
        //      if( t === d ){
        //          typeof callback === "function" && callback();
        //      }
        //  },20 )
        // }
        var box = document.getElementById( 'box' );
        // move( box,"width",200,500,()=>{
        //  move( box,"height",300,500,()=>{
        //      move( box,"left",300,500,()=>{
        //          move( box,"top",200,500)
        //      })
        //  })
        // } )

        function movePromise( obj,attr,target,duration ){
            return new Promise( (res,rej)=>{
                var b = parseInt(getComputedStyle(obj)[attr]);
                var c = target - b; 
                var d = duration;
                var temp = new Date().getTime();
                var timer = setInterval( function(){
                    var t = new Date().getTime()-temp;
                    if( t >= d ){
                        clearInterval( timer );
                        t = d;
                    }
                    var v = c/d*t+b ;
                    obj.style[attr] = v + "px";
                    if( t === d ){
                        res()
                    }
                },20 )
            } )
        }
        movePromise( box,"width",200,500 )
        .then( ()=>movePromise( box,"height",300,1000 ) )
        .then( ()=>movePromise( box,"left",300,1000 ) )
        .then( ()=>movePromise( box,"top",200,1000 ) )
        .then( ()=>console.log( "done" ) )
    </script>
</body>
</html>

学习路径:

JavaScript热身运动、JS入门教程
1-JS热身运动-上
2-JS热身运动-下

属性操作、图片切换、短信发送模拟
1-HTML属性操作
2-属性操作实例
3-属性操作注意事项
4-属性操作注意事项
5-属性操作注意事项
6-条件判断
7-数组应用及实例应用
8-图片切换及函数合并
9-图片切换扩展及模拟短信作业

for应用、自动生成、this关键字
1-动态方法:ByTagName()
2-ByTagName动态方法特性
3-初识for循环
4-for循环执行顺序
5-for应用:选取、生成、性能
6-for循环生成坐标
7-for循环遍历2维数组、嵌套元素
8-cssText文本格式化与属性操作
9-综合实例:生成一组新闻及思路分析
10-this指向及this应用

自定义属性、索引值
1-自定义属性、自定义一组开关应用
2-获取自身递增数字及匹配数组内容
3-添加索引值、匹配数组、HTML元素
4-图片切换综合实例1:布局
5-图片切换综合实例2:数据与初始化
6-图片切换实例3:2种图片切换思路
7-图片切换实例4:代码简化函数合并
8-QQ菜单实例1:实现折叠与展开
9-QQ菜单实例2:实现点击高亮显示、3道作业要求

JS数据类型、类型转换
1-JS数据类型及相关操作
2-数据类型转换-Number
3-parseInt与parseFloat的区别及小技巧
4-JS中稀奇古怪的隐式类型转换
5-isNaN应用实例
6-数据类型转换所对应的小练习说明

函数传参、重用、价格计算
1-函数传参、参数类型
2-传参应用:类型判断及多组图片切换实例
3-传参实例:商品价格计算及4道课后小练习

作用域、JS预解析机制
1-JS作用域概念-预解析规则、表达式
2-全局与局部作用域解析、作用域链
3-调用局部数据、全局声明、for嵌套函数中i取值

运算符、流程控制
1-运算符、程序流程控制(上)
2-运算符、程序流程控制(下)

return、定时器基础
1-函数返回值-return详解及应用
2-arguments实参集合与局部变量、参数关系
3-currentStyle与getComputedStyle应用
4-setInterval详解、定时器管理、背景选择实例
5-setTimeout详解、弹窗广告实例
6-定时器应用-自动切换焦点图、QQ延时菜单实例

定时器管理、函数封装
1-定时器管理-开关设置
2-函数封装的传参、判断处理
3-正负值的处理、添加回调函数
4-doMove应用-小练习
5-抖动原理及实现过程
6-抖的函数封装
7-抖函数的隐患、修复及练习

日期对象、时钟倒计时
1-系统时间对象
2-图片时钟实例
3-倒计时原理
4-倒计时实例-未添加定时器
5-倒计时实例-最终版、作业说明

字符串、查找高亮显示
1-字符串获取类、封装检测数字的方法
2-fromCharCode返回字符串实例、字符串加密
3-indexOf、lastIndexOf
4-比较类、截取类、substring应用实例
5-大小写转换、split分割字符串
6-split彩色文字效果实例
7-高亮显示关键字实例、替换搜索关键字实例
8-字符串方法总结、两道有趣的课后练习

Json、数组方法、随机函数、数组去重
1-json数据格式及json语法
2-for-in遍历json
3-数组定义及清空数组效率问题
4-数组4个小宝贝方法与技巧
5-splice方法、数组去重
6-sort排序
7-随机数及随机公式推理过程
8-concat、reverse、面试题及练习

以上内容可以让你对JS基础有一个全新的认识。
如果你拿不准自己是否处在JS基础阶段,不妨看看这里《你需要从JS基础开始学起吗》
做个测评:http://bbs.miaov.com/forum.php?mod=viewthread&tid=7524

 

原文地址:https://www.cnblogs.com/Highdoudou/p/9761172.html