zoukankan      html  css  js  c++  java
  • 前端小白凭什么杀进 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

     

  • 相关阅读:
    如何解决git上传文件出错[rejected] master -> master (fetch first) error: failed to push some refs to '
    git
    pytest自动化测试执行环境切换
    JS实现菜单栏折叠
    vue-highlightjs 代码高亮
    C# 动态调用http及 webservice服务
    API接口优化的几个方面
    Leetcode__1508. Range Sum of Sorted Subarray Sums
    Batch Normalization 以及 Pytorch的实现
    Pytorch Transformer 中 Position Embedding 的实现
  • 原文地址:https://www.cnblogs.com/Highdoudou/p/9761172.html
Copyright © 2011-2022 走看看