几个常见js问题整理

1.关于“+”和“-”中出现number类型时的转换

var a = ‘‘ + 3;   //尝试将3转化为字符串
var b = 4;
console.log(typeof a);
console.log(a+b);
console.log(a-b);   //尝试将字符串转化为number

var foo = "11"+2+"1"; //体会加一个字符串‘1‘ 和 减去一个字符串‘1‘的不同
console.log(foo);
console.log(typeof foo);

2.js数组去重的问题

很容易想到的办法

var arrayNum = [0, 0, 0, 1, 1, 3, 3, 4, 5, 6, 7];
var arr = new Array();
var  uniqArray = function (array) {
    var newArray = [];
    for (var i = 0; i < array.length; i++) {
        if (newArray.length != 0) {
            for (var m = 0; m < newArray.length; m++) {
                var repeatNum = false;
                if (array[i] == newArray[m]) {
                    repeatNum = true;
                    break;
                }
            }
            if (repeatNum == false) {
                newArray.push(array[i]);
            }
        }
        else {
            newArray.push(array[i]);
        }
    }
    return newArray;
};

时间复杂度是O(n^2)

优化后的代码:

var arrayNum = [0, 0, 0, 1, 1, 3, 3, 4, 5, 6, 7];
var testArray = function(arry) {
    var tempArray = [];
    for (var i = 0, l = arry.length; i < l; i++) {
        //使用数组的indexof方法来判断是否在temparray中找到当前元素的索引
        if (tempArray.indexOf(arry[i])===-1 && arry != ‘‘){
            tempArray.push(arry[i]);
        }
    }
    return tempArray;
}
console.log(testArray(arrayNum));

这时的时间复杂度是O(n)

3.js对象的简单使用

在js中没有class这样的关键字来声明对象,仅仅是通过function变量名首字母大写的方式,来与js函数做区别(js函数采用驼峰命名法)

function DongJia(ver){
    var defaultValue = 0.01;
    this.version = ver ? ver : defaultValue;
    this.getVersion = function(){
        return this.version;
    }
    this.setVersion = function(ver){
        this.version = ver ;
    }
}
var dongjia = new DongJia();
//没有默认值
console.log(dongjia.getVersion());
//使用set函数改变默认值
dongjia.setVersion(0.02);
console.log(dongjia.getVersion());
//有默认值,直接给version赋值
var dongjia2 = new DongJia(0.02);
console.log(dongjia2.getVersion());

4.js中对数组的clone

使用jquery进行对象的复制

jQuery.extend( [ deep ], target , object1 [, objectN... ] )

请根据前面语法部分所定义的参数名称查找对应的参数。

参数描述

deep 可选/Boolean类型指示是否深度合并对象,默认为false。如果该值为true,且多个对象的某个同名属性也都是对象,则该”属性对象”的属性也将进行合并。

target Object类型目标对象,其他对象的成员属性将被复制到该对象上。 object1 可选/Object类型第一个被合并的对象。

objectN 可选/Object类型第N个被合并的对象。

示例代码:

    var a = { k1: 1, k2: 2, k3: 3 };
    var b = {k4:4, k5:5};
    var c ;
    c=$.extend(a);           //将a对象复制到jquery对象上,并赋值给c
    console.log(‘------------‘);
    console.log(c === $);    //c对象指向的是$对象,所以结果true
    console.log(a === $);   // false
    console.log(‘------c------‘);
    console.log(c.k2);       //相当于$.k2
    console.log(‘------c------‘);
    console.log(c);
    //c.k2 = 777;
    console.log(‘------a------‘);
    console.log(a);
    console.log(‘------b------‘);
    console.log(b);
    console.log(‘------$------‘);
    console.log($);
    console.log($.k2);

结果:

看下面的一段代码:

    var d = $.extend({}, a)
    console.log(d);
    d.k2 = 3456;
    console.log(d);
    console.log(a);

结果为:

可以知道,jquery中extend()不是复制引用,而是创建了新的对象

注意事项:

该函数复制的对象属性包括方法在内。此外,还会复制对象继承自原型中的属性(JS内置的对象除外)。

参数deep的默认值为false,你可以为该参数明确指定true值,但不能明确指定false值。简而言之,第一个参数不能为false值。

如果参数为null或undefined,则该参数将被忽略。

如果只为$.extend()指定了一个参数,则意味着参数target被省略。此时,target就是jQuery对象本身。通过这种方式,我们可以为全局对象jQuery添加新的函数。

如果多个对象具有相同的属性,则后者会覆盖前者的属性值。

看下面一段代码对数组对象进行拷贝:

    var test = [1,2,34,];
    console.log(test);
    var contest= $.extend([],test);
    console.log(contest);
    contest.push(567);
    console.log(test);
    console.log(contest);

结果为:

5.js闭包场景的使用

        <ul>
            <li>你是我的1</li>
            <li>你是我的2</li>
            <li>你是我的3</li>
            <li>你是我的4</li>
            <li>你是我的5</li>
        </ul>
        <div id="content">
        </div>

场景的使用是当我点击li标签的时候,移除当前li标签,并且将li标签中的内容添加到下方的div标签中

