JavaScript相关方法总结

最新推荐文章于 2024-06-14 11:01:38 发布
最新推荐文章于 2024-06-14 11:01:38 发布
阅读量22 收藏
点赞数
分类专栏： JS 文章标签： javascript
原文链接：https://blog.csdn.net/qq_52476758/article/details/121244057#comments_24911717
版权

JavaScript方法

  1. 以字符串的形式返回参数的类型
function _typeof(value) {
    return (typeof(value)).toString();
}
  1. 以Boolean的形式返回第一个参数是否属于第二个参数对象的实例
function _instanceof(left,right) {
    return Boolean(left instanceof right); 
}
  1. 以字符串的形式返回两个数字参数的拼接结果。
function _splice(left,right) {
    return left+''+right;
}
  1. 返回数字参数的阶乘。
function _factorial(number) {
    if(number<=1){
        return number;
    }else{
        return number*_factorial(number-1);
    }
}
  1. 要求返回数字参数的绝对值。
function _abs(number) {
    if(number>=0){
        return number;
    }else{
        return -number;
    }
}
  1. 要求返回底数为第一个参数，幂为第二个参数的数值。
function _pow(number,power) {
    return Math.pow(number,power);
}
  1. 返回数字参数的平方根。
function _sqrt(number) {
    return Math.sqrt(number,2);
}
  1. 返回数字参数除以2的余数。
function _remainder(value) {
    return value%2;
}
  1. 以字符串的形式返回数字参数所对应的星期。
function _getday(value) {
    return "星期"+['一','二','三','四','五','六','天'][value-1]
}
  1. 将数组参数中的数字从大到小进行排序并返回。
function _sort(array) {
    return array.sort(function(a,b){return b-a});
}
  1. 将字符串参数转换为大写字符串并返回。
function _touppercase(string) {
    return string.toUpperCase();
}
  1. 以数组的形式输出对象各个属性的键名。
function _keys(object) {
    return Object.keys(object);
}
  1. 将数字参数转换为对象的形式返回。
function _numbertoobject(number) {
    // 方法一
    // return {number};
    // 方法二
    if(typeof number=='number'){
        return new Number(number);
    }
}
  1. 将字符串参数转换为对象的形式返回。
function _stringtoobject(string) {
    // 方法一
    // return {string};
    // 方法二
    if(typeof string=='string'){
        return new String(string)
    }
}
  1. 去除参数字符串两端的空格并返回。
function _trim(string) {
    return string.trim();
}
  1. 以字符串的形式输出时间戳参数所对应的"年-月-日"
function _date(number) {
    let date=new Date(number);
    return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate();
}
  1. 返回数字参数的整数部分。
function _int(value) {
    return parseInt(value);
}
  1. 将参数数组反转之后返回。
function _reverse(array) {
    return array.reverse();
}
  1. 将参数数组转换为字符串输出
function _join(array) {
    return array.join('');
}
  1. 找到数组参数中的最大值并返回。
function _max(array) {
    return array.sort((a,b)=>b-a)[0];
}
  1. 以boolean的形式返回字符串参数中是否包含数字。
function _search(string) {
    // return [...string].find(c=>String(c)||c==0)?true:false;
    return [...string].find(c=>Number(c))===0?false:true;
}
  1. 将第二个参数插入第一个参数数组的头部，并且以数组的形式返回
function _unshift(array,value) {
    return array.unshift(value);
}
  1. 将第二个参数插入第一个参数数组的尾部，并且以数组的形式返回
function _push(array,value) {
    return array.push(value);
}
  1. 要求以数字的形式返回第一个参数数组中第二个参数所在的首个索引值。
    注意：如果数组中不存在目标值，则返回-1。
function _indexof(array,value) {
    return array.indexOf(value);
}
  1. 以数字的形式返回数字参数向下取整的结果。
function _floor(number) {
    return Math.floor(number);
}
  1. 要求将整数参数反转之后输出
