自学前端,立贴见证.

python_live · 发表于 2020-7-30 11:13:02

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

一直在思考要不要开一个贴子记录学习的历程,顺便监督自己.

看了不少人一直在更新,也一直在坚持.

思来想去,就地开一贴,记录一下自学的过程.

每天早上5点起床,骑我的小电炉赶去图书馆,八点半开门,但是要排队.

每天为了争取到好充电的位置,真的是很拼命了.

目前html5和css3刚刚学完,从零入门javascript

就从这里开始记起来,每天晚上睡觉前,写下今天所学的东西和感悟.

希望自己能坚持下去,做一个出色的程序媛!!

python_live · 发表于 2020-7-30 22:13:08

今天总算弄明白一点递归了,

其实,感觉递归函数和for循环很相似,

区别在于,递归函数可以一直调用自身.

如果不设置一个临界值的话,就会陷入死循环.

第二,触发点击事件

例如,点击一个按钮,改变某个div的样式.

<body>
    <input type="button" id="btn" value="按钮">
    <div id="box">
        AAAAA
    </div>
    <script>
        btn.onclick=function(){
            box.innerHTML='<h1>学习使我快乐!!</h1>'
        }
    </script>
</body>

第三.构造函数.

构造函数其实就是对象的模板,描述对象的基本结构.

可以生成多个对象,都有相同的结构.

<script>
        function Dog(name){  
             //名字首字母大写,以作区分
             //形参用来设置每个对象不同的地方
            this.name = name ;
             //this:指所有使用这个构造函数生成的对象,用来对多个对象生成相同部分
            //  this.xxx:用来定义一个参数
            this.wang = function(){
                // 构造函数内部也可以创建新的对象
                console.log(this.name+':汪汪')
            }
        }
        var xiaohei = new Dog('小黑')
        console.log(xiaohei)

        var xiaobai = new Dog('小白')
        console.log(xiaobai)

        xiaobai.wang()
    </script>

今天的记录到此结束,明天图书馆不开门,去游泳吧.

望再接再厉!!

python_live · 发表于 2020-7-30 22:14:15

好像代码块排版出了一点问题,应该是我选择了居中对齐吧
明天改过来

python_live · 发表于 2020-8-1 14:14:06

今天生病了,偏头疼,也没有去医院
就在家里休息了一会,现在好得多了
看看晚上能不能起来学学东西,
不想就这么浪费了一天

python_live · 发表于 2020-8-3 11:00:23

昨天右边的头又有点疼.....
晚上就直接休息了,今天晚上如果身体没有异常的话就会补上昨天的
现在的图书馆排队越来越早了
逼得我五点起床占位置,然后骑电车回家睡觉

python_live · 发表于 2020-8-3 20:42:37

电闪雷鸣,秋高气爽
实在是太爽了!!

前两天差点把我闷死.

了解了一下堆和栈值传递还有引用传递
数组的冒泡排序,以及sort排序

// 冒泡排序法
    var arr = [3,4,6,1,2,9,0,5,8,7]

    for(var i = 0; i<arr.length-1;i++){
        //运行多少轮,比长度少一个
        for(var j =0;j<arr.length-1-i;j++){
            //每一轮能确定一个数,减去一个i,可以提高计算效率
            if(arr[j]>arr[j+1]){
                //判断当前排序是否符合要求
                var t = arr[j]
                arr[j]= arr[j+1]
                arr[j+1]= t;
            }
        }
    }

//sort 排序法

    var btn = [3,6,9,8,2,1,4,5,0,7]

    btn.sort(function(a,b){
        return b - a;
    })

总结了一下,数组排序的核心思想

每当相邻的数比较后发现他们的排序与要求相反,就将他们互换

外面雨实在太大,这两天可能不回去图书馆了

有一说一,看外面电闪雷鸣实在太爽了
要是能多下几天就好了

python_live · 发表于 2020-8-5 20:31:35

昨天的课程,音频除了问题,耳朵差点报废.
稀里糊涂,在别的地方把坏掉的几节课补上了
1.浮点数精度

var t = parseFloat((0.2+0.2).toFixed(3))
        document.write(t)

具体原因就是计算机的二进制运算的问题
通过取浮点类型加保留小数位数来取得一个精确值

2.数组元素去重复

var arr = [1,2,3,4,4,3,2,1,5,6,6,7,8]

        for(var i = 0;i<arr.length;i++){
            //第一轮循环,从第一个数开始,与后面的所有数对比
            for(var j =i+1;j<arr.length;j++){
                //第二轮循环,从i+1开始与i对比
                if(arr[i] === arr[j]){
                    //判断是否有与i重复的数字
                    arr.splice(j,1)
                    //遇到与i重复的j,就删除掉一个
                    j--;
                    //在数组中,如果删除掉了一个数,剩下的数会自动补齐,此时会提换掉上一个被删除的数字,所以每一个位置,都要对比两次
                }
            }
        }
        console.log(arr)