完整的代码整理如下:

<script type="text/javascript">
    $(function() {
        var $liObj = $(‘li‘),
            conText;
        for (var i = 0, l = $liObj.length; i < l; i++) {
            (function(i) {
                $liObj.eq(i).on(‘click‘, function() {
                    conText = $(‘#content‘).text();
                    $(‘#content‘).html(conText + $liObj.eq(i).text());
                    $liObj.eq(i).remove();
                    return false;
                });
            })(i);
        }
    })
    </script>

经过测试可以实现所需要的功能。

时间: 2024-10-09 21:03:27

几个常见js问题整理的相关文章

常用js方法整理common.js

项目中常用js方法整理成了common.js var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data: data, dataType: 'json', success: ok, error: error }); } h.post = function (url, data, ok, error) { $.ajax({ url: url, data: data, type: 'post', data

CSS常见布局问题整理

实现div的水平居中和垂直居中 多元素水平居中 实现栅格化布局 1. 实现div的水平居中和垂直居中 实现效果: 这大概是最经典的一个题目了,所以放在第一个. 方法有好多, 一一列来 主要思路其实就是 使用position,相对父元素做绝对定位(设置百分比[由父元素宽高调节子元素大小]/设置margin和相对位置(确定宽高)) 使用flex属性 使用tranfrom做相对位移的调节 1) 只适用: 宽高已定 设置position: absolute(父元素记得设置: relative), 然后t

JS知识整理之 Call&amp;Apply方法

JavaScript中的函数也是对象,和其他JS对象一样也可以包含方法,其中Call和Apply就是其中比较重要的方法,可以用来间接的调用函数.这两个方法允许显式制定调用所需的this值,也就是说所有函数可以作为任何对象的方法来使用,哪怕这个函数不是那个对象的方法. Call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) Apply方法: 语法:apply([thisObj[,argArray]]) Call和Apply方法作用相同,但从以

常用js代码整理、收集

个人整理了一下个人常用到的一些js代码,以方便学习以及日后使用,或许有一些是个人之前从网上摘下来的,但是不记得是具体从哪里来的了,如果你看到有一段代码跟你的文章很相似甚至一样,请不要气愤,请告诉我,我必定加上版权链接. 清除输入框默然提示文字 1 <input type="text" name="word" value='请输入关键字' style="color:#ccc;" /> 2 <script> 3 /* 4 *清

不错的Nodejs或者JS资料整理

资料整理 Node.js官网 - 可以下载到Node.js以及查看官方文档 Node.js教程 - 菜鸟教程网 Javascript模块化编程(一):模块的写法 - 阮一峰老师的日志,很值得看 CommonJS官网 requireJS官网 - AMD规范在其中 seaJS官网 - CMD规范在其中 request模块 cheerio模块

js基础整理总结

变量和变量作用域 变量和函数声明提升定义 Var a=100; Function test(){ 这时候由于变量声明提升,a变量已经声明,值为undefined Console.log(a); Var a=10; } 字符串 数据类型检测方法:typeof() 函数用法 indexOf 获取索引值 charAt 根据索引值获取单个字符 concat连接字符串 subStr获取部分字符串 substring获取部分字符串 slice获取部分字符串 split(",")分割 join合并

LR常见问题解答(整理)

    LR常见问题整理 1.LoadRunner录制脚本时为什么不弹出IE浏览器? 当一台主机上安装多个浏览器时,LoadRunner录制脚本经常遇到不能打开浏览器的情况,可以用下面的方法来解决. LR11 无法弹出ie浏览器,或者ie已停止工作问题的解决方法汇总 . 1)系统属性,高级选项卡下,性能里面,单击设置按钮,修改数据执行保护为“只为关键windows程序和服务启用数据执行保护”,然后,重启: 上述方法我采用了第一个,重启后问题解决. 2)若果被测试系统在本机上,访问地址为:http

移动端前端笔记 — 遇到的常见JS与CSS问题及解决方法

笔者接触移动前端快一年了,特将平时的一些笔记整理出来,希望能够给需要的人一些小小的帮助.同时也由于笔者的水平有限,虽说都是笔者遇到过使用过的,但文中可能也会出现一些问题或不严谨的地方,望各位指出,不胜感激! 一. css部分 body如果设置height:100%;overflow:hidden是依然可以滑动的,如果需禁止,要再加一层div设置 height:100%加overflow:hidden(html,body加height:100%) ,这样元素超出body的高度也不能滑动了.或者同时

JS面向对象整理

有次面试的时候,面试官让我谈谈对面向对象的理解,让我一下蒙了,竟然不知道从哪里说起?自己都是在看完视频后,直接用面向对象写东西,也没有好好梳理,导致自己只会简单的用一下,却不会说.于是我就翻了翻<JavaScript高级程序设计>,对其进行整理了一下. 1.什么是对象 在ECMAScript中,对象就是一堆无序属性的集合,这些属性可以是基本值,也可以是别的对象和函数.所以我们也可以吧对象当成一组名值对,一个属性名对应一个值,值可以是数据或方法. 2.创建一个对象 (1)创建一个最简单的对象是通