function _reverse(number) {
    var n = number.toString(10).split('').reverse().join('')
    if(number > 0) return +n;
    return -parseInt(n)
}
  1. 以boolean的形式返回字符串首参中是否包含第二个参数。
function _search(string,value) {
    return string.indexOf(value)==-1?false:true;
}
  1. 返回它的参数伪数组对象
function getArguments (a,b,c) {
    return arguments;
}
  1. 使obj对象中fn函数返回该对象中a属性和b属性的和
var obj = {
    a: 1,
    b: 2,
    fn: function(){
        return this.a+this.b;
    }
}
  1. 根据参数数组创建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);
}
  1. 将类为"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>
  1. 要求在点击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>
  1. 要求在点击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>
  1. 实现一个函数返回页面当前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;
}
  1. 实现一个盒子的关闭按钮功能。
    要求：
    • 使类为"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>
Yjing景
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
判断是否为数组的 JavaScript 方法总结
编程三昧
08-22 2160
前言 我们在日常开发中，常常有判断某值类型需求，今天我们总结一下常见的几种用来判断是否为数组的 JavaScript 方法。 Array.isArray Array.isArray() 是ES5新增的方法，用于确定传递的值是否是一个数组，如果是数组，则返回 true，否则返回 false。 let arr = []; console.log(Array.isArray(arr)); // true 下面的函数调用都返回 true： Array.isArray([]); Array.isArray([1.
html+css+javascript知识点总结
hholy124的博客
08-12 3108
html+css+javascript知识点总结
JavaScript基础知识全总结
热门推荐
June.1
04-11 8万+
JavaScript基础 浏览器说明 浏览器是指可以显示网页服务器或者文件系统的HTML文件内容，并让用户与这些文件交互的一种软件。 通俗的讲:可以显示页面的一个软件, 国内网民计算机上常见的网页浏览器有，QQ浏览器、Internet Explorer、Firefox、Safari，Opera、Google Chrome、百度浏览器、搜狗浏览器、猎豹浏览器、360浏览器、UC浏览器、傲游浏览器、世...
JavaScript实现网页截屏方法总结
前端开发博客
11-02 2864
>关注『前端开发博客』公众号，回复 加群 最近研究了下如何利用JavaScript实现网页截屏，包括在浏览器运行的JS，以及在后台运行的nodeJs的方法。主要看了以下几个： 1. PhantomJS 2. Puppeteer(chrome headless) 3. SlimerJS 4. dom-to-image 5. html2canvas 测试的网页使用了WebGL技术，所以下面的总结会和WebGL相关。 名词定义 ---- ##### headless browser 无...
Javascript知识点总结
赵宪福的博客
09-24 7772
JavaScript知识点整理 取消链接的默认行为： 得到从一个html页面到另外一个html界面传递过来的参数 方式一：var Ohref=window.location.href; alert(Ohref) //http://localhost:8080/route_list.html?cid=1 var arrhref=Ohref.split("?cid="); var cid= ar...
JavaScript-大小写转换方法总结
ZhanShenvsDiHuang的博客
04-22 2664
JavaScript-大小写转换方法总结
JavaScript基础知识总结 18：dom基本操作
学Java，找哪吒
09-27 4750
JavaScript精品教程系列，浅显易懂
JavaScript 基础笔记总结(全部)
IT_Holmes的博客
12-20 1万+
文章目录1.声明变量 var2.变量命名的规则3.数据类型以及注意事项4.代码注释5.其他类型转换为字符串6.数值类型转换7.布尔类型转换8.算数操作符9.一元运算符10.逻辑运算符11.比较运算符12.赋值运算符13.运算优先级14.流程控制15.JS中的数组15.1 数组格式15.2 获取数组中的元素15.3 遍历数组15.4 数组求和16. 函数16.1 函数的声明以及调用16.2 函数的形参和实参16.3 函数的返回值16.4 匿名函数16.5 函数做为参数16.6 函数作用域16.7 函数的作用域
JavaScript 数据劫持总结
come from h5
03-26 2625
数据劫持方法 最近空余时间复习了下JavaScript；做为学习总结 ！ 1、对象内自带的set和get方法数据劫持、 //首先我们先定义一个对象 let obj = { $name: "张三", get name(){ // 获取 name 属性时触发 //console.log("想要获取name属性"); return this.$name;// 想要让 obj 在获取name 属性时，拿到的值 }, set name(newVal)
Javascript底层原理总结
halations的博客
10-22 6115
Javascript底层原理、面试题、算法、浏览器、dom等相关
Javascript中字符串相关常用的使用方法总结
11-09
本文主要针对Javascript中字符串相关常用的使用方法进行了总结
JavaScript基础知识及常用方法总结
10-22
JAVASCRIPT是AJAX技术中不可或缺的一部分，所以想学好AJAX以及现在流行的AJAX框架，学好JAVASCRIPT是最重要的，通过本篇文章给大家介绍javascript基础知识及常用方法总结，对js基础知识及常用方法相关知识感兴趣的...
JavaScript中日期的相关操作方法总结
10-23
主要介绍了JavaScript中日期的相关操作方法总结,是JS入门学习中的基础知识,需要的朋友可以参考下
JavaScript对象创建总结
04-15
javascript对象创建方法总结，通过这些方法的总结，可以对对象有了更深一步的了解，也加深了对对象的巩固认识。
javascript 产生随机数的几种方法总结
10-19
主要介绍了javascript 产生随机数的几种方法总结的相关资料,希望通过本文大家能够掌握如何实现这样的方法，需要的朋友可以参考下
[Vue-常见错误]浏览器显示Uncaught runtime errors
一个喜欢什么都研究一下的小小后端程序员
06-09 407
在vue.config.js中配置关闭Uncaught runtime errors显示。
JS中一个dom元素能绑定多少事件
ggq53219的博客
06-10 572
在JavaScript中，一个DOM元素可以绑定的事件数量并没有明确的限制，这主要取决于浏览器的实现和内存限制。然而，在实际应用中，为同一个DOM元素绑定过多的事件监听器可能会导致性能问题，尤其是在事件处理函数执行复杂操作的情况下。总之，虽然JavaScript中DOM元素可以绑定的事件数量没有明确的限制，但在实际应用中应注意避免过度绑定和优化事件处理函数，以确保良好的性能和用户体验。
基于JavaScript 如何实现爬山算法以及优化方案
乐闻世界
06-10 1444
爬山算法（Hill Climbing Algorithm）是一种常见的启发式搜索算法，常用于解决优化问题。其核心思想是从一个初始状态出发，通过逐步选择使目标函数值增大的邻近状态来寻找最优解。接下来，我们将通过 JavaScript 实现一个简单的爬山算法，帮助大家理解其原理和应用。从一个初始状态开始。评估当前状态的目标函数值。在当前状态的邻居中选择一个目标函数值更大的状态。如果找到了更优的邻居，则移动到该邻居并重复步骤2和步骤3。如果没有更优的邻居，则算法结束，当前状态即为局部最优解。
HTML入门教程：深度解析HTML，开启你的前端技术之旅
最新发布
zhangwenok的博客
06-14 1292
HTML（HyperText Markup Language，超文本标记语言）是前端开发的基础，它负责构建网页的结构和内容。作为前端技术栈的基石，HTML的掌握程度直接影响到网页的开发效率和用户体验。本教程将带你从零开始，逐步深入了解HTML的各个方面，帮助你打下坚实的前端技术基础。HTML是一种用于创建网页的标准标记语言，它通过一系列的元素（elements）和标签（tags）来定义网页的结构和内容。HTML文档由一系列的元素组成，这些元素通过标签来标识。
JavaScript 函数作用域的相关知识点有哪些？
09-12
这些是 JavaScript 中函数作用域相关的一些基本概念。 ### 回答2： JavaScript 函数作用域的相关知识点有以下几点： 1. 作用域链：JavaScript 中的每个函数都有自己的作用域，在函数定义时会创建一个作用域链。...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值