JavaScript相关方法总结

最新推荐文章于 2022-09-30 15:47:35 发布
最新推荐文章于 2022-09-30 15:47:35 发布
阅读量1k 收藏 2
点赞数 2
分类专栏： JavaScript学习 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_52476758/article/details/121244057
版权

JavaScript方法

  1. 以字符串的形式返回参数的类型

    function _typeof(value) {
    return (typeof(value)).toString();
}

  2. 以Boolean的形式返回第一个参数是否属于第二个参数对象的实例

    function _instanceof(left,right) {
    return Boolean(left instanceof right); 
}

  3. 以字符串的形式返回两个数字参数的拼接结果。

    function _splice(left,right) {
    return left+''+right;
}

  4. 返回数字参数的阶乘。

    function _factorial(number) {
    if(number<=1){
        return number;
    }else{
        return number*_factorial(number-1);
    }
}

  5. 要求返回数字参数的绝对值。

    function _abs(number) {
    if(number>=0){
        return number;
    }else{
        return -number;
    }
}

  6. 要求返回底数为第一个参数，幂为第二个参数的数值。

    function _pow(number,power) {
    return Math.pow(number,power);
}

  7. 返回数字参数的平方根。

    function _sqrt(number) {
    return Math.sqrt(number,2);
}

  8. 返回数字参数除以2的余数

    function _remainder(value) {
    return value%2;
}

  9. 以字符串的形式返回数字参数所对应的星期。

    function _getday(value) {
    return "星期"+['一','二','三','四','五','六','天'][value-1]
}

  10. 将数组参数中的数字从大到小进行排序并返回。

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

  11. 将字符串参数转换为大写字符串并返回。

    function _touppercase(string) {
    return string.toUpperCase();
}

  12. 以数组的形式输出对象各个属性的键名。

    function _keys(object) {
    return Object.keys(object);
}

  13. 将数字参数转换为对象的形式返回。

    function _numbertoobject(number) {
    // 方法一
    // return {number};
    // 方法二
    if(typeof number=='number'){
        return new Number(number);
    }
}

  14. 将字符串参数转换为对象的形式返回。

    function _stringtoobject(string) {
    // 方法一
    // return {string};
    // 方法二
    if(typeof string=='string'){
        return new String(string)
    }
    
}

  15. 去除参数字符串两端的空格并返回。

    function _trim(string) {
    return string.trim();
}

  16. 以字符串的形式输出时间戳参数所对应的"年-月-日"

    function _date(number) {
    let date=new Date(number);
    return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate();
}

  17. 返回数字参数的整数部分。

    function _int(value) {
    return parseInt(value);
}

  18. 将参数数组反转之后返回。

    function _reverse(array) {
    return array.reverse();
}

  19. 将参数数组转换为字符串输出

    function _join(array) {
    return array.join('');
}

  20. 找到数组参数中的最大值并返回。

    function _max(array) {
    return array.sort((a,b)=>b-a)[0];
}

  21. 以boolean的形式返回字符串参数中是否包含数字。

    function _search(string) {
    // return [...string].find(c=>String(c)||c==0)?true:false;
    return [...string].find(c=>Number(c))===0?false:true;
}

  22. 将第二个参数插入第一个参数数组的头部，并且以数组的形式返回

    function _unshift(array,value) {
    return array.unshift(value);
}

  23. 将第二个参数插入第一个参数数组的尾部，并且以数组的形式返回

    function _push(array,value) {
    return array.push(value);
}

  24. 要求以数字的形式返回第一个参数数组中第二个参数所在的首个索引值。
    注意：如果数组中不存在目标值，则返回-1。

    function _indexof(array,value) {
    return array.indexOf(value);
}

  25. 以数字的形式返回数字参数向下取整的结果。

    function _floor(number) {
    return Math.floor(number);
}

  26. 要求将整数参数反转之后输出

    function _reverse(number) {
    var n = number.toString(10).split('').reverse().join('')
    if(number > 0) return +n;
    return -parseInt(n)
}

  27. 以boolean的形式返回字符串首参中是否包含第二个参数。

    function _search(string,value) {
    return string.indexOf(value)==-1?false:true;
}

  28. 返回它的参数伪数组对象

    function getArguments (a,b,c) {
    return arguments;
}

  29. 使obj对象中fn函数返回该对象中a属性和b属性的和

    var obj = {
    a: 1,
    b: 2,
    fn: function(){
        return this.a+this.b;
    }
}

  30. 根据参数数组创建li元素。
    要求：

    • li元素的个数和数组的长度一样
    • li元素的内容是数组中的每个元素
    • 将创建的所有li元素插入到ul中
<html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <ul></ul>
    </body>
    <script type="text/javascript">
        function createLi(array){
             for(let i=0; i<array.length; i++){
             let li=document.createElement('li');
             let ul=document.getElementsByTagName('ul')[0]
                li.innerHTML=array[i];
                ul.appendChild(li) 
            }
        }
    </script>