登录/注册后可看大图

3.字符串的创建和方法

这个实在是有点多,但是跟数组比又简单太多,就不往这一点点粘贴了
回头有空了写到有道云上

今天出门想买牛奶,发现外面都已经淹了
水都到我膝盖了......

估计还得过两天才能去图书馆了
话说你们在家里学习效果好么
我感觉我老想睡觉,实在是有气无力
真想赶紧把javascript学完,这样我就能花一些时间去学python了
慢慢来吧

python_live · 发表于 2020-8-6 00:16:52

聊了一会天,顺便把今天的代码赶出来了
说自己懒看来还是不公正

直接放代码块吧

<script type="text/javascript">
        //字符串的创建与方法练习
                                
                    //slice : 从原字符串取出子字符串并返回,不改变原字符串
                                
                                        //1.第一个参数为开始,第二个参数为结束(不包括自己)
                                 
                                         console.log('javascript'.slice(0,4))
                                 
                                         //2.第二个参数不写,则一直取到最后
                                         
                                         console.log('javascript'.slice(4))
                                         
                                         //3.参数为负值时,从结尾开始数位置
                                         
                                         console.log('javascript'.slice(-6))
                                        console.log('javascript'.slice(0.-6))
                                        console.log('javascript'.slice(-2,-1))
                                        
                                        
                        //indexOf:确定一个字符串在另一个字符串中第一次出现的位置,返回值为开始第几的位数
//                                                        若返回-1,则表示没有这个元素

                                        var a = 'hello world'.indexOf('o')
                                        console.log(a);
                                        
                                        var b = 'javaScript'.indexOf('script')
                                        console.log(b)  //   -1   注意区分大小写
                        
                        //lastindexOf:跟indexOf相反,从后面开始匹配 
                        
                                        var c = 'hello world'.lastIndexOf('o')
                                        console.log(c)
                                        
                                        
                                        var d = 'hello world'.lastIndexOf('o',6)
                                        console.log(d)
                                        
                        
                        //trim :去除字符串两端的空格,返回新的字符串,不改变原字符串
                        
//                                        一般用时,都会要求改变原字符串,去除空格
                                        var str = ' hello world '
                                        str = str.trim()
                                        console.log(str)
                                        
//                                        去除单边的空格
//                                        trimleft()   trimright()
                                        
                                        
                        //toLowerCase / toUpperCase : 将一个字符串全部转换为小写或者大写,返回新的
//                                                                                                                字符串,不改变原字符串

                                        console.log('HEllo WorlD'.toLowerCase())
                                        console.log('HEllo WorlD'.toUpperCase())
                                        
                        
//                        split : 按照既定规则分割字符串,返回新字符串组成的数组
                                        
                                        var t = ('a|b|c'.split('|'))
                                        console.log(t)
                                        
                                        //如果规则为空的字符串,则将原字符串的每一个元素返回数组
                                        
                                        console.log('a|b|c'.split(''))
                                        
                                        //与数组中的join可以互相转化
                                        //将字符串用sort排序的方法
                                        var arr = '3,7,1,5,'
                                        console.log(arr.split(',').sort(function(a,b){
                                                //先将字符串转换为数组,再用sort排序
                                                return a - b;
                                        }).join(',')) //最后再转换为字符串返回
                                        
                                        
                        //replace : 替换匹配的字符串,一般只替换第一个(除带有g修饰符的正则表达式)
                                        console.log('aaa'.replace('a','b'))
                                        
                                        console.log('aaa'.replace(/a/g,'b'))
                                        
                                        //用replace消除敏感词
                                        var res = '你是垃圾吗,你是傻逼吗'
                                        //第一种:
                                        while(res.indexOf('垃圾') !== -1){
                                                res = res.replace('垃圾','**')
                                        }
                                        
                                        //第二种:
                                        console.log(res.replace(/傻逼/g,'**'))
                                        
                        </script>

控制台效果

登录/注册后可看大图

今天的作业还没写,又得拖到明天了

真想改改自己的拖延症

明天再想吧

python_live · 发表于 2020-8-7 21:17:07

今日份学习笔记

