Không hiểu tại sao array lại không push vào được

#1

Em định tạo một web site học từ vựng mà làm đến đây bị đứng. Mỗi lần thêm phần tử thì array lại reset lại từ đầu thay vì push thêm từ vựng vào mọi người giúp em với

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Nhựt Duy</title>
    <style>
        div#the{
            margin: auto;
            text-align: center;
        }
        table{
            text-align: center;
            margin: auto;
        }
        .tv {
            width: 100%;
            height: 50px;
            font-size: 180%;
            text-align: center;
        }
        .nhap{
            width: 50px;
            height: 50px;
        }
        .hoc{
            width: 100px;
            height: 50px;
        }
    </style>
    <script>
        window.onload = function(){
            var nhap = document.getElementById("nhap");
            nhap.onclick = xuly;
        }
        function xuly(){
            var tuvung = document.getElementById("tuvung").value;
            tuvung1 = [];
            tuvung1.push(tuvung);
            tuvung.value="";
        }
    </script>
</head>
<body>
    <div id="the">
        <h1>Học Từ Vựng</h1></br>
        <form>
            <table >
                <tr>
                    <td>
                        <input type="text" id="tuvung" class="tv"/>
                    </td>
                    <td>
                        <input type="button" id="nhap" value="Nhập" class="nhap"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="button" id="hoc" value="Học" class="hoc"/>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</body>
#2

Nhìn kĩ xem thấy vấn đề chưa bạn

1 Like
#3

thiếu rồi var tuvung1 = [];

#4

Hok đúng nếu không có var scope nó là gobal
bác @qloved đang nói vấn đề khác cơ :smiley:

1 Like
#5 
window.onload = function(){
    var nhap = document.getElementById("nhap");
    nhap.onclick = nhap;
}
function nhap(){
    var tuvung = document.getElementById("tuvung").value;
    var tuvung1 = [];
    tuvung1.push(tuvung);
    console.log(tuvung1);
    tuvung.value = "";
}

Mình sửa lại vẫn chưa được luôn @@

#6

Chính xác, cũng là ở dòng bạn kia nói nhưng vấn đề khác

1 Like
#7

Đơn giản vì nó không phải là vấn đề, và cách bạn sửa không phải là giải pháp, thậm chí nó còn làm vấn đề trầm trọng hơn, hay nói cách khác là đi ngược lại với cách làm đúng. Bạn thử nhìn kĩ lại dòng bạn vừa sửa xem có nhận ra vấn đề không. Nếu chưa hiểu thì mình sẽ giải thích sau

#8 
window.onload = function(){
    var nhap = document.getElementById("nhap");
    nhap.onclick = nhap;
}

var tuvung1 = [];
function nhap(){
    var tuvung = document.getElementById("tuvung").value;
    tuvung1.push(tuvung);
    console.log(tuvung1);
    tuvung.value = "";
}

muốn vậy bạn phải để [] ở ngoài chứ nhi?

1 Like
#9

Haiz mình vừa đọc cái global và local chỉ biết là tuvung mảng local, còn làm theo bạn ttn thì lần này có array nhưng không push vào được

#10

sao mình vẫn push đc nhỉ
https://codepen.io/notrealdev/pen/EENQyy

#11

Trong khi bác @qloved đang tập trung giải quyết vấn đề theo hướng sửa vào tư duy của bạn thớt thì bác @ttn lại cứ đâm đầu vào post code làm gì không biết @@, mà bác @ttn giải thích bằng code thì bạn kia cũng có hiểu đâu :((

#12

Vậy là mình vẫn chưa hiểu ý của bạn qloved, thật là mình mới bắt đầu học js à vẫn đang đọc headfirst javascript nên chưa có nhiều kiến thức. Mong được chỉ giáo

#13

thế thì mình cũng bó tay rồi :smiley_cat:

#14

Của bác ttn chạy được rồi cảm ơn nha, nhưng mình muốn biết ý của bạn qloved là như thế nào nữa

#15

ok, quay lại code ban đầu của bạn. Mình sẽ giải thích từng dòng code 1 cho bạn hiểu tại sao bạn lại sai logic ở đây.
Đoạn code bên dưới sẽ được chạy mỗi khi click vào button

tuvung1 = []; // tạo mới 1 bag chứa các item => vứt bỏ bag cũ => toàn bộ item cũ cũng sẽ biến mất.
tuvung1.push(tuvung); // bỏ item mới vào bag.

Do 2 dòng code trên chạy mỗi khi click cũng đồng nghĩa là mỗi lần bạn click thì bạn lại tạo 1 bag mới chứa các item rồi sau đó mới thêm phần tử vào bag mới này --> lúc nào cũng chỉ có 1 item.
Có 2 phương pháp để sửa vấn đề trên:

  • Cách 1: khai báo 1 biến global như bạn @ttn đã viết.
var tuvung1 = []; // tạo sẵn bag ở ngoài

function nhap(){
    ...
    tuvung1.push(tuvung); //có bag rồi, cứ sẵn mà dùng thôi
    ...
}
  • Cách 2: kiểm tra sự tồn tại của bag tuvung1 mỗi lần click.
function nhap(){
    ...
    if (!window.tuvung1){ 
    	tuvung1 = []; //opps, chưa tạo bag, tạo bag mới thôi
    }
    tuvung1.push(tuvung); //có bag rồi, cứ sẵn mà dùng thôi
    ...
}
3 Likes
#16

À ok ok đả hiểu, cảm ơn bác qloved và mọi người

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?