</html>

  1. 根据id获取html模块中ul标签下第二个li元素并返回。

    function getLI(id){
    return document.getElementById(id);
}

  2. 将类为"box"的div元素内容修改为"欢迎来到牛客网"

    <html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <div class='box'></div>
    </body>
    <script type="text/javascript">
        function modifyText(){
            return document.getElementsByClassName('box')[0].innerHTML='欢迎来到牛客网';
            // document.querySelector('.box').innerHTML = "欢迎来到牛客网"
            // getElementsByClassName()  这个方法可以获得页面
        }
    </script>
</html>

  3. 要求在点击li元素的时候不触发ul的事件。 注意：需要自行获取li元素。

    <html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <ul>
            <li>nowcoder</li>
        </ul>
    </body>
    <script type="text/javascript">
         let li = document.getElementsByTagName('li')[0];
          li.onclick = function(e){
               if(window.event) window.event.cancelBubble = true;
               e.stopPropagation()
          }
    </script>
</html>

  4. 要求在点击id为"checkbox"的复选框时不会取消勾选状态。 注意：需要自行获取input元素。

    <html>    <head>        <meta charset=utf-8>    </head>    <body>        <form>            <label>牛客会陪伴大家</label>            <input id="checkbox" type="checkbox" checked />        </form>    </body>    <script type="text/javascript">        // 1        let input=document.getElementById('checkbox');        input.addEventListener('click',function(e){            e.preventDefault();        })        // 2        let input = document.getElementsByTagName("input")[0];        input.onclick = function(){            input.checked = true;        }        // 3        let input = document.getElementsByTagName("input")[0];        input.onclick = function(e){            e.preventDefault();        }    </script></html>

  5. 实现一个函数返回页面当前url

    window.location对象可不带 window 前缀书写。一些例子：

    • window.location.href 返回当前页面的 href (URL)
    • window.location.hostname 返回 web 主机的域名
    • window.location.pathname 返回当前页面的路径或文件名
    • window.location.protocol 返回使用的 web 协议（http: 或 https:）
    • window.location.assign 加载新文档
    function getUrlHref (){
    return location.href;
}

  6. 实现一个盒子的关闭按钮功能。
    要求：

    • 使类为"btn"的div元素中心点定位在类为"box"的div元素右上顶点
    • 使类为"btn"的div元素中内容"X"垂直水平居中
    • 点击"X"按钮可以使类为"box"的div元素隐藏
    <!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8>
        <style type="text/css">
            .box {
                width: 100px;
                height: 100px;
                border: solid 1px black;
                position:relative;
                
            }
            .btn{
                width: 20px;
                height: 20px;
                background-color: red;
                position:absolute;
                top:-10px; 
                right :-10px;
                text-align:center;
                line-height:20px;
                
            }
        </style>
    </head>
    <body>

        <div class='box'>
            <div class='btn'>X</div>
        </div>

        <script type="text/javascript">
            var btn = document.querySelector('.btn');
            var box = document.querySelector('.box');
            btn.onclick = function(){
               box.style.display='none';
                
            }
        </script>
    </body>