<script type="text/javascript">
                        
                        //新增的数组方法:
                        
                                //forEach: 遍历数组,回调函数,参数是一个函数
                                                var arr = [1,2,3,4,5,6,7]
                                                arr.forEach(function(value){
                                                        console.log(value)
                                                })
                                
                                
                                //map : 映射,把一个数组,按照一定规则,映射为另一个数组,不改变原数组
                                                var arr2 = [1,2,3,4,5,6,7]
                                                var res = arr2.map(function(v,i){
                                                        //return   后面写映射的规则
                                                        return  v+0.5
                                                })
                                                console.log(res) 
                                                
                                                
                                //filter : 过滤,搜索 参数是一个函数,参数会被执行多次,每次都会拿到一个返回值
                                                        //当返回值等于true 当前元素加到新数组
                                                var arr3 = [1,2,3,4,5,6,7]
                                                var res2 = arr3.filter(function(v){
                                                        return v>0;
                                                        //所有满足return的元素加到新数组res2
                                                })
                                                console.log(res2)
                                                        //过滤,搜索  对象
                                                var arr5 = [{name:'张三',age:19},{name:'李四',age:18},{name:'王麻子',age:20}]
                                                //删选出所以年龄大于19岁的对象
                                                var arr5 = arr5.filter(function(v){
                                                        //return v.age>19
                                                        return v.name.indexOf('张')!==-1
                                                        //查找所有name包含'张'的对象    indexOf()  !==1 : 包含括号里的
                                                })
                                                console.log(arr5)
                                                
                                //reduce : 累计求值,参数是一个函数,函数有两个参数
                                                //1.累积变量 ,默认为数组的第一个元素,  sum
                                                //2.当前变量,默认为数组的第二个元素,  v
                                                var arr4 = [1,2,3,4,5,6,7]
                                                var arr4 = arr4.reduce(function(sum,v){
                                                        return sum + v
                                                //return sum * v
                                                //return sum / v
                                                //return sum - v
                                                })
                                                //初始值可以不写,默认为第一个元素
                                                console.log(arr4)
                                                
                                //find : 查找,参数是一个函数,函数的返回值是查找条件
                                                var arr6 = [{name:'张三',age:19},{name:'李四',age:18},{name:'张三他爸',age:20}]
                                                var res3 = arr6.find(function(v){
                                                        return v.name = '张三他爸'
                                                })
                                                console.log(res3)
                                                
                                //findIndex : 找到满足条件的元素的下标,找到的:-1
                                var arr7= [{name:'张三',age:19},{name:'李四',age:18},{name:'张三他爸',age:20}]
                                                var res4 = arr7.findIndex(function(v,i){
                                                        return v.name == '李四'
                                                        //必须是两个 ==  
                                                })
                                                var res5 = arr7.findIndex(function(v,i){
                                                        return v.age == '30'
                                                        // 必须是两个 == 
                                                })
                                                console.log(res4)
                                                console.log(res5)
                                                
                                //some : 判断数组中是否有一些元素满足条件 及果实true 说明至少有一个满足条件
                                                var arr8= [{name:'张三',age:19},{name:'李四',age:18},{name:'张三他爸',age:20}]
                                                var flag = arr8.some(function(v){
                                                        return v.age >=18
                                                        //判断是否至少有一个age大于18,有一个结果就为true
                                                })
                                                
                                                var flag2 = arr8.some(function(v){
                                                        return v.name == '王二麻子'
                                                })
                                                console.log(flag)
                                                console.log(flag2)
                                                
                                //every : 判断数组中是否所有的元素都满足条件
                                                var arr9= [{name:'张三',age:19},{name:'李四',age:18},{name:'张三他爸',age:20}]
                                                var flag3 = arr9.every(function(v){
                                                        return v.age>15
                                                })
                                                console.log(flag3)
                                                
                                                var flag4 = arr9.every(function(v){
                                                        return v.age>21
                                                })
                                                console.log(flag4)
                                                
                </script>

效果图:

登录/注册后可看大图

有没有大神教教我消除敏感词的函数

python_live · 发表于 2020-8-10 07:00:31

敏感词学会了留言加敏感词

敏感词:

function print(str){
                                var arr = ['sb','nt','fw']
                                for(var v of arr){
                                        while(str.indexOf(v)!==-1){
                                                str = str.replace(v,'**')
                                        }
                                }
                                return str;
                        }

留言框:

btn.onclick=function(){ //按钮点击事件
            var str = ipt.value;
            //首先获取输入框的值
            var nar = `<li>${str}</li>`
            //接着把值拼成<li>
            list.innerHTML=list.innerHTML+nar
            //获取<ul>的值并把拼的<li>加进去
            ipt.value=''
            //把输入框的值清空,以便重新输入
        }

只需要把封装好的敏感词的函数调用一下:
str=print(str)

python_live · 发表于 2020-8-10 15:29:12