</html>
栀虞子
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Javascript中字符串相关常用的使用方法总结
11-09
本文主要针对Javascript中字符串相关常用的使用方法进行了总结
JavaScript基础知识及常用方法总结
10-22
JAVASCRIPT是AJAX技术中不可或缺的一部分，所以想学好AJAX以及现在流行的AJAX框架，学好JAVASCRIPT是最重要的，通过本篇文章给大家介绍javascript基础知识及常用方法总结，对js基础知识及常用方法相关知识感兴趣的...
牛客前端宝典——刷题 ##Day9
ztK63LrD的博客
08-02 354
牛客前端刷题，冲冲冲！！！
Js面试题（一）
莉莉的博客
09-11 4万+
1. javascript的typeof返回哪些数据类型. string,boolean,number,undefined,function,object 2. 例举3种强制类型转换和2种隐式类型转换? 强制（parseInt,parseFloat,number） 隐式（== ===） 3. split() join() 的区别 前者是将字符串切割成数组的形式，后者是将数组转换成字符串 4. 数组...
面试题1
qq_34758991的博客
03-26 4405
GitHub - Tonyhzw/FE-interview: 收集的前端面试题和答案 Skip to content Ignore Learn more
Javascript专项练习-选择题(更新中）
热门推荐
weixin_43545225的博客
04-19 4万+
编程语言-Javascript专项练习 1. 以下语句的执行结果是什么？ console.log('one'); setTimeout(function(){ console.log('two'); },0); console.log('three'); console.log('four'); 答案：“one” “three” “four” “two” 解析：回调时，被回调的函数会被放在e...
前端歌谣的刷题之路-第二十三题-检测复杂数据类型
geyaoisnice的博客
07-04 95
面试
.net与javascript脚本的交互方法总结
09-04
首先，页面类需要继承 `ICallbackEventHandler` 接口并实现相关方法： ```csharp public partial class _Default : System.Web.UI.Page, ICallbackEventHandler { // 实现接口方法... } ``` 在客户端，定义 ...
JavaScript中日期的相关操作方法总结
10-23
主要介绍了JavaScript中日期的相关操作方法总结,是JS入门学习中的基础知识,需要的朋友可以参考下
JavaScript对象创建总结
04-15
javascript对象创建方法总结，通过这些方法的总结，可以对对象有了更深一步的了解，也加深了对对象的巩固认识。
Java基础面试题
zwz1202的专栏
04-09 7238
1、面向对象的特征有哪些方面   1.抽象： 抽象就是忽略一个主题中与当前目标无关的那些方面，以便更充分地注意与当前目标有关的方面。抽象并不打算了解全部问题，而只是选择其中的一部分，暂时不用部分细节。抽象包括两个方面，一是过程抽象，二是数据抽象。 2.继承： 继承是一种联结类的层次模型，并且允许和鼓励类的重用，它提供了一种明确表述共性的方法。对象的一个新类可以从现有的类中派生，这个过程称为
Python学习11--面向对象
溪云阁
05-25 292
一、面向过程和面向对象 面向过程：程序里面有大量的函数，每一个环节都是进行函数的调用。编程思想是按照执行时从头到尾的顺序来进行编程的 面向对象：根据需求，划分不同的对象，将对象划分成若干个类，以对象的方式来进行方法或者行为 的调用，不是以函数为单位，而是以对象为单位。 举例说明：编写一个实现请假功能的代码块，大致流程为：员工请假—领导审批—人事记录 1、以面向过程的思想编程： 定义以下函数执行，伪代码如下： def 请假（员工，领导） pass def 撤销请假流程（员工，领导） pass def 审
Python:程序读入应该表示星期几的数字（1~7），输出对应的星期字符串名称（源码+效果图）
qq_46468611的博客
09-28 1万+
源码： weekstr = "星期一星期二星期三星期四星期五星期六星期日" x = eval(input("请输入星期数字（1-7）：")) pos = 3*(x-1) op = weekstr[pos:pos+3] print(op) 效果图：
读入一个表示星期几的数字(1-7)，输出对应的星期字符串名称。例如：输入3，返回“星期三”。
hnjzsyjyj的专栏
11-21 1万+
【算法代码】 weekstr = "星期一星期二星期三星期四星期五星期六星期日" weekid = eval(input("请输入星期数字(1-7): ")) pos = (weekid - 1)*3 print(weekstr[pos: pos+3])
Python内置函数issubclass和isinstance的区别和用法
m0_56312629的博客
04-30 835
一、issubclass 判断两个类是否属于同一个类或者有继承关系，如果是这两种情况的话就返回True。 class A: pass class B(A): pass print(issubclass(B,A)) print(issubclass(A,A)) print(issubclass(A,B)) #注意是判断第一个参数是否为第二个参数的子类或者同一个，这个是有顺序的 二、isinstance 判断一个实例是否为另一个类或者子类的实例。 class A: pas
WEB面试题（2）
qq_40041509的博客
10-25 4368
JS交互 问题汇总 1.JS中能够实现跟服务器后台交互的手段有哪些? Asynchronous Javascript And XML js的异步请求对象 script标签的src属性 location.href, assign replace, window.open() , background-image:url("") , form表单 , 超链接 跳转到服务器程序 , img 的src属性 , video和audio 的src属性 , link的href , iframe(了解) form表单交互
TS第二个参数类型是根据第一个参数类型
herbsama的博客
09-30 1116
TS第二个参数类型是根据第一个参数类型
点击jq动态生成的li不触发点击事件
qq_38257857的博客
04-10 1357
参考：https://blog.csdn.net/sinat_38737592/article/details/89786896 动态生成代码（给ul中追加li）： $('.chat_left').append('<li class="chat_'+from_uid+'" data-block="'+from_uid+'"><a href="javascript:">...
解决内层<li>触发外层<li>设置的事件
doudou_demo的专栏
08-28 5117
这个问题说的专业一点就是jquery、js的冒泡事件，上网搜了老半天才搞好 比如：<ul id="ul1"> <li>列表一 <ul id="ul2"> <li><a href="" target="iframe">功能一</a></li> <li><a href="" target="iframe">功能二</a></li> </ul> </li> <li>
JavaScript 函数作用域的相关知识点有哪些？
最新发布
09-12
JavaScript 中的函数作用域包括以下内容： 1. 全局作用域：在 JavaScript 代码的最外层定义的变量和函数属于全局作用域。 2. 函数作用域：在函数内部定义的变量和函数属于函数作用域，并不能在函数外部访问。 3. 块级作用域：在 ES6 中，使用 let 和 const 关键字定义的变量具有块级作用域。这意味着它们的作用范围仅限于所在代码块。 4. 作用域链：JavaScript 通过作用域链来实现词法作用域，即内部作用域可以访问外部作用域的变量和函数，但是外部作用域不能访问内部作用域的变量。 5. 闭包：闭包是指有权访问另一个函数作用域中的变量的函数。闭包可以帮助我们实现一些有趣的功能，例如封装变量和函数。 这些是 JavaScript 中函数作用域相关的一些基本概念。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值