//深拷贝练习
        function deepCopy(obj){
                var o = {}
                //新建一个空的对象用作返回值
                for(var prop in obj){
                        if(typeof obj[prop] == 'object'){
                                //如果形参中有嵌套的对象 ,就必须要再次遍历,否则
                                //就会形成浅拷贝,利用递归调用自身即可
                                var tes = deepCopy(obj[prop])
                                //从新调用自身,再对obj含有嵌套对象的值进行遍历
                                //并赋值给新变量
                                o[prop] = tes
                                //把值赋给空对象o
                        }else{
                                o[prop] = obj[prop]
                                //如果没有嵌套的对象 直接把值赋值给空对象o
                        }
                }
                return o; 
                //返回值为空对象o,调用时只需要重新赋值即可.
                //例: var str = deepCopy(obj)
                //console.log(str)
        }

python_live · 发表于 2020-8-15 12:25:11

学习的劲头总是一逝而过
自制力太弱的我总是被生活的琐事影响
几天才能学完一天的课程
怎么样才能提高自己的学习自制力呢
这个帖子只有我在默默地更下去

python_live · 发表于 2020-8-17 08:52:03

Date:

//获取当前时间
        var time = new Date()
        console.log(time)

        //获取时间戳
        var times =new Date().getTime()
        //console.log(newtime.getTime())
        console.log(times)

        //返回对应时间(时间戳`时间实例,转换)
        var tt = new Date(1597207295532)
        var ttt = new Date('2020-8-12')
        console.log(tt)
        console.log(ttt)

        //日期计算:
        var newtime = new Date()//当前时间
        var oldtime = new Date(1597207295532)//旧时间
        console.log(Math.abs(newtime.getTime() - oldtime.getTime())/1000/60)

        //日期处理:
        //一个月中的某一天(1-31)
        console.log(newtime.getDate())
        //一周中的某一天(0-6) 0:周日
        console.log(newtime.getDay())
        //月份(0-11)
        console.log(newtime.getMonth())
        //四位数的年份
        console.log(newtime.getFullYear())
        //当前小时(0-23)
        console.log(newtime.getHours())
        //当前分钟(0-59)
        console.log(newtime.getMinutes())
        //当前秒(0-59)
        console.log(newtime.getSeconds())
        //1970.1.1至今的毫秒数
        console.log(newtime.getTime())

        //日期的修改
        // 将get转换为set即可对应修改
        console.log(newtime.setMonth(5))
        
        //这些参数如果超过了正常范围,会自动折算
        var day = new Date(2020,1,1)
        day.setDate(day.getDate()+10)
        console.log(day)

python_live · 发表于 2020-8-17 08:52:41

Date补充:

  //创建指定时间对象
        var str = new Date("2020,8,15 12:33:00")
        console.log(str)

        //获取当前时间戳
        var time = Date.now()
        console.log(time)
        //时间戳的日期转换
        console.log(time/1000/60/60/24)
        //1970年到今天的天数

        //利用时间戳计算程序运行的时间
        var start = Date.now()
        for(var i = 0;i<100;i++){
            console.log('哈啊哈哈')
        }
        var end = Date.now()
        console.log('运行了:'+(end-start)+'毫秒')

        //比较两个时间的大小
        var today, someday, text;
        today = new Date();
        someday = new Date();
        someday.setFullYear(2049, 0, 16);

        if (someday > today) {
        text = "今天在 2049 年 1 月 16 日之前";
        } else {
        text = "今天在 2049 年 1 月 16 日之后";
        }
        document.getElementById("demo").innerHTML = text;

python_live · 发表于 2020-8-17 08:53:40

定时器与延时器

 //定时器与延时器
                        setInterval(function(){
                                console.log('每隔两秒执行一次')
                        },2000)
                        setTimeout(function(){
                                console.log('计时3秒,只执行一次')
                        },3000)

加油~~~~ · 发表于 2020-8-24 15:14:50

加油~

braga · 发表于 2020-9-2 20:35:55

想找个小伙伴监督我救救孩子吧

Loutus · 发表于 2020-10-16 20:10:03

python_live 发表于 2020-8-10 07:00
敏感词学会了留言加敏感词

敏感词:

敏感词过滤可以这么写

function filter(str) {
        var arr = ['sb', 'nt', 'fw']
        var reg = new RegExp(arr.join('|'), 'ig')
        return str.replace(reg, '**')
}

樱与酒 · 发表于 2021-2-18 08:44:54

还在更新嘛

python_live · 发表于 2021-2-22 08:36:20

樱与酒发表于 2021-2-18 08:44
还在更新嘛

因为我现在在培训班学习了所以没有更新了没有时间

账号		自动登录	找回密码
密码			立即注册

[见证历程] 自学前端,立贴见证.

马上注册，结交更多好友，享用更多功能^_^